Merge branch 'feature/cleanup' into 'develop'

Feature/cleanup

Fixes issue #3

See merge request !21
This commit is contained in:
Manuel Friedli 2014-08-26 18:11:04 +02:00
commit 8d471226b4
25 changed files with 1147 additions and 1003 deletions

View file

@ -7,16 +7,7 @@
// Predefined globals whom JSHint will ignore. // Predefined globals whom JSHint will ignore.
"browser" : true, // Standard browser globals e.g. `window`, `document`. "browser" : true, // Standard browser globals e.g. `window`, `document`.
"node" : false,
"rhino" : false,
"couch" : false,
"wsh" : true, // Windows Scripting Host.
"jquery" : true, "jquery" : true,
"ender" : true,
"prototypejs" : false,
"mootools" : false,
"dojo" : false,
"predef" : [ "predef" : [
"suite", "suite",
@ -28,16 +19,13 @@
"debug" : false, // Allow debugger statements e.g. browser breakpoints. "debug" : false, // Allow debugger statements e.g. browser breakpoints.
"devel" : true, // Allow developments statements e.g. `console.log();`. "devel" : true, // Allow developments statements e.g. `console.log();`.
// ECMAScript 5.
"es5" : true, // Allow ECMAScript 5 syntax.
"strict" : true, // Require `use strict` pragma in every file. "strict" : true, // Require `use strict` pragma in every file.
"globalstrict" : false, // Allow global "use strict" (also enables 'strict'). "globalstrict" : false, // Allow global "use strict" (also enables 'strict').
// The Good Parts. // The Good Parts.
"asi" : false, // Tolerate Automatic Semicolon Insertion (no semicolons). "asi" : false, // Tolerate Automatic Semicolon Insertion (no semicolons).
"laxbreak" : true, // Tolerate unsafe line breaks e.g. `return [\n] x` without semicolons. "laxbreak" : false, // Tolerate unsafe line breaks e.g. `return [\n] x` without semicolons.
"bitwise" : true, // Prohibit bitwise operators (&, |, ^, etc.). "bitwise" : true, // Prohibit bitwise operators (&, |, ^, etc.).
"boss" : false, // Tolerate assignments inside if, for & while. Usually conditions & loops are for comparison, not assignments. "boss" : false, // Tolerate assignments inside if, for & while. Usually conditions & loops are for comparison, not assignments.
"curly" : true, // Require {} for every new block or scope. "curly" : true, // Require {} for every new block or scope.
@ -50,8 +38,6 @@
"latedef" : true, // Prohipit variable use before definition. "latedef" : true, // Prohipit variable use before definition.
"loopfunc" : false, // Allow functions to be defined within loops. "loopfunc" : false, // Allow functions to be defined within loops.
"noarg" : true, // Prohibit use of `arguments.caller` and `arguments.callee`. "noarg" : true, // Prohibit use of `arguments.caller` and `arguments.callee`.
"regexp" : true, // Prohibit `.` and `[^...]` in regular expressions.
"regexdash" : false, // Tolerate unescaped last dash i.e. `[-...]`.
"scripturl" : true, // Tolerate script-targeted URLs. "scripturl" : true, // Tolerate script-targeted URLs.
"shadow" : false, // Allows re-define variables later in code e.g. `var x=1; x=2;`. "shadow" : false, // Allows re-define variables later in code e.g. `var x=1; x=2;`.
"supernew" : false, // Tolerate `new function () { ... };` and `new Object;`. "supernew" : false, // Tolerate `new function () { ... };` and `new Object;`.
@ -67,6 +53,6 @@
"plusplus" : false, // Prohibit use of `++` & `--`. "plusplus" : false, // Prohibit use of `++` & `--`.
"sub" : false, // Tolerate all forms of subscript notation besides dot notation e.g. `dict['key']` instead of `dict.key`. "sub" : false, // Tolerate all forms of subscript notation besides dot notation e.g. `dict['key']` instead of `dict.key`.
"trailing" : true, // Prohibit trailing whitespaces. "trailing" : true, // Prohibit trailing whitespaces.
"white" : true, // Check against strict whitespace and indentation rules. "white" : false, // Check against strict whitespace and indentation rules.
"indent" : 0 // Specify indentation spacing "indent" : 0 // Specify indentation spacing
} }

View file

@ -1 +1 @@
6.3 6.3.1_rc1

View file

@ -15,13 +15,16 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.black { .uhr.black {
background-color: #111; background-color: #111;
} }
.black .onoffswitch-inner:before { .black .onoffswitch-inner:before {
background-color: #111; background-color: #111;
} }
.uhr.black .dot:not(.active) { .uhr.black .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
} }
.uhr.black .letter:not(.active) { .uhr.black .letter:not(.active) {
color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);

View file

@ -15,13 +15,16 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.blue { .uhr.blue {
background-color: #00a; background-color: #00a;
} }
.blue .onoffswitch-inner:before { .blue .onoffswitch-inner:before {
background-color: #00a; background-color: #00a;
} }
.uhr.blue .dot:not(.active) { .uhr.blue .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
} }
.uhr.blue .letter:not(.active) { .uhr.blue .letter:not(.active) {
color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);

View file

@ -15,13 +15,16 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.green { .uhr.green {
background-color: #0c0; background-color: #0c0;
} }
.green .onoffswitch-inner:before { .green .onoffswitch-inner:before {
background-color: #0c0; background-color: #0c0;
} }
.uhr.green .dot:not(.active) { .uhr.green .dot:not(.active) {
border-color: rgba(0, 0, 0, 0.1); border-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1); box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
} }
.uhr.green .letter:not(.active) { .uhr.green .letter:not(.active) {
color: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.1);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1); text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);

