momoko8443-ukulelejs
/
index.html

<!DOCTYPE html>
<html>
	<title>UkuleleJS</title>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
		<link rel="stylesheet" href="bower_components/highlightjs/styles/default.css">
		<script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script>
		<script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<script src="build/js/ukulele.js"></script>
		<script src="bower_components/highlightjs/highlight.pack.js"></script>
	</head>
	<body uku-application>
		<ul class="nav nav-pills" role="tablist" style="float:right">
			<li role="presentation">
				<a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a>
			</li>
			<li role="presentation">
				<a href="#example" aria-controls="example" role="tab" data-toggle="tab">Example</a>
			</li>
			<li role="presentation">
				<a href="#api" aria-controls="api" role="tab" data-toggle="tab">API</a>
			</li>
		</ul>
		<div class="tab-content">
			<div role="tabpanel" class="tab-pane active" id="home" style="margin: 20px">
				<div class="uku-include" src="home.html"></div>
			</div>
			<div role="tabpanel" class="tab-pane" id="example" style="margin: 20px">
				<div class="uku-include" src="example.html"></div>
			</div>
			<div role="tabpanel" class="tab-pane" id="api" style="margin: 20px">
				<div class="uku-include" src="api.html"></div>
			</div>
		</div>

	</body>
	<script>
		function MyController() {
			this.message = "";
			this.myName = "please input your name";
			this.sayHello = function() {
				alert(this.myName);
			};
			this.sayHelloWithArgument = function(name) {
				alert("Hi," + name);
			};

			this.sayHelloWithInstanceArgument = function(instance) {
				alert("Hi," + instance.name);
			};

			this.sayHelloWith2Argument = function(name, name2) {
				alert("Hi," + name + " and " + name2);
			};

			this.add = function(num1, num2) {
				var sum = num1 + num2;
				return sum;
			};
			this.items = [
				{
					"name" : "Kamaka HF-1",
					"imgUrl": "example/images/hf1.jpg",
					"subModels" : [{"name" : "HF-1 basical version"},{"name" : "HF-1 with pickup"}]
				}, {
					"name" : "Kamaka HF-2",
					"imgUrl": "example/images/hf2.jpg",
					"subModels" : [{"name" : "HF-2 basical version"},{"name" : "HF-2 with pickup"}]
				}, {
					"name" : "Kamaka HF-3",
					"imgUrl": "example/images/hf3.jpg",
					"subModels" : [{"name" : "HF-3 basical version"},{"name" : "HF-3 with pickup"}]
				}];
			this.child = new Child();
			this.numA = 2;
			this.numB = 3;

		}

		function Child() {
			this.name = undefined;
			this.say = function() {
				return "Hi, " + this.name;
			};
		}

		var ishljsInitial = false;
		$(document).ready(function() {
			var uku = new Ukulele(500);
			uku.registerController("myCtrl", new MyController());
			uku.init();
			uku.refreshHandler(function(){
				if(!ishljsInitial){
					$('pre code').each(function(i, block) {
					    hljs.highlightBlock(block);
					});
					ishljsInitial = true;
				}
			});
		});
	</script>
</html>