article directive; home page

backend/WebSem/.idea/.idea.WebSem/.idea/workspace.xml

 <project version="4">
   <component name="ChangeListManager">
     <list default="true" id="8d054e21-e284-419c-acba-f672639639a4" name="Default" comment="">
-      <change type="MODIFICATION" beforePath="$PROJECT_DIR$/.idea/.idea.WebSem/.idea/workspace.xml" afterPath="$PROJECT_DIR$/.idea/.idea.WebSem/.idea/workspace.xml" />
-      <change type="MODIFICATION" beforePath="$PROJECT_DIR$/WebApiWebSem/DataAccess/ArticlesDataAccess.cs" afterPath="$PROJECT_DIR$/WebApiWebSem/DataAccess/ArticlesDataAccess.cs" />
+      <change type="DELETED" beforePath="$PROJECT_DIR$/../../frontend/WebSem/app/controllers/directives/.gitkeep" afterPath="" />
+      <change type="DELETED" beforePath="$PROJECT_DIR$/../../frontend/WebSem/app/views/directives/.gitkeep" afterPath="" />
+      <change type="MODIFICATION" beforePath="$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json" afterPath="$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json" />
+      <change type="MODIFICATION" beforePath="$PROJECT_DIR$/../../frontend/WebSem/app/controllers/home.controller.js" afterPath="$PROJECT_DIR$/../../frontend/WebSem/app/controllers/home.controller.js" />
+      <change type="MODIFICATION" beforePath="$PROJECT_DIR$/../../frontend/WebSem/app/index.html" afterPath="$PROJECT_DIR$/../../frontend/WebSem/app/index.html" />
+      <change type="MODIFICATION" beforePath="$PROJECT_DIR$/../../frontend/WebSem/app/views/home.html" afterPath="$PROJECT_DIR$/../../frontend/WebSem/app/views/home.html" />
     </list>
     <option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
     <option name="TRACKING_ENABLED" value="true" />
       <file leaf-file-name="ArticlesDataAccess.cs" pinned="false" current-in-tab="true">
         <entry file="file://$PROJECT_DIR$/WebApiWebSem/DataAccess/ArticlesDataAccess.cs">
           <provider selected="true" editor-type-id="text-editor">
-            <state relative-caret-position="174">
-              <caret line="15" column="72" lean-forward="false" selection-start-line="15" selection-start-column="72" selection-end-line="15" selection-end-column="72" />
+            <state relative-caret-position="210">
+              <caret line="17" column="91" lean-forward="true" selection-start-line="17" selection-start-column="91" selection-end-line="17" selection-end-column="91" />
               <folding>
                 <marker date="1487804389248" expanded="true" signature="6:307" ph="..." />
                 <marker date="1487804389248" expanded="true" signature="342:4029" ph="{...}" />
           </provider>
         </entry>
       </file>
+      <file leaf-file-name="appsettings.Development.json" pinned="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json">
+          <provider selected="true" editor-type-id="text-editor">
+            <state relative-caret-position="234">
+              <caret line="13" column="20" lean-forward="false" selection-start-line="13" selection-start-column="20" selection-end-line="13" selection-end-column="20" />
+              <folding>
+                <marker date="1487806459172" expanded="true" signature="0:493" ph="{...}" />
+                <marker date="1487806459172" expanded="true" signature="17:297" ph="{...}" />
+                <marker date="1487806459172" expanded="true" signature="71:291" ph="{...}" />
+                <marker date="1487806459172" expanded="true" signature="324:468" ph="{...}" />
+              </folding>
+            </state>
+          </provider>
+        </entry>
+      </file>
       <file leaf-file-name="ModelsDbo.cs" pinned="false" current-in-tab="false">
         <entry file="file://$PROJECT_DIR$/WebApiWebSem/DataAccess/ModelsDbo.cs">
           <provider selected="true" editor-type-id="text-editor">
         <option value="$PROJECT_DIR$/WebApiWebSem/Controllers/ArticlesBusiness.cs" />
         <option value="$PROJECT_DIR$/WebApiWebSem/Controllers/ArticlesController.cs" />
         <option value="$PROJECT_DIR$/WebApiWebSem/Startup.cs" />