View file

@ -15,21 +15,26 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.pink { .uhr.pink {
background-color: #f0a; background-color: #f0a;
} }
.uhr.pink .dot.active { .uhr.pink .dot.active {
border-color: #fff; border-color: #fff;
box-shadow: 0 0 0.1em #fff; box-shadow: 0 0 0.1em #fff;
} }
.uhr.pink .letter.active { .uhr.pink .letter.active {
color: #fff; color: #fff;
text-shadow: 0 0 0.1em #fff; text-shadow: 0 0 0.1em #fff;
} }
.pink .onoffswitch-inner:before { .pink .onoffswitch-inner:before {
background-color: #f0a; background-color: #f0a;
} }
.uhr.pink .dot:not(.active) { .uhr.pink .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
} }
.uhr.pink .letter:not(.active) { .uhr.pink .letter:not(.active) {
color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);

View file

@ -15,13 +15,16 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.red { .uhr.red {
background-color: #700; background-color: #700;
} }
.red .onoffswitch-inner:before { .red .onoffswitch-inner:before {
background-color: #700; background-color: #700;
} }
.uhr.red .dot:not(.active) { .uhr.red .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
} }
.uhr.red .letter:not(.active) { .uhr.red .letter:not(.active) {
color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1); text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);

View file

@ -15,21 +15,26 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.white { .uhr.white {
background-color: #ccc; background-color: #ccc;
} }
.uhr.white .dot.active { .uhr.white .dot.active {
border-color: #fff; border-color: #fff;
box-shadow: 0 0 0.1em #fff; box-shadow: 0 0 0.1em #fff;
} }
.uhr.white .letter.active { .uhr.white .letter.active {
color: #fff; color: #fff;
text-shadow: 0 0 0.1em #fff; text-shadow: 0 0 0.1em #fff;
} }
.white .onoffswitch-inner:before { .white .onoffswitch-inner:before {
background-color: #ccc; background-color: #ccc;
} }
.uhr.white .dot:not(.active) { .uhr.white .dot:not(.active) {
border-color: rgba(0, 0, 0, 0.1); border-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1); box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
} }
.uhr.white .letter:not(.active) { .uhr.white .letter:not(.active) {
color: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.1);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1); text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);

View file

@ -15,21 +15,26 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
.uhr.yellow { .uhr.yellow {
background-color: #fd0; background-color: #fd0;
} }
.uhr.yellow .dot.active { .uhr.yellow .dot.active {
border-color: #fff; border-color: #fff;
box-shadow: 0 0 0.1em #fff; box-shadow: 0 0 0.1em #fff;
} }
.uhr.yellow .letter.active { .uhr.yellow .letter.active {
color: #fff; color: #fff;
text-shadow: 0 0 0.1em #fff; text-shadow: 0 0 0.1em #fff;
} }
.yellow .onoffswitch-inner:before { .yellow .onoffswitch-inner:before {
background-color: #fd0; background-color: #fd0;
} }
.uhr.yellow .dot:not(.active) { .uhr.yellow .dot:not(.active) {
border-color: rgba(0, 0, 0, 0.05); border-color: rgba(0, 0, 0, 0.05);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05); box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05);
} }
.uhr.yellow .letter:not(.active) { .uhr.yellow .letter:not(.active) {
color: rgba(0, 0, 0, 0.05); color: rgba(0, 0, 0, 0.05);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05); text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05);

View file

