daniel/tww
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web render

Browse Source
This commit is contained in:
Daniel Tsvetkov 2020-02-12 15:39:09 +01:00
parent d150f610ec
commit 9a0f756beb
8 changed files with 170 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/tww/localization.py
View File

@ -60,7 +60,7 @@ def get_default_locale():
return country_code, lang_code, encoding, default_locale
def resolve_locale(locale_s):
def resolve_locale(locale_s=None):
country_code, lang_code, encoding, default_locale = get_default_locale()
rv = dict(
query=locale_s,

18
src/tww/templates/dt.html Normal file
View File

@ -0,0 +1,18 @@
<input type="text" class="datetime" name="datetime" disabled
value="{{ dt.iso8601_full }}" style="width: 320px;"/>
</br></br>
<input type="text" class="datetime__date_txt" name="datetime__date_txt" disabled
value="{{ dt.iso8601_date }}"/>
<input type="text" class="datetime__time_txt" name="datetime__time_txt" disabled
value="{{ dt.iso8601_time }}"/>
<input type="text" class="datetime__tz_offset" name="datetime__tz_offset" disabled
value="{{ dt.tz_offset }}" size="8"/>
<select class="datetime__tz_name" name="datetime__tz">
<option disabled selected value> -- select timezone --</option>
{% for tz in all_tz %}
<option value="{{ tz }}">{{ tz }}</option>
{% endfor %}
</select>
<script>
drawClock("{{dt.iso8601_time}}");
</script>

18
src/tww/templates/dt_tr.html Normal file
View File

@ -0,0 +1,18 @@
<input type="text" class="datetime" name="datetime" disabled
value="{{ dst_dt.iso8601_full }}" style="width: 320px;"/>
</br></br>
<input type="text" class="datetime__date_txt" name="datetime__date_txt" disabled
value="{{ dst_dt.iso8601_date }}"/>
<input type="text" class="datetime__time_txt" name="datetime__time_txt" disabled
value="{{ dst_dt.iso8601_time }}"/>
<input type="text" class="datetime__tz_offset" name="datetime__tz_offset" disabled
value="{{ dst_dt.tz_offset }}" size="8"/>
<select class="datetime__tz_name" name="datetime__tz">
<option disabled selected value> -- select timezone --</option>
{% for tz in all_tz %}
<option value="{{ tz }}">{{ tz }}</option>
{% endfor %}
</select>
<script>
drawClock("{{dst_dt.iso8601_time}}");
</script>

127
src/tww/templates/home.html
View File

@ -29,35 +29,115 @@
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='select2.css') }}">
</head>
<body>
<h1 style="text-align: center;">Time When and Where</h1>
<main>
<form>
<input type="text" class="main-input datetime__txt" name="datetime__txt"
<input type="text" class="main-input datetime__txt" name="datetime__txt" autofocus
value="" autocomplete="off"/>
</br>
<span class="datetime__error"></span>
</br>
<input type="text" class="datetime" name="datetime" value="" style="width: 320px;"/>
</br></br>
<input type="text" class="datetime__date_txt" name="datetime__date_txt"
value=""/>
<input type="text" class="datetime__time_txt" name="datetime__time_txt"
value=""/>
<input type="text" class="datetime__tz_offset" name="datetime__tz_offset"
value="" size="8"/>
<select class="datetime__tz_name" name="datetime__tz">
<option disabled selected value> -- select timezone --</option>
{% for tz in all_tz %}
<option value="{{ tz }}">{{ tz }}</option>
{% endfor %}
</select>
<div id="solutions"></div>
</form>
{% for to_tz in to_tzs %}
{% endfor %}
<canvas id="canvas" width="200" height="200" style="background-color:#eee"></canvas>
</main>
<script src="{{ url_for('static', filename='jquery.js') }}"></script>
<script src="{{ url_for('static', filename='jquery.debounce.js') }}"></script>
<script src="{{ url_for('static', filename='select2.js') }}"></script>
<script src="{{ url_for('static', filename='main.js') }}"></script>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var radius = canvas.height / 2;
ctx.translate(radius, radius);
radius = radius * 0.90;
function drawClock(time) {
var time = time.split(':');
drawFace(ctx, radius, time);
drawNumbers(ctx, radius);
drawTime(ctx, radius, time);
}
function drawFace(ctx, radius, time) {
var hour = parseInt(time[0]);
if (hour < 6 || hour > 18) {
var fg = "#333";
var bg = "white";
} else {
var fg = "white";
var bg = "#333";
}
var grad;
ctx.beginPath();
ctx.arc(0, 0, radius, 0, 2 * Math.PI);
ctx.fillStyle = fg;
ctx.fill();
grad = ctx.createRadialGradient(0, 0, radius * 0.95, 0, 0, radius * 1.05);
grad.addColorStop(0, bg);
grad.addColorStop(0.5, fg);
grad.addColorStop(1, bg);
ctx.strokeStyle = grad;
ctx.lineWidth = radius * 0.1;
ctx.stroke();
ctx.beginPath();
ctx.arc(0, 0, radius * 0.1, 0, 2 * Math.PI);
ctx.fillStyle = bg;
ctx.fill();
}
function drawNumbers(ctx, radius) {
var ang;
var num;
ctx.font = radius * 0.15 + "px arial";
ctx.textBaseline = "middle";
ctx.textAlign = "center";
for (num = 1; num < 13; num++) {
ang = num * Math.PI / 6;
ctx.rotate(ang);
ctx.translate(0, -radius * 0.85);
ctx.rotate(-ang);
ctx.fillText(num.toString(), 0, 0);
ctx.rotate(ang);
ctx.translate(0, radius * 0.85);
ctx.rotate(-ang);
}
}
function drawTime(ctx, radius, time) {
var hour = parseInt(time[0]);
var minute = parseInt(time[1]);
var second = parseInt(time[2]);
//hour
hour = hour % 12;
hour = (hour * Math.PI / 6) +
(minute * Math.PI / (6 * 60)) +
(second * Math.PI / (360 * 60));
drawHand(ctx, hour, radius * 0.5, radius * 0.07);
//minute
minute = (minute * Math.PI / 30) + (second * Math.PI / (30 * 60));
drawHand(ctx, minute, radius * 0.8, radius * 0.07);
// second
second = (second * Math.PI / 30);
drawHand(ctx, second, radius * 0.9, radius * 0.02);
}
function drawHand(ctx, pos, length, width) {
ctx.beginPath();
ctx.lineWidth = width;
ctx.lineCap = "round";
ctx.moveTo(0, 0);
ctx.rotate(pos);
ctx.lineTo(0, -length);
ctx.stroke();
ctx.rotate(-pos);
}
</script>
<script>
$(document).ready(function () {
@ -66,21 +146,20 @@
$('.datetime__txt').keyup($.debounce(function (e) {
$el = $(this);
$.ajax({
"url": "{{ url_for("api_datetime") }}",
"url": '{{ url_for("api_datetime") }}',
"data": {"q": this.value}
}).done(function (r) {
if (r.error !== "")
$el.next(".datetime__error").addClass("flash").addClass("error").html(r.error);
else
$el.next(".datetime__error").removeClass("flash").removeClass("error").html("");
$el.siblings(".datetime").val(r.to_dt_resolve.iso);
$el.siblings(".datetime__date_txt").val(r.to_dt_resolve.date);
$el.siblings(".datetime__time_txt").val(r.to_dt_resolve.time);
$el.siblings(".datetime__tz_offset").val(r.to_dt_resolve.tz_offset);
$el.siblings(".datetime__tz_name").val(r.to_tz_resolve.tz_name).trigger('change');
$('#solutions').html(r.rendered_solutions);
// TODO:
// $el.siblings(".datetime__tz_name").val(r.to_tz_resolve.tz_name).trigger('change');
// var time = r.to_dt_resolve.time.split(':');
// drawClock(time);
});
}, 500));
});
</script>

