add phorkie and qr code
This commit is contained in:
parent
f1222bb324
commit
8f5df14a85
|
@ -20,7 +20,12 @@ section
|
||||||
a href="http://ftp.higgsboson.tk" title="Some static files" Files
|
a href="http://ftp.higgsboson.tk" title="Some static files" Files
|
||||||
li
|
li
|
||||||
i.icon-trash
|
i.icon-trash
|
||||||
a href="http://paste.higgsboson.tk" title="encrypted pastebin" Zerobin
|
a href="http://paste.higgsboson.tk" title="encrypted pastebin" Zerobin
|
||||||
|
' or
|
||||||
|
a href="http://phork.higgsboson.tk" title="gist clone" Phorkie
|
||||||
|
li
|
||||||
|
i.icon-qrcode
|
||||||
|
a href="http://higgsboson.tk/qr" title="html5 qr-code generator" QR-Generator
|
||||||
li
|
li
|
||||||
i.icon-lock
|
i.icon-lock
|
||||||
a href="/privat.html" title="Internal pages" Privat
|
a href="/privat.html" title="Internal pages" Privat
|
||||||
|
|
|
@ -23,8 +23,8 @@ html.no-js.light lang="en"
|
||||||
/! Mobile viewport optimized: j.mp/bplateviewport
|
/! Mobile viewport optimized: j.mp/bplateviewport
|
||||||
meta content="width=device-width,initial-scale=1" name="viewport"
|
meta content="width=device-width,initial-scale=1" name="viewport"
|
||||||
== stylesheet_link_tag "site.css"
|
== stylesheet_link_tag "site.css"
|
||||||
link href='https://fonts.googleapis.com/css?family=Cabin' rel='stylesheet' type='text/css'
|
link href='//fonts.googleapis.com/css?family=Cabin' rel='stylesheet' type='text/css'
|
||||||
link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'
|
link href='//fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'
|
||||||
== yield_content :head
|
== yield_content :head
|
||||||
/ Respond is a polyfill for min/max-width media queries.
|
/ Respond is a polyfill for min/max-width media queries.
|
||||||
/ Modernizr enables HTML5 elements & feature detects;
|
/ Modernizr enables HTML5 elements & feature detects;
|
||||||
|
|
|
@ -0,0 +1,26 @@
|
||||||
|
This example shows how you can create a QR Code PNG using Javascript and HTML5.
|
||||||
|
|
||||||
|
Notes:
|
||||||
|
---
|
||||||
|
This is the heart of my Tab Transmit Safari Extension.
|
||||||
|
|
||||||
|
You can downloaded it from:
|
||||||
|
http://ticklespace.com/tab-transmit-safari-extension
|
||||||
|
or
|
||||||
|
https://extensions.apple.com/
|
||||||
|
Tab Transmit is listed under Productivity.
|
||||||
|
|
||||||
|
|
||||||
|
Author:
|
||||||
|
---
|
||||||
|
Amanuel Tewolde / TickleSpace - www.ticklespace.com
|
||||||
|
|
||||||
|
Copyright (c) 2011 Amanuel Tewolde
|
||||||
|
|
||||||
|
License:
|
||||||
|
---
|
||||||
|
MIT
|
||||||
|
|
||||||
|
Other Projects:
|
||||||
|
---
|
||||||
|
QRCode.js Copyright (c) 2009 Kazuhiko Arase
|
|
@ -0,0 +1,64 @@
|
||||||
|
//---------------------------------------------------------------------
|
||||||
|
// JavaScript-HTML5 QRCode Generator
|
||||||
|
//
|
||||||
|
// Copyright (c) 2011 Amanuel Tewolde
|
||||||
|
//
|
||||||
|
// Licensed under the MIT license:
|
||||||
|
// http://www.opensource.org/licenses/mit-license.php
|
||||||
|
//
|
||||||
|
//---------------------------------------------------------------------
|
||||||
|
|
||||||
|
// Generates a QRCode of text provided.
|
||||||
|
// First QRCode is rendered to a canvas.
|
||||||
|
// The canvas is then turned to an image PNG
|
||||||
|
// before being returned as an <img> tag.
|
||||||
|
function showQRCode(text) {
|
||||||
|
|
||||||
|
|
||||||
|
var dotsize = 5; // size of box drawn on canvas
|
||||||
|
var padding = 10; // (white area around your QRCode)
|
||||||
|
var black = "rgb(0,0,0)";
|
||||||
|
var white = "rgb(255,255,255)";
|
||||||
|
var QRCodeVersion = 15; // 1-40 see http://www.denso-wave.com/qrcode/qrgene2-e.html
|
||||||
|
|
||||||
|
var canvas=document.createElement('canvas');
|
||||||
|
var qrCanvasContext = canvas.getContext('2d');
|
||||||
|
try {
|
||||||
|
// QR Code Error Correction Capability
|
||||||
|
// Higher levels improves error correction capability while decreasing the amount of data QR Code size.
|
||||||
|
// QRErrorCorrectLevel.L (5%) QRErrorCorrectLevel.M (15%) QRErrorCorrectLevel.Q (25%) QRErrorCorrectLevel.H (30%)
|
||||||
|
// eg. L can survive approx 5% damage...etc.
|
||||||
|
var qr = new QRCode(QRCodeVersion, QRErrorCorrectLevel.L);
|
||||||
|
qr.addData(text);
|
||||||
|
qr.make();
|
||||||
|
}
|
||||||
|
catch(err) {
|
||||||
|
var errorChild = document.createElement("p");
|
||||||
|
var errorMSG = document.createTextNode("QR Code FAIL! " + err);
|
||||||
|
errorChild.appendChild(errorMSG);
|
||||||
|
return errorChild;
|
||||||
|
}
|
||||||
|
|
||||||
|
var qrsize = qr.getModuleCount();
|
||||||
|
canvas.setAttribute('height',(qrsize * dotsize) + padding);
|
||||||
|
canvas.setAttribute('width',(qrsize * dotsize) + padding);
|
||||||
|
var shiftForPadding = padding/2;
|
||||||
|
if (canvas.getContext){
|
||||||
|
for (var r = 0; r < qrsize; r++) {
|
||||||
|
for (var c = 0; c < qrsize; c++) {
|
||||||
|
if (qr.isDark(r, c))
|
||||||
|
qrCanvasContext.fillStyle = black;
|
||||||
|
else
|
||||||
|
qrCanvasContext.fillStyle = white;
|
||||||
|
qrCanvasContext.fillRect ((c*dotsize) +shiftForPadding,(r*dotsize) + shiftForPadding,dotsize,dotsize); // x, y, w, h
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var imgElement = document.createElement("img");
|
||||||
|
imgElement.src = canvas.toDataURL("image/png");
|
||||||
|
|
||||||
|
return imgElement;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
|
@ -0,0 +1,45 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||||
|
<script type="text/javascript" src="qrcode.js">
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript" src="html5-qrcode.js">
|
||||||
|
</script>
|
||||||
|
<title>
|
||||||
|
QRCode Generator Example
|
||||||
|
</title>
|
||||||
|
<style type="text/css" media="screen">
|
||||||
|
body { text-align:center; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>
|
||||||
|
QRCode Generator Example
|
||||||
|
</h1>
|
||||||
|
<form name="QRform" id="QRform">
|
||||||
|
<textarea name="textField" rows="8" cols="50" onkeyup='updateQRCode(this.value)' onclick="this.focus();this.select();">I love QR Codes. Type in here and watch the QR code below update.</textarea>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<!-- This is where our QRCode will appear in. -->
|
||||||
|
<div id="qrcode"></div>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
function updateQRCode(text) {
|
||||||
|
|
||||||
|
var element = document.getElementById("qrcode");
|
||||||
|
|
||||||
|
var bodyElement = document.body;
|
||||||
|
if(element.lastChild)
|
||||||
|
element.replaceChild(showQRCode(text), element.lastChild);
|
||||||
|
else
|
||||||
|
element.appendChild(showQRCode(text));
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
updateQRCode('I love QR Codes. Type in here and watch the QR code below update.');
|
||||||
|
</script>
|
||||||
|
<p><a href="https://github.com/amanuel/JS-HTML5-QRCode-Generator" onmouseover="updateQRCode(this.href)">Project Homepage</a></p>
|
||||||
|
<p><a href="http://ticklespace.com" onmouseover="updateQRCode(this.href)">TickleSpace</a></p>
|
||||||
|
</body>
|
||||||
|
</html>
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue