OpenStreetBrowser
/
OpenStreetBrowser
2
0
Fork 0
Code Issues 3 Pull Requests Releases Wiki Activity
Browse Source

CategoryOverpass: move filter to separate file, extend function via events

master
Stephan Bösch-Plepelits 6 years ago
parent
74376bacf8
commit
dcc0c3677b
4 changed files with 143 additions and 103 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      package.json
  2. 114
      src/CategoryOverpass.js
  3. 128
      src/CategoryOverpassFilter.js
  4. 1
      src/index.js

3
package.json
View File

@ -11,13 +11,14 @@
"@mapbox/maki": "^5.0.0",
"async": "^2.5.0",
"async-foreach": "^0.1.3",
"babelify": "^8.0.0",
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babelify": "^8.0.0",
"color-interpolate": "^1.0.2",
"event-emitter": "^0.3.5",
"file-saver": "^2.0.0",
"font-awesome": "^4.7.0",
"i18next-client": "^1.11.4",
"ip-location": "^1.0.1",
"json-multiline-strings": "^0.1.0",

114
src/CategoryOverpass.js
View File

@ -110,65 +110,8 @@ function CategoryOverpass (options, data) {
this.layer.on('remove', (ob, data) => this.emit('remove', ob, data))
this.layer.on('zoomChange', (ob, data) => this.emit('remove', ob, data))
if (this.data.filter) {
this.tabFilter = new tabs.Tab({
id: 'filter'
})
this.tools.add(this.tabFilter)
this.tabFilter.header.innerHTML = '<i class="fa fa-filter" aria-hidden="true"></i>'
this.tabFilter.header.title = lang('filter')
this.domFilter = document.createElement('form')
this.tabFilter.content.appendChild(this.domFilter)
this.tabFilter.on('select', () => this.formFilter.resize())
for (var k in this.data.filter) {
let f = this.data.filter[k]
if ('name' in f && typeof f.name === 'string') {
let t = OverpassLayer.twig.twig({ data: f.name, autoescape: true })
f.name = t.render({}).toString()
} else if (!('name' in f)) {
f.name = lang('tag:' + k)
}
if ('values' in f) {
if (Array.isArray(f.values) && f.valueName) {
let template = OverpassLayer.twig.twig({ data: f.valueName, autoescape: true })
let newValues = {}
f.values.forEach(value => {
newValues[value] = template.render({ value }).toString()
})
f.values = newValues
} else if (typeof f.values === 'object') {
for (var k1 in f.values) {
if (typeof f.values[k1] === 'string') {
let t = OverpassLayer.twig.twig({ data: f.values[k1], autoescape: true })
f.values[k1] = t.render({}).toString()
}
}
}
}
}
this.formFilter = new form(this.id, this.data.filter,
{
'type': 'form_chooser',
'button:add_element': '-- ' + lang('filter_results') + ' --',
'order': false
}
)
this.formFilter.show(this.domFilter)
this.formFilter.onchange = function () {
let param = JSON.parse(JSON.stringify(this.formFilter.get_data()))
this._applyParam(param)
this.layer.check_update_map()
state.update()
}.bind(this)
}
call_hooks('category-overpass-init', this)
var p = document.createElement('div')
p.className = 'loadingIndicator'
@ -199,18 +142,17 @@ function CategoryOverpass (options, data) {
let id = this.id
if (this.formFilter) {
let param = JSON.parse(JSON.stringify(this.formFilter.get_data()))
let param = {}
this.emit('stateGet', param)
for (var k in param) {
if (!param[k]) {
delete param[k]
}
for (var k in param) {
if (!param[k]) {
delete param[k]
}
}
if (param && Object.keys(param).length) {
id += '[' + queryString.stringify(param) + ']'
}
if (param && Object.keys(param).length) {
id += '[' + queryString.stringify(param) + ']'
}
state.categories += id
@ -241,42 +183,12 @@ function CategoryOverpass (options, data) {
}
CategoryOverpass.prototype.setParam = function (param) {
this.formFilter.set_data(param)
this.emit('setParam', param)
this._applyParam(param)
}
CategoryOverpass.prototype._applyParam = function (param) {
this.additionalFilter = []
for (var k in param) {
if (param[k] === null) {
continue
}
var d = this.data.filter[k]
var v = {
key: k,
value: param[k],
op: '='
}
if ('op' in d) {
if (d.op === 'has_key_value') {
v = {
key: param[k],
op: 'has_key'
}
} else {
v.op = d.op
}
}
this.additionalFilter.push(v)
}
this.layer.options.queryOptions.filter = this.additionalFilter
this.tabFilter.select()
this.emit('applyParam', param)
}
CategoryOverpass.prototype.updateAssets = function (div) {
@ -475,9 +387,7 @@ CategoryOverpass.prototype.open = function () {
this.updateInfo()
}
if (this.formFilter) {
this.formFilter.resize()
}
this.emit('open')
}
CategoryOverpass.prototype.updateInfo = function () {

128
src/CategoryOverpassFilter.js
View File

@ -0,0 +1,128 @@
const OverpassLayer = require('overpass-layer')
const tabs = require('modulekit-tabs')
const state = require('./state')
class CategoryOverpassFilter {
constructor (master) {
this.master = master
this.data = this.master.data.filter
this.tabFilter = new tabs.Tab({
id: 'filter'
})
this.master.tools.add(this.tabFilter)
this.tabFilter.header.innerHTML = '<i class="fa fa-filter" aria-hidden="true"></i>'
this.tabFilter.header.title = lang('filter')
this.domFilter = document.createElement('form')
this.tabFilter.content.appendChild(this.domFilter)
this.tabFilter.on('select', () => this.formFilter.resize())
for (var k in this.data) {
let f = this.data[k]
if ('name' in f && typeof f.name === 'string') {
let t = OverpassLayer.twig.twig({ data: f.name, autoescape: true })
f.name = t.render({}).toString()
} else if (!('name' in f)) {
f.name = lang('tag:' + k)
}
if ('values' in f) {
if (Array.isArray(f.values) && f.valueName) {
let template = OverpassLayer.twig.twig({ data: f.valueName, autoescape: true })
let newValues = {}
f.values.forEach(value => {
newValues[value] = template.render({ value }).toString()
})
f.values = newValues
} else if (typeof f.values === 'object') {
for (var k1 in f.values) {
if (typeof f.values[k1] === 'string') {
let t = OverpassLayer.twig.twig({ data: f.values[k1], autoescape: true })
f.values[k1] = t.render({}).toString()
}
}
}
}
}
this.formFilter = new form('filter-' + this.master.id, this.data,
{
'type': 'form_chooser',
'button:add_element': '-- ' + lang('filter_results') + ' --',
'order': false
}
)
this.formFilter.show(this.domFilter)
this.formFilter.onchange = function () {
let param = JSON.parse(JSON.stringify(this.formFilter.get_data()))
this.applyParam(param)
this.master.layer.check_update_map()
state.update()
}.bind(this)
this.master.on('setParam', param => this.formFilter.set_data(param))
this.master.on('applyParam', param => this.applyParam(param))
this.master.on('open', () => this.openCategory())
this.master.on('stateGet', param => this.stateGet(param))
}
applyParam (param) {
this.additionalFilter = []
for (var k in param) {
if (param[k] === null) {
continue
}
var d = this.data[k]
var v = {
key: k,
value: param[k],
op: '='
}
if ('op' in d) {
if (d.op === 'has_key_value') {
v = {
key: param[k],
op: 'has_key'
}
} else {
v.op = d.op
}
}
this.additionalFilter.push(v)
}
this.master.layer.options.queryOptions.filter = this.additionalFilter
this.tabFilter.select()
}
openCategory () {
this.formFilter.resize()
}
stateGet (param) {
let data = this.formFilter.get_data()
for (var k in data) {
if (data[k]) {
param[k] = data[k]
}
}
}
}
register_hook('category-overpass-init', (category) => {
if (category.data.filter) {
new CategoryOverpassFilter(category)
}
})

1
src/index.js
View File

@ -35,6 +35,7 @@ require('./wikipedia')
require('./image')
require('./addCategories')
require('./permalink')
require('./CategoryOverpassFilter')
let exportAll = require('./exportAll')
window.onload = function () {

Write Preview
Loading…
Cancel
Save