setup view/edit site modals for vault

src/popup/app/vault/vaultController.js

@@ -83,6 +83,26 @@
             });
         }
 
+        $scope.viewSite = function (site) {
+            $ionicModal.fromTemplateUrl('app/vault/views/vaultViewSite.html', {
+                scope: $scope,
+                animation: 'slide-in-up'
+            }).then(function (modal) {
+                $scope.viewSiteModal = modal;
+                modal.show();
+            });
+        };
+
+        $scope.editSite = function (site) {
+            $ionicModal.fromTemplateUrl('app/vault/views/vaultEditSite.html', {
+                scope: $scope,
+                animation: 'slide-in-up'
+            }).then(function (modal) {
+                $scope.editSiteModal = modal;
+                modal.show();
+            });
+        };
+
         $scope.addSite = function () {
             $ionicModal.fromTemplateUrl('app/vault/views/vaultAddSite.html', {
                 scope: $scope,
@@ -97,6 +117,14 @@
             $scope.addSiteModal.hide();
         };
 
+        $scope.closeViewSite = function () {
+            $scope.viewSiteModal.hide();
+        };
+
+        $scope.closeEditSite = function () {
+            $scope.editSiteModal.hide();
+        };
+
         $scope.$on('modal.hidden', function () {
             console.log('modal hidden');
             loadVault();

src/popup/app/vault/vaultEditSiteController.js

@@ -0,0 +1,16 @@
+angular
+    .module('bit.vault')
+
+    .controller('vaultEditSiteController', function ($scope, siteService, cryptoService) {
+        $scope.site = {
+            folderId: null
+        };
+
+        $scope.editSite = function (model) {
+            
+        };
+
+        $scope.close = function () {
+            $scope.parentScope.closeEditSite();
+        };
+    });

src/popup/app/vault/vaultViewSiteController.js

@@ -0,0 +1,16 @@
+angular
+    .module('bit.vault')
+
+    .controller('vaultViewSiteController', function ($scope, siteService, cryptoService) {
+        $scope.site = {
+            folderId: null
+        };
+
+        $scope.editSite = function () {
+            
+        };
+
+        $scope.close = function () {
+            $scope.parentScope.closeViewSite();
+        };
+    });

src/popup/app/vault/views/vault.html

@@ -8,11 +8,13 @@
                 <div class="item item-divider">
                     {{folder.name}}
                 </div>
-                <div class="item item-button-right" ng-repeat="site in folderSites = (sites | filter: { folderId: folder.id } | orderBy: ['name', 'username'])">
-                    {{site.name}}<br />
-                    {{site.username}}
-                    <button class="button button-clear button-dark"><i class="icon ion-more"></i></button>
-                </div>
+                <ng-repeat ng-repeat="site in folderSites = (sites | filter: { folderId: folder.id } | orderBy: ['name', 'username'])">
+                    <a ng-click="viewSite(site)" class="item item-button-right">
+                        {{site.name}}<br />
+                        {{site.username}}
+                        <span class="button button-clear button-dark"><i class="icon ion-more"></i></span>
+                    </a>
+                </ng-repeat>
             </ng-repeat>
         </div>
     </ion-content>

src/popup/app/vault/views/vaultEditSite.html

@@ -0,0 +1,63 @@
+<ion-modal-view ng-controller="vaultEditSiteController">
+    <ion-header-bar class="bar bar-header bar-positive">
+        <button class="button button-clear button-primary" ng-click="close()">Cancel</button>
+        <h1 class="title">Edit Site</h1>
+        <button class="button button-clear button-primary" ng-click="editSite(site)">Save</button>
+    </ion-header-bar>
+    <ion-content>
+        <div class="list">
+            <div class="item item-divider">
+                Site Information
+            </div>
+            <label class="item item-input item-stacked-label">
+                <span class="input-label">Name</span>
+                <input type="text" ng-model="site.name">
+            </label>
+            <label class="item item-input item-stacked-label">
+                <span class="input-label">URI</span>
+                <input type="text" ng-model="site.uri">
+            </label>
+            <label class="item item-input item-stacked-label">
+                <span class="input-label">Username</span>
+                <input type="text" ng-model="site.username">
+            </label>
+            <label class="item item-input item-stacked-label">
+                <span class="input-label">Password</span>
+                <input type="password" ng-model="site.password">
+            </label>
+            <a class="item item-icon-right" href="#">
+                Generate Password
+                <i class="icon ion-ios-arrow-right"></i>
+            </a>
+            <div class="item item-divider">
+                &nbsp;
+            </div>
+            <label class="item item-input item-select">
+                <div class="input-label">Folder</div>
+                <select>
+                    <option>Blue</option>
+                    <option selected>Green</option>
+                    <option>Red</option>
+                </select>
+            </label>
+            <div class="item item-toggle">
+                Favorite
+                <label class="toggle toggle-assertive">
+                    <input type="checkbox" ng-model="site.favorite">
+                    <div class="track">
+                        <div class="handle"></div>
+                    </div>
+                </label>
+            </div>
+            <div class="item item-divider">
+                Notes
+            </div>
+            <div class="item item-input">
+                <textarea rows="5" ng-model="site.notes"></textarea>
+            </div>
+            <div class="item item-divider">
+                &nbsp;
+            </div>
+        </div>
+    </ion-content>
+</ion-modal-view>

src/popup/app/vault/views/vaultViewSite.html

@@ -0,0 +1,10 @@
+<ion-modal-view ng-controller="vaultViewSiteController">
+    <ion-header-bar class="bar bar-header bar-positive">
+        <button class="button button-clear button-primary" ng-click="close()">Close</button>
+        <h1 class="title">View Site</h1>
+        <button class="button button-clear button-primary" ng-click="editSite()">Edit</button>
+    </ion-header-bar>
+    <ion-content>
+        View site
+    </ion-content>
+</ion-modal-view>

src/popup/index.html

@@ -32,6 +32,8 @@
     <script src="app/vault/vaultModule.js"></script>
     <script src="app/vault/vaultController.js"></script>
     <script src="app/vault/vaultAddSiteController.js"></script>
+    <script src="app/vault/vaultEditSiteController.js"></script>
+    <script src="app/vault/vaultViewSiteController.js"></script>
 
     <script src="app/settings/settingsModule.js"></script>
     <script src="app/settings/settingsController.js"></script>