From b7eb55f6fa65a7557f860fa25226da3b10cd6c66 Mon Sep 17 00:00:00 2001 From: Hadi Nategh Date: Tue, 23 Aug 2016 12:29:49 +0200 Subject: [PATCH] W.I.P. collab editor: - Make all editors options available - Add viewOptions available for configuration - Disable active avatar by default - Some styling for member's list, member's marker and avatar - Add mobile template for editor --- api/js/webodf/collab/wodocollabtexteditor.js | 2 +- filemanager/js/collab.js | 32 +++++++++++++++++--- filemanager/templates/default/app.css | 24 +++++++++++++++ filemanager/templates/mobile/app.css | 20 ++++++++++++ filemanager/templates/mobile/editor.xet | 32 ++++++++++++++++++++ filemanager/templates/pixelegg/app.css | 20 ++++++++++++ 6 files changed, 124 insertions(+), 6 deletions(-) create mode 100644 filemanager/templates/mobile/editor.xet diff --git a/api/js/webodf/collab/wodocollabtexteditor.js b/api/js/webodf/collab/wodocollabtexteditor.js index e6e195814a..e41eb298a4 100644 --- a/api/js/webodf/collab/wodocollabtexteditor.js +++ b/api/js/webodf/collab/wodocollabtexteditor.js @@ -218,7 +218,7 @@ window.Wodo = window.Wodo || (function () { // create session around loaded document session = new ops.Session(odfCanvas); editorSession = new EditorSession(session, pendingMemberId, { - viewOptions: viewOptions, + viewOptions: jQuery.extend(viewOptions,editorOptions.viewOptions), directTextStylingEnabled: directTextStylingEnabled, directParagraphStylingEnabled: directParagraphStylingEnabled, paragraphStyleSelectingEnabled: paragraphStyleSelectingEnabled, diff --git a/filemanager/js/collab.js b/filemanager/js/collab.js index b0109dbd87..70aaeee6ad 100644 --- a/filemanager/js/collab.js +++ b/filemanager/js/collab.js @@ -115,6 +115,17 @@ app.classes.filemanager = app.classes.filemanager.extend({ /** * Initiate odf collab editor popup & load given file_path as active session + * editors options: + * directParagraphStylingEnabled + * paragraphStyleSelectingEnabled + * paragraphStyleEditingEnabled + * zoomingEnabled + * directTextStylingEnabled + * imageEditingEnabled + * hyperlinkEditingEnabled + * annotationsEnabled + * unstableFeaturesEnabled + * reviewModeEnabled */ _init_odf_collab_editor: function () { @@ -130,10 +141,21 @@ app.classes.filemanager = app.classes.filemanager.extend({ }, sessionId: _data.es_id, editorOptions: { - allFeaturesEnabled: true, - userData: { - fullName: egw.user('account_fullName'), - color: 'blue' + directParagraphStylingEnabled:true, + paragraphStyleSelectingEnabled:true, + paragraphStyleEditingEnabled:true, + zoomingEnabled: true, + directTextStylingEnabled:true, + imageEditingEnabled:true, + hyperlinkEditingEnabled:true, + annotationsEnabled:true, + unstableFeaturesEnabled:true, + // review has to be explicitly disabled to be able to edit the document + reviewModeEnabled:false, + viewOptions:{ + editInfoMarkersInitiallyVisible: true, + caretAvatarsInitiallyVisible: false, + caretBlinksOnRangeSelect: true } } }; @@ -410,7 +432,7 @@ app.classes.filemanager = app.classes.filemanager.extend({ server, serverParams = _args.serverParams, sessionId = _args.sessionId, - editorOptions = jQuery.extend(_args.editorOptions,{networkSecurityToken:'', closeCallback:this.editor_close}), + editorOptions = jQuery.extend(_args.editorOptions,{}), userId = egw.user('account_id'), memberId, self = this; diff --git a/filemanager/templates/default/app.css b/filemanager/templates/default/app.css index 63ea42e929..16f401b45d 100644 --- a/filemanager/templates/default/app.css +++ b/filemanager/templates/default/app.css @@ -146,4 +146,28 @@ table.egwGridView_grid .tile .file_tile { } #filemanager-editor { overflow: hidden; +} + +/* collab editor styling*/ +div.webodfeditor-members { + background-color: white !important; + +} +div.webodfeditor-memberList .webodfeditor-memberListButton { + border: none !important; + background-color: transparent !important; + box-shadow: none !important; + +} +div.webodfeditor-memberList .webodfeditor-memberListButton img { + border-radius: 50%; + box-shadow: none; +} +div.webodfeditor-memberList .webodfeditor-memberListLabel { + color: #1E1E1E; +} + +div.editInfoMarker { + width:5px; + border-radius: none; } \ No newline at end of file diff --git a/filemanager/templates/mobile/app.css b/filemanager/templates/mobile/app.css index 8a3cdf0e3d..67efdc3faa 100644 --- a/filemanager/templates/mobile/app.css +++ b/filemanager/templates/mobile/app.css @@ -189,6 +189,26 @@ input.displayNone { #filemanager-editor { overflow: hidden; } +/* collab editor styling*/ +div.webodfeditor-members { + background-color: white !important; +} +div.webodfeditor-memberList .webodfeditor-memberListButton { + border: none !important; + background-color: transparent !important; + box-shadow: none !important; +} +div.webodfeditor-memberList .webodfeditor-memberListButton img { + border-radius: 50%; + box-shadow: none; +} +div.webodfeditor-memberList .webodfeditor-memberListLabel { + color: #1E1E1E; +} +div.editInfoMarker { + width: 5px; + border-radius: none; +} /*/***************************************************************** // sidebar diff --git a/filemanager/templates/mobile/editor.xet b/filemanager/templates/mobile/editor.xet new file mode 100644 index 0000000000..7b626b956c --- /dev/null +++ b/filemanager/templates/mobile/editor.xet @@ -0,0 +1,32 @@ + + + + + + diff --git a/filemanager/templates/pixelegg/app.css b/filemanager/templates/pixelegg/app.css index cb1202ab81..7a81cef771 100755 --- a/filemanager/templates/pixelegg/app.css +++ b/filemanager/templates/pixelegg/app.css @@ -177,6 +177,26 @@ input.displayNone { #filemanager-editor { overflow: hidden; } +/* collab editor styling*/ +div.webodfeditor-members { + background-color: white !important; +} +div.webodfeditor-memberList .webodfeditor-memberListButton { + border: none !important; + background-color: transparent !important; + box-shadow: none !important; +} +div.webodfeditor-memberList .webodfeditor-memberListButton img { + border-radius: 50%; + box-shadow: none; +} +div.webodfeditor-memberList .webodfeditor-memberListLabel { + color: #1E1E1E; +} +div.editInfoMarker { + width: 5px; + border-radius: none; +} /*/***************************************************************** // sidebar