Commit f6671d51 authored by Sven Franck's avatar Sven Franck

switch JQM id navigation to data-url, fixes illegal id, allows to fix navigation

parent b4bf91aa
......@@ -43,7 +43,7 @@
<!-- global header -->
<div id="dashboard" data-role="page" data-theme="slapos-white" data-module="dashboard">
<div data-url="dashboard" data-role="page" data-theme="slapos-white">
<div class="ui-content">
<!-- nothing to see here -->
</div>
......
......@@ -427,8 +427,7 @@
.then(function () {
// TODO: should not get elements like this!
gadget_list = document.getElementById(util.getActivePage())
.getElementsByTagName("form");
gadget_list = util.getPage().getElementsByTagName("form");
for (i = 0; i < gadget_list.length; i += 1) {
gadget = gadget_list[i];
......@@ -1406,7 +1405,6 @@
if (page_dict === undefined) {
util.error("Pageindex: Missing page definition");
} else {
// NOTE: 3rd parameter "create" needs to be set to undefined,
// if a page already exists. Setting to true generates a new page
// setting to false tries to update the content section of an
......@@ -1414,7 +1412,7 @@
return app.setContent(
page_dict,
url_dict,
document.getElementById(url_dict.id) ? undefined : true
util.getPage(url_dict.data_url) ? undefined : true
).then(function (response) {
return response;
});
......@@ -1606,9 +1604,8 @@
// TODO: will this find a popup if the page is being generated?
if (pop) {
if (pop === "local") {
active = util.getActivePage();
if (document.getElementById(active)
.querySelectorAll("div.local_popup") === null) {
active = util.getPage();
if (active.querySelectorAll("div.local_popup") === null) {
target.appendChild(factory.popup(undefined, undefined));
}
} else {
......@@ -2095,14 +2092,15 @@
* @param {string} id ID of the gadget to update to
* @param {object} content Content to add
*/
// TODO: bad targeting, should be depending on the gadget being updated!
// TODO: remove altogether, when figuring out how to store state and target!
factory.util.updatePageSection = function (id, content) {
var i, target, container = document.getElementById(id);
// TODO: refactor! remove when figuring out how to store state and target!
factory.util.updatePageSection = function (url, content) {
var i, target, container;
// find a target
container = util.getPage(url) || document.getElementById(url);
target = container.querySelectorAll("[data-update]");
// ui-content
// ui-content
if (target.length === 0) {
target = container.querySelectorAll("div.ui-content");
......@@ -2267,7 +2265,7 @@
} else {
container = document.createDocumentFragment();
config = config_dict.property_dict || {};
id = config_dict.id || ((url_dict.id || "global") + "-popup");
id = config_dict.id || ((url_dict.data_url || "global") + "-popup");
// container
container.appendChild(factory.element(
......@@ -2331,8 +2329,8 @@
container.appendChild(wrap);
// add to DOM if scoped
if (url_dict.id) {
document.getElementById(url_dict.id).appendChild(container);
if (url_dict.data_url) {
util.getPage(url_dict.data_url).appendChild(container);
// and return the placeholder for JQM
return placeholder;
}
......@@ -2377,7 +2375,7 @@
util.error("Generate Header: Missing configuration");
} else {
config = config_dict.property_dict || {};
id = config_dict.id || ((url_dict.id || "global") + "-header");
id = config_dict.id || ((url_dict.data_url || "global") + "-header");
children = config_dict.children.length;
position = children === 2 ? 1 : (children === 0 ? 0 : 1);
state = config_dict.set_state;
......@@ -2457,8 +2455,8 @@
}
// add to DOM if scoped
if (url_dict.id) {
document.getElementById(url_dict.id).appendChild(header);
if (url_dict.data_url) {
util.getPage(url_dict.data_url).appendChild(header);
return undefined;
}
......@@ -2496,7 +2494,7 @@
util.error("Generate Panel: Missing configuration");
} else {
config = config_dict.property_dict || {};
id = config_dict.id || ((url_dict.id || "global") + "-panel");
id = config_dict.id || ((url_dict.data_url || "global") + "-panel");
// panel
panel = factory.element(
......@@ -2557,8 +2555,8 @@
}
// add to DOM if scoped
if (url_dict.id) {
document.getElementById(url_dict.id).appendChild(panel);
if (url_dict.data_url) {
util.getPanel(url_dict.data_url).appendChild(panel);
return undefined;
}
return panel;
......@@ -2594,7 +2592,7 @@
util.error("Generate Footer: Missing config");
} else {
config = config_dict.property_dict || {};
id = config_dict.id || ((url_dict.id || "global") + "-footer");
id = config_dict.id || ((url_dict.data_url || "global") + "-footer");
// footer
footer = factory.element(
......@@ -2637,8 +2635,8 @@
}
// local
if (url_dict.id) {
document.getElementById(url_dict.id).appendChild(footer);
if (url_dict.data_url) {
util.getPage(url_dict.data_url).appendChild(footer);
return undefined;
}
return footer;
......@@ -3494,8 +3492,7 @@
var i, j, last, wrapper, split_url, promises = [], container, target,
view, render, encoded;
container = document.getElementById(url_dict.id);
target = document.createDocumentFragment();
container = util.getPage(url_dict.data_url);
view = (url_dict && url_dict.mode) ? url_dict.mode : "default";
render = content_dict.view_dict[view];
......@@ -3510,8 +3507,9 @@
return RSVP.all(promises)
.then(function (promises) {
// encode the URL so we can also use "/"
encoded = window.encodeURIComponent(url_dict.id);
// encode the URL so we can also use "/" and remove ? params
encoded = window.encodeURIComponent(url_dict.data_url.split("?")[0]);
target = document.createDocumentFragment();
for (j = 0; j < promises.length; j += 1) {
// loading a file with temporary ID
......@@ -3527,12 +3525,10 @@
last = document.body.lastChild;
wrapper = factory.element("div", {"className": "ui-content"}, {});
wrapper.setAttribute("data-bound", true);
split_url = url_dict.url.split("#");
container = factory.element(
"div",
{
"id": encoded,
"className": " ui-page " + ("ui-page-theme-" +
content_dict.theme || "") + " " + ((content_dict.fix &&
content_dict.fix === false) ? "" :
......@@ -3540,9 +3536,7 @@
},
{
"data-role": "page",
// NOTE: cheat JQM, until query-params are possible!
"data-url": split_url[1] ? split_url[1].split("?")[0] :
split_url[0],
"data-url": encoded,
"data-external-page": true,
"tabindex": 0,
"data-enhanced": true
......@@ -3566,12 +3560,13 @@
// trigger new transition to this page
$.mobile.changePage("#" + encoded);
// the page exists already, we just check to update page sections
} else {
factory.util.updatePageSection(encoded, target);
// we also need to changePage in case we are not on the active
// page (this will only happen deeplink > home
if (encoded !== util.getActivePage()) {
if (encoded !== util.getPage().getAttribute("data-url")) {
$.mobile.changePage("#" + encoded);
}
}
......@@ -5537,7 +5532,7 @@
query_clean = default_query.query.replace(/'/g, '"');
query_object = complex_queries.QueryFactory.create(query_clean);
obj.query = '('
obj.query = '(';
// missing portal type?
if (default_query.skip_type === undefined) {
......@@ -5627,7 +5622,6 @@
obj.limit = [];
}
}
return obj;
};
......@@ -5643,12 +5637,10 @@
path = $.mobile.path.parseUrl(url.replace($.mobile.dialogHashKey, ""));
clean_hash = path.hash.replace("#", "");
backup = 0;
config = {
"url": url
};
config = {};
if (clean_hash === "") {
config.id = config.layout_identifier = util.getActivePage();
config.data_url = config.layout_identifier = util.getPage().getAttribute("data-url");
} else {
// NOTE: as the hash will be set as page id by JQM, we cannot pass
// complex structures or query parameters to not produce invalid HTML
......@@ -5674,7 +5666,7 @@
}
config.fragment_list = clean_hash.split("/");
config.id = clean_hash;
config.data_url = clean_hash;
config.layout_level = config.fragment_list.length - 1 - backup;
config.deeplink = true;
config.layout_identifier = clean_hash.split("/")[0];
......@@ -5702,8 +5694,8 @@
element = e.target || e;
pop = element.getAttribute("data-rel") === null;
id = pop ?
(element.getAttribute("data-reference") || util.getActivePage()) :
(element.href === undefined ? util.getActivePage() :
(element.getAttribute("data-reference") || util.getPage().getAttribute("data-url")) :
(element.href === undefined ? util.getPage().getAttribute("data-url") :
element.href.split("#")[1]);
gadget = document.getElementById(id);
break;
......@@ -5733,7 +5725,7 @@
breadcrumb = factory.element(
"span",
{"className": "crumbs"},
{"data-info": "url", "data-reference": url_dict.id}
{"data-info": "url", "data-reference": url_dict.data_url}
),
makeLink = function (path, title, home) {
// test translation dict if the page title is translateable
......@@ -6553,6 +6545,7 @@
query = parcel.query;
skip = query && query.limit && query.limit.length === 0 && storage.skip_total;
// return here, if skipping total query
if (skip) {
return {
......@@ -6682,7 +6675,7 @@
// is in DOM, so no new page created, so no title update...)
// TODO: not bulletproof i18n handling... we expect i18n to be defined
if (typeof data.toPage === "object") {
if ($.mobile.firstPage[0].id === data.toPage[0].id) {
if ($.mobile.firstPage[0].getAttribute("data-url") === data.toPage[0].getAttribute("data-url")) {
app.setPageTitle("global_dict.home");
}
}
......@@ -6698,24 +6691,24 @@
raw_url = window.location.href;
}
if (typeof raw_url === "string" && data && data.options.reverse) {
raw_url = window.decodeURIComponent(raw_url);
}
if (typeof raw_url === "string") {
// decode
if (data && data.options.reverse) {
raw_url = window.decodeURIComponent(raw_url);
}
config = app.generateLinkObject(raw_url);
if (e) {
page = document.getElementById(raw_url.split("#").pop());
page = util.getPage(raw_url.split("#").pop());
base = page ? page.getAttribute("data-external-page") : null;
first = $.mobile.firstPage[0].id === config.id;
first = $.mobile.firstPage[0].getAttribute("data-url") === config.data_url;
if (first || (page && base) || raw_url === $.mobile.getDocumentUrl() ||
data.options.role === "popup") {
// stop us, JQM can go
return;
}
if ((document.getElementById(config.id) && base !== null)) {
if ((util.getPage(config.data_url) && base !== null)) {
e.preventDefault();
// stop us and JQM
return;
......@@ -7074,7 +7067,7 @@
return (page_header && page_header.length) ? page_header[0] :
(document.getElementById("global-header") ||
// WARNING: IE8- children() retrieves comments, too
document.getElementById(util.getActivePage()).children[0]);
util.getPage().children[0]);
};
/**
......@@ -7206,26 +7199,26 @@
/**
* Get the active JQM page in JavaScript-only
* @method getActivePage
* @method getPage
* @param {string} url url of the page to fetch
* @return {string} id of active page
*/
util.getActivePage = function () {
util.getPage = function (url) {
var i, kid, kids = document.body.children;
// reverse, because in JQM last page is the active page!
for (i = kids.length - 1; i >= 0; i -= 1) {
kid = kids[i];
if (kid.tagName === "DIV") {
if (util.testForString("ui-page", kid.className)) {
return kid.id;
if (util.testForString("ui-page", kid.className)) {
if (url === undefined || kid.getAttribute("data-url") === url) {
return kid;
}
}
}
return undefined;
};
/**
* Reverse an array
* @method reverseArray
......@@ -7305,7 +7298,7 @@
/**
* parse to JSON if element is not in JSON
* @parse
* @method parse
* @param {object/string} data Data to parse
* @return {object} object Parsed object
*/
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment