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
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
174e0d9af2
commit
3c986d645a
8 changed files with 57 additions and 378 deletions
|
@ -9,4 +9,4 @@ steps:
|
|||
- name: build
|
||||
image: node:12
|
||||
commands:
|
||||
- npm run build-debug
|
||||
- npm run build
|
||||
|
|
328
dist/bundle.js
vendored
328
dist/bundle.js
vendored
File diff suppressed because one or more lines are too long
1
dist/uhr.js
vendored
Normal file
1
dist/uhr.js
vendored
Normal file
File diff suppressed because one or more lines are too long
10
index.html
10
index.html
|
@ -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"
|
||||
integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
|
||||
crossorigin="anonymous"></script>
|
||||
<script type="text/javascript" src="dist/bundle.js"></script>
|
||||
<!--<script type="text/javascript" src="dist/libs.min.js"></script>-->
|
||||
<!--<script type="text/javascript" src="dist/jquery.uhr.complete.min.js"></script>-->
|
||||
<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
|
||||
<script type="text/javascript" src="dist/uhr.js"></script>
|
||||
<script type="text/javascript">
|
||||
function go(url) {
|
||||
window.location = url;
|
||||
|
@ -51,10 +50,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|||
</head>
|
||||
<body style="padding:0;margin:0;">
|
||||
<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>
|
||||
<script type="text/javascript">
|
||||
(function($) {
|
||||
(function ($) {
|
||||
var width = $(window).width();
|
||||
var height = $(window).height();
|
||||
var size = Math.min(width, height) + 'px';
|
||||
|
|
|
@ -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"
|
||||
integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
|
||||
crossorigin="anonymous"></script>
|
||||
<script type="text/javascript" src="../dist/bundle.js"></script>
|
||||
<!--<script type="text/javascript" src="../dist/jquery.uhr.base.min.js"></script>-->
|
||||
<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
|
||||
<script type="text/javascript" src="../dist/uhr.js"></script>
|
||||
<script type="text/javascript">
|
||||
function go(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>
|
||||
<ul>
|
||||
<li><a href="http://jquery.com/download/">jQuery</a> (getestet mit Version 2.1.0)</li>
|
||||
<li><a href="http://jqueryui.com/download/">jQuery-UI</a> (getestet mit Version 1.10.4) mit folgenden
|
||||
<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.12.1) mit folgenden
|
||||
Komponenten:
|
||||
<ul>
|
||||
<li>core</li>
|
||||
<li>widget</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="https://github.com/carhartl/jquery-cookie/releases">jQuery-cookie</a> (getestet mit Version
|
||||
1.4.0)
|
||||
<li><a href="https://github.com/js-cookie/js-cookie/releases">js-cookie</a> (getestet mit Version
|
||||
2.2.0)
|
||||
</li>
|
||||
</ul>
|
||||
<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" />
|
||||
<link rel="stylesheet" type="text/css" href="dist/uhr-pink.min.css" data-class="pink"
|
||||
data-name="Pink" />
|
||||
<script type="text/javascript" src="dist/libs.min.js"></script>
|
||||
<script type="text/javascript" src="dist/jquery.uhr.complete.min.js"></script></code>
|
||||
<script type="text/javascript" src="dist/uhr.js"></script></code>
|
||||
</p>
|
||||
|
||||
<p>Von den Stylesheets zwingend ist <code>uhr.css</code> und mindestens eines der Farbschema-Stylesheets. Die
|
||||
|
|
|
@ -23,7 +23,8 @@
|
|||
],
|
||||
"license": "GPL-3.0",
|
||||
"scripts": {
|
||||
"build-debug": "webpack -d"
|
||||
"build-debug": "webpack -d",
|
||||
"build": "webpack"
|
||||
},
|
||||
"dependencies": {
|
||||
"jquery": "3.4.1",
|
||||
|
|
42
src/uhr.ts
42
src/uhr.ts
|
@ -182,8 +182,7 @@ export class Uhr {
|
|||
e.after(controlpanel);
|
||||
controlpanel.hide();
|
||||
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);
|
||||
}
|
||||
};
|
||||
|
@ -191,8 +190,7 @@ export class Uhr {
|
|||
private wireFunctionality(): void {
|
||||
// on/off switch
|
||||
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');
|
||||
if (status === undefined || this.widgetInstance.options.force) {
|
||||
status = this.widgetInstance.options.status;
|
||||
|
@ -206,13 +204,14 @@ export class Uhr {
|
|||
|
||||
// time mode switch
|
||||
const modeSwitch = $(`#uhr-modeswitch-checkbox${this.widgetInstance.uuid}`);
|
||||
// FIXME deprecated!?
|
||||
modeSwitch.on('click', () => {
|
||||
modeSwitch.on({
|
||||
click: () => {
|
||||
if (this.widgetInstance.options.mode === 'seconds') {
|
||||
this.setMode('normal');
|
||||
} else {
|
||||
this.setMode('seconds');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
let mode = this.getCookie('uhr-mode');
|
||||
|
@ -228,10 +227,11 @@ export class Uhr {
|
|||
|
||||
// language chooser
|
||||
const languageChooser = $(`#uhr-languagechooser${this.widgetInstance.uuid}`);
|
||||
// FIXME deprecated!?
|
||||
languageChooser.on('change', () => {
|
||||
languageChooser.on({
|
||||
change: () => {
|
||||
const languageKey = $(`#uhr-languagechooser${this.widgetInstance.uuid}`).val() as string;
|
||||
this.setLanguage(languageKey);
|
||||
}
|
||||
});
|
||||
let selectedLayout = this.getCookie('uhr-language');
|
||||
if (selectedLayout === undefined || this.widgetInstance.options.force) {
|
||||
|
@ -254,10 +254,11 @@ export class Uhr {
|
|||
|
||||
// theme chooser
|
||||
const themeChooser = $(`#uhr-themechooser${this.widgetInstance.uuid}`);
|
||||
// FIXME deprecated!?
|
||||
themeChooser.on('change', () => {
|
||||
themeChooser.on({
|
||||
change: () => {
|
||||
const themeKey = $(`#uhr-themechooser${this.widgetInstance.uuid}`).val() as string;
|
||||
this.setTheme(themeKey);
|
||||
}
|
||||
});
|
||||
let selectedTheme = this.getCookie('uhr-theme');
|
||||
if (selectedTheme === undefined || this.widgetInstance.options.force) {
|
||||
|
@ -273,17 +274,18 @@ export class Uhr {
|
|||
this.widgetInstance.options.theme = '';
|
||||
this.setTheme(selectedTheme);
|
||||
if (this.widgetInstance.options.autoresize) {
|
||||
// FIXME deprecated!?
|
||||
$(window).on('resize', () => {
|
||||
const $e = this.widgetInstance.element;
|
||||
const $parent = $e.parent();
|
||||
const $window = $(window);
|
||||
const parentWidth = $parent.width();
|
||||
const parentHeight = $parent.height();
|
||||
const windowWidth = $window.width();
|
||||
const windowHeight = $window.height();
|
||||
const size = `${Math.min(parentWidth, parentHeight, windowWidth, windowHeight)}px`;
|
||||
$(window).on({
|
||||
resize: () => {
|
||||
const $e: JQuery<HTMLElement> = this.widgetInstance.element;
|
||||
const $parent: JQuery<HTMLElement> = $e.parent();
|
||||
const $window: JQuery<Window> = $(window);
|
||||
const parentWidth: number = $parent.width();
|
||||
const parentHeight: number = $parent.height();
|
||||
const windowWidth: number = $window.width();
|
||||
const windowHeight: number = $window.height();
|
||||
const size: string = `${Math.min(parentWidth, parentHeight, windowWidth, windowHeight)}px`;
|
||||
this.setWidth(size);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,10 +6,10 @@ const path = require('path');
|
|||
|
||||
module.exports = {
|
||||
entry: [
|
||||
'./src/index.ts',
|
||||
'./node_modules/jquery/dist/jquery.js'
|
||||
'./src/index.ts'
|
||||
],
|
||||
devtool: 'inline-source-map',
|
||||
// devtool: 'inline-source-map',
|
||||
mode: 'production',
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
|
@ -28,7 +28,12 @@ module.exports = {
|
|||
extensions: ['.tsx', '.ts', '.js']
|
||||
},
|
||||
output: {
|
||||
filename: 'bundle.js',
|
||||
filename: 'uhr.js',
|
||||
library: 'uhr',
|
||||
path: path.resolve(__dirname, 'dist')
|
||||
},
|
||||
externals: {
|
||||
jquery: 'jQuery',
|
||||
'js-cookie': 'Cookies'
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue