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 -->
|
||||
|
||||
<#include "individual-qrCodeFoafPerson.ftl">
|
||||
<#include "individual-qrCodeGenerator.ftl">
|
||||
|
||||
<#assign qrCodeWidth = "150">
|
||||
|
||||
<h2>Export QR Code</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>
|
||||
<h2>Export QR Code <em>(<a href="${individual.qrData.aboutQrCodesUrl}" title="More info on QR codes">What is this?</a>)</em></h2>
|
||||
|
||||
<div style="border:1px solid #cccccc">
|
||||
<h4 style="padding-left:5px">VCard</h4>
|
||||
<#assign thumbUrl = individual.thumbUrl! "${urls.images}/placeholders/person.thumbnail.jpg" >
|
||||
<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" />
|
||||
<textarea readonly="readonly" style="width:600px;height:120px">
|
||||
<textarea name="qrCodeVCard" readonly>
|
||||
<img src="${getQrCodeUrlForVCard(qrCodeWidth)}" /><#t>
|
||||
</textarea><#t>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div style="border:1px solid #cccccc">
|
||||
<h4 style="padding-left:5px">Hyperlink</h4>
|
||||
<section>
|
||||
<h4>Hyperlink</h4>
|
||||
<@qrCodeLink qrCodeWidth="150" />
|
||||
<textarea readonly="readonly" style="width:600px;height:120px">
|
||||
<textarea name="qrCodeLink" readonly>
|
||||
<img src="${getQrCodeUrlForLink(qrCodeWidth)}" /><#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-qrCodeFoafPerson.ftl">
|
||||
|
||||
<section id="individual-intro" class="vcard person" role="region">
|
||||
|
||||
<section id="share-contact" role="region">
|
||||
|
@ -34,6 +32,8 @@
|
|||
<#if rdfUrl??>
|
||||
<li role="listitem"><a title="View this individual in RDF format" class="icon-rdf" href="${rdfUrl}">RDF</a></li>
|
||||
</#if>
|
||||
|
||||
<#include "individual-qrCodeFoafPerson.ftl">
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
@ -41,16 +41,6 @@
|
|||
|
||||
<#-- Links -->
|
||||
<@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 id="individual-info" ${infoClass!} role="region">
|
||||
|
|
|
@ -1,123 +1,7 @@
|
|||
<#-- $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>
|
||||
|
||||
|
||||
|
||||
<#include "individual-qrCodeGenerator.ftl">
|
||||
|
||||
<#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>
|
||||
</#if>
|
|
@ -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