analysing an ember app from another - using views object

Using Em.View.views to find views and controllers in ember

by amindunited

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.4/handlebars.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.0.0-rc.6/ember.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    Cheese BALLS
    {{render foo}}
</script>
<script type="text/x-handlebars" data-template-name="foo">
    I'm a motha fucking FOO!
    {{render bar}}
</script>
<script type="text/x-handlebars" data-template-name="bar">
    Where I drink
</script>

CSS

html, body{
    margin: 0;
    padding: 0;
}
#drawingAreaBackground {
    width: 100%;
    height: 100%;
}
.box {
    opacity: 0.9;
    position: absolute;
    width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
    border: solid 1px gray;
    background-color: #efefef;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}
.box ul {list-style-type: none; margin 0; padding:0;}
.box ul li {
    list-style-type: none; 
    margin 0; 
    padding:0;
    border: solid 1px #cdcdcd;
    border-top:none;
    font-size: 8pt;
}
.handle {
    background-color: #cdcdcd;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-bottom: groove 2px #dedede;
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
    cursor: pointer;
}
#model {
    display:none;
}

JavaScript

window.App = Em.Application.create();

App.BarView = Em.View.extend({
    templateName: "foo",
    didInsertElement: function(){
        console.log("in bar view ", this.$());
    }
})