[Libreoffice-commits] online.git: Branch 'distro/collabora/co-4-2-4' - loleaflet/html loleaflet/src
Michael Meeks (via logerrit)
logerrit at kemper.freedesktop.org
Mon Jun 8 20:12:57 UTC 2020
loleaflet/html/loleaflet.html.m4 | 2 +
loleaflet/src/control/Control.JSDialogBuilder.js | 36 ++++++++++----------
loleaflet/src/control/Control.NotebookbarBuilder.js | 2 -
loleaflet/src/core/LOUtil.js | 19 ++++++++++
loleaflet/src/layer/FormFieldButtonLayer.js | 2 -
loleaflet/src/layer/marker/Annotation.js | 2 -
loleaflet/src/layer/tile/TileLayer.js | 2 -
loleaflet/src/map/Map.js | 2 -
8 files changed, 44 insertions(+), 23 deletions(-)
New commits:
commit 8bfa1318b246d7c9df2b1d22d2e8094205a53acd
Author: Michael Meeks <michael.meeks at collabora.com>
AuthorDate: Mon Jun 8 13:28:55 2020 +0100
Commit: Andras Timar <andras.timar at collabora.com>
CommitDate: Mon Jun 8 22:12:39 2020 +0200
Proxy: centralize URL building and use absolute URL for images.
Fixes missing images on mobile.
Change-Id: If5f858cec5fc81ea50c4679162b36eb000f6d872
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/95803
Tested-by: Jenkins
Reviewed-by: Michael Meeks <michael.meeks at collabora.com>
(cherry picked from commit 33ae2bec0fddd3f21ef2278ada0b8ac62252d87d)
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/95821
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Andras Timar <andras.timar at collabora.com>
diff --git a/loleaflet/html/loleaflet.html.m4 b/loleaflet/html/loleaflet.html.m4
index 547c603c5..d3c3e21de 100644
--- a/loleaflet/html/loleaflet.html.m4
+++ b/loleaflet/html/loleaflet.html.m4
@@ -231,6 +231,7 @@ m4_ifelse(MOBILEAPP,[true],
m4_ifelse(MOBILEAPP,[true],
[window.host = '';
window.serviceRoot = '';
+ window.versionPath = '%VERSION%';
window.accessToken = '';
window.accessTokenTTL = '';
window.accessHeader = '';
@@ -246,6 +247,7 @@ m4_ifelse(MOBILEAPP,[true],
window.tileSize = 256;],
[window.host = '%HOST%';
window.serviceRoot = '%SERVICE_ROOT%';
+ window.versionPath = '%VERSION%';
window.accessToken = '%ACCESS_TOKEN%';
window.accessTokenTTL = '%ACCESS_TOKEN_TTL%';
window.accessHeader = '%ACCESS_HEADER%';
diff --git a/loleaflet/src/control/Control.JSDialogBuilder.js b/loleaflet/src/control/Control.JSDialogBuilder.js
index 5498d04dd..71bf67726 100644
--- a/loleaflet/src/control/Control.JSDialogBuilder.js
+++ b/loleaflet/src/control/Control.JSDialogBuilder.js
@@ -53,7 +53,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
var commandName = data.id ? data.id.substring('.uno:'.length) : data.id;
if (commandName && commandName.length && L.LOUtil.existsIconForCommand(commandName, builder.map.getDocType())) {
var image = L.DomUtil.create('img', 'spinfieldimage', div);
- var icon = builder._createIconPath(data.id);
+ var icon = builder._createIconURL(data.id);
image.src = icon;
icon.alt = '';
}
@@ -396,7 +396,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
}
},
- _explorableEntry: function(parentContainer, data, content, builder, valueNode, iconPath, updateCallback) {
+ _explorableEntry: function(parentContainer, data, content, builder, valueNode, iconURL, updateCallback) {
var sectionTitle = L.DomUtil.create('div', 'ui-header level-' + builder._currentDepth + ' ' + builder.options.cssClass + ' ui-widget', parentContainer);
$(sectionTitle).css('justify-content', 'space-between');
if (data && data.id)
@@ -409,10 +409,10 @@ L.Control.JSDialogBuilder = L.Control.extend({
var titleClass = '';
console.debug('sectionTitle.id' + sectionTitle.id);
if (sectionTitle.id === 'paperformat' || sectionTitle.id === 'orientation' || sectionTitle.id === 'masterslide' || sectionTitle.id === 'SdTableDesignPanel')
- iconPath = 'images/lc_'+ sectionTitle.id.toLowerCase() +'.svg';
- if (iconPath) {
+ iconURL = L.LOUtil.getImageURL('lc_'+ sectionTitle.id.toLowerCase() +'.svg');
+ if (iconURL) {
var icon = L.DomUtil.create('img', 'menu-entry-icon', leftDiv);
- icon.src = iconPath;
+ icon.src = iconURL;
icon.alt = '';
titleClass = 'menu-entry-with-icon';
}
@@ -567,9 +567,9 @@ L.Control.JSDialogBuilder = L.Control.extend({
if (commandName && commandName.length && L.LOUtil.existsIconForCommand(commandName, builder.map.getDocType())) {
var iconName = builder._generateMenuIconName(commandName);
var iconSpan = L.DomUtil.create('span', 'menu-entry-icon ' + iconName, sectionTitle);
- var iconPath = 'images/lc_' + iconName + '.svg';
+ var iconURL = L.LOUtil.getImageURL('images/lc_' + iconName + '.svg');
icon = L.DomUtil.create('img', '', iconSpan);
- icon.src = iconPath;
+ icon.src = iconURL;
icon.alt = '';
icon.addEventListener('error', function() {
icon.style.display = 'none';
@@ -627,7 +627,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
if (contentNode) {
var entryId = contentNode.id;
if (entryId && entryId.length) {
- iconPath = builder._createIconPath(entryId);
+ iconPath = builder._createIconURL(entryId);
}
}
@@ -1453,7 +1453,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
var iconPath = null;
if (data.command)
- iconPath = builder._createIconPath(data.command);
+ iconPath = builder._createIconURL(data.command);
builder._explorableEntry(parentContainer, data, contentNode, builder, valueNode, iconPath);
@@ -1475,7 +1475,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
if (image) {
image = image.substr(0, image.lastIndexOf('.'));
image = image.substr(image.lastIndexOf('/') + 1);
- image = 'url("images/' + image + '.svg")';
+ image = 'url("' + L.LOUtil.getImageURL(image + '.svg') + '")';
}
if (image64) {
@@ -1548,7 +1548,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
return false;
},
- _createIconPath: function(name) {
+ _createIconURL: function(name) {
if (!name)
return '';
@@ -1557,7 +1557,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
if (name.substr(0, prefixLength) == '.uno:')
cleanName = name.substr(prefixLength);
cleanName = encodeURIComponent(cleanName).replace(/\%/g, '');
- return 'images/lc_' + cleanName.toLowerCase() + '.svg';
+ return L.LOUtil.getImageURL('lc_' + cleanName.toLowerCase() + '.svg');
},
// make a class identifier from parent's id by walking up the tree
@@ -1589,7 +1589,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
var id = encodeURIComponent(data.command.substr('.uno:'.length)).replace(/\%/g, '');
div.id = id;
- var icon = builder._createIconPath(data.command);
+ var icon = builder._createIconURL(data.command);
var buttonId = id + 'img';
button = L.DomUtil.create('img', 'ui-content unobutton', div);
@@ -1772,7 +1772,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
},
_clearFormattingControl: function(parentContainer, data, builder) {
- var iconPath = builder._createIconPath(data.command);
+ var iconPath = builder._createIconURL(data.command);
var sectionTitle = L.DomUtil.create('div', 'ui-header ' + builder.options.cssClass + ' level-' + builder._currentDepth + ' mobile-wizard-widebutton ui-widget', parentContainer);
sectionTitle.id = 'clearFormatting';
$(sectionTitle).css('justify-content', 'space-between');
@@ -1824,7 +1824,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
var buttonId = 'border-' + i;
button = L.DomUtil.create('img', 'ui-content borderbutton', div);
- button.src = 'images/fr0' + i + '.svg';
+ button.src = L.LOUtil.getImageURL('fr0' + i + '.svg');
button.id = buttonId;
$(div).click(function () {
@@ -1873,7 +1873,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
updateFunction(null);
- var iconPath = builder._createIconPath(data.command);
+ var iconPath = builder._createIconURL(data.command);
var noColorControl = (data.command !== '.uno:FontColor' && data.command !== '.uno:Color');
var callback = function(color) {
@@ -1987,9 +1987,9 @@ L.Control.JSDialogBuilder = L.Control.extend({
if (commandName && commandName.length && L.LOUtil.existsIconForCommand(commandName, builder.map.getDocType())) {
var iconName = builder._generateMenuIconName(commandName);
var iconSpan = L.DomUtil.create('span', 'menu-entry-icon ' + iconName, menuEntry);
- var iconPath = 'images/lc_' + iconName + '.svg';
+ var iconURL = L.LOUtil.getImageURL('lc_' + iconName + '.svg');
icon = L.DomUtil.create('img', '', iconSpan);
- icon.src = iconPath;
+ icon.src = iconURL;
icon.alt = '';
icon.addEventListener('error', function() {
icon.style.display = 'none';
diff --git a/loleaflet/src/control/Control.NotebookbarBuilder.js b/loleaflet/src/control/Control.NotebookbarBuilder.js
index 809af3c35..65edcd7ef 100644
--- a/loleaflet/src/control/Control.NotebookbarBuilder.js
+++ b/loleaflet/src/control/Control.NotebookbarBuilder.js
@@ -218,7 +218,7 @@ L.Control.NotebookbarBuilder = L.Control.JSDialogBuilder.extend({
div.title = data.text;
$(div).tooltip();
- var icon = builder._createIconPath(data.command);
+ var icon = builder._createIconURL(data.command);
var buttonId = id + 'img';
var button = L.DomUtil.create('img', 'ui-content unobutton', div);
diff --git a/loleaflet/src/core/LOUtil.js b/loleaflet/src/core/LOUtil.js
index 4d144cfc0..617d66433 100644
--- a/loleaflet/src/core/LOUtil.js
+++ b/loleaflet/src/core/LOUtil.js
@@ -82,6 +82,25 @@ L.LOUtil = {
return rectangles;
},
+ /// unwind things to get a good absolute URL
+ getURL: function(path) {
+ if (path === '')
+ return '';
+ if (window.host === '' && window.serviceRoot === '')
+ return path; // mobile
+
+ var realHost = window.host.replace(/^ws/i, 'http');
+ var url = realHost + window.serviceRoot + '/loleaflet/' + window.versionPath;
+ if (path.substr(0,1) !== '/')
+ url += '/';
+ url += path;
+ return url;
+ },
+
+ getImageURL: function(imgName) {
+ return this.getURL('images/' + imgName);
+ },
+
/// oldFileName = Example.odt, suffix = new
/// returns: Example_new.odt
generateNewFileName: function(oldFileName, suffix) {
diff --git a/loleaflet/src/layer/FormFieldButtonLayer.js b/loleaflet/src/layer/FormFieldButtonLayer.js
index 9db313c36..2f55988e4 100644
--- a/loleaflet/src/layer/FormFieldButtonLayer.js
+++ b/loleaflet/src/layer/FormFieldButtonLayer.js
@@ -90,7 +90,7 @@ L.FormFieldButton = L.Layer.extend({
button.style.width = container.style.height;
var image = L.DomUtil.create('img', 'form-field-button-image', button);
- image.src = 'images/unfold.svg';
+ image.src = L.LOUtil.getImageURL('unfold.svg');
button.addEventListener('click', this._onClickDropDown);
diff --git a/loleaflet/src/layer/marker/Annotation.js b/loleaflet/src/layer/marker/Annotation.js
index 7029fe35e..4766687a3 100644
--- a/loleaflet/src/layer/marker/Annotation.js
+++ b/loleaflet/src/layer/marker/Annotation.js
@@ -203,7 +203,7 @@ L.Annotation = L.Layer.extend({
var tdImg = L.DomUtil.create(tagTd, 'loleaflet-annotation-img', tr);
var tdAuthor = L.DomUtil.create(tagTd, 'loleaflet-annotation-author', tr);
var imgAuthor = L.DomUtil.create('img', 'avatar-img', tdImg);
- imgAuthor.setAttribute('src', 'images/user.png');
+ imgAuthor.setAttribute('src', L.LOUtil.getImageURL('user.svg'));
imgAuthor.setAttribute('width', this.options.imgSize.x);
imgAuthor.setAttribute('height', this.options.imgSize.y);
this._authorAvatarImg = imgAuthor;
diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js
index ded1b572c..fc54013c1 100644
--- a/loleaflet/src/layer/tile/TileLayer.js
+++ b/loleaflet/src/layer/tile/TileLayer.js
@@ -431,7 +431,7 @@ L.TileLayer = L.GridLayer.extend({
var tdImg = L.DomUtil.create(tagTd, 'loleaflet-annotation-img', tr);
var tdAuthor = L.DomUtil.create(tagTd, 'loleaflet-annotation-author', tr);
var imgAuthor = L.DomUtil.create('img', 'avatar-img', tdImg);
- imgAuthor.setAttribute('src', 'images/user.png');
+ imgAuthor.setAttribute('src', L.LOUtil.getImageURL('user.svg'));
imgAuthor.setAttribute('width', 32);
imgAuthor.setAttribute('height', 32);
this._authorAvatarImg = imgAuthor;
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 670e625c7..67bac9bfd 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -41,7 +41,7 @@ L.Map = L.Evented.extend({
tileHeightTwips: window.tileSize * 15,
urlPrefix: 'lool',
wopiSrc: '',
- cursorURL: 'images/cursors'
+ cursorURL: L.LOUtil.getURL('cursors')
},
// Control.UIManager instance, set in main.js
More information about the Libreoffice-commits
mailing list