Skip to content

Commit

Permalink
Merge pull request #1 from arfurlaneto/master
Browse files Browse the repository at this point in the history
Bootstrap, sounds, internationalization, glyphicons and UI.
  • Loading branch information
ljacqu authored Oct 16, 2019
2 parents 3b61f95 + a5b6633 commit e72bbda
Show file tree
Hide file tree
Showing 19 changed files with 1,031 additions and 497 deletions.
Binary file added correct.mp3
Binary file not shown.
5 changes: 5 additions & 0 deletions css/bootstrap-theme.min.css

Large diffs are not rendered by default.

5 changes: 5 additions & 0 deletions css/bootstrap.min.css

Large diffs are not rendered by default.

12 changes: 12 additions & 0 deletions css/mathtrainer.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
.container {
padding-top: 15px;
}

.input-group-addon {
min-width: 80px;
text-align: left;
}

.top-margin {
margin-top: 20px;
}
Binary file added fonts/glyphicons-halflings-regular.eot
Binary file not shown.
288 changes: 288 additions & 0 deletions fonts/glyphicons-halflings-regular.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added fonts/glyphicons-halflings-regular.ttf
Binary file not shown.
Binary file added fonts/glyphicons-halflings-regular.woff
Binary file not shown.
Binary file added fonts/glyphicons-halflings-regular.woff2
Binary file not shown.
234 changes: 183 additions & 51 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,53 +1,185 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Math Trainer</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="trainer.js"></script>
<script type="text/javascript" src="timer.js"></script>
</head>
<body>
<div id="question" style="display: none">
<div id="question_math"></div>
<div id="progress"></div>
<div id="timer"></div>
</div>
<div id="user" style="display: none">
<input type="number" id="result" />
<p>Hit space to skip a question.</p>
<input type="submit" value="Back to options" id="quit_to_options" />
</div>
<div id="score" style="display: none">
<h1>Time Over</h1>
In <span id="score_time">a certain time</span>, you have solved
<span id="score_total">n</span> problems (skipped
<span id="score_skipped">k</span>).
</div>
<div id="options">
<h1>Mental Math Trainer</h1>
Train your mental arithmetic skills
<div id="error_wrapper" style="display: none"><span id="options_error"></span></div>
<br />Run for <input type="number" name="timer length" min="1" id="timer_length" value="3" /> minutes.
<br />Create problems with numbers in the following range:
<br />Min: <input type="number" id="min" value="1" />
&nbsp; Max: <input type="number" id="max" value="10" />
<br />
<br /><label for="avoid_negative">Avoid negative results for subtraction?</label>
<input type="checkbox" id="avoid_negative" checked="checked" />
<span style="font-size: 0.9em">Only applicable if min and max aren't negative.</span>
<div id="op_wrapper">Include:
<input type="checkbox" id="op_add" checked="checked" /> <label for="op_add">Addition</label>
<input type="checkbox" id="op_sub" checked="checked" /> <label for="op_sub">Subtraction</label>
<input type="checkbox" id="op_mul" checked="checked" /> <label for="op_mul">Multiplication</label>
<input type="checkbox" id="op_div" checked="checked" /> <label for="op_div">Division</label>
</div>
<br /><input type="submit" id="start" value="Start" style="display: none" />
</div>
<noscript>
<h2>JavaScript Required</h2>
<p>JavaScript is required to run this trainer; please enable it in your browser.</p>
</noscript>
</body>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>

<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="css/mathtrainer.css" />
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xs-12">
<div class="panel panel-primary">
<div class="panel-heading">
<h1 class="i18n" data-i18n="labels.appName"></h1>
<em><span class="i18n" data-i18n="labels.appQuote"></span></em>
</div>
<div class="panel-body">

<div class="row">
<div class="col-xs-12">
<div class="alert alert-success" id="score" style="display: none;">
<strong>
<div class="i18n" data-i18n="labels.timeOver"></div>
</strong>
<span id="finalScore"></span>
</div>
</div>
</div>

