ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-19 05:07:52 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Notebook bug fixes from Testathon - 12/4/2018 (#2236)

Browse Source 
* fix add links by drag and drop

* fix dialog component logging errors

* fix search component errors

* fix sort

* remove unused entrydnd file

* remove unnecessary console logs
This commit is contained in:
Deep Tailor 2018-12-07 14:50:14 -08:00 committed by Pete Richards
parent 981392ea07
commit c6a181a2e7
7 changed files with 107 additions and 188 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/plugins/notebook/plugin.js
View File

@ -27,7 +27,6 @@ define([
"./src/actions/NewEntryContextual",
"./src/actions/AnnotateSnapshot",
"./src/directives/MCTSnapshot",
"./src/directives/EntryDnd",
"./res/templates/controls/snapSelect.html",
"./res/templates/controls/embedControl.html",
"./res/templates/annotation.html",
@ -39,7 +38,6 @@ define([
newEntryAction,
AnnotateSnapshotAction,
MCTSnapshotDirective,
EntryDndDirective,
snapSelectTemplate,
embedControlTemplate,
annotationTemplate,
@ -67,9 +65,8 @@ define([
features: 'creation',
model: {
entries: [],
composition: [],
entryTypes: [],
defaultSort: '-createdOn'
defaultSort: 'oldest'
},
properties: [
{
@ -79,11 +76,11 @@ define([
options: [
{
name: 'Newest First',
value: "-createdOn",
value: "newest"
},
{
name: 'Oldest First',
value: "createdOn"
value: "oldest"
}
],
cssClass: 'l-inline'
@ -167,17 +164,6 @@ define([
"dialogService",
"notificationService"
]
},
{
"key": "mctEntryDnd",
"implementation": EntryDndDirective,
"depends": [
"$rootScope",
"$compile",
"dndService",
"typeService",
"notificationService"
]
}
],
representations: [

7
src/plugins/notebook/res/templates/entry.html
View File

@ -1,5 +1,5 @@
<li class="c-notebook__entry c-ne has-local-controls"
v-on:drop="dropOnEntry(entry.id)"
v-on:drop="dropOnEntry(entry.id, $event)"
v-on:dragover="dragoverOnEntry"
>
<div class="c-ne__time-and-content">
@ -19,8 +19,9 @@
<div class="c-ne__embeds">
<notebook-embed
v-for="(embed, index) in entry.embeds"
v-bind:embed="embed"
v-bind:entry="entry"
:key="index"
:embed="embed"
:entry="entry"
></notebook-embed>
</div>
</div>

24
src/plugins/notebook/res/templates/notebook.html
View File

@ -1,9 +1,10 @@
<div class="c-notebook">
<div class="c-notebook__head">
<search class="c-notebook__search"
v-model="entrySearch"
v-on:input="search($event)"
v-on:clear="entrySearch = ''; search($event)"></search>
:value="entrySearch"
@input="search"
@clear="search">
</search>
<div class="c-notebook__controls">
<div class="select c-notebook__controls__time">
<select v-model="showTime">
@ -15,23 +16,24 @@
</div>
<div class="select c-notebook__controls__sort">
<select v-model="sortEntries">
<option value="-createdOn" selected="selected">Newest first</option>
<option value="createdOn">Oldest first</option>
<option value="newest" :selected="sortEntries === 'newest'">Newest first</option>
<option value="oldest" :selected="sortEntries === 'oldest'">Oldest first</option>
</select>
</div>
</div>
</div>
<div class="c-notebook__drag-area icon-plus"
v-on:click="newEntry($event)"
id="newEntry" mct-entry-dnd>
@click="newEntry($event)"
@drop="newEntry($event)"
id="newEntry">
<span class="c-notebook__drag-area__label">To start a new entry, click here or drag and drop any object</span>
</div>
<div class="c-notebook__entries" ng-mouseover="handleActive()">
<ul>
<notebook-entry
v-for="entry in filterBySearch(entries, entrySearch)"
v-bind:entry="entry"
></notebook-entry>
<notebook-entry
v-for="entry in filteredAndSortedEntries"
v-bind:entry="entry">
</notebook-entry>
</ul>
</div>
</div>

37
src/plugins/notebook/src/controllers/EntryController.js
View File

@ -105,23 +105,27 @@ function (
}
};
EntryController.prototype.dropOnEntry = function (entryId) {
var selectedObject = this.dndService.getData('mct-domain-object'),
selectedObjectId = selectedObject.getId(),
selectedModel = selectedObject.getModel(),
cssClass = selectedObject.getCapability('type').typeDef.cssClass,
entryPos = this.entryPosById(entryId),
currentEntryEmbeds = this.domainObject.entries[entryPos].embeds,
newEmbed = {
type: selectedObjectId,
id: '' + Date.now(),
cssClass: cssClass,
name: selectedModel.name,
snapshot: ''
};
EntryController.prototype.dropOnEntry = function (entryid, event) {
currentEntryEmbeds.push(newEmbed);
this.openmct.objects.mutate(this.domainObject, 'entries[' + entryPos + '].embeds', currentEntryEmbeds);
var data = event.dataTransfer.getData('domainObject');
if (data) {
var selectedObject = JSON.parse(data),
selectedObjectId = selectedObject.identifier.key,
cssClass = this.openmct.types.get(selectedObject.type),
entryPos = this.entryPosById(entryid),
currentEntryEmbeds = this.domainObject.entries[entryPos].embeds,
newEmbed = {
type: selectedObjectId,
id: '' + Date.now(),
cssClass: cssClass,
name: selectedObject.name,
snapshot: ''
};
currentEntryEmbeds.push(newEmbed);
this.openmct.objects.mutate(this.domainObject, 'entries[' + entryPos + '].embeds', currentEntryEmbeds);
}
};
EntryController.prototype.dragoverOnEntry = function () {
@ -132,7 +136,6 @@ function (
return {
openmct: this.openmct,
domainObject: this.domainObject,
dndService: this.dndService,
dialogService: this.dialogService,
currentEntryValue: this.currentEntryValue
};

80
src/plugins/notebook/src/controllers/NotebookController.js
View File

@ -90,19 +90,23 @@ function (
return {
entrySearch: self.entrySearch,
showTime: '0',
sortEntries: '-createdOn',
sortEntries: self.domainObject.defaultSort,
entries: self.domainObject.entries,
currentEntryValue: ''
};
},
computed: {
filteredAndSortedEntries() {
return this.sort(this.filterBySearch(this.entries, this.entrySearch), this.sortEntries);
}
},
methods: {
search: function (event) {
if (event.target.value) {
this.entrySearch = event.target.value;
}
search(value) {
this.entrySearch = value;
},
newEntry: self.newEntry,
filterBySearch: self.filterBySearch
filterBySearch: self.filterBySearch,
sort: self.sort
}
});
@ -111,25 +115,48 @@ function (
};
NotebookController.prototype.newEntry = function (event) {
this.NotebookVue.search('');
var date = Date.now(),
embed;
if (event.dataTransfer && event.dataTransfer.getData('domainObject')) {
var selectedObject = JSON.parse(event.dataTransfer.getData('domainObject')),
selectedObjectId = selectedObject.identifier.key,
cssClass = this.openmct.types.get(selectedObject.type);
embed = {
type: selectedObjectId,
id: '' + date,
cssClass: cssClass,
name: selectedObject.name,
snapshot: ''
};
}
var entries = this.domainObject.entries,
lastEntryIndex = entries.length - 1,
lastEntry = entries[lastEntryIndex],
date = Date.now();
lastEntryIndex = this.NotebookVue.sortEntries === 'newest' ? 0 : entries.length - 1,
lastEntry = entries[lastEntryIndex];
if (lastEntry === undefined || lastEntry.text || lastEntry.embeds.length) {
var createdEntry = {'id': 'entry-' + date, 'createdOn': date, 'embeds':[]};
if (embed) {
createdEntry.embeds.push(embed);
}
entries.push(createdEntry);
this.openmct.objects.mutate(this.domainObject, 'entries', entries);
} else {
lastEntry.createdOn = date;
this.openmct.objects.mutate(this.domainObject, 'entries[entries.length-1]', lastEntry);
this.focusOnEntry.bind(this.NotebookVue.$children[lastEntryIndex])();
}
if(embed) {
lastEntry.embeds.push(embed);
}
this.entrySearch = '';
this.openmct.objects.mutate(this.domainObject, 'entries[entries.length-1]', lastEntry);
this.focusOnEntry.bind(this.NotebookVue.$children[lastEntryIndex+1])();
}
};
NotebookController.prototype.entryPosById = function (entryId) {
@ -167,6 +194,33 @@ function (
}
};
NotebookController.prototype.sort = function (array, sortDirection) {
let oldest = (a,b) => {
if (a.createdOn < b.createdOn) {
return -1;
} else if (a.createdOn > b.createdOn) {
return 1;
} else {
return 0;
}
},
newest = (a,b) => {
if (a.createdOn < b.createdOn) {
return 1;
} else if (a.createdOn > b.createdOn) {
return -1;
} else {
return 0;
}
};
if (sortDirection === 'newest') {
return array.sort(newest);
} else {
return array.sort(oldest);
}
};
NotebookController.prototype.show = function (container) {
this.initializeVue(container);
};

126
src/plugins/notebook/src/directives/EntryDnd.js
View File

@ -1,126 +0,0 @@
/*****************************************************************************
* Open MCT, Copyright (c) 2014-2016, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
define(['zepto'], function ($) {
function EntryDnd($rootScope,$compile,dndService,typeService,notificationService) {
function link($scope, $element) {
function drop(e) {
var selectedObject = dndService.getData('mct-domain-object');
var selectedModel = selectedObject.getModel();
var cssClass = selectedObject.getCapability('type').typeDef.cssClass;
var entryId = -1;
var embedId = -1;
$scope.clearSearch();
if ($element[0].id === 'newEntry') {
entryId = $scope.domainObject.model.entries.length;
embedId = 0;
var lastEntry = $scope.domainObject.model.entries[entryId - 1];
if (lastEntry === undefined || lastEntry.text || lastEntry.embeds) {
$scope.domainObject.useCapability('mutation', function (model) {
model.entries.push({'createdOn': +Date.now(),
'id': +Date.now(),
'embeds': [{'type': selectedObject.getId(),
'id': '' + Date.now(),
'cssClass': cssClass,
'name': selectedModel.name,
'snapshot': ''
}]
});
});
}else {
$scope.domainObject.useCapability('mutation', function (model) {
model.entries[entryId - 1] =
{'createdOn': +Date.now(),
'embeds': [{'type': selectedObject.getId(),
'id': '' + Date.now(),
'cssClass': cssClass,
'name': selectedModel.name,
'snapshot': ''
}]
};
});
}
$scope.scrollToTop();
notificationService.info({
title: "Notebook Entry created"
});
}else {
entryId = $scope.findEntryPositionById(Number($element[0].id.replace('entry_', '')));
if (!$scope.domainObject.model.entries[entryId].embeds) {
$scope.domainObject.model.entries[entryId].embeds = [];
}
$scope.domainObject.useCapability('mutation', function (model) {
model.entries[entryId].embeds.push({'type': selectedObject.getId(),
'id': '' + Date.now(),
'cssClass': cssClass,
'name': selectedModel.name,
'snapshot': ''
});
});
embedId = $scope.domainObject.model.entries[entryId].embeds.length - 1;
if (selectedObject) {
e.preventDefault();
}
}
if ($(e.currentTarget).hasClass('drag-active')) {
$(e.currentTarget).removeClass('drag-active');
}
}
function dragover(e) {
if (!$(e.currentTarget).hasClass('drag-active')) {
$(e.currentTarget).addClass('drag-active');
}
}
// Listen for the drop itself
$element.on('dragover', dragover);
$element.on('drop', drop);
$scope.$on('$destroy', function () {
$element.off('dragover', dragover);
$element.off('drop', drop);
});
}
return {
restrict: 'A',
link: link
};
}
return EntryDnd;
});

1
src/ui/components/controls/search.vue
View File

@ -67,7 +67,6 @@
methods: {
clearInput() {
// Clear the user's input and set 'active' to false
this.value = '';
this.$emit('clear','');
this.active = false;
}