From cadafab3ec3e5cc0fe8f56cbd9954d6c6883a557 Mon Sep 17 00:00:00 2001
From: Borys Levytskyi <blevtisky@yandex.ru>
Date: Thu, 2 Apr 2015 22:53:06 +0300
Subject: [PATCH] huge regactoring

---
 .idea/workspace.xml                           | 492 ++++++++++--------
 {js => app}/app.js                            |  12 +
 {js => app/bitwise}/calc.js                   |   0
 {js => app/bitwise}/expression.js             |   0
 {js => app/bitwise}/formatter.js              |   0
 app/bootstrap.js                              |   9 +
 js/expressionInputCtrl.js => app/inputCtrl.js |   3 +-
 {js => app}/views.js                          |   0
 {js/components => components}/bindr.js        |  20 +-
 components/commandr.js                        |  30 ++
 {js/components => components}/html.js         |  31 +-
 {js/components => components}/should.js       |   0
 css/styles.css                                |   8 +-
 index.html                                    |  79 ++-
 js/components/commandr.js                     |  25 -
 15 files changed, 418 insertions(+), 291 deletions(-)
 rename {js => app}/app.js (81%)
 rename {js => app/bitwise}/calc.js (100%)
 rename {js => app/bitwise}/expression.js (100%)
 rename {js => app/bitwise}/formatter.js (100%)
 create mode 100644 app/bootstrap.js
 rename js/expressionInputCtrl.js => app/inputCtrl.js (74%)
 rename {js => app}/views.js (100%)
 rename {js/components => components}/bindr.js (79%)
 create mode 100644 components/commandr.js
 rename {js/components => components}/html.js (57%)
 rename {js/components => components}/should.js (100%)
 delete mode 100644 js/components/commandr.js

diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index 7783b8f..aa0c690 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -24,100 +24,106 @@
   <component name="FileEditorManager">
     <leaf>
       <file leaf-file-name="views.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/views.js">
+        <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="833">
-              <caret line="41" column="5" selection-start-line="41" selection-start-column="5" selection-end-line="41" selection-end-column="5" />
+              <caret line="15" column="40" selection-start-line="15" selection-start-column="40" selection-end-line="15" selection-end-column="40" />
               <folding />
             </state>
           </provider>
         </entry>
       </file>
-      <file leaf-file-name="expressionInputCtrl.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/expressionInputCtrl.js">
-          <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="476">
-              <caret line="6" column="28" selection-start-line="6" selection-start-column="28" selection-end-line="6" selection-end-column="28" />
-              <folding />
-            </state>
-          </provider>
-        </entry>
-      </file>
-      <file leaf-file-name="formatter.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/formatter.js">
-          <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="578">
-              <caret line="4" column="0" selection-start-line="4" selection-start-column="0" selection-end-line="4" selection-end-column="0" />
-              <folding />
-            </state>
-          </provider>
-        </entry>
-      </file>
-      <file leaf-file-name="expression.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/expression.js">
-          <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="510">
-              <caret line="4" column="33" selection-start-line="4" selection-start-column="33" selection-end-line="4" selection-end-column="33" />
-              <folding />
-            </state>
-          </provider>
-        </entry>
-      </file>
-      <file leaf-file-name="index.html" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/index.html">
-          <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="-5.230769" vertical-offset="0" max-vertical-offset="1241">
-              <caret line="8" column="62" selection-start-line="8" selection-start-column="54" selection-end-line="8" selection-end-column="62" />
-              <folding />
-            </state>
-          </provider>
-        </entry>
-      </file>
-      <file leaf-file-name="commandr.js" pinned="false" current="true" current-in-tab="true">
-        <entry file="file://$PROJECT_DIR$/js/components/commandr.js">
-          <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="0.44299674" vertical-offset="0" max-vertical-offset="921">
-              <caret line="24" column="4" selection-start-line="24" selection-start-column="4" selection-end-line="24" selection-end-column="4" />
-              <folding />
-            </state>
-          </provider>
-        </entry>
-      </file>
-      <file leaf-file-name="bindr.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/components/bindr.js">
-          <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="0.0" vertical-offset="626" max-vertical-offset="1547">
-              <caret line="71" column="0" selection-start-line="71" selection-start-column="0" selection-end-line="71" selection-end-column="0" />
-              <folding />
-            </state>
-          </provider>
-        </entry>
-      </file>
-      <file leaf-file-name="calc.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/calc.js">
+      <file leaf-file-name="inputCtrl.js" pinned="false" current="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/app/inputCtrl.js">
           <provider selected="true" editor-type-id="text-editor">
             <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="493">
-              <caret line="14" column="13" selection-start-line="14" selection-start-column="13" selection-end-line="14" selection-end-column="13" />
+              <caret line="7" column="16" selection-start-line="7" selection-start-column="16" selection-end-line="7" selection-end-column="16" />
+              <folding />
+            </state>
+          </provider>
+        </entry>
+      </file>
+      <file leaf-file-name="bootstrap.js" pinned="false" current="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/app/bootstrap.js">
+          <provider selected="true" editor-type-id="text-editor">
+            <state vertical-scroll-proportion="0.0" vertical-offset="119" 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>
+      </file>
+      <file leaf-file-name="index.html" pinned="false" current="true" current-in-tab="true">
+        <entry file="file://$PROJECT_DIR$/index.html">
+          <provider selected="true" editor-type-id="text-editor">
+            <state vertical-scroll-proportion="0.449162" vertical-offset="771" max-vertical-offset="1734">
+              <caret line="69" column="36" selection-start-line="69" selection-start-column="36" selection-end-line="69" selection-end-column="36" />
               <folding />
             </state>
           </provider>
         </entry>
       </file>
       <file leaf-file-name="html.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/components/html.js">
