sora/OTM
1
0
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

wip
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
soraefir
2025-03-01 23:40:45 +01:00
parent c98be7a4e6
commit 52ee73a4ac
26 changed files with 413 additions and 1900 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
template/home.pug
View File

@@ -2,76 +2,31 @@ doctype html
include module/head.pug
main#app
.container
section.mb-big
.bg-white.section.text-dark
.container.mb-big
.text-center
img.main-logo.mb-medium(
src="/public/img/helcel.png",
alt="Helcel logo"
)
div
h1.text-huge.text-withSubtitle Open Tourism Map
h2.text-big.text-gray Collaborative Holiday Planner
p#js-header-waypoint.m-none
a.button.button--primary.button--mobileFull(href="#go") Get started
.bg-dark
.container
.row.text-center
.col-12.col-sm-3
.section
img(
src="/public/img/lightweight.png",
alt="Lightweight",
width="118"
)
.spacer
.section.bg-dark.text-white
.container-medium
.row
.col-8
h2.text-big Your journey
p.text-gray
| Browse hotels, restaurants and attractions,....
br
h2.text-withSubtitle.text-big.text-white
| Lightweight
br
span.text-medium.text-gray
| Powered By
br
| Fastify & Sierra
.col-12.col-sm-4
.section
img(
src="/public/img/customizable.png",
alt="Customizable",
width="118"
)
br
h2.text-withSubtitle.text-big.text-white
| Customizable
br
span.text-medium.text-gray
| Many Templates
br
| to choose from
.col-12.col-sm-4
.section
h2.text-withSubtitle.text-big.text-white
img(
src="/public/img/opensource.png",
alt="Open Source",
width="118"
)
br
|
| FOSS
br
span.text-medium.text-gray :-)
#go.container-medium.section
h2.text-big Your journey
p
| Browse hotels, restaurants and attractions,....
br
|
| Select and plan the varying elements of your journey
.aligner.aligner--contentEnd
.input
input#journey.id(v-model="journey.id", placeholder="ID", type="text")
button.button.button--primary.button--mobileFull(
v-on:click="start_journey"
) Start the journey
|
| Select and plan the varying elements of your journey
.col-4
.row.align
.input
input#journey.id(v-model="journey.id", placeholder="ID", type="text")
p
.row.align
button.button.button--primary.button--mobileFull(
v-on:click="start_journey"
) Start the journey
include module/foot.pug

3
template/journey.pug
View File

@@ -3,6 +3,5 @@ doctype html
include module/head.pug
main#app(v-cloak)
include module/nav.pug
include module/journey.pug
include module/journey/main.pug
include module/foot.pug

13
template/module/foot.pug
View File

@@ -2,21 +2,12 @@ script(src="https://unpkg.com/leaflet")
script(src="https://unpkg.com/vue@2")
script(src="https://unpkg.com/vue2-datepicker")
script(src="https://unpkg.com/vue-textarea-autosize")
script(src="https://unpkg.com/vue2-leaflet")
script(src="https://unpkg.com/sortablejs")
script(src="https://unpkg.com/vuedraggable")
script(src="/public/main.js", type="text/javascript", charset="utf-8")
footer.bg-dark
.container
.section.text-center.text-small
p.text-white
img(src="/public/img/helcel.png", alt="helcel logo", width="100")
br
br
|
footer.bg-dark.section
.container.text-center.text-small.text-white
| Built with   ❤   by Helcel
br
span.text-small.text-gray v0.0.1
p.text-gray
a(href="https://git.helcel.net") Helcel Git

3
template/module/journey.pug
View File

@@ -1,3 +0,0 @@
.journey
include journey/leg.pug
include journey/impexp.pug

11
template/module/journey/leg.pug
View File

@@ -1,11 +0,0 @@
include leg/nav.pug
.bg-dark.text-white(v-if="journey && journey.leg_get()")
.container.section
include leg/top.pug
.row(style="aspect-ratio:1.25;")
.map-container(:class="{ 'col-9': query.type, 'col-12': !query.type }" )
include map.pug
.drawer-container(:class="{ 'col-3': query.type, 'col-0': !query.type }")
include leg/drawer.pug
include leg/old_cfg.pug

