-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.js
113 lines (103 loc) · 2.61 KB
/
main.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
(function ($, App) {
$(document).ready(function () {
const app = new App({
// dependencies:
// jQuery is a fast, small, and feature-rich JavaScript library.
// https://github.com/jquery/jquery
jQuery: window.jQuery,
// Elegant, responsive, flexible and lightweight notification plugin with no dependencies.
// https://github.com/marcelodolza/iziToast
iziToast: window.iziToast,
});
// Show welcome message
app.showWelcomeMessage();
});
}(window.jQuery, function App({
// destructuring assignments for dependencies
jQuery: $, // assign the jQuery property to a local variable named `$`
iziToast,
}) {
// Initialize app instance
init(this);
/**
* Initialize app
*
* @param {App} app
*/
function init(app) {
// Initialize the app's nodes
initNodes(app);
// Initialize the app's methods
initMethods(app);
// Initialize the app's events
initEvents(app);
}
/**
* Initialize the app's nodes
*
* @param {App} app
*/
function initNodes(app) {
// The app's root element
app.$el = $('#app');
app.nodes = {
// root element
$root: app.$el,
// #show-welcome-message-button
$showWelcomeMessageButton: app.$el.find('#show-welcome-message-button'),
// #show-current-time-button
$showCurrentTimeButton: app.$el.find('#show-current-time-button'),
};
}
/**
* Initialize the app's methods
*
* @param {App} app
*/
function initMethods(app) {
app.methods = {
/**
* Show welcome message
*/
showWelcomeMessage() {
iziToast.info({
title: 'Hi, there!',
message: 'Welcome!',
position: 'topCenter',
transitionIn: 'flipInX',
transitionOut: 'flipOutX',
});
},
/**
* Show current time
*/
showCurrentTime() {
iziToast.success({
title: 'Current Time:',
message: (new Date()).toLocaleString(),
position: 'bottomCenter',
transitionIn: 'bounceInRight',
});
},
};
// Add references to the app's methods on the app instance
// app.myMethod() --> app.methods.myMethod()
$.extend(app, app.methods);
}
/**
* Initialize the app's events
*
* @param {App} app
*/
function initEvents(app) {
const nodes = app.nodes;
nodes.$showWelcomeMessageButton.on('click', function () {
// Show welcome message
app.showWelcomeMessage();
});
nodes.$showCurrentTimeButton.on('click', function () {
// Show current time
app.showCurrentTime();
});
}
}));