<div class="row">
<div class="col-xs-12">
<form class="form-horizontal" id="options">
<div class="form-group">
<div class="col-xs-12">
<div class="alert alert-danger" id="optionserrors" style="display: none;">
<span id="options_error"></span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-xs-12">
<div class="input-group">
<span class="input-group-addon i18n" data-i18n="labels.runFor"></span>
<input type="number" class="form-control" id="timerlength" value="5" min="1" max="60" />
<span class="input-group-addon i18n" data-i18n="labels.minutes"></span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-xs-12">
<p><span class="i18n" data-i18n="labels.createProblemsInRange"></span></p>
</div>
<div class="col-xs-12 col-sm-6">
<div class="input-group">
<span class="input-group-addon i18n" data-i18n="labels.rangeMin"></span>
<input type="number" class="form-control" id="rangemin" value="1" step="1" min="-9999999" max="9999999" />
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="input-group">
<span class="input-group-addon i18n" data-i18n="labels.rangeMax"></span>
<input type="number" class="form-control" id="rangemax" value="99" step="1" min="-9999999" max="9999999" />
</div>
</div>
</div>
<div class="form-group">
<div class="col-xs-12">
<div class="checkbox">
<label>
<input type="checkbox" id="avoidnegatives" checked="checked" />
<span class="i18n" data-i18n="labels.avoidNegatives"></span>
<small><span class="i18n" data-i18n="labels.avoidNegativesExp"></span></small>
</label>
</div>
</div>
</div>
<div class="form-group" id="operators">
<div class="col-xs-6">
<div class="checkbox">
<label>
<input type="checkbox" id="opadd" checked="checked" />
<span class="i18n"data-i18n="labels.opAdd"></span>
</label>
</div>
</div>
<div class="col-xs-6">
<div class="checkbox">
<label>
<input type="checkbox" id="opsub" checked="checked" />
<span class="i18n"data-i18n="labels.opSub"></span>
</label>
</div>
</div>
<div class="col-xs-6">
<div class="checkbox">
<label>
<input type="checkbox" id="opmul" checked="checked" />
<span class="i18n"data-i18n="labels.opMul"></span>
</label>
</div>
</div>
<div class="col-xs-6">
<div class="checkbox">
<label>
<input type="checkbox" id="opdiv" checked="checked" />
<span class="i18n" data-i18n="labels.opDiv"></span>
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-xs-12">
<button type="submit" class="btn btn-primary col-xs-12" id="start" style="display: none;">
<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
<span class="i18n" data-i18n="labels.start"></span>
</button>
</div>
</div>
</form>
</div>
</div>

<div id="questions" style="display: none;">
<div class="row">
<div class="col-xs-2 text-left">
<big><div id="timer"></div></big>
</div>
<div class="col-xs-10 text-right">
<big><div id="progress"></div></big>
</div>
</div>
<div class="row">
<div class="col-xs-12 text-center">
<h1 id="currentquestion"></h1>
</div>
</div>
<div class="row">
<div class="col-xs-12 text-center">
<div id="useranswer">
<input type="number" class="form-control" id="answer" />
<p><small><span class="i18n" data-i18n="labels.escToClearSpaceToSkip"></span></small></p>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-6 text-center">
<button type="button" class="btn btn-info col-xs-12" id="clearquestion">
<span class="glyphicon glyphicon-erase" aria-hidden="true"></span>
<span class="i18n" data-i18n="labels.clear"></span>
</button>
</div>
<div class="col-xs-6 text-center">
<button type="button" class="btn btn-warning col-xs-12" id="skipquestion">
<span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
<span class="i18n" data-i18n="labels.skip"></span>
</button>
</div>
</div>
<div class="row top-margin">
<div class="col-xs-12 text-center">
<button type="button" class="btn btn-danger col-xs-12" id="quittooptions">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
<span class="i18n" data-i18n="labels.quitToOptions"></span>
</button>
</div>
</div>
</div>

</div>
</div>
</div>
</div>
</div>

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/i18next.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery.countdown.min.js"></script>
<script type="text/javascript" src="js/mathtrainer.js"></script>
</body>
</html>
7 changes: 7 additions & 0 deletions js/bootstrap.min.js

Large diffs are not rendered by default.

5 changes: 5 additions & 0 deletions js/i18next.min.js

Large diffs are not rendered by default.

File renamed without changes.
5 changes: 5 additions & 0 deletions js/jquery.min.js

Large diffs are not rendered by default.

Loading

0 comments on commit e72bbda

Please sign in to comment.