Update to 2.0

IonDen · Nov 8, 2014 · 4cb82e1 · 4cb82e1
1 parent f4433a8
commit 4cb82e1
Show file tree

Hide file tree

Showing 20 changed files with 2,959 additions and 1,443 deletions.
diff --git a/PSD/sprite-skin.psd b/PSD/sprite-skin.psd
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
     "name": "ion.rangeSlider",
-    "version": "1.9.3",
+    "version": "2.0.0",
     "homepage": "https://github.com/IonDen/ion.rangeSlider",
     "authors": [
         {
@@ -9,9 +9,6 @@
             "homepage": "http://ionden.com"
         }
     ],
-    "dependencies": {
-        "jquery": ">=1.9"
-    },
     "description": "Powerful range slider with skin support",
     "repository": {
         "type": "git",
@@ -23,6 +20,9 @@
         "css/ion.rangeSlider.skinFlat.css",
         "img/sprite-skin-flat.png"
     ],
+    "dependencies": {
+        "jquery": ">=1.8"
+    },
     "moduleType": [
         "globals"
     ],

diff --git a/css/ion.rangeSlider.css b/css/ion.rangeSlider.css
@@ -1,5 +1,5 @@
 /* Ion.RangeSlider
-// css version 1.9.2
+// css version 2.0.0
 // © 2013-2014 Denis Ineshin | IonDen.com
 // ===================================================================================================================*/
 
@@ -8,6 +8,12 @@
 
 .irs {
     position: relative; display: block;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+     -khtml-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
 }
     .irs-line {
         position: relative; display: block;
@@ -18,19 +24,29 @@
             top: 0;
         }
         .irs-line-left {
-            left: 0; width: 10%;
+            left: 0; width: 11%;
         }
         .irs-line-mid {
             left: 9%; width: 82%;
         }
         .irs-line-right {
-            right: 0; width: 10%;
+            right: 0; width: 11%;
         }
 
