manuel/uhr
1
0
Fork 0
Code Issues 5 Pull requests Releases Wiki Activity

Exclude external dependencies jQuery and js-cookie from the bunde; use npm run build for bundling a production build; fix deprecated warnings.
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse source
This commit is contained in:
Manuel Friedli 2019-05-06 02:03:44 +02:00
parent 174e0d9af2
commit 3c986d645a
8 changed files with 57 additions and 378 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.drone.yml
View file

@ -9,4 +9,4 @@ steps:
- name: build - name: build
image: node:12 image: node:12
commands: commands:
- npm run build-debug - npm run build

328
dist/bundle.js vendored
View file

File diff suppressed because one or more lines are too long

1
dist/uhr.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

10
index.html
View file

@ -39,9 +39,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"
integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script type="text/javascript" src="dist/bundle.js"></script> <script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
<!--<script type="text/javascript" src="dist/libs.min.js"></script>--> <script type="text/javascript" src="dist/uhr.js"></script>
<!--<script type="text/javascript" src="dist/jquery.uhr.complete.min.js"></script>-->
<script type="text/javascript"> <script type="text/javascript">
function go(url) { function go(url) {
window.location = url; window.location = url;
@ -51,10 +50,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</head> </head>
<body style="padding:0;margin:0;"> <body style="padding:0;margin:0;">
<div id="uhr"></div> <div id="uhr"></div>
<p id="disclaimer">Created by <a href="http://www.fritteli.ch/">fritteli</a>, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>. <a <p id="disclaimer">Created by <a href="http://www.fritteli.ch/">fritteli</a>, inspired by <a
href="http://www.qlocktwo.com/">QLOCKTWO</a>. <a
onclick="go('info/index.html')" href="#">Read more!</a></p> onclick="go('info/index.html')" href="#">Read more!</a></p>
<script type="text/javascript"> <script type="text/javascript">
(function($) { (function ($) {
var width = $(window).width(); var width = $(window).width();
var height = $(window).height(); var height = $(window).height();
var size = Math.min(width, height) + 'px'; var size = Math.min(width, height) + 'px';

16
info/index.html
View file

@ -31,8 +31,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"
integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script type="text/javascript" src="../dist/bundle.js"></script> <script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
<!--<script type="text/javascript" src="../dist/jquery.uhr.base.min.js"></script>--> <script type="text/javascript" src="../dist/uhr.js"></script>
<script type="text/javascript"> <script type="text/javascript">
function go(url) { function go(url) {
window.location = url; window.location = url;
@ -83,16 +83,15 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<h3 id="requirements">Benötigte Bibliotheken<a href="#toc" class="toclink">Zum Inhalt</a></h3> <h3 id="requirements">Benötigte Bibliotheken<a href="#toc" class="toclink">Zum Inhalt</a></h3>
<ul> <ul>
<li><a href="http://jquery.com/download/">jQuery</a> (getestet mit Version 2.1.0)</li> <li><a href="http://jquery.com/download/">jQuery</a> (getestet mit Version 3.4.1)</li>
<li><a href="http://jqueryui.com/download/">jQuery-UI</a> (getestet mit Version 1.10.4) mit folgenden <li><a href="http://jqueryui.com/download/">jQuery-UI</a> (getestet mit Version 1.12.1) mit folgenden
Komponenten: Komponenten:
<ul> <ul>
<li>core</li>
<li>widget</li> <li>widget</li>
</ul> </ul>
</li> </li>
<li><a href="https://github.com/carhartl/jquery-cookie/releases">jQuery-cookie</a> (getestet mit Version <li><a href="https://github.com/js-cookie/js-cookie/releases">js-cookie</a> (getestet mit Version
1.4.0) 2.2.0)
</li> </li>
</ul> </ul>
<h3 id="include-in-html">Einbinden in HTML<a href="#toc" class="toclink">Zum Inhalt</a></h3> <h3 id="include-in-html">Einbinden in HTML<a href="#toc" class="toclink">Zum Inhalt</a></h3>
@ -117,8 +116,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
data-name="Blau" /&gt; data-name="Blau" /&gt;
&lt;link rel="stylesheet" type="text/css" href="dist/uhr-pink.min.css" data-class="pink" &lt;link rel="stylesheet" type="text/css" href="dist/uhr-pink.min.css" data-class="pink"
data-name="Pink" /&gt; data-name="Pink" /&gt;
&lt;script type="text/javascript" src="dist/libs.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="dist/uhr.js"&gt;&lt;/script&gt;</code>
&lt;script type="text/javascript" src="dist/jquery.uhr.complete.min.js"&gt;&lt;/script&gt;</code>
</p> </p>
<p>Von den Stylesheets zwingend ist <code>uhr.css</code> und mindestens eines der Farbschema-Stylesheets. Die <p>Von den Stylesheets zwingend ist <code>uhr.css</code> und mindestens eines der Farbschema-Stylesheets. Die

3
package.json
View file

@ -23,7 +23,8 @@
], ],
"license": "GPL-3.0", "license": "GPL-3.0",
"scripts": { "scripts": {
"build-debug": "webpack -d" "build-debug": "webpack -d",
"build": "webpack"
}, },
"dependencies": { "dependencies": {
"jquery": "3.4.1", "jquery": "3.4.1",

42
src/uhr.ts
View file

@ -182,8 +182,7 @@ export class Uhr {
e.after(controlpanel); e.after(controlpanel);
controlpanel.hide(); controlpanel.hide();
const configlink = $(`<a class="uhr-configlink" id="uhr-configlink${this.widgetInstance.uuid}"></a>`); const configlink = $(`<a class="uhr-configlink" id="uhr-configlink${this.widgetInstance.uuid}"></a>`);
// FIXME deprecated!? configlink.on({click: () => this.toggleConfigScreen()});
configlink.on('click', () => this.toggleConfigScreen());
e.after(configlink); e.after(configlink);
} }
}; };
@ -191,8 +190,7 @@ export class Uhr {
private wireFunctionality(): void { private wireFunctionality(): void {
// on/off switch // on/off switch
const toggleSwitch = $(`#uhr-onoffswitch-checkbox${this.widgetInstance.uuid}`); const toggleSwitch = $(`#uhr-onoffswitch-checkbox${this.widgetInstance.uuid}`);
// FIXME deprecated!? toggleSwitch.on({click: () => this.toggle()});
toggleSwitch.on('click', () => this.toggle());
let status = this.getCookie('uhr-status'); let status = this.getCookie('uhr-status');
if (status === undefined || this.widgetInstance.options.force) { if (status === undefined || this.widgetInstance.options.force) {
status = this.widgetInstance.options.status; status = this.widgetInstance.options.status;
@ -206,13 +204,14 @@ export class Uhr {
// time mode switch // time mode switch
const modeSwitch = $(`#uhr-modeswitch-checkbox${this.widgetInstance.uuid}`); const modeSwitch = $(`#uhr-modeswitch-checkbox${this.widgetInstance.uuid}`);
// FIXME deprecated!? modeSwitch.on({
modeSwitch.on('click', () => { click: () => {
if (this.widgetInstance.options.mode === 'seconds') { if (this.widgetInstance.options.mode === 'seconds') {
this.setMode('normal'); this.setMode('normal');
} else { } else {
this.setMode('seconds'); this.setMode('seconds');
} }
}
}); });
let mode = this.getCookie('uhr-mode'); let mode = this.getCookie('uhr-mode');
@ -228,10 +227,11 @@ export class Uhr {
// language chooser // language chooser
const languageChooser = $(`#uhr-languagechooser${this.widgetInstance.uuid}`); const languageChooser = $(`#uhr-languagechooser${this.widgetInstance.uuid}`);
// FIXME deprecated!? languageChooser.on({
languageChooser.on('change', () => { change: () => {
const languageKey = $(`#uhr-languagechooser${this.widgetInstance.uuid}`).val() as string; const languageKey = $(`#uhr-languagechooser${this.widgetInstance.uuid}`).val() as string;
this.setLanguage(languageKey); this.setLanguage(languageKey);
}
}); });
let selectedLayout = this.getCookie('uhr-language'); let selectedLayout = this.getCookie('uhr-language');
if (selectedLayout === undefined || this.widgetInstance.options.force) { if (selectedLayout === undefined || this.widgetInstance.options.force) {
@ -254,10 +254,11 @@ export class Uhr {
// theme chooser // theme chooser
const themeChooser = $(`#uhr-themechooser${this.widgetInstance.uuid}`); const themeChooser = $(`#uhr-themechooser${this.widgetInstance.uuid}`);
// FIXME deprecated!? themeChooser.on({
themeChooser.on('change', () => { change: () => {
const themeKey = $(`#uhr-themechooser${this.widgetInstance.uuid}`).val() as string; const themeKey = $(`#uhr-themechooser${this.widgetInstance.uuid}`).val() as string;
this.setTheme(themeKey); this.setTheme(themeKey);
}
}); });
let selectedTheme = this.getCookie('uhr-theme'); let selectedTheme = this.getCookie('uhr-theme');
if (selectedTheme === undefined || this.widgetInstance.options.force) { if (selectedTheme === undefined || this.widgetInstance.options.force) {
@ -273,17 +274,18 @@ export class Uhr {
this.widgetInstance.options.theme = ''; this.widgetInstance.options.theme = '';
this.setTheme(selectedTheme); this.setTheme(selectedTheme);
if (this.widgetInstance.options.autoresize) { if (this.widgetInstance.options.autoresize) {
// FIXME deprecated!? $(window).on({
$(window).on('resize', () => { resize: () => {
const $e = this.widgetInstance.element; const $e: JQuery<HTMLElement> = this.widgetInstance.element;
const $parent = $e.parent(); const $parent: JQuery<HTMLElement> = $e.parent();
const $window = $(window); const $window: JQuery<Window> = $(window);
const parentWidth = $parent.width(); const parentWidth: number = $parent.width();
const parentHeight = $parent.height(); const parentHeight: number = $parent.height();
const windowWidth = $window.width(); const windowWidth: number = $window.width();
const windowHeight = $window.height(); const windowHeight: number = $window.height();
const size = `${Math.min(parentWidth, parentHeight, windowWidth, windowHeight)}px`; const size: string = `${Math.min(parentWidth, parentHeight, windowWidth, windowHeight)}px`;
this.setWidth(size); this.setWidth(size);
}
}); });
} }
} }

13
webpack.config.js
View file

@ -6,10 +6,10 @@ const path = require('path');
module.exports = { module.exports = {
entry: [ entry: [
'./src/index.ts', './src/index.ts'
'./node_modules/jquery/dist/jquery.js'
], ],
devtool: 'inline-source-map', // devtool: 'inline-source-map',
mode: 'production',
module: { module: {
rules: [ rules: [
{ {
@ -28,7 +28,12 @@ module.exports = {
extensions: ['.tsx', '.ts', '.js'] extensions: ['.tsx', '.ts', '.js']
}, },
output: { output: {
filename: 'bundle.js', filename: 'uhr.js',
library: 'uhr',
path: path.resolve(__dirname, 'dist') path: path.resolve(__dirname, 'dist')
},
externals: {
jquery: 'jQuery',
'js-cookie': 'Cookies'
} }
}; };