thermokarst/akindices
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

More or less copy and paste to get mvp

Browse source
This commit is contained in:
Matthew Dillon 2015-09-02 16:59:10 -07:00
parent 871a2f97b3
commit b86ebd63c2
9 changed files with 606 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

12
app/templates/_formhelpers.html Normal file
View file

@ -0,0 +1,12 @@
{% macro render_field(field) %}
{{ field(**kwargs)|safe }}
{% if field.errors %}
<div class="alert alert-danger">
<ul>
{% for error in field.errors %}
<li>{{ error }}</li>
{% endfor %}
</ul>
</div>
{% endif %}
{% endmacro %}

31
app/templates/base.html Normal file
View file

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>{{config['TITLE']}}</title>
<link href="/static/css/bootstrap-readable.min.css" rel="stylesheet">
<link href="/static/css/akindices.css" rel="stylesheet">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script type=text/javascript>
var $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
</script>
<div class="container" style="max-width:90%">
<div class="page-header">
<h1>{{title}}<br><small>alaska climate data</small></h1>
</div>
{% block content %}{% endblock %}
<hr>
<div id="footer">
<p class="text-muted credit">
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc-sa/3.0/80x15.png" /></a> This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/">Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License</a>.
<br>
<small>Created by <a href="mailto:mrdillon@alaska.edu">Matthew Dillon</a>, 2015.</small>
</p>
</div>
</div>
</body>
</html>

66
app/templates/details.html Normal file
View file