+        <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="867">
-              <caret line="13" column="12" selection-start-line="13" selection-start-column="12" selection-end-line="13" selection-end-column="12" />
+            <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="918">
+              <caret line="8" column="44" selection-start-line="8" selection-start-column="44" selection-end-line="8" selection-end-column="44" />
               <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="0" max-vertical-offset="595">
+              <caret line="10" column="49" selection-start-line="10" selection-start-column="49" selection-end-line="10" selection-end-column="49" />
+              <folding />
+            </state>
+          </provider>
+        </entry>
+      </file>
+      <file leaf-file-name="app.js" pinned="false" current="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/app/app.js">
+          <provider selected="true" editor-type-id="text-editor">
+            <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="510">
+              <caret line="62" column="0" selection-start-line="62" selection-start-column="0" selection-end-line="62" selection-end-column="0" />
+              <folding>
+                <element signature="e#113#352#0" expanded="false" />
+                <element signature="e#510#920#0" expanded="false" />
+                <element signature="e#961#1042#0" expanded="false" />
+                <element signature="e#1087#1174#0" expanded="false" />
+                <element signature="e#1219#1471#0" expanded="false" />
+              </folding>
+            </state>
+          </provider>
+        </entry>
+      </file>
       <file leaf-file-name="should.js" pinned="false" current="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/js/components/should.js">
+        <entry file="file://$PROJECT_DIR$/components/should.js">
           <provider selected="true" editor-type-id="text-editor">
             <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="578">
-              <caret line="26" column="0" selection-start-line="26" selection-start-column="0" selection-end-line="26" selection-end-column="0" />
+              <caret line="23" column="9" selection-start-line="23" selection-start-column="9" selection-end-line="23" selection-end-column="9" />
+              <folding />
+            </state>
+          </provider>
+        </entry>
+      </file>
+      <file leaf-file-name="styles.css" pinned="false" current="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/css/styles.css">
+          <provider selected="true" editor-type-id="text-editor">
+            <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="255">
+              <caret line="7" column="7" selection-start-line="7" selection-start-column="7" selection-end-line="7" selection-end-column="7" />
+              <folding />
+            </state>
+          </provider>
+        </entry>
+      </file>
+      <file leaf-file-name="bindr.js" pinned="false" current="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/components/bindr.js">
+          <provider selected="true" editor-type-id="text-editor">
+            <state vertical-scroll-proportion="0.0" vertical-offset="830" max-vertical-offset="1751">
+              <caret line="65" column="21" selection-start-line="65" selection-start-column="21" selection-end-line="65" selection-end-column="21" />
               <folding />
             </state>
           </provider>
@@ -141,7 +147,6 @@
         <option value="$PROJECT_DIR$/app/expressionHtmlFormatter.js" />
         <option value="$PROJECT_DIR$/bitwise/calculator.js" />
         <option value="$PROJECT_DIR$/bitwise/core.js" />
-        <option value="$PROJECT_DIR$/app/app.js" />
         <option value="$PROJECT_DIR$/bitwise/expression.js" />
         <option value="$PROJECT_DIR$/bitwise/formatter.js" />
         <option value="$PROJECT_DIR$/app/calc.js" />
@@ -150,16 +155,25 @@
         <option value="$PROJECT_DIR$/app/html.js" />
         <option value="$PROJECT_DIR$/js/views.js" />
         <option value="$PROJECT_DIR$/js/components/html.js" />
-        <option value="$PROJECT_DIR$/css/styles.css" />
         <option value="$PROJECT_DIR$/js/components/inputView.js" />
         <option value="$PROJECT_DIR$/js/components/expressionInputCtrl.js" />
         <option value="$PROJECT_DIR$/js/components/bindr.js" />
         <option value="$PROJECT_DIR$/js/components/expression.js" />
         <option value="$PROJECT_DIR$/js/components/command.js" />
         <option value="$PROJECT_DIR$/js/expressionInputCtrl.js" />
-        <option value="$PROJECT_DIR$/index.html" />
         <option value="$PROJECT_DIR$/js/app.js" />
         <option value="$PROJECT_DIR$/js/components/commandr.js" />
+        <option value="$PROJECT_DIR$/js/bitwise/expression.js" />
+        <option value="$PROJECT_DIR$/app/bitwise/expression.js" />
+        <option value="$PROJECT_DIR$/app/bootstrap.js" />
+        <option value="$PROJECT_DIR$/app/app.js" />
+        <option value="$PROJECT_DIR$/components/bindr.js" />
+        <option value="$PROJECT_DIR$/components/commandr.js" />
+        <option value="$PROJECT_DIR$/css/styles.css" />
+        <option value="$PROJECT_DIR$/app/views.js" />
+        <option value="$PROJECT_DIR$/components/html.js" />
+        <option value="$PROJECT_DIR$/app/inputCtrl.js" />
+        <option value="$PROJECT_DIR$/index.html" />
       </list>
     </option>
   </component>
