In regards to #71

thednp · Sep 16, 2016 · 0722301 · 0722301
1 parent 0c34d59
commit 0722301
Show file tree

Hide file tree

Showing 25 changed files with 1,864 additions and 2,460 deletions.
diff --git a/dist/bootstrap-native.js b/dist/bootstrap-native.js
diff --git a/dist/bootstrap-native.min.js b/dist/bootstrap-native.min.js
diff --git a/index.html b/index.html
@@ -599,8 +599,8 @@ <h4>Examples</h4>
 					  <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom<br> Here we add more content for testing. Perhaps adding even more content would make the job more difficult? Nope, same as if this was a very very short tooltip. Efficiently unleash cross-media information without cross-media value. Quickly maximize timely deliverables for real-time schemas.">Bottom</button>
 					  <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right<br> Here we add more content for testing. Perhaps adding even more content would make the job more difficult? Nope, same as if this was a very very short tooltip. Efficiently unleash cross-media information without cross-media value. Quickly maximize timely deliverables for real-time schemas.">Right</button>
 						<svg viewBox="0 0 80 34" width="80" height="34" xmlns="http://www.w3.org/2000/svg">
-							<rect fill="#fff" stroke="#ccc" stroke-width="1" width="100%" height="100%" rx="5"></rect>
-							<text data-toggle="tooltip" data-placement="top" title="Demo Title for SVG" fill="#333" x="25" y="22" font-size="14">SVG</text>
+							<rect data-toggle="tooltip" data-placement="top" title="Demo Title for SVG" fill="#fff" stroke="#ccc" stroke-width="1" width="100%" height="100%" rx="5"></rect>
+							<text fill="#333" x="25" y="22" font-size="14">SVG</text>
 						</svg>
 					</p>
 					<h4>Additional Note</h4>					
@@ -648,8 +648,8 @@ <h4>Examples</h4>
 						<input style="max-width: 180px; display: inline; width: auto" type="text" value="" class="form-control popover-via-template" placeholder="Focus me" data-toggle="popover">
 						<button type="button" id="popover-via-click" class="btn btn-default" data-trigger="click" data-content="You clicked the button and as a result, this message box simply.. popped.<br>Now simply click anywhere to dismiss.">Click to open</button>
 						<svg viewBox="0 0 80 34" width="80" height="34" xmlns="http://www.w3.org/2000/svg">
-							<rect fill="#fff" stroke="#ccc" stroke-width="1" width="100%" height="100%" rx="5"></rect>
-							<text data-toggle="popover" data-placement="top" data-title="Demo Popover Title for SVG" data-content="This is a demo popover for SVG elements." fill="#333" x="25" y="22" font-size="14">SVG</text>
+							<rect data-toggle="popover" data-placement="top" data-title="Demo Popover Title for SVG" data-content="This is a demo popover for SVG elements." fill="#fff" stroke="#ccc" stroke-width="1" width="100%" height="100%" rx="5"></rect>
+							<text fill="#333" x="25" y="22" font-size="14">SVG</text>
 						</svg>
 					</p>
 					<h4>Additional Note</h4>					
@@ -1046,6 +1046,17 @@ <h3 class="visible-xs">Navigation</h3>
 
 	<!--<script type="text/javascript" src="https://cdn.jsdelivr.net/bootstrap.native/1.0.2/bootstrap-native.min.js"></script>  now we have CDN -->
 	<script type="text/javascript" src="./dist/bootstrap-native.js"></script> <!-- local testing -->
+	<!--<script type="text/javascript" src="./lib/affix-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/alert-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/button-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/carousel-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/collapse-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/dropdown-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/modal-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/popover-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/scrollspy-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/tab-native.js"></script>  local testing 
+	<script type="text/javascript" src="./lib/tooltip-native.js"></script>  local testing -->
 
 	<script type="text/javascript" src="./assets/js/scripts.js"></script>
   </body>	

