JS-utilities

added minimized version

classes/classes.js

@@ -9,7 +9,7 @@ function hasClass( el, className ) {
         return el.classList.contains( className );
     } else {
         /**/
-        return !! el.className.match( new RegExp( "(\\s|^)" + className + "(\\s|$)" ) );
+        return ! ! el.className.match( new RegExp( "(\\s|^)" + className + "(\\s|$)" ) );
     }
 }
 

classes/classes.min.js

@@ -0,0 +1 @@
+function hasClass(b,a){if(b.classList){return b.classList.contains(a)}else{return !!b.className.match(new RegExp("(\\s|^)"+a+"(\\s|$)"))}}function addClass(b,a){if(b.classList){b.classList.add(a)}else{if(!hasClass(b,a)){b.className+=" "+a}}}function removeClass(c,b){if(c.classList){c.classList.remove(b)}else{if(hasClass(c,b)){var a=new RegExp("(\\s|^)"+b+"(\\s|$)");c.className=c.className.replace(a," ")}}};

element-position/element-position.js

@@ -6,20 +6,20 @@
 // should be calculated and set the
 // variables curleft and curtop to 0:
 
-function findPos(obj) {
+function findPos( obj ) {
     "use strict";
     var curleft = 0;
     var curtop = 0;
-    if (obj.offsetParent) {
+    if ( obj.offsetParent ) {
         do {
             curleft += obj.offsetLeft;
             curtop += obj.offsetTop;
-        } while (obj === obj.offsetParent);
+        } while ( obj === obj.offsetParent );
-        return [curleft, curtop];
+        return [ curleft, curtop ];
     }
 }
 
-function class_By_Y_Position($id, $activeclass, $inactiveclass, $startoffset, $endoffset, $absoluteoffset) {
+function class_By_Y_Position( $id, $activeclass, $inactiveclass, $startoffset, $endoffset, $absoluteoffset ) {
     // "use strict";
     // Default values
     $startoffset = ( "undefined" !== typeof $startoffset ) ? $startoffset : 0;
@@ -32,28 +32,28 @@ function class_By_Y_Position($id, $activeclass, $inactiveclass, $startoffset, $e
     var $elementtop;
 
     // Get element
-    var $el = document.getElementById($id);
+    var $el = document.getElementById( $id );
 
     // Get Start & End Pixel From Top
     var $start = 0;
     var $end = 0;
 
     // Get el position
-    var $elementtop = findPos($el)[1];
+    var $elementtop = findPos( $el )[ 1 ];
 
-    var pos = function () {
+    var pos = function() {
-        console.log("el pos: " + $elementtop);
+        console.log( "el pos: " + $elementtop );
     };
 
     $start = $elementtop + $startoffset;
 
 
     // What should we do when scrolling occurs
-    var runOnScroll = function () {
+    var runOnScroll = function() {
         var $scrollpos = window.scrollY;
 
         // Check if we are beyond the startpoint
-        if ($scrollpos > $start) {
+        if ( $scrollpos > $start ) {
 
 
             // Now Check if it has an end
@@ -63,8 +63,8 @@ function class_By_Y_Position($id, $activeclass, $inactiveclass, $startoffset, $e
             ) {
 
                 //Remove the class
-                addClass($el, $inactiveclass);
+                addClass( $el, $inactiveclass );
-                removeClass($el, $activeclass);
+                removeClass( $el, $activeclass );
 
                 //Scroll back the amount of end positioning to avoid jumps
                 // Todo maybe better to integrate in another function for scrolling/fixing etc.
@@ -74,25 +74,25 @@ function class_By_Y_Position($id, $activeclass, $inactiveclass, $startoffset, $e
 
             // In any other case add it
             else {
-                removeClass($el, $inactiveclass);
+                removeClass( $el, $inactiveclass );
-                removeClass($el, 'before');
+                removeClass( $el, 'before' );
 
-                addClass($el, $activeclass);
+                addClass( $el, $activeclass );
-                addClass($el, 'after');
+                addClass( $el, 'after' );
             }
         }
 
         //In any other case than being beyond start, remove the class
         else {
-            addClass($el, $inactiveclass);
+            addClass( $el, $inactiveclass );
-            addClass($el, 'before');
+            addClass( $el, 'before' );
 
-            removeClass($el, $activeclass);
+            removeClass( $el, $activeclass );
-            removeClass($el, 'after');
+            removeClass( $el, 'after' );
         }
     };
 
-    switch ($absoluteoffset) {
+    switch ( $absoluteoffset ) {
         case true:
 
             $start = $startoffset;
@@ -109,25 +109,25 @@ function class_By_Y_Position($id, $activeclass, $inactiveclass, $startoffset, $e
     // And then make each element do something on scroll
 
     // Trigger events
-    window.addEventListener("load", pos);
+    window.addEventListener( "load", pos );
-    window.addEventListener("load", runOnScroll);
+    window.addEventListener( "load", runOnScroll );
 
-    document.addEventListener("resize", pos);
+    document.addEventListener( "resize", pos );
-    document.addEventListener("resize", runOnScroll);
+    document.addEventListener( "resize", runOnScroll );
 
-    window.addEventListener("scroll", runOnScroll);
+    window.addEventListener( "scroll", runOnScroll );
 }
 
-function getheight($selector) {
+function getheight( $selector ) {
-    $identifier = $selector.substr(0, 1);
+    $identifier = $selector.substr( 0, 1 );
 
-    if ($identifier === ".") {
+    if ( $identifier === "." ) {
         return $element = document.getElementsByClassName(
-            $selector.substr(1))[0].getBoundingClientRect().height;
+            $selector.substr( 1 ) )[ 0 ].getBoundingClientRect().height;
-    } else if ($identifier === "#") {
+    } else if ( $identifier === "#" ) {
         return $element = document.getElementById(
-            $selector.substr(1)).getBoundingClientRect().height;
+            $selector.substr( 1 ) ).getBoundingClientRect().height;
     } else {
-        console.log("Error identifying selector type!");
+        console.log( "Error identifying selector type!" );
     }
 }

element-position/element-position.min.js

@@ -0,0 +1 @@
+function findPos(b){var c=0;var a=0;if(b.offsetParent){do{c+=b.offsetLeft;a+=b.offsetTop}while(b===b.offsetParent);return[c,a]}}function class_By_Y_Position(k,g,h,b,c,e){b=("undefined"!==typeof b)?b:0;c=("undefined"!==typeof c)?c:0;g=("undefined"!==typeof g)?g:"active";h=("undefined"!==typeof h)?h:"inactive";e=("undefined"!==typeof e)?e:false;var i;var l=document.getElementById(k);var a=0;var j=0;var i=findPos(l)[1];var f=function(){console.log("el pos: "+i)};a=i+b;var d=function(){var m=window.scrollY;if(m>a){if(c!=0&&m>(j)){addClass(l,h);removeClass(l,g)}else{removeClass(l,h);removeClass(l,"before");addClass(l,g);addClass(l,"after")}}else{addClass(l,h);addClass(l,"before");removeClass(l,g);removeClass(l,"after")}};switch(e){case true:a=b;j=c;break;case false:a=(i+b);j=(i+c);break}window.addEventListener("load",f);window.addEventListener("load",d);document.addEventListener("resize",f);document.addEventListener("resize",d);window.addEventListener("scroll",d)}function getheight(a){$identifier=a.substr(0,1);if($identifier==="."){return $element=document.getElementsByClassName(a.substr(1))[0].getBoundingClientRect().height}else{if($identifier==="#"){return $element=document.getElementById(a.substr(1)).getBoundingClientRect().height}else{console.log("Error identifying selector type!")}}};

element-position/example/element-position.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["element-position.scss"],"names":[],"mappings":"AAAA;EACE,WAAU;EACV,UAAS;EAET,4DAA2D,EAAA;EAC3D;IACE,mBAAkB;IAElB,YAAW;IACX,cAAa;IAEb,cAAa;IACb,uBAAsB;IAEtB,0BAAyB;IACzB,eAAc;IAEd,iBAAgB;IAEhB,uCAA8B;IAA9B,+BAA8B,EAAA;IAE9B;MACE,gBAAe;MACf,OAAM;MAEN,WAAU;MACV,cAAa,EAAA;IAGf;MACE,iBAAgB,EAAA;MAEhB;QACE,sBAAqB;QACrB,mBAAkB,EAAA;EAKxB;IAEE,YAAW;IACX,mBAAkB;IAClB,uBAAsB;IAEtB,eAAc;IACd,0BAAyB,EAAA;EAG3B;IACE,gBAAe;IACf,UAAS;IAET,WAAU;IACV,cAAa;IAEb,cAAa;IAEb,wBAAuB;IAEvB,uCAA8B;IAA9B,+BAA8B,EAAA;IAE9B;MACE,mBAAkB;MAClB,cAAa;MACb,YAAW;MACX,UAAQ,EAAA;IAGV;MACE,iBAAgB,EAAA;MAEhB;QACE,sBAAqB;QACrB,mBAAkB,EAAA","file":"element-position.css"}

element-position/example/element-position.css.tmp

@@ -1,50 +0,0 @@
-body {
-  padding: 0;
-  margin: 0;
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
-  body header {
-    position: absolute;
-    width: 100%;
-    height: 150px;
-    padding: 25px;
-    box-sizing: border-box;
-    background-color: #ff00ff;
-    color: #006505;
-    font-weight: 700;
-    transition: all 1s ease-in-out; }
-    body header.fixed {
-      position: fixed;
-      top: 0;
-      width: 50%;
-      margin: 0 25%; }
-    body header ul {
-      list-style: none; }
-      body header ul li {
-        display: inline-block;
-        padding-left: 25px; }
-  body section {
-    width: 100%;
-    padding: 200px 25%;
-    box-sizing: border-box;
-    color: #bfffc0;
-    background-color: #00a0d2; }
-  body footer {
-    position: fixed;
-    bottom: 0;
-    width: 50%;
-    height: 100px;
-    margin: 0 25%;
-    background-color: white;
-    transition: all 1s ease-in-out; }
-    body footer.relative {
-      position: relative;
-      height: 700px;
-      width: 100%;
-      margin: 0; }
-    body footer ul {
-      list-style: none; }
-      body footer ul li {
-        display: inline-block;
-        padding-left: 25px; }
-
-/*# sourceMappingURL=element-position.css.tmp.map */

element-position/example/element-position.css.tmp.map

@@ -1,7 +0,0 @@
-{
-"version": 3,
-"mappings": "AAAA,IAAK;EACH,OAAO,EAAE,CAAC;EACV,MAAM,EAAE,CAAC;EAET,WAAW,EAAE,8CAA8C;EAC3D,WAAO;IACL,QAAQ,EAAE,QAAQ;IAElB,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,KAAK;IAEb,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,UAAU;IAEtB,gBAAgB,EAAE,OAAO;IACzB,KAAK,EAAE,OAAO;IAEd,WAAW,EAAE,GAAG;IAEhB,UAAU,EAAE,kBAAkB;IAE9B,iBAAQ;MACN,QAAQ,EAAE,KAAK;MACf,GAAG,EAAE,CAAC;MAEN,KAAK,EAAE,GAAG;MACV,MAAM,EAAE,KAAK;IAGf,cAAG;MACD,UAAU,EAAE,IAAI;MAEhB,iBAAG;QACD,OAAO,EAAE,YAAY;QACrB,YAAY,EAAE,IAAI;EAKxB,YAAQ;IAEN,KAAK,EAAE,IAAI;IACX,OAAO,EAAE,SAAS;IAClB,UAAU,EAAE,UAAU;IAEtB,KAAK,EAAE,OAAO;IACd,gBAAgB,EAAE,OAAO;EAG3B,WAAO;IACL,QAAQ,EAAE,KAAK;IACf,MAAM,EAAE,CAAC;IAET,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,KAAK;IAEb,MAAM,EAAE,KAAK;IAEb,gBAAgB,EAAE,KAAK;IAEvB,UAAU,EAAE,kBAAkB;IAE9B,oBAAW;MACT,QAAQ,EAAE,QAAQ;MAClB,MAAM,EAAE,KAAK;MACb,KAAK,EAAE,IAAI;MACX,MAAM,EAAC,CAAC;IAGV,cAAG;MACD,UAAU,EAAE,IAAI;MAEhB,iBAAG;QACD,OAAO,EAAE,YAAY;QACrB,YAAY,EAAE,IAAI",
-"sources": ["element-position.scss"],
-"names": [],
-"file": "element-position.css.tmp"
-}