A simple app for creating and printing out custom Ingress Agent identification badges. An end-user can set their codename and level, add a community logo, and a QR code (e.g. a link to their community for recruitment), then print the page out and laminate it.
http://therealklanni.github.io/badger
The template can be customized to your community to simplify badge creation for your community members.
Fork or clone this repository
git clone https://github.com/therealklanni/badger
Replace the ??.default-logo.png
and ??.default-qr.png
images with your own default images in the dist/
directory
<!-- Overwrite this image with your own default, or change the src to point to your image location -->
<img src="images/31a07d21.default-logo.png" alt="" class="editable badge-logo">
...
<!-- Overwrite this image with your own default, or change the src to point to your image location -->
<img src="images/77ee982d.default-qr.png" alt="" class="editable badge-qr">
Locate and modify the following lines in the dist/index.html
file as follows
<!-- Replace the ID (numbers) below with your G+ Page ID, do not use your community ID -->
<link href="https://plus.google.com/108910164412297335014" rel="publisher">
<!-- Change the link here to your community link (shortened links such as goo.gl or tinyurl.com will not work here) -->
<div class="g-plusone" data-annotation="inline" data-width="225" data-href="http://therealklanni.github.io/badger/"></div>
<!-- cut -->
<div class="span3">
<!-- Replace the ID (numbers) below with your G+ Page ID
optionally delete everything between the "cut" comments to remove -->
<div class="g-page" data-width="180" data-href="//plus.google.com/108910164412297335014"></div>
</div>
<!-- cut -->
<!-- Replace the ID (numbers) below with your G+ Community ID -->
<div class="g-community" data-width="180" data-showtagline="true" data-href="//plus.google.com/communities/115566167479601650426"></div>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
Finally, set your default values ...
<script>
// EDIT THIS PORTION FOR CUSTOM COMMUNITY DEFAULTS
var community_defaults = {
// Set your community name, e.g. "My Awesome Community"
community: "COMMUNITY",
// Set your community link, e.g. "goo.gl/xyzabc"
link: "goo.gl/link",
// Set to false to default to Resistance
enlightened: true
}
</script>
and upload everything from the dist/
folder to your web hosting.
That's it, you're done!
Merge requests are encouraged and appreciated!
You can also help out by testing the develop branch and report any bugs you find.
In the directory where you have cloned this repository, run
npm install && bower install
to get started. Please work in develop
and make changes only in the app
directory.
Use grunt server
to test your work.
Please only submit pull requests to the develop
branch. I will do the builds in master after merging from develop.
Open Your Mind - Phoenix, Arizona's Enlightened, opening minds in the valley since 2012!
- Kevin Lanni (@therealklanni)
Special thanks for assistance and contributions:
Brandon Graham, Nathan Brandt, @akkatracker, @Neofyt, @stillru
Copyright (C) 2013 Kevin Lanni
Licensed under the MIT License