Swik 1944 warning of simultaneous slide editing

actions/slide/loadSlideEdit.js

@@ -3,6 +3,7 @@ import slideIdTypeError from '../error/slideIdTypeError';
 import { AllowedPattern } from '../error/util/allowedPattern';
 import expandContentPanel from '../deckpagelayout/expandContentPanel';
 import serviceUnavailable from '../error/serviceUnavailable';
+import controlSlideCurrentlyEdited from '../slideCurrentlyEdited/controlSlideCurrentlyEdited';
 const log = require('../log/clog');
 import DeckTreeStore from '../../stores/DeckTreeStore';
 
@@ -21,6 +22,11 @@ export default function loadSlideEdit(context, payload, done) {
             //expand edit view collapsing TreeNode. Then dispatch LOAD_SLIDE_EDIT_SUCCESS
             //revert for SWIK-1347 - Slide Edit view to display decktree (and right-hand panel)
             //context.executeAction(expandContentPanel,{}, () => {
+
+            let payload2 = {
+                sid: payload.params.sid
+            };
+            context.executeAction(controlSlideCurrentlyEdited, payload2, done);
             context.dispatch('LOAD_SLIDE_EDIT_SUCCESS', res);
             //});
 

actions/slideCurrentlyEdited/controlSlideCurrentlyEdited.js

@@ -0,0 +1,59 @@
+import log from '../log/clog';
+import UserProfileStore from '../../stores/UserProfileStore';
+
+export default function controlSlidesCurrentlyEdited(context, payload, done) {
+
+    log.info(context);
+    let user = context.getUser();
+
+    let sid = payload.sid;
+
+    let jwt = payload.jwt = context.getStore(UserProfileStore).jwt;
+
+    context.service.read('slidesCurrentlyEdited.slide', payload, {timeout: 20 * 1000}, (err, res) => {
+        if(err) {
+            // console.log(err);
+        }
+
+        let timestamp = new Date().toString();
+
+        let payload = {
+            timestamp: timestamp,
+            slideCurrentlyEdited: sid,
+            jwt: jwt
+        };
+
+        context.service.create('slidesCurrentlyEdited.slide', payload, {timeout: 20 * 1000}, {}, (err2, res2) => {
+            if (err2) {
+                // console.log(err);
+            }
+            let slideCurrentlyEdited = JSON.parse(res2.slideCurrentlyEdited);
+            let params = {
+                eventId: slideCurrentlyEdited.id
+            };
+            context.dispatch('UPDATE_EVENT_ID', params);
+            done();
+        });
+
+        let params = {
+            slideCurrentlyEditedId: sid,
+            usersCurrentlyEditing: []
+        };
+
+        let username = user.username ? user.username : null;
+
+        // take only different users currently editing the slide.
+        res.slidesCurrentlyEdited = res.slidesCurrentlyEdited.filter((elem) => elem.username !== username);
+        res.slidesCurrentlyEdited.forEach((elem) => {
+            params.usersCurrentlyEditing.push({
+                user: elem.username,
+                timestamp: elem.timestamp
+            });
+        });
+
+        context.dispatch('GET_USERS_EDITING_SLIDE', params);
+
+    });
+
+    done();
+}

actions/slideCurrentlyEdited/forgetUsersEditing.js

@@ -0,0 +1,12 @@
+import log from '../log/clog';
+
+export default function forgetUsersEditing(context, payload, done) {
+
+    log.info(context);
+
+    if (payload !== {}) done();
+
+    context.dispatch('DELETE_USERS_EDITING_LIST');
+    done();
+
+}

actions/slideCurrentlyEdited/removeCurrentlyEditedSlideEvent.js

@@ -0,0 +1,21 @@
+import log from '../log/clog';
+
+export default function removeCurrentlyEditedSlideEvent(context, payload, done) {
+
+    log.info(context);
+
+    if (payload.id === null) done();
+
+    context.service.delete('slidesCurrentlyEdited.deleteEvent', payload, {timeout: 20 * 1000}, (err, res) => {
+        if (err) {
+            // console.log(err);
+        }
+
+        let params = {
+            eventId: ''
+        };
+        context.dispatch('UPDATE_EVENT_ID', params);
+        done();
+    });
+
+}

app.js

@@ -57,6 +57,7 @@ import UserStatsStore from './stores/UserStatsStore';
 import UserGroupsStore from './stores/UserGroupsStore';
 import GroupStatsStore from './stores/GroupStatsStore';
 import DeckStatsStore from './stores/DeckStatsStore';
+import SlideCurrentlyEditedStore from './stores/SlideCurrentlyEditedStore';
 
 
 // create new fluxible instance & register all stores
@@ -118,6 +119,7 @@ const app = new Fluxible({
         UserGroupsStore,
         GroupStatsStore,
         DeckStatsStore,
+        SlideCurrentlyEditedStore
     ]
 });
 

