Added singleton library, deleted patterns in constructors

This commit is contained in:
Eugene Serb 2022-06-18 23:11:09 +03:00
parent fe8895f07c
commit 9903106382
2 changed files with 204 additions and 73 deletions

View File

@ -98,7 +98,7 @@
<div class="wavelovers"> <div class="wavelovers">
<div class="content"> <div class="content">
<h2 class="content__header">Feedback</h2> <h2 class="content__header">Feedback</h2>
<p>Hi, friend! I am the author and developer of Wavelovers app and I want to thank you for using this app. If you have any ideas or wishes, you can write to me.</p> <p>Hi! I am the author and developer of Wavelovers app and I want to thank you for using this app. If you have any ideas or wishes, you can write to me.</p>
<br /> <br />
<span>Follow me on Twitter: </span> <span>Follow me on Twitter: </span>
<a href="https://twitter.com/eugene_serb" target="_blank">@eugene_serb</a> <a href="https://twitter.com/eugene_serb" target="_blank">@eugene_serb</a>

View File

@ -4,53 +4,184 @@
'use strict'; 'use strict';
const __PATTERNS = [ class Library {
{ constructor() {
"name": "Constant Weak", if (typeof Library.instance === 'object') {
"type": "Simple", return Library.instance;
"icon": "😏", };
"pattern": [ this.init();
Library.instance = this;
return this;
};
init = () => {
this.patterns = this.getBase();
};
getBase = () => {
return [
{ {
"startDelay": 0, "name": "Dotted Weak",
"duration": 1000, "type": "Simple",
"weakMagnitude": 1.0, "icon": "😌",
"strongMagnitude": 0.0 "pattern": [
} {
] "startDelay": 100,
}, "duration": 100,
{ "weakMagnitude": 1.0,
"name": "Constant Strong", "strongMagnitude": 0.0
"type": "Simple", }
"icon": "🤩", ]
"pattern": [ },
{ {
"startDelay": 0, "name": "Dotted Strong",
"duration": 1000, "type": "Simple",
"weakMagnitude": 0.0, "icon": "😉",
"strongMagnitude": 1.0 "pattern": [
} {
] "startDelay": 100,
}, "duration": 100,
{ "weakMagnitude": 0.0,
"name": "Constant Max", "strongMagnitude": 1.0
"type": "Simple", }
"icon": "😍", ]
"pattern": [ },
{ {
"startDelay": 0, "name": "Dotted Max",
"duration": 1000, "type": "Simple",
"weakMagnitude": 1.0, "icon": "🙃",
"strongMagnitude": 1.0 "pattern": [
{
"startDelay": 100,
"duration": 100,
"weakMagnitude": 1.0,
"strongMagnitude": 1.0
}
]
},
{
"name": "Short Dashed Weak",
"type": "Simple",
"icon": "🙂",
"pattern": [
{
"startDelay": 100,
"duration": 250,
"weakMagnitude": 1.0,
"strongMagnitude": 0.0
}
]
},
{
"name": "Short Dashed Strong",
"type": "Simple",
"icon": "😇",
"pattern": [
{
"startDelay": 100,
"duration": 250,
"weakMagnitude": 0.0,
"strongMagnitude": 1.0
}
]
},
{
"name": "Short Dashed Max",
"type": "Simple",
"icon": "😊",
"pattern": [
{
"startDelay": 100,
"duration": 250,
"weakMagnitude": 1.0,
"strongMagnitude": 1.0
}
]
},
{
"name": "Long Dashed Weak",
"type": "Simple",
"icon": "😋",
"pattern": [
{
"startDelay": 100,
"duration": 500,
"weakMagnitude": 1.0,
"strongMagnitude": 0.0
}
]
},
{
"name": "Long Dashed Strong",
"type": "Simple",
"icon": "😜",
"pattern": [
{
"startDelay": 100,
"duration": 500,
"weakMagnitude": 0.0,
"strongMagnitude": 1.0
}
]
},
{
"name": "Long Dashed Max",
"type": "Simple",
"icon": "🤪",
"pattern": [
{
"startDelay": 100,
"duration": 500,
"weakMagnitude": 1.0,
"strongMagnitude": 1.0
}
]
},
{
"name": "Constant Weak",
"type": "Simple",
"icon": "😏",
"pattern": [
{
"startDelay": 0,
"duration": 1000,
"weakMagnitude": 1.0,
"strongMagnitude": 0.0
}
]
},
{
"name": "Constant Strong",
"type": "Simple",
"icon": "🤩",
"pattern": [
{
"startDelay": 0,
"duration": 1000,
"weakMagnitude": 0.0,
"strongMagnitude": 1.0
}
]
},
{
"name": "Constant Max",
"type": "Simple",
"icon": "😍",
"pattern": [
{
"startDelay": 0,
"duration": 1000,
"weakMagnitude": 1.0,
"strongMagnitude": 1.0
}
]
} }
] ];
} };
]; };
class Gamepad { class Gamepad {
constructor(gamepad, $container, library) { constructor(gamepad, $container) {
this.unit = gamepad; this.unit = gamepad;
this.$container = $container; this.$container = $container;
this.library = library;
this.init(); this.init();
}; };
@ -60,16 +191,13 @@ class Gamepad {
this.isSelected = false; this.isSelected = false;
this.isVibrating = false; this.isVibrating = false;
this.isLocked = false; this.isLocked = false;
this.library = new Library;
this.cooldown = 0; this.cooldown = 0;
this.index = 0; this.index = 0;
this.pattern = [ this.pattern = this.library.patterns[this.index].pattern;
{
startDelay: 0,
duration: 1000,
weakMagnitude: 1.0,
strongMagnitude: 1.0,
}
];
this.generateBox(); this.generateBox();
}; };
@ -111,7 +239,7 @@ class Gamepad {
}; };
vibrate = async () => { vibrate = async () => {
this.isVibrating = true; this.isVibrating = true;
this.pattern = this.library[this.index].pattern; this.pattern = this.library.patterns[this.index].pattern;
while (this.isVibrating) { while (this.isVibrating) {
for (let i = 0; i < this.pattern.length; i++) { for (let i = 0; i < this.pattern.length; i++) {
@ -130,22 +258,22 @@ class Gamepad {
previous = () => { previous = () => {
if (Date.now() >= this.cooldown) { if (Date.now() >= this.cooldown) {
if (this.index === 0) { if (this.index === 0) {
this.index = this.library.length - 1; this.index = this.library.patterns.length - 1;
} else { } else {
this.index--; this.index--;
}; };
this.pattern = this.library[this.index].pattern; this.pattern = this.library.patterns[this.index].pattern;
this.cooldown = Date.now() + 500; this.cooldown = Date.now() + 500;
}; };
}; };
next = () => { next = () => {
if (Date.now() >= this.cooldown) { if (Date.now() >= this.cooldown) {
if (this.index === this.library.length - 1) { if (this.index === this.library.patterns.length - 1) {
this.index = 0; this.index = 0;
} else { } else {
this.index++; this.index++;
}; };
this.pattern = this.library[this.index].pattern; this.pattern = this.library.patterns[this.index].pattern;
this.cooldown = Date.now() + 500; this.cooldown = Date.now() + 500;
}; };
}; };
@ -158,7 +286,7 @@ class Gamepad {
change = (index) => { change = (index) => {
this.index = index; this.index = index;
this.pattern = this.library[this.index].pattern; this.pattern = this.library.patterns[this.index].pattern;
}; };
}; };
@ -168,7 +296,9 @@ class VibrationMaster {
}; };
init = () => { init = () => {
this.#DOMs(); this.#DOMs();
this.load();
this.library = new Library();
this.print(this.library.patterns);
if (!this.checkGamepadSupport()) { if (!this.checkGamepadSupport()) {
console.log(`This browser does not support of gamepads.`); console.log(`This browser does not support of gamepads.`);
@ -237,17 +367,18 @@ class VibrationMaster {
}; };
load = async () => { load = async () => {
const url = './json/patterns.json'; const url = 'https://eugene-serb.github.io/wavelovers/json/patterns.json';
try {
const response = await fetch(url); const response = await fetch(url);
if (response.ok) {
if (response.ok) { let json = await response.json();
let json = await response.json(); this.library.patterns = json;
this.pattern = json; this.print(this.library.patterns);
this.print(this.pattern); } else {
} else { console.log('Connect to the Internet for download more patterns...');
this.pattern = __PATTERNS; };
this.print(this.pattern); } catch (error) {
console.log('[error]', error);
}; };
}; };
print = (patterns) => { print = (patterns) => {
@ -277,7 +408,7 @@ class VibrationMaster {
if (this.gamepads.length > 0) { if (this.gamepads.length > 0) {
this.gamepads.forEach(gamepad => { this.gamepads.forEach(gamepad => {
if (gamepad.canVibrate === true) { if (gamepad.canVibrate === true) {
this.unselect(); this.unselect(this.library.patterns);
if (gamepad.index === index && if (gamepad.index === index &&
gamepad.isVibrating === true) { gamepad.isVibrating === true) {
gamepad.reset(); gamepad.reset();
@ -285,7 +416,7 @@ class VibrationMaster {
gamepad.reset() gamepad.reset()
gamepad.change(index); gamepad.change(index);
gamepad.vibrate(); gamepad.vibrate();
this.select(index); this.select(this.library.patterns, index);
}; };
}; };
}); });
@ -295,13 +426,13 @@ class VibrationMaster {
}; };
}; };
unselect = () => { unselect = (patterns) => {
this.patterns.forEach(pattern => { patterns.forEach(pattern => {
pattern['container'].classList.remove('pattern-item__selected'); pattern['container'].classList.remove('pattern-item__selected');
}); });
}; };
select = (index) => { select = (patterns, index) => {
this.patterns[index]['container'].classList.add('pattern-item__selected'); patterns[index]['container'].classList.add('pattern-item__selected');
}; };
checkGamepadSupport = () => { checkGamepadSupport = () => {
@ -320,7 +451,7 @@ class VibrationMaster {
if (this.gamepads.length > 1) { if (this.gamepads.length > 1) {
return; return;
} else { } else {
this.gamepads.push(new Gamepad(event.gamepad, this.$DEVICE_LIST, this.patterns)); this.gamepads.push(new Gamepad(event.gamepad, this.$DEVICE_LIST));
}; };
}); });
window.addEventListener('gamepaddisconnected', (event) => { window.addEventListener('gamepaddisconnected', (event) => {