snapshot
/
GuaranaUI


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
							<!DOCTYPE html>

<html>
	<head>
		<link rel="stylesheet" href="../../../themes/themeroller/maemo5-theme/ui.all.css" type="text/css" media="screen" />
		<link rel="stylesheet" href="../../../themes/nokia/ext-theme/maemo5/800x480/custom.css" type="text/css" media="screen" />

		<script src="../../../lib/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>

		<script src="../../../src/defaults.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../src/core.js" type="text/javascript" charset="utf-8"></script>

		<style type="text/css" media="screen">
			body {
				font-size: 14px;
				padding: 15px;
				font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
			}

			p {
				margin: 30px 10px;
			}

			#progressbar {
				max-width: 300px;
			}
		</style>

	</head>

	<body>

		<div id="progressbar"></div>
		<br/><br/>
		<button onclick="window.progress1.setValue(25);">setValue to 25%</button>
		<button onclick="window.progress1.setValue(50);">setValue to 50%</button>
		<button onclick="window.progress1.setValue(100);">setValue to 100%</button>

		<script type="text/javascript" charset="utf-8">

			var init = function() {

				window.progress1 = new Nokia.ProgressBar({
					element: '#progressbar',
					//width: 400,
					//height: 25,
					value: 30,
					label: true,
					create: function() {
						console.log("Progress Bar: Create");
					},
					change: function(value) {
						console.log("Progress Bar: Change " + value);
					},
					complete: function(value) {
						console.log("Progress Bar: Complete " + value);
					}
				});
				
				/*
				 * Hide splash when its all done.
				*/
				
				Nokia.hideSplash();

			};
			
			/*
			 * Show splash while loading components.
			*/
				
			Nokia.showSplash('<span>loading</span>');
			
			Nokia.use('progressbar', init);

		</script>

	</body>
</html>