Merge pull request 'feature/3-migrate-from-grunt-to-webpack' (#13) from feature/3-migrate-from-grunt-to-webpack into develop

Reviewed-on: #13

.bowerrc

@@ -1,3 +0,0 @@
-{
-    "directory": "bower_components"
-}

.drone.yml

@@ -0,0 +1,13 @@
+kind: pipeline
+type: docker
+name: default
+
+steps:
+  - name: prepare
+    image: node:15-alpine
+    commands:
+      - npm install
+  - name: build
+    image: node:15-alpine
+    commands:
+      - npm run build

.editorconfig

@@ -9,5 +9,7 @@ charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
 
+[*.yml]
+indent_size = 2
 [*.md]
 trim_trailing_whitespace = false

Gruntfile.js

@@ -1,181 +0,0 @@
-module.exports = function (grunt) {
-    'use strict';
-    // Load all grunt tasks
-    require('load-grunt-tasks')(grunt);
-    // Show elapsed time at the end
-    require('time-grunt')(grunt);
-
-    // Project configuration.
-    grunt.initConfig({
-        // Metadata.
-        pkg: grunt.file.readJSON('package.json'),
-        banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +
-        '<%= grunt.template.today("yyyy-mm-dd") %>\n' +
-        '<%= pkg.homepage ? "* " + pkg.homepage + "\\n" : "" %>' +
-        '* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>;' +
-        ' Licensed <%= pkg.licenses[0].type %> */\n',
-        // Task configuration.
-        clean: {
-            files: ['dist']
-        },
-        concat: {
-            options: {
-                banner: '<%= banner %>',
-                stripBanners: true
-            },
-            libs: {
-                src: [
-                    'bower_components/jquery/dist/jquery.js',
-                    'bower_components/jquery-ui/ui/core.js',
-                    'bower_components/jquery-ui/ui/widget.js',
-                    'bower_components/jquery-cookie/jquery.cookie.js'
-                ],
-                dest: 'dist/libs.js'
-            },
-            dist: {
-                src: ['src/uhr.js', 'src/uhr-*.js'],
-                dest: 'dist/jquery.<%= pkg.name %>.complete.js'
-            },
-            main: {
-                src: ['src/uhr.js'],
-                dest: 'dist/jquery.<%= pkg.name %>.main.js'
-            },
-            base: {
-                src: ['src/uhr.js', 'src/uhr-de_CH.js'],
-                dest: 'dist/jquery.<%= pkg.name %>.base.js'
-            },
-            baselangs: {
-                src: ['src/uhr-*.js'],
-                exclude: ['src/uhr-de_CH.js'],
-                dest: 'dist/jquery.<%= pkg.name %>.baselangs.js'
-            },
-            langs: {
-                src: ['src/uhr-*.js'],
-                dest: 'dist/jquery.<%= pkg.name %>.langs.js'
-            }
-        },
-        uglify: {
-            options: {
-                banner: '<%= banner %>'
-            },
-            libs: {
-                src: '<%= concat.libs.dest %>',
-                dest: 'dist/libs.min.js'
-            },
-            dist: {
-                src: '<%= concat.dist.dest %>',
-                dest: 'dist/jquery.<%= pkg.name %>.complete.min.js'
-            },
-            main: {
-                src: '<%= concat.main.dest %>',
-                dest: 'dist/jquery.<%= pkg.name %>.main.min.js'
-            },
-            base: {
-                src: '<%= concat.base.dest %>',
-                dest: 'dist/jquery.<%= pkg.name %>.base.min.js'
-            },
-            baselangs: {
-                src: '<%= concat.baselangs.dest %>',
-                dest: 'dist/jquery.<%= pkg.name %>.baselangs.min.js'
-            },
-            langs: {
-                src: '<%= concat.langs.dest %>',
-                dest: 'dist/jquery.<%= pkg.name %>.langs.min.js'
-            }
-        },
-        cssmin: {
-            allcss: {
-                files: [{
-                    expand: true,
-                    cwd: 'css',
-                    src: ['*.css'],
-                    dest: 'dist',
-                    ext: '.min.css'
-                }]
-            }
-        },
-        mocha_phantomjs: {
-            all: {
-                options: {
-                    urls: ['http://localhost:9000/test/test.html']
-                }
-            }
-        },
-        jshint: {
-            options: {
-                reporter: require('jshint-stylish')
-            },
-            gruntfile: {
-                options: {
-                    jshintrc: '.jshintrc'
-                },
-                src: 'Gruntfile.js'
-            },
-            src: {
-                options: {
-                    jshintrc: '.jshintrc'
-                },
-                src: ['src/**/*.js']
-            },
-            test: {
-                options: {
-                    jshintrc: 'test/.jshintrc'
-                },
-                src: ['test/*.js']
-            }
-        },
-        watch: {
-            gruntfile: {
-                files: '<%= jshint.gruntfile.src %>',
-                tasks: ['jshint:gruntfile']
-            },
-            src: {
-                files: '<%= jshint.src.src %>',
-                tasks: ['jshint:src', 'mocha_phantomjs']
-            },
-            test: {
-                files: ['test/test.html', '<%= jshint.test.src %>'],
-                tasks: ['jshint:test', 'mocha_phantomjs']
-            }
-        },
-        connect: {
-            server: {
-                options: {
-                    hostname: '*',
-                    port: 9000
-                }
-            }
-        },
-        version: {
-            VERSION: {
-                options: {
-                    prefix: ''
-                },
-                src: ['VERSION']
-            },
-            bower: {
-                src: ['bower.json']
-            },
-            manifest: {
-                options: {
-                    prefix: 'Version\\s+'
-                },
-                src: ['manifest.appcache']
-            }
-        }
-    });
-
-    grunt.loadNpmTasks('grunt-mocha-phantomjs');
-    grunt.loadNpmTasks('grunt-contrib-cssmin');
-    grunt.loadNpmTasks('grunt-version');
-
-    // Default task.
-    grunt.registerTask('default', ['jshint', 'clean', 'version', 'concat', 'connect', 'mocha_phantomjs', 'uglify', 'cssmin']);
-    grunt.registerTask('buildonly', ['clean', 'version', 'concat', 'uglify', 'cssmin']);
-    grunt.registerTask('server', function () {
-        grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.');
-        grunt.task.run(['serve']);
-    });
-    grunt.registerTask('serve', ['connect', 'watch']);
-    grunt.registerTask('test', ['jshint', 'connect', 'mocha_phantomjs']);
-};

README.md

@@ -1,10 +1,7 @@
-Bärneruhr
+# Bärneruhr
-=========
-
 Du willst Bärneruhr auf deiner Website verwenden? Dank des jQuery-Plugins geht das so einfach, dass es sogar deine Grossmutter tun könnte!
 
-1. Benötigte Dateien einbinden
+## 1. Benötigte Dateien einbinden
-------------------------------
 * Binde folgende CSS-Datei im HTML-Dokument ein:
 	* dist/uhr.min.css
 * Binde zusätzlich mindestens eine der folgenden CSS-Dateien im HTML ein, je nach dem, welche Farben deine Uhr unterstützen soll:
@@ -18,17 +15,19 @@ Du willst Bärneruhr auf deiner Website verwenden? Dank des jQuery-Plugins geht
 
 Beim Einbinden muss das attribut `data-class` angegeben werden, welches die CSS-Klasse des Themes definiert. Optional kann mit `data-name` ein im Dropdown anzuzeigender Name angegeben werden. Beispiel:
 
+```html
 <link rel="stylesheet" type="text/css" href="dist/uhr-black.min.css" data-class="black" data-name="Schwarz" />
+```
 
 * Binde nach den CSS-Dateien (wichtig!) folgende Javascript-Dateien im HTML-Dokument ein:
 	* dist/libs.min.js: Dies enthält die minifizierten Versionen von jQuery, jQuery-UI (mit den Komponenten `code` und `widget`) und jQuery-Cookie.
 Alternativ kannst Du auch direkt die benötigten Bibliotheken einbinden:
-	* jquery (getestet mit Version 2.1.0)
+		* jquery (getestet mit Version 3.4.1)
-	* jquery-ui (getestet mit Version 1.10.4)
+		* jquery-ui (getestet mit Version 1.12.1)
-		* Von jquery-ui werden die Komponenten 'core' und 'widget' benötigt.
+			* Von jquery-ui wird die Komponente 'widget' benötigt.
-	* jquery-cookie (getestet mit Version 1.4.0)
+		* jquery-cookie (getestet mit Version 1.4.1)
 Je nach dem, in welchen Sprachen du die Uhr verwenden willst, noch eine der folgenden Dateien:
-	* dist/jquery.uhr.complete.min.js: Enthält die Hauptdatei sowie alle unterstützden Sprachdateien
+	* dist/jquery.uhr.complete.min.js: Enthält die Hauptdatei sowie alle unterstützten Sprachdateien
 	* dist/jquery.uhr.base.min.js: Enthält die Hauptdatei sowie Bärndütsch (de_CH)
 	* dist/jquery.uhr.main.min.js: Enthält ausschliesslich die Hauptdatei. Zusätzlich muss noch mindestens eine Sprachdatei eingebunden werden (siehe unten).
 
@@ -44,24 +43,27 @@ Je nach dem, in welchen Sprachen du die Uhr verwenden willst, noch eine der folg
 	* src/uhr-fr.js (Französisch)
 	* src/uhr-it.js (Italienisch)
 	* src/uhr-nl.js (Niederländisch)
+	* src/uhr-pt.js (Portugiesisch)
 
 `src/uhr-de_CH_genau.js` ist eine Variante von Bärndütsch, bei der zur vollen Stunde zusätzlich das Wort "genau" angezeigt wird (also z.B. um 15:00 Uhr "ES ISCH GENAU DRÜ" anstelle von "ES ISCH DRÜ").
 
-2. Uhr-Element im HTML-Dokument einfügen
+## 2. Uhr-Element im HTML-Dokument einfügen
-----------------------------------------
 Erstelle ein leeres `<div>` mit einer ID:
 
+```html
 <div id="uhrcontainer"></div>
+```
 
-3. Uhr per Javascript konfigurieren
+## 3. Uhr per Javascript konfigurieren
------------------------------------
 Initialisiere die Uhr mit einer einzigen Zeile Javascript:
 
+```javascript
 jQuery('#uhrcontainer').uhr();
+```
 
 Damit wird eine Uhr in der Standardkonfiguration erzeugt. Das heisst:
 
-* Breite ist 100% des Eltenelements
+* Breite ist 100% des Elternelements
 * Farbe ist diejenige des ersten eingebundenen Theme-Stylesheets.
 * Sprache ist Bärndütsch
 * Die Uhr ist eingeschaltet
@@ -75,21 +77,23 @@ Wie du diese Optionen bereits in der Konfiguration ändern kannst, verrät der n
 
 Es kann natürlich auch eine Collection von Elementen übergeben werden. Mit
 
+```javascript
 jQuery('div').uhr();
+```
 
 würde also jedes `<div>`-Element der Seite in eine Uhr umgewandelt.
 
-4. Weitere Optionen
+## 4. Weitere Optionen
--------------------
 Der uhr()-Methode kann ein Options-Objekt mitgegeben werden:
 
+```javascript
 jQuery('#uhrcontainer').uhr({
 	status: 'on',         // 'on' (default) oder 'off'
 	theme: 'black',       // 'black' (default), 'white', 'red', 'yellow', 'green', 'blue' oder 'pink' (je nach eingebundenen Theme-Stylesheets)
-		language: 'de_CH',    // 'de_CH' (default), 'de_CH_genau', 'de', 'dk', 'en', 'es', 'fr', 'it' oder 'nl' (je nach eingebundenen Sprachdateien)
+	language: 'de_CH',    // 'de_CH' (default), 'de_CH_genau', 'de', 'dk', 'en', 'es', 'fr', 'it', 'nl' oder 'pt' (je nach eingebundenen Sprachdateien)
 	mode: 'normal',       // 'normal' (default): Die Uhr zeigt die aktuelle Zeit (Stunden und Minuten) in Worten an
 	                      // 'seconds': Die Uhr zeigt die aktuellen Sekunden als grosse Ziffern an
-		width: '100%',        // eine CSS-Grössenangabe (default: 100%)
+	width: '100%',        // Eine CSS-Grössenangabe (default: 100%)
 	force: false,         // false (default): Falls ein Cookie im Browser besteht, werden dessen Konfigurationswerte übernommen;
 	                      // true: immer die angegebene Konfiguration verwenden
 	controls: true,       // true (default): Die Bedienelemente (Ein-/Ausschalter, Theme-, Zeitmodus- und Sprachwähler) werden angezeigt
@@ -98,23 +102,27 @@ Der uhr()-Methode kann ein Options-Objekt mitgegeben werden:
 	                      // false: Die Uhr behält ihre anfängliche Grösse
 	cookiePath: undefined // Gibt den Cookie-Pfad an. Ist normalerweise nicht definiert; in diesem Fall wird der Pfad der Datei benutzt, welche die Uhr anzeigt. Kann für spezielle Zwecke aber explizit gesetzt werden.
 });
+```
 
-5. Sonderfunktionen
+## 5. Sonderfunktionen
--------------------
 Es gibt noch einen zusätzlichen Konfigurationsparameter. Mittels
 
+```javascript
 {
 	time: new Date()
 }
+```
 kann die Uhr auf eine fixe Zeit eingestellt werden. Sie bleibt dann statisch und aktualisiert sich nicht, sondern zeigt immer diese Zeit an. Beim Klick auf den On/Off-Schalter oder beim Wechsel der Sprache wird dies allerdings rückgängig gemacht und die Uhr nimmt das Standardverhalten mit der aktuellen Systemzeit an.
 
 Die Zeit kann auch über einen Methodenaufruf dynamisch eingestellt werden:
 
+```javascript
 jQuery('#uhrcontainer').uhr("time", new Date());
+```
+
+## 6. Konfiguration über die URL
+Es ist möglich, die Uhr durch den Aufruf mit URL-Parametern zu konfigurieren. Dies übersteuert auch allfällig bereits in einem Cookie gespeicherte Einstellungen. Die Einstellungen werden für alle Uhr-Elemente übernommen, welche sich auf der Seite befinden. Folgende Parameter werden unterstützt, wenn du sie mit einem Hash (`#`) an die URL anhängst:
 
-6. Konfiguration über die URL
------------------------------
-Es ist möglich, die Uhr durch den Aufruf mit URL-Parameters zu konfigurieren. Dies übersteuert auch allfällig bereits in einem Cookie gespeicherte Einstellungen. Die Einstellungen werden für alle Uhr-Elemente übernommen, welche sich auf der Seite befinden. Folgende Parameter werden unterstützt, wenn du sie mit einem Hash (`#`) an die URL anhängst:
 * `l` oder `language`: Bestimmt die Sprache. Der Wert ist der Sprach-Code (abhängig von den eingebundenen Sprachdateien):
 	* de_CH: Bärndütsch
 	* de_CH_genau: Bärndütsch (mit "genau")
@@ -125,6 +133,7 @@ Es ist möglich, die Uhr durch den Aufruf mit URL-Parameters zu konfigurieren. D
 	* fr: Französisch
 	* it: Italienisch
 	* nl: Niederländisch
+	* pt: Portugiesisch
 * `t` oder `theme`: Bestimmt die Farbe der Uhr. Der Wert ist der Farb-Code (abhängig von den eingebundenen CSS-Dateien):
 	* black: Schwarz
 	* white: Weiss
@@ -139,7 +148,8 @@ Es ist möglich, die Uhr durch den Aufruf mit URL-Parameters zu konfigurieren. D
 * `s` oder `status`: Bestimmt den anfänglichen Zustand der Uhr.
 	* on: Die Uhr ist eingeschaltet
 	* off: Die Uhr ist ausgeschaltet
-Eine URL kann also beispielweise so aussehen:
+
+Eine URL kann also beispielsweise so aussehen:
 
 	http://example.com/uhr.html#l=fr&t=red&m=seconds&s=on
 
@@ -147,8 +157,7 @@ Dies zeigt dann die Uhr auf Französisch in Rot, im Sekunden-Modus und eingescha
 
 Viel Spass!
 
-A. Lizenzbestimmungen
+# A. Lizenzbestimmungen
-=====================
 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

VERSION

@@ -1 +1 @@
-8.0.1-dev.0
+9.0.0-dev.0

bower.json

@@ -1,13 +0,0 @@
-{
-    "name": "uhr",
-    "version": "8.0.1-dev.0",
-    "dependencies": {
-        "jquery": "~2.1.3",
-        "jquery-ui": "~1.11.2",
-        "jquery-cookie": "~1.4.1"
-    },
-    "devDependencies": {
-        "mocha": "~2.1.0",
-        "chai": "~1.10.0"
-    }
-}

build-config/entrypoints/css-app.js

@@ -0,0 +1 @@
+import '../../css/uhr.css';

build-config/entrypoints/css-black.js

@@ -0,0 +1 @@
+import '../../css/uhr-black.css';

build-config/entrypoints/css-blue.js

@@ -0,0 +1 @@
+import '../../css/uhr-blue.css';

build-config/entrypoints/css-green.js

@@ -0,0 +1 @@
+import '../../css/uhr-green.css';

build-config/entrypoints/css-pink.js

@@ -0,0 +1 @@
+import '../../css/uhr-pink.css';

build-config/entrypoints/css-red.js

@@ -0,0 +1 @@
+import '../../css/uhr-red.css';

build-config/entrypoints/css-white.js

@@ -0,0 +1 @@
+import '../../css/uhr-white.css';

build-config/entrypoints/css-yellow.js

@@ -0,0 +1 @@
+import '../../css/uhr-yellow.css';

build-config/entrypoints/js-app.js

@@ -0,0 +1 @@
+import '../../src/uhr';

build-config/entrypoints/js-base.js

@@ -0,0 +1,2 @@
+import '../../src/uhr';
+import '../../src/uhr-de_CH';

build-config/entrypoints/js-baselangs.js

@@ -0,0 +1,9 @@
+import '../../src/uhr-de';
+import '../../src/uhr-de_CH_genau';
+import '../../src/uhr-dk';
+import '../../src/uhr-en';
+import '../../src/uhr-es';
+import '../../src/uhr-fr';
+import '../../src/uhr-it';
+import '../../src/uhr-nl';
+import '../../src/uhr-pt';

build-config/entrypoints/js-complete.js

@@ -0,0 +1,11 @@
+import '../../src/uhr';
+import '../../src/uhr-de';
+import '../../src/uhr-de_CH';
+import '../../src/uhr-de_CH_genau';
+import '../../src/uhr-dk';
+import '../../src/uhr-en';
+import '../../src/uhr-es';
+import '../../src/uhr-fr';
+import '../../src/uhr-it';
+import '../../src/uhr-nl';
+import '../../src/uhr-pt';

build-config/entrypoints/js-langs.js

@@ -0,0 +1,10 @@
+import '../../src/uhr-de';
+import '../../src/uhr-de_CH';
+import '../../src/uhr-de_CH_genau';
+import '../../src/uhr-dk';
+import '../../src/uhr-en';
+import '../../src/uhr-es';
+import '../../src/uhr-fr';
+import '../../src/uhr-it';
+import '../../src/uhr-nl';
+import '../../src/uhr-pt';

build-config/entrypoints/js-libs.js

@@ -0,0 +1,3 @@
+import 'jquery';
+import 'jquery-ui';
+import 'jquery.cookie';

build-config/rollup.config.css-app.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from "postcss";
+import cssnano from "cssnano";
+
+export default {
+    input: 'build-config/entrypoints/css-app.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr.min.css'
+    })]
+}

