Updates to QR codes for individual page:
* Now a single include in indidvidual--foaf-person.ftl * Added QR icon and moved to tools area under individual image * Removed inline styles and refactored markup throughout
This commit is contained in:
parent
b14311e048
commit
8713552eb5
6 changed files with 164 additions and 154 deletions
23
productMods/css/individual/individual-qr.css
Normal file
23
productMods/css/individual/individual-qr.css
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
|
||||||
|
|
||||||
|
.qrCode {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
img.qrCode {
|
||||||
|
margin-bottom: 2em;
|
||||||
|
}
|
||||||
|
.vcard {
|
||||||
|
clear: left;
|
||||||
|
}
|
||||||
|
h2 em {
|
||||||
|
font-style: normal;
|
||||||
|
font-size: .7em;
|
||||||
|
}
|
||||||
|
section h4 {
|
||||||
|
margin-top: 2em;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
section textarea {
|
||||||
|
width: 600px;
|
||||||
|
height: 120px;
|
||||||
|
}
|
BIN
productMods/images/individual/qr_icon.png
Normal file
BIN
productMods/images/individual/qr_icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 194 B |
|
@ -2,37 +2,31 @@
|
||||||
|
|
||||||
<#-- Page providing options for disseminating QR codes -->
|
<#-- Page providing options for disseminating QR codes -->
|
||||||
|
|
||||||
<#include "individual-qrCodeFoafPerson.ftl">
|
<#include "individual-qrCodeGenerator.ftl">
|
||||||
|
|
||||||
<#assign qrCodeWidth = "150">
|
<#assign qrCodeWidth = "150">
|
||||||
|
|
||||||
<h2>Export QR Code</h2>
|
<h2>Export QR Code <em>(<a href="${individual.qrData.aboutQrCodesUrl}" title="More info on QR codes">What is this?</a>)</em></h2>
|
||||||
<div>
|
|
||||||
<div style="float:left">
|
|
||||||
<#assign thumbUrl = individual.thumbUrl! "${urls.images}/placeholders/person.thumbnail.jpg" >
|
|
||||||
<img src="${thumbUrl}" />
|
|
||||||
</div>
|
|
||||||
<div style="float:left">
|
|
||||||
<h3>${individual.nameStatement.value}</h3>
|
|
||||||
</div>
|
|
||||||
<div style="clear:both" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="border:1px solid #cccccc">
|
<#assign thumbUrl = individual.thumbUrl! "${urls.images}/placeholders/person.thumbnail.jpg" >
|
||||||
<h4 style="padding-left:5px">VCard</h4>
|
<img class="qrCode" src="${thumbUrl}" />
|
||||||
|
|
||||||
|
<h3 class="qrCode"><a href="${individual.profileUrl}" title="View this person's profile">${individual.nameStatement.value}</a></h3>
|
||||||
|
|
||||||
|
<section class="vcard">
|
||||||
|
<h4>VCard</h4>
|
||||||
<@qrCodeVCard qrCodeWidth="150" />
|
<@qrCodeVCard qrCodeWidth="150" />
|
||||||
<textarea readonly="readonly" style="width:600px;height:120px">
|
<textarea name="qrCodeVCard" readonly>
|
||||||
<img src="${getQrCodeUrlForVCard(qrCodeWidth)}" /><#t>
|
<img src="${getQrCodeUrlForVCard(qrCodeWidth)}" /><#t>
|
||||||
</textarea><#t>
|
</textarea><#t>
|
||||||
</div>
|
</section>
|
||||||
|
|
||||||
<div style="border:1px solid #cccccc">
|
<section>
|
||||||
<h4 style="padding-left:5px">Hyperlink</h4>
|
<h4>Hyperlink</h4>
|
||||||
<@qrCodeLink qrCodeWidth="150" />
|
<@qrCodeLink qrCodeWidth="150" />
|
||||||
<textarea readonly="readonly" style="width:600px;height:120px">
|
<textarea name="qrCodeLink" readonly>
|
||||||
<img src="${getQrCodeUrlForLink(qrCodeWidth)}" /><#t>
|
<img src="${getQrCodeUrlForLink(qrCodeWidth)}" /><#t>
|
||||||
</textarea><#t>
|
</textarea><#t>
|
||||||
</div>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/css/individual/individual-qr.css" />')}
|
|
@ -4,8 +4,6 @@
|
||||||
|
|
||||||
<#include "individual-setup.ftl">
|
<#include "individual-setup.ftl">
|
||||||
|
|
||||||
<#include "individual-qrCodeFoafPerson.ftl">
|
|
||||||
|
|
||||||
<section id="individual-intro" class="vcard person" role="region">
|
<section id="individual-intro" class="vcard person" role="region">
|
||||||
|
|
||||||
<section id="share-contact" role="region">
|
<section id="share-contact" role="region">
|
||||||
|
@ -34,6 +32,8 @@
|
||||||
<#if rdfUrl??>
|
<#if rdfUrl??>
|
||||||
<li role="listitem"><a title="View this individual in RDF format" class="icon-rdf" href="${rdfUrl}">RDF</a></li>
|
<li role="listitem"><a title="View this individual in RDF format" class="icon-rdf" href="${rdfUrl}">RDF</a></li>
|
||||||
</#if>
|
</#if>
|
||||||
|
|
||||||
|
<#include "individual-qrCodeFoafPerson.ftl">
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
@ -41,16 +41,6 @@
|
||||||
|
|
||||||
<#-- Links -->
|
<#-- Links -->
|
||||||
<@p.vitroLinks propertyGroups namespaces editable "individual-urls-people" />
|
<@p.vitroLinks propertyGroups namespaces editable "individual-urls-people" />
|
||||||
|
|
||||||
<#-- QR Codes -->
|
|
||||||
<#if hasValidVCard()>
|
|
||||||
<div style="border:1px solid #cccccc">
|
|
||||||
<span style="padding-left:5px">vCard QR <a style="font-size:smaller" href="${individual.qrData.aboutQrCodesUrl}">What is this?</a></span>
|
|
||||||
<a title="Export QR codes" href="${individual.qrData.exportQrCodeUrl}">
|
|
||||||
<@qrCodeVCard qrCodeWidth="150" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</#if>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="individual-info" ${infoClass!} role="region">
|
<section id="individual-info" ${infoClass!} role="region">
|
||||||
|
|
|
@ -1,123 +1,7 @@
|
||||||
<#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
|
<#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
|
||||||
|
|
||||||
<#-- QR code -->
|
<#include "individual-qrCodeGenerator.ftl">
|
||||||
|
|
||||||
<#macro qrCodeVCard qrCodeWidth>
|
<#if hasValidVCard()>
|
||||||
|
<li role="listitem"><a title="Export QR codes" href="${individual.qrData.exportQrCodeUrl}"><img class="middle" src="${urls.images}/individual/qr_icon.png" alt="qr icon" /></a></li>
|
||||||
<#local qrCodeUrl = getQrCodeUrlForVCard(qrCodeWidth)>
|
|
||||||
|
|
||||||
<#if qrCodeUrl != "">
|
|
||||||
<img src="${qrCodeUrl}" />
|
|
||||||
</#if>
|
</#if>
|
||||||
</#macro>
|
|
||||||
|
|
||||||
<#macro qrCodeLink qrCodeWidth>
|
|
||||||
|
|
||||||
<#local qrCodeUrl = getQrCodeUrlForLink(qrCodeWidth)>
|
|
||||||
|
|
||||||
<#if qrCodeUrl != "">
|
|
||||||
<img src="${qrCodeUrl}" />
|
|
||||||
</#if>
|
|
||||||
</#macro>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<#function getQrCodeUrlForVCard qrCodeWidth>
|
|
||||||
|
|
||||||
<#local qrData = individual.qrData >
|
|
||||||
|
|
||||||
<#local core = "http://vivoweb.org/ontology/core#">
|
|
||||||
<#local foaf = "http://xmlns.com/foaf/0.1/">
|
|
||||||
<#local rdfs = "http://www.w3.org/2000/01/rdf-schema#">
|
|
||||||
|
|
||||||
<#local firstName = qrData.firstName! >
|
|
||||||
<#local lastName = qrData.lastName! >
|
|
||||||
<#local org = "" >
|
|
||||||
<#local title = qrData.preferredTitle! >
|
|
||||||
<#local phoneNumber = qrData.phoneNumber! >
|
|
||||||
<#local email = qrData.email! >
|
|
||||||
<#local url = qrData.externalUrl! >
|
|
||||||
<#local photo = individual.thumbUrl! >
|
|
||||||
<#local rev = "" >
|
|
||||||
|
|
||||||
<#local qrCodeUrl = "">
|
|
||||||
<#if firstName != "" && lastName != "">
|
|
||||||
<#local vCard><#t>
|
|
||||||
BEGIN:VCARD<#lt>
|
|
||||||
VERSION:3.0<#lt>
|
|
||||||
N:${lastName};${firstName}<#lt>
|
|
||||||
FN:${firstName} ${lastName}<#lt>
|
|
||||||
<#if org != ""> ORG:${org}</#if><#lt>
|
|
||||||
<#if title != "">TITLE:${title}</#if><#lt>
|
|
||||||
<#if phoneNumber != "">TEL;TYPE=WORK,VOICE:${phoneNumber}</#if><#lt>
|
|
||||||
<#if email != "">EMAIL;TYPE=PREF,INTERNET:${email}</#if><#lt>
|
|
||||||
<#if url != "">URL:${url}</#if><#lt>
|
|
||||||
<#if photo != "">PHOTO;VALUE=URL;TYPE=JPG:${photo}</#if><#lt>
|
|
||||||
<#if rev != "">REV:${rev}</#if><#lt>
|
|
||||||
END:VCARD<#t>
|
|
||||||
</#local><#t>
|
|
||||||
|
|
||||||
<#local vCard = (removeBlankLines(vCard))?url>
|
|
||||||
|
|
||||||
<#local qrCodeUrl = "https://chart.googleapis.com/chart?cht=qr&chs=${qrCodeWidth}x${qrCodeWidth}&chl=${vCard}&choe=UTF-8" >
|
|
||||||
</#if>
|
|
||||||
|
|
||||||
<#return qrCodeUrl>
|
|
||||||
</#function>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<#function getQrCodeUrlForLink qrCodeWidth>
|
|
||||||
|
|
||||||
<#local qrData = individual.qrData >
|
|
||||||
|
|
||||||
<#local url = qrData.externalUrl! >
|
|
||||||
|
|
||||||
<#local qrCodeUrl = "">
|
|
||||||
<#if url != "">
|
|
||||||
<#local qrCodeContent = url?url>
|
|
||||||
<#local qrCodeUrl = "https://chart.googleapis.com/chart?cht=qr&chs=${qrCodeWidth}x${qrCodeWidth}&chl=${qrCodeContent}&choe=UTF-8" >
|
|
||||||
</#if>
|
|
||||||
|
|
||||||
<#return qrCodeUrl>
|
|
||||||
</#function>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<#function removeBlankLines input>
|
|
||||||
|
|
||||||
<#local test = "\n\n">
|
|
||||||
<#local replacement = "\n">
|
|
||||||
|
|
||||||
<#local output = input>
|
|
||||||
|
|
||||||
<#local maxLoop = 50>
|
|
||||||
<#list 1..maxLoop as i>
|
|
||||||
<#if output?contains(test)>
|
|
||||||
<#local output = output?replace(test, replacement)>
|
|
||||||
<#else>
|
|
||||||
<#break>
|
|
||||||
</#if>
|
|
||||||
</#list>
|
|
||||||
|
|
||||||
<#return output>
|
|
||||||
</#function>
|
|
||||||
|
|
||||||
<#function hasValidVCard>
|
|
||||||
|
|
||||||
<#local qrData = individual.qrData >
|
|
||||||
|
|
||||||
<#local firstName = qrData.firstName! >
|
|
||||||
<#local lastName = qrData.lastName! >
|
|
||||||
|
|
||||||
<#local validVCard = false>
|
|
||||||
<#if firstName != "" && lastName != "">
|
|
||||||
<#local validVCard = true>
|
|
||||||
</#if>
|
|
||||||
|
|
||||||
<#return validVCard>
|
|
||||||
</#function>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,119 @@
|
||||||
|
<#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
|
||||||
|
|
||||||
|
<#-- QR code -->
|
||||||
|
|
||||||
|
<#macro qrCodeVCard qrCodeWidth>
|
||||||
|
|
||||||
|
<#local qrCodeUrl = getQrCodeUrlForVCard(qrCodeWidth)>
|
||||||
|
|
||||||
|
<#if qrCodeUrl != "">
|
||||||
|
<img src="${qrCodeUrl}" />
|
||||||
|
</#if>
|
||||||
|
</#macro>
|
||||||
|
|
||||||
|
<#macro qrCodeLink qrCodeWidth>
|
||||||
|
|
||||||
|
<#local qrCodeUrl = getQrCodeUrlForLink(qrCodeWidth)>
|
||||||
|
|
||||||
|
<#if qrCodeUrl != "">
|
||||||
|
<img src="${qrCodeUrl}" />
|
||||||
|
</#if>
|
||||||
|
</#macro>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<#function getQrCodeUrlForVCard qrCodeWidth>
|
||||||
|
|
||||||
|
<#local qrData = individual.qrData >
|
||||||
|
|
||||||
|
<#local core = "http://vivoweb.org/ontology/core#">
|
||||||
|
<#local foaf = "http://xmlns.com/foaf/0.1/">
|
||||||
|
<#local rdfs = "http://www.w3.org/2000/01/rdf-schema#">
|
||||||
|
|
||||||
|
<#local firstName = qrData.firstName! >
|
||||||
|
<#local lastName = qrData.lastName! >
|
||||||
|
<#local org = "" >
|
||||||
|
<#local title = qrData.preferredTitle! >
|
||||||
|
<#local phoneNumber = qrData.phoneNumber! >
|
||||||
|
<#local email = qrData.email! >
|
||||||
|
<#local url = qrData.externalUrl! >
|
||||||
|
<#local photo = individual.thumbUrl! >
|
||||||
|
<#local rev = "" >
|
||||||
|
|
||||||
|
<#local qrCodeUrl = "">
|
||||||
|
<#if firstName != "" && lastName != "">
|
||||||
|
<#local vCard><#t>
|
||||||
|
BEGIN:VCARD<#lt>
|
||||||
|
VERSION:3.0<#lt>
|
||||||
|
N:${lastName};${firstName}<#lt>
|
||||||
|
FN:${firstName} ${lastName}<#lt>
|
||||||
|
<#if org != ""> ORG:${org}</#if><#lt>
|
||||||
|
<#if title != "">TITLE:${title}</#if><#lt>
|
||||||
|
<#if phoneNumber != "">TEL;TYPE=WORK,VOICE:${phoneNumber}</#if><#lt>
|
||||||
|
<#if email != "">EMAIL;TYPE=PREF,INTERNET:${email}</#if><#lt>
|
||||||
|
<#if url != "">URL:${url}</#if><#lt>
|
||||||
|
<#if photo != "">PHOTO;VALUE=URL;TYPE=JPG:${photo}</#if><#lt>
|
||||||
|
<#if rev != "">REV:${rev}</#if><#lt>
|
||||||
|
END:VCARD<#t>
|
||||||
|
</#local><#t>
|
||||||
|
|
||||||
|
<#local vCard = (removeBlankLines(vCard))?url>
|
||||||
|
|
||||||
|
<#local qrCodeUrl = "https://chart.googleapis.com/chart?cht=qr&chs=${qrCodeWidth}x${qrCodeWidth}&chl=${vCard}&choe=UTF-8" >
|
||||||
|
</#if>
|
||||||
|
|
||||||
|
<#return qrCodeUrl>
|
||||||
|
</#function>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<#function getQrCodeUrlForLink qrCodeWidth>
|
||||||
|
|
||||||
|
<#local qrData = individual.qrData >
|
||||||
|
|
||||||
|
<#local url = qrData.externalUrl! >
|
||||||
|
|
||||||
|
<#local qrCodeUrl = "">
|
||||||
|
<#if url != "">
|
||||||
|
<#local qrCodeContent = url?url>
|
||||||
|
<#local qrCodeUrl = "https://chart.googleapis.com/chart?cht=qr&chs=${qrCodeWidth}x${qrCodeWidth}&chl=${qrCodeContent}&choe=UTF-8" >
|
||||||
|
</#if>
|
||||||
|
|
||||||
|
<#return qrCodeUrl>
|
||||||
|
</#function>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<#function removeBlankLines input>
|
||||||
|
|
||||||
|
<#local test = "\n\n">
|
||||||
|
<#local replacement = "\n">
|
||||||
|
|
||||||
|
<#local output = input>
|
||||||
|
|
||||||
|
<#local maxLoop = 50>
|
||||||
|
<#list 1..maxLoop as i>
|
||||||
|
<#if output?contains(test)>
|
||||||
|
<#local output = output?replace(test, replacement)>
|
||||||
|
<#else>
|
||||||
|
<#break>
|
||||||
|
</#if>
|
||||||
|
</#list>
|
||||||
|
|
||||||
|
<#return output>
|
||||||
|
</#function>
|
||||||
|
|
||||||
|
<#function hasValidVCard>
|
||||||
|
|
||||||
|
<#local qrData = individual.qrData >
|
||||||
|
|
||||||
|
<#local firstName = qrData.firstName! >
|
||||||
|
<#local lastName = qrData.lastName! >
|
||||||
|
|
||||||
|
<#local validVCard = false>
|
||||||
|
<#if firstName != "" && lastName != "">
|
||||||
|
<#local validVCard = true>
|
||||||
|
</#if>
|
||||||
|
|
||||||
|
<#return validVCard>
|
||||||
|
</#function>
|
Loading…
Add table
Add a link
Reference in a new issue