-        <option value="$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json" />
         <option value="$PROJECT_DIR$/Test/Tests.cs" />
         <option value="$PROJECT_DIR$/WebApiWebSem/DataAccess/ModelsDbo.cs" />
         <option value="$PROJECT_DIR$/WebApiWebSem/DataAccess/ArticlesDataAccess.cs" />
+        <option value="$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json" />
       </list>
     </option>
   </component>
               <option name="myItemId" value="WebSem (2 projects)" />
               <option name="myItemType" value="com.jetbrains.resharper.projectView.solutionExplorer.SolutionExplorerNodeRider" />
             </PATH_ELEMENT>
+            <PATH_ELEMENT>
+              <option name="myItemId" value="WebApiWebSem" />
+              <option name="myItemType" value="com.jetbrains.resharper.projectView.solutionExplorer.SolutionExplorerNodeRider" />
+            </PATH_ELEMENT>
           </PATH>
           <PATH>
             <PATH_ELEMENT>
       <workItem from="1487345029610" duration="5634000" />
       <workItem from="1487441650798" duration="14018000" />
       <workItem from="1487528667649" duration="13931000" />
-      <workItem from="1487802391451" duration="1636000" />
+      <workItem from="1487802391451" duration="4043000" />
     </task>
     <servers />
   </component>
   <component name="TimeTrackingManager">
-    <option name="totallyTimeSpent" value="42433000" />
+    <option name="totallyTimeSpent" value="44840000" />
   </component>
   <component name="TodoView">
     <todo-panel id="selected-file">
       <window_info id="Unit Tests" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.26963907" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
       <window_info id="Run Dashboard" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
       <window_info id="Version Control" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="10" side_tool="false" content_ui="tabs" />
-      <window_info id="Run" active="true" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.2282378" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
+      <window_info id="Run" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.2282378" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
       <window_info id="Terminal" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.19745223" sideWeight="0.5" order="12" side_tool="false" content_ui="tabs" />
       <window_info id="NuGet" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.24258475" sideWeight="0.5" order="13" side_tool="false" content_ui="tabs" />
       <window_info id="Change Signature" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="true" content_ui="tabs" />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json">
-      <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="198">
-          <caret line="11" column="86" lean-forward="false" selection-start-line="11" selection-start-column="86" selection-end-line="11" selection-end-column="86" />
-        </state>
-      </provider>
-    </entry>
     <entry file="file://$USER_HOME$/.local/share/JetBrains/Shared/v08/DecompilerCache/decompiler/68A505D3-EE90-4B2D-8432-759050F70CC3/8e/cee9fac8/LuResult`1.cs">
       <provider selected="true" editor-type-id="text-editor">
         <state relative-caret-position="180">
         </state>
       </provider>
     </entry>
+    <entry file="file://$PROJECT_DIR$/WebApiWebSem/appsettings.Development.json">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="234">
+          <caret line="13" column="20" lean-forward="false" selection-start-line="13" selection-start-column="20" selection-end-line="13" selection-end-column="20" />
+          <folding>
+            <marker date="1487806459172" expanded="true" signature="0:493" ph="{...}" />
+            <marker date="1487806459172" expanded="true" signature="17:297" ph="{...}" />
+            <marker date="1487806459172" expanded="true" signature="71:291" ph="{...}" />
+            <marker date="1487806459172" expanded="true" signature="324:468" ph="{...}" />
+          </folding>
+        </state>
+      </provider>
+    </entry>
     <entry file="file://$PROJECT_DIR$/WebApiWebSem/DataAccess/ModelsDbo.cs">
       <provider selected="true" editor-type-id="text-editor">
         <state relative-caret-position="432">
     </entry>
     <entry file="file://$PROJECT_DIR$/WebApiWebSem/DataAccess/ArticlesDataAccess.cs">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="174">
