Replaced service location by dependency injection

This commit is contained in:
Borys Levytskyi
2015-04-03 03:39:55 +03:00
parent 569c335368
commit 86349c9c30
5 changed files with 104 additions and 100 deletions

154
.idea/workspace.xml generated
View File

@@ -26,8 +26,8 @@
<file leaf-file-name="views.js" pinned="false" current="false" current-in-tab="false"> <file leaf-file-name="views.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/app/views.js"> <entry file="file://$PROJECT_DIR$/app/views.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="269" max-vertical-offset="1190"> <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1190">
<caret line="37" column="9" selection-start-line="37" selection-start-column="9" selection-end-line="37" selection-end-column="9" /> <caret line="4" column="11" selection-start-line="4" selection-start-column="11" selection-end-line="4" selection-end-column="11" />
<folding /> <folding />
</state> </state>
</provider> </provider>
@@ -36,8 +36,18 @@
<file leaf-file-name="controllers.js" pinned="false" current="false" current-in-tab="false"> <file leaf-file-name="controllers.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/app/controllers.js"> <entry file="file://$PROJECT_DIR$/app/controllers.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="799"> <state vertical-scroll-proportion="0.0" vertical-offset="75" max-vertical-offset="816">
<caret line="2" column="7" selection-start-line="2" selection-start-column="7" selection-end-line="2" selection-end-column="18" /> <caret line="37" column="7" selection-start-line="37" selection-start-column="7" selection-end-line="37" selection-end-column="7" />
<folding />
</state>
</provider>
</entry>
</file>
<file leaf-file-name="services.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/app/services.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="238">
<caret line="2" column="0" selection-start-line="2" selection-start-column="0" selection-end-line="2" selection-end-column="0" />
<folding /> <folding />
</state> </state>
</provider> </provider>
@@ -46,8 +56,8 @@
<file leaf-file-name="index.html" pinned="false" current="true" current-in-tab="true"> <file leaf-file-name="index.html" pinned="false" current="true" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/index.html"> <entry file="file://$PROJECT_DIR$/index.html">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.27402136" vertical-offset="186" max-vertical-offset="2023"> <state vertical-scroll-proportion="0.93950176" vertical-offset="305" max-vertical-offset="2023">
<caret line="20" column="69" selection-start-line="20" selection-start-column="69" selection-end-line="20" selection-end-column="69" /> <caret line="49" column="13" selection-start-line="49" selection-start-column="13" selection-end-line="49" selection-end-column="13" />
<folding /> <folding />
</state> </state>
</provider> </provider>
@@ -56,18 +66,8 @@
<file leaf-file-name="bindr.js" pinned="false" current="false" current-in-tab="false"> <file leaf-file-name="bindr.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/components/bindr.js"> <entry file="file://$PROJECT_DIR$/components/bindr.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="1615" max-vertical-offset="2278"> <state vertical-scroll-proportion="0.0" vertical-offset="1241" max-vertical-offset="2278">
<caret line="95" column="24" selection-start-line="95" selection-start-column="24" selection-end-line="95" selection-end-column="24" /> <caret line="81" column="45" selection-start-line="81" selection-start-column="45" selection-end-line="81" selection-end-column="45" />
<folding />
</state>
</provider>
</entry>
</file>
<file leaf-file-name="commandr.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/components/commandr.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="204" max-vertical-offset="612">
<caret line="12" column="28" selection-start-line="12" selection-start-column="28" selection-end-line="12" selection-end-column="28" />
<folding /> <folding />
</state> </state>
</provider> </provider>
@@ -76,9 +76,12 @@
<file leaf-file-name="app.js" pinned="false" current="false" current-in-tab="false"> <file leaf-file-name="app.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/app/app.js"> <entry file="file://$PROJECT_DIR$/app/app.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="136" max-vertical-offset="1292"> <state vertical-scroll-proportion="0.0" vertical-offset="92" max-vertical-offset="816">
<caret line="9" column="26" selection-start-line="9" selection-start-column="26" selection-end-line="9" selection-end-column="26" /> <caret line="43" column="0" selection-start-line="43" selection-start-column="0" selection-end-line="43" selection-end-column="0" />
<folding /> <folding>
<element signature="e#539#805#0" expanded="false" />
<element signature="e#841#885#0" expanded="false" />
</folding>
</state> </state>
</provider> </provider>
</entry> </entry>
@@ -116,8 +119,8 @@
<file leaf-file-name="container.js" pinned="false" current="false" current-in-tab="false"> <file leaf-file-name="container.js" pinned="false" current="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/components/container.js"> <entry file="file://$PROJECT_DIR$/components/container.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="126" max-vertical-offset="782"> <state vertical-scroll-proportion="0.0" vertical-offset="126" max-vertical-offset="799">
<caret line="18" column="9" selection-start-line="18" selection-start-column="9" selection-end-line="18" selection-end-column="9" /> <caret line="22" column="36" selection-start-line="22" selection-start-column="36" selection-end-line="22" selection-end-column="36" />
<folding /> <folding />
</state> </state>
</provider> </provider>
@@ -169,11 +172,12 @@
<option value="$PROJECT_DIR$/app/console.js" /> <option value="$PROJECT_DIR$/app/console.js" />
<option value="$PROJECT_DIR$/app/bootstrap.js" /> <option value="$PROJECT_DIR$/app/bootstrap.js" />
<option value="$PROJECT_DIR$/components/controlr.js" /> <option value="$PROJECT_DIR$/components/controlr.js" />
<option value="$PROJECT_DIR$/components/bindr.js" />
<option value="$PROJECT_DIR$/app/app.js" />
<option value="$PROJECT_DIR$/index.html" /> <option value="$PROJECT_DIR$/index.html" />
<option value="$PROJECT_DIR$/components/container.js" /> <option value="$PROJECT_DIR$/components/container.js" />
<option value="$PROJECT_DIR$/components/bindr.js" />
<option value="$PROJECT_DIR$/app/app.js" />
<option value="$PROJECT_DIR$/app/controllers.js" /> <option value="$PROJECT_DIR$/app/controllers.js" />
<option value="$PROJECT_DIR$/app/services.js" />
</list> </list>
</option> </option>
</component> </component>
@@ -422,7 +426,10 @@
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="153" max-vertical-offset="510"> <state vertical-scroll-proportion="0.0" vertical-offset="153" max-vertical-offset="510">
<caret line="9" column="30" selection-start-line="9" selection-start-column="30" selection-end-line="9" selection-end-column="30" /> <caret line="9" column="30" selection-start-line="9" selection-start-column="30" selection-end-line="9" selection-end-column="30" />
<folding /> <folding>
<element signature="e#539#805#0" expanded="false" />
<element signature="e#841#885#0" expanded="false" />
</folding>
</state> </state>
</provider> </provider>
</entry> </entry>
@@ -467,7 +474,10 @@
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="153" max-vertical-offset="510"> <state vertical-scroll-proportion="0.0" vertical-offset="153" max-vertical-offset="510">
<caret line="9" column="30" selection-start-line="9" selection-start-column="30" selection-end-line="9" selection-end-column="30" /> <caret line="9" column="30" selection-start-line="9" selection-start-column="30" selection-end-line="9" selection-end-column="30" />
<folding /> <folding>
<element signature="e#539#805#0" expanded="false" />
<element signature="e#841#885#0" expanded="false" />
</folding>
</state> </state>
</provider> </provider>
</entry> </entry>
@@ -513,7 +523,10 @@
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="510"> <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="510">
<caret line="0" column="20" selection-start-line="0" selection-start-column="20" selection-end-line="0" selection-end-column="20" /> <caret line="0" column="20" selection-start-line="0" selection-start-column="20" selection-end-line="0" selection-end-column="20" />
<folding /> <folding>
<element signature="e#539#805#0" expanded="false" />
<element signature="e#841#885#0" expanded="false" />
</folding>
</state> </state>
</provider> </provider>
</entry> </entry>
@@ -714,14 +727,6 @@
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/app/services.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="238">
<caret line="7" column="0" selection-start-line="7" selection-start-column="0" selection-end-line="7" selection-end-column="0" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/components/commandr.js"> <entry file="file://$PROJECT_DIR$/components/commandr.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="612"> <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="612">
@@ -738,18 +743,53 @@
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/app/views.js"> <entry file="file://$PROJECT_DIR$/components/html.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="269" max-vertical-offset="1190"> <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1105">
<caret line="37" column="9" selection-start-line="37" selection-start-column="9" selection-end-line="37" selection-end-column="9" /> <caret line="16" column="23" selection-start-line="16" selection-start-column="23" selection-end-line="16" selection-end-column="23" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/components/container.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="126" max-vertical-offset="799">
<caret line="22" column="36" selection-start-line="22" selection-start-column="36" selection-end-line="22" selection-end-column="36" />
<folding /> <folding />
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/components/bindr.js"> <entry file="file://$PROJECT_DIR$/components/bindr.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="983" max-vertical-offset="1972"> <state vertical-scroll-proportion="0.0" vertical-offset="1241" max-vertical-offset="2278">
<caret line="95" column="24" selection-start-line="95" selection-start-column="24" selection-end-line="95" selection-end-column="24" /> <caret line="81" column="45" selection-start-line="81" selection-start-column="45" selection-end-line="81" selection-end-column="45" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/app/app.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="92" max-vertical-offset="816">
<caret line="43" column="0" selection-start-line="43" selection-start-column="0" selection-end-line="43" selection-end-column="0" />
<folding>
<element signature="e#539#805#0" expanded="false" />
<element signature="e#841#885#0" expanded="false" />
</folding>
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/app/views.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1190">
<caret line="4" column="11" selection-start-line="4" selection-start-column="11" selection-end-line="4" selection-end-column="11" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/app/services.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="238">
<caret line="2" column="0" selection-start-line="2" selection-start-column="0" selection-end-line="2" selection-end-column="0" />
<folding /> <folding />
</state> </state>
</provider> </provider>
@@ -762,42 +802,18 @@
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/components/html.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1105">
<caret line="16" column="23" selection-start-line="16" selection-start-column="23" selection-end-line="16" selection-end-column="23" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/components/container.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="126" max-vertical-offset="782">
<caret line="18" column="9" selection-start-line="18" selection-start-column="9" selection-end-line="18" selection-end-column="9" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/app/app.js">
<provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="136" max-vertical-offset="1292">
<caret line="9" column="26" selection-start-line="9" selection-start-column="26" selection-end-line="9" selection-end-column="26" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/app/controllers.js"> <entry file="file://$PROJECT_DIR$/app/controllers.js">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="799"> <state vertical-scroll-proportion="0.0" vertical-offset="75" max-vertical-offset="816">
<caret line="2" column="7" selection-start-line="2" selection-start-column="7" selection-end-line="2" selection-end-column="18" /> <caret line="37" column="7" selection-start-line="37" selection-start-column="7" selection-end-line="37" selection-end-column="7" />
<folding /> <folding />
</state> </state>
</provider> </provider>
</entry> </entry>
<entry file="file://$PROJECT_DIR$/index.html"> <entry file="file://$PROJECT_DIR$/index.html">
<provider selected="true" editor-type-id="text-editor"> <provider selected="true" editor-type-id="text-editor">
<state vertical-scroll-proportion="0.27402136" vertical-offset="186" max-vertical-offset="2023"> <state vertical-scroll-proportion="0.93950176" vertical-offset="305" max-vertical-offset="2023">
<caret line="20" column="69" selection-start-line="20" selection-start-column="69" selection-end-line="20" selection-end-column="69" /> <caret line="49" column="13" selection-start-line="49" selection-start-column="13" selection-end-line="49" selection-end-column="13" />
<folding /> <folding />
</state> </state>
</provider> </provider>

