// ==UserScript==
// @id             iitc-plugin-scaling@jamokoo
// @name           IITC plugin: scaling
// @category       Controls
// @version        0.2
// @namespace      https://github.com/jonatkins/ingress-intel-total-conversion
// @author         jamokoo
// @downloadURL    https://jaumon.000webhostapp.com/iitc/scaling.user.js
// @updateURL      https://jaumon.000webhostapp.com/iitc/scaling.user.js
// @description    [iitc-0.2] adds scaling to iitc. view can be scaled smaller than default. Restart of iitc recommended after changing scale.
// @include        https://*.ingress.com/intel*
// @include        http://*.ingress.com/intel*
// @match          https://*.ingress.com/intel*
// @match          http://*.ingress.com/intel*
// @grant          none
// @require        file://g:\projects\git\iitc\scaling.user.js
// ==/UserScript==

/*
ChangeLog:
0.2   Added scaling button to left of map.
      Added big buttons to settings dialog to use if scaled too small.
0.1   Initial Version.
 */

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 = 'release';
  plugin_info.dateTimeVersion = '2020-05-26-1';
  plugin_info.pluginId = 'scaleMod';
//END PLUGIN AUTHORS NOTE

  // use own namespace for plugin
  window.plugin.scaling = function() {};
  let thisPlugin = window.plugin.scaling;

  var setup = function() {
    thisPlugin.addScalingButton();

    const toolbox = document.getElementById('toolbox');

    const scalingOptions = document.createElement('a');
    scalingOptions.textContent = 'Scaling';
    scalingOptions.title = 'Scaling Options';
    scalingOptions.addEventListener('click', thisPlugin.showSettings);
    toolbox.appendChild(scalingOptions);

    if(localStorage.getItem('plugin-scaling') !== null) {
      let newValue = localStorage.getItem('plugin-scaling');

      let floatValue = parseFloat(newValue);
      if(floatValue < 0.4 || floatValue > 1) {
        //Do not allow invalid values
        newValue = '1.0';
        localStorage.setItem('plugin-scaling', newValue);
      }

      let newContent = "width=device-width, initial-scale=" + newValue + ", user-scalable=no";

      if($('meta').length == 0) {
        let meta = document.createElement('meta');
        meta.name = "viewport";
        meta.content = newContent;
        $('head').append(meta);
      } else {
        $('meta').attr("content", newContent);
      }
    }

  };

  thisPlugin.addScalingButton = function() {
    thisPlugin.locateButton = L.control({position: 'topleft'});
    thisPlugin.locateButton.onAdd = function (map) {
      var container = L.DomUtil.create('div', 'leaflet-scaling-button');
      $(container).append('<div class="leaflet-bar"><a href="javascript: void(0);" class="viewer-button"></a></div>');
      L.DomEvent.disableClickPropagation(container);
      $(container).on('click', function() {
        thisPlugin.showSettings();

      });

      return container;
    };

    thisPlugin.locateButton.addTo(map);

    cssData =
      ".leaflet-scaling-button a.viewer-button {\
        background-image: url('data:image/png;base64,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'); \
      };";
    $('<style>') .prop('type', 'text/css') .html(cssData).appendTo('head');
  };

  thisPlugin.showSettings = function () {
    let div = document.createElement('div');
    div.style.textAlign = "center";
    div.style.lineHeight = '200%';

    let sliderValue = document.createElement('div');
    sliderValue.id = 'sliderValue';
    sliderValue.style.fontSize = '20px';

    let currentSliderValue = '1.0';

    if(localStorage.getItem('plugin-scaling') !== null) {
      currentSliderValue = localStorage.getItem('plugin-scaling');
      console.log("read value " + currentSliderValue);
    }

    let decreaseButton = document.createElement('button');
    decreaseButton.innerHTML = "-";
    decreaseButton.style.padding = "15px 32px";
    decreaseButton.style.margin = "0px 8px";
    decreaseButton.style.fontSize = "40px";
    decreaseButton.onclick = function() {
      let slider = document.getElementById('scalingSlider');
      slider.stepDown();
      $('#sliderValue').text(parseFloat(slider.value).toFixed(1));
    };

    let increaseButton = document.createElement('button');
    increaseButton.innerHTML = "+";
    increaseButton.style.padding = "15px 32px";
    increaseButton.style.margin = "0px 8px";
    increaseButton.style.fontSize = "40px";
    increaseButton.onclick = function() {
      let slider = document.getElementById('scalingSlider');
      slider.stepUp();
      $('#sliderValue').text(parseFloat(slider.value).toFixed(1));
    };

    let input = document.createElement('input');
    input.type = 'range';
    input.min = '0.4';
    input.max = '1.0';
    input.step = '0.1';
    input.value = currentSliderValue;
    input.class = 'scalingSlider';
    input.id = 'scalingSlider';

    input.oninput = function() {
      $('#sliderValue').text(parseFloat(this.value).toFixed(1));
    };

    sliderValue.innerText = parseFloat(input.value).toFixed(1);

    let table = document.createElement('table');
    table.style.width = '100%';

    let firstRow = document.createElement('tr');
    let cell = document.createElement('td');
    cell.style.width = '25px';

    let scalingText = document.createElement('div');
    scalingText.innerText = "Scaling";
    scalingText.style.fontSize = '20px';

    cell.appendChild(scalingText);
    firstRow.appendChild(cell);

    cell = document.createElement('td');
    cell.style.width = '50px';

    cell.appendChild(input);

    firstRow.appendChild(cell);

    cell = document.createElement('td');
    cell.style.width = '20px';

    cell.appendChild(sliderValue);

    firstRow.appendChild(cell);

    table.appendChild(firstRow);

    let secondRow = document.createElement('tr');

    cell = document.createElement('td');
    cell.colSpan = 3;

    cell.appendChild(decreaseButton);
    cell.appendChild(increaseButton);

    secondRow.appendChild(cell);
    table.appendChild(secondRow);


    div.appendChild(table);

    dialog({
      id: 'plugin-scaling',
      html: div,
      buttons: [
        {
          text: 'Cancel',
          click: function () {
            $(this).dialog("close");
          },
          style: "margin-right:5px; padding: 16px 16px; font-size: 32px"
        },
        {
          text: 'OK',
          id: 'okok',
          click: function () {
            let readValue = $('#scalingSlider').val();
            console.log("Read value for saving " + readValue);
            localStorage.setItem('plugin-scaling', readValue);
            let newValue = "width=device-width, initial-scale=" + readValue + ", user-scalable=no";

            if($('meta').length == 0) {
              let meta = document.createElement('meta');
              meta.name = "viewport";
              meta.content = newValue;
              $('head').append(meta);
            } else {
              $('meta').attr("content", newValue);
            }

            $(this).dialog("close");
          },
          style: "margin-left:5px; padding: 16px 16px; font-size: 32px"
        }
        ,
        {
          text: 'OK',
          id: 'okid',
          click: function () {
            $(this).dialog("close");
          }
        }
      ],
      title: 'Scaling Settings',
    });

    $("#okid").hide();
    $(".ui-dialog-titlebar").hide();
  };

  setup.info = plugin_info; //add the script info data to the function as a property
  setup.priority = 'low';
  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);