diff --git a/src/client/old.js b/src/client/old.js index 038991b..e845b5c 100644 --- a/src/client/old.js +++ b/src/client/old.js @@ -15,15 +15,20 @@ Vue.component("l-control-scale", window.Vue2Leaflet.LControlScale); // Vue.component("multiselect", window.VueMultiselect.default); Vue.use(window.VueTextareaAutosize); +var first_boot = true + const app = new Vue({ el: "#app", data: { edit_active: ["view", "short"].indexOf(window.location.pathname.split("/")[1]) == -1, journey: new journey_wrapper(window.location.pathname.split("/").pop() || String.gen_id(16)), - map_override: { active: false, center: [0, 0] }, - + map_override: { active: false, elements: [] }, query: { - type: "", res: [], load: false, + type: "", res: [], load: false, sub: false, + }, + leg_nav: { + scrollInterval: null, + scrollDir: null }, impexp: "", lang: { @@ -33,14 +38,6 @@ const app = new Vue({ }, monthBeforeYear: true, }, - polyline: { - latlngs: [], - color: 'green' - }, - leg_nav: { - scrollInterval: null, - scrollDir: null - } }, methods: { start_journey: function () { window.location.href = "/" + this.journey.id }, @@ -101,7 +98,16 @@ const app = new Vue({ log: function (e) { console.log(e); }, - + place_delete: function (f, idx) { + switch (f) { + case "hotel": return this.journey.leg_get().hotel = null; + case "restaurant": return this.journey.leg_get().places.restaurants.splice(idx, 1); + case "activities": return this.journey.leg_get().places.activities.splice(idx, 1); + case "other": return; + case "flight": return this.journey.leg_get().travel.splice(idx, 1); + default: return true; + } + }, get_filter: function (f) { switch (f) { case "hotel": return api.is_hotel_type; @@ -118,6 +124,12 @@ const app = new Vue({ rr.latlon = [parseFloat(rr.lat), parseFloat(rr.lon)]; rr.sname = rr.display_name.split(",")[0]; }); + r = r.filter(e => { + if (this.journey.leg_get().hotel && this.journey.leg_get().hotel.osm_id == e.osm_id) return false; + if (this.journey.leg_get().places.restaurants.find(i => i.osm_id == e.osm_id)) return false; + if (this.journey.leg_get().places.activities.find(i => i.osm_id == e.osm_id)) return false; + return true + }) this.query.load = false; this.query.res = r; return r @@ -128,9 +140,13 @@ const app = new Vue({ r.forEach(el => { el.path = getGeoLine( { lat: el.from_geo.lat, lng: el.from_geo.lon }, - { lat: el.to_geo.lat, lng: el.to_geo.lon }, { dist: 5_000_000 }).map(v => [v.lat, v.lng]) + { lat: el.to_geo.lat, lng: el.to_geo.lon }, { dist: 2_500_000 }).map(v => [v.lat, v.lng]) el.type = "flight"; }); + r = r.filter(e => { + if (this.journey.leg_get().travel.find(i => `${i.from}->${i.to}` == `${e.from}->${e.to}`)) return false; + return true + }) this.query.load = false; this.query.res = r; return r; @@ -140,7 +156,11 @@ const app = new Vue({ drawer_hover_item: function (item) { if (item) { this.map_override.active = true - this.map_override.center = [item.lat, item.lon] + if (item.type == 'flight') { + this.map_override.elements = [[item.from_geo.lat, item.from_geo.lon], [item.to_geo.lat, item.to_geo.lon]] + } else { + this.map_override.elements = [[item.lat, item.lon]] + } } else { this.map_override.active = false } @@ -150,13 +170,17 @@ const app = new Vue({ const tpe = this.query.type; this.query.res = []; this.query.type = null; + this.query.sub = false; this.drawer_hover_item() - switch (tpe) { - case 'hotel': return this.journey.leg_get().hotel = item; - case 'restaurant': return this.journey.leg_get().places.restaurants.push(item); - case 'place': return this.journey.leg_get().places.activities.push(item); - case 'other': return; - case 'flight': return this.journey.leg_get().travel.push(item); + if (item) { + item.step = -1; + switch (tpe) { + case 'hotel': return this.journey.leg_get().hotel = item; + case 'restaurant': return this.journey.leg_get().places.restaurants.push(item); + case 'place': return this.journey.leg_get().places.activities.push(item); + case 'other': return; + case 'flight': return this.journey.leg_get().travel.push(item); + } } }, @@ -172,9 +196,18 @@ const app = new Vue({ } }, + search_enable: function (f) { + this.query.type = f; + const query_in = document.getElementById('query_input') + + query_in.focus() + this.search_active({ target: query_in }) + }, + sideScroll: function (element, direction, speed, step) { this.leg_nav.scrollDir = direction + if (direction == 'none') return; this.leg_nav.scrollInterval = setInterval(() => { element.scrollLeft += (direction == 'left') ? -step : step; }, speed); @@ -187,8 +220,8 @@ const app = new Vue({ nav_mousemove(e) { const c = document.querySelector('.scroll-content') const newDir = - e.pageX < c.offsetWidth * 0.2 ? 'left' : - (e.pageX > c.offsetWidth * 0.8 ? 'right' : this.leg_nav.scrollDir) + e.pageX < c.offsetWidth * 0.1 ? 'left' : + (e.pageX > c.offsetWidth * 0.9 ? 'right' : 'none') if (!this.leg_nav.scrollInterval || this.leg_nav.scrollDir != newDir) { if (this.leg_nav.scrollInterval) clearInterval(this.leg_nav.scrollInterval) this.sideScroll(c, newDir, 25, 10); @@ -196,6 +229,7 @@ const app = new Vue({ }, nav_mouseleave(e) { clearInterval(this.leg_nav.scrollInterval); + this.leg_nav.scrollDir = 'none' this.leg_nav.scrollInterval = null }, }, @@ -222,13 +256,9 @@ const app = new Vue({ } }); - api.load(this.journey.id).then((r) => (app.journey.data = migrator(r))); - - // this.search_travel("flight")("qf1").then(r => { - // // this.polyline.latlngs = r.map(e => e.path) - // this.journey.data.main[this.journey.sel_leg].travel = r; - // }); - + api.load(this.journey.id).then((r) => { + app.journey.data = migrator(r) + }); }, watch: { journey: {