mirror of
https://github.com/nasa/openmct.git
synced 2025-04-29 07:20:13 +00:00
Edit mode and cancel buttons work
This commit is contained in:
parent
fdfb524eef
commit
0fb9f3731a
@ -35,7 +35,8 @@
|
|||||||
{
|
{
|
||||||
"key": "BrowseObjectController",
|
"key": "BrowseObjectController",
|
||||||
"implementation": "BrowseObjectController.js",
|
"implementation": "BrowseObjectController.js",
|
||||||
"depends": [ "$scope", "$location", "$route", "$q" ]
|
"depends": [ "$scope", "$location", "$route", "$q",
|
||||||
|
"navigationService" ]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"key": "CreateMenuController",
|
"key": "CreateMenuController",
|
||||||
|
@ -20,13 +20,14 @@
|
|||||||
at runtime from the About dialog for additional information.
|
at runtime from the About dialog for additional information.
|
||||||
-->
|
-->
|
||||||
<div ng-init="
|
<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>
|
"></div>
|
||||||
<span ng-controller="BrowseObjectController">
|
<span ng-controller="BrowseObjectController"
|
||||||
<a class="s-btn"
|
mct-before-unload="getUnloadWarning()">
|
||||||
|
<!--<a class="s-btn"
|
||||||
style="opacity: 0.9; position:absolute; right: 250px; z-index: 100"
|
style="opacity: 0.9; position:absolute; right: 250px; z-index: 100"
|
||||||
ng-class="{ major:!editMode }"
|
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="object-browse-bar bar l-flex">
|
||||||
<div class="items-select left">
|
<div class="items-select left">
|
||||||
<mct-representation key="'back-arrow'"
|
<mct-representation key="'back-arrow'"
|
||||||
@ -100,7 +101,7 @@
|
|||||||
<span ng-repeat="btn in editBtns">
|
<span ng-repeat="btn in editBtns">
|
||||||
<a class='s-btn t-{{btn.cssclass}}'
|
<a class='s-btn t-{{btn.cssclass}}'
|
||||||
title='{{btn.title}}'
|
title='{{btn.title}}'
|
||||||
ng-click="currentAction.perform()"
|
ng-click="doAction(btn.action)"
|
||||||
ng-class="{ major: $index === 0 }">
|
ng-class="{ major: $index === 0 }">
|
||||||
<span class="title-label">{{btn.title}}</span>
|
<span class="title-label">{{btn.title}}</span>
|
||||||
</a>
|
</a>
|
||||||
|
@ -74,15 +74,17 @@ define(
|
|||||||
// Callback for updating the in-scope reference to the object
|
// Callback for updating the in-scope reference to the object
|
||||||
// that is currently navigated-to.
|
// that is currently navigated-to.
|
||||||
function setNavigation(domainObject) {
|
function setNavigation(domainObject) {
|
||||||
var navigatedDomainObject = domainObject;
|
|
||||||
|
|
||||||
$scope.navigatedObject = navigatedDomainObject;
|
var wrappedObject = domainObject;
|
||||||
|
|
||||||
|
$scope.navigatedObject = wrappedObject;
|
||||||
$scope.treeModel.selectedObject = domainObject;
|
$scope.treeModel.selectedObject = domainObject;
|
||||||
navigationService.setNavigation(domainObject);
|
navigationService.setNavigation(domainObject);
|
||||||
updateRoute(domainObject);
|
updateRoute(domainObject);
|
||||||
}
|
}
|
||||||
|
|
||||||
function navigateTo(domainObject) {
|
function navigateTo(domainObject) {
|
||||||
|
|
||||||
// Check if an object has been navigated-to already...
|
// Check if an object has been navigated-to already...
|
||||||
// If not, or if an ID path has been explicitly set in the URL,
|
// If not, or if an ID path has been explicitly set in the URL,
|
||||||
// navigate to the URL-specified object.
|
// navigate to the URL-specified object.
|
||||||
@ -148,6 +150,16 @@ define(
|
|||||||
selectedObject: navigationService.getNavigation()
|
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.
|
// Listen for changes in navigation state.
|
||||||
navigationService.addListener(setNavigation);
|
navigationService.addListener(setNavigation);
|
||||||
|
|
||||||
@ -159,8 +171,6 @@ define(
|
|||||||
navigationService.removeListener(setNavigation);
|
navigationService.removeListener(setNavigation);
|
||||||
});
|
});
|
||||||
|
|
||||||
$scope.editMode = false;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return BrowseController;
|
return BrowseController;
|
||||||
|
@ -33,7 +33,8 @@ define(
|
|||||||
* @memberof platform/commonUI/browse
|
* @memberof platform/commonUI/browse
|
||||||
* @constructor
|
* @constructor
|
||||||
*/
|
*/
|
||||||
function BrowseObjectController($scope, $location, $route, $q) {
|
function BrowseObjectController($scope, $location, $route, $q, navigationService) {
|
||||||
|
var navigatedObject;
|
||||||
function setViewForDomainObject(domainObject) {
|
function setViewForDomainObject(domainObject) {
|
||||||
|
|
||||||
var locationViewKey = $location.search().view;
|
var locationViewKey = $location.search().view;
|
||||||
@ -49,6 +50,8 @@ define(
|
|||||||
((domainObject && domainObject.useCapability('view')) || [])
|
((domainObject && domainObject.useCapability('view')) || [])
|
||||||
.forEach(selectViewIfMatching);
|
.forEach(selectViewIfMatching);
|
||||||
}
|
}
|
||||||
|
$scope.editMode = domainObject.getDomainObject ? true : false;
|
||||||
|
navigatedObject = domainObject;
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateQueryParam(viewKey) {
|
function updateQueryParam(viewKey) {
|
||||||
@ -67,22 +70,16 @@ 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('domainObject', setViewForDomainObject);
|
||||||
$scope.$watch('representation.selected.key', updateQueryParam);
|
$scope.$watch('representation.selected.key', updateQueryParam);
|
||||||
|
|
||||||
$scope.$on(GestureConstants.MCT_DROP_EVENT, function() {
|
$scope.cancelEditing = function() {
|
||||||
$scope.editMode = true;
|
navigationService.setNavigation($scope.domainObject.getDomainObject());
|
||||||
});
|
}
|
||||||
|
|
||||||
|
$scope.doAction = function (action){
|
||||||
|
$scope[action] && $scope[action]();
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -25,8 +25,8 @@
|
|||||||
* Module defining EditAction. Created by vwoeltje on 11/14/14.
|
* Module defining EditAction. Created by vwoeltje on 11/14/14.
|
||||||
*/
|
*/
|
||||||
define(
|
define(
|
||||||
[],
|
['../objects/EditableDomainObject'],
|
||||||
function () {
|
function (EditableDomainObject) {
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
// A no-op action to return in the event that the action cannot
|
// A no-op action to return in the event that the action cannot
|
||||||
@ -71,8 +71,10 @@ define(
|
|||||||
* Enter edit mode.
|
* Enter edit mode.
|
||||||
*/
|
*/
|
||||||
EditAction.prototype.perform = function () {
|
EditAction.prototype.perform = function () {
|
||||||
this.navigationService.setNavigation(this.domainObject);
|
if (!this.domainObject.getDomainObject) {
|
||||||
this.$location.path("/edit");
|
this.navigationService.setNavigation(new EditableDomainObject(this.domainObject));
|
||||||
|
}
|
||||||
|
//this.$location.path("/edit");
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -83,10 +85,11 @@ define(
|
|||||||
*/
|
*/
|
||||||
EditAction.appliesTo = function (context) {
|
EditAction.appliesTo = function (context) {
|
||||||
var domainObject = (context || {}).domainObject,
|
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
|
// Only allow creatable types to be edited
|
||||||
return type && type.hasFeature('creation');
|
return type && type.hasFeature('creation') && !isEditMode;
|
||||||
};
|
};
|
||||||
|
|
||||||
return EditAction;
|
return EditAction;
|
||||||
|
@ -21,7 +21,7 @@
|
|||||||
{
|
{
|
||||||
"key": "drop",
|
"key": "drop",
|
||||||
"implementation": "gestures/DropGesture.js",
|
"implementation": "gestures/DropGesture.js",
|
||||||
"depends": [ "dndService", "$q" ]
|
"depends": [ "dndService", "$q", "navigationService" ]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"key": "menu",
|
"key": "menu",
|
||||||
|
@ -25,8 +25,9 @@
|
|||||||
* Module defining DropGesture. Created by vwoeltje on 11/17/14.
|
* Module defining DropGesture. Created by vwoeltje on 11/17/14.
|
||||||
*/
|
*/
|
||||||
define(
|
define(
|
||||||
['./GestureConstants'],
|
['./GestureConstants',
|
||||||
function (GestureConstants) {
|
'../../../commonUI/edit/src/objects/EditableDomainObject'],
|
||||||
|
function (GestureConstants, EditableDomainObject) {
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -40,8 +41,9 @@ define(
|
|||||||
* @param {DomainObject} domainObject the domain object whose
|
* @param {DomainObject} domainObject the domain object whose
|
||||||
* composition should be modified as a result of the drop.
|
* composition should be modified as a result of the drop.
|
||||||
*/
|
*/
|
||||||
function DropGesture(dndService, $q, element, domainObject) {
|
function DropGesture(dndService, $q, navigationService, element, domainObject) {
|
||||||
var actionCapability = domainObject.getCapability('action'),
|
var editableDomainObject = domainObject instanceof EditableDomainObject ? domainObject : new EditableDomainObject(domainObject, $q),
|
||||||
|
actionCapability = editableDomainObject.getCapability('action'),
|
||||||
action; // Action for the drop, when it occurs
|
action; // Action for the drop, when it occurs
|
||||||
|
|
||||||
function broadcastDrop(id, event) {
|
function broadcastDrop(id, event) {
|
||||||
@ -93,7 +95,7 @@ define(
|
|||||||
function drop(e) {
|
function drop(e) {
|
||||||
var event = (e || {}).originalEvent || e,
|
var event = (e || {}).originalEvent || e,
|
||||||
id = event.dataTransfer.getData(GestureConstants.MCT_DRAG_TYPE),
|
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
|
// If currently in edit mode allow drag and drop gestures to the
|
||||||
// domain object. An exception to this is folders which have drop
|
// domain object. An exception to this is folders which have drop
|
||||||
@ -105,6 +107,7 @@ define(
|
|||||||
// the change.
|
// the change.
|
||||||
if (id) {
|
if (id) {
|
||||||
$q.when(action && action.perform()).then(function (result) {
|
$q.when(action && action.perform()).then(function (result) {
|
||||||
|
navigationService.setNavigation(editableDomainObject);
|
||||||
broadcastDrop(id, event);
|
broadcastDrop(id, event);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user