Badger

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.

Demo

http://therealklanni.github.io/badger

Community customization

The template can be customized to your community to simplify badge creation for your community members.

Instructions

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!

Contribute!

Merge requests are encouraged and appreciated!

You can also help out by testing the develop branch and report any bugs you find.

Brought to you by