Skip to content

Commit

Permalink
feature: Start to implement simple open street map based resolver. Th…
Browse files Browse the repository at this point in the history
…is should be replaced with better solutions (google maps, mapbox etc.)
  • Loading branch information
franzwilding committed Apr 10, 2019
1 parent f89af79 commit 53e414b
Show file tree
Hide file tree
Showing 9 changed files with 187 additions and 11 deletions.
File renamed without changes.
File renamed without changes.
8 changes: 4 additions & 4 deletions Resources/public/entrypoints.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,18 @@
"entrypoints": {
"main": {
"css": [
"/bundles/unitecmscore/main.309cb5ed.css"
"/bundles/unitecmscore/main.325fad61.css"
],
"js": [
"/bundles/unitecmscore/main.e0a96e8e.js"
"/bundles/unitecmscore/main.5c8e09a1.js"
]
},
"email": {
"css": [
"/bundles/unitecmscore/email.741e9399.css"
"/bundles/unitecmscore/email.394226f5.css"
],
"js": [
"/bundles/unitecmscore/email.bbebb9e4.js"
"/bundles/unitecmscore/email.c1ff6f8e.js"
]
}
}
Expand Down

Large diffs are not rendered by default.

Large diffs are not rendered by default.

8 changes: 4 additions & 4 deletions Resources/public/manifest.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"email.css": "/bundles/unitecmscore/email.741e9399.css",
"email.js": "/bundles/unitecmscore/email.bbebb9e4.js",
"main.css": "/bundles/unitecmscore/main.309cb5ed.css",
"main.js": "/bundles/unitecmscore/main.e0a96e8e.js",
"email.css": "/bundles/unitecmscore/email.394226f5.css",
"email.js": "/bundles/unitecmscore/email.c1ff6f8e.js",
"main.css": "/bundles/unitecmscore/main.325fad61.css",
"main.js": "/bundles/unitecmscore/main.5c8e09a1.js",
"fonts/WorkSans-Bold.woff2": "/bundles/unitecmscore/fonts/WorkSans-Bold.910bcc47.woff2",
"fonts/WorkSans-Medium.woff2": "/bundles/unitecmscore/fonts/WorkSans-Medium.62229411.woff2"
}
6 changes: 6 additions & 0 deletions Resources/views/Form/uikit_layout.html.twig
Original file line number Diff line number Diff line change
Expand Up @@ -253,4 +253,10 @@
{{ form_widget(form.children.currency) }}
</div>
</div>
{%- endblock -%}

{%- block unite_cms_core_location_widget -%}
<unite-cms-core-location-field
name="{{ form.vars.full_name }}"
value="{{ form.vars.value|json_encode }}"></unite-cms-core-location-field>
{%- endblock -%}
2 changes: 2 additions & 0 deletions Resources/webpack/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import VariantsSelect from "./vue/components/VariantsSelect.vue";
import VariantsVariant from "./vue/components/VariantsVariant.vue";
import Reference from "./vue/field/Reference.vue";
import Link from "./vue/field/Link.vue";
import Location from "./vue/field/Location.vue";
import State from "./vue/field/State.vue";
import AutoText from "./vue/field/AutoText.vue";

Expand Down Expand Up @@ -59,6 +60,7 @@ Vue.customElement('unite-cms-core-api-token-field', ApiTokenField);
Vue.customElement('unite-cms-core-iframe-preview', iFramePreview);
Vue.customElement('unite-cms-core-reference-field', Reference);
Vue.customElement('unite-cms-core-link-field', Link);
Vue.customElement('unite-cms-core-location-field', Location);
Vue.customElement('unite-cms-core-state-field', State);
Vue.customElement('unite-cms-core-auto-text-field', AutoText);

Expand Down
168 changes: 168 additions & 0 deletions Resources/webpack/vue/field/Location.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,168 @@
<template>
<div class="uk-form-controls uk-form-controls-text uk-form-controls-checkbox">

<div class="uk-search uk-search-default" v-on:click="showDropdown">
<button v-if="!searchDone" v-on:click.prevent="search" class="uk-search-icon-flip" uk-search-icon></button>
<button v-if="searchDone" v-on:click.prevent="clear" class="uk-search-icon-flip uk-search-icon uk-icon" v-html="feather.icons['x'].toSvg({ width: 20, height: 20 })"></button>

