<header class="row">
<p class="small-2 columns">Energy Save Mode</p>
<div class="switch">
<input class="switch-input" id="powerSwitch" type="checkbox" name="exampleSwitch">
<label class="switch-paddle" for="powerSwitch">
<span class="show-for-sr">Download Kittens</span>
</label>
</div>
</header>
<hr />
<div class="row">
<div class="small-12 columns">
<button class=" button" id="btnDrain">Click to drain battery</button>
<p>Counter: <span id="counter1">0</span></p>
<p>Counter: <span id="counter2">50</span></p>
</div>
</div>
const PowerManager = {
events: [],
mode: 0,
addEventListener(el, event, callback) {
if (typeof el === 'string') {
el = document.querySelector(el);
}
const ev = {
start: () => el.addEventListener(event, callback),
stop: () => el.removeEventListener(event, callback),
};
ev.start();
this.events.push(ev);
},
setInterval(callback, interval) {
let id;
const ev = {
start: () => id = setInterval(callback, interval),
stop: () => clearInterval(id),
};
this.events.push(ev);
return ev.start();
},
enterPowerSaveMode() {
if (this.mode === 1) return;
console.log('Entering power save mode');
this.mode = 1;
this.events.forEach((ev) => ev.stop());
},
leavePowerSaveMode() {
if (this.mode === 0) return;
console.log('Leaving power save mode');
this.mode = 0;
this.events.forEach((ev) => ev.start());
},
isInPowerSaveMode() {
return this.mode === 1;
}
};
PowerManager.setInterval(function() {
document.querySelector('#counter1').textContent++;
}, 1000);
PowerManager.setInterval(function() {
document.querySelector('#counter2').textContent++;
}, 1500);
PowerManager.addEventListener('#btnDrain', 'click', function() {
for (let i=0; i < 10; i++) {
document.querySelector('#counter1').textContent++;
document.querySelector('#counter2').textContent++;
}
});
document.querySelector('#powerSwitch').addEventListener('click', function() {
if (PowerManager.isInPowerSaveMode()) {
PowerManager.leavePowerSaveMode();
} else {
PowerManager.enterPowerSaveMode();
}
});
function readBattery(battery) {
if (battery.charging) {
PowerManager.leavePowerSaveMode();
document.querySelector('#powerSwitch').checked = false;
} else {
PowerManager.enterPowerSaveMode();
document.querySelector('#powerSwitch').checked = true;
}
}
if (navigator.getBattery) {
navigator.getBattery().then(function(battery) {
battery.addEventListener('chargingchange', function() {
readBattery(battery);
});
battery.addEventListener('levelchange', function() {
readBattery(battery);
});
readBattery(battery);
});
} else {
document.querySelector('.not-support').removeAttribute('hidden');
}
