butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Look at digitalSourceType C2PA info

Browse source
This commit is contained in:
N-Pex 2025-07-11 14:36:58 +02:00
parent b7875944f1
commit 6b56fe61fa
9 changed files with 189 additions and 82 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/assets/css/sendattachments.scss
View file

@ -585,7 +585,15 @@ $hiliteColor: #4642f1;
font-size: 16px;
line-height: 125%;
letter-spacing: 0.4px;
vertical-align: middle;
display: flex;
align-items: center;
justify-content: space-between;
white-space: nowrap;
.v-icon {
flex: 0 0 24px;
width: 24px;
height: 24px;
}
}
.detail-subtitle {

51
src/assets/icons/ic_cr.vue
View file

@ -1,45 +1,16 @@
<template>
<svg
version="1.0"
id="katman_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px"
y="0px"
width="24px"
height="24px"
viewBox="0 0 841.89 595.28"
style="enable-background: new 0 0 841.89 595.28"
xml:space="preserve"
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g>
<g>
<path
class="st1"
d="M207.73,297.41c0-117.82,95.44-213.26,213.26-213.26c117.82,0,213.26,95.44,213.26,213.26v213.26H420.99
C303.17,510.67,207.73,415.23,207.73,297.41z"
/>
<path
class="st2"
d="M617.82,297.41v196.84H420.99c-108.77,0-196.84-88.07-196.84-196.84s88.07-196.84,196.84-196.84
S617.82,188.64,617.82,297.41z M182.97,297.41c0-131.38,106.63-238.01,238.01-238.01S659,166.03,659,297.41v238.01H420.99
C289.6,535.42,182.97,428.79,182.97,297.41z M277.7,306.93c0,49.03,33.08,90.45,85.68,90.45c43.32,0,72.59-28.56,79.73-65.93
h-42.84c-5.47,17.14-19.28,27.61-36.89,27.61c-26.66,0-44.03-20.95-44.03-52.12s17.38-52.12,44.03-52.12
c17.14,0,30.7,9.76,36.42,25.94h43.08c-7.62-36.42-36.65-64.26-79.5-64.26C310.55,216.49,277.7,257.9,277.7,306.93z
M500.48,221.25h-40.46v171.61h42.13v-89.49c0-16.9,4.76-27.85,12.85-34.75c7.14-6.43,16.42-9.76,31.66-9.76h10.71V219.1H546.9
c-22.14,0-36.89,8.09-46.41,20.47v-18.57V221.25z"
/>
</g>
<path
d="M2.55872 11.6957C2.55872 6.64866 6.63982 2.5603 11.6779 2.5603C16.716 2.5603 20.7971 6.64866 20.7971 11.6957V20.8311H11.6779C6.63982 20.8311 2.55872 16.7428 2.55872 11.6957Z"
fill="currentColor"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M20.0946 11.6956V20.1277H11.678C7.02685 20.1277 3.26089 16.355 3.26089 11.6956C3.26089 7.03625 7.02685 3.2636 11.678 3.2636C16.3291 3.2636 20.0946 7.03625 20.0946 11.6956ZM1.5 11.6956C1.5 6.06771 6.0596 1.5 11.6775 1.5C17.2955 1.5 21.8555 6.06771 21.8555 11.6956V21.8913H11.678C6.0596 21.8913 1.5 17.3236 1.5 11.6956ZM5.55074 12.1034C5.55074 14.2037 6.96527 15.978 9.2145 15.978C11.0669 15.978 12.3185 14.7546 12.6238 13.1538H10.792C10.558 13.888 9.96752 14.3365 9.2145 14.3365C8.07449 14.3365 7.33174 13.4391 7.33174 12.1039C7.33174 10.7686 8.07492 9.8712 9.2145 9.8712C9.94742 9.8712 10.5273 10.2893 10.7719 10.9824H12.614C12.2882 9.42227 11.0468 8.22969 9.2145 8.22969C6.95544 8.22926 5.55074 10.0031 5.55074 12.1034ZM15.077 8.43317H13.3469V15.7844H15.1484V11.9509C15.1484 11.227 15.352 10.7579 15.6979 10.4624C16.0032 10.1869 16.4 10.0443 17.0517 10.0443H17.5097V8.34107H17.062C16.1153 8.34107 15.4845 8.68762 15.0775 9.21794V8.42246V8.43317H15.077Z"
fill="#141414"
/>
</g>
</svg>
</template>
<style type="text/css" scoped>
.st1 {
fill: #ffffff;
}
.st2 {
fill-rule: evenodd;
clip-rule: evenodd;
fill: #141414;
}
</style>

14
src/assets/icons/ic_media_camera.vue Normal file
View file

@ -0,0 +1,14 @@
<template>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M2.92292 9.87757C3.0563 10.011 3.1298 10.1928 3.12652 10.3814L3.09485 12.1976C3.09157 12.3862 3.16506 12.5681 3.29845 12.7015C3.43184 12.8349 3.61372 12.9083 3.80236 12.9051L5.61849 12.8732C5.80709 12.87 5.98896 12.9434 6.12234 13.0768L7.50821 14.4628H7.50816C7.63863 14.5933 7.81556 14.6665 7.99998 14.6665C8.18441 14.6665 8.36134 14.5933 8.49181 14.4628L9.87768 13.0768H9.87763C10.011 12.9435 10.1929 12.87 10.3815 12.8732L12.1976 12.9049C12.3863 12.9082 12.5681 12.8348 12.7015 12.7013C12.8349 12.5679 12.9084 12.386 12.9051 12.1975L12.8733 10.3815C12.87 10.1929 12.9435 10.011 13.0769 9.8776L14.4629 8.4916C14.5933 8.36118 14.6666 8.18431 14.6666 7.99988C14.6666 7.81545 14.5933 7.63857 14.4629 7.50816L13.0769 6.12216C12.9435 5.98872 12.87 5.80689 12.8733 5.61825L12.905 3.80225C12.9082 3.61361 12.8348 3.43173 12.7014 3.29829C12.568 3.16491 12.3861 3.09141 12.1974 3.09469L10.3814 3.12641C10.1928 3.12969 10.0109 3.05626 9.8775 2.92281L8.49176 1.53695C8.36129 1.40648 8.18442 1.33325 7.99994 1.33325C7.81546 1.33325 7.63858 1.40648 7.50811 1.53695L6.12224 2.92281C5.9888 3.05625 5.80694 3.12969 5.61828 3.12641L3.80228 3.09469C3.61364 3.09141 3.43176 3.1649 3.29832 3.29829C3.16494 3.43173 3.09144 3.6136 3.09472 3.80225L3.12655 5.61825C3.12983 5.80689 3.05634 5.98872 2.92295 6.12216L1.53695 7.50816C1.40653 7.63858 1.33325 7.81545 1.33325 7.99988C1.33325 8.18431 1.40653 8.36119 1.53695 8.4916L2.92292 9.87757ZM5.52865 7.5285C5.6537 7.40356 5.82324 7.33334 6.00001 7.33334C6.17678 7.33334 6.34632 7.40355 6.47137 7.5285L7.33334 8.39053L9.52868 6.1952V6.19514C9.69794 6.03102 9.94128 5.96848 10.1687 6.03066C10.3961 6.0928 10.5738 6.2705 10.6359 6.4979C10.6981 6.72536 10.6355 6.96869 10.4714 7.1379L7.80472 9.80457C7.67966 9.92957 7.51013 9.99978 7.33336 9.99978C7.15658 9.99978 6.98705 9.92958 6.862 9.80457L5.52866 8.47124C5.40366 8.34619 5.33345 8.17665 5.33345 7.99988C5.33345 7.82305 5.40366 7.65352 5.52866 7.52848L5.52865 7.5285Z"
fill="currentColor"
fill-opacity="0.9"
/>
<path
d="M2.92292 9.87757C3.0563 10.011 3.1298 10.1928 3.12652 10.3814L3.09485 12.1976C3.09157 12.3862 3.16506 12.5681 3.29845 12.7015C3.43184 12.8349 3.61372 12.9083 3.80236 12.9051L5.61849 12.8732C5.80709 12.87 5.98896 12.9434 6.12234 13.0768L7.50821 14.4628H7.50816C7.63863 14.5933 7.81556 14.6665 7.99998 14.6665C8.18441 14.6665 8.36134 14.5933 8.49181 14.4628L9.87768 13.0768H9.87763C10.011 12.9435 10.1929 12.87 10.3815 12.8732L12.1976 12.9049C12.3863 12.9082 12.5681 12.8348 12.7015 12.7013C12.8349 12.5679 12.9084 12.386 12.9051 12.1975L12.8733 10.3815C12.87 10.1929 12.9435 10.011 13.0769 9.8776L14.4629 8.4916C14.5933 8.36118 14.6666 8.18431 14.6666 7.99988C14.6666 7.81545 14.5933 7.63857 14.4629 7.50816L13.0769 6.12216C12.9435 5.98872 12.87 5.80689 12.8733 5.61825L12.905 3.80225C12.9082 3.61361 12.8348 3.43173 12.7014 3.29829C12.568 3.16491 12.3861 3.09141 12.1974 3.09469L10.3814 3.12641C10.1928 3.12969 10.0109 3.05626 9.8775 2.92281L8.49176 1.53695C8.36129 1.40648 8.18442 1.33325 7.99994 1.33325C7.81546 1.33325 7.63858 1.40648 7.50811 1.53695L6.12224 2.92281C5.9888 3.05625 5.80694 3.12969 5.61828 3.12641L3.80228 3.09469C3.61364 3.09141 3.43176 3.1649 3.29832 3.29829C3.16494 3.43173 3.09144 3.6136 3.09472 3.80225L3.12655 5.61825C3.12983 5.80689 3.05634 5.98872 2.92295 6.12216L1.53695 7.50816C1.40653 7.63858 1.33325 7.81545 1.33325 7.99988C1.33325 8.18431 1.40653 8.36119 1.53695 8.4916L2.92292 9.87757ZM5.52865 7.5285C5.6537 7.40356 5.82324 7.33334 6.00001 7.33334C6.17678 7.33334 6.34632 7.40355 6.47137 7.5285L7.33334 8.39053L9.52868 6.1952V6.19514C9.69794 6.03102 9.94128 5.96848 10.1687 6.03066C10.3961 6.0928 10.5738 6.2705 10.6359 6.4979C10.6981 6.72536 10.6355 6.96869 10.4714 7.1379L7.80472 9.80457C7.67966 9.92957 7.51013 9.99978 7.33336 9.99978C7.15658 9.99978 6.98705 9.92958 6.862 9.80457L5.52866 8.47124C5.40366 8.34619 5.33345 8.17665 5.33345 7.99988C5.33345 7.82305 5.40366 7.65352 5.52866 7.52848L5.52865 7.5285Z"
fill="currentColor"
fill-opacity="0.9"
/>
</svg>
</template>

12
src/assets/icons/ic_media_device.vue Normal file
View file

@ -0,0 +1,12 @@
<template>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M9.99992 1.33325V2.26659C9.99992 2.63995 9.99992 2.82664 9.92726 2.96925C9.86334 3.09469 9.76135 3.19667 9.63591 3.26059C9.49331 3.33325 9.30662 3.33325 8.93325 3.33325H7.06659C6.69322 3.33325 6.50653 3.33325 6.36393 3.26059C6.23848 3.19667 6.1365 3.09469 6.07258 2.96925C5.99992 2.82664 5.99992 2.63995 5.99992 2.26659V1.33325M5.46659 14.6666H10.5333C11.28 14.6666 11.6534 14.6666 11.9386 14.5213C12.1895 14.3934 12.3934 14.1895 12.5213 13.9386C12.6666 13.6534 12.6666 13.28 12.6666 12.5333V3.46659C12.6666 2.71985 12.6666 2.34648 12.5213 2.06126C12.3934 1.81038 12.1895 1.60641 11.9386 1.47858C11.6534 1.33325 11.28 1.33325 10.5333 1.33325H5.46659C4.71985 1.33325 4.34648 1.33325 4.06126 1.47858C3.81038 1.60641 3.60641 1.81038 3.47858 2.06126C3.33325 2.34648 3.33325 2.71985 3.33325 3.46659V12.5333C3.33325 13.28 3.33325 13.6534 3.47858 13.9386C3.60641 14.1895 3.81038 14.3934 4.06126 14.5213C4.34648 14.6666 4.71985 14.6666 5.46659 14.6666Z"
stroke="currentColor"
stroke-opacity="0.9"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</template>

9
src/assets/icons/ic_media_flag.vue Normal file
View file

@ -0,0 +1,9 @@
<template>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M12.8 2C12.9105 2 13 2.08954 13 2.2V9.3C13 9.41046 12.9105 9.5 12.8 9.5H4.45C4.33954 9.5 4.25 9.58954 4.25 9.7V14.3C4.25 14.4105 4.16046 14.5 4.05 14.5H3.2C3.08954 14.5 3 14.4105 3 14.3V2.2C3 2.08954 3.08954 2 3.2 2H12.8Z"
fill="currentColor"
fill-opacity="0.9"
/>
</svg>
</template>

15
src/assets/icons/ic_media_screenshot.vue Normal file
View file

@ -0,0 +1,15 @@
<template>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M8 10.6667C9.47276 10.6667 10.6667 9.47276 10.6667 8C10.6667 6.52724 9.47276 5.33333 8 5.33333C6.52724 5.33333 5.33333 6.52724 5.33333 8C5.33333 9.47276 6.52724 10.6667 8 10.6667Z"
fill="currentColor"
/>
<path
d="M5.33333 2H4.13333C3.3866 2 3.01323 2 2.72801 2.14532C2.47713 2.27316 2.27316 2.47713 2.14532 2.72801C2 3.01323 2 3.3866 2 4.13333V5.33333M5.33333 14H4.13333C3.3866 14 3.01323 14 2.72801 13.8547C2.47713 13.7268 2.27316 13.5229 2.14532 13.272C2 12.9868 2 12.6134 2 11.8667V10.6667M14 5.33333V4.13333C14 3.3866 14 3.01323 13.8547 2.72801C13.7268 2.47713 13.5229 2.27316 13.272 2.14532C12.9868 2 12.6134 2 11.8667 2H10.6667M14 10.6667V11.8667C14 12.6134 14 12.9868 13.8547 13.272C13.7268 13.5229 13.5229 13.7268 13.272 13.8547C12.9868 14 12.6134 14 11.8667 14H10.6667M10.6667 8C10.6667 9.47276 9.47276 10.6667 8 10.6667C6.52724 10.6667 5.33333 9.47276 5.33333 8C5.33333 6.52724 6.52724 5.33333 8 5.33333C9.47276 5.33333 10.6667 6.52724 10.6667 8Z"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</template>

5
src/assets/translations/en.json
View file

@ -493,6 +493,9 @@
"content_credentials": "Content Credentials",
"content_credentials_info": "Source or history information is available for this media to be verified.",
"learn_more": "Learn more",
"ai_used": "AI was used in this media"
"ai_used": "Photo modified with AI",
"screenshot_taken_on": "Screenshot taken on {date}",
"captured_with_camera": "Captured with a camera",
"old_photo": "Photo older than 3 months"
}
}