-          <caret line="15" column="72" lean-forward="false" selection-start-line="15" selection-start-column="72" selection-end-line="15" selection-end-column="72" />
+        <state relative-caret-position="210">
+          <caret line="17" column="91" lean-forward="true" selection-start-line="17" selection-start-column="91" selection-end-line="17" selection-end-column="91" />
           <folding>
             <marker date="1487804389248" expanded="true" signature="6:307" ph="..." />
             <marker date="1487804389248" expanded="true" signature="342:4029" ph="{...}" />

backend/WebSem/WebApiWebSem/appsettings.Development.json

     "ConnectionStrings": {
         "default": "User ID=dev;Password=dev;Host=localhost;Port=5432;Database=websem_project;Pooling=true;ApplicationName=WebSemApiDev"
     },
-    "SleepTime": 0
+    "SleepTime": 1000
 }

frontend/WebSem/app/controllers/directives/article.directive.js

+/**
+ * Created by robin on 02/22/17.
+ */
+angular.module('app')
+    .directive('article', [
+        function () {
+            return {
+                restrict: 'E',
+                require: 'ngModel',
+                templateUrl: 'views/directives/article.html',
+                scope: {
+                    'ngModel': '='
+                },
+                link: function ($scope, elm, attr, ctrl) {
+                }
+            };
+        }]);

frontend/WebSem/app/controllers/home.controller.js

 angular.module('app')