@@ -243,7 +257,7 @@
               <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
             </PATH_ELEMENT>
             <PATH_ELEMENT>
-              <option name="myItemId" value="js" />
+              <option name="myItemId" value="css" />
               <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
             </PATH_ELEMENT>
           </PATH>
@@ -256,10 +270,6 @@
               <option name="myItemId" value="BitwiseCalc" />
               <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
             </PATH_ELEMENT>
-            <PATH_ELEMENT>
-              <option name="myItemId" value="js" />
-              <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
-            </PATH_ELEMENT>
             <PATH_ELEMENT>
               <option name="myItemId" value="components" />
               <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
@@ -275,7 +285,25 @@
               <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
             </PATH_ELEMENT>
             <PATH_ELEMENT>
-              <option name="myItemId" value="css" />
+              <option name="myItemId" value="app" />
+              <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
+            </PATH_ELEMENT>
+          </PATH>
+          <PATH>
+            <PATH_ELEMENT>
+              <option name="myItemId" value="BitwiseCalc" />
+              <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.ProjectViewProjectNode" />
+            </PATH_ELEMENT>
+            <PATH_ELEMENT>
+              <option name="myItemId" value="BitwiseCalc" />
+              <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
+            </PATH_ELEMENT>
+            <PATH_ELEMENT>
+              <option name="myItemId" value="app" />
+              <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
+            </PATH_ELEMENT>
+            <PATH_ELEMENT>
+              <option name="myItemId" value="bitwise" />
               <option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
             </PATH_ELEMENT>
           </PATH>
@@ -293,21 +321,14 @@
       <recent name="C:\Projects\BitwiseCalc\js\components" />
     </key>
     <key name="MoveFile.RECENT_KEYS">
+      <recent name="C:\Projects\BitwiseCalc" />
+      <recent name="C:\Projects\BitwiseCalc\js\bitwise" />
       <recent name="C:\Projects\BitwiseCalc\js" />
       <recent name="C:\Projects\BitwiseCalc\js\components" />
       <recent name="C:\Projects\BitwiseCalc\app" />
-      <recent name="C:\Projects\BitwiseCalc" />
     </key>
   </component>
   <component name="RunManager">
-    <configuration default="true" type="DartUnitRunConfigurationType" factoryName="DartUnit">
-      <option name="VMOptions" />
-      <option name="arguments" />
-      <option name="filePath" />
-      <option name="scope" value="ALL" />
-      <option name="testName" />
-      <method />
-    </configuration>
     <configuration default="true" type="DartCommandLineRunConfigurationType" factoryName="Dart Command Line Application">
       <option name="VMOptions" />
       <option name="arguments" />
@@ -318,14 +339,12 @@
       <option name="showConsoleOnStdOut" value="false" />
       <method />
     </configuration>
-    <configuration default="true" type="CucumberJavaScriptRunConfigurationType" factoryName="Cucumber.js">
-      <option name="cucumberJsArguments" />
-      <option name="executablePath" />
+    <configuration default="true" type="DartUnitRunConfigurationType" factoryName="DartUnit">
+      <option name="VMOptions" />
+      <option name="arguments" />
       <option name="filePath" />
-      <method />
-    </configuration>
-    <configuration default="true" type="JavaScriptTestRunnerKarma" factoryName="Karma" config-file="">
-      <envs />
+      <option name="scope" value="ALL" />
+      <option name="testName" />
       <method />
     </configuration>
     <configuration default="true" type="JSTestDriver:ConfigurationType" factoryName="JsTestDriver">
@@ -335,6 +354,16 @@
       <setting name="preferredDebugBrowser" value="Chrome" />
       <method />
     </configuration>
+    <configuration default="true" type="JavaScriptTestRunnerKarma" factoryName="Karma" config-file="">
+      <envs />
+      <method />
+    </configuration>
+    <configuration default="true" type="CucumberJavaScriptRunConfigurationType" factoryName="Cucumber.js">
+      <option name="cucumberJsArguments" />
+      <option name="executablePath" />
+      <option name="filePath" />
+      <method />
+    </configuration>
     <configuration default="true" type="JavascriptDebugType" factoryName="JavaScript Debug">
       <method />
     </configuration>
@@ -371,11 +400,11 @@
       <window_info id="Version Control" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.33" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
       <window_info id="Cvs" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.25" sideWeight="0.5" order="4" side_tool="false" content_ui="tabs" />
       <window_info id="Message" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.33" sideWeight="0.5" order="0" side_tool="false" content_ui="tabs" />
+      <window_info id="Find" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.3284055" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
       <window_info id="Ant Build" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.25" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
-      <window_info id="Find" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" weight="0.3284055" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
       <window_info id="Commander" active="false" anchor="right" auto_hide="false" internal_type="SLIDING" type="SLIDING" visible="false" weight="0.4" sideWeight="0.5" order="0" side_tool="false" content_ui="tabs" />