View File

@@ -11,31 +11,17 @@
app.di = new Container(); app.di = new Container();
function resolveOrInject(name, inst, container, entityName) { app.component = function(name, inst) {
var resolved; if(arguments.length == 1) {
return this.di.resolve(name);
should.beString(name);
if (inst != null) {
container[name] = inst;
console.log(name + " " + entityName + " registered");
resolved = inst;
}
else {
resolved = container[name];
should.check(resolved != null, name + " " + entityName + " wasn't found");
} }
return resolved; this.di.register(name, inst);
}
app.service = function(name, inst) {
return resolveOrInject(name, inst, servicesContainer, "service");
}; };
app.controller = function(name, inst) { app.service = app.component;
return resolveOrInject(name, inst, controllersContainer, "controller");
}; app.controller = app.component;
app.command = function(name, handler) { app.command = function(name, handler) {
var cmd = commandHandlers[name]; var cmd = commandHandlers[name];
@@ -57,7 +43,7 @@
app.bootstrap = function(rootViewElement) { app.bootstrap = function(rootViewElement) {
invokeRunObservers(); invokeRunObservers();
bindr.bindControllers(rootViewElement, controllersContainer); bindr.bindControllers(rootViewElement, app.di);
}; };
function invokeRunObservers() { function invokeRunObservers() {

View File

@@ -1,15 +1,16 @@
(function(app){ (function(app){
app.controller('expressionInputCtrl', { app.controller('expressionInputCtrl', {
$dispatcher:null,
attachView: function (viewElement) { attachView: function (viewElement) {
var dispatcher = app.service('dispatcher');
viewElement.addEventListener('keyup', function (args) { viewElement.addEventListener('keyup', function (args) {
if (args.keyCode != 13) { if (args.keyCode != 13) {
return; return;
} }
// Enter // Enter
dispatcher.dispatch(args.srcElement.value); this.$dispatcher.dispatch(args.srcElement.value);
args.srcElement.value = ''; args.srcElement.value = '';
}); });
} }

View File

@@ -72,25 +72,25 @@
}; };
bindr.bindControllers = function (rootViewElement, controllers) { bindr.bindControllers = function (rootViewElement, container) {
var elements = rootViewElement.querySelectorAll('[data-controller]'), var elements = rootViewElement.querySelectorAll('[data-controller]'),
i = 0, l = elements.length, name, ctrl, attached; i = 0, l = elements.length, ctrlName, ctrl, attached;
for(;i<l;i++){ for(;i<l;i++){
var element = elements[i]; var element = elements[i];
name = element.getAttribute('data-controller'); ctrlName = element.getAttribute('data-controller');
ctrl = controllers[name]; ctrl = container.resolve(ctrlName);
attached = []; attached = [];
if(ctrl == null) { if(ctrl == null) {
console.warn(nam + ' controller wasn\'t found'); console.warn(ctrlName + ' controller wasn\'t found');
continue; continue;
} }
ctrl.attachView(element); ctrl.attachView(element);
attached.push(ctrl); attached.push(ctrl);
console.log(name + ' Controller: view attached'); console.log(ctrlName + ' Controller: view attached');
if(typeof ctrl.detachView != "function") { if(typeof ctrl.detachView != "function") {
continue; continue;
@@ -98,7 +98,7 @@
element.addEventListener('DOMNodeRemoved', function () { element.addEventListener('DOMNodeRemoved', function () {
ctrl.detachView(); ctrl.detachView();
console.log(name + ' Controller: view detached'); console.log(ctrlName + ' Controller: view detached');
}); });
} }
}; };

View File

@@ -9,6 +9,7 @@
if(reg == null) { if(reg == null) {
reg = this.store[name] = { instance: inst }; reg = this.store[name] = { instance: inst };
} }
console.log(name + ' component registered');
return reg; return reg;
}; };