Merge pull request #2816 from FinnStutzenstein/Issue2127

Use ckeditor to edit projector messages
This commit is contained in:
Emanuel Schütze 2017-01-06 21:28:48 +01:00 committed by GitHub
commit 11c0b0cc3f
6 changed files with 83 additions and 18 deletions

View File

@ -31,6 +31,7 @@ Core:
- Added template hook system for plugins. - Added template hook system for plugins.
- Made a lot of code clean up, improvements and bug fixes in client and - Made a lot of code clean up, improvements and bug fixes in client and
backend. backend.
- Use CKEditor for editing projector messages.
Motions: Motions:
- Added adjustable line numbering mode (outside, inside, none) for each - Added adjustable line numbering mode (outside, inside, none) for each

View File

@ -778,6 +778,13 @@ angular.module('OpenSlidesApp.core', [
}); });
// if it was the same projector before, just delete it but not show again // if it was the same projector before, just delete it but not show again
if (_.indexOf(isProjectedIds, projectorId) == -1) { if (_.indexOf(isProjectedIds, projectorId) == -1) {
// Now check whether other messages are already projected and delete them
var elements = Projector.get(projectorId).elements;
_.forEach(elements, function (element, uuid) {
if (element.name === name) {
$http.post('/rest/core/projector/' + projectorId + '/deactivate_elements/', [uuid]);
}
});
return $http.post( return $http.post(
'/rest/core/projector/' + projectorId + '/activate_elements/', '/rest/core/projector/' + projectorId + '/activate_elements/',
[{name: name, id: self.id, stable: true}] [{name: name, id: self.id, stable: true}]

View File

@ -381,6 +381,43 @@ angular.module('OpenSlidesApp.core.site', [
} }
]) ])
.factory('ProjectorMessageForm', [
'Editor',
'gettextCatalog',
function (Editor, gettextCatalog) {
return {
getDialog: function (message) {
return {
template: 'static/templates/core/projector-message-form.html',
controller: 'ProjectorMessageEditCtrl',
className: 'ngdialog-theme-default wide-form',
closeByEscape: false,
closeByDocument: false,
resolve: {
projectorMessage: function () {
return message;
}
},
};
},
getFormFields: function () {
return [
{
key: 'message',
type: 'editor',
templateOptions: {
label: gettextCatalog.getString('Message'),
},
data: {
ckeditorOptions: Editor.getOptions()
}
},
];
},
};
}
])
/* This factory handles the filtering of the OS-data-tables. It contains /* This factory handles the filtering of the OS-data-tables. It contains
* all logic needed for the table header filtering. Things to configure: * all logic needed for the table header filtering. Things to configure:
* - multiselectFilters: A dict associating the filter name to a list (empty per default). E.g. * - multiselectFilters: A dict associating the filter name to a list (empty per default). E.g.
@ -992,8 +1029,11 @@ angular.module('OpenSlidesApp.core.site', [
'ProjectorMessage', 'ProjectorMessage',
'Countdown', 'Countdown',
'gettextCatalog', 'gettextCatalog',
'ngDialog',
'ProjectorMessageForm',
function($scope, $http, $interval, $state, $q, Config, Projector, CurrentListOfSpeakersItem, function($scope, $http, $interval, $state, $q, Config, Projector, CurrentListOfSpeakersItem,
ListOfSpeakersOverlay, ProjectionDefault, ProjectorMessage, Countdown, gettextCatalog) { ListOfSpeakersOverlay, ProjectionDefault, ProjectorMessage, Countdown, gettextCatalog,
ngDialog, ProjectorMessageForm) {
ProjectorMessage.bindAll({}, $scope, 'messages'); ProjectorMessage.bindAll({}, $scope, 'messages');
var intervals = []; var intervals = [];
@ -1106,8 +1146,7 @@ angular.module('OpenSlidesApp.core.site', [
// *** message functions *** // *** message functions ***
$scope.editMessage = function (message) { $scope.editMessage = function (message) {
message.editFlag = false; ngDialog.open(ProjectorMessageForm.getDialog(message));
ProjectorMessage.save(message);
}; };
$scope.addMessage = function () { $scope.addMessage = function () {
var message = {message: ''}; var message = {message: ''};
@ -1130,6 +1169,23 @@ angular.module('OpenSlidesApp.core.site', [
} }
]) ])
.controller('ProjectorMessageEditCtrl', [
'$scope',
'projectorMessage',
'ProjectorMessage',
'ProjectorMessageForm',
function ($scope, projectorMessage, ProjectorMessage, ProjectorMessageForm) {
$scope.formFields = ProjectorMessageForm.getFormFields();
$scope.model = angular.copy(projectorMessage);
$scope.save = function (message) {
ProjectorMessage.inject(message);
ProjectorMessage.save(message);
$scope.closeThisDialog();
};
}
])
.controller('ManageProjectorsCtrl', [ .controller('ManageProjectorsCtrl', [
'$scope', '$scope',
'$http', '$http',

View File

@ -61,7 +61,7 @@
</a> </a>
</div> </div>
<div class="btn-group" ng-show="projectors.length > 1"> <div class="btn-group nobr" ng-show="projectors.length > 1">
<button class="btn btn-sm" ng-class="broadcast == active_projector.id ? 'btn-primary' : 'btn-default'" <button class="btn btn-sm" ng-class="broadcast == active_projector.id ? 'btn-primary' : 'btn-default'"
ng-click="active_projector.toggleBroadcast()" ng-disabled="broadcast > 0 && broadcast != active_projector.id"> ng-click="active_projector.toggleBroadcast()" ng-disabled="broadcast > 0 && broadcast != active_projector.id">
<i class="fa" ng-class="broadcast == active_projector.id ? 'fa-star' : 'fa-star-o'"></i> <i class="fa" ng-class="broadcast == active_projector.id ? 'fa-star' : 'fa-star-o'"></i>
@ -240,7 +240,7 @@
<i class="fa fa-times"></i> <i class="fa fa-times"></i>
</button> </button>
<button type="button" class="close editicon" <button type="button" class="close editicon"
ng-click="message.editFlag=true" ng-click="editMessage(message)"
title="{{ 'Edit message' | translate}}"> title="{{ 'Edit message' | translate}}">
<i class="fa fa-pencil"></i> <i class="fa fa-pencil"></i>
</button> </button>
@ -250,18 +250,7 @@
ng-class="{ 'projected': isProjected(message).length }"> ng-class="{ 'projected': isProjected(message).length }">
<projector-button model="message" default-projector-id="messageDefaultProjectorId"></projector-button> <projector-button model="message" default-projector-id="messageDefaultProjectorId"></projector-button>
&nbsp;&nbsp; &nbsp;&nbsp;
<div class="innermessage" ng-bind-html="message.message"> </div> <div class="innermessage" ng-bind-html="message.message | trusted"></div>
<div class="panel-input">
<div ng-if="message.editFlag" class="input-group">
<input ng-model="message.message" type="text" class="form-control input-sm">
<a ng-click="editMessage(message)"
title="{{ 'Save' | translate}}"
class="btn btn-sm btn-primary input-group-addon">
<i class="fa fa-check"></i>
</a>
</div>
</div>
</div> </div>
</div> </div>
<!-- Add message button --> <!-- Add message button -->

View File

@ -0,0 +1,12 @@
<h1 translate>Edit message</h1>
<form name="messageForm" ng-submit="save(model)" novalidate>
<formly-form model="model" fields="formFields">
<button type="submit" ng-disabled="motionForm.$invalid" class="btn btn-primary" translate>
Save
</button>
<button type="button" ng-click="closeThisDialog()" class="btn btn-default" translate>
Cancel
</button>
</formly-form>
</form>

View File

@ -1,4 +1,4 @@
<div ng-controller="SlideMessageCtrl"> <div ng-controller="SlideMessageCtrl">
<div class="message_background"></div> <div class="message_background"></div>
<div class="message well" ng-class="{'identify': element.identify}" ng-bind-html="element.identify ? identifyMessage : message.message"></div> <div class="message well" ng-class="{'identify': element.identify}" ng-bind-html="(element.identify ? identifyMessage : message.message) | trusted"></div>
</div> </div>