Added slider with alarm frame tick marks and scrubbing

5 files changed, 289 insertions, 0 deletions

diff --git a/www/lib/ion-image-lazy-load/.bower.json b/www/lib/ion-image-lazy-load/.bower.json
new file mode 100644
index 00000000..c7fbe652
--- /dev/null
+++ b/www/lib/ion-image-lazy-load/.bower.json
@@ -0,0 +1,36 @@
+{
+  "name": "ionic-image-lazy-load",
+  "main": "ionic-image-lazy-load.js",
+  "homepage": "https://github.com/paveisistemas/ionic-image-lazy-load",
+  "authors": [
+    "Vincius Zilli Pavei <vinicius@paveisistemas.com.br>",
+    "Michel Vidailhet <mvidailhet@mncc.fr>"
+  ],
+  "description": "Directive to Ionic Framework that only loads an image when it is seen by the user.",
+  "moduleType": [
+    "amd"
+  ],
+  "keywords": [
+    "ionic",
+    "lazy",
+    "load",
+    "image"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "_release": "fd1812ec1c",
+  "_resolution": {
+    "type": "branch",
+    "branch": "master",
+    "commit": "fd1812ec1cec3d3e44ef2e9f823104ceed0b196b"
+  },
+  "_source": "git://github.com/paveisistemas/ionic-image-lazy-load.git",
+  "_target": "*",
+  "_originalSource": "ion-image-lazy-load"
+}
diff --git a/www/lib/ion-image-lazy-load/LICENSE b/www/lib/ion-image-lazy-load/LICENSE
new file mode 100644
index 00000000..b4d5a95e
--- /dev/null
+++ b/www/lib/ion-image-lazy-load/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Pavei Sistemas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
diff --git a/www/lib/ion-image-lazy-load/README.md b/www/lib/ion-image-lazy-load/README.md
new file mode 100644
index 00000000..f3d823f9
--- /dev/null
+++ b/www/lib/ion-image-lazy-load/README.md
@@ -0,0 +1,80 @@
+ionic-image-lazy-load
+=====================
+
+
+## Demo
+http://codepen.io/mvidailhet/pen/yNOGzY
+http://codepen.io/pavei/pen/oFpCy
+
+## Quick Start
+
+Install using bower
+
+```sh
+bower install ion-image-lazy-load --save
+```
+
+or
+
+
+Download the file JS *ionic-image-lazy-load.js*, save on your project and load it on your *index.html*.
+
+
+```html
+<script src="path/to/ionic-image-lazy-load.js"></script>
+```
+
+Load into your module:
+
+```javascript
+angular.module('yourapp',
+              ['ionic', 'ionicLazyLoad'])
+```
+
+Set the `lazy-scroll` directive on your `<ion-content>` tag, that will listen to the scroll event:
+
+``` javascript
+<ion-content lazy-scroll>
+```
+
+And set the `img-lazy-src` directive on the image attribute instead of `src`:
+
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}">
+```
+
+You can also use it as a background-image for an element by setting the `image-lazy-background-image` paramameter to true:
+``` javascript
+<div image-lazy-src="{{item.thumbnail}}" image-lazy-background-image="true"></div>
+```
+
+You can also set an option to auto call `$ionicScrollDelegate.resize()` when the image `load` (default value is `false`):
+
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}" lazy-scroll-resize="true">
+```
+
+To show a ionic spinner while the image is loading, just specify a ionic spinner type (list is here: http://ionicframework.com/docs/api/directive/ionSpinner/):
+
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}" image-lazy-loader="lines">
+```
+Note: the styling of the loader position is up to you. The directive adds this html:
+
+```html
+<div class="image-loader-container">
+    <ion-spinner class="image-loader" icon="#spinnerStyle#"></ion-spinner>
+</div>
+```
+
+You can set a distance from the bottom or right side of the screen where the image will start loading.
+This will allow to start loading the image 100px below the bottom of the screen:
+
+``` javascript
+ <img image-lazy-src="{{item.thumbnail}}" image-lazy-distance-from-bottom-to-load="100">
+```
+
+This will allow to start loading the image 100px before the right side of the screen:
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}" image-lazy-distance-from-right-to-load="100">
+```
diff --git a/www/lib/ion-image-lazy-load/bower.json b/www/lib/ion-image-lazy-load/bower.json
new file mode 100644
index 00000000..f30b1128
--- /dev/null
+++ b/www/lib/ion-image-lazy-load/bower.json
@@ -0,0 +1,28 @@
+{
+  "name": "ionic-image-lazy-load",
+  "main": "ionic-image-lazy-load.js",
+  "version": "1.0.0",
+  "homepage": "https://github.com/paveisistemas/ionic-image-lazy-load",
+  "authors": [
+    "Vincius Zilli Pavei <vinicius@paveisistemas.com.br>",
+    "Michel Vidailhet <mvidailhet@mncc.fr>"
+  ],
+  "description": "Directive to Ionic Framework that only loads an image when it is seen by the user.",
+  "moduleType": [
+    "amd"
+  ],
+  "keywords": [
+    "ionic",
+    "lazy",
+    "load",
+    "image"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ]
+}
diff --git a/www/lib/ion-image-lazy-load/ionic-image-lazy-load.js b/www/lib/ion-image-lazy-load/ionic-image-lazy-load.js
new file mode 100644
index 00000000..da9ff94d
--- /dev/null
+++ b/www/lib/ion-image-lazy-load/ionic-image-lazy-load.js
@@ -0,0 +1,124 @@
+/**
+ * Created by PAVEI on 30/09/2014.
+ * Updated by Ross Martin on 12/05/2014
+ * Updated by Davide Pastore on 04/14/2015
+ * Updated by Michel Vidailhet on 05/12/2015
+ */
+
+angular.module('ionicLazyLoad', []);
+
+angular.module('ionicLazyLoad')
+
+.directive('lazyScroll', ['$rootScope', '$timeout',
+    function($rootScope, $timeout) {
+        return {
+            restrict: 'A',
+            link: function ($scope, $element) {
+
+                var scrollTimeoutId = 0;
+
+                $scope.invoke = function () {
+                    $rootScope.$broadcast('lazyScrollEvent');
+                };
+
+                $element.bind('scroll', function () {
+
+                    $timeout.cancel(scrollTimeoutId);
+
+                    // wait and then invoke listeners (simulates stop event)
+                    scrollTimeoutId = $timeout($scope.invoke, 0);
+
+                });
+
+
+            }
+        };
+}])
+
+.directive('imageLazySrc', ['$document', '$timeout', '$ionicScrollDelegate', '$compile',
+    function ($document, $timeout, $ionicScrollDelegate, $compile) {
+        return {
+            restrict: 'A',
+            scope: {
+                lazyScrollResize: "@lazyScrollResize",
+                imageLazyBackgroundImage: "@imageLazyBackgroundImage"
+            },
+            link: function ($scope, $element, $attributes) {
+                if (!$attributes.imageLazyDistanceFromBottomToLoad) {
+                    $attributes.imageLazyDistanceFromBottomToLoad = 0;
+                }
+                if (!$attributes.imageLazyDistanceFromRightToLoad) {
+                    $attributes.imageLazyDistanceFromRightToLoad = 0;
+                }
+
+                if ($attributes.imageLazyLoader) {
+                    var loader = $compile('<div class="image-loader-container"><ion-spinner class="image-loader" icon="' + $attributes.imageLazyLoader + '"></ion-spinner></div>')($scope);
+                    $element.after(loader);
+                }
+
+                var deregistration = $scope.$on('lazyScrollEvent', function () {
+                        //console.log('scroll');
+                        if (isInView()) {
+                            loadImage();
+                            deregistration();
+                        }
+                    }
+                );
+
+                function loadImage() {
+                    //Bind "load" event
+                    $element.bind("load", function (e) {
+                        if ($attributes.imageLazyLoader) {
+                            loader.remove();
+                        }
+                        if ($scope.lazyScrollResize == "true") {
+                            //Call the resize to recalculate the size of the screen
+                            $ionicScrollDelegate.resize();
+                        }
+                    });
+
+                    if ($scope.imageLazyBackgroundImage == "true") {
+                        var bgImg = new Image();
+                        bgImg.onload = function () {
+                            if ($attributes.imageLazyLoader) {
+                                loader.remove();
+                            }
+                            $element[0].style.backgroundImage = 'url(' + $attributes.imageLazySrc + ')'; // set style attribute on element (it will load image)
+                            if ($scope.lazyScrollResize == "true") {
+                                //Call the resize to recalculate the size of the screen
+                                $ionicScrollDelegate.resize();
+                            }
+                        };
+                        bgImg.src = $attributes.imageLazySrc;
+                    } else {
+                        $element[0].src = $attributes.imageLazySrc; // set src attribute on element (it will load image)
+                    }
+                }
+
+                function isInView() {
+                    var clientHeight = $document[0].documentElement.clientHeight;
+                    var clientWidth = $document[0].documentElement.clientWidth;
+                    var imageRect = $element[0].getBoundingClientRect();
+                    return (imageRect.top >= 0 && imageRect.top <= clientHeight + parseInt($attributes.imageLazyDistanceFromBottomToLoad))
+                        && (imageRect.left >= 0 && imageRect.left <= clientWidth + parseInt($attributes.imageLazyDistanceFromRightToLoad));
+                }
+
+                // bind listener
+                // listenerRemover = scrollAndResizeListener.bindListener(isInView);
+
+                // unbind event listeners if element was destroyed
+                // it happens when you change view, etc
+                $element.on('$destroy', function () {
+                    deregistration();
+                });
+
+                // explicitly call scroll listener (because, some images are in viewport already and we haven't scrolled yet)
+                $timeout(function () {
+                    if (isInView()) {
+                        loadImage();
+                        deregistration();
+                    }
+                }, 500);
+            }
+        };
+    }]);