@ -16,14 +16,17 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
font-family: 'Uhrenfont'; font-family: 'Uhrenfont';
src: url('../resources/uhr.woff') format('woff'); src: url('../resources/uhr.woff') format('woff');
} }
body { body {
font-family: 'Uhrenfont', sans-serif; font-family: 'Uhrenfont', sans-serif;
} }
.uhr { .uhr {
position: relative; position: relative;
margin: 0; margin: 0;
transition: background-color 0.5s; transition: background-color 0.5s;
} }
.uhr .reflection { .uhr .reflection {
position: absolute; position: absolute;
top: 0; top: 0;
@ -34,8 +37,10 @@ body {
display: block; display: block;
margin: 0.15em; margin: 0.15em;
} }
#themeswitcher { #themeswitcher {
} }
.uhr .letterarea { .uhr .letterarea {
display: block; display: block;
position: absolute; position: absolute;
@ -46,9 +51,11 @@ body {
overflow: hidden; overflow: hidden;
font-size: 200%; font-size: 200%;
} }
.item { .item {
transition: box-shadow 0.5s, text-shadow 0.5s, border-color 0.5s, color 0.5s; transition: box-shadow 0.5s, text-shadow 0.5s, border-color 0.5s, color 0.5s;
} }
.dot { .dot {
position: absolute; position: absolute;
display: block; display: block;
@ -57,26 +64,32 @@ body {
border: 0.2em solid; border: 0.2em solid;
border-radius: 1em; border-radius: 1em;
} }
.dot.active { .dot.active {
border-color: #eee; border-color: #eee;
box-shadow: 0 0 0.2em #eee; box-shadow: 0 0 0.2em #eee;
} }
.dot1 { .dot1 {
top: 3.75%; top: 3.75%;
left: 3.75%; left: 3.75%;
} }
.dot2 { .dot2 {
top: 3.75%; top: 3.75%;
right: 3.75%; right: 3.75%;
} }
.dot3 { .dot3 {
bottom: 3.75%; bottom: 3.75%;
right: 3.75%; right: 3.75%;
} }
.dot4 { .dot4 {
bottom: 3.75%; bottom: 3.75%;
left: 3.75%; left: 3.75%;
} }
.letter { .letter {
height: 10%; height: 10%;
width: 9.0909%; width: 9.0909%;
@ -86,10 +99,12 @@ body {
text-align: center; text-align: center;
line-height: 160%; line-height: 160%;
} }
.letter.active { .letter.active {
color: #eee; color: #eee;
text-shadow: 0 0 0.2em #eee; text-shadow: 0 0 0.2em #eee;
} }
.onoffswitch { .onoffswitch {
position: relative; position: relative;
width: 86px; width: 86px;
@ -98,9 +113,11 @@ body {
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
} }
.onoffswitch-checkbox { .onoffswitch-checkbox {
display: none; display: none;
} }
.onoffswitch-label { .onoffswitch-label {
display: block; display: block;
overflow: hidden; overflow: hidden;
@ -108,6 +125,7 @@ body {
border: 2px solid #999; border: 2px solid #999;
border-radius: 50px; border-radius: 50px;
} }
.onoffswitch-inner { .onoffswitch-inner {
width: 200%; width: 200%;
margin-left: -100%; margin-left: -100%;
@ -116,6 +134,7 @@ body {
-o-transition: margin 0.3s ease-in 0s; -o-transition: margin 0.3s ease-in 0s;
transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
} }
.onoffswitch-inner:before, .onoffswitch-inner:after { .onoffswitch-inner:before, .onoffswitch-inner:after {
float: left; float: left;
width: 50%; width: 50%;
@ -129,12 +148,14 @@ body {
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
} }
.onoffswitch-inner:before { .onoffswitch-inner:before {
content: "EIN"; content: "EIN";
padding-left: 12px; padding-left: 12px;
color: #eee; color: #eee;
transition: background-color 0.5s; transition: background-color 0.5s;
} }
.onoffswitch-inner:after { .onoffswitch-inner:after {
content: "AUS"; content: "AUS";
padding-right: 12px; padding-right: 12px;
@ -175,6 +196,7 @@ a.uhr-configlink {
display: inline-block; display: inline-block;
margin: 2px; margin: 2px;
} }
.uhr-controlpanel { .uhr-controlpanel {
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
position: fixed; position: fixed;
@ -183,11 +205,13 @@ a.uhr-configlink {
top: 0; top: 0;
left: 0; left: 0;
} }
@media (max-width: 400px) { @media (max-width: 400px) {
.uhr-controlpanel .content { .uhr-controlpanel .content {
height: 100%; height: 100%;
} }
} }
@media (min-width: 401px) { @media (min-width: 401px) {
.uhr-controlpanel .content { .uhr-controlpanel .content {
margin-left: auto; margin-left: auto;
@ -198,11 +222,13 @@ a.uhr-configlink {
box-shadow: 0 0 1em black; box-shadow: 0 0 1em black;
} }
} }
.uhr-controlpanel .content { .uhr-controlpanel .content {
background-color: #fff; background-color: #fff;
padding: 2em; padding: 2em;
position: relative; position: relative;
} }
a.uhr-closecontrolpanel { a.uhr-closecontrolpanel {
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
@ -213,9 +239,11 @@ a.uhr-closecontrolpanel {
height: 24px; height: 24px;
background: url("../resources/close.png") no-repeat; background: url("../resources/close.png") no-repeat;
} }
#disclaimer { #disclaimer {
font-size: 0.5em; font-size: 0.5em;
} }
#disclaimer a { #disclaimer a {
color: #444; color: #444;
text-decoration: underline; text-decoration: underline;

View file

@ -45,17 +45,15 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</head> </head>
<body style="padding:0;margin:0;"> <body style="padding:0;margin:0;">
<div id="uhr"></div> <div id="uhr"></div>
<p id="disclaimer">Created by <a href="http://www.fritteli.ch/">fritteli</a>, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>. <a href="info/">Read more!</a> - <a href="showcase">View full showcase!</a></p> <p id="disclaimer">Created by <a href="http://www.fritteli.ch/">fritteli</a>, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>. <a
href="info/">Read more!</a> - <a href="showcase">View full showcase!</a></p>
<script type="text/javascript"> <script type="text/javascript">
(function($) { (function($) {
var width = $(window).width(); var width = $(window).width();
var height = $(window).height(); var height = $(window).height();
var size = Math.min(width, height) + 'px'; var size = Math.min(width, height) + 'px';
$('#uhr').uhr({ $('#uhr').uhr({
width: size, width: size
color: 'black',
language: 'de_CH',
controls: true
}); });
})(jQuery); })(jQuery);
</script> </script>

View file

@ -38,7 +38,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<li><a href="#requirements">Benötigte Bibliotheken</a></li> <li><a href="#requirements">Benötigte Bibliotheken</a></li>
<li><a href="#include-in-html">Einbinden in HTML</a> <li><a href="#include-in-html">Einbinden in HTML</a>
<ol> <ol>
<li><a href="#js-and-css-in-head">Javascript- und CSS-Dateien im <code>&lt;head&gt;</code></a></li> <li><a href="#js-and-css-in-head">Javascript- und CSS-Dateien im <code class="inline">&lt;head&gt;</code></a></li>
<li><a href="#clock-element">Uhr-Element auf der Seite</a></li> <li><a href="#clock-element">Uhr-Element auf der Seite</a></li>
<li><a href="#initialize">Uhr initialisieren</a></li> <li><a href="#initialize">Uhr initialisieren</a></li>
</ol> </ol>
@ -51,17 +51,21 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</ol> </ol>
</nav> </nav>
<h2 id="about">Was soll das?<a href="#toc" class="toclink">Zum Inhalt</a></h2> <h2 id="about">Was soll das?<a href="#toc" class="toclink">Zum Inhalt</a></h2>
<p>Hallo, Besucher!</p> <p>Hallo, Besucher!</p>
<p>Hier gibt's vertiefte Informationen über diese Uhr, die dir sagt, <p>Hier gibt's vertiefte Informationen über diese Uhr, die dir sagt,
wie spät es ist. Hier erfährt du, wie du sie selber auf deiner wie spät es ist. Hier erfährt du, wie du sie selber auf deiner
Website einbauen kannst. Denn das darfst du gerne tun, solange du Website einbauen kannst. Denn das darfst du gerne tun, solange du
dich dabei an die Regeln der <a href="#lizenz">Lizenz</a> hältst.</p> dich dabei an die Regeln der <a href="#license">Lizenz</a> hältst.</p>
<p><a href="..">Das interessiert mich nicht, ich will zurück zur grossen Uhr!</a></p> <p><a href="..">Das interessiert mich nicht, ich will zurück zur grossen Uhr!</a></p>
<h2 id="the-clock">Die Uhr<a href="#toc" class="toclink">Zum Inhalt</a></h2> <h2 id="the-clock">Die Uhr<a href="#toc" class="toclink">Zum Inhalt</a></h2>
<a href="../"> <a href="../">
<div id="uhr1"></div> <div id="uhr1"></div>
</a> </a>
<h3 id="requirements">Benötigte Bibliotheken<a href="#toc" class="toclink">Zum Inhalt</a></h3> <h3 id="requirements">Benötigte Bibliotheken<a href="#toc" class="toclink">Zum Inhalt</a></h3>
<ul> <ul>
<li><a href="http://jquery.com/download/">jQuery</a> (getestet mit Version 2.1.0)</li> <li><a href="http://jquery.com/download/">jQuery</a> (getestet mit Version 2.1.0)</li>
@ -75,7 +79,9 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</ul> </ul>
<h3 id="include-in-html">Einbinden in HTML<a href="#toc" class="toclink">Zum Inhalt</a></h3> <h3 id="include-in-html">Einbinden in HTML<a href="#toc" class="toclink">Zum Inhalt</a></h3>
<h4 id="js-and-css-in-head">Javascript- und CSS-Dateien im <code>&lt;head&gt;</code><a href="#toc" class="toclink">Zum Inhalt</a></h4> <h4 id="js-and-css-in-head">Javascript- und CSS-Dateien im <code>&lt;head&gt;</code><a href="#toc" class="toclink">Zum Inhalt</a></h4>
<p>Füge folgende Zeilen im <code>&lt;head&gt;</code>-Tag deines HTML-Dokumentes ein. <strong>Beachte dabei, dass die CSS-Dateien <em>vor</em> den Javascript eingebunden werden</strong>.<br/>
<p>Füge folgende Zeilen im <code>&lt;head&gt;</code>-Tag deines HTML-Dokumentes ein. <strong>Beachte dabei, dass die CSS-Dateien <em>vor</em> den
Javascript eingebunden werden</strong>.<br/>
<code>&lt;link rel="stylesheet" type="text/css" href="uhr.css" /&gt; <code>&lt;link rel="stylesheet" type="text/css" href="uhr.css" /&gt;
&lt;link rel="stylesheet" type="text/css" href="uhr-black.css" data-class="black" data-name="Schwarz" /&gt; &lt;link rel="stylesheet" type="text/css" href="uhr-black.css" data-class="black" data-name="Schwarz" /&gt;
&lt;link rel="stylesheet" type="text/css" href="uhr-white.css" data-class="white" data-name="Weiss" /&gt; &lt;link rel="stylesheet" type="text/css" href="uhr-white.css" data-class="white" data-name="Weiss" /&gt;
@ -95,13 +101,20 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
&lt;script type="text/javascript" src="uhr-fr.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="uhr-fr.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="uhr-it.js"&gt;&lt;/script&gt;</code> &lt;script type="text/javascript" src="uhr-it.js"&gt;&lt;/script&gt;</code>
</p> </p>
<p>Von den Stylesheets zwingend ist <code>uhr.css</code> und mindestens eines der Farbschema-Stylesheets. Die Attribute <code>data-class</code> bzw. <code>data-name</code> definieren dabei die im Stylesheet deklarierte Klasse bzw. den im Auswahlmenu anzuzeigenden Namen. Der Name kann frei gewählt werden, die Style-Klasse muss mit der im Stylesheet definierten übereinstimmen.</p>
<p><code>uhr-de_CH_genau.js</code> ist eine Variante von Berndeutsch, bei der zur vollen Stunde zusätlich das Wort <tt>genau</tt> angezeigt wird (also z.B. um 15:00 Uhr <tt>ES ISCH GENAU DRÜ</tt>).</p> <p>Von den Stylesheets zwingend ist <code>uhr.css</code> und mindestens eines der Farbschema-Stylesheets. Die Attribute <code>data-class</code> bzw.
<code>data-name</code> definieren dabei die im Stylesheet deklarierte Klasse bzw. den im Auswahlmenu anzuzeigenden Namen. Der Name kann frei
gewählt werden, die Style-Klasse muss mit der im Stylesheet definierten übereinstimmen.</p>
<p><code>uhr-de_CH_genau.js</code> ist eine Variante von Berndeutsch, bei der zur vollen Stunde zusätlich das Wort <code class="inline">genau</code>
angezeigt wird (also z.B. um 15:00 Uhr <code class="inline">ES ISCH GENAU DRÜ</code>).</p>
<h4 id="clock-element">Uhr-Element auf der Seite<a href="#toc" class="toclink">Zum Inhalt</a></h4> <h4 id="clock-element">Uhr-Element auf der Seite<a href="#toc" class="toclink">Zum Inhalt</a></h4>
<p>Definiere an der Stelle, wo die Uhr angezeigt werden soll, ein leeres <code>&lt;div&gt;</code>-Element:<br/> <p>Definiere an der Stelle, wo die Uhr angezeigt werden soll, ein leeres <code>&lt;div&gt;</code>-Element:<br/>
<code>&lt;div id="meine-uhr"&gt;&lt;/div&gt;</code> <code>&lt;div id="meine-uhr"&gt;&lt;/div&gt;</code>
</p> </p>
<h4 id="initialize">Uhr initialisieren<a href="#toc" class="toclink">Zum Inhalt</a></h4> <h4 id="initialize">Uhr initialisieren<a href="#toc" class="toclink">Zum Inhalt</a></h4>
<p>Definiere im HTML-Dokument (<code>&lt;head&gt;</code> oder <code>&lt;body&gt;</code>) ein Javascript-Snippet, um die Uhr zu initialisieren:<br/> <p>Definiere im HTML-Dokument (<code>&lt;head&gt;</code> oder <code>&lt;body&gt;</code>) ein Javascript-Snippet, um die Uhr zu initialisieren:<br/>
<code>&lt;script type="text/javascript"&gt; <code>&lt;script type="text/javascript"&gt;
jQuery(document).ready(function() { jQuery(document).ready(function() {
@ -109,17 +122,24 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
}); });
&lt;/script&gt;</code> &lt;/script&gt;</code>
</p> </p>
<p>Die Uhr wird so in der Standardkonfiguration angezeigt, das heisst: Berndeutsche Sprache, in der Farbe der ersten eingebundenen CSS-Datei (im Beispiel also Schwarz), eingeschaltet, Breite 100% des Elternelementes. Wenn dies nicht deinen Bedürfnissen entspricht, lässt sich die Uhr wie im folgenden Abschnitt beschrieben konfigurieren. Die Konfiguration wird der <code>.uhr()</code>-Methode als JSON-Objekt übergeben, beispielsweise so:<br/>
<p>Die Uhr wird so in der Standardkonfiguration angezeigt, das heisst: Berndeutsche Sprache, in der Farbe der ersten eingebundenen CSS-Datei (im
Beispiel also Schwarz), eingeschaltet, Breite 100% des Elternelementes. Wenn dies nicht deinen Bedürfnissen entspricht, lässt sich die Uhr wie im
folgenden Abschnitt beschrieben konfigurieren. Die Konfiguration wird der <code>.uhr()</code>-Methode als JSON-Objekt übergeben, beispielsweise
so:<br/>
<code>jQuery('#uhr').uhr({ <code>jQuery('#uhr').uhr({
width: '200px', width: '200px',
theme: 'red' theme: 'red'
});</code> });</code>
</p> </p>
<h3 id="configuration">Konfiguration<a href="#toc" class="toclink">Zum Inhalt</a></h3> <h3 id="configuration">Konfiguration<a href="#toc" class="toclink">Zum Inhalt</a></h3>
<p>Es existieren die folgenden Konfigurationsoptionen:</p> <p>Es existieren die folgenden Konfigurationsoptionen:</p>
<dl> <dl>
<dt><code>width</code></dt> <dt><code>width</code></dt>
<dd>Die Breite der Uhr als CSS-String, z.B. <code>'50%'</code>, <code>'120px'</code> oder <code>'2.8em'</code>. Die Höhe passt sich automatisch der Breite an, so dass die Uhr immer quadratisch ist. <dd>Die Breite der Uhr als CSS-String, z.B. <code>'50%'</code>, <code>'120px'</code> oder <code>'2.8em'</code>. Die Höhe passt sich automatisch
der Breite an, so dass die Uhr immer quadratisch ist.
<br/>Typ: String <br/>Typ: String
<br/>Default: <code>'100%'</code></dd> <br/>Default: <code>'100%'</code></dd>
<dt><code>status</code></dt> <dt><code>status</code></dt>
@ -133,17 +153,22 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<dt><code>theme</code></dt> <dt><code>theme</code></dt>
<dd>Die anfänglich ausgewählte Farbe der Uhr. Welche Farben unterstützt werden, hängt davon ab, welche CSS-Dateien eingebunden werden. <dd>Die anfänglich ausgewählte Farbe der Uhr. Welche Farben unterstützt werden, hängt davon ab, welche CSS-Dateien eingebunden werden.
<br/>Typ: String <br/>Typ: String
<br/>Default: Farbe der ersten eingebundenen CSS-Datei</dd> <br/>Default: Farbe der ersten eingebundenen CSS-Datei
</dd>
<dt><code>force</code></dt> <dt><code>force</code></dt>
<dd>Legt fest, ob die in der Konfiguration angegebenen Werte allfällig in einem Browser-Cookie gespeicherte Einstellungen überschreiben sollen oder nicht. Mögliche Werte sind <code>true</code> (Konfiguration überschreibt Cookie-Werte) oder <code>false</code> (Cookie-Werte haben Vorrang). <dd>Legt fest, ob die in der Konfiguration angegebenen Werte allfällig in einem Browser-Cookie gespeicherte Einstellungen überschreiben sollen
oder nicht. Mögliche Werte sind <code>true</code> (Konfiguration überschreibt Cookie-Werte) oder <code>false</code> (Cookie-Werte haben
Vorrang).
<br/>Typ: boolean <br/>Typ: boolean
<br/>Default: <code>false</code></dd> <br/>Default: <code>false</code></dd>
<dt><code>controls</code></dt> <dt><code>controls</code></dt>
<dd>Gibt an, ob die Steuerelemente zur Auswahl von Farbe und Sprache und der Ein-/Ausschalter angezeigt werden sollen. Mögliche Werte sind <code>true</code> oder <code>false</code>. <dd>Gibt an, ob die Steuerelemente zur Auswahl von Farbe und Sprache und der Ein-/Ausschalter angezeigt werden sollen. Mögliche Werte sind <code>true</code>
oder <code>false</code>.
<br/>Typ: boolean <br/>Typ: boolean
<br/>Default: <code>true</code></dd> <br/>Default: <code>true</code></dd>
<dt><code>autoresize</code></dt> <dt><code>autoresize</code></dt>
<dd>Gibt an, ob die Uhr ihre Grösse dynamisch anpassen soll, wenn das Elternelement seine Grösse ändert, oder ob sie immer die anfängliche Grösse behält. Mögliche Werte sind <code>true</code> oder <code>false</code>. <dd>Gibt an, ob die Uhr ihre Grösse dynamisch anpassen soll, wenn das Elternelement seine Grösse ändert, oder ob sie immer die anfängliche Grösse
behält. Mögliche Werte sind <code>true</code> oder <code>false</code>.
<br/>Typ: boolean <br/>Typ: boolean
<br/>Default: <code>true</code></dd> <br/>Default: <code>true</code></dd>
</dl> </dl>
@ -160,16 +185,27 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
})(jQuery); })(jQuery);
</script> </script>
<h2 id="information">Informationen<a href="#toc" class="toclink">Zum Inhalt</a></h2> <h2 id="information">Informationen<a href="#toc" class="toclink">Zum Inhalt</a></h2>
<p>Programmiert von <a href="mailto:manuel@fritteli.ch">Manuel Friedli</a> mit Inspiration von <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.<br/> <p>Programmiert von <a href="mailto:manuel@fritteli.ch">Manuel Friedli</a> mit Inspiration von <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.<br/>
Diese Uhr ist aus Freude am Programmieren und am Konzept einer die Zeit in Worten ausdrückenden Uhr entstanden. Sollte daraus jemandem Schaden oder ein gravierender Nachteil erwachsen, so soll sich diese Person bei mir melden und wir werden bestimmt eine Lösung finden, die für alle beteiligten angemessen ist. Allen anderen Personen wünsche ich viel Freude mit der Zeit im Wort.</p> Diese Uhr ist aus Freude am Programmieren und am Konzept einer die Zeit in Worten ausdrückenden Uhr entstanden. Sollte daraus jemandem Schaden
oder ein gravierender Nachteil erwachsen, so soll sich diese Person bei mir melden und wir werden bestimmt eine Lösung finden, die für alle
beteiligten angemessen ist. Allen anderen Personen wünsche ich viel Freude mit der Zeit im Wort.</p>
<p>Der Quellcode ist frei zugänglich unter <a href="https://git.friedli.info/manuel/uhr">https://git.friedli.info/manuel/uhr</a>.</p> <p>Der Quellcode ist frei zugänglich unter <a href="https://git.friedli.info/manuel/uhr">https://git.friedli.info/manuel/uhr</a>.</p>
<h2 id="license">Lizenzbestimmungen<a href="#toc" class="toclink">Zum Inhalt</a></h2> <h2 id="license">Lizenzbestimmungen<a href="#toc" class="toclink">Zum Inhalt</a></h2>
<p>Der komplette Sourcecode ist unter der GNU GPL 3.0 lizenziert und darf nach deren Vorgaben verwendet, kopiert, weitergegeben und verändert werden. Die GNU GPL 3.0 findest Du unter folgendem Link: <a href="https://www.gnu.org/licenses/gpl-3.0">GNU GPL 3.0</a>. Und direkt hier:</p>
<p>Der komplette Sourcecode ist unter der GNU GPL 3.0 lizenziert und darf nach deren Vorgaben verwendet, kopiert, weitergegeben und verändert werden.
Die GNU GPL 3.0 findest Du unter folgendem Link: <a href="https://www.gnu.org/licenses/gpl-3.0">GNU GPL 3.0</a>. Und direkt hier:</p>
<h3 id="gpl-v3" style="text-align: center;">GNU GENERAL PUBLIC LICENSE</h3> <h3 id="gpl-v3" style="text-align: center;">GNU GENERAL PUBLIC LICENSE</h3>
<p style="text-align: center;">Version 3, 29 June 2007</p> <p style="text-align: center;">Version 3, 29 June 2007</p>
<p>Copyright &copy; 2007 Free Software Foundation, Inc. <p>Copyright &copy; 2007 Free Software Foundation, Inc.
&lt;<a href="http://fsf.org/">http://fsf.org/</a>&gt;</p><p> &lt;<a href="http://fsf.org/">http://fsf.org/</a>&gt;</p>
<p>
Everyone is permitted to copy and distribute verbatim copies Everyone is permitted to copy and distribute verbatim copies
of this license document, but changing it is not allowed.</p> of this license document, but changing it is not allowed.</p>
@ -381,12 +417,14 @@ terms of section 4, provided that you also meet all of these conditions:</p>
<ul> <ul>
<li>a) The work must carry prominent notices stating that you modified <li>a) The work must carry prominent notices stating that you modified
it, and giving a relevant date.</li> it, and giving a relevant date.
</li>
<li>b) The work must carry prominent notices stating that it is <li>b) The work must carry prominent notices stating that it is
released under this License and any conditions added under section released under this License and any conditions added under section
7. This requirement modifies the requirement in section 4 to 7. This requirement modifies the requirement in section 4 to
&ldquo;keep intact all notices&rdquo;.</li> &ldquo;keep intact all notices&rdquo;.
</li>
<li>c) You must license the entire work, as a whole, under this <li>c) You must license the entire work, as a whole, under this
License to anyone who comes into possession of a copy. This License to anyone who comes into possession of a copy. This
@ -394,12 +432,14 @@ terms of section 4, provided that you also meet all of these conditions:</p>
additional terms, to the whole of the work, and all its parts, additional terms, to the whole of the work, and all its parts,
regardless of how they are packaged. This License gives no regardless of how they are packaged. This License gives no
permission to license the work in any other way, but it does not permission to license the work in any other way, but it does not
invalidate such permission if you have separately received it.</li> invalidate such permission if you have separately received it.
</li>
<li>d) If the work has interactive user interfaces, each must display <li>d) If the work has interactive user interfaces, each must display
Appropriate Legal Notices; however, if the Program has interactive Appropriate Legal Notices; however, if the Program has interactive
interfaces that do not display Appropriate Legal Notices, your interfaces that do not display Appropriate Legal Notices, your
work need not make them do so.</li> work need not make them do so.
</li>
</ul> </ul>
<p>A compilation of a covered work with other separate and independent <p>A compilation of a covered work with other separate and independent
@ -423,7 +463,8 @@ in one of these ways:</p>
<li>a) Convey the object code in, or embodied in, a physical product <li>a) Convey the object code in, or embodied in, a physical product
(including a physical distribution medium), accompanied by the (including a physical distribution medium), accompanied by the
Corresponding Source fixed on a durable physical medium Corresponding Source fixed on a durable physical medium
customarily used for software interchange.</li> customarily used for software interchange.
</li>
<li>b) Convey the object code in, or embodied in, a physical product <li>b) Convey the object code in, or embodied in, a physical product
(including a physical distribution medium), accompanied by a (including a physical distribution medium), accompanied by a
@ -435,13 +476,15 @@ in one of these ways:</p>
medium customarily used for software interchange, for a price no medium customarily used for software interchange, for a price no
more than your reasonable cost of physically performing this more than your reasonable cost of physically performing this
conveying of source, or (2) access to copy the conveying of source, or (2) access to copy the
Corresponding Source from a network server at no charge.</li> Corresponding Source from a network server at no charge.
</li>
<li>c) Convey individual copies of the object code with a copy of the <li>c) Convey individual copies of the object code with a copy of the
written offer to provide the Corresponding Source. This written offer to provide the Corresponding Source. This
alternative is allowed only occasionally and noncommercially, and alternative is allowed only occasionally and noncommercially, and
only if you received the object code with such an offer, in accord only if you received the object code with such an offer, in accord
with subsection 6b.</li> with subsection 6b.
</li>
<li>d) Convey the object code by offering access from a designated <li>d) Convey the object code by offering access from a designated
place (gratis or for a charge), and offer equivalent access to the place (gratis or for a charge), and offer equivalent access to the
@ -454,12 +497,14 @@ in one of these ways:</p>
clear directions next to the object code saying where to find the clear directions next to the object code saying where to find the
Corresponding Source. Regardless of what server hosts the Corresponding Source. Regardless of what server hosts the
Corresponding Source, you remain obligated to ensure that it is Corresponding Source, you remain obligated to ensure that it is
available for as long as needed to satisfy these requirements.</li> available for as long as needed to satisfy these requirements.
</li>
<li>e) Convey the object code using peer-to-peer transmission, provided <li>e) Convey the object code using peer-to-peer transmission, provided
you inform other peers where the object code and Corresponding you inform other peers where the object code and Corresponding
Source of the work are being offered to the general public at no Source of the work are being offered to the general public at no
charge under subsection 6d.</li> charge under subsection 6d.
</li>
</ul> </ul>
<p>A separable portion of the object code, whose source code is excluded <p>A separable portion of the object code, whose source code is excluded
@ -536,27 +581,33 @@ that material) supplement the terms of this License with terms:</p>
<ul> <ul>
<li>a) Disclaiming warranty or limiting liability differently from the <li>a) Disclaiming warranty or limiting liability differently from the
terms of sections 15 and 16 of this License; or</li> terms of sections 15 and 16 of this License; or
</li>
<li>b) Requiring preservation of specified reasonable legal notices or <li>b) Requiring preservation of specified reasonable legal notices or
author attributions in that material or in the Appropriate Legal author attributions in that material or in the Appropriate Legal
Notices displayed by works containing it; or</li> Notices displayed by works containing it; or
</li>
<li>c) Prohibiting misrepresentation of the origin of that material, or <li>c) Prohibiting misrepresentation of the origin of that material, or
requiring that modified versions of such material be marked in requiring that modified versions of such material be marked in
reasonable ways as different from the original version; or</li> reasonable ways as different from the original version; or
</li>
<li>d) Limiting the use for publicity purposes of names of licensors or <li>d) Limiting the use for publicity purposes of names of licensors or
authors of the material; or</li> authors of the material; or
</li>
<li>e) Declining to grant rights under trademark law for use of some <li>e) Declining to grant rights under trademark law for use of some
trade names, trademarks, or service marks; or</li> trade names, trademarks, or service marks; or
</li>
<li>f) Requiring indemnification of licensors and authors of that <li>f) Requiring indemnification of licensors and authors of that
material by anyone who conveys the material (or modified versions of material by anyone who conveys the material (or modified versions of
it) with contractual assumptions of liability to the recipient, for it) with contractual assumptions of liability to the recipient, for
any liability that these contractual assumptions directly impose on any liability that these contractual assumptions directly impose on
those licensors and authors.</li> those licensors and authors.
</li>
</ul> </ul>
<p>All other non-permissive additional terms are considered &ldquo;further <p>All other non-permissive additional terms are considered &ldquo;further

