☰

EnstylerJS

MyDealz Enstyler Frontend and enhanced features

目前为 2016-11-20 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        EnstylerJS
  3. // @namespace   Enstyler
  4. // @description MyDealz Enstyler Frontend and enhanced features
  5. // @include     http://www.mydealz.de/*
  6. // @include     https://www.mydealz.de/*
  7. // @include     https://userstyles.org/styles/128262/*
  8. // @version     2.11.203
  9. // @grant       GM_getValue
  10. // @grant       GM_setValue
  11. // @grant       GM_log
  12. // @grant       GM_xmlhttpRequest
  13. // @require     http://code.jquery.com/jquery-3.1.1.min.js
  14. // @require     http://cdnjs.cloudflare.com/ajax/libs/jquery-throttle-debounce/1.1/jquery.ba-throttle-debounce.min.js
  15. // @require     http://openuserjs.org/src/libs/sizzle/GM_config.js
  16. // ==/UserScript==
  17.  
  18. // ========== INIT EnstylerJS =====================================
  19. // init Enstyler environment
  20. var enUserLogin = false;
  21. var enUserName = '';
  22. var USI=false;
  23. var EnstylerDelay=Date.now()
  24.  
  25. function EnstylerInit () {
  26.     // hide Enstyler2 CSS (c) text because we have a button now
  27.     addStyleString('.threadWidget-footer::after {display: none !important};');
  28.     
  29.     // get LoginStatus and Username
  30.     if (enUserLogin = $('.avatar--type-nav').length) {
  31.         enUserName = $('.navDropDown a').attr('href');
  32.         enUserName = enUserName.replace(/.*\profile\/(.+)\/overview$/,'$1');
  33.     }
  34.     
  35.     //check for USI - only firefox mobile usercript
  36.     if (GM_info.version.startsWith('0.')) {
  37.         USI=true;
  38.     }
  39. }
  40.  
  41.  
  42.  
  43.  
  44.  
  45. // add actions to tread overview @ some places ==================================
  46. function EnstylerDealActions() {
  47.  // if logged in ...
  48.  if (enUserLogin) {
  49.   // code used for MyDealz Dealz actions, thanks to mydealz :-)
  50.   var myOuterHtml  = [ '<span class="js-options bg--em bRad--a space--h-3 space--v-3 space--mt-3 text--b">', '</span>'];
  51.     
  52.   var enDealAction = [ '<a title="Sag was dazu" class="link ico ico--pos-l ico--type-comment-blue space--mr-3"'+ // comment 0+1+3
  53.                        'href="<ENSTYLER-HREF-HERE>#comment-form" data-handler="track" data-track="{&quot;action&quot;:&quot;scroll_to_comment_add_form&quot;,&quot;label&quot;:&quot;engagement&quot;}">',
  54.                        'Sag was dazu', '', '</a>',
  55.                        '<a title="Von Liste entfernen" class="link text--color-blue ico ico--type-bookmark-blue ico--pos-l space--mr-3"' + //un-bookmark 4+5+7
  56.                        'data-handler="track replace" data-replace="{&quot;endpoint&quot;:&quot;https:\/\/www.mydealz.de\/threads\/<ENSTYLER-THREADID-HERE>/remove&quot;,&quot;method&quot;:&quot;post&quot;}" data-track="{&quot;action&quot;:&quot;save_thread&quot;,&quot;label&quot;:&quot;engagement&quot;}">',
  57.                        'Von Liste entfernen', '', '</a>',
  58.                        '<a title="Bearbeiten" class="link text--color-blue ico ico--type-pencil-blue ico--pos-l space--mr-3"'+ // edit 8+9+11
  59.                        'href="<ENSTYLER-HREF-HERE>/edit" data-handler="track" data-track="{&quot;action&quot;:&quot;goto_thread_edit_form&quot;,&quot;beacon&quot;:true}">',
  60.                        'Bearbeiten', '', '</a>',
  61.                        '<a title="Abgelaufen?" class="thread-expire link ico ico--type-clock-blue ico--pos-l space--mr-3"'+  // expiried not working :-(
  62.                        'href="<ENSTYLER-HREF-HERE>/expire/report" rel="nofollow" data-handler="track replace" data-track="{&quot;action&quot;:&quot;report_expired_thread&quot;,&quot;label&quot;:&quot;contribution&quot;}" data-replace="{&quot;endpoint&quot;:&quot;https:\/\/www.mydealz.de\/<ENSTYLER-HREF-HERE>/expire\/report&quot;}">',
  63.                        'Abgelaufen?', '', '</a>',
  64.                      ];
  65.   var PATTERN = [ /<ENSTYLER-HREF-HERE>/g,     // pattern to replace by deal link ...
  66.                   /<ENSTYLER-THREADID-HERE>/g, // pattern to replace ID
  67.                 ]
  68.     
  69.   if (GM_config.get('enConfMoreDeal')) {
  70.     var parser = location; // parse location 
  71.     var pathname = parser.pathname;
  72.     var username = pathname.replace(/.*profile\//,'');
  73.     username = username.replace(/\/.*/,'');
  74.     var myText=0;
  75.     // no username ??
  76.     if (username == "") {
  77.         username = "unknown"; 
  78.     } else {
  79.        pathname = pathname.replace(username + '/',''); // remove username if path is longer
  80.     }  
  81.     // display short/no text?
  82.     if ($('.ico--type-grid-subNavActive').length) { myText=1; }
  83.         
  84.     // default for all Dealz: comment
  85.     var myAction = enDealAction[0]+ enDealAction[1+myText] + enDealAction[3];
  86.  
  87.     // Action for special locations only ===========
  88.     // saved Dealz panel 
  89.     if (pathname.endsWith('profile/saved-deals') ){
  90.         // add for user saved-dealz: un-bookmark
  91.         myAction += enDealAction[4]+ enDealAction[5+myText]; + enDealAction[7]
  92.     }
  93.     if (pathname.endsWith('profile/diskussion') || pathname.endsWith(username)){
  94.         // add user dealz and discussions: comment edit
  95.         myAction +=  enDealAction[8]+ enDealAction[9+myText] + enDealAction[11];
  96.     }
  97.  
  98.     // we have an Action to add to an Deal!
  99.     if (myAction != "") {
  100.         //GM_log('Action:' + myAction);
  101.         // every thread on thread page ...
  102.         $('article').each(function () {
  103.             // get ThreadID, Link to Deal and DealID
  104.             var myThread = $(this).attr('id');
  105.             if (!myThread.startsWith('thread_')) {return;}
  106.             
  107.             var myDealHref = $('#' + myThread + ' .thread-title a').attr('href');
  108.             var myDealID = myThread.replace('thread_','')
  109.             
  110.             if (myThread.startsWith('To be')) {return;}
  111.             
  112.             // compose final HTML
  113.             var newHtml= myOuterHtml[0] + myAction + myOuterHtml[1];
  114.             newHtml = newHtml.replace(PATTERN[0], myDealHref);
  115.             newHtml = newHtml.replace(PATTERN[1], myDealID);
  116.             
  117.             // append HTML to Deal
  118.             $('#' + myThread +' .thread-infoRow').each(function () {
  119.                 $(this).append(newHtml);
  120.                 $(this).removeClass('thread-infoRow');
  121.             });
  122.         }); 
  123.     }
  124.       
  125.     // actions for everywhere  ===========
  126.     // remove unwanted HTML from deal description
  127.     $('.thread--type-detail .userHtml').each(function () {
  128.         // userhtml code from mydalz, need to find jafascript to save automatically :-(
  129.         var enUserhtml = ['<div class="userHtml overflow--wrap-break space--t-3" data-handler="lightbox-xhr" data-lightbox-xhr="{&quot;name&quot;:&quot;threads&quot;}">',
  130.                           '</div>', // sourround deal description
  131.                          ];
  132.         // get inner html
  133.         var myHtml = $(this).html();
  134.  
  135.         // remove unwanted Stuff: combined <div><br><br> stuff, created by cut'npaste html
  136.         // not elegant, but works ...
  137.         var newHtml =  myHtml.replace(/<div>|<div><br>|<\/br>|<\/div>/gi,'');
  138.         newHtml =  newHtml.replace(/<br><br><br>|<br><br><br><br>|<br><br><br><br><br>/gi,'<br><br>');      
  139.         
  140.         // replace original with modifyed html
  141.         $(this).replaceWith(enUserhtml[0] + newHtml + enUserhtml[1]);        
  142.     });
  143.  
  144.   } // END enabled    
  145.  }
  146. }
  147.  
  148.  
  149. // show popup user info while click on avatar ... ======================
  150. function EnstylerAvatarPopup() {
  151.   // if logged in ...
  152.   if (enUserLogin) {
  153.     // code used for MyDealz avatar popup, thanks to mydealz :-)
  154.     var enPopupUser = ['<button data-handler="track popover" data-track="{&quot;action&quot;:&quot;show_short_user_profile&quot;,&quot;label&quot;:&quot;engagement&quot;}"data-popover="{&quot;endpoint&quot;:&quot;',
  155.                    '/short&quot;,&quot;target&quot;:&quot;#template-popoverLoader&quot;,&quot;layout&quot;:[{&quot;preset&quot;:&quot;e&quot;,&quot;y&quot;:&quot;50%&quot;,&quot;left&quot;:{&quot;offset&quot;:0},&quot;width&quot;:300,&quot;maxWidth&quot;:&quot;100%&quot;}]}">',
  156.                    '</button>',
  157.                    ];
  158.     // remove second image from cardview
  159.     if (GM_config.get('enConfUser')) { addStyleString('.thread-footer-cell a img.avatar.vAlign--all-m.space--mr-1.thread-avatar {display: none;}'); }
  160.  
  161.     // replace every avatar link without popup
  162.     if (GM_config.get('enConfUser')) {
  163.         $('.thread-footer-cell a.user.linkPlain, .user.linkPlain.thread-user').each(function () {
  164.             var Iam = $(this);
  165.             // get inner html and link to user profile
  166.             var myHtml = Iam.html();
  167.             var mysrc = Iam.attr('href');
  168.             
  169.             // seperate user name from image and add class user
  170.             var myAvatar1 = myHtml.replace(/<span.*/,'');
  171.             var myAvatar2 = myHtml.replace(/.*<span class=".* space--mr-1">/,'<span class=" space--mr-1 user link-plain">');
  172.  
  173.             // show small / medium sized Avatar
  174.             myAvatar1 =  myAvatar1.replace('avatar--type-s','avatar--type-m'); //in Dealz
  175.             if (GM_config.get('enConfAvatar')) { myAvatar1 =  myAvatar1.replace('thread-avatar','avatar--type-m'); } 
  176.             
  177.             // compose popup
  178.             var myPopup = enPopupUser[0] + Iam.attr('href') + enPopupUser[1] + myAvatar1 +  enPopupUser[2] + '<a href="' + Iam.attr('href') + '">'+ myAvatar2 + '</a>';
  179.             Iam.replaceWith(myPopup);
  180.         });
  181.     }
  182.   }  
  183. }
  184.  
  185.  
  186. // create select page or scrollwheel for page navigation =============
  187. var EnstylerPageEnum='enPageEnum';
  188. var selectList = document.createElement("select");
  189. selectList.id = EnstylerPageEnum;
  190. selectList.setAttribute('class', EnstylerPageEnum);
  191. selectList.onchange = EnstylerPageAction; 
  192.  
  193. var EnstylerPageEnumDown='enPageEnumDown';
  194. var selectListDown = document.createElement("select");
  195. selectListDown.id = EnstylerPageEnumDown;
  196. selectListDown.onchange = EnstylerPageAction; 
  197.  
  198. function EnstylerPagePickerCreate() {
  199.  // if enabled
  200.  if (GM_config.get('enConfPagePicker')) {
  201.    // init values and clear select list
  202.    var page=1;
  203.    var min=1;
  204.    var max=1;
  205.    $(selectList).empty();
  206.      
  207.    // get page and max from pagenav
  208.    if ( $('.text--color-charcoalTint').length ) {
  209.        // remove linebreaks
  210.        pageHtml = $('.text--color-charcoalTint').html().replace(/\r?\n|\r/g);
  211.        //locate actual page and last page
  212.        page = pageHtml.replace( /.*>Seite /i ,''); page = page.replace( /<.*/i , '');
  213.        max =  pageHtml.replace( /.*page=/ ,'');  max = max.replace( /[^0-9].*/i , '');
  214.        if (page == '') {page=1;}
  215.        if (max  == '') {max=page;}
  216.    }
  217.  
  218.    // create page select element
  219.    var x; var last; var option;
  220.  
  221.    for (x = min; x <= max; ) {
  222.        option = document.createElement("option");
  223.        option.text = x;
  224.        selectList.add(option); //selectListDown.add(option);
  225.        last = x;
  226.    
  227.        // non linear increment
  228.        var diff = Math.abs(x-page);
  229.  
  230.        if ( x < 10 || diff < 5) { x++; }
  231.        else if ( x < 1000 && diff > 600) { x += Math.floor(diff/100); }
  232.        else { x += Math.floor(diff/2); }
  233.    }
  234.    // add last page
  235.    if (page > max) { max=page;}
  236.    if (last < max ) {
  237.        option = document.createElement("option");
  238.        option.text = max;
  239.        selectList.add(option); //selectListDown.add(option);
  240.    }
  241.    // set default value
  242.    selectList.value = page; //selectListDown.value = page;
  243.  
  244.    // Deal Page
  245.    if ($('.voteBar').length) {
  246.        selectList.setAttribute('class', EnstylerPageEnum +' subNavMenu-link subNavMenu-btn voteBar--sticky-off--hide');
  247.        $('.voteBar--sticky-off--hide:last').before(selectList);
  248.      
  249.    } else {
  250.   
  251.        // overwiew page 
  252.         if (GM_config.get('enConfBtn')) {
  253.             // Place Picker in subnav
  254.             selectList.setAttribute('class', EnstylerPageEnum+' box--all-i subNavMenu-link subNavMenu-btn');
  255.             $('.subNav-label:last').before(selectList);
  256.         } else {
  257.             //place picker in MainNav
  258.             selectList.setAttribute('class', EnstylerPageEnum+' js-navDropDown-messages vAlign--all-m');
  259.             if ($('.test-loginButton').length) {
  260.                 $('.test-loginButton').before(selectList); 
  261.             } else {
  262.                 $('.js-navDropDown-messages').before(selectList);
  263.             }
  264.         }
  265.     }
  266.  }
  267. }
  268.  
  269. // goto selected Page
  270. function EnstylerPageAction() {
  271.     var enPage = 'page=' + $(this).val();
  272.     var enUrl  = window.location.href;
  273.     var path   = window.location.pathname;
  274.  
  275.     // remove page= and everthing behind
  276.     enUrl = enUrl.replace( /page=.*|#.*/ ,'');
  277.     
  278.     // add new page parameter
  279.     if ( enUrl.endsWith('?') ||  enUrl.endsWith('&')) {
  280.         enUrl += enPage;
  281.     } else {
  282.         enUrl += '?'+enPage;
  283.     }
  284.     
  285.     // add #thread-comments for deal
  286.     if (path.startsWith('/deals/')) { enUrl += '#thread-comments';}
  287.     
  288.     window.location = enUrl;
  289. }
  290.  
  291. function EnstylerPagePickerRemove() {
  292.         // Removes pagepicker from the document
  293.         $('.'+ EnstylerPageEnum).remove();
  294. }
  295.  
  296.  
  297.  
  298. // blacklist do not show dealz containing blacklistet words ==========================
  299. // search in kategorie, dealtitle, and username
  300. var enClassHidden = 'enClassHidden';
  301. var enClassBlackDone = 'enClassBlackDone';
  302. var enUnblackText = 'unBlacklist <NUM-BLACK> Dealz'
  303. var enBlacklisted=0;
  304.  
  305. function EnstylerBlacklist() {
  306.  // if logged in and user is not in whitelist
  307.     if (enUserLogin && ! GM_config.get('enConfWhitelist').includes(enUserName)) {
  308.         // add actual user to whitelist
  309.         GM_config.set('enConfWhitelist', '@'+enUserName +',' + GM_config.get('enConfWhitelist'));
  310.     }
  311.     // Black/Whitelist active 
  312.     if (GM_config.get('enConfBlackEnable')) {
  313.       var unwantedRegex = [ /[\[\]\(\)\{\}\?\.\:\;\!\"\*\+\ ]/g, // in White/Backlist
  314.                             /[\[\]\(\)\{\}\?\.\:\;\!\"\*\+\,]/g  // in Dealtext
  315.                            ];
  316.           // convert Black/Whitelist to Array
  317.       var myTemp=GM_config.get('enConfBlacklist');
  318.           myTemp = myTemp.replace(unwantedRegex[0], '');  
  319.       var enBlack = myTemp.split(',');
  320.         
  321.           myTemp=GM_config.get('enConfWhitelist');
  322.           myTemp = myTemp.replace(unwantedRegex[0], '');      
  323.       var enWhite = myTemp.split(',');
  324.  
  325.         // process every article
  326.         $('article').each(function () {
  327.             if ($(this).hasClass(enClassBlackDone)) { return;}
  328.             // get thrad 
  329.             var myThread = $(this).attr('id');
  330.             // return if already done or return no deal
  331.             if (!myThread.startsWith('thread_')) { ;return;}
  332.             
  333.             // mark as already seen
  334.             $(this).addClass(enClassBlackDone);
  335.             
  336.             // get title, categorie, user
  337.         var myDealText =        $('#' + myThread + ' .thread-category').text();
  338.             myDealText +=  ' ' +$('#' + myThread + ' .thread-title a').text();
  339.             myDealText += ' @' +$('#' + myThread + ' .user').text();
  340.             myDealText = myDealText.replace(unwantedRegex[1] ,' ');
  341.             
  342.             // Whitelist first
  343.             for (var i=-1,  length=enWhite.length; ++i < length;) {
  344.                 // whitelist Regex, exit if found
  345.                 if (enWhite[i] !='' && myDealText.match(new RegExp(enWhite[i],'i'))) {
  346.                     return;
  347.                 }
  348.             }
  349.             // blacklist first, blacklist if found and exit
  350.             for (var i=-1,  length=enBlack.length; ++i < length;) {
  351.                 // whitelist Regex, unwanted characteres are already removed
  352.                 if (enBlack[i] !='' && myDealText.match(new RegExp(enBlack[i],'i'))) {
  353.                     $(this).addClass(enClassHidden);
  354.                     enBlacklisted++;
  355.                     return;
  356.                 }    
  357.             }
  358.         }); // END Article 
  359.     // set label for unBlacklist button
  360.     enJSfieldDefs.enConfUnblacklist.label=enUnblackText.replace('<NUM-BLACK>',enBlacklisted) 
  361.     }  
  362. }
  363.  
  364. function EnstylerBlacklistRemove() {
  365.        enBlacklisted=0;
  366.        $('.'+enClassHidden).removeClass(enClassHidden);
  367.        // do nor reprocess after unblack
  368.        //$('.'+enClassBlackDone).removeClass(enClassBlackDone);
  369. }  
  370.  
  371.  
  372. // Main Nav will stay on TOP of the screen =========================
  373. function EnstylerFixedNav() {
  374.         var myFixedCssMain='.nav { display: block; position: fixed; width: 100%; z-index: 120;} .subNav, .userProfile, .tabbedInterface {margin-top: 4.4em;}'
  375.         var myFixedCssSub ='.subNav {margin-top: 0 !important;} .nav-subheadline {margin-top: 4.4em;}'
  376.         if (GM_config.get('enConfNavFixed')) {
  377.             var parser = location; // parse location 
  378.             var pathname = parser.pathname;
  379.             
  380.             // everywhere but in Deal detail, I like it like it is ... 
  381.             if (!pathname.startsWith('/deals/') ){
  382.                 // delete header element with active stuff, but keep inside HTML
  383.                 var mySavedHtml = $('header').html();
  384.                 $('header').replaceWith(mySavedHtml);
  385.                 
  386.                 // CSS for everywhere
  387.                 addStyleString(myFixedCssMain);
  388.                 if (! pathname.match(/^\/$|^\/hot|^\/new|^\/settings|\/discussed/i)) {
  389.                     // additional CSS for categories
  390.                     addStyleString(myFixedCssSub);
  391.                 }
  392.             }
  393.         }
  394. }
  395.  
  396. // bind external links to GM_xmlhttpRequest ================
  397. function EnstylerProcessLinks () {
  398.  
  399.     // REGEX to detect external URL
  400.     var REGEX_THREAD     = /^https?:\/\/www\.mydealz\.de\/visit\/thread(image)?\/\d+$/;
  401.     var REGEX_DESC       = /^https?:\/\/www\.mydealz\.de\/visit\/threaddesc\/\d+\/\d+$/;
  402.     var REGEX_COMMENT    = /^https?:\/\/www\.mydealz\.de\/visit\/comment\/\d+\/\d+$/;
  403.     var REGEX_AMAZONMOB  = /^https?:\/\/www\.amazon\..*\/gp\/aw\/.*$/;
  404.     //var REGEX_AMAZON     = /^https?:\/\/www\.amazon\..*$/;
  405.  
  406.     //* GM_xmlhhtpREquest not supported by firefox mobile :-((( 
  407.     // abfangen aller links mit jQuery
  408.     $('a').bind('click', function(){
  409.          var url = this.href;
  410.  
  411.          // externer Link mit Redirect ...
  412.          // Match REDIRECT URLs and open new Window with finalUrl
  413.          if (GM_config.get('enConfFilterLink') && url.match(REGEX_THREAD) || url.match(REGEX_DESC) || url.match(REGEX_COMMENT)) {
  414.              // Workaround: pre open window because of popup blockers
  415.              var asyncWindow = window.open(url, '_blank');
  416.          
  417.              // now lookup redirecd external URL ...
  418.              // alert("external URL detected");
  419.              GM_xmlhttpRequest({
  420.                  method: 'GET',
  421.                  url: url,
  422.                  // here we get the final URL from redirect
  423.                  onload: function (response) {
  424.                    // process final URL
  425.                    var newUrl = response.finalUrl;
  426.                    //alert(newUrl);
  427.                    // lets see ...
  428.                    if (newUrl.match(REGEX_AMAZONMOB)) {
  429.                        newUrl = newUrl.replace("/gp/aw/d/", "/dp/");
  430.                        newUrl = newUrl.replace("/gp/aw/ol/", "/gp/offer-listing/");
  431.                        //alert("Amazon rewritten URL: " + newUrl);
  432.                    }
  433.                    // load processed URL in preopened window
  434.                    asyncWindow.location = newUrl;
  435.                  }    
  436.              });
  437.              // return without link processing by Browser
  438.              return false;
  439.          }
  440.   
  441.          // return with link processing in Browser
  442.          return true;  
  443.     }); //  - END GM_xmlhttpRequest */
  444. } // END EnstylerProcessLinks
  445.  
  446.  
  447. // check for Updates of EnstylerJS and Enstyler2 ================
  448. var enUpdateJSurl = "https://greasyfork.org/de/scripts/24243"; // production version
  449. var enUpdateInterval=1 * (24*60) // 1 day between update checks
  450.  
  451. if (!GM_info.script.namespace.match(/develop/i)) {
  452.     var enUpdateJSurl = "https://greasyfork.org/de/scripts/24244"; // developer version
  453.     var enUpdateInterval=1 // 1 minute between update checks
  454.  
  455. } 
  456.  
  457. function enCheckUpdates() {
  458.      // get time and convert to minutes
  459.      var myTime=Date.now()/60000|0;
  460.      if (GM_config.get('enConfCheckUpdate') & myTime - GM_config.getValue('enLastUpdateCheck') > enUpdateInterval) {
  461.          GM_config.setValue('enLastUpdateCheck', myTime);
  462.          //GM_config.set('enLastUpdateCheck', myTime);
  463.          //GM_config.fields['enLastUpdateCheck'].reload();
  464.          enGetOnlineVersions();
  465.      }
  466. }
  467.  
  468. // Get actual online version 
  469. function enGetOnlineVersions() {
  470.   // EnstylerJS
  471.   GM_xmlhttpRequest({
  472.     method: "GET",
  473.     url: enUpdateJSurl, 
  474.  
  475.     onload: function(response) {
  476.       var enJSVersion = GM_info.script.version;
  477.       var myResponse=response.responseText;
  478.       myResponse=myResponse.replace(/\r?\n|\r| |\t/g,'');
  479.       myResponse=myResponse.replace(/^.*\<ddclass=\"script-show-version\"\>\<span\>|\<\/span\>.*/gi,'');
  480.       //alert(myResponse)
  481.       if (versionCompare(enJSVersion, myResponse) <0) {
  482.          //showPopup('New EnstylerJS availible: ' + enJSVersion + '\n\nPlease update!');
  483.       } else { myResponse='no'}
  484.         
  485.       GM_config.setValue('enJSVersion', myResponse);
  486.     }
  487.   });
  488.  
  489.   // Enstyler2
  490.   // get last known Verion of CSS
  491.    GM_xmlhttpRequest({
  492.         method: "GET",
  493.         url: "https://userstyles.org/styles/128262",
  494.     
  495.         onload: function(response) {
  496.           var enEnVersion;
  497.           $('.threadWidget-footer').each(function(){ enEnVersion=window.getComputedStyle(this,':after').content;});
  498.           enEnVersion = enEnVersion.replace(/ /g,'')
  499.           enEnVersion = enEnVersion.replace(/.*Enstyler|-.*/gi,'')
  500.           //alert(enEnVersion)
  501.           
  502.           var myResponse=response.responseText;
  503.           myResponse=myResponse.replace(/\r?\n|\r| |\t/g,'');
  504.           myResponse=myResponse.replace(/^.*additional-info-text.*Version:|\<br\>.*/gi,'');
  505.           //alert(myResponse);
  506.           if (versionCompare(enEnVersion, myResponse) <0) {
  507.               //showPopup('New CSS availible: ' + enEnVersion + '\n\nPlease update!');
  508.           } else { myResponse='no'; }
  509.              
  510.           GM_config.setValue('enEnVersion', myResponse);
  511.  
  512.         }
  513.    });
  514. }
  515.  
  516.  
  517. // create button for display Config ==============
  518. var EnstylerButton = 'EnstylerButton';
  519.  
  520. //var input = document.createElement('a');
  521. //    input.setAttribute('href', 'showEnstylerConfig()');
  522. //    input.setAttribute('id', EnstylerButton);
  523. var input = document.createElement('input');
  524.     input.type = 'button';
  525.     input.setAttribute('id', EnstylerButton)
  526.     input.onclick = showEnstylerConfig;
  527.  
  528. function EnstylerButtonCreate() {
  529.     // add Enstyler Button to ...
  530.     var myElement;
  531.     var myMain=false;
  532.    
  533.     input.value = 'Enstyler';
  534.     
  535.     // MainNav selected or Deal
  536.     if (GM_config.get('enConfBtn'))
  537.         { myMain=true; }
  538.     
  539.     if ($('.voteBar').length)
  540.         { myMain=true; }
  541.    
  542.     // only if space left
  543.     if ($(window).width() < GM_config.get('enConfBtnMinWidth'))
  544.         { myMain=false; }
  545.     
  546.     if (myMain) {
  547.        // add button to MainNav
  548.        var Elements = document.getElementsByClassName("nav-link");
  549.        myElement = Elements[3]; 
  550.        input.setAttribute('class', 'vAlign--all-m nav-link-text');
  551.        input.setAttribute('style', '');
  552.     } else {
  553.        // add button to SubNav
  554.        myElement = document.getElementById('tour-filter');
  555.        input.setAttribute('class', 'box--all-i subNavMenu-link');
  556.        input.setAttribute('style', 'font-size: 1.28571em; font-weight: 700; top: 3px; left: -0.7em'); 
  557.     }
  558.   
  559.     // only if myElement exist
  560.     if (myElement !== null) {
  561.         myElement.appendChild(input);
  562.         //insertAfter(input, myElement);
  563.     }
  564. }
  565.  
  566. // needed for Enstyler Homepage
  567. function EnstylerHomeButton() {
  568.     // add Enstyler Button to ...
  569.     input.value = 'Options';
  570.     var  myElement = document.getElementById('style-settings');
  571.     input.setAttribute('style', 'font-size: 1.28571em; padding: 0.8em;'); 
  572.   
  573.     // only if myElement exist
  574.     if (myElement !== null) {
  575.         //myElement.appendChild(input);
  576.         insertAfter(input, myElement);
  577.     }
  578. }
  579.  
  580. function EnstylerButtonRemove() {
  581.         // Removes button from the document
  582.         $('#'+ EnstylerButton).remove
  583. }
  584.  
  585.  
  586.  
  587. // ============= GM_config functions =======================================
  588.  
  589. // define EnstylerJS GM_config elements
  590. var enJSfieldDefs = {
  591.     // Part one: load external content --------
  592.  'enstyler': { 
  593.       'section': ['additonal features for Enstyler', ''],
  594.       'label': 'Update CSS...', // Appears on the button
  595.       'type': 'button', // Makes this setting a button input
  596.       'click': function() { // Function to call when button is clicked
  597.                GM_config.setValue('enEnVersion', 'no');
  598.                GM_config.save();
  599.                GM_config.open();
  600.                showUrl('https://userstyles.org/styles/128262#style-info');
  601.                }
  602.     },
  603.     'enstylerJS': { 
  604.       'label': 'Update UserScript...', // Appears on the button
  605.       'type': 'button', // Makes this setting a button input
  606.       'click': function() { // Function to call when button is clicked
  607.                GM_config.setValue('enJSVersion', 'no');
  608.                GM_config.save();
  609.                GM_config.open();
  610.                showUrl('https://greasyfork.org/de/scripts/24243');
  611.  
  612.                }
  613.     },
  614.  
  615.    'dontCookies': {
  616.       'label': 'Mozilla no cookies...', // Appears on the button
  617.       'type': 'button', // Makes this setting a button input
  618.       'click': function() { // Function to call when button is clicked
  619.                showUrl('https://addons.mozilla.org/de/addon/i-dont-care-about-cookies/'); }
  620.     },
  621.  
  622.     //* thhis has to be the last one,display only if internal version is disabled 
  623.     'externalMobileRedirect': {
  624.       'label': 'Amazon mobile redirect...', // Appears on the button
  625.       'type': 'button', // Makes this setting a button input
  626.       'click': function() { // Function to call when button is clicked
  627.                showUrl('https://greasyfork.org/de/scripts/19700'); }
  628.     }, // */
  629.  
  630.    // part two: EnstylerJS internal configuration options ------ 
  631.    'hidden1': { // display next section, dont kow why ...
  632.       'section': ['Configuration', ''],
  633.         'type': 'hidden', // Makes this setting a hidden input
  634.         'value': 'Some hidden value' // Value stored
  635.    },
  636.  
  637.    // postion of enstyler "button"
  638.    'enConfBtn': {
  639.       'label': 'Show Enstyler in MainNav', // Appears next to field
  640.       'type': 'checkbox', // Makes this setting a checkbox input
  641.       'default': false // Default value if user doesn't change it
  642.     },
  643.     
  644.     'enConfBtnMinWidth': {
  645.       'label': 'only if width is bigger than ', // Appears next to field
  646.       'type': 'int', // Makes this setting a text input
  647.       'min': 600, // Optional lower range limit
  648.       'max': 1200, // Optional upper range limit
  649.       'size': 4, // Limit length of input (default is 25)
  650.       'default': 850 // Default value if user doesn't change it
  651.     },
  652.     
  653.    'enConfNavFixed': {
  654.       'label': 'Display FIXED MainNav', // Appears next to field
  655.       'type': 'checkbox', // Makes this setting a checkbox input
  656.       'default': false // Default value if user doesn't change it
  657.     },
  658.     
  659.    // ehanced USerInfo
  660.    'enConfUser': {
  661.       'label': 'Show Popuop Userinfo', // Appears next to field
  662.       'type': 'checkbox', // Makes this setting a checkbox input
  663.       'default': true // Default value if user doesn't change it
  664.     },
  665.    'enConfAvatar': {
  666.       'label': 'bigger Avatar for Popuop', // Appears next to field
  667.       'type': 'checkbox', // Makes this setting a checkbox input
  668.       'default': true // Default value if user doesn't change it
  669.     },   
  670.     
  671.   // enable filtering of external links
  672.   'enConfFilterLink': { 
  673.       'label': 'Amazon mobile redirect', // Appears next to field
  674.       'type': 'checkbox', // Makes this setting a checkbox input
  675.       'default': true // Default value if user doesn't change it
  676.     }, // */
  677.   
  678.  
  679.    // more Deal actions
  680.    'enConfMoreDeal': {
  681.       'label': 'additional Deal actions', // Appears next to field
  682.       'type': 'checkbox', // Makes this setting a checkbox input
  683.       'default': true // Default value if user doesn't change it
  684.     },
  685.  
  686.     // Page picker
  687.    'enConfPagePicker': {
  688.       'label': 'Enable Page Picker', // Appears next to field
  689.       'type': 'checkbox', // Makes this setting a checkbox input
  690.       'default': false // Default value if user doesn't change it
  691.     },
  692.     
  693.     // check for Updates
  694.     'enConfCheckUpdate': {
  695.       'label': 'Check for Updates', // Appears next to field
  696.       'type': 'checkbox', // Makes this setting a checkbox input
  697.       'default': true // Default value if user doesn't change it
  698.     },
  699.    'enLastUpdateCheck': {
  700.       'type': 'hidden', // Makes this setting a text input
  701.       'default': '1000' // Default value if user doesn't change it
  702.    },
  703.    'enJSVersion': {
  704.       'type': 'hidden', // Makes this setting a text input
  705.       'value': 'no' // Value stored
  706.    },
  707.    'enEnVersion': {
  708.    'type': 'hidden', // Makes this setting a text input
  709.       'value': '' // Value stored
  710.    },
  711.     
  712.     // Black/Whitelist input
  713.    'enConfBlackEnable': {
  714.       'label': 'Enable Black- / Whitelist', // Appears next to field
  715.       'type': 'checkbox', // Makes this setting a checkbox input
  716.       'default': true // Default value if user doesn't change it
  717.     },
  718.     'enConfBlacklist': {
  719.       'label': 'Blacklist - deals, categories, @users', // Appears next to field
  720.       'type': 'text', // Makes this setting a text input
  721.       'size': 70, // Limit length of input (default is 25)
  722.       'default': 'Nutella, Bangood, @Admin' // Default value if user doesn't change it
  723.     },
  724.     'enConfWhitelist': {
  725.       'label': 'Whitelist', // Appears next to field
  726.       'type': 'text', // Makes this setting a text input
  727.       'size': 70, // Limit length of input (default is 25)
  728.       'default': '' // Default value if user doesn't change it
  729.     },
  730.     'enConfUnblacklist': {
  731.       'label': 'UnBlacklist', // Appears on the button
  732.       'type': 'button', // Makes this setting a button input
  733.       'click': function() { // Function to call when button is clicked
  734.                EnstylerBlacklistRemove(); }
  735.     },
  736.    
  737.    // display copy message at end of section ...
  738.    'copy': {
  739.         'section': ['', '(c) Gnadelwartz - <a target="blank" href="https://www.mydealz.de/diskussion/enstyler2-style-your-mydealz-incl-pepper-sites-736219">Enstyler2 - Style your MyDealz</a>'],
  740.         'type': 'hidden', // Makes this setting a hidden input
  741.         'value': 'Some hidden value' // Value stored
  742.    },
  743. };
  744.  
  745. // define EnstylerJS GM_config elements
  746. var enHomefieldDefs = {
  747.     // Part one: load external content --------
  748.     'saveOpt': { 
  749.       'section': ['save your CSS options for next visit', ''],
  750.       'label': 'Select your CSS on main page then come back and klick "Save"  ', // Appears near textarea
  751.       'type': 'textarea', // Makes this setting a button input
  752.       'size': 70,
  753.       //'click': function() { // Function to call when button is clicked
  754.       //         showUrl('https://userstyles.org/styles/128262#style-info'); }
  755.     },
  756.    
  757.    // display copy message at end of section ...
  758.    'copy': {
  759.         'section': ['', '(c) Gnadelwartz - <a target="blank" href="https://www.mydealz.de/diskussion/enstyler2-style-your-mydealz-incl-pepper-sites-736219">Enstyler2 - Style your MyDealz</a>'],
  760.         'type': 'hidden', // Makes this setting a hidden input
  761.         'value': 'Some hidden value' // Value stored
  762.    },
  763.    
  764. };
  765.  
  766. // display GM_copnfig as div, so we cam apply CSS!!
  767. var enGMOptChange = false;
  768. var enGMFrame = document.createElement('div');
  769. enGMFrame.setAttribute('class','GM_config');
  770. document.body.appendChild(enGMFrame);
  771.  
  772. // basic config panel formatting, everything else is formatted by enstyler
  773. var enCSS = ['.GM_config {left: 5% !iportant; top: 9% !important; height: auto !important; max-width: 35em !important;}',
  774.              '.GM_config input, .GM_config button, .GM_config textarea { border: 1px solid; margin: 0.5em 0em 0.2em 1em; padding: 0.1em;}',
  775.              '.GM_config .reset { font-size: 9pt; padding-right: 1em; }',
  776.              '#GM_config_enstyler_var:after {content: ". <- please install CSS!"; font-weight: bold;}',
  777.              '.enClassHidden {display: none;}',
  778.             ].join(" ");
  779. addStyleString(enCSS);
  780.  
  781. var En_Popup = new GM_configStruct(
  782.    {
  783.   'id': 'EnPopup', // You need to use a different id for each instance
  784.   'title': 'EnstylerJS - Info', 
  785.   'fields': // Fields object
  786.     {
  787.        'Text': // This is the id of the field
  788.        {
  789.          'label': '', // Appears next to field
  790.          'type': 'textarea', // Makes this setting a text field
  791.          'default': '' // Default value if user doesn't change it
  792.        }
  793.     },
  794.   'events':
  795.     {
  796.       'open': function (doc) {
  797.         // translate the buttons
  798.         var config = this;
  799.         doc.getElementById(config.id + '_saveBtn').textContent = ' OK ';
  800.         //doc.getElementById(config.id + '_closeBtn').textContent = 'Cancel';
  801.         doc.getElementById(config.id + '_resetLink').textContent = '';
  802.       },
  803.     },
  804.   'frame': enGMFrame // Element used for the panel
  805.   }
  806. );
  807.  
  808. function showPopup(text) {
  809.     En_Popup.fields['Text'].value = text;
  810.     En_Popup.fields['Text'].reload();
  811.     En_Popup.open();
  812. }
  813.  
  814.  
  815. var enGMConfigOpen=false;
  816. // EnstylerJS Config Panel anzeigen
  817. function showEnstylerConfig() {
  818.   if(!enGMConfigOpen) {
  819.       enGetHome();
  820.       GM_config.open();
  821.       enGMConfigOpen=true;
  822.   } else {
  823.       GM_config.close();
  824.   }    
  825. }
  826.  
  827.  
  828. // EnstylerJS START ========================
  829. if (!window.location.hostname.endsWith('userstyles.org')) {
  830.     var enFixedNav=false;
  831.     GM_config.init(
  832.       {
  833.         id: 'GM_config',
  834.         title: 'EnstylerJS - Settings', 
  835.         fields: enJSfieldDefs,
  836.        'events': // Callback functions object
  837.          {
  838.           //'init': function() { alert('onInit()'); },
  839.           // remove elements ich switch is checked or not
  840.           'open': function() { 
  841.           var enRemoveConfig = [
  842.                { check: true,  switch: 'enConfFilterLink',  remove: 'externalMobileRedirect'},
  843.                { check: false, switch: 'enConfBtn',         remove: 'enConfBtnMinWidth'},
  844.                { check: false, switch: 'enConfUser',        remove: 'enConfAvatar'},
  845.                { check: false, switch: 'enConfBlackEnable', remove: 'enConfWhitelist'},
  846.                { check: false, switch: 'enConfBlackEnable', remove: 'enConfBlacklist'},
  847.                { check: false, switch: 'enConfBlackEnable', remove: 'enConfUnblacklist'}
  848.               ];
  849.              enFixedNav=GM_config.get('enConfNavFixed');
  850.              $(enRemoveConfig).each(function() {
  851.                  if (GM_config.get(this.switch) == this.check) {
  852.                   GM_config.fields[this.remove].remove();
  853.                  }
  854.              });
  855.              if (GM_config.get('enConfCheckUpdate')) {
  856.                var myUpdate
  857.                if ((myUpdate=GM_config.getValue('enJSVersion')) =='no') 
  858.                  {GM_config.fields['enstylerJS'].remove();}
  859.                  else {showPopup('New EnstylerJS availible: ' + myUpdate + '\n\nPlease update!');}
  860.                  
  861.                if ((myUpdate=GM_config.getValue('enEnVersion')) =='no') 
  862.                  {GM_config.fields['enstyler'].remove();}
  863.                  else {showPopup('New CSS availible: ' + myUpdate + '\n\nPlease update!');}
  864.             }
  865.           },
  866.           //'reset': function() { alert('reset') },
  867.           // relaod page on close after save
  868.           'save':  function() {
  869.               if (!GM_config.get('enConfNavFixed') && GM_config.get('enConfNavFixed')!=enFixedNav) {window.location.reload(false);}
  870.               EnstylerButtonRemove();
  871.               EnstylerButtonCreate();
  872.               EnstylerPagePickerRemove();
  873.               EnstylerPagePickerCreate();
  874.               EnstylerBlacklistRemove()
  875.               EnstylerBlacklist();
  876.               EnstylerFixedNav();
  877.               enCheckUpdates();
  878.               GM_config.close()
  879.             },
  880.          'close': function() { enGMConfigOpen=false;},
  881.          },
  882.        'frame': enGMFrame // Element used for the panel
  883.       }
  884.     );
  885.     
  886.    // dummy, do not delete
  887.    function enGetHome() {;}
  888.     
  889.     // ============== START EnstyerJS =============
  890.     EnstylerInit();
  891.     EnstylerProcessLinks();
  892.  
  893.     EnstylerBlacklist();
  894.     EnstylerAvatarPopup();
  895.     EnstylerDealActions();
  896.     EnstylerFixedNav();
  897.     
  898.     // delay Pagepicker and repaeting actions after finishing everything else
  899.     function EnstylerDelayedInit() {
  900.            EnstylerButtonCreate();
  901.            EnstylerPagePickerCreate();
  902.            enCheckUpdates();
  903.         
  904.           // track DOM change Events, debounce: wait 1000ms after mutiple events
  905.           // then re-apply (somse) changes to dynamic loaded content, 
  906.           $('.fGrid-last2, .thread-list--type-card').bind("DOMSubtreeModified",$.debounce( 1000, function(){
  907.             //GM_log('DOMSubtreeModified detected!!!');
  908.             EnstylerBlacklist();
  909.             EnstylerDealActions();
  910.             EnstylerAvatarPopup();
  911.             //EnstylerPagePickerCreate();
  912.  
  913.           }));
  914.     }
  915.  
  916.     // wait until page is loaded completely
  917.     if (!USI) {
  918.         // Greasemonkey and Tampeermonky run script on DOM ready
  919.         $(window).bind("load", function() {
  920.            EnstylerDelayedInit();
  921.         });
  922.     } else {
  923.         // USI run script on page load, give some time to finish rendering
  924.          sleepAsync(Date.now()-EnstylerDelay).then(() => {
  925.              EnstylerDelayedInit();
  926.          });
  927.     }
  928.  
  929.  
  930. // ============= EnStyler UserScript Homepage functions =======
  931. // experimental support for EnStyler2 export / import
  932.  
  933. } else {
  934.     // we are on ujserstyle
  935.     function enGetHome() {
  936.         var myOptions='';
  937.         $('#style-settings select').each(function() {
  938.             var myID = $(this).attr('id');
  939.             var myValue = $('#'+myID).val();
  940.             var myText  = $('option[value='+ myValue +']').text();     
  941.             myOptions +='#' + myID + ':' + myValue +':' + myText +';\n';
  942.         });
  943.         $('#style-settings input:checked').each(function() {
  944.             var myID = $(this).attr('id');
  945.             var myValue = $('#'+myID).val();
  946.             var myText  = $('label[for='+ myID +']').text();     
  947.             myOptions +='#' + myID + ':' + myValue +':' + myText +';\n';
  948.         });
  949.        GM_config.set('saveOpt', myOptions);
  950.     }
  951.     
  952.     function enSetHome() {
  953.         // get saved options,remove newlines and split to settings array
  954.         var myOptions=GM_config.get('saveOpt');
  955.         myOptions=myOptions.replace(/\n/g,'');
  956.         var mySettings = myOptions.split(';');
  957.  
  958.         // abort if no options found
  959.         if (myOptions=='' || !myOptions.startsWith('#')) {return;}
  960.  
  961.         for (var i=0; i< mySettings.length; i++) {
  962.            // each Setting has 3 fields seperated by :, but only 2 used
  963.            var myField=mySettings[i].split(':');
  964.  
  965.            if (myField[0].match(/^#setting/i)) {
  966.                 // select 
  967.                 $(myField[0]).val('');
  968.                 $(myField[0]).val(myField[1]);
  969.             } else if (myField[0].startsWith('#option')) {
  970.                 // option
  971.                 $(myField[0]).prop('checked', true);
  972.             } else {
  973.                 if (myField[0] != '') {alert('unkown option: "' + myField +'"');}
  974.             }
  975.         }
  976.     } 
  977.     
  978.     // activate config for Enstyler Homepage
  979.     GM_config.init(
  980.       {
  981.         id: 'GM_config',
  982.         title: 'Enstyler2 - Settings', 
  983.         fields: enHomefieldDefs,
  984.        'events': // Callback functions object
  985.          {
  986.           //'init': function() { alert('onInit()'); },
  987.           // remove elements ich switch is checked or not
  988.           //'open': function() { enGetHome(); },
  989.           //'reset': function() { enGMOptChange = true; },
  990.           // relaod page on close after save
  991.           'save':  function() { enSetHome(); GM_config.close()},
  992.           'close': function() { enGMConfigOpen=false; },
  993.          },
  994.        'frame': enGMFrame // Element used for the panel
  995.       }
  996.     );
  997.     
  998.     // START Enstyler 2 Homepage
  999.     EnstylerHomeButton();
  1000.     // set saved options
  1001.     enSetHome();
  1002.     
  1003.     
  1004.  
  1005. }
  1006.  
  1007.  
  1008. //=========== Support functions for actual use ======
  1009.  
  1010. // display website in external window
  1011. function showUrl(str) {
  1012.     var myDeco = "innerheight=780,innerwidth=550";
  1013.     var myName = "enstyler";
  1014.     
  1015.     // workaround for not working window.focus(): close an existing window first
  1016.     // not working on mobile :-(
  1017.     //var myWindowShow = window.open('', myName, "width=100,height=100").close();
  1018.     var myWindowShow = window.open(str, myName, myDeco);
  1019. }
  1020.  
  1021. // add CSS in to document
  1022. function addStyleString(str) {
  1023.     var node = document.createElement('style');
  1024.     node.innerHTML = str;
  1025.     document.body.appendChild(node);
  1026. }
  1027.  
  1028. // insertAfter like .insertBefore but as support function
  1029. function insertAfter(newNode, referenceNode) {
  1030.     referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
  1031. }
  1032.  
  1033. // from https://gist.github.com/TheDistantSea/8021359
  1034. // returns 0 on equal, 1 on v1 newer, -1 on v2 newer 
  1035. function versionCompare(v1, v2) {
  1036.     var lexicographical = false,
  1037.         zeroExtend = true,
  1038.         v1parts = v1.split('.'),
  1039.         v2parts = v2.split('.');
  1040.  
  1041.     function isValidPart(x) { return (lexicographical ? /^\d+[A-Za-z]*$/ : /^\d+$/).test(x); }
  1042.     if (!v1parts.every(isValidPart) || !v2parts.every(isValidPart)) {return NaN; }
  1043.  
  1044.     if (zeroExtend) {
  1045.         while (v1parts.length < v2parts.length) v1parts.push("0");
  1046.         while (v2parts.length < v1parts.length) v2parts.push("0");
  1047.     }
  1048.  
  1049.     if (!lexicographical) {
  1050.         v1parts = v1parts.map(Number);
  1051.         v2parts = v2parts.map(Number);
  1052.     }
  1053.  
  1054.     for (var i = 0; i < v1parts.length; ++i) {
  1055.         if (v2parts.length == i) { return 1; }
  1056.         if (v1parts[i] == v2parts[i]) { continue; }
  1057.         else if (v1parts[i] > v2parts[i]) { return 1; }
  1058.         else { return -1; }
  1059.     }
  1060.  
  1061.     if (v1parts.length != v2parts.length) { return -1; }
  1062.     return 0;
  1063. }
  1064.  
  1065. // sleep time expects milliseconds, then execute code
  1066. // NOTE: code runs in parallel (asnyc)!
  1067. // Usage!
  1068. //     sleepAsync(500).then(() => {
  1069. //               Do something after the sleep!
  1070. //      });
  1071.  
  1072. function sleepAsync (time) {
  1073.   return new Promise((resolve) => setTimeout(resolve, time));
  1074. }