-      <window_info id="Hierarchy" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.25" sideWeight="0.5" order="2" side_tool="false" content_ui="combo" />
       <window_info id="Inspection" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.4" sideWeight="0.5" order="5" side_tool="false" content_ui="tabs" />
+      <window_info id="Hierarchy" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.25" sideWeight="0.5" order="2" side_tool="false" content_ui="combo" />
     </layout>
   </component>
   <component name="Vcs.Log.UiProperties">
@@ -400,15 +429,7 @@
     </breakpoint-manager>
   </component>
   <component name="editorHistoryManager">
-    <entry file="file://$PROJECT_DIR$/index.html">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="165" max-vertical-offset="816">
-          <caret line="42" column="7" selection-start-line="42" selection-start-column="7" selection-end-line="42" selection-end-column="7" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/html.js">
+    <entry file="file://$PROJECT_DIR$/components/html.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="18" max-vertical-offset="867">
           <caret line="13" column="12" selection-start-line="13" selection-start-column="12" selection-end-line="13" selection-end-column="12" />
@@ -416,7 +437,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
+    <entry file="file://$PROJECT_DIR$/components/should.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="442" max-vertical-offset="578">
           <caret line="26" column="0" selection-start-line="26" selection-start-column="0" selection-end-line="26" selection-end-column="0" />
@@ -424,23 +445,28 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/calc.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/calc.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="238" max-vertical-offset="493">
           <caret line="14" column="13" selection-start-line="14" selection-start-column="13" selection-end-line="14" selection-end-column="13" />
-          <folding />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/app.js">
+    <entry file="file://$PROJECT_DIR$/app/app.js">
       <provider selected="true" editor-type-id="text-editor">
         <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" />
-          <folding />
+          <folding>
+            <element signature="e#113#352#0" expanded="false" />
+            <element signature="e#510#920#0" expanded="false" />
+            <element signature="e#961#1042#0" expanded="false" />
+            <element signature="e#1087#1174#0" expanded="false" />
+            <element signature="e#1219#1471#0" expanded="false" />
+          </folding>
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="578">
           <caret line="4" column="0" selection-start-line="4" selection-start-column="0" selection-end-line="4" selection-end-column="0" />
@@ -448,7 +474,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="136" max-vertical-offset="425">
           <caret line="8" column="0" selection-start-line="8" selection-start-column="0" selection-end-line="8" selection-end-column="0" />
@@ -456,7 +482,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
+    <entry file="file://$PROJECT_DIR$/app/views.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="51" max-vertical-offset="918">
           <caret line="4" column="0" selection-start-line="4" selection-start-column="0" selection-end-line="4" selection-end-column="0" />
@@ -464,7 +490,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
+    <entry file="file://$PROJECT_DIR$/components/should.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="442" max-vertical-offset="561">
           <caret line="26" column="0" selection-start-line="26" selection-start-column="0" selection-end-line="26" selection-end-column="0" />
@@ -472,23 +498,28 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/calc.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/calc.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="187" max-vertical-offset="493">
           <caret line="11" column="25" selection-start-line="11" selection-start-column="25" selection-end-line="11" selection-end-column="25" />
-          <folding />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/app.js">
+    <entry file="file://$PROJECT_DIR$/app/app.js">
       <provider selected="true" editor-type-id="text-editor">
         <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" />
-          <folding />
+          <folding>
+            <element signature="e#113#352#0" expanded="false" />
+            <element signature="e#510#920#0" expanded="false" />
+            <element signature="e#961#1042#0" expanded="false" />
+            <element signature="e#1087#1174#0" expanded="false" />
+            <element signature="e#1219#1471#0" expanded="false" />
+          </folding>
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="306" max-vertical-offset="493">
           <caret line="18" column="6" selection-start-line="18" selection-start-column="6" selection-end-line="18" selection-end-column="6" />
@@ -496,7 +527,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="204" max-vertical-offset="425">
           <caret line="12" column="20" selection-start-line="12" selection-start-column="20" selection-end-line="12" selection-end-column="20" />
@@ -504,7 +535,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
+    <entry file="file://$PROJECT_DIR$/app/views.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="139" max-vertical-offset="867">
           <caret line="18" column="30" selection-start-line="18" selection-start-column="30" selection-end-line="18" selection-end-column="30" />
@@ -512,7 +543,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
+    <entry file="file://$PROJECT_DIR$/components/should.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="136" max-vertical-offset="646">
           <caret line="8" column="21" selection-start-line="8" selection-start-column="21" selection-end-line="8" selection-end-column="21" />
@@ -528,15 +559,21 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/app.js">
+    <entry file="file://$PROJECT_DIR$/app/app.js">
       <provider selected="true" editor-type-id="text-editor">
         <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" />
-          <folding />
+          <folding>
+            <element signature="e#113#352#0" expanded="false" />
+            <element signature="e#510#920#0" expanded="false" />
+            <element signature="e#961#1042#0" expanded="false" />
+            <element signature="e#1087#1174#0" expanded="false" />
+            <element signature="e#1219#1471#0" expanded="false" />
+          </folding>
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="272" max-vertical-offset="510">
           <caret line="16" column="0" selection-start-line="3" selection-start-column="0" selection-end-line="16" selection-end-column="0" />