build-config/rollup.config.css-black.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-black.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-black.min.css'
+    })]
+}

build-config/rollup.config.css-blue.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-blue.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-blue.min.css'
+    })]
+}

build-config/rollup.config.css-green.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-green.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-green.min.css'
+    })]
+}

build-config/rollup.config.css-pink.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-pink.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-pink.min.css'
+    })]
+}

build-config/rollup.config.css-red.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-red.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-red.min.css'
+    })]
+}

build-config/rollup.config.css-white.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-white.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-white.min.css'
+    })]
+}

build-config/rollup.config.css-yellow.js

@@ -0,0 +1,11 @@
+import cssbundle from 'rollup-plugin-css-bundle';
+import postcss from 'postcss';
+import cssnano from 'cssnano';
+
+export default {
+    input: 'build-config/entrypoints/css-yellow.js',
+    plugins: [cssbundle({
+        transform: code => postcss([cssnano]).process(code),
+        output: 'dist/uhr-yellow.min.css'
+    })]
+}

build-config/rollup.config.js-app.js

@@ -0,0 +1,23 @@
+import {terser} from 'rollup-plugin-terser';
+
+export default {
+    external: [
+        'jquery',
+        'jquery-ui',
+        'jquery.cookie'
+    ],
+    input: 'build-config/entrypoints/js-app.js',
+    output: [
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.main.js',
+            format: 'cjs'
+        },
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.main.min.js',
+            format: 'cjs',
+            plugins: [terser()]
+        }
+    ]
+}

build-config/rollup.config.js-base.js

@@ -0,0 +1,23 @@
+import {terser} from 'rollup-plugin-terser';
+
+export default {
+    external: [
+        'jquery',
+        'jquery-ui',
+        'jquery.cookie'
+    ],
+    input: 'build-config/entrypoints/js-base.js',
+    output: [
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.base.js',
+            format: 'cjs'
+        },
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.base.min.js',
+            format: 'cjs',
+            plugins: [terser()]
+        }
+    ]
+}

build-config/rollup.config.js-baselangs.js

@@ -0,0 +1,23 @@
+import {terser} from 'rollup-plugin-terser';
+
+export default {
+    external: [
+        'jquery',
+        'jquery-ui',
+        'jquery.cookie'
+    ],
+    input: 'build-config/entrypoints/js-baselangs.js',
+    output: [
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.baselangs.js',
+            format: 'cjs'
+        },
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.baselangs.min.js',
+            format: 'cjs',
+            plugins: [terser()]
+        }
+    ]
+}

build-config/rollup.config.js-complete.js

@@ -0,0 +1,23 @@
+import {terser} from 'rollup-plugin-terser';
+
+export default {
+    external: [
+        'jquery',
+        'jquery-ui',
+        'jquery.cookie'
+    ],
+    input: 'build-config/entrypoints/js-complete.js',
+    output: [
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.complete.js',
+            format: 'cjs'
+        },
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.complete.min.js',
+            format: 'cjs',
+            plugins: [terser()]
+        }
+    ]
+}

build-config/rollup.config.js-langs.js

@@ -0,0 +1,23 @@
+import {terser} from 'rollup-plugin-terser';
+
+export default {
+    external: [
+        'jquery',
+        'jquery-ui',
+        'jquery.cookie'
+    ],
+    input: 'build-config/entrypoints/js-langs.js',
+    output: [
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.langs.js',
+            format: 'cjs'
+        },
+        {
+            dir: 'dist',
+            entryFileNames: 'jquery.uhr.langs.min.js',
+            format: 'cjs',
+            plugins: [terser()]
+        }
+    ]
+}

build-config/rollup.config.js-libs.js

@@ -0,0 +1,21 @@
+import {terser} from 'rollup-plugin-terser';
+import {nodeResolve} from '@rollup/plugin-node-resolve';
+
+export default {
+    input: 'build-config/entrypoints/js-libs.js',
+    output: [
+        {
+            dir: 'dist',
+            entryFileNames: 'libs.js',
+            format: 'cjs'
+        },
+        {
+            dir: 'dist',
+            entryFileNames: 'libs.min.js',
+            format: 'cjs',
+            plugins: [terser()]
+        }
+    ],
+    context: 'this',
+    plugins: [nodeResolve()]
+}

dist/jquery.uhr.base.js