138
src/components/content-credentials/C2PAInfo.vue
View file

@ -2,15 +2,30 @@
<div v-if="c2pa">
<div class="detail-title">
{{ t("file_mode.content_credentials") }}
<v-icon>$vuetify.icons.ic_cr</v-icon>
</div>
<div class="detail-subtitle">
{{ t("file_mode.content_credentials_info") }} <a href="https://proofmode.org/verify" target="_blank">{{ t("file_mode.learn_more") }}</a>
{{ t("file_mode.content_credentials_info") }}
<!-- <a href="" target="_blank">{{ t("file_mode.learn_more") }}</a> -->
</div>
<div class="detail-row" v-if="dateCreated"><v-icon>$vuetify.icons.ic_exif_time</v-icon>{{ dateCreated }}</div>
<div class="detail-row" v-if="creator"><v-icon>$vuetify.icons.ic_exif_device_camera</v-icon>{{ creator }}</div>
<div class="detail-row" v-if="aiInferenceResult?.aiGenerated">
<div class="detail-row" v-if="screenCapture">
<v-icon>$vuetify.icons.ic_media_screenshot</v-icon>{{ screenCapture }}
</div>
<template v-else>
<div class="detail-row" v-if="dateCreated">
<v-icon>$vuetify.icons.ic_exif_time</v-icon>{{ dateCreatedDisplay }}
</div>
<div class="detail-row" v-if="creator"><v-icon>$vuetify.icons.ic_media_device</v-icon>{{ creator }}</div>
<div class="detail-row" v-if="valid && cameraCapture">
<v-icon>$vuetify.icons.ic_media_camera</v-icon>{{ cameraCapture }}
</div>
</template>
<div class="detail-row" v-if="ai || aiInferenceResult?.aiGenerated">
<v-icon>$vuetify.icons.ic_cc_ai</v-icon>{{ t("file_mode.ai_used") }}
</div>
<div class="detail-row" v-if="showAgeWarning">
<v-icon>$vuetify.icons.ic_media_flag</v-icon>{{ t("file_mode.old_photo") }}
</div>
<!-- {{ JSON.stringify(props.c2pa, undefined, 4) }} -->
</div>
@ -18,9 +33,19 @@
<script setup lang="ts">
import { useI18n } from "vue-i18n";
import { AIInferenceResult, C2PAActionsAssertion, C2PAData } from "../../models/proof";
import { computed } from "vue";
import dayjs from "dayjs";
import {
AIInferenceResult,
C2PAActionsAssertion,
C2PAData,
C2PASourceTypeCompositeCapture,
C2PASourceTypeCompositeWithTrainedAlgorithmicMedia,
C2PASourceTypeComputationalCapture,
C2PASourceTypeDigitalCapture,
C2PASourceTypeScreenCapture,
C2PASourceTypeTrainedAlgorithmicMedia,
} from "../../models/proof";
import { computed, ref, Ref, watch } from "vue";
import dayjs, { Dayjs } from "dayjs";
const { t } = useI18n();
@ -29,45 +54,78 @@ const props = defineProps<{
aiInferenceResult?: AIInferenceResult;
}>();
const dateCreated = computed(() => {
try {
const manifests = Object.values(props.c2pa?.manifest_info.manifests ?? {});
for (const manifest of manifests) {
const createAssertion = manifest.assertions.find((a) => {
if (a.label === "c2pa.actions") {
const actions = (a.data as C2PAActionsAssertion)?.actions ?? [];
if (actions.find((a) => a.action === "c2pa.created")) {
return true;
//console.error("C2PA", JSON.stringify(props.c2pa, undefined, 4));
const creator: Ref<string | undefined> = ref(undefined);
const dateCreated: Ref<Dayjs | undefined> = ref(undefined);
const screenCapture: Ref<string | undefined> = ref(undefined);
const cameraCapture: Ref<string | undefined> = ref(undefined);
const ai: Ref<boolean> = ref(false);
const valid: Ref<boolean> = ref(false);
watch(
props,
() => {
creator.value = undefined;
dateCreated.value = undefined;
screenCapture.value = undefined;
cameraCapture.value = undefined;
ai.value = false;
valid.value = false;
try {
const manifests = Object.values(props.c2pa?.manifest_info.manifests ?? {});
for (const manifest of manifests) {
for (const assertion of manifest.assertions) {
if (assertion.label === "c2pa.actions") {
const actions = (assertion.data as C2PAActionsAssertion)?.actions ?? [];
const a = actions.find((a) => a.action === "c2pa.created");
if (a) {
creator.value = a.softwareAgent;
dateCreated.value = dayjs(Date.parse(manifest.signature_info.time));
if (a.digitalSourceType === C2PASourceTypeScreenCapture) {
screenCapture.value = t("file_mode.screenshot_taken_on", { date: dateCreated.value });
}
if (
a.digitalSourceType === C2PASourceTypeDigitalCapture ||
a.digitalSourceType === C2PASourceTypeComputationalCapture ||
a.digitalSourceType === C2PASourceTypeCompositeCapture
) {
cameraCapture.value = t("file_mode.captured_with_camera");
}
if (
a.digitalSourceType === C2PASourceTypeTrainedAlgorithmicMedia ||
a.digitalSourceType === C2PASourceTypeCompositeWithTrainedAlgorithmicMedia
) {
ai.value = true;
}
return;
}
}
}
return false;
});
if (createAssertion) {
const d = dayjs(Date.parse(manifest.signature_info.time));
return d.format("lll");
}
}
} catch (error) {}
let results = props.c2pa?.manifest_info.validation_results?.activeManifest;
if (results) {
valid.value = results.failure.length == 0 && results.success.length > 0;
}
} catch (error) {}
},
{ immediate: true }
);
const dateCreatedDisplay = computed(() => {
if (dateCreated.value) {
return dateCreated.value.format("lll");
}
return undefined;
});
const creator = computed(() => {
try {
const manifests = Object.values(props.c2pa?.manifest_info.manifests ?? {});
for (const manifest of manifests) {
for (const assertion of manifest.assertions) {
if (assertion.label === "c2pa.actions") {
const actions = (assertion.data as C2PAActionsAssertion)?.actions ?? [];
const a = actions.find((a) => a.action === "c2pa.created");
if (a) {
return a.softwareAgent;
}
}
return false;
}
}
} catch (error) {}
return undefined;
const showAgeWarning = computed(() => {
if (dateCreated.value) {
return dayjs().diff(dateCreated.value, "month") >= 3;
}
return false;
});
</script>

17
src/models/proof.ts
View file

@ -4,10 +4,18 @@ export type AIInferenceResult = {
humanProbability: number;
}
export const C2PASourceTypeScreenCapture = "http://cv.iptc.org/newscodes/digitalsourcetype/screenCapture";
export const C2PASourceTypeDigitalCapture = "http://cv.iptc.org/newscodes/digitalsourcetype/digitalCapture";
export const C2PASourceTypeComputationalCapture = "http://cv.iptc.org/newscodes/digitalsourcetype/computationalCapture";
export const C2PASourceTypeCompositeCapture = "http://cv.iptc.org/newscodes/digitalsourcetype/compositeCapture";
export const C2PASourceTypeTrainedAlgorithmicMedia = "http://cv.iptc.org/newscodes/digitalsourcetype/trainedAlgorithmicMedia";
export const C2PASourceTypeCompositeWithTrainedAlgorithmicMedia = "http://cv.iptc.org/newscodes/digitalsourcetype/compositeWithTrainedAlgorithmicMedia";
export type C2PAActionsAssertion = {
actions: {
action: string;
softwareAgent?: string;
digitalSourceType?: string;
}[];
}
@ -23,9 +31,18 @@ export type C2PAManifest = {
}
}
export type C2PAValidationResults = {
activeManifest?: {
failure: any[];
success: any[];
informational: any[];
}
}
export type C2PAManifestInfo = {
active_manifest: string;
manifests: {[key: string]: C2PAManifest};
validation_results?: C2PAValidationResults;
}
export type C2PAData = {