Raw Source Toggle Dropdown

• Minified Source

Kronos / chinese text toogle button

// ==UserScript==
// @name         chinese text toogle button
// @namespace    http://tampermonkey.net/
// @version      0.3
// @description  toogle button, left click original chinese right click translation
// @author       Kronos
// @match        http*://lnmtl.com/chapter/*
// @grant        none
// @license      MIT


// ==/UserScript==

/* eslint curly: "off"  */
/* global $ */

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

function findTopObject(elements) {
  var top = Number.POSITIVE_INFINITY;
  var off = 0;
  var obj = null;
  Array.from(elements).forEach(function(o) {
    var t = o.getBoundingClientRect(o).top;
    var b = o.getBoundingClientRect(o).bottom -50;
    if (t > 0.0 && top > t) {
      obj = o;
      top = t;
      off = t;
    }
    if (t <= 0.0 && b > 0.0 && top > b) {
      obj = o;
      top = b;
      off = t;
    }
  });
  return {element : obj, offset: off};
}

(function() {
    'use strict';

    var button = document.createElement("div");
    button.innerHTML = '<div class="dashhead-toolbar toolbar2" style="position: fixed; z-index: 7;"> <div class="dashhead-toolbar-item">  </div> <span class="dashhead-toolbar-divider hidden-xs"></span> <div class="btn-group btn-group-sm dashhead-toolbar-item"> <button class="btn js-toggle-original btn-default btnbtm2">ZND</button>  </div> </div>';
    document.getElementsByClassName("dashhead")[0].appendChild(button);
    $('.btnbtm2').unbind( "click" );
    $('.btnbtm2').on("contextmenu", function(evt) {evt.preventDefault();});
    $('body').on( "click",".btnbtm2", function() {
        var top = findTopObject($( '.translated' ));
        if ($('.js-toggle-original').hasClass('btn-primary')) {
            $('.btnbtm2').removeClass('btn-primary').addClass('btn-default');
            $('.js-toggle-original').not('.btnbtm2').first().trigger( "click" );
            // $('.original').animate({height: 'toggle', opacity: 'toggle'}, 0);
        }
        else {
           $('.btnbtm2').removeClass('btn-default').addClass('btn-primary');
           // $('.original').animate({height: 'toggle', opacity: 'toggle'}, 0);
           $('.js-toggle-original').not('.btnbtm2').first().trigger( "click" );
           $('.original').promise().done(function () {$('body').scrollTop( $(top.element).offset().top - top.offset);});
        }
    });
    $('body').on("contextmenu", ".btnbtm2", function(e){
        var top = findTopObject($( '.original' ));
        if ($('.js-toggle-translated').hasClass('btn-primary')) {
            $('.js-toggle-translated').not('.btnbtm2').first().trigger( "click" );
            // $('.translated').animate({height: 'toggle', opacity: 'toggle'}, 0);
        }
        else {
            $('.js-toggle-translated').not('.btnbtm2').first().trigger( "click" );
            // $('.translated').animate({height: 'toggle', opacity: 'toggle'}, 0);
        }
        $('.translated').promise().done(function () {$('body').scrollTop( $(top.element).offset().top - top.offset);});
        return false;
    });

    if ($('.chapter-options-select[data-type=chatLocation] :selected')[0].value == "floating")
      addGlobalStyle('.dashhead-toolbar.toolbar2 { position: fixed; right: 85px; bottom:26px !important;}');
    else
      addGlobalStyle('.dashhead-toolbar.toolbar2 { position: fixed; right: 60px; bottom:18px !important;}');
    addGlobalStyle('.container { max-width: 950px !important; }');
})();