☰

Kaskus-Head-Scroller

simple script do scroll to top at header (*.kaskus.co.id)

  1. // ==UserScript==
  2. // @name          Kaskus-Head-Scroller
  3. // @namespace     http://userscripts.org/scripts/show/Kaskus-Head-Scroller
  4. // @include       *.kaskus.co.id/*
  5. // @version       0.1
  6. // @dtversion     1404260001
  7. // @timestamp     1398534731798
  8. // @description   simple script do scroll to top at header (*.kaskus.co.id)
  9. // @author        tuxie.forte;
  10. // @license       (CC) by-nc-sa 3.0
  11. //
  12. // -!--latestupdate
  13. //
  14. // v0.1 - 2014-04-26
  15. //  init
  16. //
  17. // -/!latestupdate---
  18. //
  19. //
  20. //
  21. // ==/UserScript==
  22. //
  23.  
  24. (function(){
  25. // Initialize Global Variables
  26. var gvar=function() {};
  27.  
  28. /*
  29. window.alert(new Date().getTime());
  30. */
  31. //========-=-=-=-=--=========
  32. gvar.__DEBUG__ = !1; // development
  33. //========-=-=-=-=--=========
  34.  
  35.  
  36.  
  37. // =====
  38. // START
  39. function start_Main(){
  40.   var $el = $D(gvar.target_selector);
  41.   if( !$el ){
  42.     clog('missing target node');
  43.     return;
  44.   }
  45.   
  46.   if( !gvar.is_mobile )
  47.     $el = $el[0];
  48.   else{
  49.     GM_addGlobalStyle(rSRC.getMobCSS_patch(), 'patch_head', 1);
  50.  
  51.     if( $D('#mqr-content-wrapper') ){ // mqr already has something todo w/ design and event
  52.  
  53.     }
  54.     else{
  55.       GM_addGlobalStyle(rSRC.getMobCSS(), 'fixed_head', 1);
  56.  
  57.       Dom.Ev(window, 'scroll', function(){
  58.         var nVScroll = document.documentElement.scrollTop || document.body.scrollTop,
  59.           el_ = $D('#site-header');
  60.         if( nVScroll > 0 ){
  61.           !hasClass('fx', el_) && addClass('fx', el_);
  62.         }
  63.         else{
  64.           removeClass('fx', el_);
  65.         }
  66.       });
  67.     }
  68.   }
  69.  
  70.   if( $el )
  71.     _o('click', $el, function(e){
  72.       var el = e.target||e;
  73.       if(el && el.nodeName == 'A')
  74.         return !1;
  75.  
  76.       nat_scrollTo(document.body, 0, 234);
  77.     });
  78. }
  79.  
  80.  
  81.  
  82. // -
  83. // -
  84. // -
  85. // -
  86. //========= 
  87. // code below should adapting current QR Engine for this plugins works
  88. // leave code below as wot it is, as long you know what todo
  89. //========= Common Functions && Global Var Init ====
  90. // static routine
  91. function isDefined(x)   { return !(x == null && x !== null); }
  92. function isUndefined(x) { return x == null && x !== null; }
  93. function isString(x) { return (typeof(x)!='object' && typeof(x)!='function'); }
  94. function trimStr(x) { return (typeof(x)=='string' && x ? x.replace(/^\s+|\s+$/g,"") : '') };
  95.  
  96. function _o(m,e,f){Dom.Ev(e,m,function(e){typeof(f)=='function'?f(e):void(0)});}
  97. function hasClass(cName, Obj){
  98.   if(cName=="" || !cName) return;
  99.   var re, cCls = (Obj.className ? Obj.className : '');
  100.   if( !cCls )
  101.     return !1;
  102.   else{
  103.     re = new RegExp('\\b'+cName+'\\b', "i");
  104.     return re.test( cCls );
  105.   }
  106. }
  107. function addClass(cName, Obj){
  108.   if(cName=="") return;
  109.   var neocls = (Obj.className ? Obj.className : '');
  110.   if(neocls.indexOf(cName)!=-1) return;
  111.   neocls+=(neocls!=''?' ':'')+cName;
  112.   Obj.setAttribute('class', neocls);
  113. }
  114. function removeClass(cName, Obj){
  115.   if(!cName || !Obj) return;
  116.   var neocls, rmvclss = getAttr('class', Obj);
  117.   neocls = getAttr('class', Obj);
  118.   rmvclss = cName.split(' ');
  119.   for(var i=0; i<rmvclss.length; ++i)
  120.     neocls = neocls.replace(rmvclss[i], '');
  121.   neocls = trimStr(neocls);
  122.   setAttr('class', neocls, Obj);
  123. }
  124. function createTextEl(a) {
  125.   return document.createTextNode(a)
  126. }
  127. function createEl(type, attrArray, html){
  128.  var node = document.createElement(type);
  129.  for (var attr in attrArray) 
  130.    if (attrArray.hasOwnProperty(attr))
  131.     node.setAttribute(attr, attrArray[attr]);
  132.  if(html) node.innerHTML = html;
  133.    return node;
  134. }
  135. function getAttr(name, Obj){
  136.   if("string" === typeof name && "object" === typeof Obj && Obj)
  137.     return Obj.getAttribute(name)||'';
  138.   else
  139.     return;
  140. }
  141. function setAttr(name, value, Obj){
  142.   if("string" === typeof name && "object" === typeof Obj)
  143.     return Obj.setAttribute(name, value);
  144. }
  145.  
  146.  
  147. var GM_addGlobalStyle = function (a, b, c) {
  148.   var d, e;
  149.   if (a.match(/^https?:\/\/.+/)) {
  150.     d = createEl("link", { type: "text/css", rel:'stylesheet', href:a });
  151.   }else{
  152.     d = createEl("style", { type: "text/css" });
  153.     d.appendChild(createTextEl(a));
  154.   }
  155.   if (isDefined(b) && isString(b)) d.setAttribute("id", b);
  156.   if (isDefined(c) && c) {
  157.     document.body.insertBefore(d, document.body.firstChild)
  158.   } else {
  159.     e = document.getElementsByTagName("head");
  160.     if (isDefined(e[0]) && e[0].nodeName == "HEAD") gvar.$w.setTimeout(function () {
  161.       e[0].appendChild(d)
  162.     }, 100);
  163.     else document.body.insertBefore(d, document.body.firstChild)
  164.   }
  165.   return d
  166. };
  167. // Get Elements
  168. var $D = function (q, root, single) {
  169.   if (root && typeof root == 'string') {
  170.       root = $D(root, null, true);
  171.       if (!root) { return null; }
  172.   }
  173.   if( !q ) return false;
  174.   if ( typeof q == 'object') return q;
  175.   root = root || document;
  176.   if (q[0]=='/' || (q[0]=='.' && q[1]=='/')) {
  177.       if (single) { return document.evaluate(q, root, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; }
  178.       return document.evaluate(q, root, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
  179.   }
  180.   else if (q[0]=='.') { return root.getElementsByClassName(q.substr(1)); }
  181.   else { return root.getElementById( (q[0]=='#' ? q.substr(1):q.substr(0)) ); }
  182.   return root.getElementsByTagName(q);
  183. };
  184. // utk add - remove element
  185. var Dom = {
  186.   g: function(el) {
  187.    if(!el) return false;
  188.    return ( isString(el) ? document.getElementById(el) : el );
  189.   },
  190.   add: function(el, dest) {    
  191.     var el = this.g(el);
  192.     var dest = this.g(dest);
  193.     if(el && dest) dest.appendChild(el);
  194.   },
  195.   remove: function(el) {
  196.     var el = this.g(el);
  197.     if(el && el.parentNode)
  198.       el.parentNode.removeChild(el);
  199.   },
  200.   Ev: function() {
  201.     if (window.addEventListener) {
  202.       return function(el, type, fn, ph) {
  203.         if(typeof(el)=='object')
  204.          this.g(el).addEventListener(type, function(e){fn(e);}, (isUndefined(ph) ? false : ph));
  205.       };      
  206.     }else if (window.attachEvent) {
  207.       return function(el, type, fn) {
  208.         var f = function() { fn.call(this.g(el), window.event); };
  209.         this.g(el).attachEvent('on' + type, f);
  210.       };
  211.     }
  212.   }()
  213. };
  214.  
  215. // native scrollTo
  216. function nat_scrollTo(element, to, duration) {
  217.   var start = element.scrollTop,
  218.   change = to - start,
  219.   currentTime = 0,
  220.   increment = 20;
  221.  
  222.   var animateScroll = function(){        
  223.     currentTime += increment;
  224.     var val = Math.easeInOutQuad(currentTime, start, change, duration);
  225.     element.scrollTop = val;
  226.     if(currentTime < duration) {
  227.       setTimeout(animateScroll, increment);
  228.     }
  229.   };
  230.   animateScroll();
  231. }
  232.  
  233. //t = current time
  234. //b = start value
  235. //c = change in value
  236. //d = duration
  237. Math.easeInOutQuad = function (t, b, c, d) {
  238.   t /= d/2;
  239.   if (t < 1) return c/2*t*t + b;
  240.   t--;
  241.   return -c/2 * (t*(t-2) - 1) + b;
  242. };
  243.  
  244.  
  245. var rSRC = {
  246.   getMobCSS: function(){
  247.     return ''
  248.       +'#site-header.fx{ position:relative}'
  249.       +'#site-header.fx #site-nav{ width:620px;position:fixed;top:0;z-index:99999}'
  250.       +'#site-header.fx .main-h.r{margin-top:30px}'
  251.     ;
  252.   },
  253.   getMobCSS_patch: function(){
  254.     return ''
  255.       +'#site-nav h1{ text-align:left}'
  256.       +'#site-nav h1 > a{ display:inline-block; height:25px;}'
  257.   ;
  258.   }
  259.  
  260. };
  261.  
  262. // ----my ge-debug--------
  263. function show_alert(msg, force) {
  264.   if(arguments.callee.counter) { arguments.callee.counter++; } else { arguments.callee.counter=1; }
  265.   GM_log('('+arguments.callee.counter+') '+msg);
  266.   if(force==0) { return; }
  267. }
  268. function clog(msg) {
  269.   if(!gvar.__DEBUG__) return;
  270.   show_alert(msg);
  271. }
  272. // -end static
  273. //=========
  274.  
  275.  
  276. function init(){
  277.   gvar.is_mobile = /^https?:\/\/m\.kaskus\./i.test(location.href);
  278.   gvar.head_id_desktop = 'site-header';
  279.   gvar.head_class_mobile = 'meta-header';
  280.  
  281.   gvar.target_selector = (gvar.is_mobile ? '#'+gvar.head_id_desktop : '.meta-header');
  282.  
  283.  
  284.   start_Main();
  285. }
  286.  
  287.  
  288. // ------
  289. init();
  290. })()
  291. /* tF. */