diff --git a/lib/affix-native.js b/lib/affix-native.js
@@ -20,6 +20,8 @@
 
 })(function(){
 
+  var isIE = (new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})").exec(navigator.userAgent) != null) ? parseFloat( RegExp.$1 ) : false;
+
   //AFFIX DEFINITION
   var Affix = function(element,options) {
     options = options || {};
@@ -30,68 +32,55 @@
     this.options.offsetTop = options.offsetTop && options.offsetTop ? ( options.offsetTop === 'function' ? options.offsetTop() : parseInt(options.offsetTop,0) ) : 0; // offset option is an integer number or function to determine that number
     this.options.offsetBottom = options.offsetBottom && options.offsetBottom ? ( options.offsetBottom === 'function' ? options.offsetBottom() : parseInt(options.offsetBottom,0) ) : null;
 
-    if (this.element && (this.options.target || this.options.offsetTop || this.options.offsetBottom ) ) { this.init(); }
-  }
+    if (!this.element && !(this.options.target || this.options.offsetTop || this.options.offsetBottom ) ) { return; }
 
-  //AFFIX METHODS
-  Affix.prototype = {
-    init: function () {
-      this.affixed = false;
-      this.affixedBottom = false;
-      this.getPinOffsetTop = 0;
-      this.getPinOffsetBottom = null;
-
-      //actions
-      this.checkPosition();
-      this.updateAffix();
-      this.scrollEvent();
-      this.resizeEvent()
-    },
-    processOffsetTop: function () {
+    var self = this;
+
+    this.processOffsetTop = function () {
       if ( this.options.target !== null ) {
         return this.options.target.getBoundingClientRect().top + this.scrollOffset();
       } else if ( this.options.offsetTop !== null ) {
         return this.options.offsetTop
       }
-    },
-    processOffsetBottom: function () {
+    }
+    this.processOffsetBottom = function () {
       if ( this.options.offsetBottom !== null ) {
         var maxScroll = this.getMaxScroll();
         return maxScroll - this.element.offsetHeight - this.options.offsetBottom
       }
-    },
-    checkPosition: function () {
+    }
+    this.checkPosition = function () {
       this.getPinOffsetTop = this.processOffsetTop
       this.getPinOffsetBottom = this.processOffsetBottom
-    },
-    scrollOffset: function () {
+    }
+    this.scrollOffset = function () {
       return window.pageYOffset || document.documentElement.scrollTop
-    },
-    pinTop: function () {
+    }
+    this.pinTop = function () {
       if ( !/\baffix/.test(this.element.className) ) {
         this.element.className += ' affix';
         this.affixed = true
       }
-    },
-    unPinTop: function () {
+    }
+    this.unPinTop = function () {
       if ( /\baffix/.test(this.element.className) ) {
         this.element.className = this.element.className.replace(' affix','');
         this.affixed = false
       }
-    },
-    pinBottom: function () {
+    }
+    this.pinBottom = function () {
       if ( !/\baffix-bottom/.test(this.element.className) ) {
         this.element.className += ' affix-bottom';
         this.affixedBottom = true
       }
-    },
-    unPinBottom: function () {
+    }
+    this.unPinBottom = function () {
       if ( /\baffix-bottom/.test(this.element.className) ) { 
         this.element.className = this.element.className.replace(' affix-bottom','');
         this.affixedBottom = false
       }
-    },
-    updatePin: function () {
+    }
+    this.updatePin = function () {
       if (this.affixed === false && (parseInt(this.processOffsetTop(),0) - parseInt(this.scrollOffset(),0) < 0)) {
         this.pinTop();
       } else if (this.affixed === true && (parseInt(this.scrollOffset(),0) <= parseInt(this.getPinOffsetTop(),0) )) {
@@ -103,35 +92,43 @@
       } else if (this.affixedBottom === true && (parseInt(this.scrollOffset(),0) <= parseInt(this.getPinOffsetBottom(),0) )) {
         this.unPinBottom()
       }
-    },
-    updateAffix : function () { // Unpin and check position again
+    }
+    this.updateAffix = function () { // Unpin and check position again
       this.unPinTop();
       this.unPinBottom();
       this.checkPosition()
 
       this.updatePin() // If any case update values again
-    },
-    getMaxScroll : function(){
+    }
+    this.getMaxScroll = function(){
       return Math.max( document.body.scrollHeight, document.body.offsetHeight, 
         document.documentElement.clientHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight )
-    },
-    scrollEvent : function(){
-      var self = this;
+    }
+    this.scrollEvent = function(){
       window.addEventListener('scroll', function() {
         self.updatePin()
       }, false);
 
-    },
-    resizeEvent : function(){
-      var self = this, 
-        isIE = (new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})").exec(navigator.userAgent) != null) ? parseFloat( RegExp.$1 ) : false, 
-        dl = (isIE && isIE < 10) ? 500 : 50;
+    }
+    this.resizeEvent = function(){
+      var dl = (isIE && isIE < 10) ? 500 : 50;
       window.addEventListener('resize', function () {
         setTimeout(function(){
           self.updateAffix()
         },dl);
       }, false);
     }
+    // init
+    this.affixed = false;
+    this.affixedBottom = false;
+    this.getPinOffsetTop = 0;
+    this.getPinOffsetBottom = null;
+
+    //actions
+    this.checkPosition();
+    this.updateAffix();
+    this.scrollEvent();
+    this.resizeEvent()    
   };
 
   // AFFIX DATA API

diff --git a/lib/alert-native.js b/lib/alert-native.js
@@ -26,36 +26,23 @@
     this.btn = typeof element === 'object' ? element : document.querySelector(element);
     this.alert = null;
     this.duration = 150; // default alert transition duration
-    this.init();
-  }
-
-  // ALERT METHODS
-  // ================
-  Alert.prototype = {
-
-    init : function() {
-      this.actions();
-      document.addEventListener('click', this.close, false); //delegate to all alerts, including those inserted later into the DOM
-    },
 
-    actions : function() {
-      var self = this;
+    var self = this;
 
-      this.close = function(e) {
-        var target = e.target;
-        self.btn = target.getAttribute('data-dismiss') === 'alert' && target.className === 'close' ? target : target.parentNode;
-        self.alert = self.btn.parentNode;
+    this.close = function(e) {
+      var target = e.target;
+      self.btn = target.getAttribute('data-dismiss') === 'alert' && target.className === 'close' ? target : target.parentNode;
+      self.alert = self.btn.parentNode;
 
-        if ( self.alert !== null && self.btn.getAttribute('data-dismiss') === 'alert' && /\bin/.test(self.alert.className) ) {
-          self.alert.className = self.alert.className.replace(' in','');
-          setTimeout(function() {
-            self.alert && self.alert.parentNode.removeChild(self.alert);
-          }, self.duration);
-        }
+      if ( self.alert !== null && self.btn.getAttribute('data-dismiss') === 'alert' && /\bin/.test(self.alert.className) ) {
+        self.alert.className = self.alert.className.replace(' in','');
+        setTimeout(function() {
+          self.alert && self.alert.parentNode.removeChild(self.alert);
+        }, self.duration);
       }
     }
-  }
-
+    document.addEventListener('click', this.close, false); //delegate to all alerts, including those inserted later into the DOM
+  };
   // ALERT DATA API
   // =================
   var Alerts = document.querySelectorAll('[data-dismiss="alert"]'), i = 0, all = Alerts.length;