View file

@ -1,24 +1,48 @@
/*
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
body { body {
font-size: 120%; font-size: 120%;
} }
code { code {
white-space: pre-line; white-space: pre-line;
display: inline-block; display: inline-block;
} }
code.inline {
display: inline;
}
ol { ol {
counter-reset: item; counter-reset: item;
padding-left: 1em; padding-left: 1em;
} }
ol li { ol li {
display: block; display: block;
} }
ol li:before { ol li:before {
content: counters(item, ".") ". "; content: counters(item, ".") ". ";
counter-increment: item; counter-increment: item;
} }
a.toclink { a.toclink {
font-size: 25%; font-size: 25%;
} }
a.toclink:before { a.toclink:before {
content: "▲ "; content: "▲ ";
} }

View file

@ -239,7 +239,7 @@
"58": [vorne5, hinten8], "58": [vorne5, hinten8],
"59": [vorne5, hinten9] "59": [vorne5, hinten9]
}, },
"getDotMinute": function (time) { "getDotMinute": function() {
return 0; return 0;
} }
}; };

View file

@ -57,17 +57,50 @@
}, },
"hours": { "hours": {
"0": {5: [6, 7, 8, 9, 10, 11]}, "0": {5: [6, 7, 8, 9, 10, 11]},
"1,13": [{3: [5, 6, 7]}, heures], "1,13": [
"2,14": [{1: [8, 9, 10, 11]}, heures], {3: [5, 6, 7]},
"3,15": [{2: [7, 8, 9, 10, 11]}, heures], heures
"4,16": [{2: [1, 2, 3, 4, 5, 6]}, heures], ],
"5,17": [{4: [8, 9, 10, 11]}, heures], "2,14": [
"6,18": [{4: [5, 6, 7]}, heures], {1: [8, 9, 10, 11]},
"7,19": [{3: [8, 9, 10, 11]}, heures], heures
"8,20": [{4: [1, 2, 3, 4]}, heures], ],
"9,21": [{3: [1, 2, 3, 4]}, heures], "3,15": [
"10,22": [{5: [3, 4, 5]}, heures], {2: [7, 8, 9, 10, 11]},
"11,23": [{6: [1, 2, 3, 4]}, heures], heures
],
"4,16": [
{2: [1, 2, 3, 4, 5, 6]},
heures
],
"5,17": [
{4: [8, 9, 10, 11]},
heures
],
"6,18": [
{4: [5, 6, 7]},
heures
],
"7,19": [
{3: [8, 9, 10, 11]},
heures
],
"8,20": [
{4: [1, 2, 3, 4]},
heures
],
"9,21": [
{3: [1, 2, 3, 4]},
heures
],
"10,22": [
{5: [3, 4, 5]},
heures
],
"11,23": [
{6: [1, 2, 3, 4]},
heures
],
"12": {5: [1, 2, 3, 4]} "12": {5: [1, 2, 3, 4]}
}, },
"getHour": function(date) { "getHour": function(date) {

View file

@ -21,7 +21,8 @@
registerLanguage: function registerLanguage(code, language) { registerLanguage: function registerLanguage(code, language) {
var alreadyExists = uhrGlobals.languages.some(function(element) { var alreadyExists = uhrGlobals.languages.some(function(element) {
if (code === element.code) { if (code === element.code) {
console.error("Error: Language code '" + code + "' cannot be registered for language '" + language.language + "' because it is already registered for language '" + element.language + "'!"); console.error("Error: Language code '" + code + "' cannot be registered for language '" + language.language +
"' because it is already registered for language '" + element.language + "'!");
return true; return true;
} }
return false; return false;
@ -161,11 +162,10 @@
controlpanel.append(content); controlpanel.append(content);
// on/off switch // on/off switch
var toggleSwitch = $('<div class="onoffswitch" id="uhr-onoffswitch' + this.id + '"></div>'); var toggleSwitch = $('<div class="onoffswitch" id="uhr-onoffswitch' + this.id + '"></div>');
toggleSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-onoffswitch-checkbox' + this.id + '" checked="checked" />'); toggleSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-onoffswitch-checkbox' + this.id +
toggleSwitch.append('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' '" checked="checked" />');
+ '<div class="onoffswitch-inner"></div>' toggleSwitch.append('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
+ '<div class="onoffswitch-switch"></div>' '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
+ '</label>');
content.append(toggleSwitch); content.append(toggleSwitch);
// language chooser // language chooser

View file

@ -1,5 +1,5 @@
CACHE MANIFEST CACHE MANIFEST
# 6.3 # 6.3.1_rc1
css/uhr.css css/uhr.css
css/uhr-black.css css/uhr-black.css

View file

@ -1,6 +1,3 @@
/**
* Created by u203395 on 04.07.2014.
*/
suite('Bärneruhr', function() { suite('Bärneruhr', function() {
"use strict"; "use strict";
test('dummy', function() { test('dummy', function() {