Edit mode and cancel buttons work

platform/commonUI/browse/bundle.json

@@ -35,7 +35,8 @@
             {
                 "key": "BrowseObjectController",
                 "implementation": "BrowseObjectController.js",
-                "depends": [ "$scope", "$location", "$route", "$q" ]
+                "depends": [ "$scope", "$location", "$route", "$q",
+                    "navigationService" ]
             },
             {
                 "key": "CreateMenuController",

platform/commonUI/browse/res/templates/browse-object.html

@@ -20,13 +20,14 @@
  at runtime from the About dialog for additional information.
 -->
 <div ng-init="
-    editBtns = [{ cssclass: 'save',title: 'Save' },{ cssclass: 'cancel',title: 'Discard Changes' }];
+    editBtns = [{ cssclass: 'save',title: 'Save' },{ cssclass: 'cancel',title: 'Discard Changes', action:'cancelEditing' }];
 "></div>
-<span ng-controller="BrowseObjectController">
-    <a class="s-btn"
+<span ng-controller="BrowseObjectController"
+      mct-before-unload="getUnloadWarning()">
+    <!--<a class="s-btn"
        style="opacity: 0.9; position:absolute; right: 250px; z-index: 100"
        ng-class="{ major:!editMode }"
-       ng-click="editMode = !editMode">Set EditMode to {{!editMode}}</a>
+       ng-click="editMode = !editMode">Set EditMode to {{!editMode}}</a> -->
     <div class="object-browse-bar bar l-flex">
         <div class="items-select left">
             <mct-representation key="'back-arrow'"
@@ -100,7 +101,7 @@
                     <span ng-repeat="btn in editBtns">
                         <a class='s-btn t-{{btn.cssclass}}'
                            title='{{btn.title}}'
-                           ng-click="currentAction.perform()"
+                           ng-click="doAction(btn.action)"
                            ng-class="{ major: $index === 0 }">
                             <span class="title-label">{{btn.title}}</span>
                         </a>

platform/commonUI/browse/src/BrowseController.js

@@ -74,15 +74,17 @@ define(
             // Callback for updating the in-scope reference to the object
             // that is currently navigated-to.
             function setNavigation(domainObject) {
-                var navigatedDomainObject = domainObject;
-                
-                $scope.navigatedObject = navigatedDomainObject;
+
+                var wrappedObject = domainObject;
+
+                $scope.navigatedObject = wrappedObject;
                 $scope.treeModel.selectedObject = domainObject;
                 navigationService.setNavigation(domainObject);
                 updateRoute(domainObject);
             }
 
             function navigateTo(domainObject) {
+
                 // Check if an object has been navigated-to already...
                 // If not, or if an ID path has been explicitly set in the URL,
                 // navigate to the URL-specified object.
@@ -148,6 +150,16 @@ define(
                 selectedObject: navigationService.getNavigation()
             };
 
+            $scope.beforeUnloadWarning = function() {
+                var editorCapability = $scope.navigatedObject &&
+                        $scope.navigatedObject.getCapability("editor"),
+                    hasChanges = editorCapability && editorCapability.dirty();
+
+                return hasChanges ?
+                    "Unsaved changes will be lost if you leave this page." :
+                    undefined;
+            }
+
             // Listen for changes in navigation state.
             navigationService.addListener(setNavigation);
 
@@ -159,8 +171,6 @@ define(
                 navigationService.removeListener(setNavigation);
             });
             
-            $scope.editMode = false;
-            
         }
 
         return BrowseController;

platform/commonUI/browse/src/BrowseObjectController.js

@@ -33,7 +33,8 @@ define(
          * @memberof platform/commonUI/browse
          * @constructor
          */
-        function BrowseObjectController($scope, $location, $route, $q) {
+        function BrowseObjectController($scope, $location, $route, $q, navigationService) {
+            var navigatedObject;
             function setViewForDomainObject(domainObject) {
                 
                 var locationViewKey = $location.search().view;
@@ -49,6 +50,8 @@ define(
                     ((domainObject && domainObject.useCapability('view')) || [])
                         .forEach(selectViewIfMatching);
                 }
+                $scope.editMode = domainObject.getDomainObject ? true : false;
+                navigatedObject = domainObject;
             }
 
             function updateQueryParam(viewKey) {
@@ -66,23 +69,17 @@ define(
                     });
                 }
             }
-            
-            function toggleEditMode(editMode){
-                var domainObject = $scope.domainObject;
-                if (editMode){
-                    $scope.domainObject = domainObject && new EditableDomainObject(domainObject, $q);
-                } else {
-                    $scope.domainObject = (domainObject.getDomainObject && domainObject.getDomainObject()) || domainObject;
-                }
-            }
-            
-            $scope.$watch('editMode', toggleEditMode);
+
             $scope.$watch('domainObject', setViewForDomainObject);
             $scope.$watch('representation.selected.key', updateQueryParam);
 
-            $scope.$on(GestureConstants.MCT_DROP_EVENT, function() {
-                $scope.editMode = true;
-            });
+            $scope.cancelEditing = function() {
+                navigationService.setNavigation($scope.domainObject.getDomainObject());
+            }
+
+            $scope.doAction = function (action){
+                $scope[action] && $scope[action]();
+            }
 
         }
 

platform/commonUI/edit/src/actions/EditAction.js

@@ -25,8 +25,8 @@
  * Module defining EditAction. Created by vwoeltje on 11/14/14.
  */
 define(
-    [],
-    function () {
+    ['../objects/EditableDomainObject'],
+    function (EditableDomainObject) {
         "use strict";
 
         // A no-op action to return in the event that the action cannot
@@ -71,8 +71,10 @@ define(
          * Enter edit mode.
          */
         EditAction.prototype.perform = function () {
-            this.navigationService.setNavigation(this.domainObject);
-            this.$location.path("/edit");
+            if (!this.domainObject.getDomainObject) {
+                this.navigationService.setNavigation(new EditableDomainObject(this.domainObject));
+            }
+            //this.$location.path("/edit");
         };
 
         /**
@@ -83,10 +85,11 @@ define(
          */
         EditAction.appliesTo = function (context) {
             var domainObject = (context || {}).domainObject,
-                type = domainObject && domainObject.getCapability('type');
+                type = domainObject && domainObject.getCapability('type'),
+                isEditMode = domainObject && domainObject.getDomainObject ? true : false;
 
             // Only allow creatable types to be edited
-            return type && type.hasFeature('creation');
+            return type && type.hasFeature('creation') && !isEditMode;
         };
 
         return EditAction;

platform/representation/bundle.json

@@ -21,7 +21,7 @@
             {
                 "key": "drop",
                 "implementation": "gestures/DropGesture.js",
-                "depends": [ "dndService", "$q" ]
+                "depends": [ "dndService", "$q", "navigationService" ]
             },
             {
                 "key": "menu",

platform/representation/src/gestures/DropGesture.js

@@ -25,8 +25,9 @@
  * Module defining DropGesture. Created by vwoeltje on 11/17/14.
  */
 define(
-    ['./GestureConstants'],
-    function (GestureConstants) {
+    ['./GestureConstants',
+     '../../../commonUI/edit/src/objects/EditableDomainObject'],
+    function (GestureConstants, EditableDomainObject) {
         "use strict";
 
         /**
@@ -40,8 +41,9 @@ define(
          * @param {DomainObject} domainObject the domain object whose
          *        composition should be modified as a result of the drop.
          */
-        function DropGesture(dndService, $q, element, domainObject) {
-            var actionCapability = domainObject.getCapability('action'),
+        function DropGesture(dndService, $q, navigationService, element, domainObject) {
+            var editableDomainObject = domainObject instanceof EditableDomainObject ? domainObject : new EditableDomainObject(domainObject, $q),
+                actionCapability = editableDomainObject.getCapability('action'),
                 action; // Action for the drop, when it occurs
             
             function broadcastDrop(id, event) {
@@ -93,8 +95,8 @@ define(
             function drop(e) {
                 var event = (e || {}).originalEvent || e,
                     id = event.dataTransfer.getData(GestureConstants.MCT_DRAG_TYPE),
-                    domainObjectType = domainObject.getModel().type;
-                
+                    domainObjectType = editableDomainObject.getModel().type;
+
                 // If currently in edit mode allow drag and drop gestures to the
                 // domain object. An exception to this is folders which have drop
                 // gestures in browse mode.
@@ -105,6 +107,7 @@ define(
                     // the change.
                     if (id) {
                         $q.when(action && action.perform()).then(function (result) {
+                            navigationService.setNavigation(editableDomainObject);
                             broadcastDrop(id, event);
                         });
                     }