8
template/module/journey/leg/drawer-notes.pug Normal file
View File

@@ -0,0 +1,8 @@
.col-12.input.text-dark()
textarea.text-small#query_note(
v-model="journey.leg_get().notes"
@input="refreshTextAreaHeight"
@focus="refreshTextAreaHeight"
rows="1"
placeholder="...",
)

32
template/module/journey/leg/drawer.pug
View File

@@ -1,16 +1,18 @@
.input.text-dark(style="width: 100%")
.col-12.input.text-dark
input#query_input(
type="search"
@input="search_active"
@focus="search_active"
placeholder="Search ... "
style="width:85%;"
:disabled="query.note"
)
.spinner(v-if="query.load")
div(style="width:100%"
v-if="['hotel', 'restaurant', 'place','other', 'travel'].indexOf(query.type)>=0")
div(v-if="['hotel', 'restaurant', 'place','other', 'travel'].indexOf(query.type)>=0")
template(v-for="(item, idx) in query.res" )
.col-12.bg-white.text-dark(
style="display:flex;align-items:center; border-radius:3px;"
.query-result.col-12.bg-white.text-dark(
:key="'q'+idx"
@mouseover="drawer_hover_item(item)"
@mouseleave="drawer_hover_item()"
@@ -20,20 +22,17 @@ div(style="width:100%"
| {{ item.name }}
.bg-dark.divider(
:key="'qdiv'+idx" style="height:1px" )
.col-12.bg-white.text-dark(
v-if="query.load==false && query.res.length==0"
style="display:flex;align-items:center; border-radius:3px;" )
.query-result.col-12.bg-white.text-dark(
v-if="query.load==false && query.res.length==0" )
div( v-html="generate_icon('star', 'var(--dark)')")
.col-10()
| Add custom
.col-12.text-white.text-center(
) {{query.load? `Loading ...` : `Found ${query.res.length} results`}}
div(style="width:100%"
v-else-if="['flight'].indexOf(query.type)>=0")
div(v-else-if="['flight'].indexOf(query.type)>=0")
template(v-for="(item, idx) in query.res" )
.col-12.bg-white.text-dark(
style="display:flex;align-items:center; border-radius:3px;"
.query-result.col-12.bg-white.text-dark(
:key="'q'+idx"
@mouseover="drawer_hover_item(item)"
@mouseleave="drawer_hover_item()"
@@ -41,10 +40,9 @@ div(style="width:100%"
div( v-html="generate_icon('plane', 'var(--dark)')")
.col-10()
| {{ item.from }} => {{item.to}}
.bg-dark.divider(
bg-dark.divider(
:key="'qdiv'+idx" style="height:1px" )
div(style="width:100%" v-else)
div(v-else)
template()
.col-12.bg-white.text-dark(
style="display:flex;align-items:center; border-radius:3px;")
| Unsuppored Query type {{query.type}}
.query-result.col-12.bg-white.text-dark()
| Unsuppored Query type {{query.type}}

51
template/module/journey/leg/nav.pug
View File

@@ -1,23 +1,34 @@
.scroll-handler(
.scroll-handler.row(
@mouseleave="nav_mouseleave"
@mousemove="nav_mousemove")
draggable.scroll-content.list-group.bg-dark(
tag="div",
:list="journey.data.main",
handle=".handle"
)
.list-group-item.handle(
v-for="(element, idx) in journey.data.main",
:key="idx",
@click="journey.leg_sel(idx)",
:class="journey.sel_leg == idx ? 'bg-primary' : 'bg-white'"
)
.text {{ element.title }}
i.fa.fa-times.close.fright(
style="top: 2px; right: 2px; position: absolute",
@click="journey.rm_leg(idx)"
)
.list-group-item.bg-white(@click="journey.add_leg()")
.text Add Leg
i.fa.fa-plus.add(style="top: 12px; right: 5px; position: absolute")
.col-3.col-sm-2.col-md-1
.list-group.text-dark.h-100
.fleft.list-group-item.bg-white.text-small.rounded.h-100(v-on:click.prevent="journey.leg_prev()")
i.fas.fa-angle-left
.col-6.col-sm-8.col-md-10
draggable.scroll-content.list-group.bg-dark(
tag="div",
:list="journey.data.main",
handle=".handle"
)
.list-group-item.handle.text-dark(
v-for="(element, idx) in journey.data.main",
:key="idx",
@click="journey.leg_sel(idx)",
:class="journey.sel_leg == idx ? 'bg-primary' : 'bg-white'"
)
.text {{ element.title || "Leg "+idx}}
i.fa.fa-times.close.fright(
style="top: 2px; right: 2px; position: absolute",
@click="journey.rm_leg(idx)"
)
.list-group-item.bg-dark
.list-group-item.bg-white.text-dark(@click="journey.add_leg()")
div
i.fa.fa-plus.add()
.col-3.col-sm-2.col-md-1
.list-group.text-dark.h-100
a.fright.list-group-item.bg-white.text-small.rounded.h-100(v-on:click.prevent="journey.leg_next()")
i.fas.fa-angle-right

12
template/module/journey/leg/old_cfg.pug
View File

@@ -1,12 +0,0 @@
div
div
.row.text-center
div
label Notes
.input.text-dark(style="width: 100%")
textarea-autosize.text-small(
v-model="journey.leg_get().notes",
placeholder="Notes",
:min-height="30",
:max-height="350"
)

29
template/module/journey/leg/top.pug
View File

@@ -1,15 +1,17 @@
.row.text-center
.col-sm-2
.input
input(v-model="journey.leg_get().title")
.col-sm-2
.row.text-center.align
.col-5.col-sm-4.col-md-2
.input
input(
placeholder="Day title",
placeholder="Leg"
v-model="journey.leg_get().title")
.col-5.col-sm-4.col-md-2.mr-auto
.input
input(
placeholder="Day"
v-model="journey.leg_get().day_title[journey.sel_day]"
)
.col-sm-4
.col-8.col-sm-6.col-md-4
.input
//- label Date Range ({{ journey.leg_len() }})
date-picker(
@@ -20,10 +22,15 @@
placeholder="Date Range",
v-on:change="journey.date_update(journey.sel_leg)"
)
.col-sm-2
.right.col-sm-2
.col-4.col-sm-4.col-md-3.ml-auto
.input
input(
disabled="",
:value="journey.date_sel() + ' (' + journey.sel_day + ')'"
)
)
//- .col-6.list-group-item.align.center.bg-white(style="padding: 0.5rem 0;")
//- i.fas.fa-angle-double-right(v-on:click.prevent="journey.day_next()")
.col-sm-1.text-small
//- a(href="#prev", v-on:click.prevent="journey.day_prev()")
i.fas.fa-angle-left

31
template/module/journey/main.pug Normal file
View File

@@ -0,0 +1,31 @@
.row.fleft(style="position:absolute;right:0;")
.col-1
a(:href="'/short/' + journey.id")
i.fas.fa-file-contract
.col-1
a(:href="'/view/' + journey.id")
i.fas.fa-camera
.col-1
a(href="#", v-on:click.prevent="first_step")
i.fas.fa-tools
.bg-dark.text-white(v-if="journey && journey.leg_get()")
.container
.row.align(style="padding-top:45px;")
.col-6.col-sm-4.col-md-3.input.text-big
input.text-center(v-model="journey.data.name" placeholder="My Journey" type="text")
//- input.small(type="text", :placeholder="journey.date_tot() + ' (' + journey.tot_len() + ')'" )
include leg/nav.pug
include leg/top.pug
.row(style="aspect-ratio:1.25;")
.map-container(:class=" { 'col-2 col-sm-5 col-md-8': query.type, 'col-2 col-sm-5 col-md-6': query.note , 'col-12': (!query.type && !query.note) }" )
include map.pug
.row.drawer-container(:class="{ 'col-10 col-sm-7 col-md-4': query.type, 'col-10 col-sm-7 col-md-6': query.note, 'col-0': (!query.type && !query.note) }")
.drawer-container(:class="{ 'col-12 ': query.type, 'col-0': !query.type }")
include leg/drawer.pug
.drawer-container(:class="{ 'col-12': query.note, 'col-0': !query.note }")
include leg/drawer-notes.pug
//- include impexp.pug

3
template/module/journey/map.pug
View File

@@ -3,12 +3,13 @@ l-map(
:center.sync="journey.leg_get().map.center",
style="height:100%"
no-blocking-animations=true
ref="map"
)
l-tile-layer(
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
attribution="© <a href=\"http://osm.org/copyright\">OpenStreetMap</a> contributors"
)
l-control-scale(position="bottomright", :imperial="false", :metric="true")
l-control-scale(position="bottomleft", :imperial="false", :metric="true")
include map/override.pug
include map/hotel.pug

26
template/module/journey/map/mixin-marker.pug
View File

@@ -15,27 +15,23 @@ mixin map_marker(place, color_sel_c, color_sel_o, color_else)
v-else
v-html="generate_marker(place, \""+color_else+"\")"
)
l-popup()
l-popup(
:options="{maxWidth:400, minWidth:300}")
h1.row.text-medium.text-center {{ place.sname }}
span.row.text-small.text-gray {{ place.display_name }}
span(v-if="edit_active")
.row.input(style="margin-bottom:0")
textarea-autosize.col-12.col-sm-12.text-small(
placeholder="Notes",
.row.input()
textarea.col-12.col-sm-12.text-small(
placeholder="",
v-model="place.notes",
:min-height="30",
:max-height="350"
)
a.leaflet-popup-close-button.text-gray(
style="right: 4px; visibility: visible",
href="#rm",
v-on:click.prevent="place_delete(\""+place+"\",index)"
v-html="generate_icon('trash', 'NA')"
)
a.leaflet-popup-close-button.text-gray(
style="right: 20px; visibility: visible",
href="#toggle_day",
.leaflet-popup-button-group(v-if="edit_active")
a.text-gray(
v-on:click.prevent="place.step = ((place.step==journey.sel_day)?-1:journey.sel_day)"
v-html="generate_icon(((place.step==journey.sel_day)?'calendar-xmark':'calendar-plus'), 'NA')"
)
a.text-gray(
v-on:click.prevent="place_delete(\""+place+"\",index)"
v-html="generate_icon('trash', 'NA')"
)
span.row.text-small.text-dark(v-else) {{ place.notes }}

30
template/module/journey/map/right_menu.pug
View File

@@ -1,5 +1,5 @@
.map-menu
div( v-if="query.type" @click="drawer_click_item()" )
.map-menu.map-menu-top
div(v-if="query.type" @click="drawer_click_item()" )
.map-menu-item(v-html="generate_icon('close')")
div(v-if="!query.type" @click="search_enable('hotel')")
.map-menu-item( v-html="generate_icon('bed')")
@@ -14,24 +14,8 @@
.map-menu-item(v-if="query.sub" @click="search_enable('car')" v-html="generate_icon('car')")
.map-menu-item(v-if="query.sub" @click="search_enable('other')" v-html="generate_icon('person-biking')")
//- .map-menu-sub {
//- display: flex;
//- flex-direction: row-reverse;
//- gap: 5px;
//- }
//- .map-menu-item,
//- .map-menu-sub-item {
//- background-color: var(--darkdark);
//- padding: 5px;
//- border-radius: 50%;
//- cursor: pointer;
//- float: right;
//- height: fit-content;
//- }
//- .vue2leaflet-map {
//- border-radius: 3px;
//- }
//- .leaflet-popup-content {
//- margin: 10px 20px;
//- }
.map-menu.map-menu-center
div(v-if="query.note" @click="drawer_click_item()" )
.map-menu-item(v-html="generate_icon('close')")
div(v-if="!query.note" @click="search_enable('notes')")
.map-menu-item( v-html="generate_icon('pencil')")

24
template/module/journey/map/travel.pug
View File

@@ -1,22 +1,22 @@
mixin flight_popup()
l-popup()
h1.row.text-medium.text-center {{ travel.id.toUpperCase() }}
l-popup(
:options="{maxWidth:400, minWidth:300}"
)
h1.row.text-medium.text-center.text-uppercase {{ travel.id }}
span.row.text-small.text-gray {{ travel.from }} - {{travel.to}}
span(v-if="edit_active")
.row.input(style="margin-bottom:0")
textarea-autosize.col-12.col-sm-12.text-small(
placeholder="Notes",
textarea.col-12.col-sm-12.text-small(
placeholder="",
v-model="travel.notes",
:min-height="30",
:max-height="350"
)
a.leaflet-popup-close-button.text-gray(
style="right: 4px; visibility: visible",
href="#rm",
v-on:click.prevent="place_delete('flight',idx)"
v-html="generate_icon('trash', 'NA')"
)
span.row.text-small.text-dark(v-else) {{ travel.notes }}
span(v-if="edit_active")
.leaflet-popup-button-group(v-if="edit_active")
a.text-gray(
v-on:click.prevent="place_delete('flight',idx)"
v-html="generate_icon('trash', 'NA')"
)
div(v-for= "(travel, idx) in journey.leg_get().travel")
l-polyline(:lat-lngs="travel.path" :color="travel.color || 'gray'")

38
template/module/nav.pug
View File

@@ -1,38 +0,0 @@
header.header
.header-inner.container
a.header-logo.text-dark(href="/")
img.header-logoImage(
src="/public/img/helcel.png",
alt="Helcel logo",
width="40"
)
span.hide-small OTM
.input.input-invis.row
input.col-6.small(v-model="journey.data.name", type="text")
input.col-6.small(
disabled,
type="text",
:placeholder="journey.date_tot() + ' (' + journey.tot_len() + ')'"
)
.row.header-nav.text-big(style="margin-bottom: 0")
.col-sm-2
a(:href="'/short/' + journey.id")
i.fas.fa-file-contract
.col-sm-2
a(:href="'/view/' + journey.id")
i.fas.fa-camera
.col-sm-2
a(href="#main", v-on:click.prevent="first_step")
i.fas.fa-tools
.col-sm-1.text-small
a(href="#prevprev", v-on:click.prevent="journey.leg_prev()")
i.fas.fa-angle-double-left
.col-sm-1
a(href="#prev", v-on:click.prevent="journey.day_prev()")
i.fas.fa-angle-left
.col-sm-1
a(href="#next", v-on:click.prevent="journey.day_next()")
i.fas.fa-angle-right
.col-sm-1.text-small
a(href="#nextnext", v-on:click.prevent="journey.leg_next()")
i.fas.fa-angle-double-right

7
template/module/view/nav.pug
View File

@@ -1,12 +1,5 @@
header.header
.header-inner.container
a.header-logo.text-dark(href="/")
img.header-logoImage(
src="/public/img/helcel.png",
alt="Helcel logo",
width="40"
)
span.hide-small HOTM
.input.input-invis
input.small(:value="journey.data.name", type="text", disabled="")
.row.header-nav.text-big(style="margin-bottom: 0")

12
template/module/view/short_leg.pug
View File

@@ -16,28 +16,22 @@
input(disabled="", :value="item.map((v) => v.id).join(', ')")
.row.text-center
.input.col-sm-8(v-if="item.places && item.places.restaurants")
textarea-autosize.text-small(
.text-small(
placeholder="No Restaurants",
:value="item.places.restaurants.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ')",
:min-height="30",
:max-height="350",
disabled=""
)
.row.text-center
.input.col-sm-8(v-if="item.places && item.places.activities")
textarea-autosize.text-small(
.text-small(
placeholder="No Activities",
:value="item.places.activities.map((v) => v.sname + (v.notes ? '(' + v.notes + ')' : '')).join(', ')",
:min-height="30",
:max-height="350",
disabled=""
)
.row.text-center
.input.col-sm-8(v-if="item.notes")
textarea-autosize.text-small(
.text-small(
placeholder="No Notes",
:value="item.notes",
:min-height="30",
:max-height="350",
disabled=""
)

2
template/view.pug
View File

@@ -1,6 +1,6 @@
doctype html
include module/head.pug
main#app(v-cloak)
div(v-if="journey.data.main[journey.sel_leg] != undefined")
div(v-if="journey.leg_get()")
include module/view/view_day.pug
include module/foot.pug