jconniff/yui_dial_example_code

## yui_dial_example_code
<html>
<head>

<script src="http://yui.yahooapis.com/3.14.1/build/yui/yui-min.js"></script>

</head>
<body class="yui3-skin-sam">
<div id="demo"></div>

<br />
<div id="buttons">
<button class="xx min"> Min </button>
<button class="xx d_maj"> -- </button>
<button class="xx d_min"> - </button>
<button class="xx i_min"> + </button>
<button class="xx i_maj"> ++ </button>
<button class="xx max"> Max </button>
<button class="xx orig"> Reset </button>
</div>
<script>
YUI().use('dial', function(Y) {
    var dial = new Y.Dial({
		strings: {
		label: 'Volume',
		},
        min:-34,
        minorStep:3,  // this is how you change the minimum increment step size
        max:120,
        stepsPerRevolution:100,
        value: 0,
    }).render("#demo");

    // event handler for all objects with class 'xx'
	Y.all('.xx').on('click', function(e){
		if(e.target.hasClass('i_min')){
			// these are attributes built into dial
			// You can set their values
			// http://yuilibrary.com/yui/docs/dial/#attributes
			dial._incrMinor();
		}
		if(e.target.hasClass('d_min')){
			dial._decrMinor();
		}
		if(e.target.hasClass('i_maj')){
			dial._incrMajor();
		}
		if(e.target.hasClass('d_maj')){
			dial._decrMajor();
		}


		if(e.target.hasClass('min')){
			dial._setToMin();
		}
		if(e.target.hasClass('max')){
			dial._setToMax();
		}

		if(e.target.hasClass('orig')){
			dial._resetDial();
		}
	});


});
</script>
</body>
</html>
	<html>
	<head>

	<script src="http://yui.yahooapis.com/3.14.1/build/yui/yui-min.js"></script>

	</head>
	<body class="yui3-skin-sam">
	<div id="demo"></div>

	<br />
	<div id="buttons">
	<button class="xx min"> Min </button>
	<button class="xx d_maj"> -- </button>
	<button class="xx d_min"> - </button>
	<button class="xx i_min"> + </button>
	<button class="xx i_maj"> ++ </button>
	<button class="xx max"> Max </button>
	<button class="xx orig"> Reset </button>
	</div>
	<script>
	YUI().use('dial', function(Y) {
	var dial = new Y.Dial({
	strings: {
	label: 'Volume',
	},
	min:-34,
	minorStep:3, // this is how you change the minimum increment step size
	max:120,
	stepsPerRevolution:100,
	value: 0,
	}).render("#demo");

	// event handler for all objects with class 'xx'
	Y.all('.xx').on('click', function(e){
	if(e.target.hasClass('i_min')){
	// these are attributes built into dial
	// You can set their values
	// http://yuilibrary.com/yui/docs/dial/#attributes
	dial._incrMinor();
	}
	if(e.target.hasClass('d_min')){
	dial._decrMinor();
	}
	if(e.target.hasClass('i_maj')){
	dial._incrMajor();
	}
	if(e.target.hasClass('d_maj')){
	dial._decrMajor();
	}


	if(e.target.hasClass('min')){
	dial._setToMin();
	}
	if(e.target.hasClass('max')){
	dial._setToMax();
	}

	if(e.target.hasClass('orig')){
	dial._resetDial();
	}
	});



	});
	</script>
	</body>
	</html>