88 lines
3.0 KiB
HTML
88 lines
3.0 KiB
HTML
{% extends "layout.html" %}
|
|
{% block body %}
|
|
|
|
<div class="well">
|
|
<h2>Add a Card</h2>
|
|
<form action="{{ url_for('add_card') }}" method=post>
|
|
<div class="form-group">
|
|
<label for="general" class="toggleButton btn btn-default btn-lg">General
|
|
<input type="radio" name="type" value="1" id="general"/>
|
|
</label>
|
|
<label for="code" class="toggleButton btn btn-default btn-lg">Code
|
|
<input type="radio" name="type" value="2" id="code"/>
|
|
</label>
|
|
</div>
|
|
<div class="form-group fieldFront">
|
|
<label for="front">Front of Card</label>
|
|
<input type="text" name="front" class="form-control">
|
|
</div>
|
|
<div class="form-group fieldBack">
|
|
<label for="back">Back of Card</label>
|
|
<textarea name="back"
|
|
class="form-control"
|
|
id="back"
|
|
placeholder="back of card"
|
|
rows="12"></textarea>
|
|
</div>
|
|
<div class="form-group">
|
|
<button type="submit" class="saveButton btn btn-lg btn-primary">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="page-header">
|
|
<h2>{{ cards|length }} Card{{ '' if (cards|length == 1) else 's' }}</h2>
|
|
</div>
|
|
|
|
{% for card in cards %}
|
|
<div>
|
|
<h3>
|
|
<a href="{{ url_for('edit', card_id=card.id) }}" class="btn btn-xs btn-primary"><i class="fa fa-pencil" aria-hidden="true"></i></a>
|
|
{{ card.front }}
|
|
</h3>
|
|
{% if card.type == 1 %}
|
|
{{ card.back|replace("\n", "<br />")|safe }}
|
|
{% else %}
|
|
<pre>{{ card.back|safe }}</pre>
|
|
{% endif %}
|
|
<hr>
|
|
</div>
|
|
{% else %}
|
|
<li><em>Unbelievable. No cards here so far.</em>
|
|
{% endfor %}
|
|
|
|
<script type=text/javascript>
|
|
|
|
$(document).ready(function () {
|
|
function checkit() {
|
|
var checkedVal = $('input[name=type]:checked').val();
|
|
if (checkedVal === undefined) {
|
|
// hide the fields
|
|
$('.fieldFront').hide();
|
|
$('.fieldBack').hide();
|
|
$('.saveButton').hide();
|
|
} else {
|
|
$('.toggleButton').removeClass('toggleSelected');
|
|
$(this).addClass('toggleSelected');
|
|
|
|
if (checkedVal == '1') {
|
|
$('textarea[name=back]').attr('rows', 5);
|
|
} else {
|
|
$('textarea[name=back]').attr('rows', 12);
|
|
}
|
|
|
|
$('.fieldFront').show();
|
|
$('.fieldBack').show();
|
|
$('.saveButton').show();
|
|
}
|
|
}
|
|
|
|
$('.toggleButton').click(checkit);
|
|
|
|
checkit();
|
|
});
|
|
|
|
</script>
|
|
|
|
{% endblock %}
|