loleaflet/reference.html | 85 +++++++++++++++++++++++++++++----- loleaflet/src/map/handler/Map.WOPI.js | 13 ++++- 2 files changed, 85 insertions(+), 13 deletions(-)
New commits: commit b36e79f173e128a985270aa58ad25533208f2fc5 Author: Pranav Kant <pran...@collabora.co.uk> Date: Tue Jun 20 18:51:05 2017 +0530 Document custom button API Change-Id: I67b29052ed9f140d82b8f93289fc9704892517c5 diff --git a/loleaflet/reference.html b/loleaflet/reference.html index 6ed7ce6a..dcd0a977 100644 --- a/loleaflet/reference.html +++ b/loleaflet/reference.html @@ -73,6 +73,7 @@ <li><a href="#loleaflet-postmessage-query">Query API</a></li> <li><a href="#loleaflet-postmessage-sessions">Session Management</a></li> <li><a href="#loleaflet-postmessage-actions">Actions</a></li> + <li><a href="#loleaflet-postmessage-misc">Miscellaneous</a></li> </ul> <h4>UI Layers</h4> <ul> @@ -2721,13 +2722,7 @@ The <code>id</code> property of ErrorEvent can have the following values: <p>This API is mostly based on <a href="https://wopi.readthedocs.io/en/latest/scenarios/postmessage.html">WOPI specification</a> with few extensions/modifications. All messages sent are - in this form</p> - -<p>It is to be noted that as mentioned in WOPI specs, loleaflet frame will - ignore all post messages coming from the host frame - if <code>Host_PostmessageReady</code> has not been received. Further, no post - messages will be emitted if 'PostMessageOrigin' property is missing from - server response.</p> + in this form : <pre><code class="javascript"> { @@ -2738,11 +2733,18 @@ The <code>id</code> property of ErrorEvent can have the following values: } } </code></pre> +SendTime is the timestamp returned by browsers' Date.now(). The post messages +sent from the WOPI host should also be in same form. +</p> -SendTime is the timestamp returned by browsers' Date.now() - -<br/><br/> -Similarly, message received should be in same form. +<p>It is to be noted that as mentioned in WOPI specs, loleaflet frame will + ignore all post messages coming from the host frame + if <code>Host_PostmessageReady</code> has not been received. Further, since + for embedding LibreOffice Online as an iframe WOPI implementation is a must, + it is required that 'PostMessageOrigin' property is present in + WOPI host's CheckFileInfo response. Otherwise, no post messages will be + emitted. +<br/> <h3 id="loleaflet-postmessage-initialization">Initialization</h3> Editor to WOPI host @@ -2976,6 +2978,65 @@ Actions response </tr> </table> +<h3 id='loleaflet-postmessage-misc'>Miscellaneous</h3> +WOPI host to editor +<table data-id='postmessage-misc-to-editor'> + <tr> + <th>MessageId</th> + <th>Values</th> + <th>Description</th> + </tr> + <tr> + <td><code><b>Insert_Button</b></code></td> + <td><code> + <nobr>id: <string></nobr><br/> + <nobr>imgurl: <string></nobr> + <nobr>hint: <string></nobr> + <nobr>mobile: <boolean></nobr> + <nobr>label: <string></nobr> + </code></td> + <td> + Inserts the button to the left of the top toolbar. Only thing + that it does is response to click events based on which hosts + can act accordingly. It responds + with <code>Clicked_Button</code> post message event.<br/> + <code>id</code> parameter is a unique id of the toolbar + button. It is recommended to prefix such ids given here with + some host namespace so that it doesn't conflict with existing + toolbar IDs. In case of conflict, button is not added.<br/> + <code>imgurl</code> parameter is the link to the image that + will be set as button image in the toolbar. The ideal size of + the image is 24x24px. The image must be hosted on the host URL + to not violate Content-Security-Policy.<br/> + <code>hint</code> This is used as a tooltip of the + button.<br/> + <code>mobile</code> Whether the button should be shown when + the interface switches to mobile mode.<br/> + <code>label</code> When a readonly document is opened, we + don't have the toolbar at all. In this case, this newly added + button is present in file menubar. The text against this label + is used as text of the menubar item. + </td> + </tr> +</table> +Editor to WOPI host +<table data-id='postmessage-misc-to-host'> + <tr> + <th>MessageId</th> + <th>Values</th> + <th>Description</th> + </tr> + <tr> + <td><code><b>Clicked_Button</b></code></td> + <td><code> + <nobr>id: <string></nobr> + </code></td> + <td> + This event is emitted when the custom button added + via <code>Insert_Button</code> API above is clicked. + </td> + </tr> +</table> <h2 id="marker">Marker</h2> commit 483f600f22305bd5b40e789b206c1e147a7eb6c3 Author: Pranav Kant <pran...@collabora.co.uk> Date: Tue Jun 20 17:14:11 2017 +0530 Its Host_PostmessageReady, not Host_PostMessageReady according to specs https://wopi.readthedocs.io/en/latest/scenarios/postmessage.html Change-Id: Id01b84417dbc8f9226cab05c08e0d566f0305534 diff --git a/loleaflet/reference.html b/loleaflet/reference.html index fa08a3d6..6ed7ce6a 100644 --- a/loleaflet/reference.html +++ b/loleaflet/reference.html @@ -2725,7 +2725,7 @@ The <code>id</code> property of ErrorEvent can have the following values: <p>It is to be noted that as mentioned in WOPI specs, loleaflet frame will ignore all post messages coming from the host frame - if <code>Host_PostMessageReady</code> has not been received. Further, no post + if <code>Host_PostmessageReady</code> has not been received. Further, no post messages will be emitted if 'PostMessageOrigin' property is missing from server response.</p> @@ -2776,7 +2776,7 @@ WOPI host to editor <th>Description</th> </tr> <tr> - <td><code><b>Host_PostMessageReady</b></code></td> + <td><code><b>Host_PostmessageReady</b></code></td> <td><code> </code></td> <td> commit 2abf2421f3e984693b114e8597d2e88fd1430ba8 Author: Pranav Kant <pran...@collabora.co.uk> Date: Tue Jun 20 17:12:43 2017 +0530 Warn users if they try to use post message API incorrectly Change-Id: I09ce1a14587f558765e02fc8197030f4a5d2cee0 diff --git a/loleaflet/src/map/handler/Map.WOPI.js b/loleaflet/src/map/handler/Map.WOPI.js index dd4ddb21..8e96efcc 100644 --- a/loleaflet/src/map/handler/Map.WOPI.js +++ b/loleaflet/src/map/handler/Map.WOPI.js @@ -100,6 +100,17 @@ L.Map.WOPI = L.Handler.extend({ } var msg = JSON.parse(e.data); + if (msg.MessageId === 'Host_PostmessageReady') { + // We already have a listener for this in loleaflet.html, so ignore it here + return; + } + + // For all other messages, warn if trying to interact before we are completely loaded + if (!this._appLoaded) { + console.error('LibreOffice Online not loaded yet. Listen for App_LoadingStatus (Document_Loaded) event before using PostMessage API. Ignoring post message \'' + msg.MessageId + '\'.'); + return; + } + if (msg.MessageId === 'Insert_Button') { if (msg.Values) { if (msg.Values.id && !w2ui['toolbar-up'].get(msg.Values.id) commit 8ca5efb6710c340f5ab53631f7a8edfceaa512c5 Author: Pranav Kant <pran...@collabora.co.uk> Date: Tue Jun 20 16:38:28 2017 +0530 Make this custom button's css consistent with other toolbar images Change-Id: I39158d634eb5fbe0ce54cb4e5f6be3d01982b074 diff --git a/loleaflet/src/map/handler/Map.WOPI.js b/loleaflet/src/map/handler/Map.WOPI.js index 44f4917b..dd4ddb21 100644 --- a/loleaflet/src/map/handler/Map.WOPI.js +++ b/loleaflet/src/map/handler/Map.WOPI.js @@ -106,7 +106,7 @@ L.Map.WOPI = L.Handler.extend({ && msg.Values.imgurl) { if (this._map._permission === 'edit') { // add the css rule for the image - $('html > head > style').append('.w2ui-icon.' + msg.Values.id + '{background: url(' + msg.Values.imgurl + ')}'); + $('html > head > style').append('.w2ui-icon.' + msg.Values.id + '{background: url(' + msg.Values.imgurl + ') no-repeat center !important; }'); // add the item to the toolbar w2ui['toolbar-up'].insert('save', [ _______________________________________________ Libreoffice-commits mailing list libreoffice-comm...@lists.freedesktop.org https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits