Private
Public Access
1
0

flexall done

some details not 100%
This commit is contained in:
Sander Roosendaal
2018-10-05 16:58:50 +02:00
parent 7dd551df70
commit 159a0416d0
5 changed files with 365 additions and 299 deletions

View File

@@ -1,35 +1,16 @@
{% extends "base.html" %}
{% extends "newbase.html" %}
{% load staticfiles %}
{% load rowerfilters %}
{% block title %}Rowsandall {% endblock %}
{% block content %}
<div id="id_css_res">
<link rel="stylesheet" href="/static/css/bokeh-0.12.3.min.css" type="text/css" />
<link rel="stylesheet" href="/static/css/bokeh-widgets-0.12.3.min.css" type="text/css" />
</div>
<div id="id_js_res">
<script
type="text/javascript" src="/static/js/bokeh-0.12.3.min.js">
</script>
<script
type="text/javascript" src="/static/js/bokeh-widgets-0.12.3.min.js">
</script>
<script async="true" type="text/javascript">
Bokeh.set_log_level("info");
</script>
</div>
{% block main %}
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(function() {
// Get the form fields and hidden div
var checkbox = $("#id_water");
var modality = $("#id_modality");
var hidden = $("#id_waterboattype");
@@ -43,11 +24,12 @@
// Setup an event listener for when the state of the
// checkbox changes.
checkbox.change(function() {
modality.change(function() {
// Check to see if the checkbox is checked.
// If it is, show the fields and populate the input.
// If not, hide the fields.
if (checkbox.is(':checked')) {
// If not, hide the fields.
var Value = modality.val();
if (Value=='water') {
// Show the hidden fields.
hidden.show();
} else {
@@ -74,173 +56,170 @@
</script>
<div id="id_css_res">
<link rel="stylesheet" href="/static/css/bokeh-0.12.3.min.css" type="text/css" />
<link rel="stylesheet" href="/static/css/bokeh-widgets-0.12.3.min.css" type="text/css" />
</div>
<div id="id_js_res">
<script
type="text/javascript" src="/static/js/bokeh-0.12.3.min.js">
</script>
<script
type="text/javascript" src="/static/js/bokeh-widgets-0.12.3.min.js">
</script>
</div>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<div id="id_script">
</div>
<style>
/* Need this to get the page in "desktop mode"; not having an infinite height.*/
html, body {height: 100%; margin:5px;}
</style>
<div id="title" class="grid_12 alpha">
<div class="grid_10 alpha">
&nbsp;
</div>
<div class="grid_2 omega">
{% if user.is_authenticated and user|is_manager %}
<div class="grid_2 alpha dropdown">
<button class="grid_2 alpha button green small dropbtn">
{{ theuser.first_name }} {{ theuser.last_name }}
</button>
<div class="dropdown-content">
{% for member in user|team_members %}
<a class="button green small" href="/rowers/{{ member.id }}/flexall/{{ xparam }}/{{ yparam1 }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d" }}">{{ member.first_name }} {{ member.last_name }}</a>
{% endfor %}
</div>
{% else %}
&nbsp;
{% endif %}
</div>
</div>
<div class="grid_12 alpha">
<div id="form" class="grid_6 alpha">
<ul class="main-content">
<li class="grid_2">
<form enctype="multipart/form-data" action="{{ formloc }}" method="post">
{% csrf_token %}
<div class="grid_2 alpha">
<table>
{{ optionsform.as_table }}
</table>
</div>
<div class="grid_2 suffix_2 omega">
<input type="hidden" name="options" value="options">
<input class="grid_1 alpha button green small" value="Submit" type="Submit">
</div>
<table>
{{ optionsform.as_table }}
</table>
<input type="hidden" name="options" value="options">
<input class="button green small" value="Submit" type="Submit">
</form>
</div>
<div class="grid_6 omega">
</li>
<li class="grid_2">
<p>Use this form to select a different date range:</p>
<p>
Select start and end date for a date range:
<div class="grid_4 alpha">
<form enctype="multipart/form-data" action="" method="post">
<form enctype="multipart/form-data" action="" method="post">
<table>
{{ form.as_table }}
</table>
{% csrf_token %}
</div>
<div class="grid_2 omega">
<input name='daterange' class="button green" type="submit" value="Submit"> </form>
</div>
<div class="grid_4 alpha">
<form enctype="multipart/form-data" action="" method="post">
Or use the last {{ deltaform }} days.
</div>
<div class="grid_2 omega">
<table>
{{ form.as_table }}
</table>
{% csrf_token %}
<input name='datedelta' class="button green" type="submit" value="Submit">
<input name='daterange' class="button green" type="submit" value="Submit">
</form>
</div>
</div>
</div>
</li>
<div id="summary" class="grid_6 suffix_6 alpha">
<p>Summary for {{ theuser.first_name }} {{ theuser.last_name }}
between {{ startdate|date }} and {{ enddate|date }}</p>
<li>
<p>Summary for {{ theuser.first_name }} {{ theuser.last_name }}
between {{ startdate|date }} and {{ enddate|date }}</p>
</li>
<li>
<ul class="cd-accordion-menu animated">
<li class="has-children" id="xaxis">
<input type="checkbox" name="group-x" id="group-x">
<label for="group-x">
X-Axis
</label>
<ul>
{% for key, value in axchoicesbasic.items %}
{% if key != 'None' %}
<li>
<a href="/rowers/flexall/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}/">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% if promember %}
{% for key, value in axchoicespro.items %}
<li>
<a href="/rowers/flexall/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}/">{{ value }}</a>
</li>
{% endfor %}
{% else %}
{% for key, value in axchoicespro.items %}
<li>
<a href="/rowers/promembership">{{ value }}</a>
</li>
{% endfor %}
{% endif %}
</ul>
</li>
</ul>
</li>
<li>
<ul class="cd-accordion-menu animated">
<li class="has-children" id="yparam1">
<input type="checkbox" name="group-y1" id="group-y1">
<label for="group-y1">
Left
</label>
<ul>
{% for key, value in axchoicesbasic.items %}
{% if key not in noylist and key != 'None' %}
<li>
<a href="/rowers/flexall/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}/">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% if promember %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<li>
<a href="/rowers/flexall/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}/">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% else %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<li>
<a href="/rowers/promembership">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% endif %}
</ul>
</li>
</ul>
</li>
<li>
<ul class="cd-accordion-menu animated">
<li class="has-children" id="yparam2">
<input type="checkbox" name="group-y2" id="group-y2">
<label for="group-y2">
Right
</label>
<ul>
{% for key, value in axchoicesbasic.items %}
{% if key not in noylist and key != 'None' %}
<li>
<a href="/rowers/flexall/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}/">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% if promember %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<li>
<a href="/rowers/flexall/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}/">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% else %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<li>
<a href="/rowers/promembership">{{ value }}</a>
</li>
{% endif %}
{% endfor %}
{% endif %}
</ul>
</li>
</ul>
</li>
<li class="grid_4">
<div id="id_chart">
<div id="plotbuttons" class="grid_6 alpha">
<div class="grid_2 alpha dropdown">
<button class="grid_2 alpha button blue small dropbtn">X-axis</button>
<div class="dropdown-content">
{% for key, value in axchoicesbasic.items %}
{% if key != 'None' %}
<a class="button blue small alpha" href="/rowers/flexall/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}">{{ value }}</a>
{% endif %}
{% endfor %}
{% if promember %}
{% for key, value in axchoicespro.items %}
<a class="button blue small alpha" href="/rowers/flexall/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}">{{ value }}</a>
{% endfor %}
{% else %}
{% for key, value in axchoicespro.items %}
<a class="button rosy small" href="/rowers/promembership">{{ value }}</a>
{% endfor %}
{% endif %}
</div>
{{ the_div|safe }}
</div>
<div class="grid_2 dropdown">
<button class="grid_2 alpha button blue small dropbtn">Left</button>
<div class="dropdown-content">
{% for key, value in axchoicesbasic.items %}
{% if key not in noylist and key != 'None' %}
<a class="button blue small" href="/rowers/flexall/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d"}}/{{ enddate|date:"Y-m-d"}}">{{ value }}</a>
{% endif %}
{% endfor %}
{% if promember %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<a class="button blue small" href="/rowers/flexall/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ startdate|date:"Y-m-d"}}/{{ enddate|date:"Y-m-d"}}">{{ value }}</a>
{% endif %}
{% endfor %}
{% else %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
{% endif %}
{% endfor %}
{% endif %}
</div>
</div>
<div class="grid_2 dropdown omega">
<button class="grid_2 alpha button blue small dropbtn">Right</button>
<div class="dropdown-content">
{% for key, value in axchoicesbasic.items %}
{% if key not in noylist %}
<a class="button blue small" href="/rowers/flexall/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}">{{ value }}</a>
{% endif %}
{% endfor %}
{% if promember %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<a class="button blue small" href="/rowers/flexall/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ startdate|date:"Y-m-d" }}/{{ enddate|date:"Y-m-d"}}">{{ value }}</a>
{% endif %}
{% endfor %}
{% else %}
{% for key, value in axchoicespro.items %}
{% if key not in noylist %}
<a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
{% endif %}
{% endfor %}
{% endif %}
</div>
</div>
</div>
<div id="id_chart" class="grid_12 alpha">
{{ the_div|safe }}
</div>
</li>
</ul>
{% endblock %}
@@ -253,16 +232,25 @@
$(function($) {
console.log('loading script');
$.getJSON(window.location.protocol + '//'+window.location.host + '/rowers/flexalldata', function(json) {
console.log('got script');
var counter=0;
var script = json.script;
var div = json.div;
console.log('set vars');
$("#id_sitready").remove();
console.log('sitready removed');
$("#id_chart").append(div);
console.log(div);
console.log('div appended');
$("#id_script").append("<script>"+script+"</s"+"cript>");
console.log('script changed');
});
});
</script>
{% endblock %}
{% block sidebar %}
{% include 'menu_analytics.html' %}
{% endblock %}