Merge pull request #1085 from umap-project/prettierjs
Apply PrettierJS to the whole codebase
This commit is contained in:
commit
db2da8f407
18 changed files with 8789 additions and 7615 deletions
6
.prettierrc.yaml
Normal file
6
.prettierrc.yaml
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
trailingComma: "es5"
|
||||||
|
tabWidth: 2
|
||||||
|
semi: false
|
||||||
|
singleQuote: true
|
||||||
|
printWidth: 88
|
||||||
|
quoteProps: "consistent"
|
6
Makefile
6
Makefile
|
@ -52,3 +52,9 @@ tx_push:
|
||||||
tx push -s
|
tx push -s
|
||||||
tx_pull:
|
tx_pull:
|
||||||
tx pull
|
tx pull
|
||||||
|
|
||||||
|
jsdir = umap/static/umap/js/
|
||||||
|
filepath = "${jsdir}*.js"
|
||||||
|
pretty: ## Apply PrettierJS to all JS files (or specified `filepath`)
|
||||||
|
./node_modules/prettier/bin-prettier.js --write ${filepath}
|
||||||
|
|
||||||
|
|
22
package-lock.json
generated
22
package-lock.json
generated
|
@ -40,6 +40,7 @@
|
||||||
"mocha-phantomjs": "^4.0.1",
|
"mocha-phantomjs": "^4.0.1",
|
||||||
"optimist": "~0.4.0",
|
"optimist": "~0.4.0",
|
||||||
"phantomjs": "^1.9.18",
|
"phantomjs": "^1.9.18",
|
||||||
|
"prettier": "^2.8.8",
|
||||||
"sinon": "^1.10.3",
|
"sinon": "^1.10.3",
|
||||||
"uglify-js": "~3.17.4"
|
"uglify-js": "~3.17.4"
|
||||||
}
|
}
|
||||||
|
@ -1920,6 +1921,21 @@
|
||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/prettier": {
|
||||||
|
"version": "2.8.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
|
||||||
|
"integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
|
||||||
|
"dev": true,
|
||||||
|
"bin": {
|
||||||
|
"prettier": "bin-prettier.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10.13.0"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/prettier/prettier?sponsor=1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/process-nextick-args": {
|
"node_modules/process-nextick-args": {
|
||||||
"version": "1.0.7",
|
"version": "1.0.7",
|
||||||
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
|
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
|
||||||
|
@ -4071,6 +4087,12 @@
|
||||||
"pinkie": "^2.0.0"
|
"pinkie": "^2.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"prettier": {
|
||||||
|
"version": "2.8.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
|
||||||
|
"integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"process-nextick-args": {
|
"process-nextick-args": {
|
||||||
"version": "1.0.7",
|
"version": "1.0.7",
|
||||||
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
|
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
|
||||||
|
|
|
@ -12,6 +12,7 @@
|
||||||
"mocha-phantomjs": "^4.0.1",
|
"mocha-phantomjs": "^4.0.1",
|
||||||
"optimist": "~0.4.0",
|
"optimist": "~0.4.0",
|
||||||
"phantomjs": "^1.9.18",
|
"phantomjs": "^1.9.18",
|
||||||
|
"prettier": "^2.8.8",
|
||||||
"sinon": "^1.10.3",
|
"sinon": "^1.10.3",
|
||||||
"uglify-js": "~3.17.4"
|
"uglify-js": "~3.17.4"
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,108 +1,112 @@
|
||||||
L.U.AutoComplete = L.Class.extend({
|
L.U.AutoComplete = L.Class.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
placeholder: 'Start typing...',
|
placeholder: 'Start typing...',
|
||||||
emptyMessage: 'No result',
|
emptyMessage: 'No result',
|
||||||
allowFree: true,
|
allowFree: true,
|
||||||
minChar: 2,
|
minChar: 2,
|
||||||
maxResults: 5
|
maxResults: 5,
|
||||||
},
|
},
|
||||||
|
|
||||||
CACHE: '',
|
CACHE: '',
|
||||||
RESULTS: [],
|
RESULTS: [],
|
||||||
|
|
||||||
initialize: function (el, options) {
|
initialize: function (el, options) {
|
||||||
this.el = el;
|
this.el = el
|
||||||
var ui = new L.U.UI(document.querySelector('header'));
|
var ui = new L.U.UI(document.querySelector('header'))
|
||||||
this.xhr = new L.U.Xhr(ui);
|
this.xhr = new L.U.Xhr(ui)
|
||||||
L.setOptions(this, options);
|
L.setOptions(this, options)
|
||||||
var CURRENT = null;
|
var CURRENT = null
|
||||||
try {
|
try {
|
||||||
Object.defineProperty(this, 'CURRENT', {
|
Object.defineProperty(this, 'CURRENT', {
|
||||||
get: function () {
|
get: function () {
|
||||||
return CURRENT;
|
return CURRENT
|
||||||
},
|
},
|
||||||
set: function (index) {
|
set: function (index) {
|
||||||
if (typeof index === 'object') {
|
if (typeof index === 'object') {
|
||||||
index = this.resultToIndex(index);
|
index = this.resultToIndex(index)
|
||||||
}
|
}
|
||||||
CURRENT = index;
|
CURRENT = index
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// Hello IE8
|
// Hello IE8
|
||||||
}
|
}
|
||||||
return this;
|
return this
|
||||||
},
|
},
|
||||||
|
|
||||||
createInput: function () {
|
createInput: function () {
|
||||||
this.input = L.DomUtil.element('input', {
|
this.input = L.DomUtil.element(
|
||||||
|
'input',
|
||||||
|
{
|
||||||
type: 'text',
|
type: 'text',
|
||||||
placeholder: this.options.placeholder,
|
placeholder: this.options.placeholder,
|
||||||
autocomplete: 'off',
|
autocomplete: 'off',
|
||||||
className: this.options.className
|
className: this.options.className,
|
||||||
}, this.el);
|
},
|
||||||
L.DomEvent.on(this.input, 'keydown', this.onKeyDown, this);
|
this.el
|
||||||
L.DomEvent.on(this.input, 'keyup', this.onKeyUp, this);
|
)
|
||||||
L.DomEvent.on(this.input, 'blur', this.onBlur, this);
|
L.DomEvent.on(this.input, 'keydown', this.onKeyDown, this)
|
||||||
|
L.DomEvent.on(this.input, 'keyup', this.onKeyUp, this)
|
||||||
|
L.DomEvent.on(this.input, 'blur', this.onBlur, this)
|
||||||
},
|
},
|
||||||
|
|
||||||
createContainer: function () {
|
createContainer: function () {
|
||||||
this.container = L.DomUtil.element('ul', {className: 'umap-autocomplete'}, document.body);
|
this.container = L.DomUtil.element(
|
||||||
|
'ul',
|
||||||
|
{ className: 'umap-autocomplete' },
|
||||||
|
document.body
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
resizeContainer: function()
|
resizeContainer: function () {
|
||||||
{
|
var l = this.getLeft(this.input)
|
||||||
var l = this.getLeft(this.input);
|
var t = this.getTop(this.input) + this.input.offsetHeight
|
||||||
var t = this.getTop(this.input) + this.input.offsetHeight;
|
this.container.style.left = l + 'px'
|
||||||
this.container.style.left = l + 'px';
|
this.container.style.top = t + 'px'
|
||||||
this.container.style.top = t + 'px';
|
var width = this.options.width ? this.options.width : this.input.offsetWidth - 2
|
||||||
var width = this.options.width ? this.options.width : this.input.offsetWidth - 2;
|
this.container.style.width = width + 'px'
|
||||||
this.container.style.width = width + 'px';
|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
onKeyDown: function (e) {
|
onKeyDown: function (e) {
|
||||||
switch (e.keyCode) {
|
switch (e.keyCode) {
|
||||||
case L.U.Keys.TAB:
|
case L.U.Keys.TAB:
|
||||||
if(this.CURRENT !== null) this.setChoice();
|
if (this.CURRENT !== null) this.setChoice()
|
||||||
L.DomEvent.stop(e);
|
L.DomEvent.stop(e)
|
||||||
break;
|
break
|
||||||
case L.U.Keys.ENTER:
|
case L.U.Keys.ENTER:
|
||||||
L.DomEvent.stop(e);
|
L.DomEvent.stop(e)
|
||||||
this.setChoice();
|
this.setChoice()
|
||||||
break;
|
break
|
||||||
case L.U.Keys.ESC:
|
case L.U.Keys.ESC:
|
||||||
L.DomEvent.stop(e);
|
L.DomEvent.stop(e)
|
||||||
this.hide();
|
this.hide()
|
||||||
break;
|
break
|
||||||
case L.U.Keys.DOWN:
|
case L.U.Keys.DOWN:
|
||||||
if (this.RESULTS.length > 0) {
|
if (this.RESULTS.length > 0) {
|
||||||
if(this.CURRENT !== null && this.CURRENT < this.RESULTS.length - 1) { // what if one result?
|
if (this.CURRENT !== null && this.CURRENT < this.RESULTS.length - 1) {
|
||||||
this.CURRENT++;
|
// what if one result?
|
||||||
this.highlight();
|
this.CURRENT++
|
||||||
}
|
this.highlight()
|
||||||
else if(this.CURRENT === null) {
|
} else if (this.CURRENT === null) {
|
||||||
this.CURRENT = 0;
|
this.CURRENT = 0
|
||||||
this.highlight();
|
this.highlight()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
break;
|
break
|
||||||
case L.U.Keys.UP:
|
case L.U.Keys.UP:
|
||||||
if (this.CURRENT !== null) {
|
if (this.CURRENT !== null) {
|
||||||
L.DomEvent.stop(e);
|
L.DomEvent.stop(e)
|
||||||
}
|
}
|
||||||
if (this.RESULTS.length > 0) {
|
if (this.RESULTS.length > 0) {
|
||||||
if (this.CURRENT > 0) {
|
if (this.CURRENT > 0) {
|
||||||
this.CURRENT--;
|
this.CURRENT--
|
||||||
this.highlight();
|
this.highlight()
|
||||||
}
|
} else if (this.CURRENT === 0) {
|
||||||
else if(this.CURRENT === 0) {
|
this.CURRENT = null
|
||||||
this.CURRENT = null;
|
this.highlight()
|
||||||
this.highlight();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
break;
|
break
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -117,198 +121,221 @@ L.U.AutoComplete = L.Class.extend({
|
||||||
L.U.Keys.APPLE,
|
L.U.Keys.APPLE,
|
||||||
L.U.Keys.SHIFT,
|
L.U.Keys.SHIFT,
|
||||||
L.U.Keys.ALT,
|
L.U.Keys.ALT,
|
||||||
L.U.Keys.CTRL
|
L.U.Keys.CTRL,
|
||||||
];
|
]
|
||||||
if (special.indexOf(e.keyCode) === -1)
|
if (special.indexOf(e.keyCode) === -1) {
|
||||||
{
|
this.search()
|
||||||
this.search();
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
onBlur: function () {
|
onBlur: function () {
|
||||||
var self = this;
|
var self = this
|
||||||
setTimeout(function () {
|
setTimeout(function () {
|
||||||
self.hide();
|
self.hide()
|
||||||
}, 100);
|
}, 100)
|
||||||
},
|
},
|
||||||
|
|
||||||
clear: function () {
|
clear: function () {
|
||||||
this.RESULTS = [];
|
this.RESULTS = []
|
||||||
this.CURRENT = null;
|
this.CURRENT = null
|
||||||
this.CACHE = '';
|
this.CACHE = ''
|
||||||
this.container.innerHTML = '';
|
this.container.innerHTML = ''
|
||||||
},
|
},
|
||||||
|
|
||||||
hide: function () {
|
hide: function () {
|
||||||
this.clear();
|
this.clear()
|
||||||
this.container.style.display = 'none';
|
this.container.style.display = 'none'
|
||||||
this.input.value = '';
|
this.input.value = ''
|
||||||
},
|
},
|
||||||
|
|
||||||
setChoice: function (choice) {
|
setChoice: function (choice) {
|
||||||
choice = choice || this.RESULTS[this.CURRENT];
|
choice = choice || this.RESULTS[this.CURRENT]
|
||||||
if (choice) {
|
if (choice) {
|
||||||
this.input.value = choice.item.label;
|
this.input.value = choice.item.label
|
||||||
this.options.on_select(choice);
|
this.options.on_select(choice)
|
||||||
this.displaySelected(choice);
|
this.displaySelected(choice)
|
||||||
this.hide();
|
this.hide()
|
||||||
if (this.options.callback) {
|
if (this.options.callback) {
|
||||||
L.Util.bind(this.options.callback, this)(choice);
|
L.Util.bind(this.options.callback, this)(choice)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
search: function () {
|
search: function () {
|
||||||
var val = this.input.value;
|
var val = this.input.value
|
||||||
if (val.length < this.options.minChar) {
|
if (val.length < this.options.minChar) {
|
||||||
this.clear();
|
this.clear()
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
if( val + '' === this.CACHE + '') return;
|
if (val + '' === this.CACHE + '') return
|
||||||
else this.CACHE = val;
|
else this.CACHE = val
|
||||||
this._do_search(val, function (data) {
|
this._do_search(
|
||||||
this.handleResults(data.data);
|
val,
|
||||||
}, this);
|
function (data) {
|
||||||
|
this.handleResults(data.data)
|
||||||
|
},
|
||||||
|
this
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
createResult: function (item) {
|
createResult: function (item) {
|
||||||
var el = L.DomUtil.element('li', {}, this.container);
|
var el = L.DomUtil.element('li', {}, this.container)
|
||||||
el.textContent = item.label;
|
el.textContent = item.label
|
||||||
var result = {
|
var result = {
|
||||||
item: item,
|
item: item,
|
||||||
el: el
|
el: el,
|
||||||
};
|
}
|
||||||
L.DomEvent.on(el, 'mouseover', function () {
|
L.DomEvent.on(
|
||||||
this.CURRENT = result;
|
el,
|
||||||
this.highlight();
|
'mouseover',
|
||||||
}, this);
|
function () {
|
||||||
L.DomEvent.on(el, 'mousedown', function () {
|
this.CURRENT = result
|
||||||
this.setChoice();
|
this.highlight()
|
||||||
}, this);
|
},
|
||||||
return result;
|
this
|
||||||
|
)
|
||||||
|
L.DomEvent.on(
|
||||||
|
el,
|
||||||
|
'mousedown',
|
||||||
|
function () {
|
||||||
|
this.setChoice()
|
||||||
|
},
|
||||||
|
this
|
||||||
|
)
|
||||||
|
return result
|
||||||
},
|
},
|
||||||
|
|
||||||
resultToIndex: function (result) {
|
resultToIndex: function (result) {
|
||||||
var out = null;
|
var out = null
|
||||||
this.forEach(this.RESULTS, function (item, index) {
|
this.forEach(this.RESULTS, function (item, index) {
|
||||||
if (item.item.value == result.item.value) {
|
if (item.item.value == result.item.value) {
|
||||||
out = index;
|
out = index
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
return out;
|
return out
|
||||||
},
|
},
|
||||||
|
|
||||||
handleResults: function (data) {
|
handleResults: function (data) {
|
||||||
var self = this;
|
var self = this
|
||||||
this.clear();
|
this.clear()
|
||||||
this.container.style.display = 'block';
|
this.container.style.display = 'block'
|
||||||
this.resizeContainer();
|
this.resizeContainer()
|
||||||
this.forEach(data, function (item) {
|
this.forEach(data, function (item) {
|
||||||
self.RESULTS.push(self.createResult(item));
|
self.RESULTS.push(self.createResult(item))
|
||||||
});
|
})
|
||||||
this.CURRENT = 0;
|
this.CURRENT = 0
|
||||||
this.highlight();
|
this.highlight()
|
||||||
//TODO manage no results
|
//TODO manage no results
|
||||||
},
|
},
|
||||||
|
|
||||||
highlight: function () {
|
highlight: function () {
|
||||||
var self = this;
|
var self = this
|
||||||
this.forEach(this.RESULTS, function (result, index) {
|
this.forEach(this.RESULTS, function (result, index) {
|
||||||
if (index === self.CURRENT) L.DomUtil.addClass(result.el, 'on');
|
if (index === self.CURRENT) L.DomUtil.addClass(result.el, 'on')
|
||||||
else L.DomUtil.removeClass(result.el, 'on');
|
else L.DomUtil.removeClass(result.el, 'on')
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
getLeft: function (el) {
|
getLeft: function (el) {
|
||||||
var tmp = el.offsetLeft;
|
var tmp = el.offsetLeft
|
||||||
el = el.offsetParent;
|
el = el.offsetParent
|
||||||
while (el) {
|
while (el) {
|
||||||
tmp += el.offsetLeft;
|
tmp += el.offsetLeft
|
||||||
el = el.offsetParent;
|
el = el.offsetParent
|
||||||
}
|
}
|
||||||
return tmp;
|
return tmp
|
||||||
},
|
},
|
||||||
|
|
||||||
getTop: function (el) {
|
getTop: function (el) {
|
||||||
var tmp = el.offsetTop;
|
var tmp = el.offsetTop
|
||||||
el = el.offsetParent;
|
el = el.offsetParent
|
||||||
while (el) {
|
while (el) {
|
||||||
tmp += el.offsetTop;
|
tmp += el.offsetTop
|
||||||
el = el.offsetParent;
|
el = el.offsetParent
|
||||||
}
|
}
|
||||||
return tmp;
|
return tmp
|
||||||
},
|
},
|
||||||
|
|
||||||
forEach: function (els, callback) {
|
forEach: function (els, callback) {
|
||||||
Array.prototype.forEach.call(els, callback);
|
Array.prototype.forEach.call(els, callback)
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
L.U.AutoComplete.Ajax = L.U.AutoComplete.extend({
|
L.U.AutoComplete.Ajax = L.U.AutoComplete.extend({
|
||||||
|
|
||||||
initialize: function (el, options) {
|
initialize: function (el, options) {
|
||||||
L.U.AutoComplete.prototype.initialize.call(this, el, options);
|
L.U.AutoComplete.prototype.initialize.call(this, el, options)
|
||||||
if (!this.el) return this;
|
if (!this.el) return this
|
||||||
this.createInput();
|
this.createInput()
|
||||||
this.createContainer();
|
this.createContainer()
|
||||||
this.selected_container = this.initSelectedContainer();
|
this.selected_container = this.initSelectedContainer()
|
||||||
},
|
},
|
||||||
|
|
||||||
optionToResult: function (option) {
|
optionToResult: function (option) {
|
||||||
return {
|
return {
|
||||||
value: option.value,
|
value: option.value,
|
||||||
label: option.innerHTML
|
label: option.innerHTML,
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
_do_search: function (val, callback, context) {
|
_do_search: function (val, callback, context) {
|
||||||
val = val.toLowerCase();
|
val = val.toLowerCase()
|
||||||
this.xhr.get('/agnocomplete/AutocompleteUser/?q=' + encodeURIComponent(val), {callback: callback, context: context || this});
|
this.xhr.get('/agnocomplete/AutocompleteUser/?q=' + encodeURIComponent(val), {
|
||||||
}
|
callback: callback,
|
||||||
|
context: context || this,
|
||||||
});
|
})
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
L.U.AutoComplete.Ajax.SelectMultiple = L.U.AutoComplete.Ajax.extend({
|
L.U.AutoComplete.Ajax.SelectMultiple = L.U.AutoComplete.Ajax.extend({
|
||||||
|
|
||||||
initSelectedContainer: function () {
|
initSelectedContainer: function () {
|
||||||
return L.DomUtil.after(this.input, L.DomUtil.element('ul', {className: 'umap-multiresult'}));
|
return L.DomUtil.after(
|
||||||
|
this.input,
|
||||||
|
L.DomUtil.element('ul', { className: 'umap-multiresult' })
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
displaySelected: function (result) {
|
displaySelected: function (result) {
|
||||||
var result_el = L.DomUtil.element('li', {}, this.selected_container);
|
var result_el = L.DomUtil.element('li', {}, this.selected_container)
|
||||||
result_el.textContent = result.item.label;
|
result_el.textContent = result.item.label
|
||||||
var close = L.DomUtil.element('span', {className: 'close'}, result_el);
|
var close = L.DomUtil.element('span', { className: 'close' }, result_el)
|
||||||
close.textContent = '×';
|
close.textContent = '×'
|
||||||
L.DomEvent.on(close, 'click', function () {
|
L.DomEvent.on(
|
||||||
this.selected_container.removeChild(result_el);
|
close,
|
||||||
this.options.on_unselect(result);
|
'click',
|
||||||
}, this);
|
function () {
|
||||||
this.hide();
|
this.selected_container.removeChild(result_el)
|
||||||
}
|
this.options.on_unselect(result)
|
||||||
|
},
|
||||||
});
|
this
|
||||||
|
)
|
||||||
|
this.hide()
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
L.U.AutoComplete.Ajax.Select = L.U.AutoComplete.Ajax.extend({
|
L.U.AutoComplete.Ajax.Select = L.U.AutoComplete.Ajax.extend({
|
||||||
|
|
||||||
initSelectedContainer: function () {
|
initSelectedContainer: function () {
|
||||||
return L.DomUtil.after(this.input, L.DomUtil.element('div', {className: 'umap-singleresult'}));
|
return L.DomUtil.after(
|
||||||
|
this.input,
|
||||||
|
L.DomUtil.element('div', { className: 'umap-singleresult' })
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
displaySelected: function (result) {
|
displaySelected: function (result) {
|
||||||
var result_el = L.DomUtil.element('div', {}, this.selected_container);
|
var result_el = L.DomUtil.element('div', {}, this.selected_container)
|
||||||
result_el.textContent = result.item.label;
|
result_el.textContent = result.item.label
|
||||||
var close = L.DomUtil.element('span', {className: 'close'}, result_el);
|
var close = L.DomUtil.element('span', { className: 'close' }, result_el)
|
||||||
close.textContent = '×';
|
close.textContent = '×'
|
||||||
this.input.style.display = 'none';
|
this.input.style.display = 'none'
|
||||||
L.DomEvent.on(close, 'click', function () {
|
L.DomEvent.on(
|
||||||
this.selected_container.innerHTML = '';
|
close,
|
||||||
this.input.style.display = 'block';
|
'click',
|
||||||
}, this);
|
function () {
|
||||||
this.hide();
|
this.selected_container.innerHTML = ''
|
||||||
}
|
this.input.style.display = 'block'
|
||||||
|
},
|
||||||
});
|
this
|
||||||
|
)
|
||||||
|
this.hide()
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
File diff suppressed because it is too large
Load diff
|
@ -1,300 +1,315 @@
|
||||||
/* Poor man pub/sub handler, enough for now */
|
/* Poor man pub/sub handler, enough for now */
|
||||||
|
|
||||||
L.UmapSingleton = L.Evented.extend({});
|
L.UmapSingleton = L.Evented.extend({})
|
||||||
L.U = new L.UmapSingleton();
|
L.U = new L.UmapSingleton()
|
||||||
L.U.Map = L.Map.extend({});
|
L.U.Map = L.Map.extend({})
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Utils
|
* Utils
|
||||||
*/
|
*/
|
||||||
L.Util.queryString = function (name, fallback) {
|
L.Util.queryString = function (name, fallback) {
|
||||||
var decode = function (s) { return decodeURIComponent(s.replace(/\+/g, ' ')); };
|
var decode = function (s) {
|
||||||
var qs = window.location.search.slice(1).split('&'), qa = {};
|
return decodeURIComponent(s.replace(/\+/g, ' '))
|
||||||
for (var i in qs) {
|
}
|
||||||
var key = qs[i].split('=');
|
var qs = window.location.search.slice(1).split('&'),
|
||||||
if (!key) continue;
|
qa = {}
|
||||||
qa[decode(key[0])] = key[1] ? decode(key[1]) : 1;
|
for (var i in qs) {
|
||||||
|
var key = qs[i].split('=')
|
||||||
|
if (!key) continue
|
||||||
|
qa[decode(key[0])] = key[1] ? decode(key[1]) : 1
|
||||||
|
}
|
||||||
|
return qa[name] || fallback
|
||||||
}
|
}
|
||||||
return qa[name] || fallback;
|
|
||||||
};
|
|
||||||
|
|
||||||
L.Util.booleanFromQueryString = function (name) {
|
L.Util.booleanFromQueryString = function (name) {
|
||||||
var value = L.Util.queryString(name);
|
var value = L.Util.queryString(name)
|
||||||
return value === '1' || value === 'true';
|
return value === '1' || value === 'true'
|
||||||
};
|
}
|
||||||
|
|
||||||
L.Util.setFromQueryString = function (options, name) {
|
L.Util.setFromQueryString = function (options, name) {
|
||||||
var value = L.Util.queryString(name);
|
var value = L.Util.queryString(name)
|
||||||
if (typeof value !== 'undefined') options[name] = value;
|
if (typeof value !== 'undefined') options[name] = value
|
||||||
};
|
}
|
||||||
|
|
||||||
L.Util.setBooleanFromQueryString = function (options, name) {
|
L.Util.setBooleanFromQueryString = function (options, name) {
|
||||||
var value = L.Util.queryString(name);
|
var value = L.Util.queryString(name)
|
||||||
if (typeof value !== 'undefined') options[name] = value == '1' || value == 'true';
|
if (typeof value !== 'undefined') options[name] = value == '1' || value == 'true'
|
||||||
};
|
}
|
||||||
L.Util.setNullableBooleanFromQueryString = function (options, name) {
|
L.Util.setNullableBooleanFromQueryString = function (options, name) {
|
||||||
var value = L.Util.queryString(name);
|
var value = L.Util.queryString(name)
|
||||||
if (typeof value !== 'undefined') {
|
if (typeof value !== 'undefined') {
|
||||||
if (value === 'null') value = null;
|
if (value === 'null') value = null
|
||||||
else if (value === '0' || value === 'false') value = false;
|
else if (value === '0' || value === 'false') value = false
|
||||||
else value = true;
|
else value = true
|
||||||
options[name] = value;
|
options[name] = value
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
|
||||||
L.Util.escapeHTML = function (s) {
|
L.Util.escapeHTML = function (s) {
|
||||||
s = s? s.toString() : '';
|
s = s ? s.toString() : ''
|
||||||
return s.replace(/</gm, '<');
|
return s.replace(/</gm, '<')
|
||||||
};
|
}
|
||||||
L.Util.toHTML = function (r) {
|
L.Util.toHTML = function (r) {
|
||||||
if (!r) return '';
|
if (!r) return ''
|
||||||
var ii;
|
var ii
|
||||||
|
|
||||||
// detect newline format
|
// detect newline format
|
||||||
var newline = r.indexOf('\r\n') != -1 ? '\r\n' : r.indexOf('\n') != -1 ? '\n' : '';
|
var newline = r.indexOf('\r\n') != -1 ? '\r\n' : r.indexOf('\n') != -1 ? '\n' : ''
|
||||||
|
|
||||||
// Escape tags
|
// Escape tags
|
||||||
r = r.replace(/</gm, '<');
|
r = r.replace(/</gm, '<')
|
||||||
|
|
||||||
|
|
||||||
// headings and hr
|
// headings and hr
|
||||||
r = r.replace(/^### (.*)/gm, '<h5>$1</h5>');
|
r = r.replace(/^### (.*)/gm, '<h5>$1</h5>')
|
||||||
r = r.replace(/^## (.*)/gm, '<h4>$1</h4>');
|
r = r.replace(/^## (.*)/gm, '<h4>$1</h4>')
|
||||||
r = r.replace(/^# (.*)/gm, '<h3>$1</h3>');
|
r = r.replace(/^# (.*)/gm, '<h3>$1</h3>')
|
||||||
r = r.replace(/^---/gm, '<hr>');
|
r = r.replace(/^---/gm, '<hr>')
|
||||||
|
|
||||||
// bold, italics
|
// bold, italics
|
||||||
r = r.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
|
r = r.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
|
||||||
r = r.replace(/\*(.*?)\*/g, '<em>$1</em>');
|
r = r.replace(/\*(.*?)\*/g, '<em>$1</em>')
|
||||||
|
|
||||||
// unordered lists
|
// unordered lists
|
||||||
r = r.replace(/^\*\* (.*)/gm, '<ul><ul><li>$1</li></ul></ul>');
|
r = r.replace(/^\*\* (.*)/gm, '<ul><ul><li>$1</li></ul></ul>')
|
||||||
r = r.replace(/^\* (.*)/gm, '<ul><li>$1</li></ul>');
|
r = r.replace(/^\* (.*)/gm, '<ul><li>$1</li></ul>')
|
||||||
for (ii = 0; ii < 3; ii++) r = r.replace(new RegExp('</ul>' + newline + '<ul>', 'g'), newline);
|
for (ii = 0; ii < 3; ii++)
|
||||||
|
r = r.replace(new RegExp('</ul>' + newline + '<ul>', 'g'), newline)
|
||||||
|
|
||||||
// links
|
// links
|
||||||
r = r.replace(/(\[\[http)/g, '[[h_t_t_p'); // Escape for avoiding clash between [[http://xxx]] and http://xxx
|
r = r.replace(/(\[\[http)/g, '[[h_t_t_p') // Escape for avoiding clash between [[http://xxx]] and http://xxx
|
||||||
r = r.replace(/({{http)/g, '{{h_t_t_p');
|
r = r.replace(/({{http)/g, '{{h_t_t_p')
|
||||||
r = r.replace(/(=http)/g, '=h_t_t_p'); // http://xxx as query string, see https://github.com/umap-project/umap/issues/607
|
r = r.replace(/(=http)/g, '=h_t_t_p') // http://xxx as query string, see https://github.com/umap-project/umap/issues/607
|
||||||
r = r.replace(/(https?:[^ \<)\n]*)/g, '<a target="_blank" href="$1">$1</a>');
|
r = r.replace(/(https?:[^ \<)\n]*)/g, '<a target="_blank" href="$1">$1</a>')
|
||||||
r = r.replace(/\[\[(h_t_t_ps?:[^\]|]*?)\]\]/g, '<a target="_blank" href="$1">$1</a>');
|
r = r.replace(/\[\[(h_t_t_ps?:[^\]|]*?)\]\]/g, '<a target="_blank" href="$1">$1</a>')
|
||||||
r = r.replace(/\[\[(h_t_t_ps?:[^|]*?)\|(.*?)\]\]/g, '<a target="_blank" href="$1">$2</a>');
|
r = r.replace(
|
||||||
r = r.replace(/\[\[([^\]|]*?)\]\]/g, '<a href="$1">$1</a>');
|
/\[\[(h_t_t_ps?:[^|]*?)\|(.*?)\]\]/g,
|
||||||
r = r.replace(/\[\[([^|]*?)\|(.*?)\]\]/g, '<a href="$1">$2</a>');
|
'<a target="_blank" href="$1">$2</a>'
|
||||||
|
)
|
||||||
|
r = r.replace(/\[\[([^\]|]*?)\]\]/g, '<a href="$1">$1</a>')
|
||||||
|
r = r.replace(/\[\[([^|]*?)\|(.*?)\]\]/g, '<a href="$1">$2</a>')
|
||||||
|
|
||||||
// iframe
|
// iframe
|
||||||
r = r.replace(/{{{(h_t_t_ps?[^ |{]*)}}}/g, '<div><iframe frameborder="0" src="$1" width="100%" height="300px"></iframe></div>');
|
r = r.replace(
|
||||||
r = r.replace(/{{{(h_t_t_ps?[^ |{]*)\|(\d*)(px)?}}}/g, '<div><iframe frameborder="0" src="$1" width="100%" height="$2px"></iframe></div>');
|
/{{{(h_t_t_ps?[^ |{]*)}}}/g,
|
||||||
r = r.replace(/{{{(h_t_t_ps?[^ |{]*)\|(\d*)(px)?\*(\d*)(px)?}}}/g, '<div><iframe frameborder="0" src="$1" width="$4px" height="$2px"></iframe></div>');
|
'<div><iframe frameborder="0" src="$1" width="100%" height="300px"></iframe></div>'
|
||||||
|
)
|
||||||
|
r = r.replace(
|
||||||
|
/{{{(h_t_t_ps?[^ |{]*)\|(\d*)(px)?}}}/g,
|
||||||
|
'<div><iframe frameborder="0" src="$1" width="100%" height="$2px"></iframe></div>'
|
||||||
|
)
|
||||||
|
r = r.replace(
|
||||||
|
/{{{(h_t_t_ps?[^ |{]*)\|(\d*)(px)?\*(\d*)(px)?}}}/g,
|
||||||
|
'<div><iframe frameborder="0" src="$1" width="$4px" height="$2px"></iframe></div>'
|
||||||
|
)
|
||||||
|
|
||||||
// images
|
// images
|
||||||
r = r.replace(/{{([^\]|]*?)}}/g, '<img src="$1">');
|
r = r.replace(/{{([^\]|]*?)}}/g, '<img src="$1">')
|
||||||
r = r.replace(/{{([^|]*?)\|(\d*?)}}/g, '<img src="$1" width="$2">');
|
r = r.replace(/{{([^|]*?)\|(\d*?)}}/g, '<img src="$1" width="$2">')
|
||||||
|
|
||||||
//Unescape http
|
//Unescape http
|
||||||
r = r.replace(/(h_t_t_p)/g, 'http');
|
r = r.replace(/(h_t_t_p)/g, 'http')
|
||||||
|
|
||||||
// Preserver line breaks
|
// Preserver line breaks
|
||||||
if (newline) r = r.replace(new RegExp(newline + '(?=[^]+)', 'g'), '<br>' + newline);
|
if (newline) r = r.replace(new RegExp(newline + '(?=[^]+)', 'g'), '<br>' + newline)
|
||||||
|
|
||||||
return r;
|
return r
|
||||||
};
|
}
|
||||||
L.Util.isObject = function (what) {
|
L.Util.isObject = function (what) {
|
||||||
return typeof what === 'object' && what !== null;
|
return typeof what === 'object' && what !== null
|
||||||
};
|
}
|
||||||
L.Util.CopyJSON = function (geojson) {
|
L.Util.CopyJSON = function (geojson) {
|
||||||
return JSON.parse(JSON.stringify(geojson));
|
return JSON.parse(JSON.stringify(geojson))
|
||||||
};
|
}
|
||||||
L.Util.detectFileType = function (f) {
|
L.Util.detectFileType = function (f) {
|
||||||
var filename = f.name ? escape(f.name.toLowerCase()) : '';
|
var filename = f.name ? escape(f.name.toLowerCase()) : ''
|
||||||
function ext(_) {
|
function ext(_) {
|
||||||
return filename.indexOf(_) !== -1;
|
return filename.indexOf(_) !== -1
|
||||||
}
|
}
|
||||||
if (f.type === 'application/vnd.google-earth.kml+xml' || ext('.kml')) {
|
if (f.type === 'application/vnd.google-earth.kml+xml' || ext('.kml')) {
|
||||||
return 'kml';
|
return 'kml'
|
||||||
}
|
}
|
||||||
if (ext('.gpx')) return 'gpx';
|
if (ext('.gpx')) return 'gpx'
|
||||||
if (ext('.geojson') || ext('.json')) return 'geojson';
|
if (ext('.geojson') || ext('.json')) return 'geojson'
|
||||||
if (f.type === 'text/csv' || ext('.csv') || ext('.tsv') || ext('.dsv')) {
|
if (f.type === 'text/csv' || ext('.csv') || ext('.tsv') || ext('.dsv')) {
|
||||||
return 'csv';
|
return 'csv'
|
||||||
|
}
|
||||||
|
if (ext('.xml') || ext('.osm')) return 'osm'
|
||||||
|
if (ext('.umap')) return 'umap'
|
||||||
}
|
}
|
||||||
if (ext('.xml') || ext('.osm')) return 'osm';
|
|
||||||
if (ext('.umap')) return 'umap';
|
|
||||||
};
|
|
||||||
|
|
||||||
L.Util.usableOption = function (options, option) {
|
L.Util.usableOption = function (options, option) {
|
||||||
return options[option] !== undefined && options[option] !== '';
|
return options[option] !== undefined && options[option] !== ''
|
||||||
};
|
}
|
||||||
|
|
||||||
L.Util.greedyTemplate = function (str, data, ignore) {
|
L.Util.greedyTemplate = function (str, data, ignore) {
|
||||||
function getValue(data, path) {
|
function getValue(data, path) {
|
||||||
var value = data
|
var value = data
|
||||||
for (var i = 0; i < path.length; i++) {
|
for (var i = 0; i < path.length; i++) {
|
||||||
value = value[path[i]]
|
value = value[path[i]]
|
||||||
if (value === undefined) break;
|
if (value === undefined) break
|
||||||
}
|
}
|
||||||
return value;
|
return value
|
||||||
}
|
}
|
||||||
|
|
||||||
return str.replace(/\{ *([\w_\:\.\|]+)(?:\|("[^"]*"))? *\}/g, function (str, key, staticFallback) {
|
return str.replace(
|
||||||
var vars = key.split('|'), value, path;
|
/\{ *([\w_\:\.\|]+)(?:\|("[^"]*"))? *\}/g,
|
||||||
|
function (str, key, staticFallback) {
|
||||||
|
var vars = key.split('|'),
|
||||||
|
value,
|
||||||
|
path
|
||||||
if (staticFallback !== undefined) {
|
if (staticFallback !== undefined) {
|
||||||
vars.push(staticFallback);
|
vars.push(staticFallback)
|
||||||
}
|
}
|
||||||
for (var i = 0; i < vars.length; i++) {
|
for (var i = 0; i < vars.length; i++) {
|
||||||
path = vars[i];
|
path = vars[i]
|
||||||
if (path.startsWith('"') && path.endsWith('"')) value = path.substring(1, path.length -1); // static default value.
|
if (path.startsWith('"') && path.endsWith('"'))
|
||||||
else value = getValue(data, path.split('.'));
|
value = path.substring(1, path.length - 1) // static default value.
|
||||||
if (value !== undefined) break;
|
else value = getValue(data, path.split('.'))
|
||||||
|
if (value !== undefined) break
|
||||||
}
|
}
|
||||||
if (value === undefined) {
|
if (value === undefined) {
|
||||||
if (ignore) value = str;
|
if (ignore) value = str
|
||||||
else value = '';
|
else value = ''
|
||||||
|
}
|
||||||
|
return value
|
||||||
|
}
|
||||||
|
)
|
||||||
}
|
}
|
||||||
return value;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
L.Util.sortFeatures = function (features, sortKey) {
|
L.Util.sortFeatures = function (features, sortKey) {
|
||||||
var sortKeys = (sortKey || 'name').split(',');
|
var sortKeys = (sortKey || 'name').split(',')
|
||||||
|
|
||||||
var sort = function (a, b, i) {
|
var sort = function (a, b, i) {
|
||||||
var sortKey = sortKeys[i], score,
|
var sortKey = sortKeys[i],
|
||||||
|
score,
|
||||||
valA = a.properties[sortKey] || '',
|
valA = a.properties[sortKey] || '',
|
||||||
valB = b.properties[sortKey] || '';
|
valB = b.properties[sortKey] || ''
|
||||||
if (!valA) {
|
if (!valA) {
|
||||||
score = -1;
|
score = -1
|
||||||
} else if (!valB) {
|
} else if (!valB) {
|
||||||
score = 1;
|
score = 1
|
||||||
} else {
|
} else {
|
||||||
score = valA.toString().toLowerCase().localeCompare(valB.toString().toLowerCase());
|
score = valA.toString().toLowerCase().localeCompare(valB.toString().toLowerCase())
|
||||||
|
}
|
||||||
|
if (score === 0 && sortKeys[i + 1]) return sort(a, b, i + 1)
|
||||||
|
return score
|
||||||
}
|
}
|
||||||
if (score === 0 && sortKeys[i + 1]) return sort(a, b, i + 1);
|
|
||||||
return score;
|
|
||||||
};
|
|
||||||
|
|
||||||
features.sort(function (a, b) {
|
features.sort(function (a, b) {
|
||||||
if (!a.properties || !b.properties) {
|
if (!a.properties || !b.properties) {
|
||||||
return 0;
|
return 0
|
||||||
}
|
}
|
||||||
return sort(a, b, 0);
|
return sort(a, b, 0)
|
||||||
});
|
})
|
||||||
|
|
||||||
|
return features
|
||||||
return features;
|
}
|
||||||
};
|
|
||||||
|
|
||||||
L.Util.flattenCoordinates = function (coords) {
|
L.Util.flattenCoordinates = function (coords) {
|
||||||
while (coords[0] && typeof coords[0][0] !== 'number') coords = coords[0];
|
while (coords[0] && typeof coords[0][0] !== 'number') coords = coords[0]
|
||||||
return coords;
|
return coords
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
L.Util.buildQueryString = function (params) {
|
L.Util.buildQueryString = function (params) {
|
||||||
var query_string = [];
|
var query_string = []
|
||||||
for (var key in params) {
|
for (var key in params) {
|
||||||
query_string.push(encodeURIComponent(key) + '=' + encodeURIComponent(params[key]));
|
query_string.push(encodeURIComponent(key) + '=' + encodeURIComponent(params[key]))
|
||||||
|
}
|
||||||
|
return query_string.join('&')
|
||||||
}
|
}
|
||||||
return query_string.join('&');
|
|
||||||
};
|
|
||||||
|
|
||||||
L.Util.getBaseUrl = function () {
|
L.Util.getBaseUrl = function () {
|
||||||
return '//' + window.location.host + window.location.pathname;
|
return '//' + window.location.host + window.location.pathname
|
||||||
};
|
}
|
||||||
|
|
||||||
L.DomUtil.add = function (tagName, className, container, content) {
|
L.DomUtil.add = function (tagName, className, container, content) {
|
||||||
var el = L.DomUtil.create(tagName, className, container);
|
var el = L.DomUtil.create(tagName, className, container)
|
||||||
if (content) {
|
if (content) {
|
||||||
if (content.nodeType && content.nodeType === 1) {
|
if (content.nodeType && content.nodeType === 1) {
|
||||||
el.appendChild(content);
|
el.appendChild(content)
|
||||||
}
|
} else {
|
||||||
else {
|
el.innerHTML = content
|
||||||
el.innerHTML = content;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return el;
|
return el
|
||||||
};
|
}
|
||||||
|
|
||||||
L.DomUtil.createFieldset = function (container, legend, options) {
|
L.DomUtil.createFieldset = function (container, legend, options) {
|
||||||
options = options || {};
|
options = options || {}
|
||||||
var fieldset = L.DomUtil.create('div', 'fieldset toggle', container);
|
var fieldset = L.DomUtil.create('div', 'fieldset toggle', container)
|
||||||
var legendEl = L.DomUtil.add('h5', 'legend style_options_toggle', fieldset, legend);
|
var legendEl = L.DomUtil.add('h5', 'legend style_options_toggle', fieldset, legend)
|
||||||
var fieldsEl = L.DomUtil.add('div', 'fields with-transition', fieldset);
|
var fieldsEl = L.DomUtil.add('div', 'fields with-transition', fieldset)
|
||||||
L.DomEvent.on(legendEl, 'click', function () {
|
L.DomEvent.on(legendEl, 'click', function () {
|
||||||
if (L.DomUtil.hasClass(fieldset, 'on')) {
|
if (L.DomUtil.hasClass(fieldset, 'on')) {
|
||||||
L.DomUtil.removeClass(fieldset, 'on');
|
L.DomUtil.removeClass(fieldset, 'on')
|
||||||
} else {
|
} else {
|
||||||
L.DomUtil.addClass(fieldset, 'on');
|
L.DomUtil.addClass(fieldset, 'on')
|
||||||
if (options.callback) options.callback.call(options.context || this);
|
if (options.callback) options.callback.call(options.context || this)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return fieldsEl
|
||||||
}
|
}
|
||||||
});
|
|
||||||
return fieldsEl;
|
|
||||||
};
|
|
||||||
|
|
||||||
L.DomUtil.classIf = function (el, className, bool) {
|
L.DomUtil.classIf = function (el, className, bool) {
|
||||||
if (bool) L.DomUtil.addClass(el, className);
|
if (bool) L.DomUtil.addClass(el, className)
|
||||||
else L.DomUtil.removeClass(el, className);
|
else L.DomUtil.removeClass(el, className)
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
L.DomUtil.element = function (what, attrs, parent) {
|
L.DomUtil.element = function (what, attrs, parent) {
|
||||||
var el = document.createElement(what);
|
var el = document.createElement(what)
|
||||||
for (var attr in attrs) {
|
for (var attr in attrs) {
|
||||||
el[attr] = attrs[attr];
|
el[attr] = attrs[attr]
|
||||||
}
|
}
|
||||||
if (typeof parent !== 'undefined') {
|
if (typeof parent !== 'undefined') {
|
||||||
parent.appendChild(el);
|
parent.appendChild(el)
|
||||||
|
}
|
||||||
|
return el
|
||||||
}
|
}
|
||||||
return el;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
L.DomUtil.before = function (target, el) {
|
L.DomUtil.before = function (target, el) {
|
||||||
target.parentNode.insertBefore(el, target);
|
target.parentNode.insertBefore(el, target)
|
||||||
return el;
|
return el
|
||||||
};
|
}
|
||||||
|
|
||||||
L.DomUtil.after = function (target, el)
|
L.DomUtil.after = function (target, el) {
|
||||||
{
|
target.parentNode.insertBefore(el, target.nextSibling)
|
||||||
target.parentNode.insertBefore(el, target.nextSibling);
|
return el
|
||||||
return el;
|
}
|
||||||
};
|
|
||||||
|
|
||||||
L.DomUtil.RGBRegex = /rgb *\( *([0-9]{1,3}) *, *([0-9]{1,3}) *, *([0-9]{1,3}) *\)/;
|
L.DomUtil.RGBRegex = /rgb *\( *([0-9]{1,3}) *, *([0-9]{1,3}) *, *([0-9]{1,3}) *\)/
|
||||||
|
|
||||||
L.DomUtil.TextColorFromBackgroundColor = function (el) {
|
L.DomUtil.TextColorFromBackgroundColor = function (el) {
|
||||||
var out = '#000000';
|
var out = '#000000'
|
||||||
if (!window.getComputedStyle) {return out;}
|
if (!window.getComputedStyle) {
|
||||||
var rgb = window.getComputedStyle(el).getPropertyValue('background-color');
|
return out
|
||||||
rgb = L.DomUtil.RGBRegex.exec(rgb);
|
}
|
||||||
if (!rgb || rgb.length !== 4) {return out;}
|
var rgb = window.getComputedStyle(el).getPropertyValue('background-color')
|
||||||
rgb = parseInt(rgb[1], 10) + parseInt(rgb[2], 10) + parseInt(rgb[3], 10);
|
rgb = L.DomUtil.RGBRegex.exec(rgb)
|
||||||
if (rgb < (255 * 3 / 2)) {
|
if (!rgb || rgb.length !== 4) {
|
||||||
out = '#ffffff';
|
return out
|
||||||
|
}
|
||||||
|
rgb = parseInt(rgb[1], 10) + parseInt(rgb[2], 10) + parseInt(rgb[3], 10)
|
||||||
|
if (rgb < (255 * 3) / 2) {
|
||||||
|
out = '#ffffff'
|
||||||
|
}
|
||||||
|
return out
|
||||||
}
|
}
|
||||||
return out;
|
|
||||||
};
|
|
||||||
L.DomEvent.once = function (el, types, fn, context) {
|
L.DomEvent.once = function (el, types, fn, context) {
|
||||||
// cf https://github.com/Leaflet/Leaflet/pull/3528#issuecomment-134551575
|
// cf https://github.com/Leaflet/Leaflet/pull/3528#issuecomment-134551575
|
||||||
|
|
||||||
if (typeof types === 'object') {
|
if (typeof types === 'object') {
|
||||||
for (var type in types) {
|
for (var type in types) {
|
||||||
L.DomEvent.once(el, type, types[type], fn);
|
L.DomEvent.once(el, type, types[type], fn)
|
||||||
}
|
}
|
||||||
return L.DomEvent;
|
return L.DomEvent
|
||||||
}
|
}
|
||||||
|
|
||||||
var handler = L.bind(function () {
|
var handler = L.bind(function () {
|
||||||
L.DomEvent
|
L.DomEvent.off(el, types, fn, context).off(el, types, handler, context)
|
||||||
.off(el, types, fn, context)
|
}, L.DomEvent)
|
||||||
.off(el, types, handler, context);
|
|
||||||
}, L.DomEvent);
|
|
||||||
|
|
||||||
// add a listener that's executed once and removed after that
|
// add a listener that's executed once and removed after that
|
||||||
return L.DomEvent
|
return L.DomEvent.on(el, types, fn, context).on(el, types, handler, context)
|
||||||
.on(el, types, fn, context)
|
}
|
||||||
.on(el, types, handler, context);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Global events
|
* Global events
|
||||||
|
@ -319,43 +334,45 @@ L.U.Keys = {
|
||||||
M: 77,
|
M: 77,
|
||||||
P: 80,
|
P: 80,
|
||||||
S: 83,
|
S: 83,
|
||||||
Z: 90
|
Z: 90,
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
L.U.Help = L.Class.extend({
|
L.U.Help = L.Class.extend({
|
||||||
|
|
||||||
initialize: function (map) {
|
initialize: function (map) {
|
||||||
this.map = map;
|
this.map = map
|
||||||
this.box = L.DomUtil.create('div', 'umap-help-box with-transition dark', document.body);
|
this.box = L.DomUtil.create(
|
||||||
var closeLink = L.DomUtil.create('a', 'umap-close-link', this.box);
|
'div',
|
||||||
closeLink.href = '#';
|
'umap-help-box with-transition dark',
|
||||||
L.DomUtil.add('i', 'umap-close-icon', closeLink);
|
document.body
|
||||||
var label = L.DomUtil.create('span', '', closeLink);
|
)
|
||||||
label.title = label.textContent = L._('Close');
|
var closeLink = L.DomUtil.create('a', 'umap-close-link', this.box)
|
||||||
this.content = L.DomUtil.create('div', 'umap-help-content', this.box);
|
closeLink.href = '#'
|
||||||
L.DomEvent.on(closeLink, 'click', this.hide, this);
|
L.DomUtil.add('i', 'umap-close-icon', closeLink)
|
||||||
|
var label = L.DomUtil.create('span', '', closeLink)
|
||||||
|
label.title = label.textContent = L._('Close')
|
||||||
|
this.content = L.DomUtil.create('div', 'umap-help-content', this.box)
|
||||||
|
L.DomEvent.on(closeLink, 'click', this.hide, this)
|
||||||
},
|
},
|
||||||
|
|
||||||
onKeyDown: function (e) {
|
onKeyDown: function (e) {
|
||||||
var key = e.keyCode,
|
var key = e.keyCode,
|
||||||
ESC = 27;
|
ESC = 27
|
||||||
if (key === ESC) {
|
if (key === ESC) {
|
||||||
this.hide();
|
this.hide()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
show: function () {
|
show: function () {
|
||||||
this.content.innerHTML = '';
|
this.content.innerHTML = ''
|
||||||
for (var i = 0, name; i < arguments.length; i++) {
|
for (var i = 0, name; i < arguments.length; i++) {
|
||||||
name = arguments[i];
|
name = arguments[i]
|
||||||
L.DomUtil.add('div', 'umap-help-entry', this.content, this.resolve(name));
|
L.DomUtil.add('div', 'umap-help-entry', this.content, this.resolve(name))
|
||||||
}
|
}
|
||||||
L.DomUtil.addClass(document.body, 'umap-help-on');
|
L.DomUtil.addClass(document.body, 'umap-help-on')
|
||||||
},
|
},
|
||||||
|
|
||||||
hide: function () {
|
hide: function () {
|
||||||
L.DomUtil.removeClass(document.body, 'umap-help-on');
|
L.DomUtil.removeClass(document.body, 'umap-help-on')
|
||||||
},
|
},
|
||||||
|
|
||||||
visible: function () {
|
visible: function () {
|
||||||
|
@ -363,89 +380,141 @@ L.U.Help = L.Class.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
resolve: function (name) {
|
resolve: function (name) {
|
||||||
return typeof this[name] === 'function' ? this[name]() : this[name];
|
return typeof this[name] === 'function' ? this[name]() : this[name]
|
||||||
},
|
},
|
||||||
|
|
||||||
button: function (container, entries) {
|
button: function (container, entries) {
|
||||||
var helpButton = L.DomUtil.create('a', 'umap-help-button', container);
|
var helpButton = L.DomUtil.create('a', 'umap-help-button', container)
|
||||||
helpButton.href = '#';
|
helpButton.href = '#'
|
||||||
if (entries) {
|
if (entries) {
|
||||||
L.DomEvent
|
L.DomEvent.on(helpButton, 'click', L.DomEvent.stop).on(
|
||||||
.on(helpButton, 'click', L.DomEvent.stop)
|
helpButton,
|
||||||
.on(helpButton, 'click', function (e) {
|
'click',
|
||||||
var args = typeof entries === 'string' ? [entries] : entries;
|
function (e) {
|
||||||
this.show.apply(this, args);
|
var args = typeof entries === 'string' ? [entries] : entries
|
||||||
}, this);
|
this.show.apply(this, args)
|
||||||
|
},
|
||||||
|
this
|
||||||
|
)
|
||||||
}
|
}
|
||||||
return helpButton;
|
return helpButton
|
||||||
},
|
},
|
||||||
|
|
||||||
edit: function () {
|
edit: function () {
|
||||||
var container = L.DomUtil.create('div', ''),
|
var container = L.DomUtil.create('div', ''),
|
||||||
self = this,
|
self = this,
|
||||||
title = L.DomUtil.create('h3', '', container),
|
title = L.DomUtil.create('h3', '', container),
|
||||||
actionsContainer = L.DomUtil.create('ul', 'umap-edit-actions', container);
|
actionsContainer = L.DomUtil.create('ul', 'umap-edit-actions', container)
|
||||||
var addAction = function (action) {
|
var addAction = function (action) {
|
||||||
var actionContainer = L.DomUtil.add('li', '', actionsContainer);
|
var actionContainer = L.DomUtil.add('li', '', actionsContainer)
|
||||||
L.DomUtil.add('i', action.options.className, actionContainer),
|
L.DomUtil.add('i', action.options.className, actionContainer),
|
||||||
L.DomUtil.add('span', '', actionContainer, action.options.tooltip);
|
L.DomUtil.add('span', '', actionContainer, action.options.tooltip)
|
||||||
L.DomEvent.on(actionContainer, 'click', action.addHooks, action);
|
L.DomEvent.on(actionContainer, 'click', action.addHooks, action)
|
||||||
L.DomEvent.on(actionContainer, 'click', self.hide, self);
|
L.DomEvent.on(actionContainer, 'click', self.hide, self)
|
||||||
};
|
|
||||||
title.textContent = L._('Where do we go from here?');
|
|
||||||
for (var id in this.map.helpMenuActions) {
|
|
||||||
addAction(this.map.helpMenuActions[id]);
|
|
||||||
}
|
}
|
||||||
return container;
|
title.textContent = L._('Where do we go from here?')
|
||||||
|
for (var id in this.map.helpMenuActions) {
|
||||||
|
addAction(this.map.helpMenuActions[id])
|
||||||
|
}
|
||||||
|
return container
|
||||||
},
|
},
|
||||||
|
|
||||||
importFormats: function () {
|
importFormats: function () {
|
||||||
var container = L.DomUtil.create('div');
|
var container = L.DomUtil.create('div')
|
||||||
L.DomUtil.add('h3', '', container, 'GeojSON');
|
L.DomUtil.add('h3', '', container, 'GeojSON')
|
||||||
L.DomUtil.add('p', '', container, L._('All properties are imported.'));
|
L.DomUtil.add('p', '', container, L._('All properties are imported.'))
|
||||||
L.DomUtil.add('h3', '', container, 'GPX');
|
L.DomUtil.add('h3', '', container, 'GPX')
|
||||||
L.DomUtil.add('p', '', container, L._('Properties imported:') + 'name, desc');
|
L.DomUtil.add('p', '', container, L._('Properties imported:') + 'name, desc')
|
||||||
L.DomUtil.add('h3', '', container, 'KML');
|
L.DomUtil.add('h3', '', container, 'KML')
|
||||||
L.DomUtil.add('p', '', container, L._('Properties imported:') + 'name, description');
|
L.DomUtil.add('p', '', container, L._('Properties imported:') + 'name, description')
|
||||||
L.DomUtil.add('h3', '', container, 'CSV');
|
L.DomUtil.add('h3', '', container, 'CSV')
|
||||||
L.DomUtil.add('p', '', container, L._('Comma, tab or semi-colon separated values. SRS WGS84 is implied. Only Point geometries are imported. The import will look at the column headers for any mention of «lat» and «lon» at the begining of the header, case insensitive. All other column are imported as properties.'));
|
L.DomUtil.add(
|
||||||
L.DomUtil.add('h3', '', container, 'uMap');
|
'p',
|
||||||
L.DomUtil.add('p', '', container, L._('Imports all umap data, including layers and settings.'));
|
'',
|
||||||
return container;
|
container,
|
||||||
|
L._(
|
||||||
|
'Comma, tab or semi-colon separated values. SRS WGS84 is implied. Only Point geometries are imported. The import will look at the column headers for any mention of «lat» and «lon» at the begining of the header, case insensitive. All other column are imported as properties.'
|
||||||
|
)
|
||||||
|
)
|
||||||
|
L.DomUtil.add('h3', '', container, 'uMap')
|
||||||
|
L.DomUtil.add(
|
||||||
|
'p',
|
||||||
|
'',
|
||||||
|
container,
|
||||||
|
L._('Imports all umap data, including layers and settings.')
|
||||||
|
)
|
||||||
|
return container
|
||||||
},
|
},
|
||||||
|
|
||||||
textFormatting: function () {
|
textFormatting: function () {
|
||||||
var container = L.DomUtil.create('div'),
|
var container = L.DomUtil.create('div'),
|
||||||
title = L.DomUtil.add('h3', '', container, L._('Text formatting')),
|
title = L.DomUtil.add('h3', '', container, L._('Text formatting')),
|
||||||
elements = L.DomUtil.create('ul', '', container);
|
elements = L.DomUtil.create('ul', '', container)
|
||||||
L.DomUtil.add('li', '', elements, L._('*simple star for italic*'));
|
L.DomUtil.add('li', '', elements, L._('*simple star for italic*'))
|
||||||
L.DomUtil.add('li', '', elements, L._('**double star for bold**'));
|
L.DomUtil.add('li', '', elements, L._('**double star for bold**'))
|
||||||
L.DomUtil.add('li', '', elements, L._('# one hash for main heading'));
|
L.DomUtil.add('li', '', elements, L._('# one hash for main heading'))
|
||||||
L.DomUtil.add('li', '', elements, L._('## two hashes for second heading'));
|
L.DomUtil.add('li', '', elements, L._('## two hashes for second heading'))
|
||||||
L.DomUtil.add('li', '', elements, L._('### three hashes for third heading'));
|
L.DomUtil.add('li', '', elements, L._('### three hashes for third heading'))
|
||||||
L.DomUtil.add('li', '', elements, L._('Simple link: [[http://example.com]]'));
|
L.DomUtil.add('li', '', elements, L._('Simple link: [[http://example.com]]'))
|
||||||
L.DomUtil.add('li', '', elements, L._('Link with text: [[http://example.com|text of the link]]'));
|
L.DomUtil.add(
|
||||||
L.DomUtil.add('li', '', elements, L._('Image: {{http://image.url.com}}'));
|
'li',
|
||||||
L.DomUtil.add('li', '', elements, L._('Image with custom width (in px): {{http://image.url.com|width}}'));
|
'',
|
||||||
L.DomUtil.add('li', '', elements, L._('Iframe: {{{http://iframe.url.com}}}'));
|
elements,
|
||||||
L.DomUtil.add('li', '', elements, L._('Iframe with custom height (in px): {{{http://iframe.url.com|height}}}'));
|
L._('Link with text: [[http://example.com|text of the link]]')
|
||||||
L.DomUtil.add('li', '', elements, L._('Iframe with custom height and width (in px): {{{http://iframe.url.com|height*width}}}'));
|
)
|
||||||
L.DomUtil.add('li', '', elements, L._('--- for an horizontal rule'));
|
L.DomUtil.add('li', '', elements, L._('Image: {{http://image.url.com}}'))
|
||||||
return container;
|
L.DomUtil.add(
|
||||||
|
'li',
|
||||||
|
'',
|
||||||
|
elements,
|
||||||
|
L._('Image with custom width (in px): {{http://image.url.com|width}}')
|
||||||
|
)
|
||||||
|
L.DomUtil.add('li', '', elements, L._('Iframe: {{{http://iframe.url.com}}}'))
|
||||||
|
L.DomUtil.add(
|
||||||
|
'li',
|
||||||
|
'',
|
||||||
|
elements,
|
||||||
|
L._('Iframe with custom height (in px): {{{http://iframe.url.com|height}}}')
|
||||||
|
)
|
||||||
|
L.DomUtil.add(
|
||||||
|
'li',
|
||||||
|
'',
|
||||||
|
elements,
|
||||||
|
L._(
|
||||||
|
'Iframe with custom height and width (in px): {{{http://iframe.url.com|height*width}}}'
|
||||||
|
)
|
||||||
|
)
|
||||||
|
L.DomUtil.add('li', '', elements, L._('--- for an horizontal rule'))
|
||||||
|
return container
|
||||||
},
|
},
|
||||||
|
|
||||||
dynamicProperties: function () {
|
dynamicProperties: function () {
|
||||||
var container = L.DomUtil.create('div');
|
var container = L.DomUtil.create('div')
|
||||||
L.DomUtil.add('h3', '', container, L._('Dynamic properties'));
|
L.DomUtil.add('h3', '', container, L._('Dynamic properties'))
|
||||||
L.DomUtil.add('p', '', container, L._('Use placeholders with feature properties between brackets, eg. {name}, they will be dynamically replaced by the corresponding values.'));
|
L.DomUtil.add(
|
||||||
return container;
|
'p',
|
||||||
|
'',
|
||||||
|
container,
|
||||||
|
L._(
|
||||||
|
'Use placeholders with feature properties between brackets, eg. {name}, they will be dynamically replaced by the corresponding values.'
|
||||||
|
)
|
||||||
|
)
|
||||||
|
return container
|
||||||
},
|
},
|
||||||
|
|
||||||
formatURL: L._('Supported variables that will be dynamically replaced') + ': {bbox}, {lat}, {lng}, {zoom}, {east}, {north}..., {left}, {top}...',
|
formatURL:
|
||||||
formatIconSymbol: L._('Symbol can be either a unicode character or an URL. You can use feature properties as variables: ex.: with "http://myserver.org/images/{name}.png", the {name} variable will be replaced by the "name" value of each marker.'),
|
L._('Supported variables that will be dynamically replaced') +
|
||||||
|
': {bbox}, {lat}, {lng}, {zoom}, {east}, {north}..., {left}, {top}...',
|
||||||
|
formatIconSymbol: L._(
|
||||||
|
'Symbol can be either a unicode character or an URL. You can use feature properties as variables: ex.: with "http://myserver.org/images/{name}.png", the {name} variable will be replaced by the "name" value of each marker.'
|
||||||
|
),
|
||||||
colorValue: L._('Must be a valid CSS value (eg.: DarkBlue or #123456)'),
|
colorValue: L._('Must be a valid CSS value (eg.: DarkBlue or #123456)'),
|
||||||
smoothFactor: L._('How much to simplify the polyline on each zoom level (more = better performance and smoother look, less = more accurate)'),
|
smoothFactor: L._(
|
||||||
dashArray: L._('A comma separated list of numbers that defines the stroke dash pattern. Ex.: "5, 10, 15".'),
|
'How much to simplify the polyline on each zoom level (more = better performance and smoother look, less = more accurate)'
|
||||||
|
),
|
||||||
|
dashArray: L._(
|
||||||
|
'A comma separated list of numbers that defines the stroke dash pattern. Ex.: "5, 10, 15".'
|
||||||
|
),
|
||||||
zoomTo: L._('Zoom level for automatic zooms'),
|
zoomTo: L._('Zoom level for automatic zooms'),
|
||||||
labelKey: L._('The name of the property to use as feature label (ex.: "nom")'),
|
labelKey: L._('The name of the property to use as feature label (ex.: "nom")'),
|
||||||
stroke: L._('Whether to display or not polygons paths.'),
|
stroke: L._('Whether to display or not polygons paths.'),
|
||||||
|
@ -453,82 +522,86 @@ L.U.Help = L.Class.extend({
|
||||||
fillColor: L._('Optional. Same as color if not set.'),
|
fillColor: L._('Optional. Same as color if not set.'),
|
||||||
shortCredit: L._('Will be displayed in the bottom right corner of the map'),
|
shortCredit: L._('Will be displayed in the bottom right corner of the map'),
|
||||||
longCredit: L._('Will be visible in the caption of the map'),
|
longCredit: L._('Will be visible in the caption of the map'),
|
||||||
permanentCredit: L._('Will be permanently visible in the bottom left corner of the map'),
|
permanentCredit: L._(
|
||||||
|
'Will be permanently visible in the bottom left corner of the map'
|
||||||
|
),
|
||||||
sortKey: L._('Property to use for sorting features'),
|
sortKey: L._('Property to use for sorting features'),
|
||||||
slugKey: L._('The name of the property to use as feature unique identifier.'),
|
slugKey: L._('The name of the property to use as feature unique identifier.'),
|
||||||
filterKey: L._('Comma separated list of properties to use when filtering features'),
|
filterKey: L._('Comma separated list of properties to use when filtering features'),
|
||||||
advancedFilterKey: L._('Comma separated list of properties to use for checkbox filtering'),
|
advancedFilterKey: L._(
|
||||||
|
'Comma separated list of properties to use for checkbox filtering'
|
||||||
|
),
|
||||||
advancedFiltersNoResults: L._('No results for these filters'),
|
advancedFiltersNoResults: L._('No results for these filters'),
|
||||||
interactive: L._('If false, the polygon will act as a part of the underlying map.'),
|
interactive: L._('If false, the polygon will act as a part of the underlying map.'),
|
||||||
outlink: L._('Define link to open in a new window on polygon click.'),
|
outlink: L._('Define link to open in a new window on polygon click.'),
|
||||||
dynamicRemoteData: L._('Fetch data each time map view changes.'),
|
dynamicRemoteData: L._('Fetch data each time map view changes.'),
|
||||||
proxyRemoteData: L._('To use if remote server doesn\'t allow cross domain (slower)'),
|
proxyRemoteData: L._("To use if remote server doesn't allow cross domain (slower)"),
|
||||||
browsable: L._('Set it to false to hide this layer from the slideshow, the data browser, the popup navigation…')
|
browsable: L._(
|
||||||
});
|
'Set it to false to hide this layer from the slideshow, the data browser, the popup navigation…'
|
||||||
|
),
|
||||||
|
})
|
||||||
|
|
||||||
L.U.Orderable = L.Evented.extend({
|
L.U.Orderable = L.Evented.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
selector: 'li',
|
selector: 'li',
|
||||||
color: '#374E75'
|
color: '#374E75',
|
||||||
},
|
},
|
||||||
|
|
||||||
initialize: function (parent, options) {
|
initialize: function (parent, options) {
|
||||||
L.Util.setOptions(this, options);
|
L.Util.setOptions(this, options)
|
||||||
this.parent = parent;
|
this.parent = parent
|
||||||
this.src = null;
|
this.src = null
|
||||||
this.dst = null;
|
this.dst = null
|
||||||
this.els = this.parent.querySelectorAll(this.options.selector);
|
this.els = this.parent.querySelectorAll(this.options.selector)
|
||||||
for (var i = 0; i < this.els.length; i++) this.makeDraggable(this.els[i]);
|
for (var i = 0; i < this.els.length; i++) this.makeDraggable(this.els[i])
|
||||||
},
|
},
|
||||||
|
|
||||||
makeDraggable: function (node) {
|
makeDraggable: function (node) {
|
||||||
node.draggable = true;
|
node.draggable = true
|
||||||
L.DomEvent.on(node, 'dragstart', this.onDragStart, this);
|
L.DomEvent.on(node, 'dragstart', this.onDragStart, this)
|
||||||
L.DomEvent.on(node, 'dragenter', this.onDragEnter, this);
|
L.DomEvent.on(node, 'dragenter', this.onDragEnter, this)
|
||||||
L.DomEvent.on(node, 'dragover', this.onDragOver, this);
|
L.DomEvent.on(node, 'dragover', this.onDragOver, this)
|
||||||
L.DomEvent.on(node, 'dragleave', this.onDragLeave, this);
|
L.DomEvent.on(node, 'dragleave', this.onDragLeave, this)
|
||||||
L.DomEvent.on(node, 'drop', this.onDrop, this);
|
L.DomEvent.on(node, 'drop', this.onDrop, this)
|
||||||
L.DomEvent.on(node, 'dragend', this.onDragEnd, this);
|
L.DomEvent.on(node, 'dragend', this.onDragEnd, this)
|
||||||
},
|
},
|
||||||
|
|
||||||
nodeIndex: function (node) {
|
nodeIndex: function (node) {
|
||||||
return Array.prototype.indexOf.call(this.parent.children, node);
|
return Array.prototype.indexOf.call(this.parent.children, node)
|
||||||
},
|
},
|
||||||
|
|
||||||
findTarget: function (node) {
|
findTarget: function (node) {
|
||||||
while (node) {
|
while (node) {
|
||||||
if (this.nodeIndex(node) !== -1) return node;
|
if (this.nodeIndex(node) !== -1) return node
|
||||||
node = node.parentNode;
|
node = node.parentNode
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
onDragStart: function (e) {
|
onDragStart: function (e) {
|
||||||
// e.target is the source node.
|
// e.target is the source node.
|
||||||
this.src = e.target;
|
this.src = e.target
|
||||||
this.initialIndex = this.nodeIndex(this.src);
|
this.initialIndex = this.nodeIndex(this.src)
|
||||||
this.srcBackgroundColor = this.src.style.backgroundColor;
|
this.srcBackgroundColor = this.src.style.backgroundColor
|
||||||
this.src.style.backgroundColor = this.options.color;
|
this.src.style.backgroundColor = this.options.color
|
||||||
e.dataTransfer.effectAllowed = 'move';
|
e.dataTransfer.effectAllowed = 'move'
|
||||||
e.dataTransfer.setData('text/html', this.src.innerHTML);
|
e.dataTransfer.setData('text/html', this.src.innerHTML)
|
||||||
},
|
},
|
||||||
|
|
||||||
onDragOver: function (e) {
|
onDragOver: function (e) {
|
||||||
if (e.preventDefault) e.preventDefault(); // Necessary. Allows us to drop.
|
if (e.preventDefault) e.preventDefault() // Necessary. Allows us to drop.
|
||||||
e.dataTransfer.dropEffect = 'move';
|
e.dataTransfer.dropEffect = 'move'
|
||||||
return false;
|
return false
|
||||||
},
|
},
|
||||||
|
|
||||||
onDragEnter: function (e) {
|
onDragEnter: function (e) {
|
||||||
// e.target is the current hover target.
|
// e.target is the current hover target.
|
||||||
var dst = this.findTarget(e.target);
|
var dst = this.findTarget(e.target)
|
||||||
if (!dst || dst === this.src) return;
|
if (!dst || dst === this.src) return
|
||||||
this.dst = dst;
|
this.dst = dst
|
||||||
var targetIndex = this.nodeIndex(this.dst),
|
var targetIndex = this.nodeIndex(this.dst),
|
||||||
srcIndex = this.nodeIndex(this.src);
|
srcIndex = this.nodeIndex(this.src)
|
||||||
if (targetIndex > srcIndex) this.parent.insertBefore(this.dst, this.src);
|
if (targetIndex > srcIndex) this.parent.insertBefore(this.dst, this.src)
|
||||||
else this.parent.insertBefore(this.src, this.dst);
|
else this.parent.insertBefore(this.src, this.dst)
|
||||||
},
|
},
|
||||||
|
|
||||||
onDragLeave: function (e) {
|
onDragLeave: function (e) {
|
||||||
|
@ -537,24 +610,23 @@ L.U.Orderable = L.Evented.extend({
|
||||||
|
|
||||||
onDrop: function (e) {
|
onDrop: function (e) {
|
||||||
// e.target is current target element.
|
// e.target is current target element.
|
||||||
if (e.stopPropagation) e.stopPropagation(); // Stops the browser from redirecting.
|
if (e.stopPropagation) e.stopPropagation() // Stops the browser from redirecting.
|
||||||
if (!this.dst) return;
|
if (!this.dst) return
|
||||||
this.fire('drop', {
|
this.fire('drop', {
|
||||||
src: this.src,
|
src: this.src,
|
||||||
initialIndex: this.initialIndex,
|
initialIndex: this.initialIndex,
|
||||||
finalIndex: this.nodeIndex(this.src),
|
finalIndex: this.nodeIndex(this.src),
|
||||||
dst: this.dst
|
dst: this.dst,
|
||||||
});
|
})
|
||||||
return false;
|
return false
|
||||||
},
|
},
|
||||||
|
|
||||||
onDragEnd: function (e) {
|
onDragEnd: function (e) {
|
||||||
// e.target is the source node.
|
// e.target is the source node.
|
||||||
this.src.style.backgroundColor = this.srcBackgroundColor;
|
this.src.style.backgroundColor = this.srcBackgroundColor
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.LatLng.prototype.isValid = function () {
|
L.LatLng.prototype.isValid = function () {
|
||||||
return !isNaN(this.lat) && !isNaN(this.lng);
|
return !isNaN(this.lat) && !isNaN(this.lng)
|
||||||
}
|
}
|
||||||
|
|
File diff suppressed because it is too large
Load diff
File diff suppressed because it is too large
Load diff
|
@ -1,81 +1,88 @@
|
||||||
L.U.Icon = L.DivIcon.extend({
|
L.U.Icon = L.DivIcon.extend({
|
||||||
initialize: function (map, options) {
|
initialize: function (map, options) {
|
||||||
this.map = map;
|
this.map = map
|
||||||
var default_options = {
|
var default_options = {
|
||||||
iconSize: null, // Made in css
|
iconSize: null, // Made in css
|
||||||
iconUrl: this.map.getDefaultOption('iconUrl'),
|
iconUrl: this.map.getDefaultOption('iconUrl'),
|
||||||
feature: null
|
feature: null,
|
||||||
};
|
}
|
||||||
options = L.Util.extend({}, default_options, options);
|
options = L.Util.extend({}, default_options, options)
|
||||||
L.Icon.prototype.initialize.call(this, options);
|
L.Icon.prototype.initialize.call(this, options)
|
||||||
this.feature = this.options.feature;
|
this.feature = this.options.feature
|
||||||
if (this.feature && this.feature.isReadOnly()) {
|
if (this.feature && this.feature.isReadOnly()) {
|
||||||
this.options.className += ' readonly';
|
this.options.className += ' readonly'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
_getIconUrl: function (name) {
|
_getIconUrl: function (name) {
|
||||||
var url;
|
var url
|
||||||
if(this.feature && this.feature._getIconUrl(name)) url = this.feature._getIconUrl(name);
|
if (this.feature && this.feature._getIconUrl(name))
|
||||||
else url = this.options[name + 'Url'];
|
url = this.feature._getIconUrl(name)
|
||||||
return this.formatUrl(url, this.feature);
|
else url = this.options[name + 'Url']
|
||||||
|
return this.formatUrl(url, this.feature)
|
||||||
},
|
},
|
||||||
|
|
||||||
_getColor: function () {
|
_getColor: function () {
|
||||||
var color;
|
var color
|
||||||
if(this.feature) color = this.feature.getOption('color');
|
if (this.feature) color = this.feature.getOption('color')
|
||||||
else if (this.options.color) color = this.options.color;
|
else if (this.options.color) color = this.options.color
|
||||||
else color = this.map.getDefaultOption('color');
|
else color = this.map.getDefaultOption('color')
|
||||||
return color;
|
return color
|
||||||
},
|
},
|
||||||
|
|
||||||
formatUrl: function (url, feature) {
|
formatUrl: function (url, feature) {
|
||||||
return L.Util.greedyTemplate(url || '', feature ? feature.extendedProperties() : {});
|
return L.Util.greedyTemplate(url || '', feature ? feature.extendedProperties() : {})
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.U.Icon.Default = L.U.Icon.extend({
|
L.U.Icon.Default = L.U.Icon.extend({
|
||||||
default_options: {
|
default_options: {
|
||||||
iconAnchor: new L.Point(16, 40),
|
iconAnchor: new L.Point(16, 40),
|
||||||
popupAnchor: new L.Point(0, -40),
|
popupAnchor: new L.Point(0, -40),
|
||||||
tooltipAnchor: new L.Point(16, -24),
|
tooltipAnchor: new L.Point(16, -24),
|
||||||
className: 'umap-div-icon'
|
className: 'umap-div-icon',
|
||||||
},
|
},
|
||||||
|
|
||||||
initialize: function (map, options) {
|
initialize: function (map, options) {
|
||||||
options = L.Util.extend({}, this.default_options, options);
|
options = L.Util.extend({}, this.default_options, options)
|
||||||
L.U.Icon.prototype.initialize.call(this, map, options);
|
L.U.Icon.prototype.initialize.call(this, map, options)
|
||||||
},
|
},
|
||||||
|
|
||||||
_setColor: function () {
|
_setColor: function () {
|
||||||
var color = this._getColor();
|
var color = this._getColor()
|
||||||
this.elements.container.style.backgroundColor = color;
|
this.elements.container.style.backgroundColor = color
|
||||||
this.elements.arrow.style.borderTopColor = color;
|
this.elements.arrow.style.borderTopColor = color
|
||||||
},
|
},
|
||||||
|
|
||||||
createIcon: function () {
|
createIcon: function () {
|
||||||
this.elements = {};
|
this.elements = {}
|
||||||
this.elements.main = L.DomUtil.create('div');
|
this.elements.main = L.DomUtil.create('div')
|
||||||
this.elements.container = L.DomUtil.create('div', 'icon_container', this.elements.main);
|
this.elements.container = L.DomUtil.create(
|
||||||
this.elements.arrow = L.DomUtil.create('div', 'icon_arrow', this.elements.main);
|
'div',
|
||||||
var src = this._getIconUrl('icon');
|
'icon_container',
|
||||||
|
this.elements.main
|
||||||
|
)
|
||||||
|
this.elements.arrow = L.DomUtil.create('div', 'icon_arrow', this.elements.main)
|
||||||
|
var src = this._getIconUrl('icon')
|
||||||
if (src) {
|
if (src) {
|
||||||
// An url.
|
// An url.
|
||||||
if (src.indexOf('http') === 0 || src.indexOf('/') === 0 || src.indexOf('data:image') === 0) {
|
if (
|
||||||
this.elements.img = L.DomUtil.create('img', null, this.elements.container);
|
src.indexOf('http') === 0 ||
|
||||||
this.elements.img.src = src;
|
src.indexOf('/') === 0 ||
|
||||||
|
src.indexOf('data:image') === 0
|
||||||
|
) {
|
||||||
|
this.elements.img = L.DomUtil.create('img', null, this.elements.container)
|
||||||
|
this.elements.img.src = src
|
||||||
} else {
|
} else {
|
||||||
this.elements.span = L.DomUtil.create('span', null, this.elements.container)
|
this.elements.span = L.DomUtil.create('span', null, this.elements.container)
|
||||||
this.elements.span.textContent = src;
|
this.elements.span.textContent = src
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this._setColor();
|
this._setColor()
|
||||||
this._setIconStyles(this.elements.main, 'icon');
|
this._setIconStyles(this.elements.main, 'icon')
|
||||||
return this.elements.main;
|
return this.elements.main
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.U.Icon.Circle = L.U.Icon.extend({
|
L.U.Icon.Circle = L.U.Icon.extend({
|
||||||
initialize: function (map, options) {
|
initialize: function (map, options) {
|
||||||
|
@ -83,107 +90,110 @@ L.U.Icon.Circle = L.U.Icon.extend({
|
||||||
iconAnchor: new L.Point(6, 6),
|
iconAnchor: new L.Point(6, 6),
|
||||||
popupAnchor: new L.Point(0, -6),
|
popupAnchor: new L.Point(0, -6),
|
||||||
tooltipAnchor: new L.Point(6, 0),
|
tooltipAnchor: new L.Point(6, 0),
|
||||||
className: 'umap-circle-icon'
|
className: 'umap-circle-icon',
|
||||||
};
|
}
|
||||||
options = L.Util.extend({}, default_options, options);
|
options = L.Util.extend({}, default_options, options)
|
||||||
L.U.Icon.prototype.initialize.call(this, map, options);
|
L.U.Icon.prototype.initialize.call(this, map, options)
|
||||||
},
|
},
|
||||||
|
|
||||||
_setColor: function () {
|
_setColor: function () {
|
||||||
this.elements.main.style.backgroundColor = this._getColor();
|
this.elements.main.style.backgroundColor = this._getColor()
|
||||||
},
|
},
|
||||||
|
|
||||||
createIcon: function () {
|
createIcon: function () {
|
||||||
this.elements = {};
|
this.elements = {}
|
||||||
this.elements.main = L.DomUtil.create('div');
|
this.elements.main = L.DomUtil.create('div')
|
||||||
this.elements.main.innerHTML = ' ';
|
this.elements.main.innerHTML = ' '
|
||||||
this._setColor();
|
this._setColor()
|
||||||
this._setIconStyles(this.elements.main, 'icon');
|
this._setIconStyles(this.elements.main, 'icon')
|
||||||
return this.elements.main;
|
return this.elements.main
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.U.Icon.Drop = L.U.Icon.Default.extend({
|
L.U.Icon.Drop = L.U.Icon.Default.extend({
|
||||||
default_options: {
|
default_options: {
|
||||||
iconAnchor: new L.Point(16, 42),
|
iconAnchor: new L.Point(16, 42),
|
||||||
popupAnchor: new L.Point(0, -42),
|
popupAnchor: new L.Point(0, -42),
|
||||||
tooltipAnchor: new L.Point(16, -24),
|
tooltipAnchor: new L.Point(16, -24),
|
||||||
className: 'umap-drop-icon'
|
className: 'umap-drop-icon',
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
L.U.Icon.Ball = L.U.Icon.Default.extend({
|
L.U.Icon.Ball = L.U.Icon.Default.extend({
|
||||||
default_options: {
|
default_options: {
|
||||||
iconAnchor: new L.Point(8, 30),
|
iconAnchor: new L.Point(8, 30),
|
||||||
popupAnchor: new L.Point(0, -28),
|
popupAnchor: new L.Point(0, -28),
|
||||||
tooltipAnchor: new L.Point(8, -23),
|
tooltipAnchor: new L.Point(8, -23),
|
||||||
className: 'umap-ball-icon'
|
className: 'umap-ball-icon',
|
||||||
},
|
},
|
||||||
|
|
||||||
createIcon: function () {
|
createIcon: function () {
|
||||||
this.elements = {};
|
this.elements = {}
|
||||||
this.elements.main = L.DomUtil.create('div');
|
this.elements.main = L.DomUtil.create('div')
|
||||||
this.elements.container = L.DomUtil.create('div', 'icon_container', this.elements.main);
|
this.elements.container = L.DomUtil.create(
|
||||||
this.elements.arrow = L.DomUtil.create('div', 'icon_arrow', this.elements.main);
|
'div',
|
||||||
this._setColor();
|
'icon_container',
|
||||||
this._setIconStyles(this.elements.main, 'icon');
|
this.elements.main
|
||||||
return this.elements.main;
|
)
|
||||||
|
this.elements.arrow = L.DomUtil.create('div', 'icon_arrow', this.elements.main)
|
||||||
|
this._setColor()
|
||||||
|
this._setIconStyles(this.elements.main, 'icon')
|
||||||
|
return this.elements.main
|
||||||
},
|
},
|
||||||
|
|
||||||
_setColor: function () {
|
_setColor: function () {
|
||||||
var color = this._getColor('color'),
|
var color = this._getColor('color'),
|
||||||
background;
|
background
|
||||||
if (L.Browser.ielt9) {
|
if (L.Browser.ielt9) {
|
||||||
background = color;
|
background = color
|
||||||
}
|
} else if (L.Browser.webkit) {
|
||||||
else if (L.Browser.webkit) {
|
background =
|
||||||
background = '-webkit-gradient( radial, 6 38%, 0, 6 38%, 8, from(white), to(' + color + ') )';
|
'-webkit-gradient( radial, 6 38%, 0, 6 38%, 8, from(white), to(' + color + ') )'
|
||||||
}
|
} else {
|
||||||
else {
|
background =
|
||||||
background = 'radial-gradient(circle at 6px 38% , white -4px, ' + color + ' 8px) repeat scroll 0 0 transparent';
|
'radial-gradient(circle at 6px 38% , white -4px, ' +
|
||||||
}
|
color +
|
||||||
this.elements.container.style.background = background;
|
' 8px) repeat scroll 0 0 transparent'
|
||||||
}
|
}
|
||||||
|
this.elements.container.style.background = background
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
});
|
var _CACHE_COLOR = {}
|
||||||
|
|
||||||
var _CACHE_COLOR = {};
|
|
||||||
L.U.Icon.Cluster = L.DivIcon.extend({
|
L.U.Icon.Cluster = L.DivIcon.extend({
|
||||||
options: {
|
options: {
|
||||||
iconSize: [40, 40]
|
iconSize: [40, 40],
|
||||||
},
|
},
|
||||||
|
|
||||||
initialize: function (datalayer, cluster) {
|
initialize: function (datalayer, cluster) {
|
||||||
this.datalayer = datalayer;
|
this.datalayer = datalayer
|
||||||
this.cluster = cluster;
|
this.cluster = cluster
|
||||||
},
|
},
|
||||||
|
|
||||||
createIcon: function () {
|
createIcon: function () {
|
||||||
var container = L.DomUtil.create('div', 'leaflet-marker-icon marker-cluster'),
|
var container = L.DomUtil.create('div', 'leaflet-marker-icon marker-cluster'),
|
||||||
div = L.DomUtil.create('div', '', container),
|
div = L.DomUtil.create('div', '', container),
|
||||||
span = L.DomUtil.create('span', '', div),
|
span = L.DomUtil.create('span', '', div),
|
||||||
backgroundColor = this.datalayer.getColor();
|
backgroundColor = this.datalayer.getColor()
|
||||||
span.textContent = this.cluster.getChildCount();
|
span.textContent = this.cluster.getChildCount()
|
||||||
div.style.backgroundColor = backgroundColor;
|
div.style.backgroundColor = backgroundColor
|
||||||
return container;
|
return container
|
||||||
},
|
},
|
||||||
|
|
||||||
computeTextColor: function (el) {
|
computeTextColor: function (el) {
|
||||||
var color,
|
var color,
|
||||||
backgroundColor = this.datalayer.getColor();
|
backgroundColor = this.datalayer.getColor()
|
||||||
if (this.datalayer.options.cluster && this.datalayer.options.cluster.textColor) {
|
if (this.datalayer.options.cluster && this.datalayer.options.cluster.textColor) {
|
||||||
color = this.datalayer.options.cluster.textColor;
|
color = this.datalayer.options.cluster.textColor
|
||||||
}
|
}
|
||||||
if (!color) {
|
if (!color) {
|
||||||
if (typeof _CACHE_COLOR[backgroundColor] === 'undefined') {
|
if (typeof _CACHE_COLOR[backgroundColor] === 'undefined') {
|
||||||
color = L.DomUtil.TextColorFromBackgroundColor(el);
|
color = L.DomUtil.TextColorFromBackgroundColor(el)
|
||||||
_CACHE_COLOR[backgroundColor] = color;
|
_CACHE_COLOR[backgroundColor] = color
|
||||||
} else {
|
} else {
|
||||||
color = _CACHE_COLOR[backgroundColor];
|
color = _CACHE_COLOR[backgroundColor]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return color;
|
return color
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
File diff suppressed because it is too large
Load diff
File diff suppressed because it is too large
Load diff
|
@ -1,143 +1,196 @@
|
||||||
// Dedicated object so we can deal with a separate dirty status, and thus
|
// Dedicated object so we can deal with a separate dirty status, and thus
|
||||||
// call the endpoint only when needed, saving one call at each save.
|
// call the endpoint only when needed, saving one call at each save.
|
||||||
L.U.MapPermissions = L.Class.extend({
|
L.U.MapPermissions = L.Class.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
owner: null,
|
owner: null,
|
||||||
editors: [],
|
editors: [],
|
||||||
share_status: null,
|
share_status: null,
|
||||||
edit_status: null
|
edit_status: null,
|
||||||
},
|
},
|
||||||
|
|
||||||
initialize: function (map) {
|
initialize: function (map) {
|
||||||
this.setOptions(map.options.permissions);
|
this.setOptions(map.options.permissions)
|
||||||
this.map = map;
|
this.map = map
|
||||||
var isDirty = false,
|
var isDirty = false,
|
||||||
self = this;
|
self = this
|
||||||
try {
|
try {
|
||||||
Object.defineProperty(this, 'isDirty', {
|
Object.defineProperty(this, 'isDirty', {
|
||||||
get: function () {
|
get: function () {
|
||||||
return isDirty;
|
return isDirty
|
||||||
},
|
},
|
||||||
set: function (status) {
|
set: function (status) {
|
||||||
isDirty = status;
|
isDirty = status
|
||||||
if (status) self.map.isDirty = status;
|
if (status) self.map.isDirty = status
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
}
|
} catch (e) {
|
||||||
catch (e) {
|
|
||||||
// Certainly IE8, which has a limited version of defineProperty
|
// Certainly IE8, which has a limited version of defineProperty
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
setOptions: function (options) {
|
setOptions: function (options) {
|
||||||
this.options = L.Util.setOptions(this, options);
|
this.options = L.Util.setOptions(this, options)
|
||||||
},
|
},
|
||||||
|
|
||||||
isOwner: function () {
|
isOwner: function () {
|
||||||
return this.map.options.user && this.map.options.permissions.owner && this.map.options.user.id == this.map.options.permissions.owner.id;
|
return (
|
||||||
|
this.map.options.user &&
|
||||||
|
this.map.options.permissions.owner &&
|
||||||
|
this.map.options.user.id == this.map.options.permissions.owner.id
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
isAnonymousMap: function () {
|
isAnonymousMap: function () {
|
||||||
return !this.map.options.permissions.owner;
|
return !this.map.options.permissions.owner
|
||||||
},
|
},
|
||||||
|
|
||||||
getMap: function () {
|
getMap: function () {
|
||||||
return this.map;
|
return this.map
|
||||||
},
|
},
|
||||||
|
|
||||||
edit: function () {
|
edit: function () {
|
||||||
if (!this.map.options.umap_id) return this.map.ui.alert({content: L._('Please save the map first'), level: 'info'});
|
if (!this.map.options.umap_id)
|
||||||
|
return this.map.ui.alert({
|
||||||
|
content: L._('Please save the map first'),
|
||||||
|
level: 'info',
|
||||||
|
})
|
||||||
var container = L.DomUtil.create('div', 'permissions-panel'),
|
var container = L.DomUtil.create('div', 'permissions-panel'),
|
||||||
fields = [],
|
fields = [],
|
||||||
title = L.DomUtil.create('h4', '', container);
|
title = L.DomUtil.create('h4', '', container)
|
||||||
if (this.isAnonymousMap()) {
|
if (this.isAnonymousMap()) {
|
||||||
if (this.options.anonymous_edit_url) {
|
if (this.options.anonymous_edit_url) {
|
||||||
var helpText = L._('Secret edit link is:<br>{link}', {link: this.options.anonymous_edit_url});
|
var helpText = L._('Secret edit link is:<br>{link}', {
|
||||||
fields.push(['options.edit_status', {handler: 'IntSelect', label: L._('Who can edit'), selectOptions: this.map.options.anonymous_edit_statuses, helpText: helpText}]);
|
link: this.options.anonymous_edit_url,
|
||||||
|
})
|
||||||
|
fields.push([
|
||||||
|
'options.edit_status',
|
||||||
|
{
|
||||||
|
handler: 'IntSelect',
|
||||||
|
label: L._('Who can edit'),
|
||||||
|
selectOptions: this.map.options.anonymous_edit_statuses,
|
||||||
|
helpText: helpText,
|
||||||
|
},
|
||||||
|
])
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
if (this.isOwner()) {
|
if (this.isOwner()) {
|
||||||
fields.push(['options.edit_status', {handler: 'IntSelect', label: L._('Who can edit'), selectOptions: this.map.options.edit_statuses}]);
|
fields.push([
|
||||||
fields.push(['options.share_status', {handler: 'IntSelect', label: L._('Who can view'), selectOptions: this.map.options.share_statuses}]);
|
'options.edit_status',
|
||||||
fields.push(['options.owner', {handler: 'ManageOwner', label: L._("Map's owner")}]);
|
{
|
||||||
|
handler: 'IntSelect',
|
||||||
|
label: L._('Who can edit'),
|
||||||
|
selectOptions: this.map.options.edit_statuses,
|
||||||
|
},
|
||||||
|
])
|
||||||
|
fields.push([
|
||||||
|
'options.share_status',
|
||||||
|
{
|
||||||
|
handler: 'IntSelect',
|
||||||
|
label: L._('Who can view'),
|
||||||
|
selectOptions: this.map.options.share_statuses,
|
||||||
|
},
|
||||||
|
])
|
||||||
|
fields.push([
|
||||||
|
'options.owner',
|
||||||
|
{ handler: 'ManageOwner', label: L._("Map's owner") },
|
||||||
|
])
|
||||||
}
|
}
|
||||||
fields.push(['options.editors', {handler: 'ManageEditors', label: L._("Map's editors")}]);
|
fields.push([
|
||||||
|
'options.editors',
|
||||||
|
{ handler: 'ManageEditors', label: L._("Map's editors") },
|
||||||
|
])
|
||||||
}
|
}
|
||||||
title.textContent = L._('Update permissions');
|
title.textContent = L._('Update permissions')
|
||||||
var builder = new L.U.FormBuilder(this, fields);
|
var builder = new L.U.FormBuilder(this, fields)
|
||||||
var form = builder.build();
|
var form = builder.build()
|
||||||
container.appendChild(form);
|
container.appendChild(form)
|
||||||
if (this.isAnonymousMap() && this.map.options.user) {
|
if (this.isAnonymousMap() && this.map.options.user) {
|
||||||
// We have a user, and this user has come through here, so they can edit the map, so let's allow to own the map.
|
// We have a user, and this user has come through here, so they can edit the map, so let's allow to own the map.
|
||||||
// Note: real check is made on the back office anyway.
|
// Note: real check is made on the back office anyway.
|
||||||
var advancedActions = L.DomUtil.createFieldset(container, L._('Advanced actions'));
|
var advancedActions = L.DomUtil.createFieldset(container, L._('Advanced actions'))
|
||||||
var advancedButtons = L.DomUtil.create('div', 'button-bar', advancedActions);
|
var advancedButtons = L.DomUtil.create('div', 'button-bar', advancedActions)
|
||||||
var download = L.DomUtil.create('a', 'button', advancedButtons);
|
var download = L.DomUtil.create('a', 'button', advancedButtons)
|
||||||
download.href = '#';
|
download.href = '#'
|
||||||
download.textContent = L._('Attach the map to my account');
|
download.textContent = L._('Attach the map to my account')
|
||||||
L.DomEvent
|
L.DomEvent.on(download, 'click', L.DomEvent.stop).on(
|
||||||
.on(download, 'click', L.DomEvent.stop)
|
download,
|
||||||
.on(download, 'click', this.attach, this);
|
'click',
|
||||||
|
this.attach,
|
||||||
|
this
|
||||||
|
)
|
||||||
}
|
}
|
||||||
this.map.ui.openPanel({data: {html: container}, className: 'dark'});
|
this.map.ui.openPanel({ data: { html: container }, className: 'dark' })
|
||||||
},
|
},
|
||||||
|
|
||||||
attach: function () {
|
attach: function () {
|
||||||
this.map.post(this.getAttachUrl(), {
|
this.map.post(this.getAttachUrl(), {
|
||||||
callback: function () {
|
callback: function () {
|
||||||
this.options.owner = this.map.options.user;
|
this.options.owner = this.map.options.user
|
||||||
this.map.ui.alert({content: L._("Map has been attached to your account"), level: 'info'});
|
this.map.ui.alert({
|
||||||
this.map.ui.closePanel();
|
content: L._('Map has been attached to your account'),
|
||||||
|
level: 'info',
|
||||||
|
})
|
||||||
|
this.map.ui.closePanel()
|
||||||
},
|
},
|
||||||
context: this
|
context: this,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
save: function () {
|
save: function () {
|
||||||
if (!this.isDirty) return this.map.continueSaving();
|
if (!this.isDirty) return this.map.continueSaving()
|
||||||
var formData = new FormData();
|
var formData = new FormData()
|
||||||
if (!this.isAnonymousMap() && this.options.editors) {
|
if (!this.isAnonymousMap() && this.options.editors) {
|
||||||
var editors = this.options.editors.map(function (u) {return u.id});
|
var editors = this.options.editors.map(function (u) {
|
||||||
for (var i = 0; i < this.options.editors.length; i++) formData.append('editors', this.options.editors[i].id);
|
return u.id
|
||||||
|
})
|
||||||
|
for (var i = 0; i < this.options.editors.length; i++)
|
||||||
|
formData.append('editors', this.options.editors[i].id)
|
||||||
}
|
}
|
||||||
if (this.isOwner() || this.isAnonymousMap()) formData.append('edit_status', this.options.edit_status);
|
if (this.isOwner() || this.isAnonymousMap())
|
||||||
|
formData.append('edit_status', this.options.edit_status)
|
||||||
if (this.isOwner()) {
|
if (this.isOwner()) {
|
||||||
formData.append('owner', this.options.owner && this.options.owner.id);
|
formData.append('owner', this.options.owner && this.options.owner.id)
|
||||||
formData.append('share_status', this.options.share_status);
|
formData.append('share_status', this.options.share_status)
|
||||||
}
|
}
|
||||||
this.map.post(this.getUrl(), {
|
this.map.post(this.getUrl(), {
|
||||||
data: formData,
|
data: formData,
|
||||||
context: this,
|
context: this,
|
||||||
callback: function (data) {
|
callback: function (data) {
|
||||||
this.commit();
|
this.commit()
|
||||||
this.isDirty = false;
|
this.isDirty = false
|
||||||
this.map.continueSaving();
|
this.map.continueSaving()
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
getUrl: function () {
|
getUrl: function () {
|
||||||
return L.Util.template(this.map.options.urls.map_update_permissions, {'map_id': this.map.options.umap_id});
|
return L.Util.template(this.map.options.urls.map_update_permissions, {
|
||||||
|
map_id: this.map.options.umap_id,
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
getAttachUrl: function () {
|
getAttachUrl: function () {
|
||||||
return L.Util.template(this.map.options.urls.map_attach_owner, {'map_id': this.map.options.umap_id});
|
return L.Util.template(this.map.options.urls.map_attach_owner, {
|
||||||
|
map_id: this.map.options.umap_id,
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
addOwnerLink: function (element, container) {
|
addOwnerLink: function (element, container) {
|
||||||
if (this.options.owner && this.options.owner.name && this.options.owner.url) {
|
if (this.options.owner && this.options.owner.name && this.options.owner.url) {
|
||||||
var ownerContainer = L.DomUtil.add(element, 'umap-map-owner', container, ' ' + L._('by') + ' '),
|
var ownerContainer = L.DomUtil.add(
|
||||||
owner = L.DomUtil.create('a');
|
element,
|
||||||
owner.href = this.options.owner.url;
|
'umap-map-owner',
|
||||||
owner.textContent = this.options.owner.name;
|
container,
|
||||||
ownerContainer.appendChild(owner);
|
' ' + L._('by') + ' '
|
||||||
|
),
|
||||||
|
owner = L.DomUtil.create('a')
|
||||||
|
owner.href = this.options.owner.url
|
||||||
|
owner.textContent = this.options.owner.name
|
||||||
|
ownerContainer.appendChild(owner)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
commit: function () {
|
commit: function () {
|
||||||
L.Util.extend(this.map.options.permissions, this.options);
|
L.Util.extend(this.map.options.permissions, this.options)
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
|
@ -1,93 +1,97 @@
|
||||||
/* Shapes */
|
/* Shapes */
|
||||||
|
|
||||||
L.U.Popup = L.Popup.extend({
|
L.U.Popup = L.Popup.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
parseTemplate: true
|
parseTemplate: true,
|
||||||
},
|
},
|
||||||
|
|
||||||
initialize: function (feature) {
|
initialize: function (feature) {
|
||||||
this.feature = feature;
|
this.feature = feature
|
||||||
this.container = L.DomUtil.create('div', 'umap-popup');
|
this.container = L.DomUtil.create('div', 'umap-popup')
|
||||||
this.format();
|
this.format()
|
||||||
L.Popup.prototype.initialize.call(this, {}, feature);
|
L.Popup.prototype.initialize.call(this, {}, feature)
|
||||||
this.setContent(this.container);
|
this.setContent(this.container)
|
||||||
},
|
},
|
||||||
|
|
||||||
format: function () {
|
format: function () {
|
||||||
var mode = this.feature.getOption('popupTemplate') || 'Default',
|
var mode = this.feature.getOption('popupTemplate') || 'Default',
|
||||||
klass = L.U.PopupTemplate[mode] || L.U.PopupTemplate.Default;
|
klass = L.U.PopupTemplate[mode] || L.U.PopupTemplate.Default
|
||||||
this.content = new klass(this.feature, this.container);
|
this.content = new klass(this.feature, this.container)
|
||||||
this.content.render();
|
this.content.render()
|
||||||
var els = this.container.querySelectorAll('img,iframe');
|
var els = this.container.querySelectorAll('img,iframe')
|
||||||
for (var i = 0; i < els.length; i++) {
|
for (var i = 0; i < els.length; i++) {
|
||||||
this.onElementLoaded(els[i]);
|
this.onElementLoaded(els[i])
|
||||||
}
|
}
|
||||||
if (!els.length && this.container.textContent.replace('\n', '') === '') {
|
if (!els.length && this.container.textContent.replace('\n', '') === '') {
|
||||||
this.container.innerHTML = '';
|
this.container.innerHTML = ''
|
||||||
L.DomUtil.add('h3', '', this.container, this.feature.getDisplayName());
|
L.DomUtil.add('h3', '', this.container, this.feature.getDisplayName())
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
onElementLoaded: function (el) {
|
onElementLoaded: function (el) {
|
||||||
L.DomEvent.on(el, 'load', function () {
|
L.DomEvent.on(
|
||||||
this._updateLayout();
|
el,
|
||||||
this._updatePosition();
|
'load',
|
||||||
this._adjustPan();
|
function () {
|
||||||
}, this);
|
this._updateLayout()
|
||||||
}
|
this._updatePosition()
|
||||||
|
this._adjustPan()
|
||||||
});
|
},
|
||||||
|
this
|
||||||
|
)
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
L.U.Popup.Large = L.U.Popup.extend({
|
L.U.Popup.Large = L.U.Popup.extend({
|
||||||
options: {
|
options: {
|
||||||
maxWidth: 500,
|
maxWidth: 500,
|
||||||
className: 'umap-popup-large'
|
className: 'umap-popup-large',
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
|
|
||||||
L.U.Popup.Panel = L.U.Popup.extend({
|
L.U.Popup.Panel = L.U.Popup.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
zoomAnimation: false
|
zoomAnimation: false,
|
||||||
},
|
},
|
||||||
|
|
||||||
allButton: function () {
|
allButton: function () {
|
||||||
var button = L.DomUtil.create('li', '');
|
var button = L.DomUtil.create('li', '')
|
||||||
L.DomUtil.create('i', 'umap-icon-16 umap-list', button);
|
L.DomUtil.create('i', 'umap-icon-16 umap-list', button)
|
||||||
var label = L.DomUtil.create('span', '', button);
|
var label = L.DomUtil.create('span', '', button)
|
||||||
label.textContent = label.title = L._('See all');
|
label.textContent = label.title = L._('See all')
|
||||||
L.DomEvent.on(button, 'click', this.feature.map.openBrowser, this.feature.map);
|
L.DomEvent.on(button, 'click', this.feature.map.openBrowser, this.feature.map)
|
||||||
return button;
|
return button
|
||||||
},
|
},
|
||||||
|
|
||||||
update: function () {
|
update: function () {
|
||||||
this.feature.map.ui.openPanel({data: {html: this._content}, actions: [this.allButton()]});
|
this.feature.map.ui.openPanel({
|
||||||
|
data: { html: this._content },
|
||||||
|
actions: [this.allButton()],
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
onRemove: function (map) {
|
onRemove: function (map) {
|
||||||
map.ui.closePanel();
|
map.ui.closePanel()
|
||||||
L.U.Popup.prototype.onRemove.call(this, map);
|
L.U.Popup.prototype.onRemove.call(this, map)
|
||||||
},
|
},
|
||||||
|
|
||||||
_initLayout: function () {this._container = L.DomUtil.create('span');},
|
_initLayout: function () {
|
||||||
|
this._container = L.DomUtil.create('span')
|
||||||
|
},
|
||||||
_updateLayout: function () {},
|
_updateLayout: function () {},
|
||||||
_updatePosition: function () {},
|
_updatePosition: function () {},
|
||||||
_adjustPan: function () {}
|
_adjustPan: function () {},
|
||||||
|
})
|
||||||
});
|
L.U.Popup.SimplePanel = L.U.Popup.Panel // Retrocompat.
|
||||||
L.U.Popup.SimplePanel = L.U.Popup.Panel; // Retrocompat.
|
|
||||||
|
|
||||||
/* Content templates */
|
/* Content templates */
|
||||||
|
|
||||||
L.U.PopupTemplate = {};
|
L.U.PopupTemplate = {}
|
||||||
|
|
||||||
L.U.PopupTemplate.Default = L.Class.extend({
|
L.U.PopupTemplate.Default = L.Class.extend({
|
||||||
|
|
||||||
initialize: function (feature, container) {
|
initialize: function (feature, container) {
|
||||||
this.feature = feature;
|
this.feature = feature
|
||||||
this.container = container;
|
this.container = container
|
||||||
},
|
},
|
||||||
|
|
||||||
renderTitle: function () {},
|
renderTitle: function () {},
|
||||||
|
@ -95,130 +99,141 @@ L.U.PopupTemplate.Default = L.Class.extend({
|
||||||
renderBody: function () {
|
renderBody: function () {
|
||||||
var template = this.feature.getOption('popupContentTemplate'),
|
var template = this.feature.getOption('popupContentTemplate'),
|
||||||
container = L.DomUtil.create('div', 'umap-popup-container'),
|
container = L.DomUtil.create('div', 'umap-popup-container'),
|
||||||
content = '', properties, center;
|
content = '',
|
||||||
properties = this.feature.extendedProperties();
|
properties,
|
||||||
|
center
|
||||||
|
properties = this.feature.extendedProperties()
|
||||||
// Resolve properties inside description
|
// Resolve properties inside description
|
||||||
properties.description = L.Util.greedyTemplate(this.feature.properties.description || '', properties);
|
properties.description = L.Util.greedyTemplate(
|
||||||
content = L.Util.greedyTemplate(template, properties);
|
this.feature.properties.description || '',
|
||||||
content = L.Util.toHTML(content);
|
properties
|
||||||
container.innerHTML = content;
|
)
|
||||||
return container;
|
content = L.Util.greedyTemplate(template, properties)
|
||||||
|
content = L.Util.toHTML(content)
|
||||||
|
container.innerHTML = content
|
||||||
|
return container
|
||||||
},
|
},
|
||||||
|
|
||||||
renderFooter: function () {
|
renderFooter: function () {
|
||||||
if (this.feature.hasPopupFooter()) {
|
if (this.feature.hasPopupFooter()) {
|
||||||
var footerContainer = L.DomUtil.create('div', 'umap-footer-container', this.container),
|
var footerContainer = L.DomUtil.create(
|
||||||
|
'div',
|
||||||
|
'umap-footer-container',
|
||||||
|
this.container
|
||||||
|
),
|
||||||
footer = L.DomUtil.create('ul', 'umap-popup-footer', footerContainer),
|
footer = L.DomUtil.create('ul', 'umap-popup-footer', footerContainer),
|
||||||
previousLi = L.DomUtil.create('li', 'previous', footer),
|
previousLi = L.DomUtil.create('li', 'previous', footer),
|
||||||
zoomLi = L.DomUtil.create('li', 'zoom', footer),
|
zoomLi = L.DomUtil.create('li', 'zoom', footer),
|
||||||
nextLi = L.DomUtil.create('li', 'next', footer),
|
nextLi = L.DomUtil.create('li', 'next', footer),
|
||||||
next = this.feature.getNext(),
|
next = this.feature.getNext(),
|
||||||
prev = this.feature.getPrevious();
|
prev = this.feature.getPrevious()
|
||||||
if (next) nextLi.title = L._('Go to «{feature}»', {feature: next.properties.name || L._('next')});
|
if (next)
|
||||||
if (prev) previousLi.title = L._('Go to «{feature}»', {feature: prev.properties.name || L._('previous')});
|
nextLi.title = L._('Go to «{feature}»', {
|
||||||
zoomLi.title = L._('Zoom to this feature');
|
feature: next.properties.name || L._('next'),
|
||||||
|
})
|
||||||
|
if (prev)
|
||||||
|
previousLi.title = L._('Go to «{feature}»', {
|
||||||
|
feature: prev.properties.name || L._('previous'),
|
||||||
|
})
|
||||||
|
zoomLi.title = L._('Zoom to this feature')
|
||||||
L.DomEvent.on(nextLi, 'click', function () {
|
L.DomEvent.on(nextLi, 'click', function () {
|
||||||
if (next) next.zoomTo({callback: next.view});
|
if (next) next.zoomTo({ callback: next.view })
|
||||||
});
|
})
|
||||||
L.DomEvent.on(previousLi, 'click', function () {
|
L.DomEvent.on(previousLi, 'click', function () {
|
||||||
if (prev) prev.zoomTo({callback: prev.view});
|
if (prev) prev.zoomTo({ callback: prev.view })
|
||||||
});
|
})
|
||||||
L.DomEvent.on(zoomLi, 'click', function () {
|
L.DomEvent.on(
|
||||||
this.zoomTo();
|
zoomLi,
|
||||||
}, this.feature);
|
'click',
|
||||||
|
function () {
|
||||||
|
this.zoomTo()
|
||||||
|
},
|
||||||
|
this.feature
|
||||||
|
)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
render: function () {
|
render: function () {
|
||||||
var title = this.renderTitle();
|
var title = this.renderTitle()
|
||||||
if (title) this.container.appendChild(title);
|
if (title) this.container.appendChild(title)
|
||||||
var body = this.renderBody();
|
var body = this.renderBody()
|
||||||
if (body) L.DomUtil.add('div', 'umap-popup-content', this.container, body);
|
if (body) L.DomUtil.add('div', 'umap-popup-content', this.container, body)
|
||||||
this.renderFooter();
|
this.renderFooter()
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.U.PopupTemplate.BaseWithTitle = L.U.PopupTemplate.Default.extend({
|
L.U.PopupTemplate.BaseWithTitle = L.U.PopupTemplate.Default.extend({
|
||||||
|
|
||||||
renderTitle: function () {
|
renderTitle: function () {
|
||||||
var title;
|
var title
|
||||||
if (this.feature.getDisplayName()) {
|
if (this.feature.getDisplayName()) {
|
||||||
title = L.DomUtil.create('h3', 'popup-title');
|
title = L.DomUtil.create('h3', 'popup-title')
|
||||||
title.textContent = this.feature.getDisplayName();
|
title.textContent = this.feature.getDisplayName()
|
||||||
}
|
}
|
||||||
return title;
|
return title
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
L.U.PopupTemplate.Table = L.U.PopupTemplate.BaseWithTitle.extend({
|
L.U.PopupTemplate.Table = L.U.PopupTemplate.BaseWithTitle.extend({
|
||||||
|
|
||||||
formatRow: function (key, value) {
|
formatRow: function (key, value) {
|
||||||
if (value.indexOf('http') === 0) {
|
if (value.indexOf('http') === 0) {
|
||||||
value = '<a href="' + value + '" target="_blank">' + value + '</a>';
|
value = '<a href="' + value + '" target="_blank">' + value + '</a>'
|
||||||
}
|
}
|
||||||
return value;
|
return value
|
||||||
},
|
},
|
||||||
|
|
||||||
addRow: function (container, key, value) {
|
addRow: function (container, key, value) {
|
||||||
var tr = L.DomUtil.create('tr', '', container);
|
var tr = L.DomUtil.create('tr', '', container)
|
||||||
L.DomUtil.add('th', '', tr, key);
|
L.DomUtil.add('th', '', tr, key)
|
||||||
L.DomUtil.add('td', '', tr, this.formatRow(key, value));
|
L.DomUtil.add('td', '', tr, this.formatRow(key, value))
|
||||||
},
|
},
|
||||||
|
|
||||||
renderBody: function () {
|
renderBody: function () {
|
||||||
var table = L.DomUtil.create('table');
|
var table = L.DomUtil.create('table')
|
||||||
|
|
||||||
for (var key in this.feature.properties) {
|
for (var key in this.feature.properties) {
|
||||||
if (typeof this.feature.properties[key] === 'object' || key === 'name') continue;
|
if (typeof this.feature.properties[key] === 'object' || key === 'name') continue
|
||||||
// TODO, manage links (url, mailto, wikipedia...)
|
// TODO, manage links (url, mailto, wikipedia...)
|
||||||
this.addRow(table, key, L.Util.escapeHTML(this.feature.properties[key]).trim());
|
this.addRow(table, key, L.Util.escapeHTML(this.feature.properties[key]).trim())
|
||||||
}
|
}
|
||||||
return table;
|
return table
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.U.PopupTemplate.GeoRSSImage = L.U.PopupTemplate.BaseWithTitle.extend({
|
L.U.PopupTemplate.GeoRSSImage = L.U.PopupTemplate.BaseWithTitle.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
minWidth: 300,
|
minWidth: 300,
|
||||||
maxWidth: 500,
|
maxWidth: 500,
|
||||||
className: 'umap-popup-large umap-georss-image'
|
className: 'umap-popup-large umap-georss-image',
|
||||||
},
|
},
|
||||||
|
|
||||||
renderBody: function () {
|
renderBody: function () {
|
||||||
var container = L.DomUtil.create('a');
|
var container = L.DomUtil.create('a')
|
||||||
container.href = this.feature.properties.link;
|
container.href = this.feature.properties.link
|
||||||
container.target = '_blank';
|
container.target = '_blank'
|
||||||
if (this.feature.properties.img) {
|
if (this.feature.properties.img) {
|
||||||
var img = L.DomUtil.create('img', '', container);
|
var img = L.DomUtil.create('img', '', container)
|
||||||
img.src = this.feature.properties.img;
|
img.src = this.feature.properties.img
|
||||||
// Sadly, we are unable to override this from JS the clean way
|
// Sadly, we are unable to override this from JS the clean way
|
||||||
// See https://github.com/Leaflet/Leaflet/commit/61d746818b99d362108545c151a27f09d60960ee#commitcomment-6061847
|
// See https://github.com/Leaflet/Leaflet/commit/61d746818b99d362108545c151a27f09d60960ee#commitcomment-6061847
|
||||||
img.style.maxWidth = this.options.maxWidth + 'px';
|
img.style.maxWidth = this.options.maxWidth + 'px'
|
||||||
img.style.maxHeight = this.options.maxWidth + 'px';
|
img.style.maxHeight = this.options.maxWidth + 'px'
|
||||||
this.onElementLoaded(img);
|
this.onElementLoaded(img)
|
||||||
}
|
}
|
||||||
return container;
|
return container
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
||||||
L.U.PopupTemplate.GeoRSSLink = L.U.PopupTemplate.Default.extend({
|
L.U.PopupTemplate.GeoRSSLink = L.U.PopupTemplate.Default.extend({
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
className: 'umap-georss-link'
|
className: 'umap-georss-link',
|
||||||
},
|
},
|
||||||
|
|
||||||
renderBody: function () {
|
renderBody: function () {
|
||||||
var title = this.renderTitle(this),
|
var title = this.renderTitle(this),
|
||||||
a = L.DomUtil.add('a');
|
a = L.DomUtil.add('a')
|
||||||
a.href = this.feature.properties.link;
|
a.href = this.feature.properties.link
|
||||||
a.target = '_blank';
|
a.target = '_blank'
|
||||||
a.appendChild(title);
|
a.appendChild(title)
|
||||||
return a;
|
return a
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
|
|
|
@ -1,136 +1,140 @@
|
||||||
L.U.Slideshow = L.Class.extend({
|
L.U.Slideshow = L.Class.extend({
|
||||||
|
|
||||||
statics: {
|
statics: {
|
||||||
CLASSNAME: 'umap-slideshow-active'
|
CLASSNAME: 'umap-slideshow-active',
|
||||||
},
|
},
|
||||||
|
|
||||||
options: {
|
options: {
|
||||||
delay: 5000,
|
delay: 5000,
|
||||||
autoplay: false
|
autoplay: false,
|
||||||
},
|
},
|
||||||
|
|
||||||
initialize: function (map, options) {
|
initialize: function (map, options) {
|
||||||
this.setOptions(options);
|
this.setOptions(options)
|
||||||
this.map = map;
|
this.map = map
|
||||||
this._id = null;
|
this._id = null
|
||||||
var current = null, // current feature
|
var current = null, // current feature
|
||||||
self = this;
|
self = this
|
||||||
try {
|
try {
|
||||||
Object.defineProperty(this, 'current', {
|
Object.defineProperty(this, 'current', {
|
||||||
get: function () {
|
get: function () {
|
||||||
if (!current) {
|
if (!current) {
|
||||||
var datalayer = this.defaultDatalayer();
|
var datalayer = this.defaultDatalayer()
|
||||||
if (datalayer) current = datalayer.getFeatureByIndex(0);
|
if (datalayer) current = datalayer.getFeatureByIndex(0)
|
||||||
}
|
}
|
||||||
return current;
|
return current
|
||||||
},
|
},
|
||||||
set: function (feature) {
|
set: function (feature) {
|
||||||
current = feature;
|
current = feature
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
}
|
} catch (e) {
|
||||||
catch (e) {
|
|
||||||
// Certainly IE8, which has a limited version of defineProperty
|
// Certainly IE8, which has a limited version of defineProperty
|
||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
Object.defineProperty(this, 'next', {
|
Object.defineProperty(this, 'next', {
|
||||||
get: function () {
|
get: function () {
|
||||||
if (!current) {
|
if (!current) {
|
||||||
return self.current;
|
return self.current
|
||||||
}
|
}
|
||||||
return current.getNext();
|
return current.getNext()
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
}
|
} catch (e) {
|
||||||
catch (e) {
|
|
||||||
// Certainly IE8, which has a limited version of defineProperty
|
// Certainly IE8, which has a limited version of defineProperty
|
||||||
}
|
}
|
||||||
if (this.options.autoplay) {
|
if (this.options.autoplay) {
|
||||||
this.map.onceDataLoaded(function () {
|
this.map.onceDataLoaded(function () {
|
||||||
this.play();
|
this.play()
|
||||||
}, this);
|
}, this)
|
||||||
}
|
}
|
||||||
this.map.on('edit:enabled', function () {
|
this.map.on(
|
||||||
this.stop();
|
'edit:enabled',
|
||||||
}, this);
|
function () {
|
||||||
|
this.stop()
|
||||||
|
},
|
||||||
|
this
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
setOptions: function (options) {
|
setOptions: function (options) {
|
||||||
L.setOptions(this, options);
|
L.setOptions(this, options)
|
||||||
this.timeSpinner();
|
this.timeSpinner()
|
||||||
},
|
},
|
||||||
|
|
||||||
defaultDatalayer: function () {
|
defaultDatalayer: function () {
|
||||||
return this.map.findDataLayer(function (d) { return d.allowBrowse() && d.hasData(); });
|
return this.map.findDataLayer(function (d) {
|
||||||
|
return d.allowBrowse() && d.hasData()
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
timeSpinner: function () {
|
timeSpinner: function () {
|
||||||
var time = parseInt(this.options.delay, 10);
|
var time = parseInt(this.options.delay, 10)
|
||||||
if (!time) return;
|
if (!time) return
|
||||||
var css = 'rotation ' + time / 1000 + 's infinite linear',
|
var css = 'rotation ' + time / 1000 + 's infinite linear',
|
||||||
spinners = document.querySelectorAll('.umap-slideshow-toolbox .play .spinner');
|
spinners = document.querySelectorAll('.umap-slideshow-toolbox .play .spinner')
|
||||||
for (var i = 0; i < spinners.length; i++) {
|
for (var i = 0; i < spinners.length; i++) {
|
||||||
spinners[i].style.animation = css;
|
spinners[i].style.animation = css
|
||||||
spinners[i].style['-webkit-animation'] = css;
|
spinners[i].style['-webkit-animation'] = css
|
||||||
spinners[i].style['-moz-animation'] = css;
|
spinners[i].style['-moz-animation'] = css
|
||||||
spinners[i].style['-o-animation'] = css;
|
spinners[i].style['-o-animation'] = css
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
resetSpinners: function () {
|
resetSpinners: function () {
|
||||||
// Make that animnation is coordinated with user actions
|
// Make that animnation is coordinated with user actions
|
||||||
var spinners = document.querySelectorAll('.umap-slideshow-toolbox .play .spinner'),
|
var spinners = document.querySelectorAll('.umap-slideshow-toolbox .play .spinner'),
|
||||||
el, newOne;
|
el,
|
||||||
|
newOne
|
||||||
for (var i = 0; i < spinners.length; i++) {
|
for (var i = 0; i < spinners.length; i++) {
|
||||||
el = spinners[i];
|
el = spinners[i]
|
||||||
newOne = el.cloneNode(true);
|
newOne = el.cloneNode(true)
|
||||||
el.parentNode.replaceChild(newOne, el);
|
el.parentNode.replaceChild(newOne, el)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
play: function () {
|
play: function () {
|
||||||
if (this._id) return;
|
if (this._id) return
|
||||||
if (this.map.editEnabled || !this.map.options.slideshow.active) return;
|
if (this.map.editEnabled || !this.map.options.slideshow.active) return
|
||||||
L.DomUtil.addClass(document.body, L.U.Slideshow.CLASSNAME);
|
L.DomUtil.addClass(document.body, L.U.Slideshow.CLASSNAME)
|
||||||
this._id = window.setInterval(L.bind(this.loop, this), this.options.delay);
|
this._id = window.setInterval(L.bind(this.loop, this), this.options.delay)
|
||||||
this.resetSpinners();
|
this.resetSpinners()
|
||||||
this.loop();
|
this.loop()
|
||||||
},
|
},
|
||||||
|
|
||||||
loop: function () {
|
loop: function () {
|
||||||
this.current = this.next;
|
this.current = this.next
|
||||||
this.step();
|
this.step()
|
||||||
},
|
},
|
||||||
|
|
||||||
pause: function () {
|
pause: function () {
|
||||||
if (this._id) {
|
if (this._id) {
|
||||||
L.DomUtil.removeClass(document.body, L.U.Slideshow.CLASSNAME);
|
L.DomUtil.removeClass(document.body, L.U.Slideshow.CLASSNAME)
|
||||||
window.clearInterval(this._id);
|
window.clearInterval(this._id)
|
||||||
this._id = null;
|
this._id = null
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
stop: function () {
|
stop: function () {
|
||||||
this.pause();
|
this.pause()
|
||||||
this.current = null;
|
this.current = null
|
||||||
},
|
},
|
||||||
|
|
||||||
forward: function () {
|
forward: function () {
|
||||||
this.pause();
|
this.pause()
|
||||||
this.current = this.next;
|
this.current = this.next
|
||||||
this.step();
|
this.step()
|
||||||
},
|
},
|
||||||
|
|
||||||
backward: function () {
|
backward: function () {
|
||||||
this.pause();
|
this.pause()
|
||||||
if (this.current) this.current = this.current.getPrevious();
|
if (this.current) this.current = this.current.getPrevious()
|
||||||
this.step();
|
this.step()
|
||||||
},
|
},
|
||||||
|
|
||||||
step: function () {
|
step: function () {
|
||||||
if(!this.current) return this.stop();
|
if (!this.current) return this.stop()
|
||||||
this.current.zoomTo({easing: this.options.easing});
|
this.current.zoomTo({ easing: this.options.easing })
|
||||||
this.current.view();
|
this.current.view()
|
||||||
},
|
},
|
||||||
|
|
||||||
renderToolbox: function (container) {
|
renderToolbox: function (container) {
|
||||||
|
@ -138,27 +142,22 @@ L.U.Slideshow = L.Class.extend({
|
||||||
play = L.DomUtil.create('li', 'play', box),
|
play = L.DomUtil.create('li', 'play', box),
|
||||||
stop = L.DomUtil.create('li', 'stop', box),
|
stop = L.DomUtil.create('li', 'stop', box),
|
||||||
prev = L.DomUtil.create('li', 'prev', box),
|
prev = L.DomUtil.create('li', 'prev', box),
|
||||||
next = L.DomUtil.create('li', 'next', box);
|
next = L.DomUtil.create('li', 'next', box)
|
||||||
L.DomUtil.create('div', 'spinner', play);
|
L.DomUtil.create('div', 'spinner', play)
|
||||||
play.title = L._('Start slideshow');
|
play.title = L._('Start slideshow')
|
||||||
stop.title = L._('Stop slideshow');
|
stop.title = L._('Stop slideshow')
|
||||||
next.title = L._('Zoom to the next');
|
next.title = L._('Zoom to the next')
|
||||||
prev.title = L._('Zoom to the previous');
|
prev.title = L._('Zoom to the previous')
|
||||||
var toggle = function () {
|
var toggle = function () {
|
||||||
if (this._id) this.pause();
|
if (this._id) this.pause()
|
||||||
else this.play();
|
else this.play()
|
||||||
};
|
|
||||||
L.DomEvent.on(play, 'click', L.DomEvent.stop)
|
|
||||||
.on(play, 'click', toggle, this);
|
|
||||||
L.DomEvent.on(stop, 'click', L.DomEvent.stop)
|
|
||||||
.on(stop, 'click', this.stop, this);
|
|
||||||
L.DomEvent.on(prev, 'click', L.DomEvent.stop)
|
|
||||||
.on(prev, 'click', this.backward, this);
|
|
||||||
L.DomEvent.on(next, 'click', L.DomEvent.stop)
|
|
||||||
.on(next, 'click', this.forward, this);
|
|
||||||
container.appendChild(box);
|
|
||||||
this.timeSpinner();
|
|
||||||
return box;
|
|
||||||
}
|
}
|
||||||
|
L.DomEvent.on(play, 'click', L.DomEvent.stop).on(play, 'click', toggle, this)
|
||||||
});
|
L.DomEvent.on(stop, 'click', L.DomEvent.stop).on(stop, 'click', this.stop, this)
|
||||||
|
L.DomEvent.on(prev, 'click', L.DomEvent.stop).on(prev, 'click', this.backward, this)
|
||||||
|
L.DomEvent.on(next, 'click', L.DomEvent.stop).on(next, 'click', this.forward, this)
|
||||||
|
container.appendChild(box)
|
||||||
|
this.timeSpinner()
|
||||||
|
return box
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
|
@ -1,17 +1,16 @@
|
||||||
L.U.TableEditor = L.Class.extend({
|
L.U.TableEditor = L.Class.extend({
|
||||||
|
|
||||||
initialize: function (datalayer) {
|
initialize: function (datalayer) {
|
||||||
this.datalayer = datalayer;
|
this.datalayer = datalayer
|
||||||
this.table = L.DomUtil.create('div', 'table');
|
this.table = L.DomUtil.create('div', 'table')
|
||||||
this.header = L.DomUtil.create('div', 'thead', this.table);
|
this.header = L.DomUtil.create('div', 'thead', this.table)
|
||||||
this.body = L.DomUtil.create('div', 'tbody', this.table);
|
this.body = L.DomUtil.create('div', 'tbody', this.table)
|
||||||
this.resetProperties();
|
this.resetProperties()
|
||||||
},
|
},
|
||||||
|
|
||||||
renderHeaders: function () {
|
renderHeaders: function () {
|
||||||
this.header.innerHTML = '';
|
this.header.innerHTML = ''
|
||||||
for (var i = 0; i < this.properties.length; i++) {
|
for (var i = 0; i < this.properties.length; i++) {
|
||||||
this.renderHeader(this.properties[i]);
|
this.renderHeader(this.properties[i])
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -19,89 +18,104 @@ L.U.TableEditor = L.Class.extend({
|
||||||
var container = L.DomUtil.create('div', 'tcell', this.header),
|
var container = L.DomUtil.create('div', 'tcell', this.header),
|
||||||
title = L.DomUtil.add('span', '', container, property),
|
title = L.DomUtil.add('span', '', container, property),
|
||||||
del = L.DomUtil.create('i', 'umap-delete', container),
|
del = L.DomUtil.create('i', 'umap-delete', container),
|
||||||
rename = L.DomUtil.create('i', 'umap-edit', container);
|
rename = L.DomUtil.create('i', 'umap-edit', container)
|
||||||
del.title = L._('Delete this property on all the features');
|
del.title = L._('Delete this property on all the features')
|
||||||
rename.title = L._('Rename this property on all the features');
|
rename.title = L._('Rename this property on all the features')
|
||||||
var doDelete = function () {
|
var doDelete = function () {
|
||||||
if (confirm(L._('Are you sure you want to delete this property on all the features?'))) {
|
if (
|
||||||
|
confirm(
|
||||||
|
L._('Are you sure you want to delete this property on all the features?')
|
||||||
|
)
|
||||||
|
) {
|
||||||
this.datalayer.eachLayer(function (feature) {
|
this.datalayer.eachLayer(function (feature) {
|
||||||
feature.deleteProperty(property);
|
feature.deleteProperty(property)
|
||||||
});
|
})
|
||||||
this.datalayer.deindexProperty(property);
|
this.datalayer.deindexProperty(property)
|
||||||
this.resetProperties();
|
this.resetProperties()
|
||||||
this.edit();
|
this.edit()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
|
||||||
var doRename = function () {
|
var doRename = function () {
|
||||||
var newName = prompt(L._('Please enter the new name of this property'), property);
|
var newName = prompt(L._('Please enter the new name of this property'), property)
|
||||||
if (!newName || !this.validateName(newName)) return;
|
if (!newName || !this.validateName(newName)) return
|
||||||
this.datalayer.eachLayer(function (feature) {
|
this.datalayer.eachLayer(function (feature) {
|
||||||
feature.renameProperty(property, newName);
|
feature.renameProperty(property, newName)
|
||||||
});
|
})
|
||||||
this.datalayer.deindexProperty(property);
|
this.datalayer.deindexProperty(property)
|
||||||
this.datalayer.indexProperty(newName);
|
this.datalayer.indexProperty(newName)
|
||||||
this.resetProperties();
|
this.resetProperties()
|
||||||
this.edit();
|
this.edit()
|
||||||
};
|
}
|
||||||
L.DomEvent.on(del, 'click', doDelete, this);
|
L.DomEvent.on(del, 'click', doDelete, this)
|
||||||
L.DomEvent.on(rename, 'click', doRename, this);
|
L.DomEvent.on(rename, 'click', doRename, this)
|
||||||
},
|
},
|
||||||
|
|
||||||
renderRow: function (feature) {
|
renderRow: function (feature) {
|
||||||
var builder = new L.U.FormBuilder(feature, this.field_properties,
|
var builder = new L.U.FormBuilder(feature, this.field_properties, {
|
||||||
{
|
|
||||||
id: 'umap-feature-properties_' + L.stamp(feature),
|
id: 'umap-feature-properties_' + L.stamp(feature),
|
||||||
className: 'trow',
|
className: 'trow',
|
||||||
callback: feature.resetTooltip
|
callback: feature.resetTooltip,
|
||||||
}
|
})
|
||||||
);
|
this.body.appendChild(builder.build())
|
||||||
this.body.appendChild(builder.build());
|
|
||||||
},
|
},
|
||||||
|
|
||||||
compileProperties: function () {
|
compileProperties: function () {
|
||||||
if (this.properties.length === 0) this.properties = ['name'];
|
if (this.properties.length === 0) this.properties = ['name']
|
||||||
// description is a forced textarea, don't edit it in a text input, or you lose cariage returns
|
// description is a forced textarea, don't edit it in a text input, or you lose cariage returns
|
||||||
if (this.properties.indexOf('description') !== -1) this.properties.splice(this.properties.indexOf('description'), 1);
|
if (this.properties.indexOf('description') !== -1)
|
||||||
this.properties.sort();
|
this.properties.splice(this.properties.indexOf('description'), 1)
|
||||||
this.field_properties = [];
|
this.properties.sort()
|
||||||
|
this.field_properties = []
|
||||||
for (var i = 0; i < this.properties.length; i++) {
|
for (var i = 0; i < this.properties.length; i++) {
|
||||||
this.field_properties.push(['properties.' + this.properties[i], {wrapper: 'div', wrapperClass: 'tcell'}]);
|
this.field_properties.push([
|
||||||
|
'properties.' + this.properties[i],
|
||||||
|
{ wrapper: 'div', wrapperClass: 'tcell' },
|
||||||
|
])
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
resetProperties: function () {
|
resetProperties: function () {
|
||||||
this.properties = this.datalayer._propertiesIndex;
|
this.properties = this.datalayer._propertiesIndex
|
||||||
},
|
},
|
||||||
|
|
||||||
validateName: function (name) {
|
validateName: function (name) {
|
||||||
if (name.indexOf(".") !== -1) {
|
if (name.indexOf('.') !== -1) {
|
||||||
this.datalayer.map.ui.alert({content: L._('Invalide property name: {name}', {name: name}), level: 'error'});
|
this.datalayer.map.ui.alert({
|
||||||
return false;
|
content: L._('Invalide property name: {name}', { name: name }),
|
||||||
|
level: 'error',
|
||||||
|
})
|
||||||
|
return false
|
||||||
}
|
}
|
||||||
return true;
|
return true
|
||||||
},
|
},
|
||||||
|
|
||||||
edit: function () {
|
edit: function () {
|
||||||
var id = 'tableeditor:edit';
|
var id = 'tableeditor:edit'
|
||||||
this.datalayer.map.fire('dataloading', {id: id});
|
this.datalayer.map.fire('dataloading', { id: id })
|
||||||
this.compileProperties();
|
this.compileProperties()
|
||||||
this.renderHeaders();
|
this.renderHeaders()
|
||||||
this.body.innerHTML = '';
|
this.body.innerHTML = ''
|
||||||
this.datalayer.eachLayer(this.renderRow, this);
|
this.datalayer.eachLayer(this.renderRow, this)
|
||||||
var addButton = L.DomUtil.create('li', 'add-property');
|
var addButton = L.DomUtil.create('li', 'add-property')
|
||||||
L.DomUtil.create('i', 'umap-icon-16 umap-add', addButton);
|
L.DomUtil.create('i', 'umap-icon-16 umap-add', addButton)
|
||||||
var label = L.DomUtil.create('span', '', addButton);
|
var label = L.DomUtil.create('span', '', addButton)
|
||||||
label.textContent = label.title = L._('Add a new property');
|
label.textContent = label.title = L._('Add a new property')
|
||||||
var addProperty = function () {
|
var addProperty = function () {
|
||||||
var newName = prompt(L._('Please enter the name of the property'));
|
var newName = prompt(L._('Please enter the name of the property'))
|
||||||
if (!newName || !this.validateName(newName)) return;
|
if (!newName || !this.validateName(newName)) return
|
||||||
this.datalayer.indexProperty(newName);
|
this.datalayer.indexProperty(newName)
|
||||||
this.edit();
|
this.edit()
|
||||||
};
|
|
||||||
L.DomEvent.on(addButton, 'click', addProperty, this);
|
|
||||||
var className = (this.properties.length > 2) ? 'umap-table-editor fullwidth dark' : 'umap-table-editor dark';
|
|
||||||
this.datalayer.map.ui.openPanel({data: {html: this.table}, className: className, actions: [addButton]});
|
|
||||||
this.datalayer.map.fire('dataload', {id: id});
|
|
||||||
}
|
}
|
||||||
|
L.DomEvent.on(addButton, 'click', addProperty, this)
|
||||||
});
|
var className =
|
||||||
|
this.properties.length > 2
|
||||||
|
? 'umap-table-editor fullwidth dark'
|
||||||
|
: 'umap-table-editor dark'
|
||||||
|
this.datalayer.map.ui.openPanel({
|
||||||
|
data: { html: this.table },
|
||||||
|
className: className,
|
||||||
|
actions: [addButton],
|
||||||
|
})
|
||||||
|
this.datalayer.map.fire('dataload', { id: id })
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
|
@ -2,175 +2,208 @@
|
||||||
* Modals
|
* Modals
|
||||||
*/
|
*/
|
||||||
L.U.UI = L.Evented.extend({
|
L.U.UI = L.Evented.extend({
|
||||||
|
|
||||||
ALERTS: Array(),
|
ALERTS: Array(),
|
||||||
ALERT_ID: null,
|
ALERT_ID: null,
|
||||||
TOOLTIP_ID: null,
|
TOOLTIP_ID: null,
|
||||||
|
|
||||||
initialize: function (parent) {
|
initialize: function (parent) {
|
||||||
this.parent = parent;
|
this.parent = parent
|
||||||
this.container = L.DomUtil.create('div', 'leaflet-ui-container', this.parent);
|
this.container = L.DomUtil.create('div', 'leaflet-ui-container', this.parent)
|
||||||
L.DomEvent.disableClickPropagation(this.container);
|
L.DomEvent.disableClickPropagation(this.container)
|
||||||
L.DomEvent.on(this.container, 'contextmenu', L.DomEvent.stopPropagation); // Do not activate our custom context menu.
|
L.DomEvent.on(this.container, 'contextmenu', L.DomEvent.stopPropagation) // Do not activate our custom context menu.
|
||||||
L.DomEvent.on(this.container, 'mousewheel', L.DomEvent.stopPropagation);
|
L.DomEvent.on(this.container, 'mousewheel', L.DomEvent.stopPropagation)
|
||||||
L.DomEvent.on(this.container, 'MozMousePixelScroll', L.DomEvent.stopPropagation);
|
L.DomEvent.on(this.container, 'MozMousePixelScroll', L.DomEvent.stopPropagation)
|
||||||
this._panel = L.DomUtil.create('div', '', this.container);
|
this._panel = L.DomUtil.create('div', '', this.container)
|
||||||
this._panel.id = 'umap-ui-container';
|
this._panel.id = 'umap-ui-container'
|
||||||
this._alert = L.DomUtil.create('div', 'with-transition', this.container);
|
this._alert = L.DomUtil.create('div', 'with-transition', this.container)
|
||||||
this._alert.id = 'umap-alert-container';
|
this._alert.id = 'umap-alert-container'
|
||||||
this._tooltip = L.DomUtil.create('div', '', this.container);
|
this._tooltip = L.DomUtil.create('div', '', this.container)
|
||||||
this._tooltip.id = 'umap-tooltip-container';
|
this._tooltip.id = 'umap-tooltip-container'
|
||||||
},
|
},
|
||||||
|
|
||||||
resetPanelClassName: function () {
|
resetPanelClassName: function () {
|
||||||
this._panel.className = 'with-transition';
|
this._panel.className = 'with-transition'
|
||||||
},
|
},
|
||||||
|
|
||||||
openPanel: function (e) {
|
openPanel: function (e) {
|
||||||
this.fire('panel:open');
|
this.fire('panel:open')
|
||||||
// We reset all because we can't know which class has been added
|
// We reset all because we can't know which class has been added
|
||||||
// by previous ui processes...
|
// by previous ui processes...
|
||||||
this.resetPanelClassName();
|
this.resetPanelClassName()
|
||||||
this._panel.innerHTML = '';
|
this._panel.innerHTML = ''
|
||||||
var actionsContainer = L.DomUtil.create('ul', 'toolbox', this._panel);
|
var actionsContainer = L.DomUtil.create('ul', 'toolbox', this._panel)
|
||||||
var body = L.DomUtil.create('div', 'body', this._panel);
|
var body = L.DomUtil.create('div', 'body', this._panel)
|
||||||
if (e.data.html.nodeType && e.data.html.nodeType === 1) body.appendChild(e.data.html);
|
if (e.data.html.nodeType && e.data.html.nodeType === 1)
|
||||||
else body.innerHTML = e.data.html;
|
body.appendChild(e.data.html)
|
||||||
var closeLink = L.DomUtil.create('li', 'umap-close-link', actionsContainer);
|
else body.innerHTML = e.data.html
|
||||||
L.DomUtil.add('i', 'umap-close-icon', closeLink);
|
var closeLink = L.DomUtil.create('li', 'umap-close-link', actionsContainer)
|
||||||
var label = L.DomUtil.create('span', '', closeLink);
|
L.DomUtil.add('i', 'umap-close-icon', closeLink)
|
||||||
label.title = label.textContent = L._('Close');
|
var label = L.DomUtil.create('span', '', closeLink)
|
||||||
|
label.title = label.textContent = L._('Close')
|
||||||
if (e.actions) {
|
if (e.actions) {
|
||||||
for (var i = 0; i < e.actions.length; i++) {
|
for (var i = 0; i < e.actions.length; i++) {
|
||||||
actionsContainer.appendChild(e.actions[i]);
|
actionsContainer.appendChild(e.actions[i])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (e.className) L.DomUtil.addClass(this._panel, e.className);
|
if (e.className) L.DomUtil.addClass(this._panel, e.className)
|
||||||
if (L.DomUtil.hasClass(this.parent, 'umap-ui')) {
|
if (L.DomUtil.hasClass(this.parent, 'umap-ui')) {
|
||||||
// Already open.
|
// Already open.
|
||||||
this.fire('panel:ready');
|
this.fire('panel:ready')
|
||||||
} else {
|
} else {
|
||||||
L.DomEvent.once(this._panel, 'transitionend', function (e) {
|
L.DomEvent.once(
|
||||||
this.fire('panel:ready');
|
this._panel,
|
||||||
}, this);
|
'transitionend',
|
||||||
L.DomUtil.addClass(this.parent, 'umap-ui');
|
function (e) {
|
||||||
|
this.fire('panel:ready')
|
||||||
|
},
|
||||||
|
this
|
||||||
|
)
|
||||||
|
L.DomUtil.addClass(this.parent, 'umap-ui')
|
||||||
}
|
}
|
||||||
L.DomEvent.on(closeLink, 'click', this.closePanel, this);
|
L.DomEvent.on(closeLink, 'click', this.closePanel, this)
|
||||||
},
|
},
|
||||||
|
|
||||||
closePanel: function () {
|
closePanel: function () {
|
||||||
this.resetPanelClassName();
|
this.resetPanelClassName()
|
||||||
L.DomUtil.removeClass(this.parent, 'umap-ui');
|
L.DomUtil.removeClass(this.parent, 'umap-ui')
|
||||||
this.fire('panel:closed');
|
this.fire('panel:closed')
|
||||||
},
|
},
|
||||||
|
|
||||||
alert: function (e) {
|
alert: function (e) {
|
||||||
if (L.DomUtil.hasClass(this.parent, 'umap-alert')) this.ALERTS.push(e);
|
if (L.DomUtil.hasClass(this.parent, 'umap-alert')) this.ALERTS.push(e)
|
||||||
else this.popAlert(e);
|
else this.popAlert(e)
|
||||||
},
|
},
|
||||||
|
|
||||||
popAlert: function (e) {
|
popAlert: function (e) {
|
||||||
var self = this;
|
var self = this
|
||||||
if (!e) {
|
if (!e) {
|
||||||
if (this.ALERTS.length) e = this.ALERTS.pop();
|
if (this.ALERTS.length) e = this.ALERTS.pop()
|
||||||
else return;
|
else return
|
||||||
}
|
}
|
||||||
var timeoutID,
|
var timeoutID,
|
||||||
level_class = e.level && e.level == 'info'? 'info': 'error';
|
level_class = e.level && e.level == 'info' ? 'info' : 'error'
|
||||||
this._alert.innerHTML = '';
|
this._alert.innerHTML = ''
|
||||||
L.DomUtil.addClass(this.parent, 'umap-alert');
|
L.DomUtil.addClass(this.parent, 'umap-alert')
|
||||||
L.DomUtil.addClass(this._alert, level_class);
|
L.DomUtil.addClass(this._alert, level_class)
|
||||||
var close = function () {
|
var close = function () {
|
||||||
if (timeoutID !== this.ALERT_ID) { return;} // Another alert has been forced
|
if (timeoutID !== this.ALERT_ID) {
|
||||||
this._alert.innerHTML = '';
|
return
|
||||||
L.DomUtil.removeClass(this.parent, 'umap-alert');
|
} // Another alert has been forced
|
||||||
L.DomUtil.removeClass(this._alert, level_class);
|
this._alert.innerHTML = ''
|
||||||
if (timeoutID) window.clearTimeout(timeoutID);
|
L.DomUtil.removeClass(this.parent, 'umap-alert')
|
||||||
this.popAlert();
|
L.DomUtil.removeClass(this._alert, level_class)
|
||||||
};
|
if (timeoutID) window.clearTimeout(timeoutID)
|
||||||
var closeLink = L.DomUtil.create('a', 'umap-close-link', this._alert);
|
this.popAlert()
|
||||||
closeLink.href = '#';
|
}
|
||||||
L.DomUtil.add('i', 'umap-close-icon', closeLink);
|
var closeLink = L.DomUtil.create('a', 'umap-close-link', this._alert)
|
||||||
var label = L.DomUtil.create('span', '', closeLink);
|
closeLink.href = '#'
|
||||||
label.title = label.textContent = L._('Close');
|
L.DomUtil.add('i', 'umap-close-icon', closeLink)
|
||||||
L.DomEvent.on(closeLink, 'click', L.DomEvent.stop)
|
var label = L.DomUtil.create('span', '', closeLink)
|
||||||
.on(closeLink, 'click', close, this);
|
label.title = label.textContent = L._('Close')
|
||||||
L.DomUtil.add('div', '', this._alert, e.content);
|
L.DomEvent.on(closeLink, 'click', L.DomEvent.stop).on(
|
||||||
|
closeLink,
|
||||||
|
'click',
|
||||||
|
close,
|
||||||
|
this
|
||||||
|
)
|
||||||
|
L.DomUtil.add('div', '', this._alert, e.content)
|
||||||
if (e.actions) {
|
if (e.actions) {
|
||||||
var action, el;
|
var action, el
|
||||||
for (var i = 0; i < e.actions.length; i++) {
|
for (var i = 0; i < e.actions.length; i++) {
|
||||||
action = e.actions[i];
|
action = e.actions[i]
|
||||||
el = L.DomUtil.element('a', {'className': 'umap-action'}, this._alert);
|
el = L.DomUtil.element('a', { className: 'umap-action' }, this._alert)
|
||||||
el.href = '#';
|
el.href = '#'
|
||||||
el.textContent = action.label;
|
el.textContent = action.label
|
||||||
L.DomEvent.on(el, 'click', L.DomEvent.stop)
|
L.DomEvent.on(el, 'click', L.DomEvent.stop).on(el, 'click', close, this)
|
||||||
.on(el, 'click', close, this);
|
if (action.callback)
|
||||||
if (action.callback) L.DomEvent.on(el, 'click', action.callback, action.callbackContext || this.map);
|
L.DomEvent.on(
|
||||||
|
el,
|
||||||
|
'click',
|
||||||
|
action.callback,
|
||||||
|
action.callbackContext || this.map
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
self.ALERT_ID = timeoutID = window.setTimeout(L.bind(close, this), e.duration || 3000);
|
self.ALERT_ID = timeoutID = window.setTimeout(
|
||||||
|
L.bind(close, this),
|
||||||
|
e.duration || 3000
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
|
||||||
tooltip: function (e) {
|
tooltip: function (e) {
|
||||||
this.TOOLTIP_ID = Math.random();
|
this.TOOLTIP_ID = Math.random()
|
||||||
var id = this.TOOLTIP_ID;
|
var id = this.TOOLTIP_ID
|
||||||
L.DomUtil.addClass(this.parent, 'umap-tooltip');
|
L.DomUtil.addClass(this.parent, 'umap-tooltip')
|
||||||
if (e.anchor && e.position === 'top') this.anchorTooltipTop(e.anchor);
|
if (e.anchor && e.position === 'top') this.anchorTooltipTop(e.anchor)
|
||||||
else if (e.anchor && e.position === 'left') this.anchorTooltipLeft(e.anchor);
|
else if (e.anchor && e.position === 'left') this.anchorTooltipLeft(e.anchor)
|
||||||
else this.anchorTooltipAbsolute();
|
else this.anchorTooltipAbsolute()
|
||||||
this._tooltip.innerHTML = e.content;
|
this._tooltip.innerHTML = e.content
|
||||||
function closeIt () { this.closeTooltip(id); }
|
function closeIt() {
|
||||||
if (e.anchor) L.DomEvent.once(e.anchor, 'mouseout', closeIt, this);
|
this.closeTooltip(id)
|
||||||
if (e.duration !== Infinity) window.setTimeout(L.bind(closeIt, this), e.duration || 3000);
|
}
|
||||||
|
if (e.anchor) L.DomEvent.once(e.anchor, 'mouseout', closeIt, this)
|
||||||
|
if (e.duration !== Infinity)
|
||||||
|
window.setTimeout(L.bind(closeIt, this), e.duration || 3000)
|
||||||
},
|
},
|
||||||
|
|
||||||
anchorTooltipAbsolute: function () {
|
anchorTooltipAbsolute: function () {
|
||||||
this._tooltip.className = '';
|
this._tooltip.className = ''
|
||||||
var left = this.parent.offsetLeft + (this.parent.clientWidth / 2) - (this._tooltip.clientWidth / 2),
|
var left =
|
||||||
top = this.parent.offsetTop + 75;
|
this.parent.offsetLeft +
|
||||||
this.setTooltipPosition({top: top, left: left});
|
this.parent.clientWidth / 2 -
|
||||||
|
this._tooltip.clientWidth / 2,
|
||||||
|
top = this.parent.offsetTop + 75
|
||||||
|
this.setTooltipPosition({ top: top, left: left })
|
||||||
},
|
},
|
||||||
|
|
||||||
anchorTooltipTop: function (el) {
|
anchorTooltipTop: function (el) {
|
||||||
this._tooltip.className = 'tooltip-top';
|
this._tooltip.className = 'tooltip-top'
|
||||||
var coords = this.getPosition(el);
|
var coords = this.getPosition(el)
|
||||||
this.setTooltipPosition({left: coords.left - 10, bottom: this.getDocHeight() - coords.top + 11});
|
this.setTooltipPosition({
|
||||||
|
left: coords.left - 10,
|
||||||
|
bottom: this.getDocHeight() - coords.top + 11,
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
anchorTooltipLeft: function (el) {
|
anchorTooltipLeft: function (el) {
|
||||||
this._tooltip.className = 'tooltip-left';
|
this._tooltip.className = 'tooltip-left'
|
||||||
var coords = this.getPosition(el);
|
var coords = this.getPosition(el)
|
||||||
this.setTooltipPosition({top: coords.top, right: document.documentElement.offsetWidth - coords.left + 11});
|
this.setTooltipPosition({
|
||||||
|
top: coords.top,
|
||||||
|
right: document.documentElement.offsetWidth - coords.left + 11,
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
closeTooltip: function (id) {
|
closeTooltip: function (id) {
|
||||||
if (id && id !== this.TOOLTIP_ID) return;
|
if (id && id !== this.TOOLTIP_ID) return
|
||||||
this._tooltip.innerHTML = '';
|
this._tooltip.innerHTML = ''
|
||||||
L.DomUtil.removeClass(this.parent, 'umap-tooltip');
|
L.DomUtil.removeClass(this.parent, 'umap-tooltip')
|
||||||
},
|
},
|
||||||
|
|
||||||
getPosition: function (el) {
|
getPosition: function (el) {
|
||||||
return el.getBoundingClientRect();
|
return el.getBoundingClientRect()
|
||||||
},
|
},
|
||||||
|
|
||||||
setTooltipPosition: function (coords) {
|
setTooltipPosition: function (coords) {
|
||||||
if (coords.left) this._tooltip.style.left = coords.left + 'px';
|
if (coords.left) this._tooltip.style.left = coords.left + 'px'
|
||||||
else this._tooltip.style.left = 'initial';
|
else this._tooltip.style.left = 'initial'
|
||||||
if (coords.right) this._tooltip.style.right = coords.right + 'px';
|
if (coords.right) this._tooltip.style.right = coords.right + 'px'
|
||||||
else this._tooltip.style.right = 'initial';
|
else this._tooltip.style.right = 'initial'
|
||||||
if (coords.top) this._tooltip.style.top = coords.top + 'px';
|
if (coords.top) this._tooltip.style.top = coords.top + 'px'
|
||||||
else this._tooltip.style.top = 'initial';
|
else this._tooltip.style.top = 'initial'
|
||||||
if (coords.bottom) this._tooltip.style.bottom = coords.bottom + 'px';
|
if (coords.bottom) this._tooltip.style.bottom = coords.bottom + 'px'
|
||||||
else this._tooltip.style.bottom = 'initial';
|
else this._tooltip.style.bottom = 'initial'
|
||||||
},
|
},
|
||||||
|
|
||||||
getDocHeight: function () {
|
getDocHeight: function () {
|
||||||
var D = document;
|
var D = document
|
||||||
return Math.max(
|
return Math.max(
|
||||||
D.body.scrollHeight, D.documentElement.scrollHeight,
|
D.body.scrollHeight,
|
||||||
D.body.offsetHeight, D.documentElement.offsetHeight,
|
D.documentElement.scrollHeight,
|
||||||
D.body.clientHeight, D.documentElement.clientHeight
|
D.body.offsetHeight,
|
||||||
);
|
D.documentElement.offsetHeight,
|
||||||
|
D.body.clientHeight,
|
||||||
|
D.documentElement.clientHeight
|
||||||
|
)
|
||||||
},
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
|
@ -1,146 +1,164 @@
|
||||||
L.U.Xhr = L.Evented.extend({
|
L.U.Xhr = L.Evented.extend({
|
||||||
|
|
||||||
initialize: function (ui) {
|
initialize: function (ui) {
|
||||||
this.ui = ui;
|
this.ui = ui
|
||||||
},
|
},
|
||||||
|
|
||||||
_wrapper: function () {
|
_wrapper: function () {
|
||||||
var wrapper;
|
var wrapper
|
||||||
if (window.XMLHttpRequest === undefined) {
|
if (window.XMLHttpRequest === undefined) {
|
||||||
wrapper = function () {
|
wrapper = function () {
|
||||||
try {
|
try {
|
||||||
return new window.ActiveXObject('Microsoft.XMLHTTP.6.0');
|
return new window.ActiveXObject('Microsoft.XMLHTTP.6.0')
|
||||||
}
|
} catch (e1) {
|
||||||
catch (e1) {
|
|
||||||
try {
|
try {
|
||||||
return new window.ActiveXObject('Microsoft.XMLHTTP.3.0');
|
return new window.ActiveXObject('Microsoft.XMLHTTP.3.0')
|
||||||
}
|
} catch (e2) {
|
||||||
catch (e2) {
|
throw new Error('XMLHttpRequest is not supported')
|
||||||
throw new Error('XMLHttpRequest is not supported');
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
|
||||||
}
|
}
|
||||||
else {
|
} else {
|
||||||
wrapper = window.XMLHttpRequest;
|
wrapper = window.XMLHttpRequest
|
||||||
}
|
}
|
||||||
return new wrapper();
|
return new wrapper()
|
||||||
},
|
},
|
||||||
|
|
||||||
_ajax: function (settings) {
|
_ajax: function (settings) {
|
||||||
var xhr = this._wrapper(), id = Math.random(), self = this;
|
var xhr = this._wrapper(),
|
||||||
this.fire('dataloading', {id: id});
|
id = Math.random(),
|
||||||
var loaded = function () {self.fire('dataload', {id: id});};
|
self = this
|
||||||
|
this.fire('dataloading', { id: id })
|
||||||
|
var loaded = function () {
|
||||||
|
self.fire('dataload', { id: id })
|
||||||
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
xhr.open(settings.verb, settings.uri, true);
|
xhr.open(settings.verb, settings.uri, true)
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
// Unknown protocol?
|
// Unknown protocol?
|
||||||
this.ui.alert({content: L._('Error while fetching {url}', {url: settings.uri}), level: 'error'});
|
this.ui.alert({
|
||||||
loaded();
|
content: L._('Error while fetching {url}', { url: settings.uri }),
|
||||||
|
level: 'error',
|
||||||
|
})
|
||||||
|
loaded()
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if (settings.uri.indexOf('http') !== 0 || settings.uri.indexOf(window.location.origin) === 0) {
|
if (
|
||||||
|
settings.uri.indexOf('http') !== 0 ||
|
||||||
|
settings.uri.indexOf(window.location.origin) === 0
|
||||||
|
) {
|
||||||
// "X-" mode headers cause the request to be in preflight mode,
|
// "X-" mode headers cause the request to be in preflight mode,
|
||||||
// we don"t want that by default for CORS requests
|
// we don"t want that by default for CORS requests
|
||||||
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
|
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest')
|
||||||
}
|
}
|
||||||
if (settings.headers) {
|
if (settings.headers) {
|
||||||
for (var name in settings.headers) {
|
for (var name in settings.headers) {
|
||||||
xhr.setRequestHeader(name, settings.headers[name]);
|
xhr.setRequestHeader(name, settings.headers[name])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
xhr.onreadystatechange = function () {
|
xhr.onreadystatechange = function () {
|
||||||
if (xhr.readyState === 4) {
|
if (xhr.readyState === 4) {
|
||||||
if (xhr.status == 200) {
|
if (xhr.status == 200) {
|
||||||
settings.callback.call(settings.context || xhr, xhr.responseText, xhr);
|
settings.callback.call(settings.context || xhr, xhr.responseText, xhr)
|
||||||
}
|
} else if (xhr.status === 403) {
|
||||||
else if (xhr.status === 403) {
|
self.ui.alert({
|
||||||
self.ui.alert({content: xhr.responseText || L._('Action not allowed :('), level: 'error'});
|
content: xhr.responseText || L._('Action not allowed :('),
|
||||||
}
|
level: 'error',
|
||||||
else if (xhr.status === 412) {
|
})
|
||||||
var msg = L._('Woops! Someone else seems to have edited the data. You can save anyway, but this will erase the changes made by others.');
|
} else if (xhr.status === 412) {
|
||||||
|
var msg = L._(
|
||||||
|
'Woops! Someone else seems to have edited the data. You can save anyway, but this will erase the changes made by others.'
|
||||||
|
)
|
||||||
var actions = [
|
var actions = [
|
||||||
{
|
{
|
||||||
label: L._('Save anyway'),
|
label: L._('Save anyway'),
|
||||||
callback: function () {
|
callback: function () {
|
||||||
delete settings.headers['If-Match'];
|
delete settings.headers['If-Match']
|
||||||
self._ajax(settings);
|
self._ajax(settings)
|
||||||
},
|
},
|
||||||
callbackContext: self
|
callbackContext: self,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: L._('Cancel')
|
label: L._('Cancel'),
|
||||||
}
|
},
|
||||||
];
|
]
|
||||||
self.ui.alert({content: msg, level: 'error', duration: 100000, actions: actions});
|
self.ui.alert({
|
||||||
}
|
content: msg,
|
||||||
else {
|
level: 'error',
|
||||||
if (xhr.status !== 0) { // 0 === request cut by user
|
duration: 100000,
|
||||||
self.ui.alert({'content': L._('Problem in the response'), 'level': 'error'});
|
actions: actions,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
if (xhr.status !== 0) {
|
||||||
|
// 0 === request cut by user
|
||||||
|
self.ui.alert({ content: L._('Problem in the response'), level: 'error' })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
loaded();
|
loaded()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
|
||||||
|
|
||||||
try {
|
try {
|
||||||
xhr.send(settings.data);
|
xhr.send(settings.data)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// Pass
|
// Pass
|
||||||
loaded();
|
loaded()
|
||||||
console.error('Bad Request', e);
|
console.error('Bad Request', e)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// supports only JSON as response data type
|
// supports only JSON as response data type
|
||||||
_json: function (verb, uri, options) {
|
_json: function (verb, uri, options) {
|
||||||
var args = arguments,
|
var args = arguments,
|
||||||
self = this;
|
self = this
|
||||||
var default_options = {
|
var default_options = {
|
||||||
'async': true,
|
async: true,
|
||||||
'callback': null,
|
callback: null,
|
||||||
'responseType': 'text',
|
responseType: 'text',
|
||||||
'data': null,
|
data: null,
|
||||||
'listen_form': null // optional form to listen in default callback
|
listen_form: null, // optional form to listen in default callback
|
||||||
};
|
}
|
||||||
var settings = L.Util.extend({}, default_options, options);
|
var settings = L.Util.extend({}, default_options, options)
|
||||||
|
|
||||||
if (verb === 'POST') {
|
if (verb === 'POST') {
|
||||||
// find a way not to make this django specific
|
// find a way not to make this django specific
|
||||||
var token = document.cookie.replace(/(?:(?:^|.*;\s*)csrftoken\s*\=\s*([^;]*).*$)|^.*$/, '$1');
|
var token = document.cookie.replace(
|
||||||
|
/(?:(?:^|.*;\s*)csrftoken\s*\=\s*([^;]*).*$)|^.*$/,
|
||||||
|
'$1'
|
||||||
|
)
|
||||||
if (token) {
|
if (token) {
|
||||||
settings.headers = settings.headers || {};
|
settings.headers = settings.headers || {}
|
||||||
settings.headers['X-CSRFToken'] = token;
|
settings.headers['X-CSRFToken'] = token
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
var callback = function (responseText, response) {
|
var callback = function (responseText, response) {
|
||||||
var data;
|
var data
|
||||||
try {
|
try {
|
||||||
data = JSON.parse(responseText);
|
data = JSON.parse(responseText)
|
||||||
}
|
} catch (err) {
|
||||||
catch (err) {
|
console.log(err)
|
||||||
console.log(err);
|
self.ui.alert({
|
||||||
self.ui.alert({content: L._('Problem in the response format'), level: 'error'});
|
content: L._('Problem in the response format'),
|
||||||
return;
|
level: 'error',
|
||||||
|
})
|
||||||
|
return
|
||||||
}
|
}
|
||||||
if (data.errors) {
|
if (data.errors) {
|
||||||
console.log(data.errors);
|
console.log(data.errors)
|
||||||
self.ui.alert({content: L._('An error occured'), level: 'error'});
|
self.ui.alert({ content: L._('An error occured'), level: 'error' })
|
||||||
} else if (data.login_required) {
|
} else if (data.login_required) {
|
||||||
// login_required should be an URL for the login form
|
// login_required should be an URL for the login form
|
||||||
if (settings.login_callback) settings.login_callback(data);
|
if (settings.login_callback) settings.login_callback(data)
|
||||||
else self.login(data, args);
|
else self.login(data, args)
|
||||||
|
} else {
|
||||||
|
if (settings.callback)
|
||||||
|
L.bind(settings.callback, settings.context || this)(data, response)
|
||||||
|
else self.default_callback(data, settings, response)
|
||||||
}
|
}
|
||||||
else {
|
|
||||||
if (settings.callback) L.bind(settings.callback, settings.context || this)(data, response);
|
|
||||||
else self.default_callback(data, settings, response);
|
|
||||||
}
|
}
|
||||||
};
|
|
||||||
|
|
||||||
this._ajax({
|
this._ajax({
|
||||||
verb: verb,
|
verb: verb,
|
||||||
|
@ -148,138 +166,131 @@ L.U.Xhr = L.Evented.extend({
|
||||||
data: settings.data,
|
data: settings.data,
|
||||||
callback: callback,
|
callback: callback,
|
||||||
headers: settings.headers,
|
headers: settings.headers,
|
||||||
listener: settings.listener
|
listener: settings.listener,
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
get: function (uri, options) {
|
get: function (uri, options) {
|
||||||
this._json('GET', uri, options);
|
this._json('GET', uri, options)
|
||||||
},
|
},
|
||||||
|
|
||||||
post: function (uri, options) {
|
post: function (uri, options) {
|
||||||
this._json('POST', uri, options);
|
this._json('POST', uri, options)
|
||||||
},
|
},
|
||||||
|
|
||||||
submit_form: function (form_id, options) {
|
submit_form: function (form_id, options) {
|
||||||
if(typeof options === 'undefined') options = {};
|
if (typeof options === 'undefined') options = {}
|
||||||
var form = L.DomUtil.get(form_id);
|
var form = L.DomUtil.get(form_id)
|
||||||
var formData = new FormData(form);
|
var formData = new FormData(form)
|
||||||
if(options.extraFormData) formData.append(options.extraFormData);
|
if (options.extraFormData) formData.append(options.extraFormData)
|
||||||
options.data = formData;
|
options.data = formData
|
||||||
this.post(form.action, options);
|
this.post(form.action, options)
|
||||||
return false;
|
return false
|
||||||
},
|
},
|
||||||
|
|
||||||
listen_form: function (form_id, options) {
|
listen_form: function (form_id, options) {
|
||||||
var form = L.DomUtil.get(form_id), self = this;
|
var form = L.DomUtil.get(form_id),
|
||||||
if (!form) return;
|
self = this
|
||||||
L.DomEvent
|
if (!form) return
|
||||||
.on(form, 'submit', L.DomEvent.stopPropagation)
|
L.DomEvent.on(form, 'submit', L.DomEvent.stopPropagation)
|
||||||
.on(form, 'submit', L.DomEvent.preventDefault)
|
.on(form, 'submit', L.DomEvent.preventDefault)
|
||||||
.on(form, 'submit', function () {
|
.on(form, 'submit', function () {
|
||||||
self.submit_form(form_id, options);
|
self.submit_form(form_id, options)
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
listen_link: function (link_id, options) {
|
listen_link: function (link_id, options) {
|
||||||
var link = L.DomUtil.get(link_id), self = this;
|
var link = L.DomUtil.get(link_id),
|
||||||
|
self = this
|
||||||
if (link) {
|
if (link) {
|
||||||
L.DomEvent
|
L.DomEvent.on(link, 'click', L.DomEvent.stop).on(link, 'click', function () {
|
||||||
.on(link, 'click', L.DomEvent.stop)
|
if (options.confirm && !confirm(options.confirm)) {
|
||||||
.on(link, 'click', function () {
|
return
|
||||||
if (options.confirm && !confirm(options.confirm)) { return;}
|
}
|
||||||
self.get(link.href, options);
|
self.get(link.href, options)
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
default_callback: function (data, options) {
|
default_callback: function (data, options) {
|
||||||
// default callback, to avoid boilerplate
|
// default callback, to avoid boilerplate
|
||||||
if (data.redirect) {
|
if (data.redirect) {
|
||||||
var newPath = data.redirect;
|
var newPath = data.redirect
|
||||||
if (window.location.pathname == newPath) window.location.reload(); // Keep the hash, so the current view
|
if (window.location.pathname == newPath)
|
||||||
else window.location = newPath;
|
window.location.reload() // Keep the hash, so the current view
|
||||||
}
|
else window.location = newPath
|
||||||
else if (data.info) {
|
} else if (data.info) {
|
||||||
this.ui.alert({content: data.info, level: 'info'});
|
this.ui.alert({ content: data.info, level: 'info' })
|
||||||
this.ui.closePanel();
|
this.ui.closePanel()
|
||||||
}
|
} else if (data.error) {
|
||||||
else if (data.error) {
|
this.ui.alert({ content: data.error, level: 'error' })
|
||||||
this.ui.alert({content: data.error, level: 'error'});
|
} else if (data.html) {
|
||||||
}
|
var ui_options = { data: data },
|
||||||
else if (data.html) {
|
listen_options
|
||||||
var ui_options = {'data': data},
|
if (options.className) ui_options.className = options.className
|
||||||
listen_options;
|
this.ui.openPanel(ui_options)
|
||||||
if (options.className) ui_options.className = options.className;
|
|
||||||
this.ui.openPanel(ui_options);
|
|
||||||
// To low boilerplate, if there is a form, listen it
|
// To low boilerplate, if there is a form, listen it
|
||||||
if (options.listen_form) {
|
if (options.listen_form) {
|
||||||
// Listen form again
|
// Listen form again
|
||||||
listen_options = L.Util.extend({}, options, options.listen_form.options);
|
listen_options = L.Util.extend({}, options, options.listen_form.options)
|
||||||
this.listen_form(options.listen_form.id, listen_options);
|
this.listen_form(options.listen_form.id, listen_options)
|
||||||
}
|
}
|
||||||
if (options.listen_link) {
|
if (options.listen_link) {
|
||||||
for (var i = 0, l = options.listen_link.length; i < l; i++) {
|
for (var i = 0, l = options.listen_link.length; i < l; i++) {
|
||||||
// Listen link again
|
// Listen link again
|
||||||
listen_options = L.Util.extend({}, options, options.listen_link[i].options);
|
listen_options = L.Util.extend({}, options, options.listen_link[i].options)
|
||||||
this.listen_link(options.listen_link[i].id, listen_options);
|
this.listen_link(options.listen_link[i].id, listen_options)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
} else if (options.success) {
|
||||||
else if (options.success) {
|
|
||||||
// Success is called only if data contain no msg and no html
|
// Success is called only if data contain no msg and no html
|
||||||
options.success(data);
|
options.success(data)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
login: function (data, args) {
|
login: function (data, args) {
|
||||||
// data.html: login form
|
// data.html: login form
|
||||||
// args: args of the first _json call, to call again at process end
|
// args: args of the first _json call, to call again at process end
|
||||||
var self = this;
|
var self = this
|
||||||
var proceed = function () {
|
var proceed = function () {
|
||||||
self.ui.closePanel();
|
self.ui.closePanel()
|
||||||
if (typeof args !== 'undefined') self._json.apply(self, args);
|
if (typeof args !== 'undefined') self._json.apply(self, args)
|
||||||
else self.default_callback(data, {});
|
else self.default_callback(data, {})
|
||||||
};
|
|
||||||
var ask_for_login = function (data) {
|
|
||||||
self.ui.openPanel({'data': data, className: 'login-panel'});
|
|
||||||
self.listen_form('login_form', {
|
|
||||||
'callback': function (data) {
|
|
||||||
if (data.html) ask_for_login(data); // Problem in the login - ask again
|
|
||||||
else proceed();
|
|
||||||
}
|
}
|
||||||
});
|
var ask_for_login = function (data) {
|
||||||
|
self.ui.openPanel({ data: data, className: 'login-panel' })
|
||||||
|
self.listen_form('login_form', {
|
||||||
|
callback: function (data) {
|
||||||
|
if (data.html) ask_for_login(data) // Problem in the login - ask again
|
||||||
|
else proceed()
|
||||||
|
},
|
||||||
|
})
|
||||||
// Auth links
|
// Auth links
|
||||||
var links = document.getElementsByClassName('umap-login-popup');
|
var links = document.getElementsByClassName('umap-login-popup')
|
||||||
Object.keys(links).forEach(function (el) {
|
Object.keys(links).forEach(function (el) {
|
||||||
var link = links[el];
|
var link = links[el]
|
||||||
L.DomEvent
|
L.DomEvent.on(link, 'click', L.DomEvent.stop).on(link, 'click', function () {
|
||||||
.on(link, 'click', L.DomEvent.stop)
|
self.ui.closePanel()
|
||||||
.on(link, 'click', function () {
|
var win = window.open(link.href)
|
||||||
self.ui.closePanel();
|
|
||||||
var win = window.open(link.href);
|
|
||||||
window.umap_proceed = function () {
|
window.umap_proceed = function () {
|
||||||
proceed();
|
proceed()
|
||||||
win.close();
|
win.close()
|
||||||
};
|
}
|
||||||
});
|
})
|
||||||
});
|
})
|
||||||
|
}
|
||||||
};
|
|
||||||
if (data.login_required) {
|
if (data.login_required) {
|
||||||
this.get(data.login_required, {
|
this.get(data.login_required, {
|
||||||
'callback': function (data) {
|
callback: function (data) {
|
||||||
ask_for_login(data);
|
ask_for_login(data)
|
||||||
}
|
},
|
||||||
});
|
})
|
||||||
}
|
} else {
|
||||||
else {
|
ask_for_login(data)
|
||||||
ask_for_login(data);
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
logout: function (url) {
|
logout: function (url) {
|
||||||
this.get(url);
|
this.get(url)
|
||||||
}
|
},
|
||||||
|
})
|
||||||
});
|
|
||||||
|
|
Loading…
Reference in a new issue