Permalink
Browse files

refactor

  • Loading branch information...
1 parent f0474a0 commit c838a99d356511275a962de02f882ed363cd1cf9 Stefan Nguyen committed Apr 3, 2012
Showing 404 changed files with 30 additions and 9 deletions.
View
15 app.js
@@ -11,13 +11,22 @@ Ext.application({
xtype: "slider-with-bars",
value: 15,
barValue: [70, 15],
- id: 'mySlider'
+ id: 'mySlider',
+ barCls: ['', 'x-bar-orange']
},
{
xtype: "button",
- text: "Do something",
+ text: "More thumbs",
handler: function() {
- Ext.getCmp("mySlider").setBarCls(['', 'x-bar-orange'])
+ Ext.getCmp("mySlider").setValues([20, 40])
+ }
+ },
+ {
+ xtype: "button",
+ text: "More bars",
+ handler: function() {
+ Ext.getCmp("mySlider").setBarValues([70, 30, 15]);
+ Ext.getCmp("mySlider").setBarCls(['', 'x-bar-orange', 'x-bar-green']);
}
}
]
View
@@ -1,12 +1,20 @@
<!DOCTYPE html>
<html>
<head>
- <title>Getting Started</title>
- <link rel="stylesheet" href="resources/css/sencha-touch.css" type="text/css">
+ <title>Sencha Touch 2 SliderWithBars demo</title>
+ <link rel="stylesheet" href="vendor/resources/css/sencha-touch.css" type="text/css">
<link rel="stylesheet" href="slider_with_bars/style.css" type="text/css">
- <script type="text/javascript" src="builds/sencha-touch-all-compat.js"></script>
+
+ <style type="text/css" media="screen">
+ .x-bar-orange { background-color: orange }
+ .x-bar-green { background-color: green }
+ </style>
+
+ <script type="text/javascript" src="vendor/sencha-touch-all-compat.js"></script>
+
<script type="text/javascript" src="slider_with_bars/bar.js"></script>
<script type="text/javascript" src="slider_with_bars/slider.js"></script>
+
<script type="text/javascript" src="app.js"></script>
</head>
<body></body>
@@ -36,7 +36,7 @@ Ext.define('Ext.ux.SliderWithBars', {
var bars = this.getBars();
for (var i = 0; i < bars.length; i++) {
- bars[i].setWidth(newValue[i] * this.offsetValueRatio);
+ bars[i].setWidth(newValue[i] * this.offsetValueRatio + 7);
}
},
@@ -1,4 +1,10 @@
.x-thumb { z-index: 3!important }
+.x-thumb::before {
+ width: 1.2em;
+ height: 1.2em;
+ top: 0.5em;
+left: 0.75em;
+}
.x-bar-in-slider {
position: absolute;
width: auto;
@@ -13,5 +19,3 @@
border-radius: 0.4em;
z-index: 2;
}
-
-.x-bar-orange { background-color: orange }
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
Oops, something went wrong.

0 comments on commit c838a99

Please sign in to comment.