This commit is contained in:
parent
db2db3b89a
commit
24e99bb41d
117
public/template/default.html
Normal file
117
public/template/default.html
Normal file
@ -0,0 +1,117 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html$if(lang)$ lang="$lang$"$endif$ >
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="generator" content="pandoc">
|
||||||
|
<link rel='shortcut icon' href='/public/img/helcel.ico' type='image/x-icon'/>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
||||||
|
$for(author-meta)$
|
||||||
|
<meta name="author" content="$author-meta$">
|
||||||
|
$endfor$
|
||||||
|
$if(date-meta)$
|
||||||
|
<meta name="dcterms.date" content="$date-meta$">
|
||||||
|
$endif$
|
||||||
|
<title>$if(title-prefix)$$title-prefix$ - $endif$$pagetitle$</title>
|
||||||
|
<style type="text/css">code{white-space: pre;}</style>
|
||||||
|
<!--[if lt IE 9]>
|
||||||
|
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||||
|
<![endif]-->
|
||||||
|
$if(quotes)$
|
||||||
|
<style type="text/css">q { quotes: "“" "”" "‘" "’"; }</style>
|
||||||
|
$endif$
|
||||||
|
$for(css)$
|
||||||
|
<link rel="stylesheet" href="$css$">
|
||||||
|
$endfor$
|
||||||
|
$for(header-includes)$
|
||||||
|
$header-includes$
|
||||||
|
$endfor$
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header itemscope itemtype="https://schema.org/Person" class="$if(photo)$with-photo$endif$">
|
||||||
|
<div id="title">
|
||||||
|
$if(qrcode)$
|
||||||
|
<img class="logo" src="$qrcode$" />
|
||||||
|
$endif$
|
||||||
|
<h1 class="fullname">
|
||||||
|
<span itemprop="givenName">$firstname$</span>
|
||||||
|
<span itemprop="familyName">$lastname$</span>
|
||||||
|
</h1>
|
||||||
|
<h2 class="title">$description$</h2>
|
||||||
|
</div>
|
||||||
|
$if(photo)$
|
||||||
|
<img class="portrait" src="$photo$"></div>
|
||||||
|
$endif$
|
||||||
|
<ul class="details">
|
||||||
|
<!-- phone -->
|
||||||
|
$if(phone)$
|
||||||
|
$if(settings.protect-phone)$
|
||||||
|
$if(privatecv)$
|
||||||
|
<li><a class='phone' href="phoneto:$phone$">$phone$</a></li>
|
||||||
|
$endif$
|
||||||
|
$else$
|
||||||
|
<li><a class='phone' href="phoneto:$phone$">$phone$</a></li>
|
||||||
|
$endif$
|
||||||
|
$endif$
|
||||||
|
<!-- mobile -->
|
||||||
|
$if(mobile)$
|
||||||
|
$if(settings.protect-mobile)$
|
||||||
|
$if(privatecv)$
|
||||||
|
<li><a class='mobile' href="phoneto:$mobile$">$mobile$</a></li>
|
||||||
|
$endif$
|
||||||
|
$else$
|
||||||
|
<li><a class='mobile' href="phoneto:$mobile$">$mobile$</a></li>
|
||||||
|
$endif$
|
||||||
|
$endif$
|
||||||
|
<!-- email -->
|
||||||
|
$if(email)$
|
||||||
|
$if(settings.protect-email)$
|
||||||
|
$if(privatecv)$
|
||||||
|
<li><a href="mailto:$email$">$email$</a></li>
|
||||||
|
$endif$
|
||||||
|
$else$
|
||||||
|
<li><a href="mailto:$email$">$email$</a></li>
|
||||||
|
$endif$
|
||||||
|
$endif$
|
||||||
|
<!-- homepage -->
|
||||||
|
$if(homepage)$
|
||||||
|
<li><a href="$homepage$" itemprop="url" title="homepage">$homepage$</a></li>
|
||||||
|
$endif$
|
||||||
|
<!--if(address)-->
|
||||||
|
$if(address)$
|
||||||
|
$if(settings.protect-address)$
|
||||||
|
$if(privatecv)$
|
||||||
|
<li itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
|
||||||
|
$if(address.city)$
|
||||||
|
<span itemprop="addressLocality">$address.city$</span>
|
||||||
|
$endif$
|
||||||
|
$if(address.country)$
|
||||||
|
<span itemprop="addressCountry">$address.country$</span>
|
||||||
|
$endif$
|
||||||
|
</li>
|
||||||
|
$endif$
|
||||||
|
$else$
|
||||||
|
<li itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
|
||||||
|
$if(address.city)$
|
||||||
|
<span itemprop="addressLocality">$address.city$</span>
|
||||||
|
$endif$
|
||||||
|
$if(address.country)$
|
||||||
|
<span itemprop="addressCountry">$address.country$</span>
|
||||||
|
$endif$
|
||||||
|
</li>
|
||||||
|
$endif$
|
||||||
|
$endif$
|
||||||
|
<!--endif-->
|
||||||
|
</ul>
|
||||||
|
</header>
|
||||||
|
$for(include-before)$
|
||||||
|
$include-before$
|
||||||
|
$endfor$
|
||||||
|
$body$
|
||||||
|
$for(include-after)$
|
||||||
|
$include-after$
|
||||||
|
$endfor$
|
||||||
|
<footer>
|
||||||
|
$footer$
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
139
public/template/home.html
Normal file
139
public/template/home.html
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Helcel-OTM</title>
|
||||||
|
|
||||||
|
<link rel='shortcut icon' href='/public/img/helcel.ico' type='image/x-icon'/>
|
||||||
|
<meta charset='utf-8'/>
|
||||||
|
<meta name='viewport' content='width=device-width, initial-scale=1'/>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,700,300" type="text/css">
|
||||||
|
<link rel='stylesheet' href='/public/css/index.css'/>
|
||||||
|
|
||||||
|
<script src="/public/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/vue2-datepicker/index.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/vue2-datepicker/index.css">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="//unpkg.com/leaflet/dist/leaflet.css" />
|
||||||
|
<script src="//unpkg.com/leaflet/dist/leaflet.js"></script>
|
||||||
|
<script src="//unpkg.com/vue2-leaflet"></script>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
||||||
|
<script src="https://unpkg.com/lodash/lodash.min.js"></script>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/vue-multiselect"></script>
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/vue-multiselect/dist/vue-multiselect.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<main id="app">
|
||||||
|
<!--<header class="header js-header">
|
||||||
|
<div class="header-inner container">
|
||||||
|
<a href="/" class="header-logo text-dark">
|
||||||
|
<img class="header-logoImage" src="/public/img/helcel.png" alt="Helcel logo" width="40">
|
||||||
|
<span class="hide-small">Helcel</span>
|
||||||
|
</a>
|
||||||
|
<ul class="header-nav">
|
||||||
|
<li class="header-navItem"><a class="text-dark" href="/">OTM</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</header>-->
|
||||||
|
<div class="container">
|
||||||
|
<section class="mb-big">
|
||||||
|
<div class="text-center">
|
||||||
|
<img class="main-logo mb-medium" src="/public/img/helcel.png" alt="Helcel logo">
|
||||||
|
<div>
|
||||||
|
<h1 class="text-huge text-withSubtitle">Open Tourism Map</h1>
|
||||||
|
<h2 class="text-big text-gray">Collaborative Holiday Planner</h2>
|
||||||
|
</div>
|
||||||
|
<p id="js-header-waypoint" class="m-none">
|
||||||
|
<a class="button button--primary button--mobileFull" href="#go">Get started</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-dark">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row text-center">
|
||||||
|
<div class="col-12 col-sm-3">
|
||||||
|
<div class="section">
|
||||||
|
<img src="/public/img/lightweight.png" alt="Lightweight" width="118"> <br>
|
||||||
|
<h2 class="text-withSubtitle text-big text-white">Lightweight <br>
|
||||||
|
<span class="text-medium text-gray">Powered By<br>Fastify & Sierra</span></h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-12 col-sm-4">
|
||||||
|
<div class="section">
|
||||||
|
<img src="/public/img/customizable.png" alt="Customizable" width="118"> <br>
|
||||||
|
<h2 class="text-withSubtitle text-big text-white">Customizable<br>
|
||||||
|
<span class="text-medium text-gray">Many Templates<br>to choose from</span>
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-sm-4">
|
||||||
|
<div class="section">
|
||||||
|
<h2 class="text-withSubtitle text-big text-white">
|
||||||
|
<img src="/public/img/opensource.png" alt="Open Source" width="118"> <br>
|
||||||
|
FOSS<br>
|
||||||
|
|
||||||
|
<span class="text-medium text-gray">:-)</span>
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="go" class="container-medium section">
|
||||||
|
<h2 class="text-big">Your journey</h2>
|
||||||
|
<p>Browse hotels, restaurants and attractions,.... <br> Select and plan the varying elements of your journey</p>
|
||||||
|
<div class="aligner aligner--contentEnd">
|
||||||
|
<div class="input">
|
||||||
|
<input id="journey_id" v-model="journey_id" placeholder="ID" type="text">
|
||||||
|
</div>
|
||||||
|
<button class="button button--primary button--mobileFull" v-on:click="start_journey">Start the journey</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div class="section bg-dark">
|
||||||
|
<div class="container text-center">
|
||||||
|
<h3 class="text-huge text-white text-withSubtitle">Developed entirely with Sierra library selectors</h3>
|
||||||
|
<h4 class="text-big text-gray">Just define your custom SCSS variables and compile</h4>
|
||||||
|
<p>
|
||||||
|
<p><a href="https://sierra-library.github.io/" class="button button--secondary button--medium button--mobileFull">Documentation</a> <a href="https://github.com/sierra-library/sierra-library.github.io/tree/master/examples/example1" class="button button--outlined button--medium button--mobileFull">View code</a></p>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="container-medium section">
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||||
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||||
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||||
|
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||||
|
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||||
|
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<div class="aligner aligner--contentEnd">
|
||||||
|
<a href="https://github.com/sierra-library/sierra" class="button button--primary button--mobileFull">Visit Github Page</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="/public/js/main.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
<footer class="bg-dark">
|
||||||
|
<div class="container">
|
||||||
|
<div class="section text-center text-small">
|
||||||
|
<p class="text-white">
|
||||||
|
<img src="/public/img/helcel.png" alt="helcel logo" width="100"><br><br>
|
||||||
|
Built with ❤ by Helcel <br><span class="text-small text-gray">v0.0.1</span>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p class="text-gray"><a href="https://git.helcel.net">Helcel Git</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
320
public/template/journey.html
Normal file
320
public/template/journey.html
Normal file
@ -0,0 +1,320 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Helcel-OTM</title>
|
||||||
|
|
||||||
|
<link rel='shortcut icon' href='/public/img/helcel.ico' type='image/x-icon'/>
|
||||||
|
<meta charset='utf-8'/>
|
||||||
|
<meta name='viewport' content='width=device-width, initial-scale=1'/>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,700,300" type="text/css">
|
||||||
|
<link rel='stylesheet' href='/public/css/index.css'/>
|
||||||
|
|
||||||
|
<script src="/public/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/vue2-datepicker/index.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/vue2-datepicker/index.css">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="//unpkg.com/leaflet/dist/leaflet.css" />
|
||||||
|
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
|
||||||
|
<script src="https://unpkg.com/vue2-leaflet"></script>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/leaflet.awesome-markers/dist/leaflet.awesome-markers.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet.awesome-markers/dist/leaflet.awesome-markers.css">
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/@fortawesome/fontawesome-free/css/all.min.css">
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
||||||
|
<script src="https://unpkg.com/lodash/lodash.min.js"></script>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/vue-multiselect"></script>
|
||||||
|
|
||||||
|
<script src="//cdn.jsdelivr.net/npm/sortablejs/Sortable.min.js"></script>
|
||||||
|
<script src="https://unpkg.com/vuedraggable/dist/vuedraggable.umd.min.js"></script>
|
||||||
|
<script src="https://unpkg.com/vue-textarea-autosize/dist/vue-textarea-autosize.umd.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/vue-multiselect/dist/vue-multiselect.min.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<main id="app">
|
||||||
|
<header class="header">
|
||||||
|
<div class="header-inner container">
|
||||||
|
<a href="/" class="header-logo text-dark">
|
||||||
|
<img class="header-logoImage" src="/public/img/helcel.png" alt="Helcel logo" width="40">
|
||||||
|
<span class="hide-small">HOTM</span>
|
||||||
|
</a>
|
||||||
|
<div class="input input-invis"><input class="small" v-model="journey_data.name" type="text" /></div>
|
||||||
|
|
||||||
|
<ul class="header-nav">
|
||||||
|
<div class="col-sm-5"><button class="button button--primary button--mobileFull" v-on:click="first_step">Main</button></div>
|
||||||
|
<div class="col-sm-5"><button class="button button--primary button--mobileFull" v-on:click="next_step">Next</button></div>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div v-if="journey_step==-1">
|
||||||
|
<div v-for="(item,idx) in journey_data.main" :class="idx%2===0 ? 'bg-dark text-white' : ''" v-cloak>
|
||||||
|
<div class="container section">
|
||||||
|
<div class="row text-center">
|
||||||
|
<div class="col-sm-1"><button class="button button--secondary button--mobileFull" v-on:click="rm_section(idx)">X</button></div>
|
||||||
|
<div class="input col-sm-4"><input class="" v-model="item.title" type="text" /></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12 col-sm-8">
|
||||||
|
<l-map
|
||||||
|
:zoom.sync="item.map.zoom"
|
||||||
|
:center.sync="item.map.center"
|
||||||
|
style="padding-top: 100%;"
|
||||||
|
|
||||||
|
>
|
||||||
|
<l-tile-layer
|
||||||
|
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
|
||||||
|
attribution='© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
|
||||||
|
></l-tile-layer>
|
||||||
|
<l-control-scale position="topright" :imperial="false" :metric="true"></l-control-scale>
|
||||||
|
|
||||||
|
<l-marker v-if="item.hotel && item.hotel.icon" :lat-lng.sync="item.hotel.latlon">
|
||||||
|
<l-icon>
|
||||||
|
<div v-html="generate_icon(item.hotel,'hotel')"></div>
|
||||||
|
</l-icon>
|
||||||
|
<l-popup>
|
||||||
|
<div>
|
||||||
|
Hotel: {{item.hotel.display_name}}
|
||||||
|
</div>
|
||||||
|
</l-popup>
|
||||||
|
|
||||||
|
<!-- <l-tooltip :options="{ permanent: true, interactive: true }">
|
||||||
|
<div>
|
||||||
|
H
|
||||||
|
</div>
|
||||||
|
</l-tooltip> -->
|
||||||
|
</l-marker>
|
||||||
|
<l-marker v-for="place in item.places.restaurants" :lat-lng.sync="place.latlon">
|
||||||
|
<l-icon>
|
||||||
|
<div v-html="generate_icon(place,'food')"></div>
|
||||||
|
</l-icon>
|
||||||
|
<l-popup>
|
||||||
|
<div>
|
||||||
|
Food: {{place.display_name}}
|
||||||
|
</div>
|
||||||
|
</l-popup>
|
||||||
|
</l-marker>
|
||||||
|
<l-marker v-for="place in item.places.activities" :lat-lng.sync="place.latlon">
|
||||||
|
<l-icon>
|
||||||
|
<div v-html="generate_icon(place,'activity')"></div>
|
||||||
|
</l-icon>
|
||||||
|
<l-popup>
|
||||||
|
<div>
|
||||||
|
Activity: {{place.display_name}}
|
||||||
|
</div>
|
||||||
|
</l-popup>
|
||||||
|
</l-marker>
|
||||||
|
</l-map>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-sm-4">
|
||||||
|
<div class="row text-center">
|
||||||
|
<div><label>Date Range</label></div>
|
||||||
|
<div class="input ">
|
||||||
|
<date-picker v-model="item.dateRange" range :placeholder="item.dateRange"></date-picker>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row text-center">
|
||||||
|
<div><label>Hotel</label></div>
|
||||||
|
<multiselect v-model="item.hotel" id="ajax" label="display_name" track-by="place_id" placeholder="Type to search" open-direction="bottom" :options="query.nominatim" :searchable="true" :loading="querying.hotel" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.hotel"></multiselect>
|
||||||
|
</div>
|
||||||
|
<div class="row text-center">
|
||||||
|
<div><label>Fight</label></div>
|
||||||
|
|
||||||
|
<multiselect v-model="item.flightA" id="ajax" label="label" track-by="id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.flight" :searchable="true" :loading="querying.flight" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.flight"></multiselect>
|
||||||
|
<multiselect v-model="item.flightB" id="ajax" label="label" track-by="id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.flight" :searchable="true" :loading="querying.flight" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.flight"></multiselect>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="row text-center">
|
||||||
|
<div><label>Restoration</label></div>
|
||||||
|
|
||||||
|
<multiselect v-model="item.places.restaurants" id="ajax" label="display_name" track-by="place_id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.nominatim" :searchable="true" :loading="querying.food" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.restaurants"></multiselect>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="row text-center">
|
||||||
|
<div><label>Activities</label></div>
|
||||||
|
|
||||||
|
<multiselect v-model="item.places.activities" id="ajax" label="display_name" track-by="place_id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.nominatim" :searchable="true" :loading="querying.place" :internal-search="false" :clear-on-select="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.places"></multiselect>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="">
|
||||||
|
<div class="container-medium section">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="bg-dark">
|
||||||
|
<div id="go" class="container-medium section text-white">
|
||||||
|
<h2 class="text-big">Add new section</h2>
|
||||||
|
<p>Got an other flight and/or hotel ? Add a new section to register it</p>
|
||||||
|
<div class="aligner aligner--contentEnd">
|
||||||
|
<button class="button button--primary button--mobileFull" v-on:click="add_section">Add Section</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else-if="journey_step>=0 && journey_data.main[journey_step_data.section]">
|
||||||
|
<div class="bg-dark text-white" v-cloak>
|
||||||
|
<div class="container section">
|
||||||
|
<div class="row text-center">
|
||||||
|
<div class="input col-sm-4"><input :value="journey_data.main[journey_step_data.section].title + ': Day ' + journey_step_data.day" disabled /></div>
|
||||||
|
<div class="input col-sm-2"><input placeholder="Day title" v-model="journey_data.step_title[journey_step]" /></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12 col-sm-12">
|
||||||
|
<l-map
|
||||||
|
:zoom=" journey_data.main[journey_step_data.section].map.zoom"
|
||||||
|
:center="journey_data.main[journey_step_data.section].map.center"
|
||||||
|
style="padding-top: 100%;"
|
||||||
|
|
||||||
|
>
|
||||||
|
<l-tile-layer
|
||||||
|
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
|
||||||
|
attribution='© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
|
||||||
|
></l-tile-layer>
|
||||||
|
<l-control-scale position="topright" :imperial="false" :metric="true"></l-control-scale>
|
||||||
|
|
||||||
|
<l-marker v-if="journey_data.main[journey_step_data.section].hotel &&
|
||||||
|
journey_data.main[journey_step_data.section].hotel.icon"
|
||||||
|
:lat-lng="journey_data.main[journey_step_data.section].hotel.latlon">
|
||||||
|
<l-icon>
|
||||||
|
<div v-html="generate_icon(journey_data.main[journey_step_data.section].hotel,'hotel')"></div>
|
||||||
|
</l-icon>
|
||||||
|
<l-popup>
|
||||||
|
<div>
|
||||||
|
Hotel: {{journey_data.main[journey_step_data.section].hotel.display_name}}
|
||||||
|
</div>
|
||||||
|
</l-popup>
|
||||||
|
</l-marker>
|
||||||
|
<!-- <l-marker v-for="place in journey_data.main[journey_step_data.section].places.restaurants" :lat-lng="place.latlon">
|
||||||
|
<l-icon>
|
||||||
|
<div v-html="generate_icon(place,'food')"></div>
|
||||||
|
</l-icon>
|
||||||
|
<l-popup>
|
||||||
|
<div>
|
||||||
|
Food: {{place.display_name}}
|
||||||
|
</div>
|
||||||
|
</l-popup>
|
||||||
|
</l-marker> -->
|
||||||
|
<l-marker v-for="place in filter_selected(journey_data.main[journey_step_data.section].places.activities, true)" :lat-lng="place.latlon">
|
||||||
|
<l-icon>
|
||||||
|
<div v-html="generate_icon(place,'activity')"></div>
|
||||||
|
</l-icon>
|
||||||
|
<l-popup>
|
||||||
|
<div>
|
||||||
|
Activity: {{place.display_name}}
|
||||||
|
</div>
|
||||||
|
</l-popup>
|
||||||
|
</l-marker>
|
||||||
|
</l-map>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12 col-sm-12">
|
||||||
|
<div class="container text-center" v-if="journey_step_data.start || journey_step_data.end">
|
||||||
|
<b>Flights</b>
|
||||||
|
<div v-if="journey_step_data.start">
|
||||||
|
<div v-for="element in journey_data.main[journey_step_data.section].flightA"><a :href="'https://www.flightradar24.com/data/flights/'+element.id">{{ element.label }}</a></div>
|
||||||
|
</div>
|
||||||
|
<div v-if="journey_step_data.end">
|
||||||
|
<div v-for="element in journey_data.main[journey_step_data.section].flightB"><a :href="'https://www.flightradar24.com/data/flights/'+element.id">{{ element.label }}</a></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="container"></div>
|
||||||
|
<div class="container text-center">
|
||||||
|
<b>Select Daily Activities</b>
|
||||||
|
<div class= "row text-dark container">
|
||||||
|
<div class="col-12 col-sm-6">
|
||||||
|
<l-draggable
|
||||||
|
class="dragArea list-group"
|
||||||
|
:list="filter_unselected(journey_data.main[journey_step_data.section].places.activities)"
|
||||||
|
:group="{ name: 'people', pull: 'clone', put: false }"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="list-group-item"
|
||||||
|
v-for="element in filter_unselected(journey_data.main[journey_step_data.section].places.activities)"
|
||||||
|
:key="element.place_id"
|
||||||
|
>
|
||||||
|
{{ element.display_name.split(",")[0] }}
|
||||||
|
</div>
|
||||||
|
</l-draggable>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-sm-6">
|
||||||
|
<l-draggable
|
||||||
|
class="dragArea list-group"
|
||||||
|
:list="activities_tmp"
|
||||||
|
group="people"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="list-group-item"
|
||||||
|
v-for="(element,idx) in filter_selected(activities_tmp,true)"
|
||||||
|
:key="element.place_id"
|
||||||
|
>
|
||||||
|
<div class="row">
|
||||||
|
<i class="fa fa-times close col-12 col-sm-1" @click="remove_item(activities_tmp,idx)"></i>
|
||||||
|
<div class="text">{{ element.display_name.split(",")[0] }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="input col-12 col-sm-12">
|
||||||
|
<textarea-autosize
|
||||||
|
class="small"
|
||||||
|
placeholder="Comments..."
|
||||||
|
v-model="element.text"
|
||||||
|
:min-height="16"
|
||||||
|
:max-height="360"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</l-draggable>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="">
|
||||||
|
<div class="container-medium section">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="bg-dark">
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="">
|
||||||
|
<div class="container-medium section">
|
||||||
|
<div class="aligner">
|
||||||
|
<div class="input col-sm-4"><input class="" v-model="impexp" type="text" /></div>
|
||||||
|
<div class="col-sm-2"><button class="button button--primary button--mobileFull" v-on:click="import_data">Import</button></div>
|
||||||
|
<div class="col-sm-2"><button class="button button--primary button--mobileFull" v-on:click="export_data">Export</button></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="/public/js/main.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
<footer class="bg-dark">
|
||||||
|
<div class="container">
|
||||||
|
<div class="section text-center text-small">
|
||||||
|
<p class="text-white">
|
||||||
|
<img src="/public/img/helcel.png" alt="helcel logo" width="100"><br><br>
|
||||||
|
Built with ❤ by Helcel <br><span class="text-small text-gray">v0.0.1</span>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p class="text-gray"><a href="https://git.helcel.net">Helcel Git</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
1446
public/template/templates.html
Normal file
1446
public/template/templates.html
Normal file
File diff suppressed because it is too large
Load Diff
Loading…
x
Reference in New Issue
Block a user