vendredi 30 janvier 2015

Setting Up EmberJS

I'm trying to set up EmberJS. This is my first website attempting this so please excuse my noobness. Currently nothing is outputting to the screen but the body's grey background color. I'm not sure where I went wrong in setting up my EmberJS page. Here's the code and if you need to see it in action you can view it here http://ift.tt/1zWsu1Q HTML



<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Site Demo</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/header.css">
<link rel="stylesheet" type="text/css" href="css/mainPage.css">


</head>

<body>

<script type='text/x-handlebars' data-template-name='application'>

<div class="container">
<div class="header">
<div class='col-md-1'>
Logo
</div><!--end header container-->
<div class='col-md-2 col-md-offset-1'>
<div class='link1'>
<a href="#">Link1</a>
</div>
</div>
<div class='col-md-3'>
<div class='link2'>
<a href="#">Link2</a>
</div>
</div>
<div class='col-md-2'>
<div class='link3'>
<a href="#">Link3</a>
</div>
</div>
<div class='col-md-2'>
<div class='searchBar'>
<input type="text" class="form-control" placeholder="Search Box">
</div>
</div>
<div class='col-md-1'>
<div class='searchButton'>
<button class="btn btn-search" type="submit">Search</button>
</div>
</div>

</div>

</div>

<div class="container">
<div class='underHeader'>

</div>
</div>

<div class="container">
<div class='whiteBox'>
<div class='newProducts'>
</div>
{{outlet}}
</div>
</div>
</script>
<script type='text/x-handlebars' data-template-name='index'>
<h1>Testing the page</h1>
</script>
</body>

<script src="js/jquery.easing-1.3.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/menu.js"></script>
<script type="text/javascript" src="js/libs/handlebars-v2.0.0.js"></script>
<script type="text/javascript" src="js/libs/ember-1.9.1.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</html>


CSS



var App = Ember.Application.create();

App.Router.map(function() {
// put your routes here
});

App.IndexRoute = Ember.Route.extend({
model: function() {
return ['red', 'yellow', 'blue'];
}
});




Aucun commentaire:

Enregistrer un commentaire