adding QR codes

This commit is contained in:
DennisSchiefer 2012-08-30 16:50:59 +01:00
parent f2a4a02af8
commit a83a3d125d
7 changed files with 1466 additions and 3 deletions

View File

@ -47,10 +47,12 @@ init: function() {
activateRouteFeatures: function() { activateRouteFeatures: function() {
OSRM.Printing.activate(); OSRM.Printing.activate();
OSRM.G.map.locationsControl.activateRoute(); OSRM.G.map.locationsControl.activateRoute();
OSRM.G.active_shortlink = null; // delete shortlink when new route is shown (RoutingDescription calls this method!)
}, },
deactivateRouteFeatures: function() { deactivateRouteFeatures: function() {
OSRM.Printing.deactivate(); OSRM.Printing.deactivate();
OSRM.G.map.locationsControl.deactivateRoute(); OSRM.G.map.locationsControl.deactivateRoute();
OSRM.G.active_shortlink = null; // delete shortlink when the route is hidden
}, },
// click: button "reset" // click: button "reset"

1215
WebContent/qrcodes/QRCode.js Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,71 @@
/*
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
*/
/* OSRM CSS styles for qr codes */
/* ------------------------------------------------------------------------ */
/* page setup */
body
{
margin: 10;
}
/* ------------------------------------------------------------------------ */
/* containers */
#qrcode-container
{
text-align:center;
}
#qrcode-link
{
margin-top:10px;
text-align:center;
}
/* qrcode table for IE8 */
.qrcode
{
border-spacing:0px;
margin-left:auto;
margin-right:auto;
}
.black
{
background-color:#000000;
width:6px;
height:6px;
padding:0px;
}
.white
{
background-color:#FFFFFF;
width:6px;
height:6px;
padding:0px;
}
/* ------------------------------------------------------------------------ */
/* fonts */
.base-font
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
}

View File

@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- head -->
<head>
<!-- metatags -->
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>OSRM Website</title>
<meta name="description" content="OSRM Website"/>
<meta name="author" content="Dennis Schieferdecker" />
<!-- stylesheets -->
<link rel="stylesheet" href="qrcodes.css" type="text/css"/>
<!-- scripts -->
<script src="qrcodes.js" type="text/javascript" ></script>
<script src="QRCode.js" type="text/javascript" ></script>
</head>
<!-- body -->
<body>
<div id="qrcode-container"></div>
<div id="qrcode-link" class="base-font"></div>
</body>
</html>

View File

@ -0,0 +1,102 @@
/*
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU AFFERO General Public License as published by
the Free Software Foundation; either version 3 of the License, or
any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
or see http://www.gnu.org/licenses/agpl.txt.
*/
/*
The word "QR Code" is registered trademark of DENSO WAVE INCORPORATED.
http://www.denso-wave.com/qrcode/faqpatent-e.html
Coding ideas were taken from JavaScript-HTML5 QRCode Generator,
copyright (c) 2011 by Amanuel Tewolde, licensed under MIT license.
http://www.opensource.org/licenses/mit-license.php
*/
// initialization for QR Code window
// [qr code creation / error handling]
// build and show qr code
function createQRCode(text) {
// settings
var QRCodeVersion = 4;
var dotsize = 6;
// create qrcode
// [when storing longer strings, verify if QRCodeVersion is still sufficient -> catch errors]
var qrcode = new QRCode(QRCodeVersion, QRErrorCorrectLevel.H);
qrcode.addData(text);
qrcode.make();
var qrsize = qrcode.getModuleCount();
// HTML5 capable browsers
if(!window.opener.OSRM.Browser.IE6_8) {
// fill canvas
var canvas = document.createElement("canvas");
canvas.setAttribute('height', dotsize*qrsize );
canvas.setAttribute('width', dotsize*qrsize );
var context = canvas.getContext('2d');
for (var x = 0; x < qrsize; x++)
for (var y = 0; y < qrsize; y++) {
if (qrcode.isDark(y, x))
context.fillStyle = "rgb(0,0,0)";
else
context.fillStyle = "rgb(255,255,255)";
context.fillRect ( x*dotsize, y*dotsize, dotsize, dotsize);
}
// create png
var image = document.createElement("img");
image.id = "qrcode";
image.src = canvas.toDataURL("image/png");
document.getElementById("qrcode-container").appendChild(image);
// IE8...
} else {
// fill table
var html = "";
html += "<table class='qrcode'>";
for (var y = 0; y < qrsize; y++) {
html += "<tr>";
for (var x = 0; x < qrsize; x++) {
if (qrcode.isDark(y, x))
html += "<td class='black'/>";
else
html += "<td class='white'/>";
}
html += "</tr>";
}
html += "</table>";
// add html to window
document.getElementById("qrcode-container").innerHTML = html;
}
document.getElementById("qrcode-link").innerHTML = text;
}
// populate window with qrcode or with error message
function onLoad() {
if( window.opener.OSRM.G.active_shortlink )
createQRCode(window.opener.OSRM.G.active_shortlink);
else
createErrorMessage();
}
//start populating the window when it is fully loaded - and only if it was loaded from OSRM
if(window.opener && window.opener.OSRM)
window.opener.OSRM.Browser.onLoadHandler( onLoad, window );

