4.20.61

This was a small update until Twitch ripped out half their CSS.

* Added: Cross-Origin Storage Bridge for settings, better synchronizing settings on sub-domains with support for binary blobs at the cost of slightly increased start-up time.
* Fixed: Rendering issues caused by missing CSS.
* Fixed: FFZ Control Center button not appearing on dashboard pages, and appearing in the incorrect place.
* Changed: Work towards splitting modules into their own JS files for a faster, more asynchronous startup.
* API Added: Methods for serializing and deserializing Blobs for transmission across postMessage.

src/player.js

@@ -0,0 +1,151 @@
+'use strict';
+
+import RavenLogger from './raven';
+
+import Logger from 'utilities/logging';
+import Module from 'utilities/module';
+import { timeout } from 'utilities/object';
+
+import {DEBUG} from 'utilities/constants';
+
+import SettingsManager from './settings/index';
+import ExperimentManager from './experiments';
+import {TranslationManager} from './i18n';
+
+class FFZPlayer extends Module {
+	constructor() {
+		super();
+		const start_time = performance.now(),
+			VER = FFZPlayer.version_info;
+
+		FFZPlayer.instance = this;
+
+		this.name = 'ffz_player';
+		this.__state = 0;
+		this.__modules.core = this;
+
+		// ========================================================================
+		// Error Reporting and Logging
+		// ========================================================================
+
+		this.inject('raven', RavenLogger);
+
+		this.log = new Logger(null, null, null, this.raven);
+		this.log.label = 'FFZPlayer';
+		this.log.init = true;
+
+		this.core_log = this.log.get('core');
+
+		this.log.info(`FrankerFaceZ Standalone Player v${VER} (build ${VER.build}${VER.commit ? ` - commit ${VER.commit}` : ''})`);
+
+
+		// ========================================================================
+		// Core Systems
+		// ========================================================================
+
+		this.inject('settings', SettingsManager);
+		this.inject('experiments', ExperimentManager);
+		this.inject('i18n', TranslationManager);
+
+
+		// ========================================================================
+		// Startup
+		// ========================================================================
+
+		this.enable().then(() => {
+			const duration = performance.now() - start_time;
+			this.core_log.info(`Initialization complete in ${duration.toFixed(5)}ms.`);
+			this.log.init = false;
+		}).catch(err => {
+			this.core_log.error(`An error occurred during initialization.`, err);
+			this.log.init = false;
+		});
+	}
+
+	static get() {
+		return FFZPlayer.instance;
+	}
+
+	// ========================================================================
+	// Generate Log
+	// ========================================================================
+
+	async generateLog() {
+		const promises = [];
+		for(const key in this.__modules) { // eslint-disable-line guard-for-in
+			const module = this.__modules[key];
+			if ( module instanceof Module && module.generateLog && module != this )
+				promises.push((async () => {
+					try {
+						return [
+							key,
+							await timeout(Promise.resolve(module.generateLog()), 5000)
+						];
+					} catch(err) {
+						return [
+							key,
+							`Error: ${err}`
+						]
+					}
+				})());
+		}
+
+		const out = await Promise.all(promises);
+
+		if ( this.log.captured_init && this.log.captured_init.length > 0 ) {
+			const logs = [];
+			for(const msg of this.log.captured_init) {
+				const time = dayjs(msg.time).locale('en').format('H:mm:ss');
+				logs.push(`[${time}] ${msg.level} | ${msg.category || 'core'}: ${msg.message}`);
+			}
+
+			out.unshift(['initialization', logs.join('\n')]);
+		}
+
+		return out.map(x => `${x[0]}
+-------------------------------------------------------------------------------
+${typeof x[1] === 'string' ? x[1] : JSON.stringify(x[1], null, 4)}`).join('\n\n');
+	}
+
+	async onEnable() {
+
+	}
+
+}
+
+
+FFZPlayer.Logger = Logger;
+
+const VER = FFZPlayer.version_info = {
+	major: __version_major__,
+	minor: __version_minor__,
+	revision: __version_patch__,
+	extra: __version_prerelease__?.length && __version_prerelease__[0],
+	commit: __git_commit__,
+	build: __webpack_hash__,
+	toString: () =>
+		`${VER.major}.${VER.minor}.${VER.revision}${VER.extra || ''}${DEBUG ? '-dev' : ''}`
+}
+
+FFZPlayer.utilities = {
+	addon: require('utilities/addon'),
+	color: require('utilities/color'),
+	constants: require('utilities/constants'),
+	dialog: require('utilities/dialog'),
+	dom: require('utilities/dom'),
+	events: require('utilities/events'),
+	fontAwesome: require('utilities/font-awesome'),
+	graphql: require('utilities/graphql'),
+	logging: require('utilities/logging'),
+	module: require('utilities/module'),
+	object: require('utilities/object'),
+	time: require('utilities/time'),
+	tooltip: require('utilities/tooltip'),
+	i18n: require('utilities/translation-core'),
+	dayjs: require('dayjs'),
+	popper: require('popper.js').default
+}
+
+
+window.FFZPlayer = FFZPlayer;
+window.ffz_player = new FFZPlayer();