Skip to content

Commit

Permalink
more work
Browse files Browse the repository at this point in the history
  • Loading branch information
@jeromeetienne
jeromeetienne committed Apr 7, 2011
1 parent ee9162c commit e792016
Show file tree
Hide file tree
Showing 7 changed files with 257 additions and 6 deletions.
20 changes: 20 additions & 0 deletions MIT-LICENSE.txt
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
Copyright (c) 2011 Jerome Etienne, http://jetienne.com

Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
6 changes: 5 additions & 1 deletion Makefile
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,11 @@ all:
build: minify homepage_build

minify:
closurec --js src/jquery.qrcode.js --js_output_file jquery.qrcode.min.js
echo -n > /tmp/jquery.qrcode.tmp.js
head -2 src/jquery.qrcode.js >> /tmp/jquery.qrcode.tmp.js
cat src/qrcode.js >> /tmp/jquery.qrcode.tmp.js
tail -n +3 src/jquery.qrcode.js >> /tmp/jquery.qrcode.tmp.js
closurec --js /tmp/jquery.qrcode.tmp.js --js_output_file jquery.qrcode.min.js

homepage_build:
pandoc -A ~/.pandoc.header.html -s README.md -o index.html
Expand Down
31 changes: 27 additions & 4 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,31 @@
# jQuery.qrcode.js

with jQuery.qrcode.js you can easily add qrcode to your webpages.
With jQuery.qrcode.js you can easily add qrcode to your webpages.
It is standalone, no external services which go on and off, or add latency
while loading.

jQuery("#container").qrcode("this plugin is great")
Show, dont tell, here is a <a href='examples/demo.html'>demo</a>

It is standalone, no external services which go on and off, or add latency
while loading.
## How to Use It

First include it in your webpage with the usual script tag

<script type="text/javascript" src="jquery.qrcode.min.js"></script>

Then create a DOM element which gonna contains the generated qrcode image. Lets say
a div

<div id="qrcode"></div>

Then you add the *qrcode* in this container by

jQuery('#qrcode').qrcode("this plugin is great");

This is it.

## Conclusion

MicroEvent.js is available on github <a href='https://github.com/jeromeetienne/jquery-qrcode'>here</a>
under <a href='https://github.com/jeromeetienne/jquery-qrcode.js/blob/master/MIT-LICENSE.txt'>MIT license</a>.
If you hit bugs, fill issues on github.
Feel free to fork, modify and have fun with it :)
23 changes: 23 additions & 0 deletions examples/demo.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<html>
<head>
<title>Demo page</title>

</head>
<body>
<p>
TODO make a nice looking pure client qrcode generator
even allow download of the image
</p>

<div id="output"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="../jquery.qrcode.min.js"></script>
<script>
jQuery(function(){
jQuery('#output').qrcode("http://jetienne.com");
})
</script>

</body>
</html>
5 changes: 4 additions & 1 deletion examples/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,11 @@
even allow download of the image
</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="../src/jquery.qrcode.js"></script>
<!--<script type="text/javascript" src="../src/jquery.qrcode.js"></script>
<script type="text/javascript" src="../src/qrcode.js"></script>
-->

<script type="text/javascript" src="../jquery.qrcode.min.js"></script>

<div id="output"></div>
<script>
Expand Down
156 changes: 156 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,156 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="pandoc" />
<meta name="date" content="" />
</head>
<body>
<div id="jquery.qrcode.js"
><h1
>jQuery.qrcode.js</h1
><p
>With jQuery.qrcode.js you can easily add qrcode to your webpages. It is standalone, no external services which go on and off, or add latency while loading.</p
><p
>Show, dont tell, here is a <a href='examples/demo.html'>demo</a></p
><div id="how-to-use-it"
><h2
>How to Use It</h2
><p
>First include it in your webpage with the usual script tag</p
><pre
><code
>&lt;script type=&quot;text/javascript&quot; src=&quot;jquery.qrcode.min.js&quot;&gt;&lt;/script&gt;
</code
></pre
><p
>Then create a DOM element which gonna contains the generated qrcode image. Lets say a div</p
><pre
><code
>&lt;div id=&quot;qrcode&quot;&gt;&lt;/div&gt;
</code
></pre
><p
>Then you add the <em
>qrcode</em
> in this container by</p
><pre
><code
>jQuery('#qrcode').qrcode(&quot;this plugin is great&quot;);
</code
></pre
><p
>This is it.</p
></div
><div id="conclusion"
><h2
>Conclusion</h2
><p
>MicroEvent.js is available on github <a href='https://github.com/jeromeetienne/jquery-qrcode'>here</a> under <a href='https://github.com/jeromeetienne/microevent.js/blob/master/MIT-LICENSE.txt'>MIT license</a>. If you hit bugs, fill issues on github. Feel free to fork, modify and have fun with it :)</p
></div
></div
>
<style>
body {
margin: auto;
padding-right: 1em;
padding-left: 1em;
max-width: 44em;
border-left: 1px solid #eee;
border-right: 1px solid #eee;
font-family : Verdana, sans-serif;
font-size : 100%;
line-height : 140%;
color : #eee;
background-color : #22252a;
}
pre {
border : 1px dotted gray;
background-color : #444a50;
color : #1111111;
padding : 0.5em;
}
code {
font-family : monospace;
}
a {
text-decoration : none;
color : lightSteelBlue;
}
a:hover {
text-decoration : underline;
}
h1, h2, h3, h4, h5 { font-family: verdana;
font-weight: bold;
border-bottom: 1px dotted #eee;
color: lightSteelBlue; }
h1 {
color : #cd5;
font-size : 130%;
}
h1:nth-child(1) {
font-size : 300%;
text-align : center;
height : 1em;
}
h2 {
font-size : 110%;
}

h3 {
font-size : 95%;
}

h4 {
font-size : 90%;
font-style : italic;
}

h5 {
font-size : 90%;
font-style : italic;
}

h1.title {
font-size : 200%;
font-weight : bold;
padding-top : 0.2em;
padding-bottom : 0.2em;
text-align : left;
border : none;
}

dt code {
font-weight : bold;
}
dd p {
margin-top : 0;
}
img {
/* border-color : white;
border-style : solid;
*/}

#footer {
padding-top : 1em;
font-size : 70%;
color : gray;
text-align : center;
}

</style>
<!-- follow me on twitter -->
<a href="http://www.twitter.com/jerome_etienne">
<img style="position: absolute; bottom: 10px; right: 10px; border: 0;" src="http://twitter-badges.s3.amazonaws.com/follow_me-c.png" alt="Follow jerome_etienne on Twitter"/>
</a>
<!-- github ribbon -->
<a href="https://github.com/jeromeetienne/jquery-qrcode"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://assets0.github.com/img/ce742187c818c67d98af16f96ed21c00160c234a?repo=&url=http%3A%2F%2Fs3.amazonaws.com%2Fgithub%2Fribbons%2Fforkme_left_gray_6d6d6d.png&path=" alt="Fork me on GitHub"></a>
<!-- twitter share + facebook like -->
<div style="position: absolute; top: 10px; right: 10px; border: 0;">

<a href="http://twitter.com/share" class="twitter-share-button" data-count="none" data-via="jerome_etienne">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>
</body>
</html>

22 changes: 22 additions & 0 deletions jquery.qrcode.min.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit e792016

Please sign in to comment.