@ -0,0 +1,66 @@
{% extends "base.html" %}
{% block content %}
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script>
<h2>{{ community_name }}</h4>
<div id="map" style="width: 500px; height: 300px"></div>
<br>
<h3>Monthly Temperatures</h3>
<div class="table-responsive">
<table class="table table-hover table-condensed table-bordered">
<thead>
<tr>
<th>Year<br>&nbsp;</th>
<th>January<br>&deg;C</th>
<th>February<br>&deg;C</th>
<th>March<br>&deg;C</th>
<th>April<br>&deg;C</th>
<th>May<br>&deg;C</th>
<th>June<br>&deg;C</th>
<th>July<br>&deg;C</th>
<th>August<br>&deg;C</th>
<th>September<br>&deg;C</th>
<th>October<br>&deg;C</th>
<th>November<br>&deg;C</th>
<th>December<br>&deg;C</th>
</tr>
</thead>
<tbody>
{% for temp in temps %}
<tr>
<td>{{ temp[0]|int }}</td>
<td>{{ temp[1]|round(2) }}</td>
<td>{{ temp[2]|round(2) }}</td>
<td>{{ temp[3]|round(2) }}</td>
<td>{{ temp[4]|round(2) }}</td>
<td>{{ temp[5]|round(2) }}</td>
<td>{{ temp[6]|round(2) }}</td>
<td>{{ temp[7]|round(2) }}</td>
<td>{{ temp[8]|round(2) }}</td>
<td>{{ temp[9]|round(2) }}</td>
<td>{{ temp[10]|round(2) }}</td>
<td>{{ temp[11]|round(2) }}</td>
<td>{{ temp[12]|round(2) }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<script>
var map = L.map('map').setView([{{ lat }}, {{ lon }}], 5);
L.tileLayer('http://otile1.mqcdn.com/tiles/1.0.0/sat/{z}/{x}/{y}.jpg', {
maxZoom: 18,
attribution: '{{ community_name }}, AK'
}).addTo(map);
var marker_1 = L.marker([{{ lat }}, {{ lon }}]);
marker_1.bindPopup("{{ community_name }}, AK<br>{{ lat }}&deg; N, {{ lon }}&deg; W");
map.addLayer(marker_1)
</script>
{% endblock %}

230
app/templates/index.html Normal file
View file

@ -0,0 +1,230 @@
{% extends "base.html" %}
{% from "_formhelpers.html" import render_field %}
{% block content %}
<p class="lead" align="justify">
Air temperature data from over 400 communities, reduced to relevant engineering parameters
(<a href="#info">Additional info</a>)
</p>
<h3>Search</h3>
<form action="" method="post" role="form">
{{ form.csrf_token }}
<div class="row">
<div class="col-md-12">
<div class="form-group col-md-4">
<label for="communityinput">Community</label>
{{ render_field(form.community, class='form-control', id='communityinput') }}
</div>
<div class="form-group col-md-4">
<label for="modelinput">Dataset</label>
{{ render_field(form.model, class='form-control', id='modelinput') }}
<small>Historical (1901-2009) or Projection (2001-2099)<br>
<a href="{{ url_for('main.datatypes') }}" target="_blank">
Learn more about the models and scenarios
</a></small>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group col-md-4">
<label for="minyearinput">Start Year</label>
{{ render_field(form.minyear, class='form-control', id='minyearinput') }}
</div>
<div class="form-group col-md-4">
<label for="maxyearinput">End Year</label>
{{ render_field(form.maxyear, class='form-control', id='maxyearinput') }}
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group col-md-4">
<input type="submit" name="submit" class="btn btn-primary form-control"
value="Get Temperatures" >
</div>
<div class="form-group col-md-4">
<input type="button" name="reset" class="btn btn-danger form-control"
onclick="window.location.href='{{ url_for('main.reset') }}'"
value="Clear All Data" />
</div>
</div>
</div>
</form>
<h3>Results</h3>
<div class="table-responsive">
<table class="table table-hover table-condensed table-bordered">
<thead>
<tr>
<th>Community<br>&nbsp;</th>
<th>Years<br>&nbsp;</th>
<th>T<sub>avg</sub><br>&deg;C</th>
<th>ATI<br>&deg;C-days</th>
<th>AFI<br>&deg;C-days</th>
<th>DTI<br>&deg;C-days</th>
<th>DFI<br>&deg;C-days</th>
<th>Type<br>&nbsp;</th>
<th width="50px">Add/<br>Remove</th>
</tr>
</thead>
<tbody>
<tr class="active">
<td colspan="9" align="center">
Current Search
</td>
</tr>
{% if session['avg_temp'] %}
<tr>
<td><a href="{{ url_for('main.details', lat=session['community_data']['latitude'],
lon=session['community_data']['longitude'],
name=session['community_data']['name'],
datasets=session['datasets'],
community_id=session['community_data']['id'],
minyear=session['minyear'],
maxyear=session['maxyear']) }}"
target="_blank">
{{ session['community_data']['name'] }}<br>
<small>{{ session['community_data']['latitude'] }}&deg; N,
{{ session['community_data']['longitude'] }}&deg; W</small></a></td>
<td>{{ session['minyear'] }} - {{ session['maxyear'] }}</td>
<td>{{ session['avg_temp']|round(1) }}</td>
<td>{{ session['avg_indices'][0] }}</td>
<td>{{ session['avg_indices'][1] }}</td>
<td>{{ session['des_indices'][0] }}</td>
<td>{{ session['des_indices'][1] }}</td>
<td>{{ session['ds_name'][0][0] }} ({{ session['ds_name'][0][1] }})</td>
<td><button type="button" class="btn btn-success btn-sm"
onclick="window.location.href='{{ url_for('main.save') }}'"
title="Click to save this search">
<span class="glyphicon glyphicon-plus-sign"></span>
</button></td>
</tr>
{% else %}
<tr>
<td colspan="9" align="center">
[no data]
</td>
</tr>
{% endif %}
{#
<tr>
<td colspan="9">&nbsp;</td>
</tr>
#}
<tr class="active">
<td colspan="9" align="center">
Saved Searches
</td>
</tr>
{% if session.save %}
{% for key, value in session.save|dictsort %}
<tr>
<td><a href="{{ url_for('main.details', lat=value['community_data']['latitude'],
lon=value['community_data']['longitude'],
name=value['community_data']['name'],
datasets=value['datasets'],
community_id=value['community_data']['id'],
minyear=value['minyear'],
maxyear=value['maxyear']) }}"
target="_blank">
{{ value['community_data']['name'] }}<br>
<small>{{ value['community_data']['latitude'] }}&deg; N,
{{ value['community_data']['longitude'] }}&deg; W</small></a></td>
<td>{{ value['minyear'] }} - {{ value['maxyear'] }}</td>
<td>{{ value['avg_temp']|round(1) }}</td>
<td>{{ value['avg_indices'][0] }}</td>
<td>{{ value['avg_indices'][1] }}</td>
<td>{{ value['des_indices'][0] }}</td>
<td>{{ value['des_indices'][1] }}</td>
<td>{{ value['ds_name'][0][0] }} ({{ value['ds_name'][0][1] }})</td>
<td><button type="button" class="btn btn-danger btn-sm"
onclick="window.location.href='{{ url_for('main.delete', record=key) }}'"
title="Click to delete this search">
<span class="glyphicon glyphicon-trash"></span></button></td>
</tr>
{% endfor %}
{% else %}
<tr>
<td colspan="9" align="center">
[no data]
</td>
</tr>
{% endif %}
</tbody>
</table>
<strong>
NOTE: The parameters calculated by AKIndices are based on average monthly temperatures,
not average daily temperatures. As well, derived data is provided without any rounding or
consideration for significant digits, allowing the user to decide what is appropriate for
their analysis.
</strong>
</div>
<div align="justify">
<a name="info"></a>
<h3>Info</h3>
<dl class="dl-horizontal">
<dt>What</dt>
<dd>AKIndices provides basic engineering climate parameters that are commonly used for engineering and
site-development purposes. These parameters include:
<ul>
<li><strong>T<sub>avg</sub>:</strong> The average (arithmetic mean) air temperature, based on all of
the monthly air temperatures for the specified range of years.
</li>
<li><strong>ATI:</strong> The average (arithmetic mean) annual thawing index. The thawing index is the
total number of degree-days above the freezing point. The number displayed by AKIndices is the
average of the annual indices for the specified range of years.
</li>
<li><strong>AFI:</strong> The average (arithmetic mean) annual freezing index. The freezing index is the
total number of degree-days below the freezing point. The number displayed by AKIndices is the
average of the annual indices for the specified range of years.
</li>
<li><strong>DTI:</strong> The design thawing index. The number displayed by AKIndices is the
arithmetic mean of the three warmest thawing indices for the specified range of years. If less
than three years are displayed, the DTI is listed as 'None.' Typically, the DTI is calculated
over a 30-year or 10-year time span.
</li>
<li><strong>DFI:</strong> The design freezing index. The number displayed by AKIndices is the
arithmetic mean of the three coolest freezing indices for the specified range of years. If less
than three years are displayed, the DFI is listed as 'None.' Typically, the DFI is calculated
over a 30-year or 10-year time span.
</li>
</ul>
</dd>
<dt>Why</dt>
<dd>AKIndices provides quick and simple access to the massive amounts of data released by the SNAP
group. It does not aim to replace, modify, or build on SNAP's work, but rather provide an alternative
means for users to explore and understand the data.</dd>
<dt>How</dt>
<dd>AKIndices is built with <a href="http://www.python.org" target="_blank">python</a>. Check out
<a href="http://github.com/thermokarst/AKExtract" target="_blank">AKExtract</a> and
<a href="http://github.com/thermokarst/AKIndices" target="_blank">AKIndices</a> on GitHub for more info
on how to install on your own machine, fork the project, or submit
<a href="http://github.com/thermokarst/AKIndices/issues" target="_blank">bug reports.</a>
In a nutshell, AKExtract takes a list of communities and their coordinates, as well as SNAP datasets,
and extracts the air temperature data from the data point closest to a community's location. AKIndices
is the front-end for interacting with that extracted data.
</dd>
<dt>Who</dt>
<dd>This project is the work of <a href="mailto:mrdillon@alaska.edu">Matthew Dillon.</a>
While this project would not exist without <a href="http://www.snap.uaf.edu" target="_blank">SNAP</a>,
AKIndices is <em>not endorsed or supported by SNAP in any way.</em> Before utilizing the derived data
from AKIndices make sure to take a look at SNAP's page to learn about the science
and the methods behind their products.<br>
</dd>
</dl>
<h4>This product is provided as-is, with no warranty express or implied. Use at your own risk.</h4>
<h4>Commercial use disclaimer: It is the sole responsibility of the user to execute any agreements
with SNAP <a href="http://www.snap.uaf.edu/people.php?topic=data#contact" target="_blank">regarding commercial
use</a> of the SNAP data (potentially including the derived products found on this page).</h4>
<h4>Question? Comment? Find a problem? <a href="mailto:mrdillon@alaska.edu">Email me</a>
or <a href="http://github.com/thermokarst/AKIndices/issues" target="_blank">submit a bug report!</a></h4>
</div>
{% endblock %}