Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Capture the IntelMap (Downloads an image of the current map)
// ==UserScript==
// @id iitc-plugin-CaptureMap@spiralray
// @name IITC plugin: CaptureMap
// @category Info
// @version 0.0.2
// @namespace https://www.spiralray.net/iitc_plugin/
// @description [spiralray-2016-11-23-235400] Capture 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*
// @include https://*.ingress.com/intel*
// @match https://*.ingress.com/intel*
// @include https://www.ingress.com/mission/*
// @include http://www.ingress.com/mission/*
// @match https://www.ingress.com/mission/*
// @match http://www.ingress.com/mission/*
// @grant none
// ==/UserScript==
function wrapper(plugin_info) {
// ensure plugin framework is there, even if iitc is not yet loaded
if (typeof window.plugin !== 'function') window.plugin = function () { };
//PLUGIN AUTHORS: writing a plugin outside of the IITC build environment? if so, delete these lines!!
//(leaving them in place might break the 'About IITC' page or break update checks)
plugin_info.buildName = 'spiralray';
plugin_info.dateTimeVersion = '0.0.1';
plugin_info.pluginId = 'CaptureMap';
//END PLUGIN AUTHORS NOTE
// PLUGIN START ////////////////////////////////////////////////////////
/* whatsnew
* 0.0.1 : initial release
*/
window.plugin.capturemap = function() {};
window.plugin.capturemap.capture = function() {
var mapPane = $(".leaflet-map-pane")[0];
var mapTransform = mapPane.style.transform.replace("translate3d(", "").split(",");
var mapX = parseFloat(mapTransform[0].replace("px", ""));
var mapY = parseFloat(mapTransform[1].replace("px", ""));
mapPane.style.transform = "translate3d(0px,0px,0px)";
var myTiles = $("img.leaflet-tile");
var tilesLeft = [];
var tilesTop = [];
for (var i = 0; i < myTiles.length; i++) {
tilesLeft.push(parseFloat(myTiles[i].style.left.replace("px", "")));
tilesTop.push(parseFloat(myTiles[i].style.top.replace("px", "")));
myTiles[i].style.left = (tilesLeft[i] + mapX) + "px";
myTiles[i].style.top = (tilesTop[i] + mapY) + "px";
}
var myDivicons = $(".leaflet-marker-icon");
var dx = [];
var dy = [];
var mLeft = [];
var mTop = [];
for (var i = 0; i < myDivicons.length; i++) {
mLeft.push(parseFloat(myDivicons[i].style.marginLeft.replace("px", "")));
mTop.push(parseFloat(myDivicons[i].style.marginTop.replace("px", "")));
var curTransform = myDivicons[i].style.transform;
var splitTransform = curTransform.replace("translate3d(", "").split(",");
dx.push(parseFloat(splitTransform[0].replace("px", "")));
dy.push(parseFloat(splitTransform[1].replace("px", "")));
myDivicons[i].style.transform = "translate3d(" + (dx[i] + mLeft[i] + mapX) + "px, " + (dy[i] + mTop[i] + mapY) + "px, 0px)";
myDivicons[i].style.marginLeft = "0px";
myDivicons[i].style.marginTop = "0px";
}
var linesLayer = $(".leaflet-zoom-animated")[0];
var linesTransform = linesLayer.style.transform.replace("translate3d(", "").split(",");
var linesX = parseFloat(linesTransform[0].replace("px", ""));
var linesY = parseFloat(linesTransform[1].replace("px", ""));
//linesLayer.style.transform = "translate3d(" + ((linesX + mapX) / 2) + "px," + ((linesY + mapY) / 2) + "px, 0px)";
linesLayer.style.transform = "translate3d(0px,0px,0px)";
linesLayer.style.left = (linesX + mapX) + "px";
linesLayer.style.top = (linesY + mapY) + "px";
html2canvas(document.getElementById("map"), {
useCORS: true,
onrendered: function(canvas) {
for (var i = 0; i < myTiles.length; i++) {
myTiles[i].style.left = (tilesLeft[i]) + "px";
myTiles[i].style.top = (tilesTop[i]) + "px";
}
for (var i = 0; i < myDivicons.length; i++) {
myDivicons[i].style.transform = "translate3d(" + dx[i] + "px, " + dy[i] + "px, 0)";
myDivicons[i].style.marginLeft = mLeft[i] + "px";
myDivicons[i].style.marginTop = mTop[i] + "px";
}
linesLayer.style.left = "0px";
linesLayer.style.top = "0px";
linesLayer.style.transform = "translate3d(" + (linesX) + "px," + (linesY) + "px, 0px)";
mapPane.style.transform = "translate3d(" + (mapX) + "px," + (mapY) + "px, 0px)";
var base64 = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
var bin = atob(base64.replace(/^.*,/, ''));
var buffer = new Uint8Array(bin.length);
for (var i = 0; i < bin.length; i++) {
buffer[i] = bin.charCodeAt(i);
}
var blob = new Blob([buffer.buffer], {
type: "image/jpeg"
});
var image_link = document.createElement('a');
//image_link.href = base64;
image_link.href = window.URL.createObjectURL(blob);
var date = new Date();
var latlng = map.getCenter();
var zoom = map.getZoom();
image_link.download = [ date.getFullYear(), ( '0' + (date.getMonth() + 1) ).slice( -2 ), ( '0' + date.getDate() ).slice( -2 ), ( '0' + date.getHours() ).slice( -2 ), ( '0' + date.getMinutes() ).slice( -2 ), ( '0' + date.getSeconds() ).slice( -2 ) ].join( '' )+'_'+Math.round(latlng.lat*1000000)+'_'+Math.round(latlng.lng*1000000)+'_'+zoom+'.jpg';
image_link.click();
}
});
}
var setup = function () {
$('#toolbox').append(' <a onclick="window.plugin.capturemap.capture();return false;">Capture</a>');
var head = document.getElementsByTagName('head')[0];
var script_h2c = document.createElement('script');
script_h2c.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-alpha2/html2canvas.min.js";
head.appendChild(script_h2c);
var script_h2csvg = document.createElement('script');
script_h2csvg.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-alpha2/html2canvas.svg.min.js";
head.appendChild(script_h2csvg);
//window.addHook('mapDataRefreshEnd', function() { setTimeout ( function() { window.plugin.capturemap.capture(); }, 3000); });
}
// PLUGIN END //////////////////////////////////////////////////////////
setup.info = plugin_info; //add the script info data to the function as a property
if (!window.bootPlugins) window.bootPlugins = [];
window.bootPlugins.push(setup);
// if IITC has already booted, immediately run the 'setup' function
if (window.iitcLoaded && typeof setup === 'function') setup();
} // wrapper end
// inject code into site context
var script = document.createElement('script');
var info = {};
if (typeof GM_info !== 'undefined' && GM_info && GM_info.script) info.script = { version: GM_info.script.version, name: GM_info.script.name, description: GM_info.script.description };
script.appendChild(document.createTextNode('(' + wrapper + ')(' + JSON.stringify(info) + ');'));
(document.body || document.head || document.documentElement).appendChild(script);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment