first commit

libraries/framework/vendor/plugins/mapplic/mapplic/mapplic-ie.css

@@ -0,0 +1,19 @@
+a {
+	outline: none;
+}
+
+a img {
+	border: none;
+}
+
+.im-minimap {
+	border: 1px solid #666;
+}
+
+.im-minimap-overlay {
+	background-image: url(images/alpha50.png);
+}
+
+.im-list-category > a span {
+	background-image: url(images/alpha20.png);	
+}

libraries/framework/vendor/plugins/mapplic/mapplic/mapplic.css

@@ -0,0 +1,534 @@
+svg {
+	width: 100%;
+	height: 100%;
+}
+
+svg a {
+	cursor: pointer;
+}
+
+.mapplic-element a {
+	color: #333;
+	text-decoration: none !important;
+}
+
+.mapplic-element input,
+.mapplic-element button {
+	outline: none;
+}
+
+.mapplic-element * { -webkit-tap-highlight-color: rgba(0,0,0,0); }
+
+.mapplic-element {
+	background-color: #f8f8f8;
+	font-size: 0;
+	overflow: hidden;
+}
+
+/* Fullscreen */
+:-webkit-full-screen {
+	width: 100%;
+	height: 100% !important;
+}
+
+:-webkit-full-screen .mapplic-fullscreen-button {
+	background-image: url(images/fullscreen-exit.png);
+}
+
+/* Preloader */
+.mapplic-element.mapplic-loading {
+	background: #f8f8f8 url(images/loader.gif) no-repeat center;
+}
+
+.mapplic-element > * {
+	opacity: 1;
+	-webkit-transition: opacity 0.6s;
+	-moz-transition: opacity 0.6s;
+	transition: opacity 0.6s;
+}
+
+.mapplic-element.mapplic-loading > * {
+	opacity: 0;
+}
+
+/* Main elements */
+.mapplic-container {
+	background-color: #f8f8f8;
+	display: inline-block;
+	overflow: hidden;
+	position: relative;
+	width: 70%;
+	height: 100%;
+	border-left: 1px solid #e5e5e5;
+}
+
+:-webkit-full-screen .mapplic-container {
+	width: 80%;
+}
+
+.mapplic-map {
+	position: absolute;
+	left: 0;
+	top: 0;
+}
+
+/* Map layer */
+.mapplic-layer {
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	position: absolute;
+}
+
+.mapplic-layer img {
+	width: 100%;
+}
+
+.mapplic-map-image {
+	cursor: url(images/openhand.cur), default;
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+
+.mapplic-map.mapplic-dragging .mapplic-map-image {
+	cursor: url(images/closedhand.cur), move;
+}
+
+.mapplic-locations {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+
+.mapplic-pin {
+	background-image: url(images/pin-red.png);
+	background-repeat: no-repeat;
+	background-position: center;
+	width: 30px;
+	height: 30px;
+	margin-top: -25px;
+	margin-left: -10px;
+	position: absolute;
+}
+
+.mapplic-pin.mapplic-animate {
+	-webkit-animation: bounce-in 0.4s forwards;
+	animation: bounce-in 0.4s forwards;
+}
+
+@-webkit-keyframes bounce-in {
+	0%   {margin-top: -120px; opacity: 0;}
+	33%  {margin-top: -25px; opacity: 1;}
+	66%  {margin-top: -30px;}
+	100% {margin-top: -25px; opacity: 1;}
+}
+
+.mapplic-pin.orange { background-image: url(images/pin-orange.png); }
+.mapplic-pin.green { background-image: url(images/pin-green.png); }
+.mapplic-pin.blue { background-image: url(images/pin-blue.png); }
+.mapplic-pin.purple { background-image: url(images/pin-purple.png); }
+
+/* Minimap */
+.mapplic-minimap {
+	border: 1px solid rgba(0, 0, 0, 0.4);
+	position: absolute;
+	width: 140px;
+	margin: 10px;
+	bottom: 0;
+	right: 0;
+	overflow: hidden;
+}
+
+.mapplic-minimap img {
+	width: 100%;
+}
+
+.mapplic-minimap-overlay {
+	background-color: rgba(0, 0, 0, 0.5);
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 0;
+	left: 0;
+}
+
+.mapplic-minimap .mapplic-minimap-active {
+	position: absolute;
+	opacity: 1;
+	top: 0;
+	left: 0;
+	-webkit-transition: clip 0.1s;
+	-moz-transition: clip 0.1s;
+	transition: clip 0.1s;
+}
+
+.mapplic-minimap-background {
+	-webkit-filter: blur(2px);
+}
+
+/* Clear Button */
+.mapplic-clear-button {
+	background-color: #fff;
+	background-image: url(images/target.png);
+	background-repeat: no-repeat;
+	background-position: center;
+	margin: 10px;
+	width: 28px;
+	height: 28px;
+	position: absolute;
+	bottom: 0;
+	left: 0;
+}
+
+/* Fullscreen Button */
+.mapplic-fullscreen-button {
+	background-color: #fff;
+	background-image: url(images/fullscreen.png);
+	background-repeat: no-repeat;
+	background-position: center;
+	margin: 10px;
+	width: 28px;
+	height: 28px;
+	position: absolute;
+	top: 0;
+	left: 0;
+}
+
+/* Levels */
+.mapplic-levels {
+	background-color: #fff;
+	position: absolute;
+	top: 0;
+	right: 0;
+	margin: 10px;
+	overflow: hidden;
+}
+
+.mapplic-levels > * {
+	display: block;
+	width: 100%;
+}
+
+.mapplic-levels-select {
+	border: none;
+	margin: 0;
+	padding: 6px 2px;
+	font-size: 12px;
+	outline: none;
+}
+
+.mapplic-levels a {
+	background-color: #fff;
+	background-repeat: no-repeat;
+	background-position: center;
+	border: none;
+	cursor: pointer;
+	height: 20px;
+	width: 100%;
+}
+
+.mapplic-levels .mapplic-levels-up {
+	background-image: url(images/arrow-up.png);
+	border-bottom: 1px solid #eee;
+}
+
+.mapplic-levels .mapplic-levels-down {
+	background-image: url(images/arrow-down.png);
+	border-top: 1px solid #eee;
+}
+
+.mapplic-levels a.disabled {
+	background-color: #eee;
+	cursor: default;
+}
+
+/* Sidebar */
+.mapplic-sidebar {
+	background-color: #fafafa;
+	width: 30%;
+	height: 100%;
+	float: left;
+	position: relative;
+}
+
+:-webkit-full-screen .mapplic-sidebar {
+	width: 20%;
+}
+
+/* Search */
+.mapplic-search-form {
+	border-bottom: 1px solid #eee;
+	padding: 20px 25px;
+	margin: 0;
+	width: 100%;
+	position: relative;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.mapplic-search-input {
+	background-image: url(images/viewer.png);
+	background-repeat: no-repeat;
+	background-position: 8px;
+	border: 2px solid #eee;
+	border-radius: 2px;
+	font-size: 14px;
+	font-family: inherit;
+	line-height: 20px;
+	height: 42px;
+	margin: 0;
+	padding: 8px 36px;
+	width: 100%;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+
+	-webkit-transition: border-color 0.1s;
+	-moz-transition: border-color 0.1s;
+	transition: border-color 0.1s;
+}
+
+.mapplic-search-input:focus {
+	border-color: #6ed8dd;
+}
+
+.mapplic-search-clear {
+	display: none;
+	position: absolute;
+	cursor: pointer;
+	font-size: 16px;
+	font-weight: 400;
+	color: #AAA;
+	top: 21px;
+	right: 25px;
+	margin: 0;
+	padding: 0;
+	width: 18px;
+	height: 18px;
+	border: 0;
+	background: transparent;
+}
+.mapplic-search-clear:hover {
+	color: #555;
+}
+.mapplic-search-clear:after {
+	content: "\f00d";
+	font-family: "FontAwesome";	
+}
+
+
+.mapplic-not-found {
+	color: #bbb;
+	display: none;
+	font-size: 13px;
+	padding: 0 30px;
+	position: absolute;
+	text-align: center;
+	top: 100px;
+}
+
+/* List */
+.mapplic-list-container {
+	padding: 25px;
+	height: 100%;
+	overflow-y: auto;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.mapplic-list {
+	list-style: none;
+	padding: 0;
+	margin: 0;
+	overflow-y: auto;
+}
+
+.mapplic-list-container ol {
+	list-style: none;
+	padding: 0;
+	margin: 0;
+}
+
+.mapplic-list-container li {
+	border-color: inherit;
+	margin-bottom: 10px;
+}
+
+.mapplic-list-category > a,
+.mapplic-list-category > a:hover,
+.mapplic-list-category > a:focus {
+	background-color: #aaa;
+	color: #fff;
+	display: block;
+	font-size: 16px;
+	line-height: 26px;
+	padding: 12px 12px 12px 12px;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	box-sizing: border-box;
+}
+
+.mapplic-list-category ol {
+	border-bottom: 3px solid #eee !important;
+}
+
+.mapplic-list-thumbnail {
+	border-radius: 2px;
+	float: left;
+	margin-right: 10px;
+}
+
+.mapplic-list-category > a .mapplic-list-count {
+	background-color: rgba(0, 0, 0, 0.1);
+	border-radius: 2px;
+	float: right;
+	font-size: 12px;
+	line-height: 20px;
+	padding: 0 6px;
+	margin-left: 10px;
+	text-align: center;
+	margin-top: 4px;
+}
+
+.mapplic-list-location > a {
+	background-color: #fff;
+	border-left: 2px solid transparent;
+	border-bottom: 1px solid #eee;
+	display: block;
+	font-size: 14px;
+	padding: 10px;
+	min-height: 50px;
+	-webkit-transition: border-color 0.2s;
+	-moz-transition: border-color 0.2s;
+	transition: border-color 0.2s;
+}
+
+.mapplic-list-location > a:hover {
+	background-color: #fdfdfd;
+	border-left: 2px solid;
+	border-color: inherit;
+	border-bottom: 1px solid #eee;
+}
+
+.mapplic-list-location h4 {
+	color: #444;
+	font-size: 14px;
+	font-weight: normal;
+	margin: 4px 0 8px 0;
+}
+
+.mapplic-list-location span {
+	color: #bbb;
+	font-size: 13px;
+	font-weight: normal;
+}
+
+/* Tooltip */
+.mapplic-tooltip {
+	background-color: #fff;
+	box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
+	display: none;
+	max-width: 280px;
+	min-width: 120px;
+	margin-top: -76px;
+	padding: 10px 14px;
+	position: absolute;
+}
+
+.mapplic-tooltip-title {
+	color: #444;
+	font-size: 16px;
+	font-weight: normal;
+	margin: 0 0 16px 0;
+}
+
+.mapplic-hovertip {
+	min-width: 50px;
+	pointer-events: none;
+}
+
+.mapplic-hovertip .mapplic-tooltip-title {
+	margin: 0;
+}
+
+.mapplic-tooltip-content {
+	max-height: 160px;
+}
+
+.mapplic-tooltip-description,
+.mapplic-tooltip p {
+	color: #bbb;
+	font-size: 13px;
+	line-height: 16px;
+}
+
+.mapplic-tooltip-link {
+	background-color: #ccc;
+	color: #fff !important;
+	float: right;
+	font-size: 14px;
+	line-height: 26px;
+	padding: 0 8px;
+	margin-top: 10px;
+}
+
+.mapplic-tooltip-link:hover {
+	background-color: #aaa;
+}
+
+.mapplic-tooltip img {
+	max-width: 100%;
+}
+
+.mapplic-tooltip-triangle {
+	background-image: url(images/tooltip-triangle.png);
+	width: 14px;
+	height: 6px;
+	position: absolute;
+	bottom: 0;
+	left: 50%;
+	margin-bottom: -6px;
+	margin-left: -7px;
+}
+
+.mapplic-tooltip-close {
+	background-color: #eee;
+	background-image: url(images/cross.png);
+	background-position: center;
+	background-repeat: no-repeat;
+	background-color: transparent;
+	border: none;
+	cursor: pointer;
+	float: right;
+	margin: 0 -4px 0 0;
+	width: 10px;
+	height: 10px;
+}
+
+/* Coordinates */
+.mapplic-coordinates {
+	background-color: rgba(255, 255, 255, 0.9);
+	color: #333;
+	position: absolute;
+	margin: 10px;
+	margin-left: -80px;
+	padding: 4px 6px;
+	font-size: 14px;
+	top: 0;
+	left: 50%;
+	pointer-events: none;
+}
+
+/* Sidebar addition */
+.mapplic-sidebar-add {
+	font-size: 13px;
+}

libraries/framework/vendor/plugins/mapplic/mapplic/mapplic.js

@@ -0,0 +1,935 @@
+/**
+ * Mapplic - Custom Interactive Map Plugin by @sekler
+ * http://www.mapplic.com 
+ */
+
+(function($) {
+
+	var Mapplic = function() {
+		var self = this;
+
+		self.o = {
+			source: 'locations.json',
+			height: 420,
+			locations: true,
+			minimap: true,
+			sidebar: true,
+			deeplinking: true,
+			search: true,
+			clearbutton: true,
+			hovertip: true,
+			fullscreen: false,
+			developer: false,
+			animate: true,
+			maxscale: 4,
+			sidebarAdd: undefined
+		};
+
+		self.init = function(el, params) {
+			// Extend options
+			self.o = $.extend(self.o, params);
+
+			self.x = 0;
+			self.y = 0;
+			self.scale = 1;
+
+			self.el = el.addClass('mapplic-element mapplic-loading').height(self.o.height);
+
+			// Process JSON file
+			$.getJSON(self.o.source, function(data) { // Success
+				processData(data);
+				self.el.removeClass('mapplic-loading');
+
+				// Controls
+				addControls();
+
+			}).fail(function() { // Failure: couldn't load JSON file, or it is invalid.
+				console.error('Couldn\'t load map data. (Make sure you are running the script through a server and not just opening the html file with your browser)');
+				alert('Data file missing or invalid!');
+			});
+
+			return self;
+		}
+
+		// Tooltip
+		function Tooltip() {
+			this.el = null;
+			this.shift = 6;
+			this.drop = 0;
+
+			this.init = function() {
+				var s = this;
+
+				// Construct
+				this.el = $('<div></div>').addClass('mapplic-tooltip');
+				$('<a></a>').addClass('mapplic-tooltip-close').attr('href', '#').click(function(e) {
+					e.preventDefault();
+					self.deeplinking.clear();
+					s.hide();
+				}).appendTo(this.el);
+				this.image = $('<img>').addClass('mapplic-tooltip-image').hide().appendTo(this.el);
+				this.title = $('<h4></h4>').addClass('mapplic-tooltip-title').appendTo(this.el);
+				this.content = $('<div></div>').addClass('mapplic-tooltip-content').appendTo(this.el);
+				this.desc = $('<div></div>').addClass('mapplic-tooltip-description').appendTo(this.content);
+				this.link = $('<a>More</a>').addClass('mapplic-tooltip-link').attr('href', '#').hide().appendTo(this.el);
+				$('<div></div>').addClass('mapplic-tooltip-triangle').prependTo(this.el);
+
+				// Append
+				self.map.append(this.el);
+			}
+
+			this.set = function(location) {
+				if (location) {
+					if (location.action == 'none') {
+						this.el.stop().fadeOut(300);
+						return;
+					}
+
+					var s = this;
+
+					if (location.image) this.image.attr('src', location.image).show();
+					else this.image.hide();
+
+					if (location.link) this.link.attr('href', location.link).show();
+					else this.link.hide();
+
+					this.title.text(location.title);
+					this.desc.html(location.description);
+
+					// Shift
+					var pinselect = $('.mapplic-pin[data-location="' + location.id + '"]');
+					if (pinselect.length == 0) {
+						this.shift = 6;
+					}
+					else this.shift = pinselect.height() + 6;
+
+					// Loading & positioning
+					$('img', this.desc).load(function() {
+						s.position(location);
+					});
+
+					this.position(location);
+				}
+			}
+
+			this.show = function(location) {
+				if (location) {
+					if (location.action == 'none') {
+						this.el.stop().fadeOut(300);
+						return;
+					}
+
+					var s = this;
+
+					if (location.image) this.image.attr('src', location.image).show();
+					else this.image.hide();
+
+					if (location.link) this.link.attr('href', location.link).show();
+					else this.link.hide();
+
+					this.title.text(location.title);
+					this.desc.html(location.description);
+
+					// Shift
+					var pinselect = $('.mapplic-pin[data-location="' + location.id + '"]');
+					if (pinselect.length == 0) {
+						this.shift = 6;
+					}
+					else this.shift = pinselect.height() + 6;
+
+					// Loading & positioning
+					$('img', this.desc).load(function() {
+						s.position(location);
+					});
+
+					this.position(location);
+				
+					// Making it visible
+					this.el.stop().fadeIn(200).show();
+				}
+			}
+
+			this.position = function(location) {
+				var x = location.x * 100;
+					y = location.y * 100;
+					mt = -this.el.outerHeight() - this.shift,
+					ml = -this.el.outerWidth() / 2;
+				this.el.css({
+					left: x + '%',
+					top: y + '%',
+					marginTop: mt,
+					marginLeft: ml
+				});
+				this.drop = this.el.outerHeight() + this.shift;
+			}
+
+			this.hide = function() {
+				var s = this;
+				
+				this.el.stop().fadeOut(300, function() {
+					s.desc.empty();
+				});
+			}
+		}
+
+		// Deeplinking
+		function Deeplinking() {
+			this.init = function() {
+				// Check hash for location
+				var id = location.hash.slice(1);
+				if (id) {
+					var locationData = getLocationData(id);
+
+					self.tooltip.set(locationData);
+					showLocation(id, 0);
+					self.tooltip.show(locationData);
+				}
+				else zoomTo(0.5, 0.5, 1, 0);
+
+				// Hashchange
+				$(window).on('hashchange', function() {
+					var id = location.hash.slice(1);
+
+					if (id) {
+						var locationData = getLocationData(id);
+
+						self.tooltip.set(locationData);
+						showLocation(id, 800);
+						self.tooltip.show(locationData);
+					}
+				});
+			}
+
+			this.clear = function() {
+				// if IE 6-8, else normal browsers
+				if (history.pushState) history.pushState('', document.title, window.location.pathname);
+				else window.location.hash = '';
+			}
+		}
+
+		// HoverTooltip
+		function HoverTooltip() {
+			this.el = null;
+			this.shift = 6;
+
+			this.init = function() {
+				var s = this;
+
+				// Construct
+				this.el = $('<div></div>').addClass('mapplic-tooltip mapplic-hovertip');
+				this.title = $('<h4></h4>').addClass('mapplic-tooltip-title').appendTo(this.el);
+				$('<div></div>').addClass('mapplic-tooltip-triangle').appendTo(this.el);
+
+				// Events
+				$(self.map).on('mouseover', '.mapplic-layer a', function() {
+					var data = '';
+					if ($(this).hasClass('mapplic-pin')) {
+						data = $(this).data('location');
+						s.shift = $(this).height() + 6;
+					}
+					else {
+						data = $(this).attr('xlink:href').slice(1);
+						s.shift = 6;
+					}
+
+					var location = getLocationData(data);
+					if (location) s.show(location);
+				}).on('mouseout', function() {
+					s.hide();
+				});
+
+				self.map.append(this.el);
+			}
+
+			this.show = function(location) {
+				this.title.text(location.title);
+
+				var x = location.x * 100,
+					y = location.y * 100,
+					mt = -this.el.outerHeight() - this.shift,
+					ml = -this.el.outerWidth() / 2;
+				this.el.css({
+					left: x + '%',
+					top: y + '%',
+					marginTop: mt,
+					marginLeft: ml
+				});
+
+				this.el.stop().fadeIn(100);
+			}
+
+			this.hide = function() {
+				this.el.stop().fadeOut(200);
+			}
+		}
+
+		// Minimap
+		function Minimap() {
+			this.el = null;
+
+			this.init = function() {
+				this.el = $('<div></div>').addClass('mapplic-minimap').appendTo(self.container);
+				this.el.css('height', this.el.width() * self.hw_ratio);
+				this.el.click(function(e) {
+					e.preventDefault();
+
+					var x = (e.pageX - $(this).offset().left) / $(this).width(),
+						y = (e.pageY - $(this).offset().top) / $(this).height();
+
+					zoomTo(x, y, self.scale / self.fitscale, 100);
+				});
+			}
+
+			this.addLayer = function(data) {
+				var layer = $('<div></div>').addClass('mapplic-minimap-layer').addClass(data.id).appendTo(this.el);
+				$('<img>').attr('src', data.minimap).addClass('mapplic-minimap-background').appendTo(layer);
+				$('<div></div>').addClass('mapplic-minimap-overlay').appendTo(layer);
+				$('<img>').attr('src', data.minimap).addClass('mapplic-minimap-active').appendTo(layer);
+			}
+
+			this.show = function(target) {
+				$('.mapplic-minimap-layer:visible', this.el).hide();
+				$('.mapplic-minimap-layer.' + target, this.el).show();
+			}
+
+			this.update = function(x, y) {
+				var active = $('.mapplic-minimap-active', this.el);
+
+				if (x === undefined) x = self.x;
+				if (y === undefined) y = self.y;
+
+				var width = Math.round(self.container.width() / self.contentWidth / self.scale * this.el.width()),
+					height = Math.round(self.container.height() / self.contentHeight / self.scale * this.el.height()),
+					top = Math.round(-y / self.contentHeight / self.scale * this.el.height()),
+					left = Math.round(-x / self.contentWidth / self.scale * this.el.width()),
+					right = left + width,
+					bottom = top + height;
+
+				active.css('clip', 'rect(' + top + 'px, ' + right + 'px, ' + bottom + 'px, ' + left + 'px)');
+			}
+		}
+
+		// Sidebar
+		function Sidebar() {
+			this.el = null;
+			this.list = null;
+
+			this.init = function() {
+				var s = this;
+
+				this.el = $('<div></div>').addClass('mapplic-sidebar').appendTo(self.el);
+
+				if (self.o.search) {
+					var form = $('<form></form>').addClass('mapplic-search-form').submit(function() {
+						return false;
+					}).appendTo(this.el);
+					self.clear = $('<button></button>').addClass('mapplic-search-clear').click(function() {
+						input.val('');
+						input.keyup();
+					}).appendTo(form);
+					var input = $('<input>').attr({'type': 'text', 'spellcheck': 'false', 'placeholder': 'Search for location...'}).addClass('mapplic-search-input').keyup(function() {
+						var keyword = $(this).val();
+						s.search(keyword);
+					}).prependTo(form);
+				}
+
+				var listContainer = $('<div></div>').addClass('mapplic-list-container').appendTo(this.el);
+				this.list = $('<ol></ol>').addClass('mapplic-list').appendTo(listContainer);
+				this.notfound = $('<p></p>').addClass('mapplic-not-found').text('Nothing found. Please try a different search.').appendTo(listContainer);
+
+				if (!self.o.search) listContainer.css('padding-top', '0');
+
+				if(self.o.sidebarAdd) {
+					//alert(self.o.sidebarAdd)
+					$(self.o.sidebarAdd).appendTo('.mapplic-list-container');
+				}
+
+				// if ($('.mapplic-contact').length) {
+				// 	$('.mapplic-contact').appendTo('.mapplic-list-container');
+				// }
+
+
+			}
+
+			this.addCategories = function(categories) {
+				var list = this.list;
+
+				$.each(categories, function(index, category) {
+					var item = $('<li></li>').addClass('mapplic-list-category').addClass(category.id);
+					var ol = $('<ol></ol>').css('border-color', category.color).appendTo(item);
+					if (category.show == 'false') ol.hide();
+					var link = $('<a></a>').attr('href', '#').attr('title', category.title).css('background-color', category.color).text(category.title).click(function(e) {
+						ol.slideToggle(200);
+						return false;
+					}).prependTo(item);
+					if (category.icon) $('<img>').attr('src', category.icon).addClass('mapplic-list-thumbnail').prependTo(link);
+					$('<span></span>').text('0').addClass('mapplic-list-count').prependTo(link);
+					list.append(item);
+				});
+			}
+
+			this.addLocation = function(data) {
+				var item = $('<li></li>').addClass('mapplic-list-location').addClass('mapplic-list-shown');
+				var link = $('<a></a>').attr('href', '#' + data.id).appendTo(item);
+				if (data.thumbnail) $('<img>').attr('src', data.thumbnail).addClass('mapplic-list-thumbnail').appendTo(link);
+				$('<h4></h4>').text(data.title).appendTo(link)
+				$('<span></span>').html(data.about).appendTo(link);
+				var category = $('.mapplic-list-category.' + data.category);
+
+				if (category.length) $('ol', category).append(item);
+				else this.list.append(item);
+
+				// Count
+				$('.mapplic-list-count', category).text($('.mapplic-list-shown', category).length);
+			}
+
+			this.search = function(keyword) {
+				if (keyword) self.clear.fadeIn(100);
+				else self.clear.fadeOut(100);
+
+				$('.mapplic-list li', self.el).each(function() {
+					if ($(this).text().search(new RegExp(keyword, "i")) < 0) {
+						$(this).removeClass('mapplic-list-shown');
+						$(this).slideUp(200);
+					} else {
+						$(this).addClass('mapplic-list-shown');
+						$(this).show();
+					}
+				});
+
+				$('.mapplic-list > li', self.el).each(function() {
+					var count = $('.mapplic-list-shown', this).length;
+					$('.mapplic-list-count', this).text(count);
+				});
+
+				// Show not-found text
+				if ($('.mapplic-list > li.mapplic-list-shown').length > 0) this.notfound.fadeOut(200);
+				else this.notfound.fadeIn(200);
+			}
+		}
+
+		// Developer tools
+		function DevTools() {
+			this.el = null;
+
+			this.init = function() {
+				this.el = $('<div></div>').addClass('mapplic-coordinates').appendTo(self.container);
+				this.el.append('x: ');
+				$('<code></code>').addClass('mapplic-coordinates-x').appendTo(this.el);
+				this.el.append(' y: ');
+				$('<code></code>').addClass('mapplic-coordinates-y').appendTo(this.el);
+
+				$('.mapplic-layer', self.map).on('mousemove', function(e) {
+					var x = (e.pageX - self.map.offset().left) / self.map.width(),
+						y = (e.pageY - self.map.offset().top) / self.map.height();
+					$('.mapplic-coordinates-x').text(parseFloat(x).toFixed(4));
+					$('.mapplic-coordinates-y').text(parseFloat(y).toFixed(4));
+				});
+			}
+		}
+
+		// Clear Button
+		function ClearButton() {
+			this.el = null;
+			
+			this.init = function() {
+				this.el = $('<a></a>').attr('href', '#').addClass('mapplic-clear-button').click(function(e) {
+					e.preventDefault();
+					self.deeplinking.clear();
+					self.tooltip.hide();
+					zoomTo(0.5, 0.5, 1);
+				}).appendTo(self.container);
+			}
+		}
+
+		// Full Screen
+		function FullScreen() {
+			this.el = null;
+
+			this.init = function() {
+				var s = this;
+				this.element = self.el[0];
+
+				$('<a></a>').attr('href', '#').attr('href', '#').addClass('mapplic-fullscreen-button').click(function(e) {
+					e.preventDefault();
+
+					if (s.isFull()) s.exitFull();
+					else s.goFull();
+
+				}).appendTo(self.container);
+			}
+
+			this.goFull = function() {
+				if (this.element.requestFullscreen) this.element.requestFullscreen();
+				else if(this.element.mozRequestFullScreen) this.element.mozRequestFullScreen();
+				else if(this.element.webkitRequestFullscreen) this.element.webkitRequestFullscreen();
+				else if(this.element.msRequestFullscreen) this.element.msRequestFullscreen();
+			}
+
+			this.exitFull = function() {
+				if (document.exitFullscreen) document.exitFullscreen();
+				else if(document.mozCancelFullScreen) document.mozCancelFullScreen();
+				else if(document.webkitExitFullscreen) document.webkitExitFullscreen();
+			}
+
+			this.isFull = function() {
+				if (window.innerHeight == screen.height) {
+					return true;
+				} else {
+					return false;
+				}
+			}
+		}
+
+		// Functions
+		var processData = function(data) {
+			self.data = data;
+			var nrlevels = 0;
+			var shownLevel;
+
+			self.container = $('<div></div>').addClass('mapplic-container').appendTo(self.el);
+			self.map = $('<div></div>').addClass('mapplic-map').appendTo(self.container);
+
+			self.levelselect = $('<select></select>').addClass('mapplic-levels-select');
+
+			if (!self.o.sidebar) self.container.css('width', '100%');
+
+			self.contentWidth = data.mapwidth;
+			self.contentHeight = data.mapheight;
+
+			self.hw_ratio = data.mapheight / data.mapwidth;
+			if (data.mapheight / self.container.height() > data.mapwidth / self.container.width()) {
+				self.min_width = self.container.width();
+				self.min_height = self.container.width() * self.hw_ratio;
+			}
+			else {
+				self.min_height = self.container.height();
+				self.min_width = self.container.height() / self.hw_ratio;
+			}
+
+			self.map.css({
+				'width': data.mapwidth,
+				'height': data.mapheight
+			});
+
+			// Create minimap
+			if (self.o.minimap) {
+				self.minimap = new Minimap();
+				self.minimap.init();
+			}
+
+			// Create sidebar
+			if (self.o.sidebar) {
+				self.sidebar = new Sidebar();
+				self.sidebar.init();
+				self.sidebar.addCategories(data.categories);
+			}
+
+			// Iterate through levels
+			if (data.levels) {
+				$.each(data.levels, function(index, value) {
+					var source = value.map;
+					var extension = source.substr((source.lastIndexOf('.') + 1)).toLowerCase();
+
+					// Create new map layer
+					var layer = $('<div></div>').addClass('mapplic-layer').addClass(value.id).hide().appendTo(self.map);
+					switch (extension) {
+
+						// Image formats
+						case 'jpg': case 'jpeg': case 'png': case 'gif':
+							$('<img>').attr('src', source).addClass('mapplic-map-image').appendTo(layer);
+							break;
+
+						// Vector format
+						case 'svg':
+							$('<div></div>').addClass('mapplic-map-image').load(source).appendTo(layer);
+							break;
+
+						// Other 
+						default:
+							alert('File type ' + extension + ' is not supported!');
+					}
+
+					// Create new minimap layer
+					if (self.minimap) self.minimap.addLayer(value);
+
+					// Build layer control
+					self.levelselect.prepend($('<option></option>').attr('value', value.id).text(value.title));
+
+					if (!shownLevel || value.show) {
+						shownLevel = value.id;
+					}
+					
+					/* Iterate through locations */
+					$.each(value.locations, function(index, value) {
+						var top = value.y * 100;
+						var left = value.x * 100;
+
+						if (value.pin != 'hidden') {
+							if (self.o.locations) {
+								var target = '#' + value.id;
+								if (value.action == 'redirect') target = value.link;
+
+								var pin = $('<a></a>').attr('href', target).addClass('mapplic-pin').css({'top': top + '%', 'left': left + '%'}).appendTo(layer);
+								pin.attr('data-location', value.id);
+								pin.addClass(value.pin);
+							}
+						}
+
+						if (self.sidebar) self.sidebar.addLocation(value);
+					});
+
+					nrlevels++;
+				});
+			}
+
+			// Pin animation
+			if (self.o.animate) {
+				$('.mapplic-pin').css('opacity', '0');
+				window.setTimeout(animateNext, 200);
+			}
+
+			function animateNext() {
+				var select = $('.mapplic-pin:not(.mapplic-animate):visible');
+
+				//console.log('enter');
+
+				if (select.length > 0) {
+					select.first().addClass('mapplic-animate');
+					window.setTimeout(animateNext, 200);
+				}
+				else {
+					$('.mapplic-animate').removeClass('mapplic-animate');
+					$('.mapplic-pin').css('opacity', '1');
+				}
+			}
+
+			// COMPONENTS
+
+			// Hover Tooltip
+			if (self.o.hovertip) self.hovertip = new HoverTooltip().init();
+
+			// Tooltip
+			self.tooltip = new Tooltip();
+			self.tooltip.init();
+
+			// Developer tools
+			if (self.o.developer) self.devtools = new DevTools().init();
+
+			// Clear button
+			if (self.o.clearbutton) self.clearbutton = new ClearButton().init();
+
+			// Fullscreen
+			if (self.o.fullscreen) self.fullscreen = new FullScreen().init();
+
+			// Levels
+			if (nrlevels > 1) {
+				self.levels = $('<div></div>').addClass('mapplic-levels');
+				var up = $('<a href="#"></a>').addClass('mapplic-levels-up').appendTo(self.levels);
+				self.levelselect.appendTo(self.levels);
+				var down = $('<a href="#"></a>').addClass('mapplic-levels-down').appendTo(self.levels);
+				self.container.append(self.levels);
+			
+				self.levelselect.change(function() {
+					var value = $(this).val();
+					level(value);
+				});
+			
+				up.click(function(e) {
+					e.preventDefault();
+					if (!$(this).hasClass('disabled')) level('+');
+				});
+
+				down.click(function(e) {
+					e.preventDefault();
+					if (!$(this).hasClass('disabled')) level('-');
+				});
+			}
+			level(shownLevel);
+
+			// Browser resize
+			$(window).resize(function() {
+				var wr = self.container.width() / self.contentWidth,
+					hr = self.container.height() / self.contentHeight;
+
+				if (wr > hr) self.fitscale = wr;
+				else self.fitscale = hr;
+
+				self.scale = normalizeScale(self.scale);
+				self.x = normalizeX(self.x);
+				self.y = normalizeY(self.y);
+
+				moveTo(self.x, self.y, self.scale, 100);
+			}).resize();
+
+			// Deeplinking
+			if (self.o.deeplinking) {
+				self.deeplinking = new Deeplinking();
+				self.deeplinking.init();
+			}
+		}
+
+		var addControls = function() {
+			var map = self.map,
+				mapbody = $('.mapplic-map-image', self.map);
+
+			document.ondragstart = function() { return false; } // IE drag fix
+
+			// Drag & drop
+			mapbody.on('mousedown', function(event) {
+				map.stop();
+
+				map.data('mouseX', event.pageX);
+				map.data('mouseY', event.pageY);
+				map.data('lastX', self.x);
+				map.data('lastY', self.y);
+
+				map.addClass('mapplic-dragging');
+
+				self.map.on('mousemove', function(event) {
+					var x = event.pageX - map.data('mouseX') + self.x;
+						y = event.pageY - map.data('mouseY') + self.y;
+
+					x = normalizeX(x);
+					y = normalizeY(y);
+
+					moveTo(x, y);
+					map.data('lastX', x);
+					map.data('lastY', y);
+				});
+			
+				$(document).on('mouseup', function(event) {
+					self.x = map.data('lastX');
+					self.y = map.data('lastY');
+
+					self.map.off('mousemove');
+					$(document).off('mouseup');
+
+					map.removeClass('mapplic-dragging');
+				});
+			});
+
+			// Double click
+			$(document).on('dblclick', '.mapplic-map-image', function(event) {
+				var mapPos = self.map.offset();
+				var x = (event.pageX - mapPos.left) / self.map.width();
+				var y = (event.pageY - mapPos.top) / self.map.height();
+				var z = self.map.width() / self.min_width * 2;
+
+				zoomTo(x, y, z, 600);
+			});
+
+			// Mousewheel
+			$('.mapplic-layer', this.el).bind('mousewheel DOMMouseScroll', function(event, delta) {
+				event.preventDefault();
+
+				var scale = self.scale;
+				self.scale = normalizeScale(scale + scale * delta/5);
+
+				self.x = normalizeX(self.x - (event.pageX - self.container.offset().left - self.x) * (self.scale/scale - 1));
+				self.y = normalizeY(self.y - (event.pageY - self.container.offset().top - self.y) * (self.scale/scale - 1));
+
+				moveTo(self.x, self.y, self.scale, 100);
+			});
+
+			// Touch support
+			if (!('ontouchstart' in window || 'onmsgesturechange' in window)) return true;
+
+			mapbody.on('touchstart', function(e) {
+				var orig = e.originalEvent,
+					pos = map.position();
+
+				map.data('touchY', orig.changedTouches[0].pageY - pos.top);
+				map.data('touchX', orig.changedTouches[0].pageX - pos.left);
+
+				mapbody.on('touchmove', function(e) {
+					e.preventDefault();
+					var orig = e.originalEvent;
+					var touches = orig.touches.length;
+
+					if (touches == 1) {
+						self.x = normalizeX(orig.changedTouches[0].pageX - map.data('touchX'));
+						self.y = normalizeY(orig.changedTouches[0].pageY - map.data('touchY'));
+
+						moveTo(self.x, self.y, self.scale, 100);
+					}
+					else {
+						mapbody.off('touchmove');
+					}
+				});
+
+				mapbody.on('touchend', function(e) {
+					mapbody.off('touchmove touchend');
+				});
+			});
+			
+			// Pinch zoom
+			var mapPinch = Hammer(self.map[0], {
+				transform_always_block: true,
+				drag_block_horizontal: true,
+				drag_block_vertical: true
+			});
+
+			var scale=1, last_scale;
+
+			mapPinch.on('touch transform', function(ev) {
+				switch(ev.type) {
+					case 'touch':
+						last_scale = scale;
+						break;
+
+					case 'transform':
+						var center = ev.gesture.center;
+						scale = Math.max(1, Math.min(last_scale * ev.gesture.scale, 10));
+
+						var oldscale = self.scale;
+						self.scale = normalizeScale(scale * self.fitscale);
+
+						self.x = normalizeX(self.x - (center.pageX - self.container.offset().left - self.x) * (self.scale/oldscale - 1));
+						self.y = normalizeY(self.y - (center.pageY - self.container.offset().top - self.y) * (self.scale/oldscale - 1));
+
+						moveTo(self.x, self.y, self.scale, 200);
+
+						break;
+				}
+			});
+		}
+
+		var level = function(target) {
+			switch (target) {
+				case '+':
+					target = $('option:selected', self.levelselect).removeAttr('selected').prev().prop('selected', 'selected').val();
+					break;
+				case '-':
+					target = $('option:selected', self.levelselect).removeAttr('selected').next().prop('selected', 'selected').val();
+					break;
+				default:
+					$('option[value="' + target + '"]', self.levelselect).prop('selected', 'selected');
+			}
+
+			var layer = $('.mapplic-layer.' + target, self.map);
+
+			// Target layer is active
+			if (layer.is(':visible')) return;
+
+			// Hide Tooltip
+			self.tooltip.hide();
+
+			// Show target layer
+			$('.mapplic-layer:visible', self.map).hide();
+			layer.show();
+
+			// Show target minimap layer
+			if (self.minimap) self.minimap.show(target);
+
+			// Update control
+			var index = self.levelselect.get(0).selectedIndex,
+				up = $('.mapplic-levels-up', self.levels),
+				down = $('.mapplic-levels-down', self.levels);
+
+			up.removeClass('disabled');
+			down.removeClass('disabled');
+			if (index == 0) {
+				up.addClass('disabled');
+			}
+			else if (index == self.levelselect.get(0).length - 1) {
+				down.addClass('disabled');
+			}
+		}
+
+		var getLocationData = function(id) {
+			var data = null;
+			$.each(self.data.levels, function(index, layer) {
+				$.each(layer.locations, function(index, value) {
+					if (value.id == id) {
+						data = value;
+					}
+				});
+			});
+			return data;
+		}
+
+		var showLocation = function(id, duration) {
+			$.each(self.data.levels, function(index, layer) {
+				$.each(layer.locations, function(index, value) {
+					if (value.id == id) {
+						var zoom = typeof value.zoom !== 'undefined' ? value.zoom : 4,		
+							drop = self.tooltip.drop / self.contentHeight / zoom;
+
+						level(layer.id);
+
+						zoomTo(value.x, parseFloat(value.y) - drop, zoom, duration, 'easeInOutCubic');
+					}
+				});
+			});
+		};
+
+		var normalizeX = function(x) {
+			var minX = self.container.width() - self.contentWidth * self.scale;
+
+			if (x > 0) x = 0;
+			else if (x < minX) x = minX;
+
+			return x;
+		}
+
+		var normalizeY = function(y) {
+			var minY = self.container.height() - self.contentHeight * self.scale;
+
+			if (y >= 0) y = 0;
+			else if (y < minY) y = minY;
+
+			return y;
+		}
+
+		var normalizeScale = function(scale) {
+			if (scale < self.fitscale) scale = self.fitscale;
+			else if (scale > self.o.maxscale) scale = self.o.maxscale;
+
+			return scale;
+		}
+
+		var zoomTo = function(x, y, s, duration, easing) {
+			duration = typeof duration !== 'undefined' ? duration : 400;
+
+			self.scale = normalizeScale(self.fitscale * s);
+			var scale = self.contentWidth * self.scale;
+
+			self.x = normalizeX(self.container.width() * 0.5 - self.scale * self.contentWidth * x);
+			self.y = normalizeY(self.container.height() * 0.5 - self.scale * self.contentHeight * y);
+
+			moveTo(self.x, self.y, self.scale, duration, easing);
+		}
+
+		var moveTo = function(x, y, scale, d, easing) {
+			if (scale !== undefined) {
+				self.map.stop().animate({
+					'left': x,
+					'top': y,
+					'width': self.contentWidth * scale,
+					'height': self.contentHeight * scale
+				}, d, easing);
+			}
+			else {
+				self.map.css({
+					'left': x,
+					'top': y
+				});
+			}
+			if (self.minimap) self.minimap.update(x, y);
+		}
+	};
+
+	//  Create a jQuery plugin
+	$.fn.mapplic = function(params) {
+		var len = this.length;
+
+		return this.each(function(index) {
+			var me = $(this),
+				key = 'mapplic' + (len > 1 ? '-' + ++index : ''),
+				instance = (new Mapplic).init(me, params);
+
+			me.data(key, instance).data('key', key);
+		});
+	};
+})(jQuery);