diff --git a/dist/images/pan-down.png b/dist/images/pan-down.png new file mode 100644 index 00000000..b1792e48 Binary files /dev/null and b/dist/images/pan-down.png differ diff --git a/dist/images/pan-left.png b/dist/images/pan-left.png new file mode 100644 index 00000000..a8e9d938 Binary files /dev/null and b/dist/images/pan-left.png differ diff --git a/dist/images/pan-right.png b/dist/images/pan-right.png new file mode 100644 index 00000000..a4875633 Binary files /dev/null and b/dist/images/pan-right.png differ diff --git a/dist/images/pan-up.png b/dist/images/pan-up.png new file mode 100644 index 00000000..8018524a Binary files /dev/null and b/dist/images/pan-up.png differ diff --git a/external/L.Control.Pan.css b/external/L.Control.Pan.css new file mode 100644 index 00000000..e9002176 --- /dev/null +++ b/external/L.Control.Pan.css @@ -0,0 +1,112 @@ +.leaflet-control-pan { + /* + .leaflet-control-pan-right-wrap: right + + .leaflet-control-pan a: width + = 52 + 24 = 76 + */ + width: 76px; + /* + .leaflet-control-pan-down-wrap: top + + .leaflet-control-pan a: height + = 52 + 24 = 76 + */ + height: 76px; +} + +.leaflet-control-pan > div { + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; +} +.leaflet-control-pan > div { + border: 1px solid #888; + box-shadow: 0 0 8px rgba(0,0,0,0.4); +} +.leaflet-control-pan a { + background-color: rgba(255, 255, 255, 0.8); +} +.leaflet-control-pan a{ + background-position: 50% 50%; + background-repeat: no-repeat; + display: block; +} +.leaflet-control-pan a { + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + border-radius: 4px; + width: 22px; + height: 22px; +} +.leaflet-control-pan a:hover { + background-color: #fff; +} + +.leaflet-control-pan-up-wrap { + position:absolute; + left:26px; +} +.leaflet-control-pan-left-wrap { + position:absolute; + top:26px; +} +.leaflet-control-pan-right-wrap { + position:absolute; + left:52px; + top:26px; +} +.leaflet-control-pan-down-wrap { + position:absolute; + left:26px; + top:52px; +} + +.leaflet-control-pan-up { + background-image: url(@@INCLUDEIMAGE:images/pan-up.png@@); +} +.leaflet-control-pan-left { + background-image: url(@@INCLUDEIMAGE:images/pan-left.png@@); +} +.leaflet-control-pan-right { + background-image: url(@@INCLUDEIMAGE:images/pan-right.png@@); +} +.leaflet-control-pan-down { + background-image: url(@@INCLUDEIMAGE:images/pan-down.png@@); +} + +/****** Touch Alterations ******/ +.leaflet-touch .leaflet-control-pan div { + border: 4px solid rgba(0, 0, 0, 0.3); + box-shadow: none; + + border-radius: 10px; +} + +.leaflet-touch .leaflet-control-pan { + width: 89px; + height: 119px; +} + +.leaflet-touch .leaflet-control-pan a { + width: 30px; + height: 30px; + + border-radius: 7px; +} + +.leaflet-touch .leaflet-control-pan-up-wrap { + left:26px; +} + +.leaflet-touch .leaflet-control-pan-left-wrap { + top:40px; +} + +.leaflet-touch .leaflet-control-pan-right-wrap { + left:52px; + top:40px; +} + +.leaflet-touch .leaflet-control-pan-down-wrap { + left:26px; + top:80px; +} diff --git a/external/L.Control.Pan.js b/external/L.Control.Pan.js new file mode 100644 index 00000000..5fa3a917 --- /dev/null +++ b/external/L.Control.Pan.js @@ -0,0 +1,52 @@ +L.Control.Pan = L.Control.extend({ + options: { + position: 'topleft', + panOffset: 500 + }, + + onAdd: function (map) { + var className = 'leaflet-control-pan', + container = L.DomUtil.create('div', className), + off = this.options.panOffset; + + this._panButton('Up' , className + '-up' + , container, map, new L.Point( 0 , -off)); + this._panButton('Left' , className + '-left' + , container, map, new L.Point( -off , 0)); + this._panButton('Right', className + '-right' + , container, map, new L.Point( off , 0)); + this._panButton('Down' , className + '-down' + , container, map, new L.Point( 0 , off)); + + return container; + }, + + _panButton: function (title, className, container, map, offset, text) { + var wrapper = L.DomUtil.create('div', className + "-wrap", container); + var link = L.DomUtil.create('a', className, wrapper); + link.href = '#'; + link.title = title; + L.DomEvent + .on(link, 'click', L.DomEvent.stopPropagation) + .on(link, 'click', L.DomEvent.preventDefault) + .on(link, 'click', function(){ map.panBy(offset); }, map) + .on(link, 'dblclick', L.DomEvent.stopPropagation) + + return link; + } +}); + +L.Map.mergeOptions({ + panControl: true +}); + +L.Map.addInitHook(function () { + if (this.options.panControl) { + this.panControl = new L.Control.Pan(); + this.addControl(this.panControl); + } +}); + +L.control.pan = function (options) { + return new L.Control.Pan(options); +}; diff --git a/images/pan-down.png b/images/pan-down.png new file mode 100644 index 00000000..b1792e48 Binary files /dev/null and b/images/pan-down.png differ diff --git a/images/pan-left.png b/images/pan-left.png new file mode 100644 index 00000000..a8e9d938 Binary files /dev/null and b/images/pan-left.png differ diff --git a/images/pan-right.png b/images/pan-right.png new file mode 100644 index 00000000..a4875633 Binary files /dev/null and b/images/pan-right.png differ diff --git a/images/pan-up.png b/images/pan-up.png new file mode 100644 index 00000000..8018524a Binary files /dev/null and b/images/pan-up.png differ diff --git a/plugins/pan-control.user.js b/plugins/pan-control.user.js new file mode 100644 index 00000000..1a1f66ce --- /dev/null +++ b/plugins/pan-control.user.js @@ -0,0 +1,52 @@ +// ==UserScript== +// @id iitc-plugin-pan-control@fragger +// @name IITC plugin: pan control +// @version 0.1.0.@@DATETIMEVERSION@@ +// @namespace https://github.com/jonatkins/ingress-intel-total-conversion +// @updateURL @@UPDATEURL@@ +// @downloadURL @@DOWNLOADURL@@ +// @description [@@BUILDNAME@@-@@BUILDDATE@@] Shows a panning control on the map +// @include https://www.ingress.com/intel* +// @include http://www.ingress.com/intel* +// @match https://www.ingress.com/intel* +// @match http://www.ingress.com/intel* +// ==/UserScript== + +function wrapper() { +// ensure plugin framework is there, even if iitc is not yet loaded +if(typeof window.plugin !== 'function') window.plugin = function() {}; + + +// PLUGIN START //////////////////////////////////////////////////////// + + +// use own namespace for plugin +window.plugin.panControl = function() {}; + +window.plugin.panControl.setup = function() { + try { console.log('Loading Leaflet.Pancontrol JS now'); } catch(e) {} + @@INCLUDERAW:external/L.Control.Pan.js@@ + try { console.log('done loading Leaflet.Pancontrol JS'); } catch(e) {} + + window.map.addControl(L.control.pan({panOffset: 350})); + + $('head').append(''); +}; + +var setup = window.plugin.panControl.setup; + +// PLUGIN END ////////////////////////////////////////////////////////// + +if(window.iitcLoaded && typeof setup === 'function') { + setup(); +} else { + if(window.bootPlugins) + window.bootPlugins.push(setup); + else + window.bootPlugins = [setup]; +} +} // wrapper end +// inject code into site context +var script = document.createElement('script'); +script.appendChild(document.createTextNode('('+ wrapper +')();')); +(document.body || document.head || document.documentElement).appendChild(script); \ No newline at end of file