]>
Commit | Line | Data |
---|---|---|
947f0963 TL |
1 | Ext.require('Ext.slider.*'); |
2 | ||
3 | Ext.onReady(function() { | |
4 | ||
5 | Ext.create('Ext.slider.Single', { | |
6 | renderTo: 'basic-slider', | |
7 | width: 214, | |
8 | minValue: 0, | |
9 | hideLabel: true, | |
10 | useTips: false, | |
11 | maxValue: 100 | |
12 | }); | |
13 | ||
14 | Ext.create('Ext.slider.Single', { | |
15 | renderTo: 'increment-slider', | |
16 | hideLabel: true, | |
17 | useTips: false, | |
18 | width: 214, | |
19 | value: 50, | |
20 | increment: 10, | |
21 | minValue: 0, | |
22 | maxValue: 100 | |
23 | }); | |
24 | ||
25 | // This Should allow values 65, 67, 69, 71, 73 and 74 | |
26 | // The initial value of 66 should get normalized to 67 | |
27 | // The max value of 74 will be restricted to 74. | |
28 | Ext.create('Ext.slider.Single', { | |
29 | renderTo: 'increment-slider-minValue', | |
30 | hideLabel: true, | |
31 | width: 214, | |
32 | value: 66, | |
33 | increment: 2, | |
34 | minValue: 65, | |
35 | maxValue: 74 | |
36 | }); | |
37 | ||
38 | Ext.create('Ext.slider.Single', { | |
39 | renderTo: 'vertical-slider', | |
40 | hideLabel: true, | |
41 | useTips: false, | |
42 | height: 214, | |
43 | vertical: true, | |
44 | minValue: 0, | |
45 | maxValue: 100 | |
46 | }); | |
47 | ||
48 | Ext.create('Ext.slider.Single', { | |
49 | renderTo: 'tip-slider', | |
50 | hideLabel: true, | |
51 | width: 214, | |
52 | minValue: 0, | |
53 | maxValue: 100 | |
54 | }); | |
55 | ||
56 | Ext.create('Ext.slider.Single', { | |
57 | renderTo: 'custom-tip-slider', | |
58 | hideLabel: true, | |
59 | width: 214, | |
60 | increment: 10, | |
61 | minValue: 0, | |
62 | maxValue: 100, | |
63 | tipText: function(thumb) { | |
64 | return Ext.String.format('<b>{0}% complete</b>', thumb.value); | |
65 | } | |
66 | }); | |
67 | ||
68 | Ext.create('Ext.slider.Single', { | |
69 | renderTo: 'custom-slider', | |
70 | hideLabel: true, | |
71 | width: 214, | |
72 | increment: 10, | |
73 | minValue: 0, | |
74 | maxValue: 100 | |
75 | }); | |
76 | ||
77 | Ext.create('Ext.slider.Multi', { | |
78 | renderTo: 'multi-slider-horizontal', | |
79 | hideLabel: true, | |
80 | width: 214, | |
81 | minValue: 0, | |
82 | maxValue: 100, | |
83 | values: [10, 50, 90] | |
84 | }); | |
85 | ||
86 | Ext.create('Ext.slider.Multi', { | |
87 | renderTo: 'multi-slider-vertical', | |
88 | hideLabel: true, | |
89 | vertical: true, | |
90 | height: 214, | |
91 | minValue: 0, | |
92 | maxValue: 100, | |
93 | values: [10, 50, 90] | |
94 | }); | |
95 | }); |