<input @keypress.13.prevent="search" class="uk-search-input" type="search" placeholder="Search..." v-model="query">
</div>
<div uk-dropdown="mode:null;delay-hide:0">
<div v-if="queryResults.length === 0" class="uk-placeholder uk-text-center">
<small>No locations found.</small>
</div>
<ul v-else class="uk-nav uk-dropdown-nav">
<li v-for="result in queryResults">
<a v-on:click.prevent="selectResult(result)" href="#">{{ result.display_name }} <span class="uk-label">{{ result.osm_type }}</span></a>
</li>
<li class="uk-nav-divider"></li>
<li><small>{{ queryResults[0].licence }}</small></li>
</ul>
</div>


<input v-for="(value, key) in fieldData" v-if="key !== 'admin_levels'" type="hidden" :name="name + '[' + key + ']'" :value="value" />
<template v-for="(row, delta) in fieldData.admin_levels">
<input type="hidden" :name="name + '[admin_levels][' + delta + '][name]'" :value="row.name" />
<input type="hidden" :name="name + '[admin_levels][' + delta + '][code]'" :value="row.code" />
<input type="hidden" :name="name + '[admin_levels][' + delta + '][level]'" :value="row.level" />
</template>
</div>
</template>

<script>
import feather from 'feather-icons';
import UIkit from 'uikit';
export default {
data(){
let locationData = JSON.parse(this.value);
return {
query: locationData.display_name || '',
searchDone: !!locationData.id,
queryResults: [],
fieldData: locationData,
feather: feather
};
},
props: [
'id',
'label',
'name',
'value',
],
mounted() {
this.dropdown = UIkit.dropdown(this.$el.querySelector('*[uk-dropdown]'));
},
methods: {
clear() {
this.searchDone = false;
this.query = '';
this.fieldData = {
admin_levels: [],
bound_east: 0,
bound_north: 0,
bound_south: 0,
bound_west: 0,
category: null,
country_code: null,
display_name: null,
id: null,
latitude: 0,
longitude: 0,
postal_code: null,
provided_by: null,
street_name: null,
street_number: null,
sub_locality: null,
locality: null,
};
},
search() {
this.searchDone = false;
this.queryResults = [];
let request = new XMLHttpRequest();
request.onload = () => {
this.queryResults = JSON.parse(request.responseText);
this.searchDone = true;
this.dropdown.show();
};
request.open("GET", 'https://nominatim.openstreetmap.org/search?format=jsonv2&addressdetails=1&limit=5&q=' + encodeURI(this.query), true);
request.send();
},
showDropdown() {
if(this.searchDone) {
this.dropdown.show();
}
},
selectResult(result) {
this.query = result.display_name;
console.log(result);
this.fieldData = {
admin_levels: [],
bound_east: result.boundingbox[3],
bound_north: result.boundingbox[1],
bound_south: result.boundingbox[0],
bound_west: result.boundingbox[2],
category: result.osm_type,
country_code: result.address.country_code.toUpperCase(),
display_name: result.display_name,
id: result.osm_id,
latitude: result.lat,
longitude: result.lon,
postal_code: result.address.postcode,
provided_by: 'nominatim',
street_name: result.address.road || result.address.pedestrian || null,
street_number: result.address.house_number || null,
sub_locality: result.address.suburb || null,
locality: result.address.city || result.address.town || result.address.village || result.address.hamlet,
};
['state', 'country'].forEach((level, delta) => {
if(typeof result.address[level] !== 'undefined') {
this.fieldData.admin_levels.push({
level: delta + 1,
name: result.address[level],
code: '',
});
}
});
this.dropdown.hide();
}
}
}
</script>

<style lang="scss">
@import "../../sass/base/variables";
unite-cms-core-location-field {
position: relative;
display: block;
.uk-form-controls {
display: inline-block;
width: 400px;
box-sizing: border-box;
max-width: 100%;
}
.uk-placeholder {
padding: 10px;
margin: 0;
}
.uk-search-default {
width: 100%;
box-sizing: border-box;
padding-left: 15px;
}
.uk-search-default .uk-search-input {
border: none;
}
}
</style>

0 comments on commit 53e414b

Please sign in to comment.