diff --git a/beat/web/reports/static/reports/app/directives/groupTextItem.js b/beat/web/reports/static/reports/app/directives/groupTextItem.js index 06647fde57a4b28f6445ef6d50b2e5f5788c2853..a8618117d52d762e2b6d29b67f83462a7c0e1c2a 100644 --- a/beat/web/reports/static/reports/app/directives/groupTextItem.js +++ b/beat/web/reports/static/reports/app/directives/groupTextItem.js @@ -35,17 +35,25 @@ angular.module('reportApp') serializeFuncObj: '=' }, link: function(scope){ + // aliases scope.trustAsHtml = $sce.trustAsHtml; scope.isEditable = GroupsService.isEditable; scope.item = scope.reportItem; scope.domId = `${scope.group.name}_${scope.item.id}`; + // codemirror options scope.uicmOptions = { mode: 'rst', readOnly: !GroupsService.isEditable }; + // readonly codemirror options + scope.srccmOptions = { + mode: 'rst', + readOnly: true + }; + // handle compiling content scope.compiledContent = { val: '' }; scope.serializeFuncObj.val = () => { return scope.compiledContent.val; @@ -57,6 +65,7 @@ angular.module('reportApp') }); }; + // handle edit/save/cancel buttons scope.isEditing = { val: false }; scope.unsavedContent = { val: `${scope.item.content}` }; scope.saveAction = () => { @@ -68,6 +77,11 @@ angular.module('reportApp') scope.unsavedContent.val = `${scope.item.content}`; scope.isEditing.val = false; }; + + // handle toggling between html & rst view + scope.isViewingSrc = { val: false }; + + // compile the content when loaded scope.compileContent(); }, template: ` @@ -87,6 +101,10 @@ angular.module('reportApp') <button ng-disabled='!isEditable' class='btn btn-default' ng-click='compileContent()'> Recompile Content </button> + <!-- dont show split view, just toggle between html/rst view !--> + <button class='btn btn-default' ng-click='isViewingSrc.val = !isViewingSrc.val'> + Toggle View + </button> <!-- dont show split view, just toggle between html/rst view <button ng-disabled='!isEditable' class='btn btn-default' ng-click='showSerialized.val = !showSerialized.val'> Toggle Compiled View @@ -104,7 +122,7 @@ angular.module('reportApp') role="tabpanel" aria-labelledby="{{domId}}-heading"> <div class='panel-body'> - <div class='row'> + <div ng-if='!isViewingSrc.val' class='row'> <div class='col-sm-10'> <div ng-if='!isEditing.val' ng-bind-html='trustAsHtml(compiledContent.val)'></div> <div ng-if='isEditing.val'> @@ -137,6 +155,10 @@ angular.module('reportApp') </div> </div> </div> + <div ng-if='isViewingSrc.val'> + <i>Readonly view</i> + <ui-codemirror ng-model='item.content' ui-codemirror-opts='srccmOptions'></ui-codemirror> + </div> </div> </div> `