-    .irs-diapason {
+    .irs-bar {
         position: absolute; display: block;
-        left: 0; width: 100%;
+        left: 0; width: 0;
     }
+        .irs-bar-edge {
+            position: absolute; display: block;
+            top: 0; left: 0;
+        }
+
+    .irs-shadow {
+        position: absolute; display: none;
+        left: 0; width: 0;
+    }
+
     .irs-slider {
         position: absolute; display: block;
         cursor: default;
@@ -63,7 +79,7 @@
                 width: 130%; height: 160%;
                 background: rgba(0,0,0,0.0);
             }
-        .irs-slider.last {
+        .irs-slider.type_last {
             z-index: 2;
         }
 
@@ -85,7 +101,6 @@
         white-space: nowrap;
     }
 
-
 .irs-grid {
     position: absolute; display: none;
     bottom: 0; left: 0;
@@ -106,21 +121,40 @@
     .irs-grid-text {
         position: absolute;
         bottom: 0; left: 0;
-        width: 100px;
         white-space: nowrap;
         text-align: center;
         font-size: 9px; line-height: 9px;
+        padding: 0 3px;
         color: #000;
     }
 
 .irs-disable-mask {
     position: absolute; display: block;
-    top: 0; left: 0;
-    width: 100%; height: 100%;
+    top: 0; left: -1%;
+    width: 102%; height: 100%;
     cursor: default;
     background: rgba(0,0,0,0.0);
     z-index: 2;
 }
 .irs-disabled {
     opacity: 0.4;
 }
+.lt-ie9 .irs-disabled {
+    filter: alpha(opacity=40);
+}
+
+
+.irs-hidden-input {
+    position: absolute !important;
+    display: block !important;
+    top: 0 !important;
+    left: 0 !important;
+    width: 0 !important;
+    height: 0 !important;
+    font-size: 0 !important;
+    line-height: 0 !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    outline: none !important;
+    z-index: -9999 !important;
+}
diff --git a/css/ion.rangeSlider.skinFlat.css b/css/ion.rangeSlider.skinFlat.css
@@ -1,6 +1,6 @@
 /* Ion.RangeSlider, Flat UI Skin
-// css version 1.9.2
-// © 2013-2014 Denis Ineshin | IonDen.com
+// css version 2.0.0
+// © Denis Ineshin, 2014    https://github.com/IonDen
 // ===================================================================================================================*/
 
 /* =====================================================================================================================
@@ -9,7 +9,8 @@
 .irs-line-mid,
 .irs-line-left,
 .irs-line-right,
-.irs-diapason,
+.irs-bar,
+.irs-bar-edge,
 .irs-slider {
     background: url(../img/sprite-skin-flat.png) repeat-x;
 }
@@ -36,18 +37,32 @@
         background-position: 100% -30px;
     }
 
-.irs-diapason {
+.irs-bar {
     height: 12px; top: 25px;
     background-position: 0 -60px;
 }
+    .irs-bar-edge {
+        top: 25px;
+        height: 12px; width: 9px;
+        background-position: 0 -90px;
+    }
+
+.irs-shadow {
+    height: 3px; top: 34px;
+    background: #000;
+    opacity: 0.25;
+}
+.lt-ie9 .irs-shadow {
+    filter: alpha(opacity=25);
+}
 
 .irs-slider {
     width: 16px; height: 18px;
     top: 22px;
-    background-position: 0 -90px;
+    background-position: 0 -120px;
 }
 #irs-active-slider, .irs-slider:hover {
-    background-position: 0 -120px;
+    background-position: 0 -150px;
 }
 
 .irs-min, .irs-max {
@@ -56,6 +71,7 @@
     text-shadow: none;
     top: 0; padding: 1px 3px;
     background: #e1e4e9;
+    -moz-border-radius: 4px;
     border-radius: 4px;
 }
 
@@ -65,6 +81,7 @@
     text-shadow: none;
     padding: 1px 5px;
     background: #ed5565;
+    -moz-border-radius: 4px;
     border-radius: 4px;
 }
 .irs-from:after, .irs-to:after, .irs-single:after {

diff --git a/css/ion.rangeSlider.skinHTML5.css b/css/ion.rangeSlider.skinHTML5.css
@@ -0,0 +1,124 @@
+/* Ion.RangeSlider, Simple Skin
+// css version 2.0.0
+// © Denis Ineshin, 2014    https://github.com/IonDen
+// © guybowden, 2014        https://github.com/guybowden
+// ===================================================================================================================*/
+
+/* =====================================================================================================================
+// Skin details */
+
+.irs {
+    height: 55px;
+}
+.irs-with-grid {
+    height: 75px;
+}
+.irs-line {
+    height: 10px; top: 33px;
+    background: #EEE;
+    background: linear-gradient(to bottom, #DDD -50%, #FFF 150%); /* W3C */
+    border: 1px solid #CCC;
+    border-radius: 16px;
+    -moz-border-radius: 16px;
+}
+    .irs-line-left {
+        height: 8px;
+    }
+    .irs-line-mid {
+        height: 8px;
+    }
+    .irs-line-right {
+        height: 8px;
+    }
+
+.irs-bar {
+    height: 10px; top: 33px;
+    border-top: 1px solid #428bca;
+    border-bottom: 1px solid #428bca;
+    background: #428bca;
+    background: linear-gradient(to top, rgba(66,139,202,1) 0%,rgba(127,195,232,1) 100%); /* W3C */
+}
+    .irs-bar-edge {
+        height: 10px; top: 33px;
+        width: 14px;
+        border: 1px solid #428bca;
+        border-right: 0;
+        background: #428bca;
+        background: linear-gradient(to top, rgba(66,139,202,1) 0%,rgba(127,195,232,1) 100%); /* W3C */
+        border-radius: 16px 0 0 16px;
+        -moz-border-radius: 16px 0 0 16px;
+    }
+
+.irs-shadow {
+    height: 2px; top: 38px;
+    background: #000;
+    opacity: 0.3;
+    border-radius: 5px;
+    -moz-border-radius: 5px;
+}
+.lt-ie9 .irs-shadow {
+    filter: alpha(opacity=30);
+}
+
+.irs-slider {
+    top: 25px;
+    width: 27px; height: 27px;
+    border: 1px solid #AAA;
+    background: #DDD;
+    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(220,220,220,1) 20%,rgba(255,255,255,1) 100%); /* W3C */
+    border-radius: 27px;
+    -moz-border-radius: 27px;
+    box-shadow: 1px 1px 3px rgba(0,0,0,0.3);
+    cursor: pointer;
+}
+
+#irs-active-slider, .irs-slider:hover {
+    background: #FFF;
+}
+
+.irs-min, .irs-max {
+    color: #333;
+    font-size: 12px; line-height: 1.333;
+    text-shadow: none;
+    top: 0;
+    padding: 1px 5px;
+    background: rgba(0,0,0,0.1);
+    border-radius: 3px;
+    -moz-border-radius: 3px;
+}
+
+.lt-ie9 .irs-min, .lt-ie9 .irs-max {
+    background: #ccc;
+}
+
+.irs-from, .irs-to, .irs-single {
+    color: #fff;
+    font-size: 14px; line-height: 1.333;
+    text-shadow: none;
+    padding: 1px 5px;
+    background: #428bca;
+    border-radius: 3px;
+    -moz-border-radius: 3px;
+}
+.lt-ie9 .irs-from, .lt-ie9 .irs-to, .lt-ie9 .irs-single {
+    background: #999;
+}
+
+.irs-grid {
+    height: 27px;
+}
+.irs-grid-pol {
+    opacity: 0.5;
+    background: #428bca;
+}
+.irs-grid-pol.small {
+    background: #999;
+}
+
+.irs-grid-text {
+    bottom: 5px;
+    color: #99a4ac;
+}
+
+.irs-disabled {
+}