@@ -544,7 +581,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="99" max-vertical-offset="1020">
           <caret line="19" column="21" selection-start-line="19" selection-start-column="21" selection-end-line="19" selection-end-column="21" />
@@ -552,7 +589,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
+    <entry file="file://$PROJECT_DIR$/app/views.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="510" max-vertical-offset="663">
           <caret line="30" column="0" selection-start-line="30" selection-start-column="0" selection-end-line="30" selection-end-column="0" />
@@ -560,7 +597,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
+    <entry file="file://$PROJECT_DIR$/components/should.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="34" max-vertical-offset="187">
           <caret line="2" column="54" selection-start-line="2" selection-start-column="54" selection-end-line="2" selection-end-column="54" />
@@ -576,7 +613,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="323" max-vertical-offset="510">
           <caret line="19" column="15" selection-start-line="19" selection-start-column="15" selection-end-line="19" selection-end-column="15" />
@@ -584,7 +621,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1020">
           <caret line="19" column="21" selection-start-line="19" selection-start-column="21" selection-end-line="19" selection-end-column="21" />
@@ -592,7 +629,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
+    <entry file="file://$PROJECT_DIR$/app/views.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="68" max-vertical-offset="204">
           <caret line="4" column="3" selection-start-line="4" selection-start-column="3" selection-end-line="4" selection-end-column="3" />
@@ -600,7 +637,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
+    <entry file="file://$PROJECT_DIR$/components/should.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="34" max-vertical-offset="187">
           <caret line="2" column="54" selection-start-line="2" selection-start-column="54" selection-end-line="2" selection-end-column="54" />
@@ -616,7 +653,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="323" max-vertical-offset="510">
           <caret line="19" column="15" selection-start-line="19" selection-start-column="15" selection-end-line="19" selection-end-column="15" />
@@ -624,7 +661,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="99" max-vertical-offset="1020">
           <caret line="19" column="21" selection-start-line="19" selection-start-column="21" selection-end-line="19" selection-end-column="21" />
@@ -632,7 +669,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
+    <entry file="file://$PROJECT_DIR$/app/views.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="68" max-vertical-offset="204">
           <caret line="4" column="3" selection-start-line="4" selection-start-column="3" selection-end-line="4" selection-end-column="3" />
@@ -640,7 +677,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
+    <entry file="file://$PROJECT_DIR$/components/should.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="17" max-vertical-offset="187">
           <caret line="1" column="24" selection-start-line="1" selection-start-column="24" selection-end-line="1" selection-end-column="24" />
@@ -656,7 +693,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="272" max-vertical-offset="510">
           <caret line="16" column="7" selection-start-line="16" selection-start-column="7" selection-end-line="16" selection-end-column="7" />
@@ -664,7 +701,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="391" max-vertical-offset="1020">
           <caret line="23" column="0" selection-start-line="23" selection-start-column="0" selection-end-line="23" selection-end-column="0" />
@@ -672,7 +709,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
+    <entry file="file://$PROJECT_DIR$/app/views.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="17" max-vertical-offset="170">
           <caret line="1" column="5" selection-start-line="1" selection-start-column="5" selection-end-line="1" selection-end-column="5" />
@@ -688,7 +725,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="306" max-vertical-offset="510">
           <caret line="18" column="0" selection-start-line="18" selection-start-column="0" selection-end-line="18" selection-end-column="0" />
@@ -696,7 +733,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="119">
           <caret line="0" column="0" selection-start-line="0" selection-start-column="0" selection-end-line="0" selection-end-column="0" />
@@ -712,79 +749,7 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/css/styles.css">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="153">
-          <caret line="3" column="24" selection-start-line="3" selection-start-column="24" selection-end-line="3" selection-end-column="24" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/app.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1003">
-          <caret line="0" column="27" selection-start-line="0" selection-start-column="27" selection-end-line="0" selection-end-column="27" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/should.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="578">
-          <caret line="26" column="0" selection-start-line="26" selection-start-column="0" selection-end-line="26" selection-end-column="0" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/html.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="867">
-          <caret line="13" column="12" selection-start-line="13" selection-start-column="12" selection-end-line="13" selection-end-column="12" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/expressionInputCtrl.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="476">
-          <caret line="6" column="28" selection-start-line="6" selection-start-column="28" selection-end-line="6" selection-end-column="28" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/views.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="425">
-          <caret line="41" column="5" selection-start-line="41" selection-start-column="5" selection-end-line="41" selection-end-column="5" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/bindr.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="1547">
-          <caret line="71" column="0" selection-start-line="71" selection-start-column="0" selection-end-line="71" selection-end-column="0" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/calc.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="493">
-          <caret line="14" column="13" selection-start-line="14" selection-start-column="13" selection-end-line="14" selection-end-column="13" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/expression.js">
-      <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="510">
-          <caret line="4" column="33" selection-start-line="4" selection-start-column="33" selection-end-line="4" selection-end-column="33" />
-          <folding />
-        </state>
-      </provider>
-    </entry>
-    <entry file="file://$PROJECT_DIR$/js/formatter.js">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/formatter.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="578">
           <caret line="4" column="0" selection-start-line="4" selection-start-column="0" selection-end-line="4" selection-end-column="0" />
