Commit 7e68f7a5 authored by Sven Franck's avatar Sven Franck

browser/add: started on browser/pagination gadget

parent 987a942b
...@@ -7,9 +7,9 @@ ...@@ -7,9 +7,9 @@
<body> <body>
<div class="browser_bar"> <div class="browser_bar">
<div data-role="controlgroup" data-type="horizontal"> <div data-role="controlgroup" data-type="horizontal">
<a href="#" data-icon="arrow-l" data-transition="slide" data-direction="reverse" data-role="button" data-iconpos="notext" class="translate" data-i18n="browser.previous">Previous</a> <a href="details.html?item_id=prev" data-icon="arrow-l" data-transition="slide" data-direction="reverse" data-role="button" data-iconpos="notext" class="translate prev" data-i18n="browser.previous">Previous</a>
<a href="products.html" data-role="button" class="translate" data-i18n="browser.back">Back</a> <a href="products.html" data-role="button" class="translate" data-i18n="browser.back">Back</a>
<a href="#" data-icon="arrow-r" data-transition="slide" data-role="button" data-iconpos="notext" class="translate" data-i18n="browser.next">Next</a> <a href="details.html?item_id=next" data-icon="arrow-r" data-transition="slide" data-role="button" data-iconpos="notext" class="translate next" data-i18n="browser.next">Next</a>
</div> </div>
</div> </div>
</body> </body>
......
...@@ -4,10 +4,129 @@ define([ ...@@ -4,10 +4,129 @@ define([
, 'css!browser' , 'css!browser'
], ],
function (App, source) { function (App, source) {
var response = {}; var priv = {};
var that = {};
response.data = source; // get previous and next id
response.callback = function (self) { priv.getPrevNextItem = function (arr, id, next, max) {
var step = next ? 1 : -1, i, id;
for (i = 0; i <= max; i += 1) {
if (i === parseFloat(id)) {
if (next) {
if (arr[i+1] === undefined) {
return false;
}
return arr[i+1].id;
}
if (arr[i-1] === -1) {
return false;
}
return arr[i-1].id;
}
}
};
// reload a page with a new item
priv.displayItem = function (target) {
var url = target.split("?"),
path = url[0],
item = url[1];
$.mobile.changePage(path, {
"allowSamePageTransition": true,
"data": item
});
};
// get allDocs
priv.iterate = function (params) {
var spec,
id = params.gadget.dom.attr('id').split("__").splice(-1)[0],
config = params.gadget.state[0][id]._config,
module = config.datasource.module;
var spec = {};
spec.pointer = config.datasource.pointer;
spec.method = spec.pointer ? undefined : config.datasource.method || "allDocs";
spec.storage = spec.pointer ? undefined : config.datasource.storage || "items";
// no options
spec.callback = function (err, response) {
var currentId = location.href.split("?")[1].split("=")[1],
identifier = App.settings.identifier || "item_id",
next, prev, markup;
// TODO: error handling
if (err) {
} else {
// set next
// TODO: this is bad, because we can only point to doc_id, no matter what
// identifier we are setting. item_id itself is... bad... fix!
next = priv.getPrevNextItem(response.rows, currentId, true, response.total_rows);
if (!next) {
markup = params.source.replace("translate next", "translate next ui-state-disabled");
} else {
markup = params.source.replace(identifier + "=next", identifier + "=" + next);
}
// set previous
prev = priv.getPrevNextItem(response.rows, currentId, false, response.total_rows);
if (!prev) {
markup = params.source.replace("translate prev", "translate prev ui-state-disabled");
} else {
markup = markup.replace(identifier + "=prev", identifier + "=" + prev);
}
}
params.callback_mockup(markup);
};
// query
App[module].switchboard(spec);
};
priv.setBindings = function (param) {
var doc = $(document);
// doc
// .on("pagebeforeshow.browser", param.pageId, function (e) {
// console.log("pbs");
// })
// .on("pagebeforehide", param.pageId, function (e) {
// console.log("pbh");
// doc.off(".browser");
// })
// .on("click.browser", ".browser_bar .prev, .browser_bar .next",
// function (e) {
// var target;
//
// e.preventDefault();
// target = e.target.href;
// // changePage
// priv.displayItem(target);
// });
};
that.data = source;
that.mockup = function (source, callback_mockup) {
var spec = {};
spec.gadget = RenderJs.getSelfGadget();
// TODO: this is for page event bindings. Once JQM content replaces
// page, remove this and make the gadget the content section to
// be updated.
spec.page = App.util.closest(spec.gadget.dom.get(0), "div[data-role='page']");
spec.pageId = "#" + spec.page.id;
spec.source = source;
spec.callback_mockup = callback_mockup;
// bind here, we attach to document
priv.setBindings(spec);
// callback
priv.iterate(spec);
};
that.callback = function (self) {
if (App === undefined) { if (App === undefined) {
def = new $.Deferred; def = new $.Deferred;
...@@ -25,6 +144,6 @@ define([ ...@@ -25,6 +144,6 @@ define([
}; };
// return response object // return response object
return response; return that;
} }
); );
...@@ -31,7 +31,23 @@ ...@@ -31,7 +31,23 @@
<!-- browse items --> <!-- browse items -->
<div id="browser" <div id="browser"
data-gadget="modules/browser/browser.html" data-gadget="modules/browser/browser.html"
data-gadget-module="browser"> data-gadget-module="browser"
data-gadget-property='{
"state": [
{
"browser": {
"_config": {
"datasource": {"module": "storage"}
},
"_links": {
"self": {"href": ""},
"datasource": {"href": "modules/storage/storage.html#queryStorage?method=allDocs"},
"show": {"href": "search.html#queryStorage?method=allDocs"}
}
}
}
]
}'>
</div> </div>
<!-- gallery with zoom --> <!-- gallery with zoom -->
......
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