571 lines
No EOL
22 KiB
JavaScript
571 lines
No EOL
22 KiB
JavaScript
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
|
|
|
/*@
|
|
Ox.URL <f> URL controller
|
|
(options) -> <o> URL controller
|
|
options <o> Options object
|
|
findKeys <[o]> Find keys
|
|
id <s> Find key id
|
|
type <s> Value type ("string" or "number")
|
|
getItem <f> Tests if a string matches an item
|
|
(string, callback) -> <u> undefined
|
|
string <s> The string to be tested
|
|
callback <f> callback function
|
|
id <s> Matching item id, or empty
|
|
getSpan <f> Tests if a string matches a span
|
|
(item, view, string, callback) -> <u> undefined
|
|
item <s> The item id, or empty
|
|
view <s> The view, or empty
|
|
string <s> The string to be tested
|
|
callback <f> Callback function
|
|
id <s> Matching span id, or empty
|
|
view <s> Matching view, or empty
|
|
pages <[s]> List of pages
|
|
sortKeys <o> Sort keys for list and item views for all types
|
|
typeA <o> Sort keys for this type
|
|
list <o> Sort keys for list views for this type
|
|
viewA <[o]> Sort keys for this view
|
|
id <s> Sort key id
|
|
operator <s> Default sort operator ("+" or "-")
|
|
item <o> Sort keys for item views for this type
|
|
viewA <[o]> Sort keys for this view
|
|
id <s> Sort key id
|
|
operator <s> Default sort operator ("+" or "-")
|
|
spanType <o> Span types for list and item views for all types
|
|
typeA <o> Span types for this type
|
|
list <o> Span types for list views for this type
|
|
viewA <s> Span type for this view
|
|
Can be "date", "duration" or "location"
|
|
item <o> Span types for item views for this type
|
|
viewA <s> Span type for this view
|
|
Can be "date", "duration" or "location"
|
|
types <[s]> List of types
|
|
views <o> List and item views for all types
|
|
typeA <o> Views for type "typeA"
|
|
list <[s]> List views for this type
|
|
item <[s]> Item views for this type
|
|
@*/
|
|
|
|
/*
|
|
|
|
example.com[/page]
|
|
or
|
|
example.com[/type][/item][/view][/span][/sort][/find]
|
|
|
|
page Special page, like "about" or "contact"
|
|
type Section a.k.a. item type, like "movies", "edits", "texts" etc.
|
|
item Item id or title, like in '/movies/0060304', '/movies/inception' or
|
|
'texts/ABC'. Testing this is asynchonous.
|
|
view List or item view, like "clips" or "map". Both list and item views are
|
|
per type.
|
|
span Position or selection in a view, either one or two coordinates or one
|
|
id, like in "video/01:00", "video/-01:00", "video/01:00,-01:00",
|
|
"video/annotationABC", "video/subtitles:23", "text/chapter42",
|
|
"map/0,0", "map/-45,-90,45,90", "map/Barcelona", "image/100,100" etc.
|
|
Testing id is asynchronous.
|
|
sort Sort, like "title" or "-director" or "country,year,-language,+runtime"
|
|
find Query, like a=x or a=x&b=y or a=x&(b=y|c=z). A query object has the form
|
|
{conditions: [], operator: ''} (logical operator), and a condition
|
|
object has the form {key: '', value: '' or ['', ''], operator: ''}
|
|
(comparison operator) or {conditions: [], operator: ''} (logical
|
|
operator). Condition strings can be more than just "k=v", see below.
|
|
|
|
String Key Value Operator
|
|
v * v = any text or string contains or any number is
|
|
!v * v != no text or string contains and no number is
|
|
k=v k v = contains (text or string), is (number)
|
|
k!=v k v != does not contain (text or string), is not (number)
|
|
k==v k v == is (string)
|
|
k!==v k v !== is not (string)
|
|
k=v* k v ^ starts with (string)
|
|
k!=v* k v !^ does not start with (string)
|
|
k=*v k v $ ends with (string)
|
|
k!=*v k v !$ does not end with (string)
|
|
k<v k v < is less than (number)
|
|
k!<v k v !< is not less than (number)
|
|
k>v k v > is more than (number)
|
|
k!>v k v !> is not more than (number)
|
|
k=v:w k [v,w] = is between (number), is (string)
|
|
k!=v:w k [v,w] != is not between (number), is not (string)
|
|
|
|
All parts of the URL can be omitted, as long as the order is preserved.
|
|
|
|
example.com/foo
|
|
If "foo" is not a type, item (of the default type), view (of the default
|
|
type), span id (of the default type's default view) or sort key (of the
|
|
default type's default view), then this means find *=foo
|
|
example.com/title, or example.com/+title or example.com/-title
|
|
If this neither matches a type or default type item, then this will be sort
|
|
example.com/clip/+duration/title=foo
|
|
If "clip" is a default type list view, this will show all clips of items
|
|
that match title=foo, sorted by item duration in ascending order
|
|
example.com/clip/+clip.duration/subtitles=foo
|
|
If "clip" is a default type list view and "subtitles" is an annotation type,
|
|
this will show all clips that match subtitles=foo, sorted by clip duration
|
|
in ascending order. (In pan.do/ra's clip view, annotation=foo is always per
|
|
clip. There is no way to show all clips of all items where any clip matches
|
|
subtitles=foo, this doesn't seem to be needed.)
|
|
example.com/map/@paris/duration/title!=london
|
|
If "map" is a default type list view and "paris" is a place name, this will
|
|
zoom the map to Paris, show all places of items that match title!=london,
|
|
and when a place is selected sort matching clips by item duration in
|
|
default order.
|
|
example.com/calendar/1900,2000/clip:duration/event=hiroshima
|
|
If "calendar" is a default type list view, this will zoom the calendar to
|
|
the 20th century, show all events of all items that match event=hiroshima,
|
|
and when an event is selected sort matching clips by clip duration in
|
|
default order. (In pan.do/ra's map and calendar view, annotation=foo is
|
|
always per item. There is no way to show all events of all clips that match
|
|
event=hiroshima, this doesn't seem to be needed.)
|
|
|
|
example.com/2001/2001 -> example.com/0062622/video/00:33:21
|
|
2001 matches an item title (word match), the second 2001 is a valid duration
|
|
example.com/2002/2002 -> example.com/calendar/2002/2002
|
|
2002 is a valid duration, but no list view supports durations. Then it is
|
|
read as a year, and we get calendar view with find *=2002
|
|
example.com/@paris/paris -> example.com/map/ABC/paris
|
|
paris matches a place name (case-insensitive), so we get map view, zoomed to
|
|
Paris, with find *=paris
|
|
example.com/@renaissance/renaissance -> example.com/calendar/ABC/renaissance
|
|
renaissaince matches an event name (case-insensitive), so we get calendar
|
|
view, zoomed to the Renaissance, with find *=renaissance
|
|
example.com/@foo/foo -> example.com/map/@foo/foo
|
|
foo doesn't match a place or event name, but getSpan() sets the map query to
|
|
foo and returns @foo, so we get map view, zoomed to Foo, with find *=foo
|
|
|
|
*/
|
|
|
|
Ox.URL = function(options) {
|
|
|
|
var self = {}, that = {};
|
|
|
|
self.options = Ox.extend({
|
|
// fixme: find keys are also per type/list|item/view
|
|
// since one can search for layer properties in some item views
|
|
findKeys: [],
|
|
getItem: null,
|
|
getSpan: null,
|
|
pages: [],
|
|
spanType: {},
|
|
sortKeys: {},
|
|
types: [],
|
|
views: {}
|
|
}, options);
|
|
|
|
Ox.print('Ox.URL options', self.options)
|
|
|
|
function constructCondition(condition) {
|
|
var key = condition.key == '*' ? '' : condition.key,
|
|
operator = condition.operator,
|
|
value = (
|
|
Ox.isArray(condition.value) ? condition.value : [condition.value]
|
|
).map(encodeValue).join(':');
|
|
if (!key) {
|
|
operator = operator.replace('=', '');
|
|
} else if (operator.indexOf('^') > -1) {
|
|
operator = operator.replace('^', '=');
|
|
value += '*';
|
|
} else if (operator.indexOf('$') > -1) {
|
|
operator = operator.replace('$', '=');
|
|
value = '*' + value;
|
|
}
|
|
return [key, operator, value].join('');
|
|
}
|
|
|
|
function constructDate(date) {
|
|
return Ox.formatDate(date, '%Y-%m-%d', true);
|
|
}
|
|
|
|
function constructDuration(duration) {
|
|
return Ox.formatDuration(duration, 3).replace(/\.000$/, '');
|
|
}
|
|
|
|
function constructFind(find) {
|
|
return find.conditions.map(function(condition) {
|
|
var ret;
|
|
if (condition.conditions) {
|
|
ret = '(' + constructFind(condition) + ')';
|
|
} else {
|
|
ret = constructCondition(condition);
|
|
}
|
|
return ret;
|
|
}).join(find.operator);
|
|
}
|
|
|
|
function constructLocation(location) {
|
|
return location.join(',');
|
|
}
|
|
|
|
function constructSort(sort, state) {
|
|
return sort.map(function(sort) {
|
|
return (
|
|
sort.operator == Ox.getObjectById(self.options.sortKeys[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
][state.view], sort.key).operator ? '' : sort.operator
|
|
) + sort.key;
|
|
}).join(',')
|
|
}
|
|
|
|
function constructSpan(span, state) {
|
|
var spanType = self.options.spanType[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
][state.view];
|
|
return (Ox.isArray(span) ? span : [span]).map(function(point) {
|
|
return Ox.isNumber(point) ? (
|
|
spanType == 'date' ? constructDate(point)
|
|
: spanType == 'duration' ? constructDuration(point)
|
|
: constructLocation(point)
|
|
) : point;
|
|
}).join(',');
|
|
}
|
|
|
|
function constructURL(state) {
|
|
var parts = [];
|
|
if (state.page) {
|
|
parts.push(state.page);
|
|
} else {
|
|
if (self.options.types.indexOf(state.type) > 0) {
|
|
parts.push(state.type);
|
|
}
|
|
if (state.item) {
|
|
parts.push(state.item);
|
|
}
|
|
if (self.options.views[state.type][
|
|
state.item ? 'item' : 'list'
|
|
].indexOf(state.view) > -1) {
|
|
parts.push(state.view);
|
|
}
|
|
if (state.span) {
|
|
parts.push(constructSpan(state.span, state));
|
|
}
|
|
if (state.sort && state.sort.length) {
|
|
parts.push(constructSort(state.sort, state));
|
|
}
|
|
if (state.find) {
|
|
parts.push(constructFind(state.find));
|
|
}
|
|
}
|
|
return '/' + parts.join('/');
|
|
}
|
|
|
|
function decodeValue(str) {
|
|
return decodeURIComponent(str);
|
|
}
|
|
|
|
function encodeValue(str) {
|
|
var chars = '/&|()=*:';
|
|
ret = '';
|
|
str.split('').forEach(function(char) {
|
|
var index = chars.indexOf(char);
|
|
ret += index > -1
|
|
? '%' + char.charCodeAt(0).toString(16).toUpperCase()
|
|
: char;
|
|
});
|
|
return ret;
|
|
}
|
|
|
|
function isNumericalSpan(str) {
|
|
return str.split(',').every(function(str) {
|
|
return /^[0-9-\.:]+$/.test(str);
|
|
});
|
|
}
|
|
|
|
function getSpanType(str, types) {
|
|
Ox.print('getSpanType', str, types)
|
|
var canBeDate = types.indexOf('date') > -1,
|
|
canBeDuration = types.indexOf('duration') > -1,
|
|
canBeLocation = types.indexOf('location') > -1,
|
|
length = str.split(',').length;
|
|
return canBeDate && /\d-/.test(str) ? 'date'
|
|
: canBeDuration && /:/.test(str) ? 'duration'
|
|
: canBeLocation && length == 4 ? 'location'
|
|
// leaves us with [-]D[.D][,[-]D[.D]]
|
|
: canBeDuration ? 'duration'
|
|
: canBeDate && !/\./.test(str) ? 'date'
|
|
: canBeLocation && length == 2 ? 'location' : ':'
|
|
}
|
|
|
|
function parseCondition(str) {
|
|
var condition = {},
|
|
operators = ['!==', '==', '!=', '=', '!<', '<', '!>', '>'],
|
|
split;
|
|
Ox.forEach(operators, function(operator) {
|
|
if (str.indexOf(operator) > - 1) {
|
|
split = str.split(operator);
|
|
condition = {
|
|
key: split.shift(),
|
|
value: split.join(operator),
|
|
operator: operator
|
|
};
|
|
return false;
|
|
}
|
|
});
|
|
if (
|
|
!condition.operator
|
|
|| Ox.getPositionById(self.options.findKeys, condition.key) == -1
|
|
) {
|
|
// missing operator or unknown key
|
|
condition = {key: '*', value: str, operator: '='};
|
|
}
|
|
if (['=', '!='].indexOf(condition.operator) > -1) {
|
|
if (condition.value[0] == '*') {
|
|
condition.value = condition.value.substr(1);
|
|
condition.operator = condition.operator.replace('=', '$')
|
|
} else if (condition.value[condition.value.length - 1] == '*') {
|
|
condition.value = condition.value.substr(0, condition.value.length - 1);
|
|
condition.operator = condition.operator.replace('=', '^')
|
|
}
|
|
}
|
|
if (condition.value.indexOf(':') > -1) {
|
|
condition.value = condition.value.split(':').map(decodeValue);
|
|
} else {
|
|
condition.value = decodeValue(condition.value);
|
|
}
|
|
return condition;
|
|
}
|
|
|
|
function parseDate(str) {
|
|
return Ox.formatDate(Ox.parseDate(str, true), '%Y-%m-%d');
|
|
}
|
|
|
|
function parseDuration(str) {
|
|
var parts = str.split(':').reverse();
|
|
while (parts.length > 3) {
|
|
parts.pop();
|
|
}
|
|
return parts.reduce(function(prev, curr, i) {
|
|
return prev + (parseFloat(curr) || 0) * Math.pow(60, i);
|
|
}, 0);
|
|
}
|
|
|
|
function parseFind(str) {
|
|
var conditions, counter = 0,
|
|
find = {conditions: [], operator: '&'},
|
|
subconditions = [];
|
|
if (str.length) {
|
|
// replace subconditions with placeholder,
|
|
// so we can later split by main operator
|
|
Ox.forEach(str, function(c, i) {
|
|
if (c == ')') {
|
|
counter--;
|
|
}
|
|
if (counter >= 1) {
|
|
subconditions[subconditions.length - 1] += c;
|
|
}
|
|
if (c == '(') {
|
|
(++counter == 1) && subconditions.push('');
|
|
}
|
|
});
|
|
subconditions.forEach(function(subcondition, i) {
|
|
str = str.replace(subcondition, i);
|
|
});
|
|
find.operator = str.indexOf('|') > -1 ? '|' : '&'
|
|
find.conditions = str.split(find.operator).map(function(condition, i) {
|
|
var ret;
|
|
if (condition[0] == '(') {
|
|
// re-insert subcondition
|
|
ret = parseFind(subconditions[parseInt(Ox.sub(condition, 1, -1))]);
|
|
} else {
|
|
ret = parseCondition(condition);
|
|
}
|
|
return ret;
|
|
});
|
|
}
|
|
return find;
|
|
}
|
|
|
|
function parseLocation(str) {
|
|
return str.split(',').map(function(str, i) {
|
|
return Ox.limit(parseInt(str, 10), -90 * (i + 1), 90 * (i + 1));
|
|
});
|
|
}
|
|
|
|
function parseSort(str, state) {
|
|
return str.split(',').map(function(str) {
|
|
var hasOperator = /^[\+-]/.test(str);
|
|
return {
|
|
key: hasOperator ? str.substr(1) : str,
|
|
operator: hasOperator
|
|
? str[0]
|
|
: Ox.getObjectById(self.options.sortKeys[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
][state.view], str).operator
|
|
};
|
|
});
|
|
}
|
|
|
|
function parseSpan(str, type) {
|
|
var split = str.split(',');
|
|
if (split.length == 4) {
|
|
split = [split[0] + ',' + split[1], split[2] + ',' + split[3]];
|
|
}
|
|
return split.map(
|
|
type == 'date' ? parseDate
|
|
: type == 'duration' ? parseDuration
|
|
: parseLocation
|
|
);
|
|
}
|
|
|
|
function parseURL(str, callback) {
|
|
str = str || document.location.pathname
|
|
+ document.location.search + document.location.hash;
|
|
var parts = str.substr(1).split('/'),
|
|
state = {};
|
|
if (parts.length == 0) {
|
|
state.page = '';
|
|
callback(state);
|
|
} else if (self.options.pages.indexOf(parts[0]) > -1) {
|
|
state.page = parts[0];
|
|
callback(state);
|
|
} else {
|
|
if (self.options.types.indexOf(parts[0]) > -1) {
|
|
// type
|
|
state.type = parts[0];
|
|
parts.shift();
|
|
} else {
|
|
// set to default type
|
|
state.type = self.options.types[0];
|
|
}
|
|
if (parts.length) {
|
|
if (self.options.views[state.type].list.indexOf(parts[0]) > -1) {
|
|
// list view
|
|
state.item = '';
|
|
state.view = parts[0];
|
|
parts.shift();
|
|
parseBeyondItem();
|
|
} else {
|
|
// test for item id or name
|
|
self.options.getItem(parts[0], function(item) {
|
|
state.item = item;
|
|
if (item) {
|
|
parts.shift();
|
|
}
|
|
parseBeyondItem();
|
|
});
|
|
}
|
|
} else {
|
|
callback(state);
|
|
}
|
|
}
|
|
function parseBeyondItem() {
|
|
var span, spanType, spanTypes;
|
|
if (
|
|
parts.length && state.item
|
|
&& self.options.views[state.type].item.indexOf(parts[0]) > -1
|
|
) {
|
|
// item view
|
|
state.view = parts[0];
|
|
parts.shift();
|
|
}
|
|
Ox.print('pBI', state, parts.join('/'));
|
|
if (parts.length) {
|
|
if (isNumericalSpan(parts[0])) {
|
|
// test for numerical span
|
|
spanTypes = self.options.spanType[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
];
|
|
// if no view is given then parse the span anyway,
|
|
// but make sure the span type could match a view
|
|
spanType = state.view
|
|
? spanTypes[state.view]
|
|
: getSpanType(parts[0], Ox.unique(Ox.values(spanTypes)));
|
|
Ox.print('SPAN TYPE', spanType)
|
|
if (spanType) {
|
|
span = parseSpan(parts[0], spanType);
|
|
if (span) {
|
|
if (!state.view) {
|
|
// if no view is given then switch to the first
|
|
// view that supports a span of this type
|
|
Ox.forEach(self.options.views[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
], function(view) {
|
|
if (spanTypes[view] == spanType) {
|
|
state.view = view;
|
|
state.span = span;
|
|
parts.shift();
|
|
return false;
|
|
}
|
|
});
|
|
} else {
|
|
state.span = span;
|
|
parts.shift();
|
|
}
|
|
}
|
|
}
|
|
}
|
|
if (!state.span && /^[A-Z@]/.test(parts[0])) {
|
|
// test for span id or name
|
|
self.options.getSpan(state.item, state.view, parts[0], function(span, view) {
|
|
if (span) {
|
|
if (!state.view) {
|
|
// set list or item view
|
|
state.view = view;
|
|
}
|
|
state.span = span;
|
|
parts.shift();
|
|
}
|
|
parseBeyondSpan();
|
|
});
|
|
} else {
|
|
parseBeyondSpan();
|
|
}
|
|
} else {
|
|
callback(state);
|
|
}
|
|
}
|
|
function parseBeyondSpan() {
|
|
if (!state.view) {
|
|
// set to default list or item view
|
|
state.view = self.options.views[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
][0];
|
|
}
|
|
Ox.print('pBS', state)
|
|
var sortKeyIds = (self.options.sortKeys[state.type][
|
|
!state.item ? 'list' : 'item'
|
|
][state.view] || []).map(function(sortKey) {
|
|
return sortKey.id;
|
|
});
|
|
if (parts.length && parts[0].split(',').every(function(str) {
|
|
return sortKeyIds.indexOf(str.replace(/^[\+-]/, '')) > -1;
|
|
})) {
|
|
// sort
|
|
state.sort = parseSort(parts[0], state);
|
|
parts.shift();
|
|
}
|
|
if (parts.length) {
|
|
// find
|
|
state.find = parseFind(parts.join('/'));
|
|
}
|
|
callback(state);
|
|
}
|
|
}
|
|
|
|
that._construct = function(state) {
|
|
return constructURL(state);
|
|
};
|
|
|
|
that.parse = function(str, callback) {
|
|
parseURL(str, callback);
|
|
}
|
|
|
|
that.pop = function() {
|
|
|
|
};
|
|
|
|
that.push = function(url) {
|
|
|
|
};
|
|
|
|
that.replace = function(url) {
|
|
|
|
};
|
|
|
|
that.update = function(state) {
|
|
// pushes a new URL, constructed from state
|
|
// state can have type, item, view, span, sort, find
|
|
};
|
|
|
|
return that;
|
|
|
|
}; |