[Kimchi-devel] [PATCH] [Kimchi 1/2] Issue #733: Fix UI to handle relative paths.
pvital at linux.vnet.ibm.com
pvital at linux.vnet.ibm.com
Thu Oct 6 19:11:47 UTC 2016
From: Paulo Vital <pvital at linux.vnet.ibm.com>
Updated necessary SCSS and JS files to handle the usage of relative paths.
Signed-off-by: Paulo Vital <pvital at linux.vnet.ibm.com>
---
ui/css/src/modules/_guests.scss | 14 +++++++-------
ui/css/src/modules/_iso-list.scss | 14 +++++++-------
ui/css/src/modules/_network.scss | 2 +-
ui/css/src/modules/_storage.scss | 18 +++++++++---------
ui/css/src/modules/_templates.scss | 28 ++++++++++++++--------------
ui/js/src/kimchi.api.js | 19 ++++++++++++++++---
6 files changed, 54 insertions(+), 41 deletions(-)
diff --git a/ui/css/src/modules/_guests.scss b/ui/css/src/modules/_guests.scss
index 4947123..8175ddf 100644
--- a/ui/css/src/modules/_guests.scss
+++ b/ui/css/src/modules/_guests.scss
@@ -682,25 +682,25 @@
background-repeat: no-repeat;
background-position: 100% 50%;
&.icon-centos {
- background-image: url('#{$wok-icon-path}/icon-centos.png');
+ background-image: url('../../#{$wok-icon-path}/icon-centos.png');
}
&.icon-debian {
- background-image: url('#{$wok-icon-path}/icon-debian.png');
+ background-image: url('../../#{$wok-icon-path}/icon-debian.png');
}
&.icon-fedora {
- background-image: url('#{$wok-icon-path}/icon-fedora.png');
+ background-image: url('../../#{$wok-icon-path}/icon-fedora.png');
}
&.icon-opensuse {
- background-image: url('#{$wok-icon-path}/icon-opensuse.png');
+ background-image: url('../../#{$wok-icon-path}/icon-opensuse.png');
}
&.icon-ubuntu {
- background-image: url('#{$wok-icon-path}/icon-ubuntu.png');
+ background-image: url('../../#{$wok-icon-path}/icon-ubuntu.png');
}
&.icon-gentoo {
- background-image: url('#{$wok-icon-path}/icon-gentoo.png');
+ background-image: url('../../#{$wok-icon-path}/icon-gentoo.png');
}
&.icon-unknown {
- background-image: url('#{$wok-icon-path}/icon-unknown.png');
+ background-image: url('../../#{$wok-icon-path}/icon-unknown.png');
}
}
}
diff --git a/ui/css/src/modules/_iso-list.scss b/ui/css/src/modules/_iso-list.scss
index 22a5a9c..a2e50a9 100644
--- a/ui/css/src/modules/_iso-list.scss
+++ b/ui/css/src/modules/_iso-list.scss
@@ -122,25 +122,25 @@
text-overflow: ellipsis;
white-space: nowrap;
&.centos {
- background-image: url('#{$wok-icon-path}/icon-centos.png');
+ background-image: url('../../#{$wok-icon-path}/icon-centos.png');
}
&.debian {
- background-image: url('#{$wok-icon-path}/icon-debian.png');
+ background-image: url('../../#{$wok-icon-path}/icon-debian.png');
}
&.fedora {
- background-image: url('#{$wok-icon-path}/icon-fedora.png');
+ background-image: url('../../#{$wok-icon-path}/icon-fedora.png');
}
&.opensuse {
- background-image: url('#{$wok-icon-path}/icon-opensuse.png');
+ background-image: url('../../#{$wok-icon-path}/icon-opensuse.png');
}
&.ubuntu {
- background-image: url('#{$wok-icon-path}/icon-ubuntu.png');
+ background-image: url('../../#{$wok-icon-path}/icon-ubuntu.png');
}
&.gentoo {
- background-image: url('#{$wok-icon-path}/icon-gentoo.png');
+ background-image: url('../../#{$wok-icon-path}/icon-gentoo.png');
}
&.unknown {
- background-image: url('#{$wok-icon-path}/icon-unknown.png');
+ background-image: url('../../#{$wok-icon-path}/icon-unknown.png');
}
}
}
diff --git a/ui/css/src/modules/_network.scss b/ui/css/src/modules/_network.scss
index ab47c89..b030ee4 100644
--- a/ui/css/src/modules/_network.scss
+++ b/ui/css/src/modules/_network.scss
@@ -41,7 +41,7 @@
#network-root-container {
.wok-nw-loading-icon {
- background: transparent url('#{$wok-icon-path}/spin5.svg') no-repeat 50% 50%;
+ background: transparent url('../../#{$wok-icon-path}/spin5.svg') no-repeat 50% 50%;
@include animation(spin 3s infinite linear);
height: 16px;
width: 16px;
diff --git a/ui/css/src/modules/_storage.scss b/ui/css/src/modules/_storage.scss
index cc2244e..2e15cbb 100644
--- a/ui/css/src/modules/_storage.scss
+++ b/ui/css/src/modules/_storage.scss
@@ -46,13 +46,13 @@
display: none;
}
.usage-icon.icon-high {
- background-image: url('#{$wok-icon-path}/high_disabled.png') !important;
+ background-image: url('../../#{$wok-icon-path}/high_disabled.png') !important;
}
.usage-icon.icon-med {
- background-image: url('#{$wok-icon-path}/med_disabled.png') !important;
+ background-image: url('../../#{$wok-icon-path}/med_disabled.png') !important;
}
.usage-icon.icon-low {
- background-image: url('#{$wok-icon-path}/low_disabled.png') !important;
+ background-image: url('../../#{$wok-icon-path}/low_disabled.png') !important;
}
}
}
@@ -118,13 +118,13 @@
}
.volume-icon.icon-high {
- background-image: url('#{$wok-icon-path}/high.png');
+ background-image: url('../../#{$wok-icon-path}/high.png');
}
.volume-icon.icon-med {
- background-image: url('#{$wok-icon-path}/med.png');
+ background-image: url('../../#{$wok-icon-path}/med.png');
}
.volume-icon.icon-low {
- background-image: url('#{$wok-icon-path}/low.png');
+ background-image: url('../../#{$wok-icon-path}/low.png');
}
.volume-progress {
@@ -507,13 +507,13 @@
background-position: 0 50%;
background-color: transparent;
&.icon-high {
- background-image: url('#{$wok-icon-path}/high.png');
+ background-image: url('../../#{$wok-icon-path}/high.png');
}
&.icon-med {
- background-image: url('#{$wok-icon-path}/med.png');
+ background-image: url('../../#{$wok-icon-path}/med.png');
}
&.icon-low {
- background-image: url('#{$wok-icon-path}/low.png');
+ background-image: url('../../#{$wok-icon-path}/low.png');
}
}
}
diff --git a/ui/css/src/modules/_templates.scss b/ui/css/src/modules/_templates.scss
index 55b804a..be7e5bc 100644
--- a/ui/css/src/modules/_templates.scss
+++ b/ui/css/src/modules/_templates.scss
@@ -461,25 +461,25 @@ $kimchi-icon-path: '../images';
background-repeat: no-repeat;
background-position: 8px 50%;
&.icon-centos {
- background-image: url('#{$wok-icon-path}/icon-centos.png');
+ background-image: url('../../#{$wok-icon-path}/icon-centos.png');
}
&.icon-debian {
- background-image: url('#{$wok-icon-path}/icon-debian.png');
+ background-image: url('../../#{$wok-icon-path}/icon-debian.png');
}
&.icon-fedora {
- background-image: url('#{$wok-icon-path}/icon-fedora.png');
+ background-image: url('../../#{$wok-icon-path}/icon-fedora.png');
}
&.icon-opensuse {
- background-image: url('#{$wok-icon-path}/icon-opensuse.png');
+ background-image: url('../../#{$wok-icon-path}/icon-opensuse.png');
}
&.icon-ubuntu {
- background-image: url('#{$wok-icon-path}/icon-ubuntu.png');
+ background-image: url('../../#{$wok-icon-path}/icon-ubuntu.png');
}
&.icon-gentoo {
- background-image: url('#{$wok-icon-path}/icon-gentoo.png');
+ background-image: url('../../#{$wok-icon-path}/icon-gentoo.png');
}
&.icon-unknown {
- background-image: url('#{$wok-icon-path}/icon-unknown.png');
+ background-image: url('../../#{$wok-icon-path}/icon-unknown.png');
}
}
}
@@ -576,25 +576,25 @@ $kimchi-icon-path: '../images';
background-repeat: no-repeat;
background-position: 100% 50%;
&.icon-centos {
- background-image: url('#{$wok-icon-path}/icon-centos.png');
+ background-image: url('../../#{$wok-icon-path}/icon-centos.png');
}
&.icon-debian {
- background-image: url('#{$wok-icon-path}/icon-debian.png');
+ background-image: url('../../#{$wok-icon-path}/icon-debian.png');
}
&.icon-fedora {
- background-image: url('#{$wok-icon-path}/icon-fedora.png');
+ background-image: url('../../#{$wok-icon-path}/icon-fedora.png');
}
&.icon-opensuse {
- background-image: url('#{$wok-icon-path}/icon-opensuse.png');
+ background-image: url('../../#{$wok-icon-path}/icon-opensuse.png');
}
&.icon-ubuntu {
- background-image: url('#{$wok-icon-path}/icon-ubuntu.png');
+ background-image: url('../../#{$wok-icon-path}/icon-ubuntu.png');
}
&.icon-gentoo {
- background-image: url('#{$wok-icon-path}/icon-gentoo.png');
+ background-image: url('../../#{$wok-icon-path}/icon-gentoo.png');
}
&.icon-unknown {
- background-image: url('#{$wok-icon-path}/icon-unknown.png');
+ background-image: url('../../#{$wok-icon-path}/icon-unknown.png');
}
}
}
diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js
index 950ca00..c0a1412 100644
--- a/ui/js/src/kimchi.api.js
+++ b/ui/js/src/kimchi.api.js
@@ -315,15 +315,18 @@ var kimchi = {
}).done(function(data, textStatus, xhr) {
proxy_port = data['websockets_port'];
ssl_port = data['ssl_port'];
+ relative_path = data['relative_path'];
wok.requestJSON({
url : "plugins/kimchi/vms/" + encodeURIComponent(vm) + "/serial",
type : "POST",
dataType : "json"
}).done(function() {
url = 'https://' + location.hostname + ':' + ssl_port;
+ url += relative_path;
url += "/plugins/kimchi/serial/html/serial.html";
url += "?port=" + ssl_port;
- url += "&path=websockify?token=" + wok.urlSafeB64Encode(vm+'-console').replace(/=*$/g, "");
+ url += "&path=" + relative_path + "/websockify";
+ url += "?token=" + wok.urlSafeB64Encode(vm+'-console').replace(/=*$/g, "");
url += '&encrypt=1';
window.open(url);
}).error(function(data) {
@@ -337,14 +340,17 @@ var kimchi = {
vncToVM : function(vm) {
proxy_port = wok.config['websockets_port'];
ssl_port = wok.config['ssl_port'];
+ relative_path = wok.config['relative_path'];
wok.requestJSON({
url : "plugins/kimchi/vms/" + encodeURIComponent(vm) + "/connect",
type : "POST",
dataType : "json"
}).done(function() {
url = 'https://' + location.hostname + ':' + ssl_port;
+ url += relative_path;
url += "/plugins/kimchi/novnc/vnc_auto.html";
url += "?port=" + ssl_port;
+ url += "&path=" + relative_path + "/websockify";
/*
* From python documentation base64.urlsafe_b64encode(s)
* substitutes - instead of + and _ instead of / in the
@@ -352,7 +358,7 @@ var kimchi = {
* contain = which is not safe in a URL query component.
* So remove it when needed as base64 can work well without it.
* */
- url += "&path=websockify?token=" + wok.urlSafeB64Encode(vm).replace(/=*$/g, "");
+ url += "?token=" + wok.urlSafeB64Encode(vm).replace(/=*$/g, "");
url += '&encrypt=1';
window.open(url);
});
@@ -361,14 +367,21 @@ var kimchi = {
spiceToVM : function(vm) {
proxy_port = wok.config['websockets_port'];
ssl_port = wok.config['ssl_port'];
+ relative_path = wok.config['relative_path'];
wok.requestJSON({
url : "plugins/kimchi/vms/" + encodeURIComponent(vm) + "/connect",
type : "POST",
dataType : "json"
}).done(function(data, textStatus, xhr) {
url = 'https://' + location.hostname + ':' + ssl_port;
+ url += relative_path;
url += "/plugins/kimchi/spice_auto.html";
- url += "?port=" + ssl_port + "&listen=" + location.hostname;
+ /*
+ * When using relative_path we need pass the value with port
+ * argument to be used correctly by spice_auto.html scripts
+ */
+ url += "?port=" + ssl_port + relative_path;
+ url += "&listen=" + location.hostname;
/*
* From python documentation base64.urlsafe_b64encode(s)
* substitutes - instead of + and _ instead of / in the
--
2.7.4
More information about the Kimchi-devel
mailing list