ares-ide
Version:
A browser-based code editor and UI designer for Enyo 2 projects
116 lines (115 loc) • 2.77 kB
HTML
<html>
<head>
<title>Analyzer Example</title>
<!-- -->
<script src="../../../../enyo/enyo.js" type="text/javascript"></script>
<!-- -->
<script src="../../../layout/fittable/package.js" type="text/javascript"></script>
<script src="../package.js" type="text/javascript"></script>
<script src="Presentor.js" type="text/javascript"></script>
<!-- -->
<style>
body {
background-color: silver;
}
i {
color: #555;
}
comment {
display: block;
font-size: smaller;
font-style: italic;
color: green;
padding: 16px 0 8px;
}
label {
font-weight: bold;
}
public {
color: Orange;
padding-right: 4px;
}
protected {
color: Red;
padding-right: 4px;
}
module {
text-decoration: underline;
color: #46E;
cursor: pointer;
}
.box {
padding: 8px;
border: 1px solid #eee;
border-radius: 4px;
margin: 8px;
background-color: whitesmoke;
overflow: auto;
}
#app_modules {
width: 16%;
}
#app_body {
width: 30%;
}
</style>
</head>
<body>
<script>
enyo.kind({
name: "App",
kind: "FittableColumns",
style: "padding: 8px 0;",
components: [
{name: "modules", classes: "box"},
{name: "docs", fit: true, classes: "box", allowHtml: true},
{name: "body", tag: "code", fit: true, classes: "box", style: "overflow: auto;"}
],
create: function() {
this.inherited(arguments);
//this.read("$enyo/source");
this.walk(["$enyo/source", "$lib/layout/fittable", "$lib/layout/list/source", "$lib/onyx/source"]);
},
walk: function(inPaths) {
this.modules = [];
var next = function(inSender, inData) {
if (inData) {
this.modules = this.modules.concat(inData.modules);
}
var path = inPaths.shift();
if (path) {
//this.log(path);
new analyzer.Walker().walk(path).response(this, next);
} else {
this.read(this.modules);
}
};
next.call(this);
},
read: function(inModules) {
new analyzer.Reader()
.go({modules: inModules})
.response(this, function(inSender, inData) {
this.modules = inData.modules;
this.$.modules.destroyClientControls();
for (var i=0, m; m=this.modules[i]; i++) {
this.createComponent({tag: "module", container: this.$.modules, allowHtml: true, content: m.rawPath + "<br/>", module: m, ontap: "moduleTap"});
}
this.$.modules.render();
this.document(this.modules[8].code);
})
;
},
moduleTap: function(inSender) {
this.document(inSender.module.code);
},
document: function(inCode) {
this.$.body.setContent(inCode);
this.$.docs.setContent(new analyzer.Presentor().document(inCode));
}
});
new App({fit: true}).write();
</script>
</body>
</html>