1
src/tww/templates/td.html Normal file
View File

@ -0,0 +1 @@
<p><strong>Timedelta:</strong> {{ timedelta.diff.duration_iso8601 }}

1
src/tww/templates/tz.html Normal file
View File

@ -0,0 +1 @@
<p><strong>Timezone:</strong> {{ tz.tz_offset }}

3
src/tww/tokenizer.py
View File

@ -2,7 +2,6 @@ import argparse
import json
import locale
import re
import sys
from datetime import datetime
from pygments import highlight, lexers, formatters
@ -13,7 +12,7 @@ from tww import ISO_FORMAT, time_to_emoji, time_ago, workday_diff, workhours_dif
from tww import resolve_timezone, dateparser_parse_dt, get_utcnow, get_s_since_epoch, get_ms_since_epoch, \
dt_tz_translation, get_local_now, query_to_format_result
custom_locale = None
custom_locale = resolve_locale()
r_generic = re.compile('(.*)', flags=re.IGNORECASE)
r_time_in_epoch_s_now = re.compile('(?:time since epoch|seconds since epoch)', flags=re.IGNORECASE)

29
src/tww/web.py
View File

@ -1,6 +1,8 @@
import pytz
from flask import Flask, render_template, jsonify, request
from tokenizer import resolve_query, QUERY_TYPE_DT, QUERY_TYPE_DT_TR, QUERY_TYPE_TZ, QUERY_TYPE_TD
app = Flask(__name__)
import dateparser
@ -89,14 +91,37 @@ def home():
ctx = dict(all_tz=pytz.all_timezones)
q = request.args.get('q')
if q:
ctx["q_resp"] = jsonify(parse_query(q))
ctx["q_resp"] = jsonify(resolve_query(q))
return render_template("home.html", all_tz=pytz.all_timezones)
def render_solution(solution):
query_type = solution["query_type"]
if query_type == QUERY_TYPE_DT:
return render_template("dt.html", **solution)
elif query_type == QUERY_TYPE_DT_TR:
return render_template("dt_tr.html", **solution)
elif query_type == QUERY_TYPE_TZ:
return render_template("tz.html", **solution)
elif query_type == QUERY_TYPE_TD:
return render_template("td.html", **solution)
def render_solutions(results):
rv = []
for solution in results['solutions']:
rv.append(render_solution(solution))
return rv
@app.route("/api/datetime")
def api_datetime():
q = request.args.get('q')
return jsonify(parse_query(q))
results = resolve_query(q)
rendered_solutions = render_solutions(results)
results['rendered_solutions'] = rendered_solutions
return jsonify(results)
if __name__ == "__main__":