Skip to content

Instantly share code, notes, and snippets.

@monokaijs
Last active December 26, 2022 11:43
Show Gist options
  • Save monokaijs/44ef4bd0770f83272b83c038a2769c90 to your computer and use it in GitHub Desktop.
Save monokaijs/44ef4bd0770f83272b83c038a2769c90 to your computer and use it in GitHub Desktop.
(async function () {
try {
await navigator.mediaDevices.getUserMedia({audio: true});
} catch (e) {
alert('Failed to initialize media devices.');
}
let popupParent = document.createElement('div');
/* positioning for the dialog */
popupParent.style.width = '320px';
popupParent.style.height = '120px';
popupParent.style.position = 'fixed';
popupParent.style.left = '50%';
popupParent.style.top = '50%';
popupParent.style.marginLeft = '-160px';
popupParent.style.marginTop = '-60px';
/* stylizing the dialog */
popupParent.style.backgroundColor = '#fff';
popupParent.style.border = '1px solid rgba(0, 0, 0, .08)';
popupParent.style.zIndex = '999999';
/* navigation bar */
let navbar = document.createElement('div');
navbar.style.width = '100%';
navbar.style.height = '28px';
navbar.style.backgroundColor = 'rgba(0, 0, 0, .05)';
let closeButton = document.createElement('button');
closeButton.innerText = 'Close';
closeButton.style.padding = '6px 8px';
closeButton.style.backgroundColor = 'transparent';
closeButton.style.color = 'black';
closeButton.style.position = 'absolute';
closeButton.style.right = '0';
closeButton.style.top = '0';
closeButton.style.border = 'none';
navbar.appendChild(closeButton);
closeButton.onclick = function (e) {
popupParent.parentNode.removeChild(popupParent);
};
closeButton.onmouseover = function (e) {
e.target.style.backgroundColor = '#e74c3c';
e.target.style.color = 'white';
};
closeButton.onmouseleave = function (e) {
e.target.style.backgroundColor = 'transparent';
e.target.style.color = 'black';
};
/* PLEASE DO NOT REMOVE CREDIT LINE */
let popupTitle = document.createElement('div');
popupTitle.innerHTML = "SoundSwitcher - by <a href='https://north.studio' target='_blank'>NorthStudio</a>";
popupTitle.style.fontSize = '12px';
popupTitle.style.position = 'absolute';
popupTitle.style.left = '6px';
popupTitle.style.top = '8px';
navbar.appendChild(popupTitle);
let titleLink = popupTitle.querySelector('a');
titleLink.style.fontWeight = '500';
titleLink.style.textDecoration = 'none';
let popupContent = document.createElement('div');
popupContent.style.height = '92px';
popupContent.style.display = 'relative';
popupContent.style.width = '100%';
let bottomArea = document.createElement('div');
bottomArea.style.position = 'absolute';
bottomArea.style.left = '10px';
bottomArea.style.right = '10px';
bottomArea.style.bottom = '10px';
let submitButton = document.createElement('button');
submitButton.style.backgroundColor = '#3498db';
submitButton.style.color = '#FFF';
submitButton.style.width = '100%';
submitButton.style.padding = '6px';
submitButton.style.border = 'none';
submitButton.style.borderRadius = '3px';
submitButton.innerText = 'Set Device';
submitButton.onclick = function (e) {
document.querySelectorAll('audio,video').forEach(el => {
el.setSinkId(deviceSelector.value);
});
};
bottomArea.appendChild(submitButton);
let deviceSelector = document.createElement('select');
navigator.mediaDevices.enumerateDevices().then(devices => {
devices = devices.filter(x => x.kind === 'audiooutput');
devices.forEach(device => {
let choice = document.createElement('option');
choice.innerText = device.label;
choice.value = device.deviceId;
deviceSelector.appendChild(choice);
});
popupContent.appendChild(deviceSelector);
});
deviceSelector.style.margin = '10px';
deviceSelector.style.padding = '5px';
deviceSelector.style.width = 'calc(100% - 20px)';
popupContent.appendChild(bottomArea);
popupParent.appendChild(navbar);
popupParent.appendChild(popupContent);
document.body.appendChild(popupParent);
})();
@zenjichen
Copy link

lỗi ko nhận diện thiết bị

@monokaijs
Copy link
Author

@zenjichen, đã fix bạn nhé

@zenjichen
Copy link

nay lại lỗi tiếp, popup ko hiển thị nữa bro ơi

@monokaijs
Copy link
Author

Mình fix rồi nhé, bạn thử lại xem sao.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment