Compare commits

...

6 Commits

Author SHA1 Message Date
5013646e89 Edit mode button works 2015-10-21 17:31:04 -07:00
9925b91405 Fixed 'insta-persist' feature 2015-10-21 15:36:20 -07:00
fdfb524eef Fixed scope of editMode variable 2015-10-21 12:06:11 -07:00
ef250f58de Marged style updates 2015-10-21 12:01:59 -07:00
15ed91f651 Added save buttons 2015-10-21 11:54:35 -07:00
92573b817f Added drag to enable edit mode 2015-10-20 21:03:36 -07:00
9 changed files with 68 additions and 35 deletions

View File

@ -20,6 +20,7 @@
"$scope",
"$route",
"$location",
"$q",
"objectService",
"navigationService",
"urlService"
@ -34,7 +35,8 @@
{
"key": "BrowseObjectController",
"implementation": "BrowseObjectController.js",
"depends": [ "$scope", "$location", "$route" ]
"depends": [ "$scope", "$location", "$route", "$q",
"navigationService" ]
},
{
"key": "CreateMenuController",
@ -62,6 +64,7 @@
{
"key": "browse-object",
"templateUrl": "templates/browse-object.html",
"gestures": ["drop"],
"uses": [ "view" ]
},
{

View File

@ -20,14 +20,14 @@
at runtime from the About dialog for additional information.
-->
<div ng-init="
editMode = false;
editBtns = [{ cssclass: 'save',title: 'Save' },{ cssclass: 'cancel',title: 'Discard Changes' }];
editBtns = [{ cssclass: 'save',title: 'Save' },{ cssclass: 'cancel',title: 'Discard Changes', action:'cancelEditing' }];
"></div>
<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>
<span ng-controller="BrowseObjectController">
<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>
<div class="object-browse-bar bar l-flex">
<div class="items-select left">
<mct-representation key="'back-arrow'"
@ -51,7 +51,7 @@
</div>
<div class="l-object-wrapper"
ng-class="{ active:editMode }">
ng-class="{ active:editMode, 'edit-main':editMode}">
<div class="l-object-wrapper-inner l-flex flex-col">
<!-- Toolbar and Save/Cancel buttons -->
<div class="l-edit-controls flex-elem l-flex flex-row flex-align-end"
@ -101,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>

View File

@ -26,8 +26,11 @@
* @namespace platform/commonUI/browse
*/
define(
[],
function () {
[
'../../../representation/src/gestures/GestureConstants',
'../../edit/src/objects/EditableDomainObject'
],
function (GestureConstants, EditableDomainObject) {
"use strict";
var ROOT_ID = "ROOT",
@ -43,7 +46,7 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseController($scope, $route, $location, objectService, navigationService, urlService) {
function BrowseController($scope, $route, $location, $q, objectService, navigationService, urlService) {
var path = [ROOT_ID].concat(
($route.current.params.ids || DEFAULT_PATH).split("/")
);
@ -71,13 +74,17 @@ define(
// Callback for updating the in-scope reference to the object
// that is currently navigated-to.
function setNavigation(domainObject) {
$scope.navigatedObject = domainObject;
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,12 +155,12 @@ define(
// Also listen for changes which come from the tree
$scope.$watch("treeModel.selectedObject", setNavigation);
// Clean up when the scope is destroyed
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);
});
}
return BrowseController;

View File

@ -22,8 +22,9 @@
/*global define,Promise*/
define(
[],
function () {
['../../../representation/src/gestures/GestureConstants',
'../../edit/src/objects/EditableDomainObject'],
function (GestureConstants, EditableDomainObject) {
"use strict";
/**
@ -32,8 +33,10 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseObjectController($scope, $location, $route) {
function BrowseObjectController($scope, $location, $route, $q, navigationService) {
var navigatedObject;
function setViewForDomainObject(domainObject) {
var locationViewKey = $location.search().view;
function selectViewIfMatching(view) {
@ -47,6 +50,8 @@ define(
((domainObject && domainObject.useCapability('view')) || [])
.forEach(selectViewIfMatching);
}
$scope.editMode = domainObject.getDomainObject ? true : false;
navigatedObject = domainObject;
}
function updateQueryParam(viewKey) {
@ -67,6 +72,15 @@ define(
$scope.$watch('domainObject', setViewForDomainObject);
$scope.$watch('representation.selected.key', updateQueryParam);
$scope.cancelEditing = function() {
navigationService.setNavigation($scope.domainObject.getDomainObject());
}
$scope.doAction = function (action){
$scope[action] && $scope[action]();
}
}
return BrowseObjectController;

View File

@ -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;

View File

@ -101,6 +101,10 @@ define(
new Factory(capability, editableObject, domainObject, cache) :
capability;
};
editableObject.getDomainObject = function() {
return domainObject;
}
return editableObject;
}

View File

@ -31,7 +31,6 @@
mct-object="childObject">
</mct-representation>
</div>
<!-- Drag handles -->
<span ng-show="domainObject.hasCapability('editor')">

View File

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

View File

@ -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,22 +95,23 @@ 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.
if (domainObjectType === 'folder' || domainObject.hasCapability('editor')) {
//if (domainObjectType === 'folder' || domainObject.hasCapability('editor')) {
// Handle the drop; add the dropped identifier to the
// destination domain object's composition, and persist
// the change.
if (id) {
$q.when(action && action.perform()).then(function (result) {
navigationService.setNavigation(editableDomainObject);
broadcastDrop(id, event);
});
}
}
//}
// TODO: Alert user if drag and drop is not allowed
}