123456789101112131415161718192021222324252627282930313233343536373839404142434445 |
- import { buildLaunchContainer, buildRefinedPage } from './templates';
- import './style.css';
-
- const run = async () => {
- const $ = (selector) => document.querySelector(selector);
- const fetchParam = (name) => {
- const param = window.location.search
- .substr(1)
- .split('&')
- .map((param) => param.split('='))
- .find((param) => param[0] === name);
- return param ? param[1] : undefined;
- };
-
- const refinePage = (page) => ($('html').innerHTML = page);
-
- const videoId = fetchParam('v');
- const refineImmediately = fetchParam('refined') ? true : false;
-
- if (videoId !== undefined) {
- if (refineImmediately) {
- refinePage(buildRefinedPage(videoId));
- } else {
- const launchContainer = document.createElement('div');
- launchContainer.innerHTML = buildLaunchContainer(videoId);
- document.body.append(launchContainer);
-
- const launchButton = $('#refined-youtube-launch-button');
- const launchCloseButton = $('#refined-youtube-launch-close-button');
-
- launchButton.addEventListener('click', () =>
- refinePage(buildRefinedPage(videoId))
- );
- launchCloseButton.addEventListener('click', () => {
- const launchContainer = $('#refined-youtube-launch-container');
- launchContainer.style.opacity = 0;
- setTimeout(() => {
- launchContainer.remove();
- }, 1000);
- });
- }
- }
- };
-
- run();
|