@@ -792,18 +757,103 @@
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/index.html">
+    <entry file="file://$PROJECT_DIR$/app/bitwise/calc.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="-5.230769" vertical-offset="0" max-vertical-offset="1241">
-          <caret line="8" column="62" selection-start-line="8" selection-start-column="54" selection-end-line="8" selection-end-column="62" />
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="493">
+          <caret line="14" column="13" selection-start-line="14" selection-start-column="13" selection-end-line="14" selection-end-column="13" />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/app/bitwise/expression.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="510">
+          <caret line="2" column="0" selection-start-line="2" selection-start-column="0" selection-end-line="2" selection-end-column="0" />
           <folding />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/js/components/commandr.js">
+    <entry file="file://$PROJECT_DIR$/app/bootstrap.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.44299674" vertical-offset="0" max-vertical-offset="921">
-          <caret line="24" column="4" selection-start-line="24" selection-start-column="4" selection-end-line="24" selection-end-column="4" />
+        <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$/app/views.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="833">
+          <caret line="15" column="40" selection-start-line="15" selection-start-column="40" selection-end-line="15" selection-end-column="40" />
+          <folding />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/components/commandr.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="595">
+          <caret line="10" column="49" selection-start-line="10" selection-start-column="49" selection-end-line="10" selection-end-column="49" />
+          <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="0" max-vertical-offset="510">
+          <caret line="62" column="0" selection-start-line="62" selection-start-column="0" selection-end-line="62" selection-end-column="0" />
+          <folding>
+            <element signature="e#113#352#0" expanded="false" />
+            <element signature="e#510#920#0" expanded="false" />
+            <element signature="e#961#1042#0" expanded="false" />
+            <element signature="e#1087#1174#0" expanded="false" />
+            <element signature="e#1219#1471#0" expanded="false" />
+          </folding>
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/components/should.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="578">
+          <caret line="23" column="9" selection-start-line="23" selection-start-column="9" selection-end-line="23" selection-end-column="9" />
+          <folding />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/components/bindr.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="592" max-vertical-offset="1513">
+          <caret line="65" column="21" selection-start-line="65" selection-start-column="21" selection-end-line="65" selection-end-column="21" />
+          <folding />
+        </state>
+      </provider>
+    </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="918">
+          <caret line="8" column="44" selection-start-line="8" selection-start-column="44" selection-end-line="8" selection-end-column="44" />
+          <folding />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/css/styles.css">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="255">
+          <caret line="7" column="7" selection-start-line="7" selection-start-column="7" selection-end-line="7" selection-end-column="7" />
+          <folding />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/app/inputCtrl.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.0" vertical-offset="0" max-vertical-offset="493">
+          <caret line="7" column="16" selection-start-line="7" selection-start-column="16" selection-end-line="7" selection-end-column="16" />
+          <folding />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/index.html">
+      <provider selected="true" editor-type-id="text-editor">
+        <state vertical-scroll-proportion="0.449162" vertical-offset="771" max-vertical-offset="1734">
+          <caret line="69" column="36" selection-start-line="69" selection-start-column="36" selection-end-line="69" selection-end-column="36" />
           <folding />
         </state>
       </provider>
diff --git a/js/app.js b/app/app.js
similarity index 81%
rename from js/app.js
rename to app/app.js
index 79ac2ec..fbe7070 100644
--- a/js/app.js
+++ b/app/app.js
@@ -3,6 +3,18 @@
     var app = {};
 
     app.views = {};
+
+    app.view = function (element, model) {
+        var viewElement = element;
+        if(typeof element == 'string') {
+            viewElement = document.querySelectorAll(element)[0];
+        }
+
+        should.notBeNull(element);
+
+        bindr.bindView(viewElement, model);
+    };
+
     var servicesContainer = {};
     var controllersContainer = {};
     var commands = {};
diff --git a/js/calc.js b/app/bitwise/calc.js
similarity index 100%
rename from js/calc.js
rename to app/bitwise/calc.js
diff --git a/js/expression.js b/app/bitwise/expression.js
similarity index 100%
rename from js/expression.js
rename to app/bitwise/expression.js
diff --git a/js/formatter.js b/app/bitwise/formatter.js
similarity index 100%
rename from js/formatter.js
rename to app/bitwise/formatter.js
diff --git a/app/bootstrap.js b/app/bootstrap.js
new file mode 100644
index 0000000..ade0643
--- /dev/null
+++ b/app/bootstrap.js
@@ -0,0 +1,9 @@
+(function(app, HtmlBuilder){
+
+    app.service('html', {
+        builder: function () {
+            return new HtmlBuilder();
+        }
+    })
+
+})(window.app, window.HtmlBuilder);
\ No newline at end of file
diff --git a/js/expressionInputCtrl.js b/app/inputCtrl.js
similarity index 74%
rename from js/expressionInputCtrl.js
rename to app/inputCtrl.js
index 6030cd9..cbd41e7 100644
--- a/js/expressionInputCtrl.js
+++ b/app/inputCtrl.js
@@ -4,7 +4,8 @@
 
             if(args.keyCode == 13) {
             // Enter
-                app.command('calculateExpression').fire();
+                app.command('dispatchInput').execute({ input: args.srcElement.value });
+                args.srcElement.value = '';
             }
 
             console.log(args)
