From 7e9cd6e09310b337ed1040fae6c301f0e495dab1 Mon Sep 17 00:00:00 2001 From: Muhammet Kara Date: Mon, 30 Mar 2020 14:30:20 +0300 Subject: [PATCH] Welcome: Add Welcome dialog * Whenever a new version of Online is deployed, users will be shown a welcome dialog with latest updates, release notes etc. * Location of the content for the welcome dialog can be set up in loolwsd.xml, and that file will be served to the client by loolwsd (That part handled in a prior patch) * If the welcome dialog is disabled in the config, or the welcome file (at welcome/welcome-$LANG.html by default) does not exist, then we will disable the checks for a week * A command to show the welcome dialog has also been added under the help menu as 'Latest Updates' Change-Id: I490f4ed92920bbcc9308a53014a3fb5a1d477a54 Reviewed-on: https://gerrit.libreoffice.org/c/online/+/92266 Tested-by: Jenkins CollaboraOffice Reviewed-by: Jan Holesovsky --- loleaflet/src/control/Control.Menubar.js | 13 +++- loleaflet/src/control/Toolbar.js | 76 ++++++++++++++++++++++++ loleaflet/src/layer/tile/TileLayer.js | 3 + 3 files changed, 91 insertions(+), 1 deletion(-) diff --git a/loleaflet/src/control/Control.Menubar.js b/loleaflet/src/control/Control.Menubar.js index 8d77a6dc3..1d31eee93 100644 --- a/loleaflet/src/control/Control.Menubar.js +++ b/loleaflet/src/control/Control.Menubar.js @@ -241,6 +241,7 @@ L.Control.Menubar = L.Control.extend({ {name: _('Online Help'), id: 'online-help', type: 'action', iosapp: false}, {name: _('Keyboard shortcuts'), id: 'keyboard-shortcuts', type: 'action', iosapp: false}, {name: _('Report an issue'), id: 'report-an-issue', type: 'action', iosapp: false}, + {name: _('Latest Updates'), id: 'latest-updates', type: 'action'}, {name: _('About'), id: 'about', type: 'action'}] }, {name: _('Last modification'), id: 'last-mod', type: 'action', tablet: false} @@ -342,6 +343,7 @@ L.Control.Menubar = L.Control.extend({ {name: _('Online Help'), id: 'online-help', type: 'action', iosapp: false}, {name: _('Keyboard shortcuts'), id: 'keyboard-shortcuts', type: 'action', iosapp: false}, {name: _('Report an issue'), id: 'report-an-issue', type: 'action', iosapp: false}, + {name: _('Latest Updates'), id: 'latest-updates', type: 'action'}, {name: _('About'), id: 'about', type: 'action'}] }, {name: _('Last modification'), id: 'last-mod', type: 'action', tablet: false} @@ -458,6 +460,7 @@ L.Control.Menubar = L.Control.extend({ {name: _('Online Help'), id: 'online-help', type: 'action', iosapp: false}, {name: _('Keyboard shortcuts'), id: 'keyboard-shortcuts', type: 'action', iosapp: false}, {name: _('Report an issue'), id: 'report-an-issue', type: 'action', iosapp: false}, + {name: _('Latest Updates'), id: 'latest-updates', type: 'action'}, {name: _('About'), id: 'about', type: 'action'}] }, {name: _('Last modification'), id: 'last-mod', type: 'action', tablet: false} @@ -510,6 +513,7 @@ L.Control.Menubar = L.Control.extend({ {name: _UNO('.uno:ShowResolvedAnnotations', 'text'), id: 'showresolved', type: 'action'}, ] }, + {name: _('Latest Updates'), id: 'latest-updates', type: 'action'}, {name: _('About'), id: 'about', type: 'action'}, ], @@ -556,6 +560,7 @@ L.Control.Menubar = L.Control.extend({ {name: _UNO('.uno:FullScreen', 'presentation'), id: 'fullscreen', type: 'action', mobileapp: false}, {uno: '.uno:SpellOnline'}, {name: _('Fullscreen presentation'), id: 'fullscreen-presentation', type: 'action'}, + {name: _('Latest Updates'), id: 'latest-updates', type: 'action'}, {name: _('About'), id: 'about', type: 'action'}, ], @@ -619,6 +624,7 @@ L.Control.Menubar = L.Control.extend({ ]}, {uno: '.uno:SpellOnline'}, {name: _UNO('.uno:FullScreen', 'spreadsheet'), id: 'fullscreen', type: 'action', mobileapp: false}, + {name: _('Latest Updates'), id: 'latest-updates', type: 'action'}, {name: _('About'), id: 'about', type: 'action'}, ], @@ -706,7 +712,7 @@ L.Control.Menubar = L.Control.extend({ 'downloadas-odp', 'downloadas-ppt', 'downloadas-pptx', 'print', // file menu 'downloadas-ods', 'downloadas-xls', 'downloadas-xlsx', 'closedocument', // file menu 'fullscreen', 'zoomin', 'zoomout', 'zoomreset', 'showresolved', // view menu - 'about', 'keyboard-shortcuts', 'online-help', 'report-an-issue' // help menu + 'about', 'keyboard-shortcuts', 'latest-updates', 'online-help', 'report-an-issue' // help menu ] }, @@ -1175,6 +1181,8 @@ L.Control.Menubar = L.Control.extend({ }); } else if (id === 'about') { this._map.showLOAboutDialog(); + } else if (id === 'latest-updates') { + this._map.showWelcomeDialog(); } else if (id === 'report-an-issue') { window.open('https://bugs.documentfoundation.org/enter_bug.cgi?product=LibreOffice%20Online', '_blank'); } else if (id === 'inserthyperlink') { @@ -1297,6 +1305,9 @@ L.Control.Menubar = L.Control.extend({ if (menuItem.id === 'about' && (L.DomUtil.get('about-dialog') === null)) { return false; } + if (menuItem.id === 'latest-updates' && (L.DomUtil.get('about-dialog') === null)) { + return false; + } if (menuItem.id === 'signdocument' && (L.DomUtil.get('document-signing-bar') === null)) { return false; } diff --git a/loleaflet/src/control/Toolbar.js b/loleaflet/src/control/Toolbar.js index d1e4bdafd..7ba6c0a14 100644 --- a/loleaflet/src/control/Toolbar.js +++ b/loleaflet/src/control/Toolbar.js @@ -344,6 +344,82 @@ L.Map.include({ }); }, + showWelcomeDialog: function() { + var w; + var iw = window.innerWidth; + if (iw < 768) { + w = iw - 30; + } + else if (iw > 1920) { + w = 960; + } + else { + w = iw / 5 + 590; + } + var map = this; + var welcomeLocation = 'welcome/welcome-' + String.locale + '.html'; + $.get(welcomeLocation, function(data, textStatus) { + if (textStatus !== 'success') { + // Welcome dialog disabled in loolwsd.xml or nonexistant for some other reason + // Let's check back in a week (60 x 60 x 24 x 7 = 604800 seconds) + var welcomeDisabledCookie = 'loolWelcomeDisabled=true; max-age=604800; SameSite=Strict'; + document.cookie = welcomeDisabledCookie; + return; + } + var WSDVerCookie = 'WSDWelcomeVer=' + map._socket.WSDServer.Version; + // Cookie will not expire for a year, and it will not be sent to other domains + WSDVerCookie += '; max-age=31536000; SameSite=Strict'; + vex.open({ + unsafeContent: data, + showCloseButton: true, + escapeButtonCloses: true, + overlayClosesOnClick: true, + closeAllOnPopState: false, + buttons: {}, + afterOpen: function() { + var $vexContent = $(this.contentEl); + this.contentEl.style.width = w + 'px'; + map.enable(false); + + $vexContent.attr('tabindex', -1); + $vexContent.focus(); + // workaround for https://github.com/HubSpot/vex/issues/43 + $('.vex-overlay').css({ 'pointer-events': 'none'}); + }, + beforeClose: function () { + map.focus(); + map.enable(true); + document.cookie = WSDVerCookie; + } + }); + }); + }, + + getCookie: function(name) { + var cookies = document.cookie.split(';'); + for (var i = 0; i < cookies.length; i++) { + var cookie = cookies[i].trim(); + if (cookie.indexOf(name) === 0) { + return cookie; + } + } + + return ''; + }, + + shouldWelcome: function() { + var currentVerCookie = this.getCookie('WSDWelcomeVer'); + var newVerCookie = 'WSDWelcomeVer=' + this._socket.WSDServer.Version; + var welcomeDisabledCookie = this.getCookie('loolWelcomeDisabled'); + var isWelcomeDisabled = welcomeDisabledCookie === 'loolWelcomeDisabled=true'; + + if (currentVerCookie !== newVerCookie && !isWelcomeDisabled && !L.Browser.cypressTest) { + return true; + } + + return false; + }, + showLOAboutDialog: function() { // Move the div sitting in 'body' as vex-content and make it visible var content = $('#about-dialog').clone().css({display: 'block'}); diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js index 9bd68f421..dab4a0790 100644 --- a/loleaflet/src/layer/tile/TileLayer.js +++ b/loleaflet/src/layer/tile/TileLayer.js @@ -318,6 +318,9 @@ L.TileLayer = L.GridLayer.extend({ if (e.statusType === 'alltilesloaded' && this._docType === 'spreadsheet') { this._onCellCursorShift(true); } + if (e.statusType === 'alltilesloaded' && this._map.shouldWelcome()) { + this._map.showWelcomeDialog(); + } }, this);