Merge pull request #272 from obulat/xmp_download

Author: zackkrida

src/App.vue

@@ -72,7 +72,6 @@ import { mapMutations } from 'vuex'
 import ChooserModal from './components/ChooserModal'
 import HelpSection from './components/HelpSection'
 import Stepper from './components/Stepper'
-import LicenseUseCard from './components/LicenseUseCard'
 import HeaderSection from './components/HeaderSection'
 import FooterSection from './components/FooterSection'
 import LicenseDetailsCard from './components/LicenseDetailsCard'
@@ -83,7 +82,7 @@ export default {
         HelpSection,
         Stepper,
         LicenseDetailsCard,
-        LicenseUseCard,
+        LicenseUseCard: () => import('@/components/LicenseUseCard'),
         HeaderSection,
         FooterSection,
         ChooserModal

src/components/CopyTools.vue

@@ -12,21 +12,18 @@
         >
             {{ copyLabel }}
         </v-button>
-        <v-button
-            v-else
-            class="donate small copy-button is-xmp"
-        >
-            {{ xmpLabel }}
-        </v-button>
+        <xmp-button v-if="clipboardTarget==='.xmp'" />
     </div>
 </template>
 
 <script>
 import CopyTypeSwitch from '@/components/CopyTypeSwitch'
 import Clipboard from 'clipboard'
+import XmpButton from '@/components/XmpButton'
+
 export default {
     name: 'CopyTools',
-    components: { CopyTypeSwitch },
+    components: { CopyTypeSwitch, XmpButton },
     props: {
         clipboardTarget: {
             type: String,

src/components/XmpButton.vue

@@ -0,0 +1,34 @@
+<template>
+    <a
+        ref="xmp"
+        class="button donate small copy-button is-xmp"
+        type="text/xml"
+        :href="xmpHref"
+        :download="xmpFilename"
+    >
+        {{ xmpLabel }}
+    </a>
+</template>
+
+<script>
+import { createXMP } from '@/utils/xmp'
+import { mapGetters } from 'vuex'
+
+export default {
+    name: 'XmpButton',
+    computed: {
+        ...mapGetters(['shortName']),
+        xmpLabel() { return this.$t('license-use.xmp-label') },
+        xmpFilename() {
+            return `${this.shortName}.xmp`
+        },
+        xmpHref() {
+            const shortName = this.$store.getters.shortName
+            const { workUrl, workTitle, creatorName } = this.$store.state.attributionDetails
+            const xmp = createXMP({ shortName, workUrl, workTitle, creatorName })
+            const xmpBlob = new Blob([xmp], { type: 'text/xml;charset=utf-8' })
+            return URL.createObjectURL(xmpBlob)
+        }
+    }
+}
+</script>

src/utils/xmp.js

@@ -0,0 +1,77 @@
+/* eslint-disable indent, quotes */
+import { LICENSES, licenseSlug } from '@/utils/license-utilities'
+
+/** The xmp metadata is structured in accordance with the Adobe XMP specifications from 2012:
+https://wwwimages2.adobe.com/content/dam/acom/en/devnet/xmp/pdfs/XMP%20SDK%20Release%20cc-2016-08/XMPSpecificationPart1.pdf
+
+The following data is written into the xmp file:
+
+xapRights:WebStatement: A Web URL for a statement of the ownership and usage rights for this resource.
+  Uses the value of the 'Link to Work' field from the Attribution details form.
+xapRights:Marked: Indicates that this is a public-domain or CC0 resource if false. Otherwise, one of the 6 CC licenses.
+xapRights:Owner: A list of legal owners of the resource.
+  Uses the value of the 'Creator of Work' field from the Attribution details form.
+xapRights:UsageTerms: A collection of text instructions on how a resource can be legally used, given in a variety of languages.
+  Uses license statement with the link to the license deed, with '<>"' characters escaped.
+dc:title:  A name or title given to the resource, by which it is formally known, given in various languages.
+  Uses the value of the 'Title of Work' field from the Attribution details form.
+cc:license: the link to the CC license deed.
+cc:attributionName
+ Uses the value of the 'Creator of Work' field from the Attribution details form.
+ */
+
+export const createXMP = ({ shortName, workUrl = '', workTitle = '', creatorName = '', lang = 'en-US' }) => {
+    const slug = licenseSlug(shortName).replace(/-/gi, '_').toUpperCase()
+
+    const licenseUrl = LICENSES[slug].URL
+    const licenseFullName = LICENSES[slug].FULL
+
+    const ccLicenseNotice = `This work is licensed under <a href="${licenseUrl}">${licenseFullName}</a>`
+        .replace(/</gi, '&lt;')
+        .replace(/>/gi, '&gt;')
+        .replace(/"/gi, '&#34;')
+
+    const isLicensed = shortName !== LICENSES.CC0.SHORT ? 'True' : 'False'
+
+    return (`<?xpacket begin='' id='W5M0MpCehiHzreSzNTczkc9d'?>
+<x:xmpmeta xmlns:x='adobe:ns:meta/'>
+    <rdf:RDF xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#'
+             xmlns:xapRights='http://ns.adobe.com/xap/1.0/rights/'
+             xmlns:cc='http://creativecommons.org/ns#'${workTitle
+            ? `xmlns:dc='http://purl.org/dc/elements/1.1/'`
+            : ''}>
+        <rdf:Description rdf:about=''>
+            ${`<xapRights:Marked>${isLicensed}</xapRights:Marked>`}${creatorName
+        ? `
+            <xapRights:Owner>
+                <rdf:Bag>
+                    <rdf:li>${creatorName}</rdf:li>
+                </rdf:Bag>
+            </xapRights:Owner>`
+        : ''}${workUrl
+        ? `
+            <xapRights:WebStatement rdf:resource='${workUrl}'/>`
+        : ''}
+            <xapRights:UsageTerms>
+                <rdf:Alt>
+                  <rdf:li xml:lang='x-default'>${ccLicenseNotice}</rdf:li>
+                  <rdf:li xml:lang='${lang}' >${ccLicenseNotice}</rdf:li>
+                </rdf:Alt>
+            </xapRights:UsageTerms>
+            <cc:license rdf:resource='${licenseUrl}'/>${creatorName
+            ? `
+            <cc:attributionName>${creatorName}</cc:attributionName>`
+            : ''}${workTitle
+                    ? `
+            <dc:title>
+                <rdf:Alt>
+                  <rdf:li xml:lang='x-default'>${workTitle}</rdf:li>
+                  <rdf:li xml:lang='${lang}'>${workTitle}</rdf:li>
+                </rdf:Alt>
+            </dc:title>`
+            : ''}
+        </rdf:Description>
+    </rdf:RDF>
+</x:xmpmeta>
+<?xpacket end='r'?>`)
+}