diff --git a/js/views.js b/app/views.js
similarity index 100%
rename from js/views.js
rename to app/views.js
diff --git a/js/components/bindr.js b/components/bindr.js
similarity index 79%
rename from js/components/bindr.js
rename to components/bindr.js
index 610c607..72d5718 100644
--- a/js/components/bindr.js
+++ b/components/bindr.js
@@ -19,7 +19,7 @@
     };
 
     bindr.Model = function() {
-        this.handlers = [];
+        this.executionHandlers = [];
     };
 
     bindr.Model.createGetter = function (propertyName){
@@ -36,16 +36,16 @@
     };
 
     bindr.Model.prototype.observe = function (handler){
-        this.handlers.push(handler);
+        this.executionHandlers.push(handler);
     };
 
     bindr.Model.prototype.notifyPropertyChanged = function(propertyName, value){
-        this.handlers.forEach(function(h){
+        this.executionHandlers.forEach(function(h){
             h(propertyName, value);
         });
     };
 
-    bindr.bindElement = function(model, element, propertyName) {
+    bindr.bindElement = function(element, model, propertyName) {
         if(element.bindr != null) {
             return;
         }
@@ -60,6 +60,18 @@
         element.bindr = {}; // will be used later
     };
 
+    bindr.bindView = function(viewElement, model) {
+        var elements = viewElement.querySelectorAll('[data-bindr]'),
+            count = elements.length,
+            i =0, el;
+
+        for(;i<count; i++){
+            el = elements[i];
+            this.bindElement(el, model, el.getAttribute('data-bindr'))
+        }
+
+    };
+
     function bindInput(model, intput, propertyName) {
         intput.addEventListener('keyup', function(e){
             model[propertyName] = e.srcElement.value;
diff --git a/components/commandr.js b/components/commandr.js
new file mode 100644
index 0000000..e555146
--- /dev/null
+++ b/components/commandr.js
@@ -0,0 +1,30 @@
+(function(){
+   var commandr = {
+
+   };
+
+    function Command(name) {
+        this.name = name;
+        this.executionHandlers = [];
+    }
+
+    Command.prototype.execute = function (cmdArgs) {
+        cmdArgs.commandHandled = false;
+
+        for(var i=0; i<this.executionHandlers.length; i++) {
+            this.executionHandlers[i](cmdArgs);
+            if(cmdArgs.commandHandled === true) {
+                return;
+            }
+        }
+    };
+
+    Command.prototype.subscribe = function (handler) {
+        this.executionHandlers.push(handler);
+        // TODO: unsubcribe
+    };
+
+    commandr.Command = Command;
+
+    window.commandr = commandr;
+})();
\ No newline at end of file
diff --git a/js/components/html.js b/components/html.js
similarity index 57%
rename from js/components/html.js
rename to components/html.js
index fa38ad8..5d409cf 100644
--- a/js/components/html.js
+++ b/components/html.js
@@ -1,19 +1,14 @@
-(function(app){
-    app.service('html', {
-        builder: function () {
-            return new HtmlBuilder();
-        }
-    })
+(function(){
 
     function HtmlBuilder() {
         this.sb = [];
     }
 
-    HtmlBuilder.prototype.element = function(tagName, attrs, content) {
-        var attributes = arguments.length == 3 ? attrs : null,
-            elementContent = arguments.length == 3 ? content : attrs;
+    HtmlBuilder.prototype.element = function(tagName, arg) {
+        var attrs = typeof arg == "object" ? arg : { html: arg},
+            elementContent = attrs.html || '';
 
-        this.sb.push('<' + tagName + ' ' + getAttributesStr(attributes) + ">");
+        this.sb.push('<' + tagName + ' ' + getAttributesStr(attrs) + ">");
 
         if(typeof elementContent == 'function')   {
             elementContent();
@@ -21,7 +16,6 @@
             this.sb.push(elementContent.toString());
         }
 
-
         this.sb.push('</' + tagName + '>');
     };
 
@@ -29,18 +23,27 @@
         return this.sb.join('\r\n');
     };
 
+    HtmlBuilder.prototype.toHtmlElement = function (){
+        var el = document.createElement('div');
+        el.innerHTML = this.toString();
+        return el.children[0];
+    };
+
     function getAttributesStr(attr) {
         if(attr == null) {
             return '';
         }
         var str = [];
 
-        for(var key in attr)
-        {
+        for(var key in attr) {
+            if(key == 'html')
+                continue;
             str.push(key + '="' + attr[key] + '"');
         }
 
         return str.join(' ');
     }
 
-})(window.app);
\ No newline at end of file
+    window.HtmlBuilder = HtmlBuilder;
+
+})();
\ No newline at end of file
diff --git a/js/components/should.js b/components/should.js
similarity index 100%
rename from js/components/should.js
rename to components/should.js
diff --git a/css/styles.css b/css/styles.css
index 3bd7282..8b2f143 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,4 +1,10 @@
 .expression .label { font-weight:  bold; padding-right: 5px }
 .expression .one { color: #6d9ad3 }
 .expression .zero { color: #70d351 }
-.expression .result td { border-top: solid 1px }
\ No newline at end of file
+.expression .result td { border-top: solid 1px }
+
+.error { color: maroon; }
+
+.result { margin: 10px;}
+
+#view { padding: 10px}
\ No newline at end of file
diff --git a/index.html b/index.html
index 13fff09..3924c08 100644
--- a/index.html
+++ b/index.html
@@ -5,23 +5,26 @@
 
     <title></title>
 
-    <script type="text/javascript" src="js/components/bindr.js"></script>
-    <script type="text/javascript" src="js/components/commandr.js"></script>
-    <script type="text/javascript" src="js/components/should.js"></script>
-    <script type="text/javascript" src="js/app.js"></script>
-    <script type="text/javascript" src="js/components/html.js"></script>
-    <script type="text/javascript" src="js/calc.js"></script>
-    <script type="text/javascript" src="js/expression.js"></script>
-    <script type="text/javascript" src="js/formatter.js"></script>
+    <script type="text/javascript" src="components/bindr.js"></script>
+    <script type="text/javascript" src="components/commandr.js"></script>
+    <script type="text/javascript" src="components/should.js"></script>
+    <script type="text/javascript" src="components/html.js"></script>
 
-    <script type="text/javascript" src="js/views.js"></script>
-    <script type="text/javascript" src="js/expressionInputCtrl.js"></script>
+    <script type="text/javascript" src="app/app.js"></script>
+    <script type="text/javascript" src="app/bitwise/calc.js"></script>
+    <script type="text/javascript" src="app/bitwise/expression.js"></script>
+    <script type="text/javascript" src="app/bitwise/formatter.js"></script>
+
+    <script type="text/javascript" src="app/views.js"></script>
+    <script type="text/javascript" src="app/inputCtrl.js"></script>
+
+    <script type="text/javascript" src="app/bootstrap.js"></script>
 
     <link rel="stylesheet" type="text/css" href="css/styles.css" />
 </head>
-<body>
-<input id="in" type="text"/>
-<div id="out" type="text"></div>
+<body id="view">
+<input id="in" type="text" data-bindr="expression"/>
+<div id="out" type="text" data-bindr="expression"></div>
 
 <div id="output">
 
@@ -31,33 +34,59 @@
 
     (function(){
         var app = window.app;
-        var bindr = window.bindr;
         var expression = app.service('expression');
         var expressionInputCtrl = app.controller('expressionInputCtrl');
         var outputDiv = document.getElementById('output');
-        var model = bindr.model({'expression': ''});
+        var html = app.service('html');
 
-        bindr.bindElement(model, document.getElementById('in'), 'expression');
-        bindr.bindElement(model, document.getElementById('out'), 'expression');
+        app.controller('expressionInputCtrl').bind(document.getElementById('in'));
 
-        expressionInputCtrl.bind(document.getElementById('in'), model);
+        app.command('dispatchInput', function(cmdArgs) {
 
-        app.command('calculateExpression', function() {
-            var expr = expression.parse(model.expression);
+            var expr = expression.parse(cmdArgs.input);
 
             if(expr == null) {
-                alert('incorrect expression');
                 return;
             }
 
             var view = new window.app.views.ExpressionView(expr);
 
-            var result = document.createElement('div');
-            result.innerHTML = view.getHtml();
+            var hb = app.service('html').builder();
+            hb.element('div', { class: 'result'}, view.getHtml());
+            outputDiv.appendChild(hb.toHtmlElement());
 
-            outputDiv.appendChild(result);
 
-            model.expression = '';
+            cmdArgs.commandHandled = true;
+        });
+
+        // Help
+        app.command('dispatchInput', function(cmdArgs){
+            if(cmdArgs.input.toLowerCase() !== 'help') {
+                return;
+            }
+
+            var commands = [{ name: 'help', description: 'Displays help'}];
+
+            var hb = html.builder();
+            hb.element('ul', { class: 'result', html: function() {
+                commands.forEach(function(c) {
+                    hb.element('li', c.name + " — " + c.description);
+                });
+            }});
+
+
+
+            outputDiv.appendChild(hb.toHtmlElement());
+            cmdArgs.commandHandled = true;
+        });
+
+        // Unknown Expression
+        app.command('dispatchInput', function(cmdArgs){
+            var hb = html.builder();
+            hb.element('div', { class: "result error", html: "Unknown expression: " + cmdArgs.input });
+
+            outputDiv.appendChild(hb.toHtmlElement());
+            cmdArgs.commandHandled = true;
         });
 
     })();
diff --git a/js/components/commandr.js b/js/components/commandr.js
deleted file mode 100644
index b3d2665..0000000
--- a/js/components/commandr.js
+++ /dev/null
@@ -1,25 +0,0 @@
-(function(){
-   var commandr = {
-
-   };
-
-    function Command(name) {
-        this.name = name;
-        this.handlers = [];
-    }
-
-    Command.prototype.fire = function (arg) {
-        for(var i=0; i<1; i++) {
-            this.handlers[i](arg);
-        }
-    };
-
-    Command.prototype.subscribe = function (handler) {
-        this.handlers.push(handler);
-        // TODO: unsubcribe
-    };
-
-    commandr.Command = Command;
-
-    window.commandr = commandr;
-})();
\ No newline at end of file