components/Deck/ContentPanel/SlideModes/SlideEditPanel/SlideContentEditor.js

@@ -7,12 +7,14 @@ import DataSourceStore from '../../../../../stores/DataSourceStore';
 import SlideViewStore from '../../../../../stores/SlideViewStore';
 import MediaStore from '../../../../../stores/MediaStore';
 import PaintModalStore from '../../../../../stores/PaintModalStore';
+import SlideCurrentlyEditedStore from '../../../../../stores/SlideCurrentlyEditedStore';
 import saveSlide from '../../../../../actions/slide/saveSlide';
 import saveSlideWithDeckTransition from '../../../../../actions/slide/saveSlideWithDeckTransition';
 import editImageWithSrc from '../../../../../actions/paint/editImageWithSrc';
 import editSVGwithSVG from '../../../../../actions/paint/editSVGwithSVG';
 import handleDroppedFile from '../../../../../actions/media/handleDroppedFile';
 import contentEditorClick from '../../../../../actions/slide/contentEditorClick';
+import removeCurrentlyEditedSlideEvent from '../../../../../actions/slideCurrentlyEdited/removeCurrentlyEditedSlideEvent';
 //import ResizeAware from 'react-resize-aware';
 import {findDOMNode} from 'react-dom';
 import UserProfileStore from '../../../../../stores/UserProfileStore';
@@ -25,6 +27,7 @@ import Util from '../../../../common/Util';
 import {defineMessages} from 'react-intl';
 import changeSlideSizeText from '../../../../../actions/slide/changeSlideSizeText';
 import registerChange from '../../../../../actions/slide/registerChange';
+import SlideCurrentlyEditedWarningModal from './SlideCurrentlyEditedWarningModal';
 
 let ReactDOM = require('react-dom');
 
