156 lines
4.7 KiB
HTML
Executable File
156 lines
4.7 KiB
HTML
Executable File
{% extends 'templates/base.html' %}
|
|
{% block head %}
|
|
{{super()}}
|
|
<link rel="stylesheet" type="text/css" href="/static/css/.index.min.css">
|
|
{% endblock %}
|
|
|
|
{% block main %}
|
|
|
|
<section class='splash dark' id='splash'>
|
|
<div class='container'>
|
|
<h1>Tracman</h1>
|
|
<h3>Display your realtime GPS location on a map</h3>
|
|
{% if user %}
|
|
<a class='btn' href="/map">Map<i class='fa fa-angle-right'></i></a>
|
|
<a class='btn' href="/settings">Settings<i class='fa fa-angle-right'></i></a>
|
|
{% if user.isAdmin %}
|
|
<a class='btn' href="/admin">Admin<i class='fa fa-angle-right'></i></a>
|
|
{% endif %}
|
|
{% else %}
|
|
<a class='btn' href="/map/demo">View demo<i class='fa fa-angle-right'></i></a>
|
|
<a class='btn' href="/login#signup">Join<i class='fa fa-angle-right'></i></a>
|
|
<a class='btn' href="/login#login">Login<i class='fa fa-angle-right'></i></a>
|
|
{% endif %}
|
|
</div>
|
|
</section>
|
|
|
|
<section class='overview dark' id='overview'>
|
|
<div class='container'>
|
|
<div>
|
|
<i class='fa fa-mobile'></i>
|
|
<h3>Easy-to-use</h3>
|
|
<p>Download the android app and log in. Then send your friends a link with a map showing your live location. </p>
|
|
</div>
|
|
<div>
|
|
<i class='fa fa-bolt'></i>
|
|
<h3>Realtime</h3>
|
|
<p>Your location updates every second for all the world to see. </p>
|
|
</div>
|
|
<div>
|
|
<i class='fa fa-usd'></i>
|
|
<h3>Free</h3>
|
|
<p>It's free, but you can <a href="https://cash.me/$KeithIrwin">donate</a> if you want to help with server expenses. </p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class='feature app dark' id='app'>
|
|
<div class='container'>
|
|
<img src="/static/img/style/phone.png" alt="Mobile phone">
|
|
<div>
|
|
<h2>Setting your location</h2>
|
|
<p>You can track your GPS location from your phone's web browsers. There's also has an android app which can run in the background. With the app, you can: </p>
|
|
<ul>
|
|
<li>
|
|
<i class='fa fa-toggle-on'></i>
|
|
<h4>Turn off tracking</h4>
|
|
<p>If you need to go undercover, just turn tracman off with the flip of a switch. </p>
|
|
</li>
|
|
<li>
|
|
<i class='fa fa-cog'></i>
|
|
<h4>Change settings</h4>
|
|
<p>Change your settings to show a less accurate location, if you want an air of mystery. </p>
|
|
</li>
|
|
<li>
|
|
<i class='fa fa-battery-3'></i>
|
|
<h4>Save energy</h4>
|
|
<p>If nobody's tracking you, tracman won't needlessly drain your battery. </p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class='feature map dark' id='map'>
|
|
<div class='container'>
|
|
<img src="/static/img/style/laptop.png" alt="Laptop">
|
|
<div>
|
|
<h2>The Map</h2>
|
|
<p>You'll get a simple webpage with a map to send to friends. It'll look <a href="/map/keith">like this</a>. </p>
|
|
<ul>
|
|
<li>
|
|
<i class='fa fa-hand-o-right'></i>
|
|
<h4>Easy</h4>
|
|
<p>Just send a link to whomever you want. Bam, now they know where you are. </p>
|
|
</li>
|
|
<li>
|
|
<i class='fa fa-map-marker'></i>
|
|
<h4>Precise</h4>
|
|
<p>Map updates in realtime with websockets. </p>
|
|
</li>
|
|
<li>
|
|
<i class='fa fa-cogs'></i>
|
|
<h4>Customizable</h4>
|
|
<p>Change the map default type and zoom level. You can also show speed, altitude, and streetview. </p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{% if not user %}
|
|
|
|
<section class='pricing'>
|
|
<div class='container'>
|
|
<h1>Pricing</h1>
|
|
<h2>Realtime GPS tracking for every budget</h2>
|
|
|
|
<div>
|
|
<h3>Basic<span><i class="fa fa-star"></i></span></h3>
|
|
<div class="price">free</div>
|
|
<ul>
|
|
<li>Map with URL</li>
|
|
<li>Realtime updates</li>
|
|
<li>Android integration</li>
|
|
</ul>
|
|
<a class="btn yellow smaller" href="/signup">Signup<i class="fa fa-angle-right"></i></a>
|
|
</div>
|
|
|
|
<div>
|
|
<h3>Pro<span><i class="fa fa-star"></i><i class="fa fa-star"></i></span></h3>
|
|
<div class="price">$5/month</div>
|
|
<ul>
|
|
<li>All Basic features</li>
|
|
<li>Streetview image</li>
|
|
<li>Show speed</li>
|
|
<li>Show altitude</li>
|
|
<li>Hide ads</li>
|
|
</ul>
|
|
<a class="btn yellow smaller" href="/signup">Signup<i class="fa fa-angle-right"></i></a>
|
|
</div>
|
|
|
|
<div>
|
|
<h3>Enterprise<span><i class="fa fa-star"></i><i class="fa fa-star"></i><i class='fa fa-star'></i></span></h3>
|
|
<div class="price">coming soon</div>
|
|
<ul>
|
|
<li>All Pro features</li>
|
|
<li>Multiple vehicles</li>
|
|
</ul>
|
|
<a class="btn yellow smaller" href="/contact">Contact<i class="fa fa-angle-right"></i></a>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<section class='join light' id='join'>
|
|
<div class='container'>
|
|
<h2>Hook me up!</h2>
|
|
<p>Just click the button to create an account. </p>
|
|
<a class='btn btn-lg' href="/signup">Join Tracman</a>
|
|
</div>
|
|
</section>
|
|
|
|
{% endif %}
|
|
|
|
{% endblock %}
|