tests/manual/basic.html

	basic.html revision 8047ca98fec9d6ef0332db9181173401bb9eeaa3
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<!doctype html>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<html>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<head>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    <title>Test Page</title>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    <style type="text/css">
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        .markup {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala            margin: 10px 0 0 300px;
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        }
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    </style>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala</head>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<body class="yui3-skin-sam">
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<div class="markup">
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    <div id="slider"></div>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    <p>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        <input type="button" id="size" value="Change size">
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        <input type="button" id="val" value="Set Value">
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        <input type="button" id="disable" value="Disable">
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        <!--<input type="button" id="incr" value="incr">-->
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    </p>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    <div id="report">0</div>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala</div>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<script src="/build/yui/yui.js"></script>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala<script>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy TummalaYUI({
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    filter: 'raw'
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala}).use('slider',function (Y) {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummalavar report = Y.one('#report');
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummalavar s = new Y.Slider({
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    //axis  : 'y',
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    length: '350px',
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    min   : -37,
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    max   : 218,
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    value : 136,
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala//    minorStep: 3,
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    after : {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        valueChange: function (e) {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala            report.set('innerHTML',e.newVal);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala        }
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    }
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummalas.set('min', 10);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummalas.render('#slider');
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummalas.on('railMouseDown', function (e) {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    console.log(e);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummalas.rail.on(['mousedown', 'mouseup', 'click'], function (e) {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    e.type;
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    console.log(e);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
c87dd6b73ce417a1c364f2b85436755e8e3ade21Rajkumar Sivaprakasam
c87dd6b73ce417a1c364f2b85436755e8e3ade21Rajkumar Sivaprakasamreport.set('innerHTML',s.get('value'));
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy TummalaY.one('#size').on('click',function () {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    s.set('length','155px');
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy TummalaY.one('#val').on('click',function () {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    s.set('value',s.get('value') === -92 ? 100 : -92);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy TummalaY.one('#disable').on('click',function () {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    var disabled = !s.get('disabled');
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    s.set('disabled',disabled);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala    this.set('value', disabled ? "Enable" : "Disable");
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala// Y.one('#incr').on('click',function () {
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala//     s.set('value', 133);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala//     Y.log('myVal' + s.get('value'));
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala//     s.set('value', 134);
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala//     Y.log('myVal' + s.get('value'));
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala// });
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala});
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala</script>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala</body>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala</html>
1cfa752f4e24c34133009b0f6c139127a5c461deRamaswamy Tummala