public
Last active

Stackoverflow Issue 12706031

  • Download Gist
index.html
Liquid
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63
<html>
<head>
<title>Stackoverflow Issue</title>
 
<style type="text/css">
.blocks-container {
width: 30em;
height: 30em;
border:2px solid #566789;
box-shadow: 2px 2px 19px #aaa;
-o-box-shadow: 2px 2px 19px #aaa;
-webkit-box-shadow: 2px 2px 19px #aaa;
-moz-box-shadow: 2px 2px 19px #aaa;
-moz-border-radius:0.5em;
border-radius:0.5em;
opacity:0.7;
filter:alpha(opacity=80);
margin: 0.5em;
}
 
.block {
display: block;
float: left;
border:1px solid #779989;
box-shadow: 2px 2px 19px #aaa;
-o-box-shadow: 2px 2px 19px #aaa;
-webkit-box-shadow: 2px 2px 19px #aaa;
-moz-box-shadow: 2px 2px 19px #aaa;
-moz-border-radius:0.5em;
border-radius:0.5em;
opacity:0.8;
filter:alpha(opacity=80);
line-height:5em;
text-align:center;
z-index:20;
background-color:#FFC000;
color:black;
font-family:helvetica;
padding:0.5em;
margin: 0.5em;
font-size:0.9em;
}‚Äč
</style>
</head>
<body>
<script type="text/x-handlebars" data-template-name="application">
<h1>Application</h1>
{{outlet}}
</script>
 
<script type="text/x-handlebars" data-template-name="blocki" >
{{name}}
{{#each children}}
{{view App.BlocksView blockiBinding="this"}}
{{/each}}
</script>
 
<script src="js/jquery-1.7.2.js"></script>
<script src="js/handlebars-1.0.0.beta.6.js"></script>
<script src="js/ember-1.0.pre.js"></script>
<script src="js/myapplication.js"></script>
</body>
</html>
myapplication.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56
window.App = Ember.Application.create();
 
App.ApplicationView = Ember.View.extend({ templateName: 'application' });
App.ApplicationController = Ember.Controller.extend();
App.BlocksView = Ember.View.extend({
tagName: 'div',
classNames: ['block'],
templateName: 'blocki'
})
 
App.BlocksController = Ember.ObjectController.extend();
 
App.testData = {
"name": "main page",
"children": [
{
"name": "Block 1",
"children": [
{ "name": "Block 1.1" },
{ "name": "Block 1.2" }
]
},
{
"name": "Block 2",
"children": [
{
"name": "Block 2.1",
"children": [
{
"name": "Block 2.1.1",
"children": [
{ "name": "Block 2.1.1.1" }
]
}
]
}
]
}
]
};
 
App.Router = Ember.Router.extend({
enableLogging: true,
root: Ember.Route.extend({
blocks: Ember.Route.extend({
route: "/",
connectOutlets: function(router, context) {
router.get("applicationController").connectOutlet("blocks", App.testData);
console.log("connecting blocks outlets");
}
})
})
});
App.initialize();

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.