@@ -1,8 +1,20 @@
-/*! uhr - v8.0.1-dev.0 - 2015-01-19
-* http://bärneruhr.ch/
-* Copyright (c) 2015 Manuel Friedli; Licensed GPLv3 */
-(function($) {
 'use strict';
+
+/*
+ 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/>.
+ */
+(function ($) {
     var uhrGlobals = {
         "id": 0,
         "languages": [],
@@ -41,6 +53,9 @@
     }
 
     // public interface methods (exported later)
+    var setCookie;
+    var isOn;
+    var update;
     var start = function start() {
         if (!isOn.bind(this)()) {
             this.timer = window.setInterval(function () {
@@ -66,436 +81,25 @@
             this.start();
         }
     };
-    var setLanguage = function setLanguage(languageKey) {
+    var language;
-        if (languageKey !== this.options.language) {
-            this.options.language = languageKey;
-            var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
-            renderer.render.bind(this)(function() {
-                this.currentMinute = -1;
-                update.bind(this)();
-            }.bind(this));
-            setCookie.bind(this)('uhr-language', languageKey);
-            update.bind(this)();
-        }
-    };
-    var setTheme = function setTheme(theme) {
-        if (theme !== this.options.theme) {
-            this.element.removeClass(this.options.theme).addClass(theme);
-            $('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
-            this.options.theme = theme;
-            setCookie.bind(this)('uhr-theme', theme);
-        }
-    };
-    var setTime = function setTime(time) {
-        this.currentMinute = -1;
-        if (time === null) {
-            this.options.time = new Date();
-        } else {
-            if (this.timer !== null) {
-                window.clearInterval(this.timer);
-            }
-            this.options.time = time;
-        }
-        update.bind(this)();
-    };
-    var setMode = function(mode) {
-        this.options.mode = mode;
-        this.currentMinute = -1;
-        update.bind(this)();
-        setCookie.bind(this)('uhr-mode', mode);
-    };
-    var setWidth = function setWidth(width) {
-        var e = this.element;
-        e.css('width', width);
-        var realWidth = e.width();
-        e.width(realWidth);
-        e.height(realWidth);
-        e.css('font-size', (realWidth / 40) + 'px');
-    };
 
-    // private interface methods
-    var create = function create() {
-        this.id = uhrGlobals.id++;
-        this.timer = null;
-        this.currentMinute = -1;
-        var userTime = this.options.time;
-        var hash, params;
-        if (this.options.time === undefined) {
-            this.options.time = new Date();
-        }
-        // parse the URL params
-        hash = window.location.hash;
-        if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
-            hash = hash.substring(1);
-            hash = decodeURIComponent(hash);
-            params = hash.split('&');
-            params.forEach(function (element) {
-                var pair = element.split('=');
-                var key = pair[0];
-                var value = pair[1];
-                switch (key) {
-                    case 'l':
-                    case 'language':
-                        this.options.language = value;
-                        this.options.force = true;
-                        break;
-                    case 't':
-                    case 'theme':
-                        this.options.theme = value;
-                        this.options.force = true;
-                        break;
-                    case 'm':
-                    case 'mode':
-                        this.options.mode = value;
-                        this.options.force = true;
-                        break;
-                    case 's':
-                    case 'status':
-                        this.options.status = value;
-                        this.options.force = true;
-                        break;
-                }
-            }.bind(this));
-        }
-        // end parse the URL params
-        setupHTML.bind(this)();
-        wireFunctionality.bind(this)();
-        if (userTime !== undefined) {
-            this.time(userTime);
-        }
-    };
-    // private helper methods (not exported)
-    var toggleConfigScreen = function toggleConfigScreen() {
-        $('#uhr-controlpanel' + this.id).toggle('fast');
-    };
-    // set up
-    var setupHTML = function setupHTML() {
-        var e = this.element;
-        // Base clock area
-        e.addClass('uhr');
-        e.empty();
-        e.append('<span class="item dot dot1"></span>');
-        e.append('<span class="item dot dot2"></span>');
-        e.append('<span class="item dot dot3"></span>');
-        e.append('<span class="item dot dot4"></span>');
-        e.append('<div class="letterarea"></div>');
-        e.append('<div class="reflection"></div>');
-        setWidth.bind(this)(this.options.width);
-
-        if (this.options.controls) {
-            var controlpanel = $('<div class="uhr-controlpanel" id="uhr-controlpanel' + this.id + '"></div>');
-            var content = $('<div class="content"></div>');
-            controlpanel.append(content);
-            // on/off switch
-            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('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
-                                '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
-            content.append(toggleSwitch);
-
-            // time mode switch
-            var modeSwitch = $('<div class="onoffswitch" id="uhr-modeswitch' + this.id + '"></div>');
-            modeSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-modeswitch-checkbox' + this.id +
-                                '" checked="checked" />');
-            modeSwitch.append('<label class="onoffswitch-label" for="uhr-modeswitch-checkbox' + this.id + '">' +
-                                '<div class="modeswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' +
-                                '</label>');
-            content.append(modeSwitch);
-            // language chooser
-            if (uhrGlobals.languages.length > 1) {
-                var languageChooser = $('<select id="uhr-languagechooser' + this.id + '"></select>');
-                uhrGlobals.languages.forEach(function(item) {
-                    languageChooser.append('<option value="' + item.code + '">' + item.language + '</option>');
-                });
-                content.append(languageChooser);
-            }
-
-            // theme chooser
-            if (uhrGlobals.themes.length > 1) {
-                var themeChooser = $('<select id="uhr-themechooser' + this.id + '"></select>');
-                uhrGlobals.themes.forEach(function(item) {
-                    themeChooser.append('<option value="' + item.styleClass + '">' + item.name + '</option>');
-                });
-                content.append(themeChooser);
-            }
-            var closebutton = $('<a class="uhr-closecontrolpanel" id="uhr-closecontrolpanel' + this.id + '"></a>');
-            closebutton.on('click', function() {
-                $('#uhr-controlpanel' + this.id).hide('fast');
-            }.bind(this));
-            content.append(closebutton);
-            e.after(controlpanel);
-            controlpanel.hide();
-            var configlink = $('<a class="uhr-configlink" id="uhr-configlink' + this.id + '"></a>');
-            configlink.on('click', function() {
-                toggleConfigScreen.bind(this)();
-            }.bind(this));
-            e.after(configlink);
-        }
-    };
-    var wireFunctionality = function wireFunctionality() {
-        // on/off switch
-        var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
-        toggleSwitch.on('click', function() {
-            this.toggle();
-        }.bind(this));
-        var status = $.cookie('uhr-status' + this.id);
-        if (status === undefined || this.options.force) {
-            status = this.options.status;
-        }
-        toggleSwitch.prop('checked', status === 'on');
-        if (status === 'on') {
-            this.start();
-        } else {
-            this.stop();
-        }
-
-        // time mode switch
-        var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
-        modeSwitch.on('click', function() {
-            if (this.options.mode === 'seconds') {
-                setMode.bind(this)('normal');
-            } else {
-                setMode.bind(this)('seconds');
-            }
-        }.bind(this));
-
-        var mode = $.cookie('uhr-mode' + this.id);
-        if (mode === undefined || this.options.force) {
-            mode = this.options.mode;
-        }
-        modeSwitch.prop('checked', mode !== 'seconds');
-        if (mode === 'seconds') {
-            setMode.bind(this)('seconds');
-        } else {
-            setMode.bind(this)('normal');
-        }
-
-        // language chooser
-        var languageChooser = $('#uhr-languagechooser' + this.id);
-        languageChooser.on('change', function() {
-            var languageKey = $('#uhr-languagechooser' + this.id).val();
-            this.language(languageKey);
-        }.bind(this));
-        var selectedLanguage = $.cookie('uhr-language' + this.id);
-        if (selectedLanguage === undefined || this.options.force) {
-            selectedLanguage = this.options.language;
-        }
-        var found = uhrGlobals.languages.some(function(item) {
-            return selectedLanguage === item.code;
-        });
-        if (!found) {
-            var fallbackLanguage;
-            if (uhrGlobals.languages.length > 0) {
-                fallbackLanguage = uhrGlobals.languages[0].code;
-            } else {
-                fallbackLanguage = '';
-            }
-            console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
-            selectedLanguage = fallbackLanguage;
-        }
-        languageChooser.val(selectedLanguage);
-        this.options.language = "";
-        this.language(selectedLanguage);
-
-        // theme chooser
-        var themeChooser = $('#uhr-themechooser' + this.id);
-        themeChooser.on('change', function() {
-            var themeKey = $('#uhr-themechooser' + this.id).val();
-            this.theme(themeKey);
-        }.bind(this));
-        var selectedTheme = $.cookie('uhr-theme' + this.id);
-        if (selectedTheme === undefined || this.options.force) {
-            selectedTheme = this.options.theme;
-        }
-        found = uhrGlobals.themes.some(function(item) {
-            return selectedTheme === item.styleClass;
-        });
-        if (!found) {
-            var fallbackTheme = uhrGlobals.themes[0].styleClass;
-            console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
-            selectedTheme = fallbackTheme;
-        }
-        themeChooser.val(selectedTheme);
-        this.options.theme = "";
-        this.theme(selectedTheme);
-        if (this.options.autoresize) {
-            $(window).on('resize', function() {
-                var $e = this.element;
-                var $parent = $e.parent();
-                var $window = $(window);
-                var parentWidth = $parent.width();
-                var parentHeight = $parent.height();
-                var windowWidth = $window.width();
-                var windowHeight = $window.height();
-                var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
-                setWidth.bind(this)(size);
-            }.bind(this));
-        }
-    };
-    var destroy = function destroy() {
-        this.timer = null;
-        $(this.element)
-            .removeAttr('style')
-            .removeAttr('class')
-            .empty();
-        $('#uhr-configlink' + this.id).remove();
-        $('#uhr-controlpanel' + this.id).remove();
-
-    };
-    var setCookie = function setCookie(cookieName, cookieValue) {
-        var options = {};
-        if (this.options.cookiePath !== undefined) {
-            options = {expires: 365, path: this.options.cookiePath};
-        } else {
-            options = {expires: 365};
-        }
-        $.cookie(cookieName + this.id, cookieValue, options);
-    };
-
-    // business logic
-    var isOn = function isOn() {
-        return this.timer !== null;
-    };
-    var update = function update() {
-        if (isOn.bind(this)()) {
-            var time = this.options.time;
-            if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
-                if (time.getMinutes() === this.currentMinute) {
-                    return;
-                }
-                this.currentMinute = time.getMinutes();
-            }
-            show.bind(this)(time);
-        } else {
-            clear.bind(this)();
-            this.currentMinute = -1;
-        }
-    };
-    var show = function show(time) {
-        var second = getSecond.bind(this)(time);
-        var dotMinute = getDotMinute.bind(this)(time);
-        var hour = getHour.bind(this)(time);
-        var coarseMinute = getCoarseMinute.bind(this)(time);
-        clear.bind(this)();
-        if (this.options.mode === 'seconds') {
-            highlight.bind(this)('second' + second);
-        } else {
-            highlight.bind(this)('on');
-            for (var i = 1; i <= dotMinute; i++) {
-                highlight.bind(this)('dot' + i);
-            }
-            highlight.bind(this)('minute' + coarseMinute);
-            highlight.bind(this)('hour' + hour);
-        }
-    };
-    var highlight = function highlight(itemClass) {
-        this.element.find('.item.' + itemClass).addClass('active');
-    };
-    var clear = function clear() {
-        this.element.find('.item').removeClass('active');
-    };
-    var getSecond = function getSecond(date) {
-        if (typeof language.bind(this)().getSeconds === 'function') {
-            return language.bind(this)().getSeconds(date);
-        }
-        return date.getSeconds();
-    };
-    var getDotMinute = function getDotMinute(date) {
-        if (typeof language.bind(this)().getDotMinute === 'function') {
-            return language.bind(this)().getDotMinute(date);
-        }
-        var minutes = date.getMinutes();
-        return minutes % 5;
-    };
-    var getCoarseMinute = function getCoarseMinute(date) {
-        if (typeof language.bind(this)().getCoarseMinute === 'function') {
-            return language.bind(this)().getCoarseMinute(date);
-        }
-        return date.getMinutes();
-    };
-    var getHour = function getHour(date) {
-        if (typeof language.bind(this)().getHour === 'function') {
-            return language.bind(this)().getHour(date);
-        }
-        var hour = date.getHours();
-        if (date.getMinutes() >= 25) {
-            return (hour + 1) % 24;
-        }
-        return hour;
-    };
-    var language = function language() {
-        var matchingLanguages = uhrGlobals.languages.filter(function(element) {
-            return (element.code === this.options.language);
-        }, this);
-        if (matchingLanguages.length > 0) {
-            return matchingLanguages[0];
-        }
-        // fallback: return empty object
-        return {};
-    };
-
-    $.widget("fritteli.uhr", {
-        "options": {
-            width: '100%',
-            status: 'on',
-            language: 'de_CH',
-            theme: uhrGlobals.themes[0].styleClass,
-            force: false,
-            controls: true,
-            cookiePath: undefined,
-            autoresize: true,
-            mode: 'normal'
-        },
-        "start": start,
-        "stop": stop,
-        "toggle": toggle,
-        "language": setLanguage,
-        "theme": setTheme,
-        "time": setTime,
-        "mode": setMode,
-        "width": setWidth,
-        // constructor method
-        "_create": create,
-        // destructor method
-        "_destroy": destroy
-    });
-    $.fritteli.uhr.register = uhrGlobals.registerLanguage;
     /**
-     * Hilfsklasse zum Rendern der Uhr.
+     * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
-     * @param layout     Layout-Objekt, das gerendert werden soll.
+     * @param value Der Buchstabe, der Dargestellt werden soll.
-     * @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
+     * @param style Die CSS-Styleklassen des Buchstabens.
      */
-    function UhrRenderer(layout, renderarea) {
+    function Letter(value, style) {
-        this.render = function render(beforeshow) {
+        var myValue = value;
-            if (layout.parsed === undefined) {
+        var myStyle = style || '';
-                switch (layout.version) {
+        this.addStyle = function (style) {
-                case 2:
+            if (myStyle === '') {
-                    var delegate = new UhrRendererV2Delegate(layout);
+                myStyle = style;
-                    var parsedLayout = delegate.parse();
+            } else {
-                    Object.defineProperty(layout, "parsed", {"value": parsedLayout, "writable": false, "configurable": false});
+                myStyle += ' ' + style;
-                    break;
-                default:
-                    console.warn("Unknown layout version: '" + layout.version + "'");
-                    return;
             }
-            }
+        };
-            var letters = layout.parsed;
+        this.toString = function () {
-            renderarea.fadeOut('fast', function() {
+            return '<span class="item letter ' + myStyle + '">' + myValue + '</span>';
-                renderarea.empty();
-                letters.forEach(function(line, index, array) {
-                    line.forEach(function(letter) {
-                        renderarea.append(letter.toString());
-                    });
-                    if (index < array.length - 1) {
-                        renderarea.append('<br/>');
-                    }
-                });
-                if (typeof beforeshow === 'function') {
-                    beforeshow();
-                }
-                renderarea.fadeIn('fast');
-            });
         };
     }
 
@@ -707,6 +311,17 @@
             "59": [vorne5, hinten9]
         };
 
+        function parseObject(letters, styleClass, object) {
+            if (typeof object !== 'undefined' && object !== null) {
+                Object.keys(object).forEach(function (y) {
+                    var highlightLetters = object[y];
+                    highlightLetters.forEach(function (x) {
+                        letters[y - 1][x - 1].addStyle(styleClass);
+                    });
+                });
+            }
+        }
+
         function parseArrayOrObject(letters, styleClass, input) {
             if (typeof input !== 'undefined' && input !== null) {
                 if (Array.isArray(input)) {
@@ -719,17 +334,6 @@
             }
         }
 
-        function parseObject(letters, styleClass, object) {
-            if (typeof object !== 'undefined' && object !== null) {
-                Object.keys(object).forEach(function(y) {
-                    var highlightLetters = object[y];
-                    highlightLetters.forEach(function(x) {
-                        letters[y - 1][x - 1].addStyle(styleClass);
-                    });
-                });
-            }
-        }
-
         function parseTimeDefinition(letters, styleClass, definition) {
             if (typeof definition !== 'undefined' && definition !== null) {
                 Object.keys(definition).forEach(function (listString) {
@@ -765,28 +369,468 @@
     }
 
     /**
-     * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
+     * Hilfsklasse zum Rendern der Uhr.
-     * @param value Der Buchstabe, der Dargestellt werden soll.
+     * @param layout     Layout-Objekt, das gerendert werden soll.
-     * @param style Die CSS-Styleklassen des Buchstabens.
+     * @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
      */
-    function Letter(value, style) {
+    function UhrRenderer(layout, renderarea) {
-        var myValue = value;
+        this.render = function render(beforeshow) {
-        var myStyle = style || '';
+            if (layout.parsed === undefined) {
-        this.addStyle = function(style) {
+                switch (layout.version) {
-            if (myStyle === '') {
+                    case 2:
-                myStyle = style;
+                        var delegate = new UhrRendererV2Delegate(layout);
+                        var parsedLayout = delegate.parse();
+                        Object.defineProperty(layout, "parsed", {
+                            "value": parsedLayout,
+                            "writable": false,
+                            "configurable": false
+                        });
+                        break;
+                    default:
+                        console.warn("Unknown layout version: '" + layout.version + "'");
+                        return;
+                }
+            }
+            var letters = layout.parsed;
+            renderarea.fadeOut('fast', function () {
+                renderarea.empty();
+                letters.forEach(function (line, index, array) {
+                    line.forEach(function (letter) {
+                        renderarea.append(letter.toString());
+                    });
+                    if (index < array.length - 1) {
+                        renderarea.append('<br/>');
+                    }
+                });
+                if (typeof beforeshow === 'function') {
+                    beforeshow();
+                }
+                renderarea.fadeIn('fast');
+            });
+        };
+    }
+
+    var setLanguage = function setLanguage(languageKey) {
+        if (languageKey !== this.options.language) {
+            this.options.language = languageKey;
+            var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
+            renderer.render.bind(this)(function () {
+                this.currentMinute = -1;
+                update.bind(this)();
+            }.bind(this));
+            setCookie.bind(this)('uhr-language', languageKey);
+            update.bind(this)();
+        }
+    };
+    var setTheme = function setTheme(theme) {
+        if (theme !== this.options.theme) {
+            this.element.removeClass(this.options.theme).addClass(theme);
+            $('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
+            this.options.theme = theme;
+            setCookie.bind(this)('uhr-theme', theme);
+        }
+    };
+    var setTime = function setTime(time) {
+        this.currentMinute = -1;
+        if (time === null) {
+            this.options.time = new Date();
         } else {
-                myStyle += ' ' + style;
+            if (this.timer !== null) {
+                window.clearInterval(this.timer);
+            }
+            this.options.time = time;
+        }
+        update.bind(this)();
+    };
+    var setMode = function (mode) {
+        this.options.mode = mode;
+        this.currentMinute = -1;
+        update.bind(this)();
+        setCookie.bind(this)('uhr-mode', mode);
+    };
+    var setWidth = function setWidth(width) {
+        var e = this.element;
+        e.css('width', width);
+        var realWidth = e.width();
+        e.width(realWidth);
+        e.height(realWidth);
+        e.css('font-size', (realWidth / 40) + 'px');
+    };
+
+    // private interface methods
+    var setupHTML;
+    var wireFunctionality;
+    var create = function create() {
+        this.id = uhrGlobals.id++;
+        this.timer = null;
+        this.currentMinute = -1;
+        var userTime = this.options.time;
+        var hash, params;
+        if (this.options.time === undefined) {
+            this.options.time = new Date();
+        }
+        // parse the URL params
+        hash = window.location.hash;
+        if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
+            hash = hash.substring(1);
+            hash = decodeURIComponent(hash);
+            params = hash.split('&');
+            params.forEach(function (element) {
+                var pair = element.split('=');
+                var key = pair[0];
+                var value = pair[1];
+                switch (key) {
+                    case 'l':
+                    case 'language':
+                        this.options.language = value;
+                        this.options.force = true;
+                        break;
+                    case 't':
+                    case 'theme':
+                        this.options.theme = value;
+                        this.options.force = true;
+                        break;
+                    case 'm':
+                    case 'mode':
+                        this.options.mode = value;
+                        this.options.force = true;
+                        break;
+                    case 's':
+                    case 'status':
+                        this.options.status = value;
+                        this.options.force = true;
+                        break;
+                }
+            }.bind(this));
+        }
+        // end parse the URL params
+        setupHTML.bind(this)();
+        wireFunctionality.bind(this)();
+        if (userTime !== undefined) {
+            this.time(userTime);
         }
     };
-        this.toString = function() {
+    // private helper methods (not exported)
-            return '<span class="item letter ' + myStyle + '">' + myValue + '</span>';
+    var toggleConfigScreen = function toggleConfigScreen() {
+        $('#uhr-controlpanel' + this.id).toggle('fast');
     };
+    // set up
+    setupHTML = function setupHTML() {
+        var e = this.element;
+        // Base clock area
+        e.addClass('uhr');
+        e.empty();
+        e.append('<span class="item dot dot1"></span>');
+        e.append('<span class="item dot dot2"></span>');
+        e.append('<span class="item dot dot3"></span>');
+        e.append('<span class="item dot dot4"></span>');
+        e.append('<div class="letterarea"></div>');
+        e.append('<div class="reflection"></div>');
+        setWidth.bind(this)(this.options.width);
+
+        if (this.options.controls) {
+            var controlpanel = $('<div class="uhr-controlpanel" id="uhr-controlpanel' + this.id + '"></div>');
+            var content = $('<div class="content"></div>');
+            controlpanel.append(content);
+            // on/off switch
+            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('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
+                '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
+            content.append(toggleSwitch);
+
+            // time mode switch
+            var modeSwitch = $('<div class="onoffswitch" id="uhr-modeswitch' + this.id + '"></div>');
+            modeSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-modeswitch-checkbox' + this.id +
+                '" checked="checked" />');
+            modeSwitch.append('<label class="onoffswitch-label" for="uhr-modeswitch-checkbox' + this.id + '">' +
+                '<div class="modeswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' +
+                '</label>');
+            content.append(modeSwitch);
+            // language chooser
+            if (uhrGlobals.languages.length > 1) {
+                var languageChooser = $('<select id="uhr-languagechooser' + this.id + '"></select>');
+                uhrGlobals.languages.forEach(function (item) {
+                    languageChooser.append('<option value="' + item.code + '">' + item.language + '</option>');
+                });
+                content.append(languageChooser);
             }
+
+            // theme chooser
+            if (uhrGlobals.themes.length > 1) {
+                var themeChooser = $('<select id="uhr-themechooser' + this.id + '"></select>');
+                uhrGlobals.themes.forEach(function (item) {
+                    themeChooser.append('<option value="' + item.styleClass + '">' + item.name + '</option>');
+                });
+                content.append(themeChooser);
+            }
+            var closebutton = $('<a class="uhr-closecontrolpanel" id="uhr-closecontrolpanel' + this.id + '"></a>');
+            closebutton.on('click', function () {
+                $('#uhr-controlpanel' + this.id).hide('fast');
+            }.bind(this));
+            content.append(closebutton);
+            e.after(controlpanel);
+            controlpanel.hide();
+            var configlink = $('<a class="uhr-configlink" id="uhr-configlink' + this.id + '"></a>');
+            configlink.on('click', function () {
+                toggleConfigScreen.bind(this)();
+            }.bind(this));
+            e.after(configlink);
+        }
+    };
+    wireFunctionality = function wireFunctionality() {
+        // on/off switch
+        var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
+        toggleSwitch.on('click', function () {
+            this.toggle();
+        }.bind(this));
+        var status = $.cookie('uhr-status' + this.id);
+        if (status === undefined || this.options.force) {
+            status = this.options.status;
+        }
+        toggleSwitch.prop('checked', status === 'on');
+        if (status === 'on') {
+            this.start();
+        } else {
+            this.stop();
+        }
+
+        // time mode switch
+        var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
+        modeSwitch.on('click', function () {
+            if (this.options.mode === 'seconds') {
+                setMode.bind(this)('normal');
+            } else {
+                setMode.bind(this)('seconds');
+            }
+        }.bind(this));
+
+        var mode = $.cookie('uhr-mode' + this.id);
+        if (mode === undefined || this.options.force) {
+            mode = this.options.mode;
+        }
+        modeSwitch.prop('checked', mode !== 'seconds');
+        if (mode === 'seconds') {
+            setMode.bind(this)('seconds');
+        } else {
+            setMode.bind(this)('normal');
+        }
+
+        // language chooser
+        var languageChooser = $('#uhr-languagechooser' + this.id);
+        languageChooser.on('change', function () {
+            var languageKey = $('#uhr-languagechooser' + this.id).val();
+            this.language(languageKey);
+        }.bind(this));
+        var selectedLanguage = $.cookie('uhr-language' + this.id);
+        if (selectedLanguage === undefined || this.options.force) {
+            selectedLanguage = this.options.language;
+        }
+        var found = uhrGlobals.languages.some(function (item) {
+            return selectedLanguage === item.code;
+        });
+        if (!found) {
+            var fallbackLanguage;
+            if (uhrGlobals.languages.length > 0) {
+                fallbackLanguage = uhrGlobals.languages[0].code;
+            } else {
+                fallbackLanguage = '';
+            }
+            console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
+            selectedLanguage = fallbackLanguage;
+        }
+        languageChooser.val(selectedLanguage);
+        this.options.language = "";
+        this.language(selectedLanguage);
+
+        // theme chooser
+        var themeChooser = $('#uhr-themechooser' + this.id);
+        themeChooser.on('change', function () {
+            var themeKey = $('#uhr-themechooser' + this.id).val();
+            this.theme(themeKey);
+        }.bind(this));
+        var selectedTheme = $.cookie('uhr-theme' + this.id);
+        if (selectedTheme === undefined || this.options.force) {
+            selectedTheme = this.options.theme;
+        }
+        found = uhrGlobals.themes.some(function (item) {
+            return selectedTheme === item.styleClass;
+        });
+        if (!found) {
+            var fallbackTheme = uhrGlobals.themes[0].styleClass;
+            console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
+            selectedTheme = fallbackTheme;
+        }
+        themeChooser.val(selectedTheme);
+        this.options.theme = "";
+        this.theme(selectedTheme);
+        if (this.options.autoresize) {
+            $(window).on('resize', function () {
+                var $e = this.element;
+                var $parent = $e.parent();
+                var $window = $(window);
+                var parentWidth = $parent.width();
+                var parentHeight = $parent.height();
+                var windowWidth = $window.width();
+                var windowHeight = $window.height();
+                var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
+                setWidth.bind(this)(size);
+            }.bind(this));
+        }
+    };
+    var destroy = function destroy() {
+        this.timer = null;
+        $(this.element)
+            .removeAttr('style')
+            .removeAttr('class')
+            .empty();
+        $('#uhr-configlink' + this.id).remove();
+        $('#uhr-controlpanel' + this.id).remove();
+
+    };
+    setCookie = function setCookie(cookieName, cookieValue) {
+        var options = {};
+        if (this.options.cookiePath !== undefined) {
+            options = {expires: 365, path: this.options.cookiePath};
+        } else {
+            options = {expires: 365};
+        }
+        $.cookie(cookieName + this.id, cookieValue, options);
+    };
+
+    // business logic
+    isOn = function isOn() {
+        return this.timer !== null;
+    };
+    var show;
+    var clear;
+    update = function update() {
+        if (isOn.bind(this)()) {
+            var time = this.options.time;
+            if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
+                if (time.getMinutes() === this.currentMinute) {
+                    return;
+                }
+                this.currentMinute = time.getMinutes();
+            }
+            show.bind(this)(time);
+        } else {
+            clear.bind(this)();
+            this.currentMinute = -1;
+        }
+    };
+    var highlight;
+    var getSecond;
+    var getDotMinute;
+    var getCoarseMinute;
+    var getHour;
+    show = function show(time) {
+        var second = getSecond.bind(this)(time);
+        var dotMinute = getDotMinute.bind(this)(time);
+        var hour = getHour.bind(this)(time);
+        var coarseMinute = getCoarseMinute.bind(this)(time);
+        clear.bind(this)();
+        if (this.options.mode === 'seconds') {
+            highlight.bind(this)('second' + second);
+        } else {
+            highlight.bind(this)('on');
+            for (var i = 1; i <= dotMinute; i++) {
+                highlight.bind(this)('dot' + i);
+            }
+            highlight.bind(this)('minute' + coarseMinute);
+            highlight.bind(this)('hour' + hour);
+        }
+    };
+    highlight = function highlight(itemClass) {
+        this.element.find('.item.' + itemClass).addClass('active');
+    };
+    clear = function clear() {
+        this.element.find('.item').removeClass('active');
+    };
+    getSecond = function getSecond(date) {
+        if (typeof language.bind(this)().getSeconds === 'function') {
+            return language.bind(this)().getSeconds(date);
+        }
+        return date.getSeconds();
+    };
+    getDotMinute = function getDotMinute(date) {
+        if (typeof language.bind(this)().getDotMinute === 'function') {
+            return language.bind(this)().getDotMinute(date);
+        }
+        var minutes = date.getMinutes();
+        return minutes % 5;
+    };
+    getCoarseMinute = function getCoarseMinute(date) {
+        if (typeof language.bind(this)().getCoarseMinute === 'function') {
+            return language.bind(this)().getCoarseMinute(date);
+        }
+        return date.getMinutes();
+    };
+    getHour = function getHour(date) {
+        if (typeof language.bind(this)().getHour === 'function') {
+            return language.bind(this)().getHour(date);
+        }
+        var hour = date.getHours();
+        if (date.getMinutes() >= 25) {
+            return (hour + 1) % 24;
+        }
+        return hour;
+    };
+    language = function language() {
+        var matchingLanguages = uhrGlobals.languages.filter(function (element) {
+            return (element.code === this.options.language);
+        }, this);
+        if (matchingLanguages.length > 0) {
+            return matchingLanguages[0];
+        }
+        // fallback: return empty object
+        return {};
+    };
+
+    $.widget("fritteli.uhr", {
+        "options": {
+            width: '100%',
+            status: 'on',
+            language: 'de_CH',
+            theme: uhrGlobals.themes[0].styleClass,
+            force: false,
+            controls: true,
+            cookiePath: undefined,
+            autoresize: true,
+            mode: 'normal'
+        },
+        "start": start,
+        "stop": stop,
+        "toggle": toggle,
+        "language": setLanguage,
+        "theme": setTheme,
+        "time": setTime,
+        "mode": setMode,
+        "width": setWidth,
+        // constructor method
+        "_create": create,
+        // destructor method
+        "_destroy": destroy
+    });
+    $.fritteli.uhr.register = uhrGlobals.registerLanguage;
 })(jQuery);
 
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
 // hilfsvariablen
     var es_isch = {1: [1, 2, 4, 5, 6, 7]};
     var ab = {4: [1, 2]};

dist/jquery.uhr.baselangs.js

@@ -1,8 +1,20 @@
-/*! uhr - v8.0.1-dev.0 - 2015-01-19
-* http://bärneruhr.ch/
-* Copyright (c) 2015 Manuel Friedli; Licensed GPLv3 */
-(function($) {
 'use strict';
+
+/*
+ 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/>.
+ */
+(function($) {
     var es_ist = {1: [1, 2, 4, 5, 6]};
     var uhr = {10: [9, 10, 11]};
     var nach = {4: [8, 9, 10, 11]};
@@ -61,91 +73,22 @@
     };
     $.fritteli.uhr.register('de', layout);
 }(jQuery));
-(function($) {
+
-    'use strict';
-// hilfsvariablen
-    var es_isch = {1: [1, 2, 4, 5, 6, 7]};
-    var ab = {4: [1, 2]};
-    var vor = {3: [9, 10, 11]};
-    var haubi = {4: [4, 5, 6, 7, 8]};
-    var fuef = {1: [9, 10, 11]};
-    var zae = {2: [9, 10, 11]};
-    var viertu = {2: [1, 2, 3, 4, 5, 6]};
-    var zwaenzg = {3: [1, 2, 3, 4, 5, 6]};
-    var layout = {
-        // version: zur Zeit immer 2 (Pflichtattribut)
-        "version": 2,
-        // Sprechender Name der Sprache
-        "language": 'Bärndütsch',
-        // Buchstabenfeld als Array von Strings.
-        "letters": [
-            'ESKISCHAFÜF',
-            'VIERTUBFZÄÄ',
-            'ZWÄNZGSIVOR',
-            'ABOHAUBIEGE',
-            'EISZWÖISDRÜ',
-            'VIERIFÜFIQT',
-            'SÄCHSISIBNI',
-            'ACHTINÜNIEL',
-            'ZÄNIERBEUFI',
-            'ZWÖUFINAUHR'
-        ],
-        // Permanent aktive Buchstaben. <array-or-object>, vgl. ausführliche Beschreibung bei "minutes".
-        "permanent": es_isch,
 /*
-         * Minuten: Objekt im folgenden Format:
+ 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
-         *     <minuten>: <array-or-object>,
+ the Free Software Foundation, either version 3 of the License, or
-         *     ...
+ (at your option) any later version.
-         * }
+
-         * <minuten>: String von Komma-separierten Minutenwerten, zu welchem die in <array-or-object> angegebenen Buchstaben aktiv sein sollen
+ This program is distributed in the hope that it will be useful,
-         * <array-or-object> : [ <object>, ...] | <object>
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
-         * <object>: { <zeile> : [ <spalte>, ... ] }
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-         * <zeile>: Die Zeile, in welcher die Buchstaben liegen; von oben gezählt, oben ist 1.
+ GNU General Public License for more details.
-         * <spalte>: Die Spalte, in der ein einzelner Buchstabe liegt; von links gezählt, links ist 1.
+
-         * Beispiel:
+ You should have received a copy of the GNU General Public License
-         * "minutes": {
+ along with this program.  If not, see <http://www.gnu.org/licenses/>.
-         *     "0,1": {1: [6, 7, 9]},
-         *     "5": [ {3: [1, 2]}, {4: [10, 11]} ]
-         * }
-         * Erklärung:
-         * Bei Minuten 0 und 1 sind die Buchstaben 6, 7 und 9 der ersten Zeile aktiv.
-         * Bei Minute 5 sind die Buchstaben 1 und 2 der Zeile 3 sowie die Buchstaben 10 und 11 der Zeile 4 aktiv.
  */
-        "minutes": {
-            "5,6,7,8,9": [fuef, ab],
-            "10,11,12,13,14": [zae, ab],
-            "15,16,17,18,19": [viertu, ab],
-            "20,21,22,23,24": [zwaenzg, ab],
-            "25,26,27,28,29": [fuef, vor, haubi],
-            "30,31,32,33,34": haubi,
-            "35,36,37,38,39": [fuef, ab, haubi],
-            "40,41,42,43,44": [zwaenzg, vor],
-            "45,46,47,48,49": [viertu, vor],
-            "50,51,52,53,54": [zae, vor],
-            "55,56,57,58,59": [fuef, vor]
-        },
-        // Die Stunden; gleiches Format wie bei den Minuten
-        "hours": {
-            "0,12": {10: [1, 2, 3, 4, 5, 6]},
-            "1,13": {5: [1, 2, 3]},
-            "2,14": {5: [4, 5, 6, 7]},
-            "3,15": {5: [9, 10, 11]},
-            "4,16": {6: [1, 2, 3, 4, 5]},
-            "5,17": {6: [6, 7, 8, 9]},
-            "6,18": {7: [1, 2, 3, 4, 5, 6]},
-            "7,19": {7: [7, 8, 9, 10, 11]},
-            "8,20": {8: [1, 2, 3, 4, 5]},
-            "9,21": {8: [6, 7, 8, 9]},
-            "10,22": {9: [1, 2, 3, 4]},
-            "11,23": {9: [8, 9, 10, 11]}
-        }
-    };
-// Das Layout bei der Uhr unter dem Code "de_CH" registrieren.
-    $.fritteli.uhr.register('de_CH', layout);
-}(jQuery));
 (function($) {
-    'use strict';
     var es_isch = {1: [1, 2, 4, 5, 6, 7]};
     var genau = {3: [7, 8, 9, 10, 11]};
     var ab = {4: [4, 5]};
@@ -202,6 +145,7 @@
     };
     $.fritteli.uhr.register('de_CH_genau', layout);
 }(jQuery));
+
 /*
  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
@@ -217,7 +161,6 @@
  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 (function($) {
-    'use strict';
 
     var klokken_er = {1: [1, 2, 3, 4, 5, 6, 7, 9, 10]};
     var minutter = {4: [4, 5, 6, 7, 8, 9, 10, 11]};
@@ -282,8 +225,22 @@
     };
     $.fritteli.uhr.register('dk', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var it_is = {1: [1, 2, 4, 5]};
     var half = {4: [1, 2, 3, 4]};
     var to = {4: [10, 11]};
@@ -349,8 +306,22 @@
     };
     $.fritteli.uhr.register('en', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var es_la = {1: [1, 2, 6, 7]};
     var son_las = {1: [2, 3, 4, 6, 7, 8]};
     var y = {7: [6]};
@@ -416,8 +387,21 @@
     $.fritteli.uhr.register('es', layout);
 }(jQuery));
 
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var il_est = {1: [1, 2, 4, 5, 6]};
     var et = {8: [1, 2]};
     var moins = {7: [1, 2, 3, 4, 5]};
@@ -517,8 +501,22 @@
     };
     $.fritteli.uhr.register('fr', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var sono_le = {1: [1, 2, 3, 4, 6, 7]};
     var e_l = {2: [1, 3, 4]};
     var e = {8: [1]};
@@ -583,8 +581,22 @@
     };
     $.fritteli.uhr.register('it', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var het_is = {1: [1, 2, 3, 5, 6]};
     var over1 = {3: [1, 2, 3, 4]};
     var voor1 = {2: [8, 9, 10, 11]};
@@ -650,3 +662,82 @@
     };
     $.fritteli.uhr.register('nl', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
+(function ($) {
+    var e_ = {1: [1]};
+    var sao = {1: [2, 3, 4]};
+    var e1 = {7: [8]};
+    var e2 = {10: [5]};
+    var menos = {7: [7, 8, 9, 10, 11]};
+    var meia = {8: [8, 9, 10, 11]};
+    var cinco = {10: [7, 8, 9, 10, 11]};
+    var dez = {10: [1, 2, 3]};
+    var um_quarto = {9: [1, 2, 4, 5, 6, 7, 8, 9]};
+    var vinte = {8: [1, 2, 3, 4, 5]};
+    var layout = {
+        "version": 2,
+        "language": 'Português',
+        "letters": [
+            'ÉSÃOUMATRÊS',
+            'MEIOLDIADEZ',
+            'DUASEISETEY',
+            'QUATROHNOVE',
+            'CINCOITONZE',
+            'ZMEIALNOITE',
+            'HORASYMENOS',
+            'VINTECAMEIA',
+            'UMVQUARTOPM',
+            'DEZOEYCINCO'
+        ],
+        "minutes": {
+            "5,6,7,8,9": [e1, cinco],
+            "10,11,12,13,14": [e1, dez],
+            "15,16,17,18,19": [e1, um_quarto],
+            "20,21,22,23,24": [e1, vinte],
+            "25,26,27,28,29": [e1, vinte, e2, cinco],
+            "30,31,32,33,34": [e1, meia],
+            "35,36,37,38,39": [menos, vinte, e2, cinco],
+            "40,41,42,43,44": [menos, vinte],
+            "45,46,47,48,49": [menos, um_quarto],
+            "50,51,52,53,54": [menos, dez],
+            "55,56,57,58,59": [menos, cinco]
+        },
+        "hours": {
+            "0": [e_, {"6": [2, 3, 4, 5, 7, 8, 9, 10, 11]}],
+            "12": [e_, {"2": [1, 2, 3, 4, 6, 7, 8]}],
+            "1,13": [e_, {"1": [5, 6, 7]}],
+            "2,14": [sao, {"3": [1, 2, 3, 4]}],
+            "3,15": [sao, {"1": [8, 9, 10, 11]}],
+            "4,16": [sao, {"4": [1, 2, 3, 4, 5, 6]}],
+            "5,17": [sao, {"5": [1, 2, 3, 4, 5]}],
+            "6,18": [sao, {"3": [4, 5, 6, 7]}],
+            "7,19": [sao, {"3": [7, 8, 9, 10]}],
+            "8,20": [sao, {"5": [5, 6, 7, 8]}],
+            "9,21": [sao, {"4": [8, 9, 10, 11]}],
+            "10,22": [sao, {"2": [9, 10, 11]}],
+            "11,23": [sao, {"5": [8, 9, 10, 11]}]
+        },
+        "getHour": function (date) {
+            var hour = date.getHours();
+            if (date.getMinutes() >= 35) {
+                return (hour + 1) % 24;
+            }
+            return hour;
+        }
+    };
+    $.fritteli.uhr.register('pt', layout);
+}(jQuery));

dist/jquery.uhr.langs.js

@@ -1,8 +1,20 @@
-/*! uhr - v8.0.1-dev.0 - 2015-01-19
-* http://bärneruhr.ch/
-* Copyright (c) 2015 Manuel Friedli; Licensed GPLv3 */
-(function($) {
 'use strict';
+
+/*
+ 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/>.
+ */
+(function($) {
     var es_ist = {1: [1, 2, 4, 5, 6]};
     var uhr = {10: [9, 10, 11]};
     var nach = {4: [8, 9, 10, 11]};
@@ -61,8 +73,22 @@
     };
     $.fritteli.uhr.register('de', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
 // hilfsvariablen
     var es_isch = {1: [1, 2, 4, 5, 6, 7]};
     var ab = {4: [1, 2]};
@@ -144,8 +170,22 @@
 // Das Layout bei der Uhr unter dem Code "de_CH" registrieren.
     $.fritteli.uhr.register('de_CH', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var es_isch = {1: [1, 2, 4, 5, 6, 7]};
     var genau = {3: [7, 8, 9, 10, 11]};
     var ab = {4: [4, 5]};
@@ -202,6 +242,7 @@
     };
     $.fritteli.uhr.register('de_CH_genau', layout);
 }(jQuery));
+
 /*
  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
@@ -217,7 +258,6 @@
  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 (function($) {
-    'use strict';
 
     var klokken_er = {1: [1, 2, 3, 4, 5, 6, 7, 9, 10]};
     var minutter = {4: [4, 5, 6, 7, 8, 9, 10, 11]};
@@ -282,8 +322,22 @@
     };
     $.fritteli.uhr.register('dk', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var it_is = {1: [1, 2, 4, 5]};
     var half = {4: [1, 2, 3, 4]};
     var to = {4: [10, 11]};
@@ -349,8 +403,22 @@
     };
     $.fritteli.uhr.register('en', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var es_la = {1: [1, 2, 6, 7]};
     var son_las = {1: [2, 3, 4, 6, 7, 8]};
     var y = {7: [6]};
@@ -416,8 +484,21 @@
     $.fritteli.uhr.register('es', layout);
 }(jQuery));
 
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var il_est = {1: [1, 2, 4, 5, 6]};
     var et = {8: [1, 2]};
     var moins = {7: [1, 2, 3, 4, 5]};
@@ -517,8 +598,22 @@
     };
     $.fritteli.uhr.register('fr', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var sono_le = {1: [1, 2, 3, 4, 6, 7]};
     var e_l = {2: [1, 3, 4]};
     var e = {8: [1]};
@@ -583,8 +678,22 @@
     };
     $.fritteli.uhr.register('it', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
 (function($) {
-    'use strict';
     var het_is = {1: [1, 2, 3, 5, 6]};
     var over1 = {3: [1, 2, 3, 4]};
     var voor1 = {2: [8, 9, 10, 11]};
@@ -650,3 +759,82 @@
     };
     $.fritteli.uhr.register('nl', layout);
 }(jQuery));
+
+/*
+ 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/>.
+ */
+(function ($) {
+    var e_ = {1: [1]};
+    var sao = {1: [2, 3, 4]};
+    var e1 = {7: [8]};
+    var e2 = {10: [5]};
+    var menos = {7: [7, 8, 9, 10, 11]};
+    var meia = {8: [8, 9, 10, 11]};
+    var cinco = {10: [7, 8, 9, 10, 11]};
+    var dez = {10: [1, 2, 3]};
+    var um_quarto = {9: [1, 2, 4, 5, 6, 7, 8, 9]};
+    var vinte = {8: [1, 2, 3, 4, 5]};
+    var layout = {
+        "version": 2,
+        "language": 'Português',
+        "letters": [
+            'ÉSÃOUMATRÊS',
+            'MEIOLDIADEZ',
+            'DUASEISETEY',
+            'QUATROHNOVE',
+            'CINCOITONZE',
+            'ZMEIALNOITE',
+            'HORASYMENOS',
+            'VINTECAMEIA',
+            'UMVQUARTOPM',
+            'DEZOEYCINCO'
+        ],
+        "minutes": {
+            "5,6,7,8,9": [e1, cinco],
+            "10,11,12,13,14": [e1, dez],
+            "15,16,17,18,19": [e1, um_quarto],
+            "20,21,22,23,24": [e1, vinte],
+            "25,26,27,28,29": [e1, vinte, e2, cinco],
+            "30,31,32,33,34": [e1, meia],
+            "35,36,37,38,39": [menos, vinte, e2, cinco],
+            "40,41,42,43,44": [menos, vinte],
+            "45,46,47,48,49": [menos, um_quarto],
+            "50,51,52,53,54": [menos, dez],
+            "55,56,57,58,59": [menos, cinco]
+        },
+        "hours": {
+            "0": [e_, {"6": [2, 3, 4, 5, 7, 8, 9, 10, 11]}],
+            "12": [e_, {"2": [1, 2, 3, 4, 6, 7, 8]}],
+            "1,13": [e_, {"1": [5, 6, 7]}],
+            "2,14": [sao, {"3": [1, 2, 3, 4]}],
+            "3,15": [sao, {"1": [8, 9, 10, 11]}],
+            "4,16": [sao, {"4": [1, 2, 3, 4, 5, 6]}],
+            "5,17": [sao, {"5": [1, 2, 3, 4, 5]}],
+            "6,18": [sao, {"3": [4, 5, 6, 7]}],
+            "7,19": [sao, {"3": [7, 8, 9, 10]}],
+            "8,20": [sao, {"5": [5, 6, 7, 8]}],
+            "9,21": [sao, {"4": [8, 9, 10, 11]}],
+            "10,22": [sao, {"2": [9, 10, 11]}],
+            "11,23": [sao, {"5": [8, 9, 10, 11]}]
+        },
+        "getHour": function (date) {
+            var hour = date.getHours();
+            if (date.getMinutes() >= 35) {
+                return (hour + 1) % 24;
+            }
+            return hour;
+        }
+    };
+    $.fritteli.uhr.register('pt', layout);
+}(jQuery));

dist/jquery.uhr.main.js

@@ -1,8 +1,20 @@
-/*! uhr - v8.0.1-dev.0 - 2015-01-19
-* http://bärneruhr.ch/
-* Copyright (c) 2015 Manuel Friedli; Licensed GPLv3 */
-(function($) {
 'use strict';
+
+/*
+ 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/>.
+ */
+(function ($) {
     var uhrGlobals = {
         "id": 0,
         "languages": [],
@@ -41,6 +53,9 @@
     }
 
     // public interface methods (exported later)
+    var setCookie;
+    var isOn;
+    var update;
     var start = function start() {
         if (!isOn.bind(this)()) {
             this.timer = window.setInterval(function () {
@@ -66,436 +81,25 @@
             this.start();
         }
     };
-    var setLanguage = function setLanguage(languageKey) {
+    var language;
-        if (languageKey !== this.options.language) {
-            this.options.language = languageKey;
-            var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
-            renderer.render.bind(this)(function() {
-                this.currentMinute = -1;
-                update.bind(this)();
-            }.bind(this));
-            setCookie.bind(this)('uhr-language', languageKey);
-            update.bind(this)();
-        }
-    };
-    var setTheme = function setTheme(theme) {
-        if (theme !== this.options.theme) {
-            this.element.removeClass(this.options.theme).addClass(theme);
-            $('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
-            this.options.theme = theme;
-            setCookie.bind(this)('uhr-theme', theme);
-        }
-    };
-    var setTime = function setTime(time) {
-        this.currentMinute = -1;
-        if (time === null) {
-            this.options.time = new Date();
-        } else {
-            if (this.timer !== null) {
-                window.clearInterval(this.timer);
-            }
-            this.options.time = time;
-        }
-        update.bind(this)();
-    };
-    var setMode = function(mode) {
-        this.options.mode = mode;
-        this.currentMinute = -1;
-        update.bind(this)();
-        setCookie.bind(this)('uhr-mode', mode);
-    };
-    var setWidth = function setWidth(width) {
-        var e = this.element;
-        e.css('width', width);
-        var realWidth = e.width();
-        e.width(realWidth);
-        e.height(realWidth);
-        e.css('font-size', (realWidth / 40) + 'px');
-    };
 
-    // private interface methods
-    var create = function create() {
-        this.id = uhrGlobals.id++;
-        this.timer = null;
-        this.currentMinute = -1;
-        var userTime = this.options.time;
-        var hash, params;
-        if (this.options.time === undefined) {
-            this.options.time = new Date();
-        }
-        // parse the URL params
-        hash = window.location.hash;
-        if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
-            hash = hash.substring(1);
-            hash = decodeURIComponent(hash);
-            params = hash.split('&');
-            params.forEach(function (element) {
-                var pair = element.split('=');
-                var key = pair[0];
-                var value = pair[1];
-                switch (key) {
-                    case 'l':
-                    case 'language':
-                        this.options.language = value;
-                        this.options.force = true;
-                        break;
-                    case 't':
-                    case 'theme':
-                        this.options.theme = value;
-                        this.options.force = true;
-                        break;
-                    case 'm':
-                    case 'mode':
-                        this.options.mode = value;
-                        this.options.force = true;
-                        break;
-                    case 's':
-                    case 'status':
-                        this.options.status = value;
-                        this.options.force = true;
-                        break;
-                }
-            }.bind(this));
-        }
-        // end parse the URL params
-        setupHTML.bind(this)();
-        wireFunctionality.bind(this)();
-        if (userTime !== undefined) {
-            this.time(userTime);
-        }
-    };
-    // private helper methods (not exported)
-    var toggleConfigScreen = function toggleConfigScreen() {
-        $('#uhr-controlpanel' + this.id).toggle('fast');
-    };
-    // set up
-    var setupHTML = function setupHTML() {
-        var e = this.element;
-        // Base clock area
-        e.addClass('uhr');
-        e.empty();
-        e.append('<span class="item dot dot1"></span>');
-        e.append('<span class="item dot dot2"></span>');
-        e.append('<span class="item dot dot3"></span>');
-        e.append('<span class="item dot dot4"></span>');
-        e.append('<div class="letterarea"></div>');
-        e.append('<div class="reflection"></div>');
-        setWidth.bind(this)(this.options.width);
-
-        if (this.options.controls) {
-            var controlpanel = $('<div class="uhr-controlpanel" id="uhr-controlpanel' + this.id + '"></div>');
-            var content = $('<div class="content"></div>');
-            controlpanel.append(content);
-            // on/off switch
-            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('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
-                                '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
-            content.append(toggleSwitch);
-
-            // time mode switch
-            var modeSwitch = $('<div class="onoffswitch" id="uhr-modeswitch' + this.id + '"></div>');
-            modeSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-modeswitch-checkbox' + this.id +
-                                '" checked="checked" />');
-            modeSwitch.append('<label class="onoffswitch-label" for="uhr-modeswitch-checkbox' + this.id + '">' +
-                                '<div class="modeswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' +
-                                '</label>');
-            content.append(modeSwitch);
-            // language chooser
-            if (uhrGlobals.languages.length > 1) {
-                var languageChooser = $('<select id="uhr-languagechooser' + this.id + '"></select>');
-                uhrGlobals.languages.forEach(function(item) {
-                    languageChooser.append('<option value="' + item.code + '">' + item.language + '</option>');
-                });
-                content.append(languageChooser);
-            }
-
-            // theme chooser
-            if (uhrGlobals.themes.length > 1) {
-                var themeChooser = $('<select id="uhr-themechooser' + this.id + '"></select>');
-                uhrGlobals.themes.forEach(function(item) {
-                    themeChooser.append('<option value="' + item.styleClass + '">' + item.name + '</option>');
-                });
-                content.append(themeChooser);
-            }
-            var closebutton = $('<a class="uhr-closecontrolpanel" id="uhr-closecontrolpanel' + this.id + '"></a>');
-            closebutton.on('click', function() {
-                $('#uhr-controlpanel' + this.id).hide('fast');
-            }.bind(this));
-            content.append(closebutton);
-            e.after(controlpanel);
-            controlpanel.hide();
-            var configlink = $('<a class="uhr-configlink" id="uhr-configlink' + this.id + '"></a>');
-            configlink.on('click', function() {
-                toggleConfigScreen.bind(this)();
-            }.bind(this));
-            e.after(configlink);
-        }
-    };
-    var wireFunctionality = function wireFunctionality() {
-        // on/off switch
-        var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
-        toggleSwitch.on('click', function() {
-            this.toggle();
-        }.bind(this));
-        var status = $.cookie('uhr-status' + this.id);
-        if (status === undefined || this.options.force) {
-            status = this.options.status;
-        }
-        toggleSwitch.prop('checked', status === 'on');
-        if (status === 'on') {
-            this.start();
-        } else {
-            this.stop();
-        }
-
-        // time mode switch
-        var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
-        modeSwitch.on('click', function() {
-            if (this.options.mode === 'seconds') {
-                setMode.bind(this)('normal');
-            } else {
-                setMode.bind(this)('seconds');
-            }
-        }.bind(this));
-
-        var mode = $.cookie('uhr-mode' + this.id);
-        if (mode === undefined || this.options.force) {
-            mode = this.options.mode;
-        }
-        modeSwitch.prop('checked', mode !== 'seconds');
-        if (mode === 'seconds') {
-            setMode.bind(this)('seconds');
-        } else {
-            setMode.bind(this)('normal');
-        }
-
-        // language chooser
-        var languageChooser = $('#uhr-languagechooser' + this.id);
-        languageChooser.on('change', function() {
-            var languageKey = $('#uhr-languagechooser' + this.id).val();
-            this.language(languageKey);
-        }.bind(this));
-        var selectedLanguage = $.cookie('uhr-language' + this.id);
-        if (selectedLanguage === undefined || this.options.force) {
-            selectedLanguage = this.options.language;
-        }
-        var found = uhrGlobals.languages.some(function(item) {
-            return selectedLanguage === item.code;
-        });
-        if (!found) {
-            var fallbackLanguage;
-            if (uhrGlobals.languages.length > 0) {
-                fallbackLanguage = uhrGlobals.languages[0].code;
-            } else {
-                fallbackLanguage = '';
-            }
-            console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
-            selectedLanguage = fallbackLanguage;
-        }
-        languageChooser.val(selectedLanguage);
-        this.options.language = "";
-        this.language(selectedLanguage);
-
-        // theme chooser
-        var themeChooser = $('#uhr-themechooser' + this.id);
-        themeChooser.on('change', function() {
-            var themeKey = $('#uhr-themechooser' + this.id).val();
-            this.theme(themeKey);
-        }.bind(this));
-        var selectedTheme = $.cookie('uhr-theme' + this.id);
-        if (selectedTheme === undefined || this.options.force) {
-            selectedTheme = this.options.theme;
-        }
-        found = uhrGlobals.themes.some(function(item) {
-            return selectedTheme === item.styleClass;
-        });
-        if (!found) {
-            var fallbackTheme = uhrGlobals.themes[0].styleClass;
-            console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
-            selectedTheme = fallbackTheme;
-        }
-        themeChooser.val(selectedTheme);
-        this.options.theme = "";
-        this.theme(selectedTheme);
-        if (this.options.autoresize) {
-            $(window).on('resize', function() {
-                var $e = this.element;
-                var $parent = $e.parent();
-                var $window = $(window);
-                var parentWidth = $parent.width();
-                var parentHeight = $parent.height();
-                var windowWidth = $window.width();
-                var windowHeight = $window.height();
-                var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
-                setWidth.bind(this)(size);
-            }.bind(this));
-        }
-    };
-    var destroy = function destroy() {
-        this.timer = null;
-        $(this.element)
-            .removeAttr('style')
-            .removeAttr('class')
-            .empty();
-        $('#uhr-configlink' + this.id).remove();
-        $('#uhr-controlpanel' + this.id).remove();
-
-    };
-    var setCookie = function setCookie(cookieName, cookieValue) {
-        var options = {};
-        if (this.options.cookiePath !== undefined) {
-            options = {expires: 365, path: this.options.cookiePath};
-        } else {
-            options = {expires: 365};
-        }
-        $.cookie(cookieName + this.id, cookieValue, options);
-    };
-
-    // business logic
-    var isOn = function isOn() {
-        return this.timer !== null;
-    };
-    var update = function update() {
-        if (isOn.bind(this)()) {
-            var time = this.options.time;
-            if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
-                if (time.getMinutes() === this.currentMinute) {
-                    return;
-                }
-                this.currentMinute = time.getMinutes();
-            }
-            show.bind(this)(time);
-        } else {
-            clear.bind(this)();
-            this.currentMinute = -1;
-        }
-    };
-    var show = function show(time) {
-        var second = getSecond.bind(this)(time);
-        var dotMinute = getDotMinute.bind(this)(time);
-        var hour = getHour.bind(this)(time);
-        var coarseMinute = getCoarseMinute.bind(this)(time);
-        clear.bind(this)();
-        if (this.options.mode === 'seconds') {
-            highlight.bind(this)('second' + second);
-        } else {
-            highlight.bind(this)('on');
-            for (var i = 1; i <= dotMinute; i++) {
-                highlight.bind(this)('dot' + i);
-            }
-            highlight.bind(this)('minute' + coarseMinute);
-            highlight.bind(this)('hour' + hour);
-        }
-    };
-    var highlight = function highlight(itemClass) {
-        this.element.find('.item.' + itemClass).addClass('active');
-    };
-    var clear = function clear() {
-        this.element.find('.item').removeClass('active');
-    };
-    var getSecond = function getSecond(date) {
-        if (typeof language.bind(this)().getSeconds === 'function') {
-            return language.bind(this)().getSeconds(date);
-        }
-        return date.getSeconds();
-    };
-    var getDotMinute = function getDotMinute(date) {
-        if (typeof language.bind(this)().getDotMinute === 'function') {
-            return language.bind(this)().getDotMinute(date);
-        }
-        var minutes = date.getMinutes();
-        return minutes % 5;
-    };
-    var getCoarseMinute = function getCoarseMinute(date) {
-        if (typeof language.bind(this)().getCoarseMinute === 'function') {
-            return language.bind(this)().getCoarseMinute(date);
-        }
-        return date.getMinutes();
-    };
-    var getHour = function getHour(date) {
-        if (typeof language.bind(this)().getHour === 'function') {
-            return language.bind(this)().getHour(date);
-        }
-        var hour = date.getHours();
-        if (date.getMinutes() >= 25) {
-            return (hour + 1) % 24;
-        }
-        return hour;
-    };
-    var language = function language() {
-        var matchingLanguages = uhrGlobals.languages.filter(function(element) {
-            return (element.code === this.options.language);
-        }, this);
-        if (matchingLanguages.length > 0) {
-            return matchingLanguages[0];
-        }
-        // fallback: return empty object
-        return {};
-    };
-
-    $.widget("fritteli.uhr", {
-        "options": {
-            width: '100%',
-            status: 'on',
-            language: 'de_CH',
-            theme: uhrGlobals.themes[0].styleClass,
-            force: false,
-            controls: true,
-            cookiePath: undefined,
-            autoresize: true,
-            mode: 'normal'
-        },
-        "start": start,
-        "stop": stop,
-        "toggle": toggle,
-        "language": setLanguage,
-        "theme": setTheme,
-        "time": setTime,
-        "mode": setMode,
-        "width": setWidth,
-        // constructor method
-        "_create": create,
-        // destructor method
-        "_destroy": destroy
-    });
-    $.fritteli.uhr.register = uhrGlobals.registerLanguage;
     /**
-     * Hilfsklasse zum Rendern der Uhr.
+     * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
-     * @param layout     Layout-Objekt, das gerendert werden soll.
+     * @param value Der Buchstabe, der Dargestellt werden soll.
-     * @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
+     * @param style Die CSS-Styleklassen des Buchstabens.
      */
-    function UhrRenderer(layout, renderarea) {
+    function Letter(value, style) {
-        this.render = function render(beforeshow) {
+        var myValue = value;
-            if (layout.parsed === undefined) {
+        var myStyle = style || '';
-                switch (layout.version) {
+        this.addStyle = function (style) {
-                case 2:
+            if (myStyle === '') {
-                    var delegate = new UhrRendererV2Delegate(layout);
+                myStyle = style;
-                    var parsedLayout = delegate.parse();
+            } else {
-                    Object.defineProperty(layout, "parsed", {"value": parsedLayout, "writable": false, "configurable": false});
+                myStyle += ' ' + style;
-                    break;
-                default:
-                    console.warn("Unknown layout version: '" + layout.version + "'");
-                    return;
             }
-            }
+        };
-            var letters = layout.parsed;
+        this.toString = function () {
-            renderarea.fadeOut('fast', function() {
+            return '<span class="item letter ' + myStyle + '">' + myValue + '</span>';
-                renderarea.empty();
-                letters.forEach(function(line, index, array) {
-                    line.forEach(function(letter) {
-                        renderarea.append(letter.toString());
-                    });
-                    if (index < array.length - 1) {
-                        renderarea.append('<br/>');
-                    }
-                });
-                if (typeof beforeshow === 'function') {
-                    beforeshow();
-                }
-                renderarea.fadeIn('fast');
-            });
         };
     }
 
@@ -707,6 +311,17 @@
             "59": [vorne5, hinten9]
         };
 
+        function parseObject(letters, styleClass, object) {
+            if (typeof object !== 'undefined' && object !== null) {
+                Object.keys(object).forEach(function (y) {
+                    var highlightLetters = object[y];
+                    highlightLetters.forEach(function (x) {
+                        letters[y - 1][x - 1].addStyle(styleClass);
+                    });
+                });
+            }
+        }
+
         function parseArrayOrObject(letters, styleClass, input) {
             if (typeof input !== 'undefined' && input !== null) {
                 if (Array.isArray(input)) {
@@ -719,17 +334,6 @@
             }
         }
 
-        function parseObject(letters, styleClass, object) {
-            if (typeof object !== 'undefined' && object !== null) {
-                Object.keys(object).forEach(function(y) {
-                    var highlightLetters = object[y];
-                    highlightLetters.forEach(function(x) {
-                        letters[y - 1][x - 1].addStyle(styleClass);
-                    });
-                });
-            }
-        }
-
         function parseTimeDefinition(letters, styleClass, definition) {
             if (typeof definition !== 'undefined' && definition !== null) {
                 Object.keys(definition).forEach(function (listString) {
@@ -765,22 +369,449 @@
     }
 
     /**
-     * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
+     * Hilfsklasse zum Rendern der Uhr.
-     * @param value Der Buchstabe, der Dargestellt werden soll.
+     * @param layout     Layout-Objekt, das gerendert werden soll.
-     * @param style Die CSS-Styleklassen des Buchstabens.
+     * @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
      */
-    function Letter(value, style) {
+    function UhrRenderer(layout, renderarea) {
-        var myValue = value;
+        this.render = function render(beforeshow) {
-        var myStyle = style || '';
+            if (layout.parsed === undefined) {
-        this.addStyle = function(style) {
+                switch (layout.version) {
-            if (myStyle === '') {
+                    case 2:
-                myStyle = style;
+                        var delegate = new UhrRendererV2Delegate(layout);
+                        var parsedLayout = delegate.parse();
+                        Object.defineProperty(layout, "parsed", {
+                            "value": parsedLayout,
+                            "writable": false,
+                            "configurable": false
+                        });
+                        break;
+                    default:
+                        console.warn("Unknown layout version: '" + layout.version + "'");
+                        return;
+                }
+            }
+            var letters = layout.parsed;
+            renderarea.fadeOut('fast', function () {
+                renderarea.empty();
+                letters.forEach(function (line, index, array) {
+                    line.forEach(function (letter) {
+                        renderarea.append(letter.toString());
+                    });
+                    if (index < array.length - 1) {
+                        renderarea.append('<br/>');
+                    }
+                });
+                if (typeof beforeshow === 'function') {
+                    beforeshow();
+                }
+                renderarea.fadeIn('fast');
+            });
+        };
+    }
+
+    var setLanguage = function setLanguage(languageKey) {
+        if (languageKey !== this.options.language) {
+            this.options.language = languageKey;
+            var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
+            renderer.render.bind(this)(function () {
+                this.currentMinute = -1;
+                update.bind(this)();
+            }.bind(this));
+            setCookie.bind(this)('uhr-language', languageKey);
+            update.bind(this)();
+        }
+    };
+    var setTheme = function setTheme(theme) {
+        if (theme !== this.options.theme) {
+            this.element.removeClass(this.options.theme).addClass(theme);
+            $('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
+            this.options.theme = theme;
+            setCookie.bind(this)('uhr-theme', theme);
+        }
+    };
+    var setTime = function setTime(time) {
+        this.currentMinute = -1;
+        if (time === null) {
+            this.options.time = new Date();
         } else {
-                myStyle += ' ' + style;
+            if (this.timer !== null) {
+                window.clearInterval(this.timer);
+            }
+            this.options.time = time;
+        }
+        update.bind(this)();
+    };
+    var setMode = function (mode) {
+        this.options.mode = mode;
+        this.currentMinute = -1;
+        update.bind(this)();
+        setCookie.bind(this)('uhr-mode', mode);
+    };
+    var setWidth = function setWidth(width) {
+        var e = this.element;
+        e.css('width', width);
+        var realWidth = e.width();
+        e.width(realWidth);
+        e.height(realWidth);
+        e.css('font-size', (realWidth / 40) + 'px');
+    };
+
+    // private interface methods
+    var setupHTML;
+    var wireFunctionality;
+    var create = function create() {
+        this.id = uhrGlobals.id++;
+        this.timer = null;
+        this.currentMinute = -1;
+        var userTime = this.options.time;
+        var hash, params;
+        if (this.options.time === undefined) {
+            this.options.time = new Date();
+        }
+        // parse the URL params
+        hash = window.location.hash;
+        if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
+            hash = hash.substring(1);
+            hash = decodeURIComponent(hash);
+            params = hash.split('&');
+            params.forEach(function (element) {
+                var pair = element.split('=');
+                var key = pair[0];
+                var value = pair[1];
+                switch (key) {
+                    case 'l':
+                    case 'language':
+                        this.options.language = value;
+                        this.options.force = true;
+                        break;
+                    case 't':
+                    case 'theme':
+                        this.options.theme = value;
+                        this.options.force = true;
+                        break;
+                    case 'm':
+                    case 'mode':
+                        this.options.mode = value;
+                        this.options.force = true;
+                        break;
+                    case 's':
+                    case 'status':
+                        this.options.status = value;
+                        this.options.force = true;
+                        break;
+                }
+            }.bind(this));
+        }
+        // end parse the URL params
+        setupHTML.bind(this)();
+        wireFunctionality.bind(this)();
+        if (userTime !== undefined) {
+            this.time(userTime);
         }
     };
-        this.toString = function() {
+    // private helper methods (not exported)
-            return '<span class="item letter ' + myStyle + '">' + myValue + '</span>';
+    var toggleConfigScreen = function toggleConfigScreen() {
+        $('#uhr-controlpanel' + this.id).toggle('fast');
     };
+    // set up
+    setupHTML = function setupHTML() {
+        var e = this.element;
+        // Base clock area
+        e.addClass('uhr');
+        e.empty();
+        e.append('<span class="item dot dot1"></span>');
+        e.append('<span class="item dot dot2"></span>');
+        e.append('<span class="item dot dot3"></span>');
+        e.append('<span class="item dot dot4"></span>');
+        e.append('<div class="letterarea"></div>');
+        e.append('<div class="reflection"></div>');
+        setWidth.bind(this)(this.options.width);
+
+        if (this.options.controls) {
+            var controlpanel = $('<div class="uhr-controlpanel" id="uhr-controlpanel' + this.id + '"></div>');
+            var content = $('<div class="content"></div>');
+            controlpanel.append(content);
+            // on/off switch
+            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('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
+                '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
+            content.append(toggleSwitch);
+
+            // time mode switch
+            var modeSwitch = $('<div class="onoffswitch" id="uhr-modeswitch' + this.id + '"></div>');
+            modeSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-modeswitch-checkbox' + this.id +
+                '" checked="checked" />');
+            modeSwitch.append('<label class="onoffswitch-label" for="uhr-modeswitch-checkbox' + this.id + '">' +
+                '<div class="modeswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' +
+                '</label>');
+            content.append(modeSwitch);
+            // language chooser
+            if (uhrGlobals.languages.length > 1) {
+                var languageChooser = $('<select id="uhr-languagechooser' + this.id + '"></select>');
+                uhrGlobals.languages.forEach(function (item) {
+                    languageChooser.append('<option value="' + item.code + '">' + item.language + '</option>');
+                });
+                content.append(languageChooser);
             }
+
+            // theme chooser
+            if (uhrGlobals.themes.length > 1) {
+                var themeChooser = $('<select id="uhr-themechooser' + this.id + '"></select>');
+                uhrGlobals.themes.forEach(function (item) {
+                    themeChooser.append('<option value="' + item.styleClass + '">' + item.name + '</option>');
+                });
+                content.append(themeChooser);
+            }
+            var closebutton = $('<a class="uhr-closecontrolpanel" id="uhr-closecontrolpanel' + this.id + '"></a>');
+            closebutton.on('click', function () {
+                $('#uhr-controlpanel' + this.id).hide('fast');
+            }.bind(this));
+            content.append(closebutton);
+            e.after(controlpanel);
+            controlpanel.hide();
+            var configlink = $('<a class="uhr-configlink" id="uhr-configlink' + this.id + '"></a>');
+            configlink.on('click', function () {
+                toggleConfigScreen.bind(this)();
+            }.bind(this));
+            e.after(configlink);
+        }
+    };
+    wireFunctionality = function wireFunctionality() {
+        // on/off switch
+        var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
+        toggleSwitch.on('click', function () {
+            this.toggle();
+        }.bind(this));
+        var status = $.cookie('uhr-status' + this.id);
+        if (status === undefined || this.options.force) {
+            status = this.options.status;
+        }
+        toggleSwitch.prop('checked', status === 'on');
+        if (status === 'on') {
+            this.start();
+        } else {
+            this.stop();
+        }
+
+        // time mode switch
+        var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
+        modeSwitch.on('click', function () {
+            if (this.options.mode === 'seconds') {
+                setMode.bind(this)('normal');
+            } else {
+                setMode.bind(this)('seconds');
+            }
+        }.bind(this));
+
+        var mode = $.cookie('uhr-mode' + this.id);
+        if (mode === undefined || this.options.force) {
+            mode = this.options.mode;
+        }
+        modeSwitch.prop('checked', mode !== 'seconds');
+        if (mode === 'seconds') {
+            setMode.bind(this)('seconds');
+        } else {
+            setMode.bind(this)('normal');
+        }
+
+        // language chooser
+        var languageChooser = $('#uhr-languagechooser' + this.id);
+        languageChooser.on('change', function () {
+            var languageKey = $('#uhr-languagechooser' + this.id).val();
+            this.language(languageKey);
+        }.bind(this));
+        var selectedLanguage = $.cookie('uhr-language' + this.id);
+        if (selectedLanguage === undefined || this.options.force) {
+            selectedLanguage = this.options.language;
+        }
+        var found = uhrGlobals.languages.some(function (item) {
+            return selectedLanguage === item.code;
+        });
+        if (!found) {
+            var fallbackLanguage;
+            if (uhrGlobals.languages.length > 0) {
+                fallbackLanguage = uhrGlobals.languages[0].code;
+            } else {
+                fallbackLanguage = '';
+            }
+            console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
+            selectedLanguage = fallbackLanguage;
+        }
+        languageChooser.val(selectedLanguage);
+        this.options.language = "";
+        this.language(selectedLanguage);
+
+        // theme chooser
+        var themeChooser = $('#uhr-themechooser' + this.id);
+        themeChooser.on('change', function () {
+            var themeKey = $('#uhr-themechooser' + this.id).val();
+            this.theme(themeKey);
+        }.bind(this));
+        var selectedTheme = $.cookie('uhr-theme' + this.id);
+        if (selectedTheme === undefined || this.options.force) {
+            selectedTheme = this.options.theme;
+        }
+        found = uhrGlobals.themes.some(function (item) {
+            return selectedTheme === item.styleClass;
+        });
+        if (!found) {
+            var fallbackTheme = uhrGlobals.themes[0].styleClass;
+            console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
+            selectedTheme = fallbackTheme;
+        }
+        themeChooser.val(selectedTheme);
+        this.options.theme = "";
+        this.theme(selectedTheme);
+        if (this.options.autoresize) {
+            $(window).on('resize', function () {
+                var $e = this.element;
+                var $parent = $e.parent();
+                var $window = $(window);
+                var parentWidth = $parent.width();
+                var parentHeight = $parent.height();
+                var windowWidth = $window.width();
+                var windowHeight = $window.height();
+                var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
+                setWidth.bind(this)(size);
+            }.bind(this));
+        }
+    };
+    var destroy = function destroy() {
+        this.timer = null;
+        $(this.element)
+            .removeAttr('style')
+            .removeAttr('class')
+            .empty();
+        $('#uhr-configlink' + this.id).remove();
+        $('#uhr-controlpanel' + this.id).remove();
+
+    };
+    setCookie = function setCookie(cookieName, cookieValue) {
+        var options = {};
+        if (this.options.cookiePath !== undefined) {
+            options = {expires: 365, path: this.options.cookiePath};
+        } else {
+            options = {expires: 365};
+        }
+        $.cookie(cookieName + this.id, cookieValue, options);
+    };
+
+    // business logic
+    isOn = function isOn() {
+        return this.timer !== null;
+    };
+    var show;
+    var clear;
+    update = function update() {
+        if (isOn.bind(this)()) {
+            var time = this.options.time;
+            if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
+                if (time.getMinutes() === this.currentMinute) {
+                    return;
+                }
+                this.currentMinute = time.getMinutes();
+            }
+            show.bind(this)(time);
+        } else {
+            clear.bind(this)();
+            this.currentMinute = -1;
+        }
+    };
+    var highlight;
+    var getSecond;
+    var getDotMinute;
+    var getCoarseMinute;
+    var getHour;
+    show = function show(time) {
+        var second = getSecond.bind(this)(time);
+        var dotMinute = getDotMinute.bind(this)(time);
+        var hour = getHour.bind(this)(time);
+        var coarseMinute = getCoarseMinute.bind(this)(time);
+        clear.bind(this)();
+        if (this.options.mode === 'seconds') {
+            highlight.bind(this)('second' + second);
+        } else {
+            highlight.bind(this)('on');
+            for (var i = 1; i <= dotMinute; i++) {
+                highlight.bind(this)('dot' + i);
+            }
+            highlight.bind(this)('minute' + coarseMinute);
+            highlight.bind(this)('hour' + hour);
+        }
+    };
+    highlight = function highlight(itemClass) {
+        this.element.find('.item.' + itemClass).addClass('active');
+    };
+    clear = function clear() {
+        this.element.find('.item').removeClass('active');
+    };
+    getSecond = function getSecond(date) {
+        if (typeof language.bind(this)().getSeconds === 'function') {
+            return language.bind(this)().getSeconds(date);
+        }
+        return date.getSeconds();
+    };
+    getDotMinute = function getDotMinute(date) {
+        if (typeof language.bind(this)().getDotMinute === 'function') {
+            return language.bind(this)().getDotMinute(date);
+        }
+        var minutes = date.getMinutes();
+        return minutes % 5;
+    };
+    getCoarseMinute = function getCoarseMinute(date) {
+        if (typeof language.bind(this)().getCoarseMinute === 'function') {
+            return language.bind(this)().getCoarseMinute(date);
+        }
+        return date.getMinutes();
+    };
+    getHour = function getHour(date) {
+        if (typeof language.bind(this)().getHour === 'function') {
+            return language.bind(this)().getHour(date);
+        }
+        var hour = date.getHours();
+        if (date.getMinutes() >= 25) {
+            return (hour + 1) % 24;
+        }
+        return hour;
+    };
+    language = function language() {
+        var matchingLanguages = uhrGlobals.languages.filter(function (element) {
+            return (element.code === this.options.language);
+        }, this);
+        if (matchingLanguages.length > 0) {
+            return matchingLanguages[0];
+        }
+        // fallback: return empty object
+        return {};
+    };
+
+    $.widget("fritteli.uhr", {
+        "options": {
+            width: '100%',
+            status: 'on',
+            language: 'de_CH',
+            theme: uhrGlobals.themes[0].styleClass,
+            force: false,
+            controls: true,
+            cookiePath: undefined,
+            autoresize: true,
+            mode: 'normal'
+        },
+        "start": start,
+        "stop": stop,
+        "toggle": toggle,
+        "language": setLanguage,
+        "theme": setTheme,
+        "time": setTime,
+        "mode": setMode,
+        "width": setWidth,
+        // constructor method
+        "_create": create,
+        // destructor method
+        "_destroy": destroy
+    });
+    $.fritteli.uhr.register = uhrGlobals.registerLanguage;
 })(jQuery);

dist/uhr-black.min.css

@@ -1 +1 @@
-.black .onoffswitch-inner:before,.uhr.black{background-color:#111}.uhr.black .dot:not(.active){border-color:rgba(255,255,255,.1);box-shadow:0 0 .1em rgba(255,255,255,.1)}.uhr.black .letter:not(.active){color:rgba(255,255,255,.1);text-shadow:0 0 .1em rgba(255,255,255,.1)}
+.black .onoffswitch-inner:before,.uhr.black{background-color:#111}.uhr.black .dot:not(.active){border-color:hsla(0,0%,100%,.1);box-shadow:0 0 .1em hsla(0,0%,100%,.1)}.uhr.black .letter:not(.active){color:hsla(0,0%,100%,.1);text-shadow:0 0 .1em hsla(0,0%,100%,.1)}

dist/uhr-blue.min.css

@@ -1 +1 @@
-.blue .onoffswitch-inner:before,.uhr.blue{background-color:#00a}.uhr.blue .dot:not(.active){border-color:rgba(255,255,255,.1);box-shadow:0 0 .1em rgba(255,255,255,.1)}.uhr.blue .letter:not(.active){color:rgba(255,255,255,.1);text-shadow:0 0 .1em rgba(255,255,255,.1)}
+.blue .onoffswitch-inner:before,.uhr.blue{background-color:#00a}.uhr.blue .dot:not(.active){border-color:hsla(0,0%,100%,.1);box-shadow:0 0 .1em hsla(0,0%,100%,.1)}.uhr.blue .letter:not(.active){color:hsla(0,0%,100%,.1);text-shadow:0 0 .1em hsla(0,0%,100%,.1)}

dist/uhr-pink.min.css

@@ -1 +1 @@
-.uhr.pink{background-color:#f0a}.uhr.pink .dot.active{border-color:#fff;box-shadow:0 0 .1em #fff}.uhr.pink .letter.active{color:#fff;text-shadow:0 0 .1em #fff}.pink .onoffswitch-inner:before{background-color:#f0a}.uhr.pink .dot:not(.active){border-color:rgba(255,255,255,.1);box-shadow:0 0 .1em rgba(255,255,255,.1)}.uhr.pink .letter:not(.active){color:rgba(255,255,255,.1);text-shadow:0 0 .1em rgba(255,255,255,.1)}
+.uhr.pink{background-color:#f0a}.uhr.pink .dot.active{border-color:#fff;box-shadow:0 0 .1em #fff}.uhr.pink .letter.active{color:#fff;text-shadow:0 0 .1em #fff}.pink .onoffswitch-inner:before{background-color:#f0a}.uhr.pink .dot:not(.active){border-color:hsla(0,0%,100%,.1);box-shadow:0 0 .1em hsla(0,0%,100%,.1)}.uhr.pink .letter:not(.active){color:hsla(0,0%,100%,.1);text-shadow:0 0 .1em hsla(0,0%,100%,.1)}

dist/uhr-red.min.css

@@ -1 +1 @@
-.red .onoffswitch-inner:before,.uhr.red{background-color:#700}.uhr.red .dot:not(.active){border-color:rgba(255,255,255,.1);box-shadow:0 0 .1em rgba(255,255,255,.1)}.uhr.red .letter:not(.active){color:rgba(255,255,255,.1);text-shadow:0 0 .1em rgba(255,255,255,.1)}
+.red .onoffswitch-inner:before,.uhr.red{background-color:#700}.uhr.red .dot:not(.active){border-color:hsla(0,0%,100%,.1);box-shadow:0 0 .1em hsla(0,0%,100%,.1)}.uhr.red .letter:not(.active){color:hsla(0,0%,100%,.1);text-shadow:0 0 .1em hsla(0,0%,100%,.1)}

dist/uhr.min.css

@@ -1 +1 @@
-@font-face{font-family:Uhrenfont;src:url(../resources/uhr.woff) format('woff')}body{font-family:Uhrenfont,sans-serif}.uhr{position:relative;margin:0;transition:background-color .5s}.uhr .reflection{position:absolute;top:0;bottom:0;left:0;right:0;background:radial-gradient(225em 45em at 160% 0,rgba(255,255,255,.4) 0,rgba(255,255,255,.05) 40%,rgba(255,255,255,0) 40%) no-repeat;display:block;margin:.15em}.uhr .letterarea{display:block;position:absolute;top:12%;bottom:12%;left:12%;right:12%;overflow:hidden;font-size:200%}.item{transition:box-shadow .5s,text-shadow .5s,border-color .5s,color .5s}.dot{position:absolute;display:block;height:0;width:0;border:.2em solid;border-radius:1em}.dot.active{border-color:#eee;box-shadow:0 0 .2em #eee}.dot1{top:3.75%;left:3.75%}.dot2{top:3.75%;right:3.75%}.dot3{bottom:3.75%;right:3.75%}.dot4{bottom:3.75%;left:3.75%}.letter{height:10%;width:9.0909%;padding:0;margin:0;display:inline-block;text-align:center;line-height:160%}.letter.active{color:#eee;text-shadow:0 0 .2em #eee}.onoffswitch{position:relative;width:86px;margin:1em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.onoffswitch-checkbox{display:none}.onoffswitch-label{display:block;overflow:hidden;cursor:pointer;border:2px solid #999;border-radius:50px}.modeswitch-inner,.onoffswitch-inner{width:200%;margin-left:-100%;-moz-transition:margin .3s ease-in 0s;-webkit-transition:margin .3s ease-in 0s;-o-transition:margin .3s ease-in 0s;transition:margin .3s ease-in 0s}.modeswitch-inner:after,.modeswitch-inner:before,.onoffswitch-inner:after,.onoffswitch-inner:before{float:left;width:50%;height:24px;padding:0;line-height:24px;font-size:18px;font-weight:700;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.onoffswitch-inner:before{content:"EIN";padding-left:12px;color:#eee;transition:background-color .5s}.onoffswitch-inner:after{content:"AUS";padding-right:12px;background-color:#eee;color:#999;text-align:right}.onoffswitch-switch{width:30px;margin:-3px;background:#fff;border:2px solid #999;border-radius:50px;position:absolute;top:0;bottom:0;right:58px;-moz-transition:all .3s ease-in 0s;-webkit-transition:all .3s ease-in 0s;-o-transition:all .3s ease-in 0s;transition:all .3s ease-in 0s}.onoffswitch-checkbox:checked+.onoffswitch-label .modeswitch-inner,.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner{margin-left:0}.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch{right:0}.modeswitch-inner:before{content:"MIN";padding-left:12px;background-color:#fff;color:#000}.modeswitch-inner:after{content:"SEC";padding-right:12px;background-color:#fff;color:#000;text-align:right}a.uhr-configlink{cursor:pointer;background:url(../resources/settings.png) no-repeat;width:24px;height:24px;display:inline-block;margin:2px;vertical-align:top}.uhr-controlpanel{border-radius:.5em;box-shadow:0 0 1em #000;background-color:#fff;display:inline-block;padding:.5em;position:sticky;bottom:0;margin-left:1em}.uhr-controlpanel .content{position:relative}a.uhr-closecontrolpanel{cursor:pointer;display:inline-block;position:absolute;right:0;top:-1em;width:24px;height:24px;background:url(../resources/close.png) no-repeat}#disclaimer{font-size:.5em}#disclaimer a{color:#444;text-decoration:underline}
+@font-face{font-family:Uhrenfont;src:url(../resources/uhr.woff) format("woff")}body{font-family:Uhrenfont,sans-serif}.uhr{position:relative;margin:0;transition:background-color .5s}.uhr .reflection{position:absolute;top:0;bottom:0;left:0;right:0;background:radial-gradient(225em 45em at 160% 0,hsla(0,0%,100%,.4) 0,hsla(0,0%,100%,.05) 40%,hsla(0,0%,100%,0) 0) no-repeat scroll;display:block;margin:.15em}.uhr .letterarea{display:block;position:absolute;top:12%;bottom:12%;left:12%;right:12%;overflow:hidden;font-size:200%}.item{transition:box-shadow .5s,text-shadow .5s,border-color .5s,color .5s}.dot{position:absolute;display:block;height:0;width:0;border:.2em solid;border-radius:1em}.dot.active{border-color:#eee;box-shadow:0 0 .2em #eee}.dot1{top:3.75%;left:3.75%}.dot2{top:3.75%;right:3.75%}.dot3{right:3.75%}.dot3,.dot4{bottom:3.75%}.dot4{left:3.75%}.letter{height:10%;width:9.0909%;padding:0;margin:0;display:inline-block;text-align:center;line-height:160%}.letter.active{color:#eee;text-shadow:0 0 .2em #eee}.onoffswitch{position:relative;width:86px;margin:1em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.onoffswitch-checkbox{display:none}.onoffswitch-label{display:block;overflow:hidden;cursor:pointer;border:2px solid #999;border-radius:50px}.modeswitch-inner,.onoffswitch-inner{width:200%;margin-left:-100%;-moz-transition:margin .3s ease-in 0s;-webkit-transition:margin .3s ease-in 0s;-o-transition:margin .3s ease-in 0s;transition:margin .3s ease-in 0s}.modeswitch-inner:after,.modeswitch-inner:before,.onoffswitch-inner:after,.onoffswitch-inner:before{float:left;width:50%;height:24px;padding:0;line-height:24px;font-size:18px;color:#fff;font-weight:700;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.onoffswitch-inner:before{content:"EIN";padding-left:12px;color:#eee;transition:background-color .5s}.onoffswitch-inner:after{content:"AUS";padding-right:12px;background-color:#eee;color:#999;text-align:right}.onoffswitch-switch{width:30px;margin:-3px;background:#fff;border:2px solid #999;border-radius:50px;position:absolute;top:0;bottom:0;right:58px;-moz-transition:all .3s ease-in 0s;-webkit-transition:all .3s ease-in 0s;-o-transition:all .3s ease-in 0s;transition:all .3s ease-in 0s}.onoffswitch-checkbox:checked+.onoffswitch-label .modeswitch-inner,.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner{margin-left:0}.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch{right:0}.modeswitch-inner:before{content:"MIN";padding-left:12px;background-color:#fff;color:#000}.modeswitch-inner:after{content:"SEC";padding-right:12px;background-color:#fff;color:#000;text-align:right}a.uhr-configlink{cursor:pointer;background:url(../resources/settings.png) no-repeat;width:24px;height:24px;display:inline-block;margin:2px;vertical-align:top}.uhr-controlpanel{border-radius:.5em;box-shadow:0 0 1em #000;background-color:#fff;display:inline-block;padding:.5em;position:sticky;bottom:0;margin-left:1em}.uhr-controlpanel .content{position:relative}a.uhr-closecontrolpanel{cursor:pointer;display:inline-block;position:absolute;right:0;top:-1em;width:24px;height:24px;background:url(../resources/close.png) no-repeat}#disclaimer{font-size:.5em}#disclaimer a{color:#444;text-decoration:underline}

info/index.html

@@ -171,6 +171,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
             <li>fr</li>
             <li>it</li>
             <li>nl</li>
+            <li>pt</li>
         </ul>
         <br/>Typ: String
         <br/>Default: <code>'de_CH'</code></dd>
@@ -246,6 +247,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
             <li>fr</li>
             <li>it</li>
             <li>nl</li>
+            <li>pt</li>
         </ul>
     </dd>
     <dt><code>t</code> oder <code>theme</code></dt>

manifest.appcache

@@ -1,5 +1,5 @@
 CACHE MANIFEST
-# Version 8.0.1-dev.0
+# Version 9.0.0-dev.0
 
 /
 dist/jquery.uhr.base.min.js

package.json

@@ -1,11 +1,30 @@
 {
     "name": "uhr",
-  "version": "8.0.1-dev.0",
+    "version": "9.0.0-dev.0",
     "description": "jQuery QLOCKTWO plugin",
     "keywords": [
         "jquery-plugin",
         "qlocktwo"
     ],
+    "scripts": {
+        "prebuild": "npm run clean",
+        "build": "npm-run-all --parallel rollup:js:* rollup:css:*",
+        "clean": "rimraf dist",
+        "rollup:js:app": "rollup --config build-config/rollup.config.js-app.js",
+        "rollup:js:base": "rollup --config build-config/rollup.config.js-base.js",
+        "rollup:js:baselangs": "rollup --config build-config/rollup.config.js-baselangs.js",
+        "rollup:js:complete": "rollup --config build-config/rollup.config.js-complete.js",
+        "rollup:js:langs": "rollup --config build-config/rollup.config.js-langs.js",
+        "rollup:js:libs": "rollup --config build-config/rollup.config.js-libs.js",
+        "rollup:css:app": "rollup --config build-config/rollup.config.css-app.js",
+        "rollup:css:black": "rollup --config build-config/rollup.config.css-black.js",
+        "rollup:css:blue": "rollup --config build-config/rollup.config.css-blue.js",
+        "rollup:css:green": "rollup --config build-config/rollup.config.css-green.js",
+        "rollup:css:pink": "rollup --config build-config/rollup.config.css-pink.js",
+        "rollup:css:red": "rollup --config build-config/rollup.config.css-red.js",
+        "rollup:css:white": "rollup --config build-config/rollup.config.css-white.js",
+        "rollup:css:yellow": "rollup --config build-config/rollup.config.css-yellow.js"
+    },
     "homepage": "http://bärneruhr.ch/",
     "author": {
         "name": "Manuel Friedli",
@@ -18,26 +37,27 @@
     },
     "licenses": [
         {
-      "type": "GPLv3"
+            "type": "GPL-3.0"
         }
     ],
+    "license": "GPL-3.0",
+    "dependencies": {
+        "jquery": "^3.5.0",
+        "jquery-ui": "1.12.1",
+        "jquery.cookie": "1.4.1"
+    },
     "devDependencies": {
-    "bower": "^1.3.12",
+        "@rollup/plugin-node-resolve": "^11.2.0",
-    "grunt": "~0.4.5",
+        "chai": "4.2.0",
-    "grunt-cli": "^0.1.13",
+        "cssnano": "^4.1.10",
-    "grunt-contrib-clean": "~0.5.0",
+        "jshint-stylish": "2.2.1",
-    "grunt-contrib-concat": "~0.4.0",
+        "mocha": "^8.3.0",
-    "grunt-contrib-connect": "~0.8.0",
+        "npm-run-all": "^4.1.5",
-    "grunt-contrib-cssmin": "^0.11.0",
+        "phantomjs-prebuilt": "2.1.16",
-    "grunt-contrib-jshint": "~0.10.0",
+        "postcss": "^8.2.6",
-    "grunt-contrib-qunit": "~0.5.1",
+        "rimraf": "^3.0.2",
-    "grunt-contrib-uglify": "~0.5.0",
+        "rollup": "^2.39.1",
-    "grunt-contrib-watch": "~0.6.1",
+        "rollup-plugin-css-bundle": "^1.0.4",
-    "grunt-mocha-phantomjs": "^0.6.0",
+        "rollup-plugin-terser": "^7.0.2"
-    "grunt-version": "^0.3.0",
-    "jshint-stylish": "~0.2.0",
-    "load-grunt-tasks": "~0.6.0",
-    "phantomjs": "^1.9.13",
-    "time-grunt": "~0.3.2"
     }
 }

src/uhr-dk.js

@@ -1,7 +1,3 @@
-/*
- * Copyright (C) Schweizerische Bundesbahnen SBB, 2014.
- */
-
 /*
  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

src/uhr-pt.js

@@ -0,0 +1,79 @@
+/*
+ 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/>.
+ */
+(function ($) {
+    'use strict';
+    var e_ = {1: [1]};
+    var sao = {1: [2, 3, 4]};
+    var e1 = {7: [8]};
+    var e2 = {10: [5]};
+    var menos = {7: [7, 8, 9, 10, 11]};
+    var meia = {8: [8, 9, 10, 11]};
+    var cinco = {10: [7, 8, 9, 10, 11]};
+    var dez = {10: [1, 2, 3]};
+    var um_quarto = {9: [1, 2, 4, 5, 6, 7, 8, 9]};
+    var vinte = {8: [1, 2, 3, 4, 5]};
+    var layout = {
+        "version": 2,
+        "language": 'Português',
+        "letters": [
+            'ÉSÃOUMATRÊS',
+            'MEIOLDIADEZ',
+            'DUASEISETEY',
+            'QUATROHNOVE',
+            'CINCOITONZE',
+            'ZMEIALNOITE',
+            'HORASYMENOS',
+            'VINTECAMEIA',
+            'UMVQUARTOPM',
+            'DEZOEYCINCO'
+        ],
+        "minutes": {
+            "5,6,7,8,9": [e1, cinco],
+            "10,11,12,13,14": [e1, dez],
+            "15,16,17,18,19": [e1, um_quarto],
+            "20,21,22,23,24": [e1, vinte],
+            "25,26,27,28,29": [e1, vinte, e2, cinco],
+            "30,31,32,33,34": [e1, meia],
+            "35,36,37,38,39": [menos, vinte, e2, cinco],
+            "40,41,42,43,44": [menos, vinte],
+            "45,46,47,48,49": [menos, um_quarto],
+            "50,51,52,53,54": [menos, dez],
+            "55,56,57,58,59": [menos, cinco]
+        },
+        "hours": {
+            "0": [e_, {"6": [2, 3, 4, 5, 7, 8, 9, 10, 11]}],
+            "12": [e_, {"2": [1, 2, 3, 4, 6, 7, 8]}],
+            "1,13": [e_, {"1": [5, 6, 7]}],
+            "2,14": [sao, {"3": [1, 2, 3, 4]}],
+            "3,15": [sao, {"1": [8, 9, 10, 11]}],
+            "4,16": [sao, {"4": [1, 2, 3, 4, 5, 6]}],
+            "5,17": [sao, {"5": [1, 2, 3, 4, 5]}],
+            "6,18": [sao, {"3": [4, 5, 6, 7]}],
+            "7,19": [sao, {"3": [7, 8, 9, 10]}],
+            "8,20": [sao, {"5": [5, 6, 7, 8]}],
+            "9,21": [sao, {"4": [8, 9, 10, 11]}],
+            "10,22": [sao, {"2": [9, 10, 11]}],
+            "11,23": [sao, {"5": [8, 9, 10, 11]}]
+        },
+        "getHour": function (date) {
+            var hour = date.getHours();
+            if (date.getMinutes() >= 35) {
+                return (hour + 1) % 24;
+            }
+            return hour;
+        }
+    };
+    $.fritteli.uhr.register('pt', layout);
+}(jQuery));

src/uhr.js

@@ -52,6 +52,9 @@
     }
 
     // public interface methods (exported later)
+    var setCookie;
+    var isOn;
+    var update;
     var start = function start() {
         if (!isOn.bind(this)()) {
             this.timer = window.setInterval(function () {
@@ -77,436 +80,25 @@
             this.start();
         }
     };
-    var setLanguage = function setLanguage(languageKey) {
+    var language;
-        if (languageKey !== this.options.language) {
-            this.options.language = languageKey;
-            var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
-            renderer.render.bind(this)(function() {
-                this.currentMinute = -1;
-                update.bind(this)();
-            }.bind(this));
-            setCookie.bind(this)('uhr-language', languageKey);
-            update.bind(this)();
-        }
-    };
-    var setTheme = function setTheme(theme) {
-        if (theme !== this.options.theme) {
-            this.element.removeClass(this.options.theme).addClass(theme);
-            $('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
-            this.options.theme = theme;
-            setCookie.bind(this)('uhr-theme', theme);
-        }
-    };
-    var setTime = function setTime(time) {
-        this.currentMinute = -1;
-        if (time === null) {
-            this.options.time = new Date();
-        } else {
-            if (this.timer !== null) {
-                window.clearInterval(this.timer);
-            }
-            this.options.time = time;
-        }
-        update.bind(this)();
-    };
-    var setMode = function(mode) {
-        this.options.mode = mode;
-        this.currentMinute = -1;
-        update.bind(this)();
-        setCookie.bind(this)('uhr-mode', mode);
-    };
-    var setWidth = function setWidth(width) {
-        var e = this.element;
-        e.css('width', width);
-        var realWidth = e.width();
-        e.width(realWidth);
-        e.height(realWidth);
-        e.css('font-size', (realWidth / 40) + 'px');
-    };
 
-    // private interface methods
-    var create = function create() {
-        this.id = uhrGlobals.id++;
-        this.timer = null;
-        this.currentMinute = -1;
-        var userTime = this.options.time;
-        var hash, params;
-        if (this.options.time === undefined) {
-            this.options.time = new Date();
-        }
-        // parse the URL params
-        hash = window.location.hash;
-        if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
-            hash = hash.substring(1);
-            hash = decodeURIComponent(hash);
-            params = hash.split('&');
-            params.forEach(function (element) {
-                var pair = element.split('=');
-                var key = pair[0];
-                var value = pair[1];
-                switch (key) {
-                    case 'l':
-                    case 'language':
-                        this.options.language = value;
-                        this.options.force = true;
-                        break;
-                    case 't':
-                    case 'theme':
-                        this.options.theme = value;
-                        this.options.force = true;
-                        break;
-                    case 'm':
-                    case 'mode':
-                        this.options.mode = value;
-                        this.options.force = true;
-                        break;
-                    case 's':
-                    case 'status':
-                        this.options.status = value;
-                        this.options.force = true;
-                        break;
-                }
-            }.bind(this));
-        }
-        // end parse the URL params
-        setupHTML.bind(this)();
-        wireFunctionality.bind(this)();
-        if (userTime !== undefined) {
-            this.time(userTime);
-        }
-    };
-    // private helper methods (not exported)
-    var toggleConfigScreen = function toggleConfigScreen() {
-        $('#uhr-controlpanel' + this.id).toggle('fast');
-    };
-    // set up
-    var setupHTML = function setupHTML() {
-        var e = this.element;
-        // Base clock area
-        e.addClass('uhr');
-        e.empty();
-        e.append('<span class="item dot dot1"></span>');
-        e.append('<span class="item dot dot2"></span>');
-        e.append('<span class="item dot dot3"></span>');
-        e.append('<span class="item dot dot4"></span>');
-        e.append('<div class="letterarea"></div>');
-        e.append('<div class="reflection"></div>');
-        setWidth.bind(this)(this.options.width);
-
-        if (this.options.controls) {
-            var controlpanel = $('<div class="uhr-controlpanel" id="uhr-controlpanel' + this.id + '"></div>');
-            var content = $('<div class="content"></div>');
-            controlpanel.append(content);
-            // on/off switch
-            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('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
-                                '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
-            content.append(toggleSwitch);
-
-            // time mode switch
-            var modeSwitch = $('<div class="onoffswitch" id="uhr-modeswitch' + this.id + '"></div>');
-            modeSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-modeswitch-checkbox' + this.id +
-                                '" checked="checked" />');
-            modeSwitch.append('<label class="onoffswitch-label" for="uhr-modeswitch-checkbox' + this.id + '">' +
-                                '<div class="modeswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' +
-                                '</label>');
-            content.append(modeSwitch);
-            // language chooser
-            if (uhrGlobals.languages.length > 1) {
-                var languageChooser = $('<select id="uhr-languagechooser' + this.id + '"></select>');
-                uhrGlobals.languages.forEach(function(item) {
-                    languageChooser.append('<option value="' + item.code + '">' + item.language + '</option>');
-                });
-                content.append(languageChooser);
-            }
-
-            // theme chooser
-            if (uhrGlobals.themes.length > 1) {
-                var themeChooser = $('<select id="uhr-themechooser' + this.id + '"></select>');
-                uhrGlobals.themes.forEach(function(item) {
-                    themeChooser.append('<option value="' + item.styleClass + '">' + item.name + '</option>');
-                });
-                content.append(themeChooser);
-            }
-            var closebutton = $('<a class="uhr-closecontrolpanel" id="uhr-closecontrolpanel' + this.id + '"></a>');
-            closebutton.on('click', function() {
-                $('#uhr-controlpanel' + this.id).hide('fast');
-            }.bind(this));
-            content.append(closebutton);
-            e.after(controlpanel);
-            controlpanel.hide();
-            var configlink = $('<a class="uhr-configlink" id="uhr-configlink' + this.id + '"></a>');
-            configlink.on('click', function() {
-                toggleConfigScreen.bind(this)();
-            }.bind(this));
-            e.after(configlink);
-        }
-    };
-    var wireFunctionality = function wireFunctionality() {
-        // on/off switch
-        var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
-        toggleSwitch.on('click', function() {
-            this.toggle();
-        }.bind(this));
-        var status = $.cookie('uhr-status' + this.id);
-        if (status === undefined || this.options.force) {
-            status = this.options.status;
-        }
-        toggleSwitch.prop('checked', status === 'on');
-        if (status === 'on') {
-            this.start();
-        } else {
-            this.stop();
-        }
-
-        // time mode switch
-        var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
-        modeSwitch.on('click', function() {
-            if (this.options.mode === 'seconds') {
-                setMode.bind(this)('normal');
-            } else {
-                setMode.bind(this)('seconds');
-            }
-        }.bind(this));
-
-        var mode = $.cookie('uhr-mode' + this.id);
-        if (mode === undefined || this.options.force) {
-            mode = this.options.mode;
-        }
-        modeSwitch.prop('checked', mode !== 'seconds');
-        if (mode === 'seconds') {
-            setMode.bind(this)('seconds');
-        } else {
-            setMode.bind(this)('normal');
-        }
-
-        // language chooser
-        var languageChooser = $('#uhr-languagechooser' + this.id);
-        languageChooser.on('change', function() {
-            var languageKey = $('#uhr-languagechooser' + this.id).val();
-            this.language(languageKey);
-        }.bind(this));
-        var selectedLanguage = $.cookie('uhr-language' + this.id);
-        if (selectedLanguage === undefined || this.options.force) {
-            selectedLanguage = this.options.language;
-        }
-        var found = uhrGlobals.languages.some(function(item) {
-            return selectedLanguage === item.code;
-        });
-        if (!found) {
-            var fallbackLanguage;
-            if (uhrGlobals.languages.length > 0) {
-                fallbackLanguage = uhrGlobals.languages[0].code;
-            } else {
-                fallbackLanguage = '';
-            }
-            console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
-            selectedLanguage = fallbackLanguage;
-        }
-        languageChooser.val(selectedLanguage);
-        this.options.language = "";
-        this.language(selectedLanguage);
-
-        // theme chooser
-        var themeChooser = $('#uhr-themechooser' + this.id);
-        themeChooser.on('change', function() {
-            var themeKey = $('#uhr-themechooser' + this.id).val();
-            this.theme(themeKey);
-        }.bind(this));
-        var selectedTheme = $.cookie('uhr-theme' + this.id);
-        if (selectedTheme === undefined || this.options.force) {
-            selectedTheme = this.options.theme;
-        }
-        found = uhrGlobals.themes.some(function(item) {
-            return selectedTheme === item.styleClass;
-        });
-        if (!found) {
-            var fallbackTheme = uhrGlobals.themes[0].styleClass;
-            console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
-            selectedTheme = fallbackTheme;
-        }
-        themeChooser.val(selectedTheme);
-        this.options.theme = "";
-        this.theme(selectedTheme);
-        if (this.options.autoresize) {
-            $(window).on('resize', function() {
-                var $e = this.element;
-                var $parent = $e.parent();
-                var $window = $(window);
-                var parentWidth = $parent.width();
-                var parentHeight = $parent.height();
-                var windowWidth = $window.width();
-                var windowHeight = $window.height();
-                var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
-                setWidth.bind(this)(size);
-            }.bind(this));
-        }
-    };
-    var destroy = function destroy() {
-        this.timer = null;
-        $(this.element)
-            .removeAttr('style')
-            .removeAttr('class')
-            .empty();
-        $('#uhr-configlink' + this.id).remove();
-        $('#uhr-controlpanel' + this.id).remove();
-
-    };
-    var setCookie = function setCookie(cookieName, cookieValue) {
-        var options = {};
-        if (this.options.cookiePath !== undefined) {
-            options = {expires: 365, path: this.options.cookiePath};
-        } else {
-            options = {expires: 365};
-        }
-        $.cookie(cookieName + this.id, cookieValue, options);
-    };
-
-    // business logic
-    var isOn = function isOn() {
-        return this.timer !== null;
-    };
-    var update = function update() {
-        if (isOn.bind(this)()) {
-            var time = this.options.time;
-            if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
-                if (time.getMinutes() === this.currentMinute) {
-                    return;
-                }
-                this.currentMinute = time.getMinutes();
-            }
-            show.bind(this)(time);
-        } else {
-            clear.bind(this)();
-            this.currentMinute = -1;
-        }
-    };
-    var show = function show(time) {
-        var second = getSecond.bind(this)(time);
-        var dotMinute = getDotMinute.bind(this)(time);
-        var hour = getHour.bind(this)(time);
-        var coarseMinute = getCoarseMinute.bind(this)(time);
-        clear.bind(this)();
-        if (this.options.mode === 'seconds') {
-            highlight.bind(this)('second' + second);
-        } else {
-            highlight.bind(this)('on');
-            for (var i = 1; i <= dotMinute; i++) {
-                highlight.bind(this)('dot' + i);
-            }
-            highlight.bind(this)('minute' + coarseMinute);
-            highlight.bind(this)('hour' + hour);
-        }
-    };
-    var highlight = function highlight(itemClass) {
-        this.element.find('.item.' + itemClass).addClass('active');
-    };
-    var clear = function clear() {
-        this.element.find('.item').removeClass('active');
-    };
-    var getSecond = function getSecond(date) {
-        if (typeof language.bind(this)().getSeconds === 'function') {
-            return language.bind(this)().getSeconds(date);
-        }
-        return date.getSeconds();
-    };
-    var getDotMinute = function getDotMinute(date) {
-        if (typeof language.bind(this)().getDotMinute === 'function') {
-            return language.bind(this)().getDotMinute(date);
-        }
-        var minutes = date.getMinutes();
-        return minutes % 5;
-    };
-    var getCoarseMinute = function getCoarseMinute(date) {
-        if (typeof language.bind(this)().getCoarseMinute === 'function') {
-            return language.bind(this)().getCoarseMinute(date);
-        }
-        return date.getMinutes();
-    };
-    var getHour = function getHour(date) {
-        if (typeof language.bind(this)().getHour === 'function') {
-            return language.bind(this)().getHour(date);
-        }
-        var hour = date.getHours();
-        if (date.getMinutes() >= 25) {
-            return (hour + 1) % 24;
-        }
-        return hour;
-    };
-    var language = function language() {
-        var matchingLanguages = uhrGlobals.languages.filter(function(element) {
-            return (element.code === this.options.language);
-        }, this);
-        if (matchingLanguages.length > 0) {
-            return matchingLanguages[0];
-        }
-        // fallback: return empty object
-        return {};
-    };
-
-    $.widget("fritteli.uhr", {
-        "options": {
-            width: '100%',
-            status: 'on',
-            language: 'de_CH',
-            theme: uhrGlobals.themes[0].styleClass,
-            force: false,
-            controls: true,
-            cookiePath: undefined,
-            autoresize: true,
-            mode: 'normal'
-        },
-        "start": start,
-        "stop": stop,
-        "toggle": toggle,
-        "language": setLanguage,
-        "theme": setTheme,
-        "time": setTime,
-        "mode": setMode,
-        "width": setWidth,
-        // constructor method
-        "_create": create,
-        // destructor method
-        "_destroy": destroy
-    });
-    $.fritteli.uhr.register = uhrGlobals.registerLanguage;
     /**
-     * Hilfsklasse zum Rendern der Uhr.
+     * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
-     * @param layout     Layout-Objekt, das gerendert werden soll.
+     * @param value Der Buchstabe, der Dargestellt werden soll.
-     * @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
+     * @param style Die CSS-Styleklassen des Buchstabens.
      */
-    function UhrRenderer(layout, renderarea) {
+    function Letter(value, style) {
-        this.render = function render(beforeshow) {
+        var myValue = value;
-            if (layout.parsed === undefined) {
+        var myStyle = style || '';
-                switch (layout.version) {
+        this.addStyle = function (style) {
-                case 2:
+            if (myStyle === '') {
-                    var delegate = new UhrRendererV2Delegate(layout);
+                myStyle = style;
-                    var parsedLayout = delegate.parse();
+            } else {
-                    Object.defineProperty(layout, "parsed", {"value": parsedLayout, "writable": false, "configurable": false});
+                myStyle += ' ' + style;
-                    break;
-                default:
-                    console.warn("Unknown layout version: '" + layout.version + "'");
-                    return;
             }
-            }
+        };
-            var letters = layout.parsed;
+        this.toString = function () {
-            renderarea.fadeOut('fast', function() {
+            return '<span class="item letter ' + myStyle + '">' + myValue + '</span>';
-                renderarea.empty();
-                letters.forEach(function(line, index, array) {
-                    line.forEach(function(letter) {
-                        renderarea.append(letter.toString());
-                    });
-                    if (index < array.length - 1) {
-                        renderarea.append('<br/>');
-                    }
-                });
-                if (typeof beforeshow === 'function') {
-                    beforeshow();
-                }
-                renderarea.fadeIn('fast');
-            });
         };
     }
 
@@ -718,6 +310,17 @@
             "59": [vorne5, hinten9]
         };
 
+        function parseObject(letters, styleClass, object) {
+            if (typeof object !== 'undefined' && object !== null) {
+                Object.keys(object).forEach(function (y) {
+                    var highlightLetters = object[y];
+                    highlightLetters.forEach(function (x) {
+                        letters[y - 1][x - 1].addStyle(styleClass);
+                    });
+                });
+            }
+        }
+
         function parseArrayOrObject(letters, styleClass, input) {
             if (typeof input !== 'undefined' && input !== null) {
                 if (Array.isArray(input)) {
@@ -730,17 +333,6 @@
             }
         }
 
-        function parseObject(letters, styleClass, object) {
-            if (typeof object !== 'undefined' && object !== null) {
-                Object.keys(object).forEach(function(y) {
-                    var highlightLetters = object[y];
-                    highlightLetters.forEach(function(x) {
-                        letters[y - 1][x - 1].addStyle(styleClass);
-                    });
-                });
-            }
-        }
-
         function parseTimeDefinition(letters, styleClass, definition) {
             if (typeof definition !== 'undefined' && definition !== null) {
                 Object.keys(definition).forEach(function (listString) {
@@ -776,22 +368,449 @@
     }
 
     /**
-     * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
+     * Hilfsklasse zum Rendern der Uhr.
-     * @param value Der Buchstabe, der Dargestellt werden soll.
+     * @param layout     Layout-Objekt, das gerendert werden soll.
-     * @param style Die CSS-Styleklassen des Buchstabens.
+     * @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
      */
-    function Letter(value, style) {
+    function UhrRenderer(layout, renderarea) {
-        var myValue = value;
+        this.render = function render(beforeshow) {
-        var myStyle = style || '';
+            if (layout.parsed === undefined) {
-        this.addStyle = function(style) {
+                switch (layout.version) {
-            if (myStyle === '') {
+                    case 2:
-                myStyle = style;
+                        var delegate = new UhrRendererV2Delegate(layout);
+                        var parsedLayout = delegate.parse();
+                        Object.defineProperty(layout, "parsed", {
+                            "value": parsedLayout,
+                            "writable": false,
+                            "configurable": false
+                        });
+                        break;
+                    default:
+                        console.warn("Unknown layout version: '" + layout.version + "'");
+                        return;
+                }
+            }
+            var letters = layout.parsed;
+            renderarea.fadeOut('fast', function () {
+                renderarea.empty();
+                letters.forEach(function (line, index, array) {
+                    line.forEach(function (letter) {
+                        renderarea.append(letter.toString());
+                    });
+                    if (index < array.length - 1) {
+                        renderarea.append('<br/>');
+                    }
+                });
+                if (typeof beforeshow === 'function') {
+                    beforeshow();
+                }
+                renderarea.fadeIn('fast');
+            });
+        };
+    }
+
+    var setLanguage = function setLanguage(languageKey) {
+        if (languageKey !== this.options.language) {
+            this.options.language = languageKey;
+            var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
+            renderer.render.bind(this)(function () {
+                this.currentMinute = -1;
+                update.bind(this)();
+            }.bind(this));
+            setCookie.bind(this)('uhr-language', languageKey);
+            update.bind(this)();
+        }
+    };
+    var setTheme = function setTheme(theme) {
+        if (theme !== this.options.theme) {
+            this.element.removeClass(this.options.theme).addClass(theme);
+            $('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
+            this.options.theme = theme;
+            setCookie.bind(this)('uhr-theme', theme);
+        }
+    };
+    var setTime = function setTime(time) {
+        this.currentMinute = -1;
+        if (time === null) {
+            this.options.time = new Date();
         } else {
-                myStyle += ' ' + style;
+            if (this.timer !== null) {
+                window.clearInterval(this.timer);
+            }
+            this.options.time = time;
+        }
+        update.bind(this)();
+    };
+    var setMode = function (mode) {
+        this.options.mode = mode;
+        this.currentMinute = -1;
+        update.bind(this)();
+        setCookie.bind(this)('uhr-mode', mode);
+    };
+    var setWidth = function setWidth(width) {
+        var e = this.element;
+        e.css('width', width);
+        var realWidth = e.width();
+        e.width(realWidth);
+        e.height(realWidth);
+        e.css('font-size', (realWidth / 40) + 'px');
+    };
+
+    // private interface methods
+    var setupHTML;
+    var wireFunctionality;
+    var create = function create() {
+        this.id = uhrGlobals.id++;
+        this.timer = null;
+        this.currentMinute = -1;
+        var userTime = this.options.time;
+        var hash, params;
+        if (this.options.time === undefined) {
+            this.options.time = new Date();
+        }
+        // parse the URL params
+        hash = window.location.hash;
+        if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
+            hash = hash.substring(1);
+            hash = decodeURIComponent(hash);
+            params = hash.split('&');
+            params.forEach(function (element) {
+                var pair = element.split('=');
+                var key = pair[0];
+                var value = pair[1];
+                switch (key) {
+                    case 'l':
+                    case 'language':
+                        this.options.language = value;
+                        this.options.force = true;
+                        break;
+                    case 't':
+                    case 'theme':
+                        this.options.theme = value;
+                        this.options.force = true;
+                        break;
+                    case 'm':
+                    case 'mode':
+                        this.options.mode = value;
+                        this.options.force = true;
+                        break;
+                    case 's':
+                    case 'status':
+                        this.options.status = value;
+                        this.options.force = true;
+                        break;
+                }
+            }.bind(this));
+        }
+        // end parse the URL params
+        setupHTML.bind(this)();
+        wireFunctionality.bind(this)();
+        if (userTime !== undefined) {
+            this.time(userTime);
         }
     };
-        this.toString = function() {
+    // private helper methods (not exported)
-            return '<span class="item letter ' + myStyle + '">' + myValue + '</span>';
+    var toggleConfigScreen = function toggleConfigScreen() {
+        $('#uhr-controlpanel' + this.id).toggle('fast');
     };
+    // set up
+    setupHTML = function setupHTML() {
+        var e = this.element;
+        // Base clock area
+        e.addClass('uhr');
+        e.empty();
+        e.append('<span class="item dot dot1"></span>');
+        e.append('<span class="item dot dot2"></span>');
+        e.append('<span class="item dot dot3"></span>');
+        e.append('<span class="item dot dot4"></span>');
+        e.append('<div class="letterarea"></div>');
+        e.append('<div class="reflection"></div>');
+        setWidth.bind(this)(this.options.width);
+
+        if (this.options.controls) {
+            var controlpanel = $('<div class="uhr-controlpanel" id="uhr-controlpanel' + this.id + '"></div>');
+            var content = $('<div class="content"></div>');
+            controlpanel.append(content);
+            // on/off switch
+            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('<label class="onoffswitch-label" for="uhr-onoffswitch-checkbox' + this.id + '">' +
+                '<div class="onoffswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' + '</label>');
+            content.append(toggleSwitch);
+
+            // time mode switch
+            var modeSwitch = $('<div class="onoffswitch" id="uhr-modeswitch' + this.id + '"></div>');
+            modeSwitch.append('<input type="checkbox" class="onoffswitch-checkbox" id="uhr-modeswitch-checkbox' + this.id +
+                '" checked="checked" />');
+            modeSwitch.append('<label class="onoffswitch-label" for="uhr-modeswitch-checkbox' + this.id + '">' +
+                '<div class="modeswitch-inner"></div>' + '<div class="onoffswitch-switch"></div>' +
+                '</label>');
+            content.append(modeSwitch);
+            // language chooser
+            if (uhrGlobals.languages.length > 1) {
+                var languageChooser = $('<select id="uhr-languagechooser' + this.id + '"></select>');
+                uhrGlobals.languages.forEach(function (item) {
+                    languageChooser.append('<option value="' + item.code + '">' + item.language + '</option>');
+                });
+                content.append(languageChooser);
             }
+
+            // theme chooser
+            if (uhrGlobals.themes.length > 1) {
+                var themeChooser = $('<select id="uhr-themechooser' + this.id + '"></select>');
+                uhrGlobals.themes.forEach(function (item) {
+                    themeChooser.append('<option value="' + item.styleClass + '">' + item.name + '</option>');
+                });
+                content.append(themeChooser);
+            }
+            var closebutton = $('<a class="uhr-closecontrolpanel" id="uhr-closecontrolpanel' + this.id + '"></a>');
+            closebutton.on('click', function () {
+                $('#uhr-controlpanel' + this.id).hide('fast');
+            }.bind(this));
+            content.append(closebutton);
+            e.after(controlpanel);
+            controlpanel.hide();
+            var configlink = $('<a class="uhr-configlink" id="uhr-configlink' + this.id + '"></a>');
+            configlink.on('click', function () {
+                toggleConfigScreen.bind(this)();
+            }.bind(this));
+            e.after(configlink);
+        }
+    };
+    wireFunctionality = function wireFunctionality() {
+        // on/off switch
+        var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
+        toggleSwitch.on('click', function () {
+            this.toggle();
+        }.bind(this));
+        var status = $.cookie('uhr-status' + this.id);
+        if (status === undefined || this.options.force) {
+            status = this.options.status;
+        }
+        toggleSwitch.prop('checked', status === 'on');
+        if (status === 'on') {
+            this.start();
+        } else {
+            this.stop();
+        }
+
+        // time mode switch
+        var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
+        modeSwitch.on('click', function () {
+            if (this.options.mode === 'seconds') {
+                setMode.bind(this)('normal');
+            } else {
+                setMode.bind(this)('seconds');
+            }
+        }.bind(this));
+
+        var mode = $.cookie('uhr-mode' + this.id);
+        if (mode === undefined || this.options.force) {
+            mode = this.options.mode;
+        }
+        modeSwitch.prop('checked', mode !== 'seconds');
+        if (mode === 'seconds') {
+            setMode.bind(this)('seconds');
+        } else {
+            setMode.bind(this)('normal');
+        }
+
+        // language chooser
+        var languageChooser = $('#uhr-languagechooser' + this.id);
+        languageChooser.on('change', function () {
+            var languageKey = $('#uhr-languagechooser' + this.id).val();
+            this.language(languageKey);
+        }.bind(this));
+        var selectedLanguage = $.cookie('uhr-language' + this.id);
+        if (selectedLanguage === undefined || this.options.force) {
+            selectedLanguage = this.options.language;
+        }
+        var found = uhrGlobals.languages.some(function (item) {
+            return selectedLanguage === item.code;
+        });
+        if (!found) {
+            var fallbackLanguage;
+            if (uhrGlobals.languages.length > 0) {
+                fallbackLanguage = uhrGlobals.languages[0].code;
+            } else {
+                fallbackLanguage = '';
+            }
+            console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
+            selectedLanguage = fallbackLanguage;
+        }
+        languageChooser.val(selectedLanguage);
+        this.options.language = "";
+        this.language(selectedLanguage);
+
+        // theme chooser
+        var themeChooser = $('#uhr-themechooser' + this.id);
+        themeChooser.on('change', function () {
+            var themeKey = $('#uhr-themechooser' + this.id).val();
+            this.theme(themeKey);
+        }.bind(this));
+        var selectedTheme = $.cookie('uhr-theme' + this.id);
+        if (selectedTheme === undefined || this.options.force) {
+            selectedTheme = this.options.theme;
+        }
+        found = uhrGlobals.themes.some(function (item) {
+            return selectedTheme === item.styleClass;
+        });
+        if (!found) {
+            var fallbackTheme = uhrGlobals.themes[0].styleClass;
+            console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
+            selectedTheme = fallbackTheme;
+        }
+        themeChooser.val(selectedTheme);
+        this.options.theme = "";
+        this.theme(selectedTheme);
+        if (this.options.autoresize) {
+            $(window).on('resize', function () {
+                var $e = this.element;
+                var $parent = $e.parent();
+                var $window = $(window);
+                var parentWidth = $parent.width();
+                var parentHeight = $parent.height();
+                var windowWidth = $window.width();
+                var windowHeight = $window.height();
+                var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
+                setWidth.bind(this)(size);
+            }.bind(this));
+        }
+    };
+    var destroy = function destroy() {
+        this.timer = null;
+        $(this.element)
+            .removeAttr('style')
+            .removeAttr('class')
+            .empty();
+        $('#uhr-configlink' + this.id).remove();
+        $('#uhr-controlpanel' + this.id).remove();
+
+    };
+    setCookie = function setCookie(cookieName, cookieValue) {
+        var options = {};
+        if (this.options.cookiePath !== undefined) {
+            options = {expires: 365, path: this.options.cookiePath};
+        } else {
+            options = {expires: 365};
+        }
+        $.cookie(cookieName + this.id, cookieValue, options);
+    };
+
+    // business logic
+    isOn = function isOn() {
+        return this.timer !== null;
+    };
+    var show;
+    var clear;
+    update = function update() {
+        if (isOn.bind(this)()) {
+            var time = this.options.time;
+            if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
+                if (time.getMinutes() === this.currentMinute) {
+                    return;
+                }
+                this.currentMinute = time.getMinutes();
+            }
+            show.bind(this)(time);
+        } else {
+            clear.bind(this)();
+            this.currentMinute = -1;
+        }
+    };
+    var highlight;
+    var getSecond;
+    var getDotMinute;
+    var getCoarseMinute;
+    var getHour;
+    show = function show(time) {
+        var second = getSecond.bind(this)(time);
+        var dotMinute = getDotMinute.bind(this)(time);
+        var hour = getHour.bind(this)(time);
+        var coarseMinute = getCoarseMinute.bind(this)(time);
+        clear.bind(this)();
+        if (this.options.mode === 'seconds') {
+            highlight.bind(this)('second' + second);
+        } else {
+            highlight.bind(this)('on');
+            for (var i = 1; i <= dotMinute; i++) {
+                highlight.bind(this)('dot' + i);
+            }
+            highlight.bind(this)('minute' + coarseMinute);
+            highlight.bind(this)('hour' + hour);
+        }
+    };
+    highlight = function highlight(itemClass) {
+        this.element.find('.item.' + itemClass).addClass('active');
+    };
+    clear = function clear() {
+        this.element.find('.item').removeClass('active');
+    };
+    getSecond = function getSecond(date) {
+        if (typeof language.bind(this)().getSeconds === 'function') {
+            return language.bind(this)().getSeconds(date);
+        }
+        return date.getSeconds();
+    };
+    getDotMinute = function getDotMinute(date) {
+        if (typeof language.bind(this)().getDotMinute === 'function') {
+            return language.bind(this)().getDotMinute(date);
+        }
+        var minutes = date.getMinutes();
+        return minutes % 5;
+    };
+    getCoarseMinute = function getCoarseMinute(date) {
+        if (typeof language.bind(this)().getCoarseMinute === 'function') {
+            return language.bind(this)().getCoarseMinute(date);
+        }
+        return date.getMinutes();
+    };
+    getHour = function getHour(date) {
+        if (typeof language.bind(this)().getHour === 'function') {
+            return language.bind(this)().getHour(date);
+        }
+        var hour = date.getHours();
+        if (date.getMinutes() >= 25) {
+            return (hour + 1) % 24;
+        }
+        return hour;
+    };
+    language = function language() {
+        var matchingLanguages = uhrGlobals.languages.filter(function (element) {
+            return (element.code === this.options.language);
+        }, this);
+        if (matchingLanguages.length > 0) {
+            return matchingLanguages[0];
+        }
+        // fallback: return empty object
+        return {};
+    };
+
+    $.widget("fritteli.uhr", {
+        "options": {
+            width: '100%',
+            status: 'on',
+            language: 'de_CH',
+            theme: uhrGlobals.themes[0].styleClass,
+            force: false,
+            controls: true,
+            cookiePath: undefined,
+            autoresize: true,
+            mode: 'normal'
+        },
+        "start": start,
+        "stop": stop,
+        "toggle": toggle,
+        "language": setLanguage,
+        "theme": setTheme,
+        "time": setTime,
+        "mode": setMode,
+        "width": setWidth,
+        // constructor method
+        "_create": create,
+        // destructor method
+        "_destroy": destroy
+    });
+    $.fritteli.uhr.register = uhrGlobals.registerLanguage;
 })(jQuery);

test/fastforward.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<!--
+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/>.
+-->
+<html lang="de" manifest="manifest.appcache">
+<head>
+    <title>Fastforward bärneruhr.ch</title>
+    <meta charset="utf-8"/>
+    <meta name="apple-mobile-web-app-capable" content="yes"/>
+    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
+    <meta name="apple-mobile-web-app-title" content="Bärneruhr"/>
+    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr.min.css"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-black.min.css" data-class="black" data-name="Schwarz"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-white.min.css" data-class="white" data-name="Weiss"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-red.min.css" data-class="red" data-name="Rot"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-yellow.min.css" data-class="yellow" data-name="Gelb"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-green.min.css" data-class="green" data-name="Grün"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-blue.min.css" data-class="blue" data-name="Blau"/>
+    <link rel="stylesheet" type="text/css" href="../dist/uhr-pink.min.css" data-class="pink" data-name="Pink"/>
+    <link rel="shortcut icon" type="image/png" href="../resources/favicon.png"/>
+    <link rel="apple-touch-icon-precomposed" href="../resources/apple-touch-icon-precomposed.png"/>
+    <script type="text/javascript" src="../dist/libs.min.js"></script>
+    <script type="text/javascript" src="../dist/jquery.uhr.complete.min.js"></script>
+</head>
+<body>
+<div id="uhr"></div>
+<button id="timer">Start</button>
+<button id="reset">Reset</button>
+<script type="text/javascript">
+    (function ($) {
+        var time = new Date(2000, 0, 1, 0, 0, 0, 0);
+        var timer = null;
+        $('#timer').on('click', function () {
+            if (timer == null) {
+                timer = window.setInterval(function () {
+                    var minutes = time.getMinutes();
+                    var hours = time.getHours();
+                    minutes = (minutes + 1) % 60;
+                    if (minutes == 0) {
+                        hours = (hours + 1) % 24;
+                        time.setHours(hours);
+                    }
+                    time.setMinutes(minutes);
+                    $('#uhr').uhr('time', time);
+                }, 200);
+                $('#timer').html('Pause');
+            } else {
+                window.clearInterval(timer);
+                timer = null;
+                $('#timer').html('Start');
+            }
+        });
+        $('#reset').on('click', function () {
+            time = new Date(2000, 0, 1, 0, 0, 0, 0);
+            $('#uhr').uhr('time', time);
+        });
+        $('#uhr').uhr({
+            width: '200px',
+            time: time
+        });
+    })(jQuery);
+</script>
+</body>
+</html>

test/test.html

@@ -1,4 +1,18 @@
 <!DOCTYPE html>
+<!--
+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/>.
+-->
 <html>
 <head lang="en">
     <meta charset="UTF-8">

test/test.js

@@ -8,6 +8,13 @@ suite('Bärneruhr', function () {
         elem = $('#u');
     });
 
+    function cleanupCookies(id) {
+        $.removeCookie('uhr-language' + id);
+        $.removeCookie('uhr-mode' + id);
+        $.removeCookie('uhr-status' + id);
+        $.removeCookie('uhr-theme' + id);
+    }
+
     teardown(function () {
         var uhr = elem.uhr('instance');
         if (uhr !== undefined) {
@@ -21,13 +28,6 @@ suite('Bärneruhr', function () {
         window.location.hash = '';
     });
 
-    function cleanupCookies(id) {
-        $.removeCookie('uhr-language' + id);
-        $.removeCookie('uhr-mode' + id);
-        $.removeCookie('uhr-status' + id);
-        $.removeCookie('uhr-theme' + id);
-    }
-
     test('create and destroy widget', function () {
         var uhr = elem.uhr('instance');
         var id;
@@ -95,8 +95,10 @@ suite('Bärneruhr', function () {
             language: 'klingon'
         });
         uhr = elem.uhr('instance');
-        // NB: 'de' is just the first language that is included in the page. that may change!
+        // The 'uhr' element must be created, and a fall-back language must have been selected
-        assert.equal(uhr.options.language, 'de');
+        assert.isTrue(!!uhr);
+        assert.isTrue(!!uhr.options.language);
+        assert.notEqual(uhr.options.language, 'klingon');
     });
 
     test('unknown theme', function () {