View File

@ -37,6 +37,8 @@ init: function() {
OSRM.G.markers = new OSRM.Markers(); OSRM.G.markers = new OSRM.Markers();
OSRM.G.route = new OSRM.Route(); OSRM.G.route = new OSRM.Route();
OSRM.G.response = { via_points:[] }; OSRM.G.response = { via_points:[] };
OSRM.RoutingDescription.init();
}, },

View File

@ -21,6 +21,19 @@ or see http://www.gnu.org/licenses/agpl.txt.
OSRM.RoutingDescription = { OSRM.RoutingDescription = {
// directory with qrcodes files
QR_DIRECTORY: 'qrcodes/',
// initialization of required variables and events
init: function() {
OSRM.G.active_shortlink = null;
OSRM.Browser.onUnloadHandler( OSRM.RoutingDescription.uninit );
},
uninit: function() {
if( OSRM.G.qrcodewindow )
OSRM.G.qrcodewindow.close();
},
// route description events // route description events
onClickRouteDescription: function(lat, lng) { onClickRouteDescription: function(lat, lng) {
OSRM.G.markers.highlight.setPosition( new L.LatLng(lat, lng) ); OSRM.G.markers.highlight.setPosition( new L.LatLng(lat, lng) );
@ -39,14 +52,24 @@ onClickCreateShortcut: function(src){
document.getElementById('route-link').innerHTML = '['+OSRM.loc("GENERATE_LINK_TO_ROUTE")+']'; document.getElementById('route-link').innerHTML = '['+OSRM.loc("GENERATE_LINK_TO_ROUTE")+']';
}, },
showRouteLink: function(response){ showRouteLink: function(response){
if(!response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]) if(!response || !response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]) {
OSRM.RoutingDescription.showRouteLink_TimeOut(); OSRM.RoutingDescription.showRouteLink_TimeOut();
else return;
document.getElementById('route-link').innerHTML = '[<a class="route-link" href="' +response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]+ '">'+response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER]+'</a>]'; }
OSRM.G.active_shortlink = response[OSRM.DEFAULTS.SHORTENER_REPLY_PARAMETER];
document.getElementById('route-link').innerHTML =
'[<a class="route-link" onClick="OSRM.RoutingDescription.showQRCode();">'+OSRM.loc("QR")+'</a>]' + ' ' +
'[<a class="route-link" href="' +OSRM.G.active_shortlink+ '">'+OSRM.G.active_shortlink.substring(7)+'</a>]';
}, },
showRouteLink_TimeOut: function(){ showRouteLink_TimeOut: function(){
document.getElementById('route-link').innerHTML = '['+OSRM.loc("LINK_TO_ROUTE_TIMEOUT")+']'; document.getElementById('route-link').innerHTML = '['+OSRM.loc("LINK_TO_ROUTE_TIMEOUT")+']';
}, },
showQRCode: function(response){
if( OSRM.G.qrcodewindow )
OSRM.G.qrcodewindow.close();
OSRM.G.qrcodewindow = window.open( OSRM.RoutingDescription.QR_DIRECTORY+"qrcodes.html","","width=280,height=240,left=100,top=100,dependent=yes,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,resizable=no");
},
// handling of routing description // handling of routing description
show: function(response) { show: function(response) {