@@ -895,14 +898,14 @@ class SlideContentEditor extends React.Component {
             //this.removeEditMode();
             $('.pptx2html [style*="absolute"]').find('.cke_widget_drag_handler_container').remove();
             $('.pptx2html [style*="absolute"]').find('.widget').remove();
-                        
+
             let annotations = [];
             if (CKEDITOR.instances.inlineContent != null) {
                 // get the annotations before CKEditor is destroyed
                 CKEDITOR.instances.inlineContent.plugins.semanticannotations.getAnnotationsToStore(CKEDITOR.instances.inlineContent);
                 annotations = CKEDITOR.instances.inlineContent.plugins.semanticannotations.annotationsToStore;
                 annotations = this.convertAnnotationsToDatabaseStructure(annotations);
-                
+
                 CKEDITOR.instances.inlineContent.destroy();
             }
             if (CKEDITOR.instances.inlineSpeakerNotes != null)  {
@@ -955,8 +958,13 @@ class SlideContentEditor extends React.Component {
             console.log('SlideContentEditor.ltiResponseHTML='+ltiResponseHTML);
             */
 
+            // Removing edition event on currently Edited slide.
+            this.context.executeAction(removeCurrentlyEditedSlideEvent, {id: this.props.SlideCurrentlyEditedStore.eventId ?
+                this.props.SlideCurrentlyEditedStore.eventId : null });
+
             //setTimeout(function() {
             //if (transitionType === 'slide') {
+
             this.context.executeAction(saveSlide, {
                 id: currentSelector.sid,
                 deckID: deckID,
@@ -1947,6 +1955,8 @@ class SlideContentEditor extends React.Component {
                     buttonsStyling: false,
                     allowEnterKey: true
                 }).then((accepted) => {
+                    this.context.executeAction(removeCurrentlyEditedSlideEvent, {id: this.props.SlideCurrentlyEditedStore.eventId ?
+                        this.props.SlideCurrentlyEditedStore.eventId : null });
                     const nodeURL = Util.makeNodeURL(nextProps.SlideEditStore.selector, nextProps.SlideEditStore.selector.page, 'view');
                     this.context.executeAction(navigateAction, {
                         url: nodeURL
@@ -1960,6 +1970,8 @@ class SlideContentEditor extends React.Component {
 
             }
             else{
+                this.context.executeAction(removeCurrentlyEditedSlideEvent, {id: this.props.SlideCurrentlyEditedStore.eventId ?
+                    this.props.SlideCurrentlyEditedStore.eventId : null });
                 const nodeURL = Util.makeNodeURL(nextProps.SlideEditStore.selector, nextProps.SlideEditStore.selector.page, 'view');
                 this.context.executeAction(navigateAction, {
                     url: nodeURL
@@ -2159,7 +2171,7 @@ class SlideContentEditor extends React.Component {
         if (nextProps.SlideEditStore.annotateClick === 'true' && nextProps.SlideEditStore.annotateClick !== this.props.SlideEditStore.annotateClick)
         {
             CKEDITOR.instances.inlineContent.execCommand('automaticAnnotation');
-            
+
         }
         if (nextProps.SlideEditStore.mathsClick === 'true' && nextProps.SlideEditStore.mathsClick !== this.props.SlideEditStore.mathsClick)
         {
@@ -2648,6 +2660,10 @@ class SlideContentEditor extends React.Component {
             //console.log('destroy CKEDITOR instance');
             CKEDITOR.instances.inlineSpeakerNotes.destroy();
         }
+
+        // Remove edition event on slideCurrentlyEdited in case that the edition is not cancelled or saved.
+        this.context.executeAction(removeCurrentlyEditedSlideEvent, {id: this.props.SlideCurrentlyEditedStore.eventId ?
+                this.props.SlideCurrentlyEditedStore.eventId : null });
     }
 
     emitChange(context){
@@ -2790,6 +2806,7 @@ class SlideContentEditor extends React.Component {
             <div ref='container' id='container'>
             {(this.loading === 'loading') ? <div className="ui active dimmer"><div className="ui text loader">Loading</div></div> : ''}
             <UploadMediaModal ref="uploadMediaModal" userFullName={this.props.UserProfileStore.user.fname + ' ' + this.props.UserProfileStore.user.lname + ' (username: ' + this.props.UserProfileStore.username + ')'}/>
+            <SlideCurrentlyEditedWarningModal/>
             {/*
                 <button tabIndex="0" ref="submitbutton" className="ui button blue primary " onClick={this.handleSaveButton.bind(this)} onChange={this.handleSaveButton.bind(this)}>
                  <i className="save icon large"></i>
@@ -2860,7 +2877,7 @@ SlideContentEditor.contextTypes = {
     intl: PropTypes.object.isRequired
 };
 
-SlideContentEditor = connectToStores(SlideContentEditor, [SlideEditStore, UserProfileStore, DataSourceStore, SlideViewStore, DeckTreeStore, MediaStore, PaintModalStore], (context, props) => {
+SlideContentEditor = connectToStores(SlideContentEditor, [SlideEditStore, UserProfileStore, DataSourceStore, SlideViewStore, DeckTreeStore, MediaStore, PaintModalStore, SlideCurrentlyEditedStore], (context, props) => {
 
     return {
         SlideEditStore: context.getStore(SlideEditStore).getState(),
@@ -2869,7 +2886,8 @@ SlideContentEditor = connectToStores(SlideContentEditor, [SlideEditStore, UserPr
         DataSourceStore: context.getStore(DataSourceStore).getState(),
         DeckTreeStore: context.getStore(DeckTreeStore).getState(),
         MediaStore: context.getStore(MediaStore).getState(),
-        PaintModalStore: context.getStore(PaintModalStore).getState()
+        PaintModalStore: context.getStore(PaintModalStore).getState(),
+        SlideCurrentlyEditedStore: context.getStore(SlideCurrentlyEditedStore)
     };
 });
 export default SlideContentEditor;