From 9634d704897433661f6f81952529f4ac4d7d544f Mon Sep 17 00:00:00 2001
From: Jaden Diefenbaugh <blakcap@users.noreply.github.com>
Date: Thu, 2 Mar 2017 13:41:10 +0100
Subject: [PATCH] add draggable sorting, fix groupsService analyzer assignment
---
beat/web/reports/static/reports/app/app.js | 2 +-
.../reports/app/directives/groupPanelItems.js | 6 +++---
.../reports/app/directives/groupTableItem.js | 21 ++++++++++++-------
.../reports/app/directives/groupTextItem.js | 1 -
.../reports/app/directives/groupsLayout.js | 20 ++++--------------
.../reports/app/services/groupsService.js | 18 ++++++++++++----
.../web/reports/templates/reports/report.html | 3 +++
buildout.cfg | 1 +
8 files changed, 40 insertions(+), 32 deletions(-)
diff --git a/beat/web/reports/static/reports/app/app.js b/beat/web/reports/static/reports/app/app.js
index 7ebf397a4..c76509282 100644
--- a/beat/web/reports/static/reports/app/app.js
+++ b/beat/web/reports/static/reports/app/app.js
@@ -19,7 +19,7 @@
* You should have received a copy of the GNU Affero Public License along
* with the BEAT platform. If not, see http://www.gnu.org/licenses/.
*/
-angular.module('reportApp', ['ui.router', 'angular.filter']);
+angular.module('reportApp', ['ui.router', 'angular.filter', 'ui.sortable']);
angular.module('reportApp').config(function ($stateProvider, $urlRouterProvider){
diff --git a/beat/web/reports/static/reports/app/directives/groupPanelItems.js b/beat/web/reports/static/reports/app/directives/groupPanelItems.js
index 916f24b26..e94a25dce 100644
--- a/beat/web/reports/static/reports/app/directives/groupPanelItems.js
+++ b/beat/web/reports/static/reports/app/directives/groupPanelItems.js
@@ -57,10 +57,10 @@ angular.module('reportApp').directive("groupPanelItems", [function(){
role="tabpanel"
aria-labelledby="{{group.name}}-itemlist-heading">
<div class="panel-body">
- <div class='panel-group'>
+ <div ui-sortable ng-model='group._reportItems' class='panel-group'>
<div
group-item-container
- ng-repeat='item in group._reportItems'
+ ng-repeat='item in group.reportItems'
group='group'
report-item='item'
style='margin-bottom: 5px;'
@@ -70,5 +70,5 @@ angular.module('reportApp').directive("groupPanelItems", [function(){
</div>
</div>
`
- }
+ };
}]);
diff --git a/beat/web/reports/static/reports/app/directives/groupTableItem.js b/beat/web/reports/static/reports/app/directives/groupTableItem.js
index 9d4363349..049f8857b 100644
--- a/beat/web/reports/static/reports/app/directives/groupTableItem.js
+++ b/beat/web/reports/static/reports/app/directives/groupTableItem.js
@@ -63,7 +63,7 @@ angular.module('reportApp')
type = undefined;
}
- return type
+ return type;
};
scope.getFieldVal = (expName, field) => {
let fVal = scope.tableables[expName] ?
@@ -71,12 +71,12 @@ angular.module('reportApp')
let val;
if(field === scope.fields[0]){
val = scope.group.aliases[expName].length > 0 ? scope.group.aliases[expName] : expName;
+ } else if(!fVal){
+ val = '-';
} else if(fVal.value){
val = fVal.value;
} else if (fVal){
val = fVal;
- } else {
- val = '-';
}
return val;
@@ -84,8 +84,15 @@ angular.module('reportApp')
scope.chosenCols = Array.from(scope.fields);
scope.saveChosenCols = () => () => {
- scope.fields.length = 1;
- scope.chosenCols.forEach(f => scope.fields.push(f));
+ const newCols = scope.chosenCols
+ .filter(c => !scope.fields.includes(c));
+
+ const rmCols = scope.fields
+ .filter(f => !scope.chosenCols.includes(f) && f !== 'Experiment');
+
+ rmCols.forEach(rf => scope.fields.splice(scope.fields.indexOf(rf), 1));
+
+ newCols.forEach(nf => scope.fields.push(nf));
};
// need to nest actual value in an obj to get angular
@@ -148,7 +155,7 @@ angular.module('reportApp')
<div style='height: 100%; overflow-x: auto;'>
<table class="table table-striped table-hover">
<thead>
- <tr>
+ <tr ui-sortable ng-model='fields'>
<th ng-repeat='field in fields'>
<span
ng-if="sortField.val == field"
@@ -176,5 +183,5 @@ angular.module('reportApp')
</div>
</div>
`
- }
+ };
}]);
diff --git a/beat/web/reports/static/reports/app/directives/groupTextItem.js b/beat/web/reports/static/reports/app/directives/groupTextItem.js
index 98364dc4e..ce5ba663d 100644
--- a/beat/web/reports/static/reports/app/directives/groupTextItem.js
+++ b/beat/web/reports/static/reports/app/directives/groupTextItem.js
@@ -36,7 +36,6 @@ angular.module('reportApp')
scope.item = scope.reportItem;
scope.domId = `${scope.group.name}_${scope.item.id}`;
const editorOptions = {
- debug: 'info',
modules: {
toolbar: [
[{ header: [1, 2, false] }],
diff --git a/beat/web/reports/static/reports/app/directives/groupsLayout.js b/beat/web/reports/static/reports/app/directives/groupsLayout.js
index 458e17d56..5c59041a4 100644
--- a/beat/web/reports/static/reports/app/directives/groupsLayout.js
+++ b/beat/web/reports/static/reports/app/directives/groupsLayout.js
@@ -33,30 +33,18 @@ angular.module('reportApp').directive("groupsLayout", ['GroupsService', function
},
link: function(scope, el, attr){
scope.groups = GroupsService.groups;
+ scope.GroupsService = GroupsService;
},
template: `
-<div id='groupsLayout' class='panel-group'>
+<div ui-sortable ng-model='GroupsService.groups' id='groupsLayout' class='panel-group'>
<div
- ng-if='true || groups.length > 1'
group-panel-content
class='panel panel-default'
- ng-repeat='group in groups track by $index'
+ ng-repeat='group in GroupsService.groups'
group='group'
>
</div>
- <!--
- <div
- group-table-item
- ng-if='groups.length == 1'
- class='panel panel-default'
- ng-repeat='table in groups[0]._reportItems'
- group='groups[0]'
- id='table.id'
- fields='table.content'
- >
- </div>
- !-->
</div>
`
- }
+ };
}]);
diff --git a/beat/web/reports/static/reports/app/services/groupsService.js b/beat/web/reports/static/reports/app/services/groupsService.js
index 7e14e6852..887a0482d 100644
--- a/beat/web/reports/static/reports/app/services/groupsService.js
+++ b/beat/web/reports/static/reports/app/services/groupsService.js
@@ -75,7 +75,7 @@ angular.module('reportApp').factory('GroupsService', ['$http', function($http){
// add an exp to this group
addExperiment (expName, analyzer) {
let res = this._experimentNames.add(expName);
- if(this._experimentNames.size === 0 && analyzer){
+ if(this._experimentNames.size === 1 && analyzer && analyzer.length > 0){
this.analyzer = analyzer;
}
if(!this.aliases[expName]){
@@ -148,12 +148,13 @@ angular.module('reportApp').factory('GroupsService', ['$http', function($http){
// }
groupsServiceInstance.serializeGroups = () => {
return groupData
- .map(g => { return {
+ .map((g, i) => { return {
[g.name]: {
experiments: g.experiments,
reportItems: g.reportItems,
analyzer: g.analyzer,
- aliases: g.aliases
+ aliases: g.aliases,
+ idx: i
}
};
})
@@ -194,10 +195,19 @@ angular.module('reportApp').factory('GroupsService', ['$http', function($http){
groupsServiceInstance.loadGroups = (data) => {
// wipe data and load groups
groupData.splice(0, groupData.length);
+ let safeData = data || {};
+ console.log(safeData);
- Object.entries(data || {})
+ Object.entries(safeData)
// sometimes we get an empty string for name for some reason
.filter(([groupName, gData]) => groupName.length > 0)
+ // sort using the saved index values
+ .sort(([aName, a], [bName, b]) => {
+ // if these are undefined, the sort func handles it
+ let ia = a.idx;
+ let ib = b.idx;
+ return ia - ib;
+ })
.forEach(([groupName, gData]) => {
let g = groupsServiceInstance.createGroup(groupName);
let analyzer = gData.analyzer || '';
diff --git a/beat/web/reports/templates/reports/report.html b/beat/web/reports/templates/reports/report.html
index 32b21caf3..fda86cf0c 100644
--- a/beat/web/reports/templates/reports/report.html
+++ b/beat/web/reports/templates/reports/report.html
@@ -67,6 +67,9 @@
<script src="{% fingerprint "jquery-ui/ui/minified/jquery.ui.widget.min.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "jquery-ui/ui/minified/jquery.ui.button.min.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "jquery-ui/ui/minified/jquery.ui.dialog.min.js" %}" type="text/javascript" charset="utf-8"></script>
+ <script src="{% fingerprint "jquery-ui/ui/minified/jquery.ui.mouse.min.js" %}" type="text/javascript" charset="utf-8"></script>
+ <script src="{% fingerprint "jquery-ui/ui/minified/jquery.ui.sortable.min.js" %}" type="text/javascript" charset="utf-8"></script>
+ <script src="{% fingerprint "angular-ui-sortable/sortable.min.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "experiments/js/utils.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "reports/js/base_64_encoder_decoder.js" %}" type="text/javascript" charset="utf-8"></script>
diff --git a/buildout.cfg b/buildout.cfg
index e1f99b7d2..74df35d3f 100644
--- a/buildout.cfg
+++ b/buildout.cfg
@@ -128,6 +128,7 @@ packages = jquery#~1.11.3
chartjs#~1.0.2
underscore#~1.8.3
datatables#~1.10.10
+ angular-ui-sortable#~0.14
executable = ${buildout:bin-directory}/bower
base-directory = beat/web
downloads = static
--
GitLab