'use strict'; // ============================================================================ // Site Support: Twitch Twilight // ============================================================================ import BaseSite from '../base'; import WebMunch from 'utilities/compat/webmunch'; import Fine from 'utilities/compat/fine'; import FineRouter from 'utilities/compat/fine-router'; import Apollo from 'utilities/compat/apollo'; import {createElement} from 'utilities/dom'; import MAIN_URL from 'site/styles/main.scss'; // ============================================================================ // The Site // ============================================================================ export default class Twilight extends BaseSite { constructor(...args) { super(...args); this.inject(WebMunch); this.inject(Fine); this.inject('router', FineRouter); this.inject(Apollo); } onLoad() { this.populateModules(); this.web_munch.known(Twilight.KNOWN_MODULES); this.router.route(Twilight.ROUTES); } onEnable() { const thing = this.fine.searchTree(null, n => n.props && n.props.store), store = this.store = thing && thing.props && thing.props.store; if ( ! store ) return new Promise(r => setTimeout(r, 50)).then(() => this.onEnable()); // Share Context store.subscribe(() => this.updateContext()); this.updateContext(); this.router.on(':route', (route, match) => { this.log.info('Navigation', route && route.name, match && match[0]); this.fine.route(route && route.name); }); const current = this.router.current; this.fine.route(current && current.name); document.head.appendChild(createElement('link', { href: MAIN_URL, rel: 'stylesheet', type: 'text/css' })); // Check for ?ffz-settings in page and open the // settings window in exclusive mode. const params = new URL(window.location).searchParams; if (params && params.has('ffz-settings')) { const main_menu = this.resolve('main_menu'); main_menu.exclusive = true; main_menu.enable(); } } updateContext() { try { const state = this.store.getState(), history = this.router && this.router.history; this.settings.updateContext({ location: history && history.location, ui: state && state.ui, session: state && state.session }); } catch(err) { this.log.error('Error updating context.', err); } } getSession() { const state = this.store && this.store.getState(); return state && state.session; } getUser() { const session = this.getSession(); return session && session.user; } getCore() { if ( this._core ) return this._core; let core = this.web_munch.getModule('core-1'); if ( core ) return this._core = core.o; core = this.web_munch.getModule('core-2'); if ( core ) return this._core = core.p; } } Twilight.KNOWN_MODULES = { simplebar: n => n.globalObserver && n.initDOMLoadedElements, react: n => n.Component && n.createElement, 'core-1': n => n.o && n.o.experiments, 'core-2': n => n.p && n.p.experiments, cookie: n => n && n.set && n.get && n.getJSON && n.withConverter, 'extension-service': n => n.extensionService, 'chat-types': n => n.a && n.a.PostWithMention, 'gql-printer': n => n !== window && n.print } Twilight.CHAT_ROUTES = [ 'collection', 'popout', 'video', 'user-videos', 'user-clips', 'user-events', 'user-followers', 'user-following', 'user' ] Twilight.ROUTES = { 'front-page': '/', 'collection': '/collections/:collectionID', 'dir': '/directory', 'dir-community': '/communities/:communityName', 'dir-community-index': '/directory/communities', 'dir-creative': '/directory/creative', 'dir-following': '/directory/following/:category?', 'dir-game-clips': '/directory/game/:gameName/clips', 'dir-game-details': '/directory/game/:gameName/details', 'dir-game-videos': '/directory/game/:gameName/videos/:filter', 'dir-game-index': '/directory/game/:gameName', 'dir-all': '/directory/all/:filter?', 'dir-category': '/directory/:category?', 'event': '/event/:eventName', 'popout': '/popout/:userName/chat', 'video': '/videos/:videoID', 'user-videos': '/:userName/videos/:filter?', 'user-clips': '/:userName/clips', 'user-collections': '/:userName/collections', 'user-events': '/:userName/events', 'user-followers': '/:userName/followers', 'user-following': '/:userName/following', 'user': '/:userName' }