-    .controller('HomeController', ['$scope', '$state', '$mdDialog', 'articlesBusiness', 'luBusyBusiness',
-        function($scope, $state, $mdDialog, articlesBusiness, luBusyBusiness) {
+    .controller('HomeController', ['$scope', '$state', '$mdDialog', 'articlesBusiness', 'luBusyBusiness', 'AppUtilsBusiness',
+        function($scope, $state, $mdDialog, articlesBusiness, luBusyBusiness, AppUtilsBusiness) {
 
         luBusyBusiness.reset();
         $scope.item = null;
-        $scope.itemType = 'articles';
+        $scope.appUtils = AppUtilsBusiness;
 
         $scope.load = function()
         {

frontend/WebSem/app/index.html

     <script src="../sdk/Business/articles.business.js"></script>
 
     <!-- Directives -->
+    <script src="controllers/directives/article.directive.js"></script>
 
     <!-- Filters -->
     <script src="controllers/filters/formatDate.filter.js"></script>

frontend/WebSem/app/less/app.less

   .justify-text();
 }
 
+.home-grid {
+  .red {
+    background: #ff8a80;
+  }
+  .blue {
+    background: #448aff;
+  }
+  .purple {
+    background: #b388ff;
+  }
+  figure {
+    padding: 12px;
+  }
+  md-grid-tile-footer {
+    background: rgba(0, 0, 0, 0.68);
+    height: 36px;
+    figcaption {
+      width: 100%;
+      h3 {
+        margin: 0;
+        font-weight: 700;
+        width: 100%;
+        text-align: center;
+      }
+    }
+  }
+  .article-picture {
+    max-width: 100%;
+    max-height: 100%;
+  }
+}
+
 /**
 ========================================================
 **/

frontend/WebSem/app/views/directives/article.html

+<div layout="column" layout-align=" center">
+    <p class="newline-text article-text">{{ ngModel.text }}</p>
+</div>
+<div layout="row">
+    <div flex="70">
+        <md-table-container ng-show="ngModel != null">
+            <table md-table>
+                <thead md-head>
+                <tr md-row>
+                    <th md-column>{{ 'articles.fields.property' | translate }}</th>
+                    <th md-column>{{ 'articles.fields.value' | translate }}</th>
+                </tr>
+                </thead>
+                <tbody md-body>
+                <tr md-row ng-repeat="field in ngModel.fields track by $index">
+                    <td md-cell>
+                        {{ 'articles.fields.properties.' + field.property | translate }}
+                    </td>
+                    <td md-cell>
+                        {{ field.value }}
+                    </td>
+                </tr>
+                </tbody>
+            </table>
+        </md-table-container>
+    </div>
+    <div flex="30">
+        <div layout="column" layout-align=" center">
+            <img class="article-picture" ng-src="{{ngModel.pictureUrl}}" />
+        </div>
+        <div layout="column" layout-align=" center">
+            <p class="newline-text article-picture-caption">{{ ngModel.pictureCaption }}</p>
+        </div>
+    </div>
+</div>

frontend/WebSem/app/views/home.html

 <div layout="column" layout-fill layout-align="top" angular-busy="appUtils.cgBusy('home.home')">
-    <div layout="column" layout-align=" center">
-        <p class="newline-text article-text">{{ item.text }}</p>
+    <div layout="row">
+        <article ng-model="item"></article>
     </div>
     <div layout="row">
-        <div flex="70">
-            <md-table-container>
-                <table md-table>
-                    <thead md-head>
-                    <tr md-row>
-                        <th md-column>{{ itemType + '.fields.property' | translate }}</th>
-                        <th md-column>{{ itemType + '.fields.value' | translate }}</th>
-                    </tr>
-                    </thead>
-                    <tbody md-body>
-                    <tr md-row ng-repeat="field in item.fields track by $index">
-                        <td md-cell>
-                            {{ itemType + '.fields.properties.' + field.property | translate }}
-                        </td>
-                        <td md-cell>
-                            {{ field.value }}
-                        </td>
-                    </tr>
-                    </tbody>
-                </table>
-            </md-table-container>
-        </div>
-        <div flex="30">
-            <div layout="column" layout-align=" center">
-                <img class="article-picture" ng-src="{{item.pictureUrl}}" />
-            </div>
-            <div layout="column" layout-align=" center">
-                <p class="newline-text article-picture-caption">{{ item.pictureCaption }}</p>
-            </div>
-        </div>
+        <span flex="25"></span>
+        <md-grid-list class="home-grid" md-cols="2" md-row-height="200px" md-row-height-gt-sm="300px" md-row-height-gt-md="450px" md-gutter="4px" flex="40">
+            <md-grid-tile class="red" md-colspan="2" md-rowspan="1">
+                <a ui-sref="persons">
+                    <img class="article-picture" src="http://commons.wikimedia.org/wiki/Special:FilePath/Sir_Winston_S_Churchill.jpg?width=300">
+                    <md-grid-tile-footer><h3>{{ 'persons.name' | translate }}</h3></md-grid-tile-footer>
+                </a>
+            </md-grid-tile>
+            <md-grid-tile class="purple" md-colspan="1" md-rowspan="1">
+                <a ui-sref="countries">
+                    <img class="article-picture" src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d9/Flag_of_Canada_%28Pantone%29.svg/1000px-Flag_of_Canada_%28Pantone%29.svg.png">
+                    <md-grid-tile-footer><h3>{{ 'countries.name' | translate }}</h3></md-grid-tile-footer>
+                </a>
+            </md-grid-tile>
+            <md-grid-tile class="blue" md-colspan="1" md-rowspan="1">
+                <a ui-sref="locations">
+                    <img class="article-picture" src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/44/Europe_orthographic_Caucasus_Urals_boundary_%28with_borders%29.svg/langfr-280px-Europe_orthographic_Caucasus_Urals_boundary_%28with_borders%29.svg.png">
+                    <md-grid-tile-footer><h3>{{ 'locations.name' | translate }}</h3></md-grid-tile-footer>
+                </a>
+            </md-grid-tile>
+        </md-grid-list>
     </div>
 </div>