|
|
@@ -0,0 +1,174 @@
|
|
|
+// Светофор + domEventPromise
|
|
|
+
|
|
|
+// function delay(ms) {
|
|
|
+// return new Promise(ok => setTimeout(() => ok(ms), ms)).then(response => console.log(response));
|
|
|
+// }
|
|
|
+//
|
|
|
+// let div = document.createElement('div');
|
|
|
+// let div1 = document.createElement('div');
|
|
|
+// let div2 = document.createElement('div');
|
|
|
+//
|
|
|
+// div.className = 'trafficLight';
|
|
|
+// div1.className = 'trafficLight';
|
|
|
+// div2.className = 'trafficLight';
|
|
|
+//
|
|
|
+// placeForTrafficLight.appendChild(div);
|
|
|
+// placeForTrafficLight.appendChild(div1);
|
|
|
+// placeForTrafficLight.appendChild(div2);
|
|
|
+//
|
|
|
+// let promise = async function trafficLight() {
|
|
|
+//
|
|
|
+// while (true) {
|
|
|
+// div.style.background = 'green';
|
|
|
+// div1.style.background = 'white';
|
|
|
+// div2.style.background = 'white';
|
|
|
+// await delay(4000);
|
|
|
+// div.style.background = 'white';
|
|
|
+// div1.style.background = 'yellow';
|
|
|
+// div2.style.background = 'white';
|
|
|
+// await delay(2000);
|
|
|
+// div.style.background = 'white';
|
|
|
+// div1.style.background = 'white';
|
|
|
+// div2.style.background = 'red';
|
|
|
+// await delay(30000);
|
|
|
+// }
|
|
|
+// };
|
|
|
+//
|
|
|
+// promise().then(response => console.log(response));
|
|
|
+//
|
|
|
+// function domEventPromise(button, eventName) {
|
|
|
+// return new Promise((resolve) => {
|
|
|
+// button.addEventListener(eventName, (event) => {
|
|
|
+// resolve(event);
|
|
|
+// button.disabled = true;
|
|
|
+// });
|
|
|
+//
|
|
|
+// button.removeEventListener(eventName, (event) => {
|
|
|
+// resolve(event.delay(4000));
|
|
|
+// });
|
|
|
+// });
|
|
|
+// }
|
|
|
+//
|
|
|
+// let button = document.createElement('button');
|
|
|
+// button.className = 'buttonTraficLight';
|
|
|
+// button.textContent = 'Push';
|
|
|
+// placeForButton.appendChild(button);
|
|
|
+//
|
|
|
+// const pushPromise = domEventPromise(button, 'click');
|
|
|
+// pushPromise.then(e => console.log('event click happens', e));
|
|
|
+
|
|
|
+
|
|
|
+// PedestrianTrafficLight
|
|
|
+
|
|
|
+function delay(ms) {
|
|
|
+ return new Promise(ok => setTimeout(() => ok(ms), ms)).then(response => console.log(response));
|
|
|
+}
|
|
|
+
|
|
|
+let div = document.createElement('div');
|
|
|
+let div1 = document.createElement('div');
|
|
|
+let div2 = document.createElement('div');
|
|
|
+
|
|
|
+div.className = 'trafficLight';
|
|
|
+div1.className = 'trafficLight';
|
|
|
+div2.className = 'trafficLight';
|
|
|
+
|
|
|
+placeForTrafficLight.appendChild(div);
|
|
|
+placeForTrafficLight.appendChild(div1);
|
|
|
+placeForTrafficLight.appendChild(div2);
|
|
|
+
|
|
|
+let button = document.createElement('button');
|
|
|
+button.className = 'buttonTraficLight';
|
|
|
+button.textContent = 'Push';
|
|
|
+placeForButton.appendChild(button);
|
|
|
+
|
|
|
+async function pedestrianTrafficLight() {
|
|
|
+ while (true) {
|
|
|
+ switch ('red') {
|
|
|
+ case 'red':
|
|
|
+ div.style.background = 'red';
|
|
|
+ div1.style.background = 'white';
|
|
|
+ div2.style.background = 'white';
|
|
|
+ button.disabled = true;
|
|
|
+ await delay(4000);
|
|
|
+ button.disabled = false;
|
|
|
+ await Promise.race([delay(10000), domEventPromise(button, 'click').then(e => console.log('event click happens', e))]);
|
|
|
+ }
|
|
|
+ switch ('yellow') {
|
|
|
+ case 'yellow':
|
|
|
+ div.style.background = 'white';
|
|
|
+ div1.style.background = 'yellow';
|
|
|
+ div2.style.background = 'white';
|
|
|
+ await Promise.race([delay(1000), domEventPromise(button, 'click').then(e => console.log('event click happens', e))]);
|
|
|
+
|
|
|
+ }
|
|
|
+ switch ('green') {
|
|
|
+ case 'green':
|
|
|
+ button.disabled = true;
|
|
|
+ div.style.background = 'white';
|
|
|
+ div1.style.background = 'white';
|
|
|
+ div2.style.background = 'green';
|
|
|
+ await delay(3000);
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+pedestrianTrafficLight();
|
|
|
+
|
|
|
+function domEventPromise(button, eventName) {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ button.addEventListener(eventName, (event) => {
|
|
|
+ resolve(event);
|
|
|
+ });
|
|
|
+
|
|
|
+ button.removeEventListener(eventName, (event) => {
|
|
|
+ resolve(event);
|
|
|
+ });
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+function delay(ms) {
|
|
|
+ return new Promise(ok => setTimeout(() => ok(ms), ms)).then(response => console.log(response));
|
|
|
+}
|
|
|
+
|
|
|
+async function speedtest(getPromise, count, parallel = 1) {
|
|
|
+ let counter = 0;
|
|
|
+ let paralCount = 0;
|
|
|
+ let arrPromises = [];
|
|
|
+
|
|
|
+ const start = new Date().getTime();
|
|
|
+
|
|
|
+ while (counter !== count) {
|
|
|
+ counter++;
|
|
|
+
|
|
|
+ while (paralCount !== parallel) {
|
|
|
+ paralCount++;
|
|
|
+ arrPromises.push(await getPromise());
|
|
|
+ }
|
|
|
+ Promise.all([arrPromises]).then(result => console.log(result));
|
|
|
+ }
|
|
|
+
|
|
|
+ const end = new Date().getTime();
|
|
|
+
|
|
|
+ let duration = end - start;
|
|
|
+
|
|
|
+ let parallelDuration = duration / (count * parallel);
|
|
|
+
|
|
|
+ let parallelSpeed = parallel / parallelDuration;
|
|
|
+
|
|
|
+ let queryDuration = duration / count;
|
|
|
+
|
|
|
+ let querySpeed = count / queryDuration;
|
|
|
+
|
|
|
+ return {
|
|
|
+ duration,
|
|
|
+ querySpeed,
|
|
|
+ queryDuration,
|
|
|
+ parallelSpeed,
|
|
|
+ parallelDuration
|
|
|
+ };
|
|
|
+}
|
|
|
+
|
|
|
+speedtest(() => delay(1000), 10, 10).then(result => console.log(result));
|
|
|
+// // speedtest(() => fetch('http://swapi.dev/api/people/1').then(res => res.json()), 10, 5);
|
|
|
+
|
|
|
+
|
