Skip to content
Snippets Groups Projects
Commit 93f0cf50 authored by Jaden Diefenbaugh's avatar Jaden Diefenbaugh
Browse files

add prototype view serialized data, add drag handles

parent c4f5974b
No related branches found
No related tags found
1 merge request!223Reports overhaul
Hide whitespace changes
Inline Side-by-side
Showing
with 121 additions and 43 deletions
beat/web/reports/static/reports/app/directives/groupItemContainer.js
+ 41
− 26
View file @ 93f0cf50
...@@ -35,34 +35,49 @@ angular.module('reportApp') ...@@ -35,34 +35,49 @@ angular.module('reportApp')
link: function(scope){ link: function(scope){
scope.item = scope.reportItem; scope.item = scope.reportItem;
scope.domId = `${scope.group.name}_${scope.id}`; scope.domId = `${scope.group.name}_${scope.id}`;
scope.showSerialized = { val: true };
}, },
template: ` template: `
<div <div class='row'>
group-table-item <div ng-class="{'col-md-6': showSerialized.val, 'col-md-12': !showSerialized.val}">
ng-if="item.id.includes('table')" <div
class='panel panel-default' group-table-item
group='group' ng-if="item.id.includes('table')"
id='item.id' class='panel panel-default'
fields='item.content' group='group'
> id='item.id'
</div> show-serialized='showSerialized'
<div fields='item.content'
group-plot-item >
ng-if="item.id.includes('plot')" </div>
class='panel panel-default' <div
group='group' group-plot-item
id='item.id' ng-if="item.id.includes('plot')"
content='item.content' class='panel panel-default'
> group='group'
</div> id='item.id'
<div show-serialized='showSerialized'
group-text-item content='item.content'
ng-if="item.id.includes('text')" >
class='panel panel-default' </div>
group='group' <div
report-item='item' group-text-item
> ng-if="item.id.includes('text')"
class='panel panel-default'
group='group'
show-serialized='showSerialized'
report-item='item'
>
</div>
</div>
<div
group-view-serialized
ng-if='showSerialized.val'
class='col-md-6'
entity='fields'
>
</div>
</div> </div>
` `
} };
}]); }]);
beat/web/reports/static/reports/app/directives/groupPanelItems.js
+ 4
− 1
View file @ 93f0cf50
...@@ -31,6 +31,9 @@ angular.module('reportApp').directive("groupPanelItems", [function(){ ...@@ -31,6 +31,9 @@ angular.module('reportApp').directive("groupPanelItems", [function(){
group: '=' group: '='
}, },
link: function(scope){ link: function(scope){
scope.sortableOptions = {
handle: '.panel-heading'
};
}, },
template: ` template: `
<div id="{{group.name}}-itemlist-heading" class="panel-heading" role="tab"> <div id="{{group.name}}-itemlist-heading" class="panel-heading" role="tab">
...@@ -57,7 +60,7 @@ angular.module('reportApp').directive("groupPanelItems", [function(){ ...@@ -57,7 +60,7 @@ angular.module('reportApp').directive("groupPanelItems", [function(){
role="tabpanel" role="tabpanel"
aria-labelledby="{{group.name}}-itemlist-heading"> aria-labelledby="{{group.name}}-itemlist-heading">
<div class="panel-body"> <div class="panel-body">
<div ui-sortable ng-model='group._reportItems' class='panel-group'> <div ui-sortable='sortableOptions' ng-model='group._reportItems' class='panel-group'>
<div <div
group-item-container group-item-container
ng-repeat='item in group.reportItems' ng-repeat='item in group.reportItems'
......
beat/web/reports/static/reports/app/directives/groupPlotItem.js
+ 9
− 5
View file @ 93f0cf50
...@@ -31,7 +31,8 @@ angular.module('reportApp') ...@@ -31,7 +31,8 @@ angular.module('reportApp')
scope: { scope: {
group: '=', group: '=',
id: '=', id: '=',
content: '=' content: '=',
showSerialized: '='
}, },
link: function(scope){ link: function(scope){
scope.domId = `${scope.group.name}_${scope.id}`; scope.domId = `${scope.group.name}_${scope.id}`;
...@@ -54,10 +55,13 @@ angular.module('reportApp') ...@@ -54,10 +55,13 @@ angular.module('reportApp')
<button class='btn btn-default' ng-click='hardRefresh()'> <button class='btn btn-default' ng-click='hardRefresh()'>
<span class='glyphicon glyphicon-refresh'></span> <span class='glyphicon glyphicon-refresh'></span>
</button> </button>
<button class='btn btn-danger' ng-click='group.removeReportItem(id)'> <button class='btn btn-default' ng-click='showSerialized.val = !showSerialized.val'>
Delete Plot Toggle Serialize View
</button </button>
</div> </div>
<button class='btn btn-danger' ng-click='group.removeReportItem(id)'>
Delete Plot
</button
</h4> </h4>
</div> </div>
<div id="collapse-{{domId}}" <div id="collapse-{{domId}}"
...@@ -67,5 +71,5 @@ angular.module('reportApp') ...@@ -67,5 +71,5 @@ angular.module('reportApp')
{{ id }} content {{ id }} content
</div> </div>
` `
} };
}]); }]);
beat/web/reports/static/reports/app/directives/groupTableItem.js
+ 6
− 1
View file @ 93f0cf50
...@@ -31,7 +31,8 @@ angular.module('reportApp') ...@@ -31,7 +31,8 @@ angular.module('reportApp')
scope: { scope: {
group: '=', group: '=',
id: '=', id: '=',
fields: '=' fields: '=',
showSerialized: '='
}, },
link: function(scope){ link: function(scope){
// add 'expName' to the beginning of the fields to show in the table // add 'expName' to the beginning of the fields to show in the table
...@@ -113,6 +114,7 @@ angular.module('reportApp') ...@@ -113,6 +114,7 @@ angular.module('reportApp')
scope.domId = `${scope.group.name}_${scope.id}`; scope.domId = `${scope.group.name}_${scope.id}`;
scope.colSelectorId = `${scope.domId}_columnSelector`; scope.colSelectorId = `${scope.domId}_columnSelector`;
}, },
template: ` template: `
<div id="{{domId}}-heading" class="panel-heading" role="tab"> <div id="{{domId}}-heading" class="panel-heading" role="tab">
...@@ -142,6 +144,9 @@ angular.module('reportApp') ...@@ -142,6 +144,9 @@ angular.module('reportApp')
button-text="Save Column Choices" button-text="Save Column Choices"
> >
</div> </div>
<button class='btn btn-default' ng-click='showSerialized.val = !showSerialized.val'>
Toggle Serialize View
</button>
</div> </div>
<button class='btn btn-danger' ng-click='group.removeReportItem(id)'> <button class='btn btn-danger' ng-click='group.removeReportItem(id)'>
Delete Table Delete Table
......
beat/web/reports/static/reports/app/directives/groupTextItem.js
+ 14
− 9
View file @ 93f0cf50
...@@ -30,7 +30,8 @@ angular.module('reportApp') ...@@ -30,7 +30,8 @@ angular.module('reportApp')
return { return {
scope: { scope: {
group: '=', group: '=',
reportItem: '=' reportItem: '=',
showSerialized: '='
}, },
link: function(scope){ link: function(scope){
scope.item = scope.reportItem; scope.item = scope.reportItem;
...@@ -71,6 +72,7 @@ angular.module('reportApp') ...@@ -71,6 +72,7 @@ angular.module('reportApp')
); );
scope.saveContent = () => { scope.saveContent = () => {
console.log(scope.hasUnsavedContent);
let newContent = scope.editor.getContents(); let newContent = scope.editor.getContents();
scope.hasUnsavedContent.val = false; scope.hasUnsavedContent.val = false;
scope.item.content = newContent; scope.item.content = newContent;
...@@ -89,16 +91,19 @@ angular.module('reportApp') ...@@ -89,16 +91,19 @@ angular.module('reportApp')
aria-controls="collapse-{{domId}}"> aria-controls="collapse-{{domId}}">
{{ domId }} {{ domId }}
</a> </a>
<button class='btn btn-success' ng-click='saveContent()'>
Save Content
</button>
<div class="btn-group" role="group" role='tab'> <div class="btn-group" role="group" role='tab'>
<button class='btn btn-danger' ng-click='group.removeReportItem(item.id)'> <button class='btn btn-success' ng-click='saveContent()'>
Delete Text Block Save Content
</button </button>
<button class='btn btn-default' ng-click='showSerialized.val = !showSerialized.val'>
Toggle Serialize View
</button>
</div> </div>
<div ng-if='hasUnsavedContent.val'>
<button class='btn btn-danger' ng-click='group.removeReportItem(item.id)'>
Delete Text Block
</button
<div ng-if='hasUnsavedContent.val === true'>
<strong>Warning:</strong> Press the 'Save Content' button to save changes. <strong>Warning:</strong> Press the 'Save Content' button to save changes.
</div> </div>
</h4> </h4>
......
beat/web/reports/static/reports/app/directives/groupViewSerialized.js 0 → 100644
+ 42
− 0
View file @ 93f0cf50
/*
* Copyright (c) 2016 Idiap Research Institute, http://www.idiap.ch/
* Contact: beat.support@idiap.ch
*
* This file is part of the beat.web module of the BEAT platform.
*
* Commercial License Usage
* Licensees holding valid commercial BEAT licenses may use this file in
* accordance with the terms contained in a written agreement between you
* and Idiap. For further information contact tto@idiap.ch
*
* Alternatively, this file may be used under the terms of the GNU Affero
* Public License version 3 as published by the Free Software and appearing
* in the file LICENSE.AGPL included in the packaging of this file.
* The BEAT platform is distributed in the hope that it will be useful, but
* WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
* or FITNESS FOR A PARTICULAR PURPOSE.
*
* 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/.
*/
/*
* groupViewSerialized
* Desc:
* displays a plot report item
*/
angular.module('reportApp')
.directive("groupViewSerialized", [function(){
return {
scope: {
entity: '='
},
link: function(scope, el){
},
template: `
<div class='well'>
{{ entity }}
</div>
`
};
}]);
beat/web/reports/static/reports/app/directives/groupsLayout.js
+ 4
− 1
View file @ 93f0cf50
...@@ -34,9 +34,12 @@ angular.module('reportApp').directive("groupsLayout", ['GroupsService', function ...@@ -34,9 +34,12 @@ angular.module('reportApp').directive("groupsLayout", ['GroupsService', function
link: function(scope, el, attr){ link: function(scope, el, attr){
scope.groups = GroupsService.groups; scope.groups = GroupsService.groups;
scope.GroupsService = GroupsService; scope.GroupsService = GroupsService;
scope.sortableOptions = {
handle: '> .panel-heading'
};
}, },
template: ` template: `
<div ui-sortable ng-model='GroupsService.groups' id='groupsLayout' class='panel-group'> <div ui-sortable='sortableOptions' ng-model='GroupsService.groups' id='groupsLayout' class='panel-group'>
<div <div
group-panel-content group-panel-content
class='panel panel-default' class='panel panel-default'
......
beat/web/reports/templates/reports/report.html
+ 1
− 0
View file @ 93f0cf50
...@@ -120,6 +120,7 @@ ...@@ -120,6 +120,7 @@
<script src="{% fingerprint "reports/app/directives/groupTextItem.js" %}" type="text/javascript" charset="utf-8"></script> <script src="{% fingerprint "reports/app/directives/groupTextItem.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "reports/app/directives/groupTableFieldSelector.js" %}" type="text/javascript" charset="utf-8"></script> <script src="{% fingerprint "reports/app/directives/groupTableFieldSelector.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "reports/app/directives/groupPanelAliases.js" %}" type="text/javascript" charset="utf-8"></script> <script src="{% fingerprint "reports/app/directives/groupPanelAliases.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "reports/app/directives/groupViewSerialized.js" %}" type="text/javascript" charset="utf-8"></script>
<script src="{% fingerprint "ui/js/smartselector.js" %}" type="text/javascript" charset="utf-8"></script> <script src="{% fingerprint "ui/js/smartselector.js" %}" type="text/javascript" charset="utf-8"></script>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment