Updated load function

This commit is contained in:
Eugene Serb 2022-06-18 21:24:30 +03:00
parent 5874decda2
commit fe8895f07c
3 changed files with 52 additions and 159 deletions

View File

@ -419,6 +419,9 @@ table, th, td {
} }
.message { .message {
width: 100%;
display: flex;
justify-content: center;
text-align: center; text-align: center;
font-size: 24px; font-size: 24px;
} }

View File

@ -97,7 +97,11 @@
<h1 class="visually-hidden">Wavelovers</h1> <h1 class="visually-hidden">Wavelovers</h1>
<div class="wavelovers"> <div class="wavelovers">
<div id="pattern-box" class="content pattern-box"> <div id="pattern-box" class="content pattern-box">
<div id="pattern-list" class="pattern-list"></div> <div id="pattern-list" class="pattern-list">
<div class="message">
<span>Loading...</span>
</div>
</div>
</div> </div>
<div id="device-box" class="content"> <div id="device-box" class="content">
<div class="message"> <div class="message">

View File

@ -5,166 +5,45 @@
'use strict'; 'use strict';
const __PATTERNS = [ const __PATTERNS = [
/* Dotted, 0.1s, 0.1s */
{ {
name: 'Dotted Weak', "name": "Constant Weak",
type: 'Simple', "type": "Simple",
icon: '😌', "icon": "😏",
pattern: [ "pattern": [
{ {
startDelay: 100, "startDelay": 0,
duration: 100, "duration": 1000,
weakMagnitude: 1.0, "weakMagnitude": 1.0,
strongMagnitude: 0.0, "strongMagnitude": 0.0
}, }
], ]
}, },
{ {
name: 'Dotted Strong', "name": "Constant Strong",
type: 'Simple', "type": "Simple",
icon: '😉', "icon": "🤩",
pattern: [ "pattern": [
{ {
startDelay: 100, "startDelay": 0,
duration: 100, "duration": 1000,
weakMagnitude: 0.0, "weakMagnitude": 0.0,
strongMagnitude: 1.0, "strongMagnitude": 1.0
}, }
], ]
}, },
{ {
name: 'Dotted Max', "name": "Constant Max",
type: 'Simple', "type": "Simple",
icon: '🙃', "icon": "😍",
pattern: [ "pattern": [
{ {
startDelay: 100, "startDelay": 0,
duration: 100, "duration": 1000,
weakMagnitude: 1.0, "weakMagnitude": 1.0,
strongMagnitude: 1.0, "strongMagnitude": 1.0
}, }
], ]
}, }
/* Short Dashed, 0.1s, 0.25s */
{
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,
},
],
},
/* Long Dashed, 0.1s, 0.5s */
{
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,
},
],
},
/* Constant, 0s, 1s */
{
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 {
@ -289,9 +168,6 @@ class VibrationMaster {
}; };
init = () => { init = () => {
this.#DOMs(); this.#DOMs();
this.patterns = __PATTERNS;
this.print(this.patterns);
this.load(); this.load();
if (!this.checkGamepadSupport()) { if (!this.checkGamepadSupport()) {
@ -360,9 +236,19 @@ class VibrationMaster {
}; };
}; };
load = () => { load = async () => {
const response = fetch('./json/patterns.json'); const url = './json/patterns.json';
console.log(response);
const response = await fetch(url);
if (response.ok) {
let json = await response.json();
this.pattern = json;
this.print(this.pattern);
} else {
this.pattern = __PATTERNS;
this.print(this.pattern);
};
}; };
print = (patterns) => { print = (patterns) => {
this.$PATTERN_LIST.innerHTML = ''; this.$PATTERN_LIST.innerHTML = '';