1. DVR record apply support regex, for usage: please enter
config file -dvr_apply and start regex with /^xxx$/
2. Add custom homepage for player, enter the url
localhost:8080/players/homepage.html to access
3. Add WHEP player, enter the url localhost:8080/players/whep_itp.html
4. Convert Files Format from CRLF to LF (Windows to Linux)
* Known Issues:
1. There is a unsmooth swup between hompage and player page, Swup.js
will be used to fix this issue in the future.
67 lines
2.9 KiB
JavaScript
67 lines
2.9 KiB
JavaScript
const btns = document.querySelectorAll('.btn');
|
|
const toastContainer = document.querySelector('.toast');
|
|
const buttonYes = document.querySelector('#buttonsYes');
|
|
const buttonNo = document.querySelector('#buttonsNo');
|
|
const buttonsContainer = document.querySelector('#buttonsDiv');
|
|
|
|
const options = {
|
|
regular: {
|
|
heading: 'This is a Regular notification',
|
|
paragraph: 'This toast message notifies you of something. Whatever that may be.',
|
|
svg: ''
|
|
},
|
|
success: {
|
|
heading: 'This is a Success notification',
|
|
paragraph: 'This toast message notifies you of all your great successes. You rock!',
|
|
svg: '<div class="toast__icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="m9 20.42l-6.21-6.21l2.83-2.83L9 14.77l9.88-9.89l2.83 2.83z"/></svg></div>'
|
|
},
|
|
error: {
|
|
heading: 'This is an Error notification',
|
|
paragraph: 'This toast message notifies you of an Error. Don\'t worry it\'s probably not your fault.',
|
|
svg: '<div class="toast__icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="currentColor" d="M15.1 3.1L12.9.9L8 5.9L3.1.9L.9 3.1l5 4.9l-5 4.9l2.2 2.2l4.9-5l4.9 5l2.2-2.2l-5-4.9z"/></svg></div>'
|
|
},
|
|
warning: {
|
|
heading: 'This is a Warning notification',
|
|
paragraph: 'This toast message notifies you of a Warning. Who knows what might have happened.',
|
|
svg: '<div class="toast__icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M11 14V5h2v9zm0 5v-2h2v2z"/></svg></div>'
|
|
}
|
|
}
|
|
|
|
function createToast({type='regular', buttons='false', close='true', heading='', paragraph='', button1='', button2=''}) {
|
|
const html = `
|
|
<div class="toast__message toast__message--${type}">
|
|
${options[type].svg}
|
|
<div class="toast__text">
|
|
<h3 class="toast__heading">
|
|
${heading ? heading : options[type].heading}
|
|
</h3>
|
|
<p>
|
|
${paragraph ? paragraph : options[type].paragraph}
|
|
</p>
|
|
</div>
|
|
${close === 'true' ? `<span class="toast__close">×</span>` : ''}
|
|
|
|
</div>
|
|
`;
|
|
toastContainer.insertAdjacentHTML('beforeend', html);
|
|
|
|
const toast = toastContainer.lastElementChild;
|
|
toast.addEventListener('animationend', () => toast.remove());
|
|
}
|
|
|
|
function resetForm() {
|
|
document.querySelector('#heading').value = '';
|
|
document.querySelector('#paragraph').value = '';
|
|
}
|
|
|
|
btns.forEach(btn => btn.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
const close = document.querySelector('input[name=close]:checked').value;
|
|
const heading = document.querySelector('#heading').value;
|
|
const paragraph = document.querySelector('#paragraph').value;
|
|
resetForm();
|
|
createToast({type: this.value, close, heading, paragraph});
|
|
}));
|
|
|
|
|