selected match data passed into details

Author: Hendy

build/Look.BackOffice.nuspec

@@ -25,6 +25,7 @@
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\package.manifest" target="Content\App_Plugins\Look\package.manifest" />
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Look.css" target="Content\App_Plugins\Look\Look.css" />
 
+    <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Controllers\DetailsController.js" target="Content\App_Plugins\Look\Controllers\DetailsController.js" />
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Controllers\LocationsController.js" target="Content\App_Plugins\Look\Controllers\LocationsController.js" />
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Controllers\MatchesController.js" target="Content\App_Plugins\Look\Controllers\MatchesController.js" />
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Controllers\NodesController.js" target="Content\App_Plugins\Look\Controllers\NodesController.js" />
@@ -38,6 +39,7 @@
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Directives\LazyLoadDirective.js" target="Content\App_Plugins\Look\Directives\LazyLoadDirective.js" />
 
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Services\ApiService.js" target="Content\App_Plugins\Look\Services\ApiService.js" />
+    <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Services\MatchService.js" target="Content\App_Plugins\Look\Services\MatchService.js" />
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Services\SortService.js" target="Content\App_Plugins\Look\Services\SortService.js" />
     <file src="..\src\Our.Umbraco.Look.BackOffice\Client\Services\TreeService.js" target="Content\App_Plugins\Look\Services\TreeService.js" />
 

src/Our.Umbraco.Look.BackOffice/Client/Controllers/DetailsController.js

@@ -0,0 +1,18 @@
+(function () {
+    'use strict';
+
+    angular
+        .module('umbraco')
+        .controller('Look.BackOffice.DetailsController', DetailsController);
+
+    DetailsController.$inject = ['$scope', 'Look.BackOffice.MatchService'];
+
+    function DetailsController($scope, matchService) {
+
+        $scope.viewData = {
+            debug: matchService
+        };
+
+    }
+
+})();

src/Our.Umbraco.Look.BackOffice/Client/Controllers/MatchesController.js

@@ -6,10 +6,10 @@
         .module('umbraco')
         .controller('Look.BackOffice.MatchesController', MatchesController);
 
-    MatchesController.$inject = ['$scope', 'Look.BackOffice.SortService', '$q', 'dialogService'];
+    MatchesController.$inject = ['$scope', 'Look.BackOffice.SortService', '$q', 'dialogService', 'Look.BackOffice.MatchService'];
 
     // this controller will handle paging for more results
-    function MatchesController($scope, sortService, $q, dialogService) {
+    function MatchesController($scope, sortService, $q, dialogService, matchService) {
 
         $scope.matches = []; // full collection of matches to render
         $scope.currentlyLoading = false;
@@ -75,10 +75,9 @@
             return enableNameBreaker;
         };
 
-
-        $scope.showDetails = function (id) {
-            console.log(id);
-
+        $scope.showDetails = function (match) {
+            
+            matchService.selectedMatch = match;
 
             dialogService.open({
                 template: '/App_Plugins/Look/BackOffice/LookTree/Partials/Details.html',
@@ -87,8 +86,6 @@
         };
 
 
-
-
         $scope.reload = function () {
             reset();
         };

src/Our.Umbraco.Look.BackOffice/Client/Services/MatchService.js

@@ -0,0 +1,20 @@
+(function () {
+    'use strict';
+
+    // service used to pass selected match from matches to the details controller
+    angular
+        .module('umbraco')
+        .factory('Look.BackOffice.MatchService', MatchService);
+
+    MatchService.$inject = [];
+
+    function MatchService() {
+
+        var selectedMatch = null;
+
+        return {
+            selectedMatch: selectedMatch
+        };
+    }
+
+})();

src/Our.Umbraco.Look.BackOffice/Client/Views/Partials/Details.html

@@ -1 +1,5 @@
-<p>Details</p>
+<div ng-controller="Look.BackOffice.DetailsController">
+    <p>Details</p>
+
+    <pre>{{ viewData | json}}</pre>
+</div>

src/Our.Umbraco.Look.BackOffice/Client/Views/Partials/Matches.html

@@ -7,7 +7,7 @@
                 <p>{{match.name.charAt(0)}}</p>
             </div>
 
-            <div class="look-match" ng-class-even="'even'" ng-class-odd="'odd'" ng-click="showDetails(match.id)">
+            <div class="look-match" ng-class-even="'even'" ng-class-odd="'odd'" ng-click="showDetails(match)">
 
                 <span class="look-match-score">{{match.score}}</span>
 

src/Our.Umbraco.Look.BackOffice/Client/package.manifest

@@ -1,5 +1,6 @@
 {
   "javascript": [
+    "~/App_Plugins/Look/Controllers/DetailsController.js",
     "~/App_Plugins/Look/Controllers/LocationsController.js",
     "~/App_Plugins/Look/Controllers/MatchesController.js",
     "~/App_Plugins/Look/Controllers/NodesController.js",
@@ -13,6 +14,7 @@
     "~/App_Plugins/Look/Directives/LazyLoadDirective.js",
 
     "~/App_Plugins/Look/Services/ApiService.js",
+    "~/App_Plugins/Look/Services/MatchService.js",
     "~/App_Plugins/Look/Services/SortService.js",
     "~/App_Plugins/Look/Services/TreeService.js"
   ],

src/Our.Umbraco.Look.BackOffice/Our.Umbraco.Look.BackOffice.csproj

@@ -219,9 +219,11 @@
   <ItemGroup>
     <Content Include="Client\Controllers\LocationsController.js" />
     <Content Include="Client\Controllers\NodeTypeController.js" />
+    <Content Include="Client\Services\MatchService.js" />
     <Content Include="Client\Services\SortService.js" />
     <Content Include="Client\Controllers\NodesController.js" />
     <Compile Include="Attributes\ValidateSearcherAttribute.cs" />
+    <Content Include="Client\Controllers\DetailsController.js" />
     <Compile Include="Controllers\ApiController.cs" />
     <Compile Include="Controllers\TreeController.cs" />
     <Compile Include="Interfaces\ILookTreeNode.cs" />