diff --git a/package.json b/package.json index ce29cd9f7..e6c06be5f 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "description": "Core components of the extensible media player for the web", "main": "./dist/clappr-core.js", "module": "./dist/clappr-core.esm.js", + "types": "./types/main.d.ts", "scripts": { "bundle-check": "ANALYZE_BUNDLE=true rollup --config", "release": "MINIMIZE=true rollup --config", @@ -48,6 +49,7 @@ "@rollup/plugin-json": "^4.1.0", "@rollup/plugin-node-resolve": "^13.1.3", "@rollup/plugin-replace": "^3.0.1", + "@types/zepto": "^1.0.34", "autoprefixer": "10.4.2", "babel-jest": "^26.6.3", "clappr-zepto": "0.0.7", @@ -69,7 +71,8 @@ "rollup-plugin-serve": "^1.1.0", "rollup-plugin-sizes": "^1.0.4", "rollup-plugin-terser": "^7.0.2", - "rollup-plugin-visualizer": "^5.5.4" + "rollup-plugin-visualizer": "^5.5.4", + "typescript": "^5.1.6" }, "config": { "commitizen": { diff --git a/src/base/base_object/base_object.js b/src/base/base_object/base_object.js index 34b74e1af..c794f3ebd 100644 --- a/src/base/base_object/base_object.js +++ b/src/base/base_object/base_object.js @@ -25,13 +25,21 @@ export default class BaseObject extends Events { */ constructor(options={}) { super(options) + + /** + * the options + * + * @property _options + * @type {Object} + */ this._options = options + + /** + * a unique id prefixed with `'o'`, `o1, o232` + * + * @property uniqueId + * @type String + */ this.uniqueId = uniqueId('o') } - /** - * a unique id prefixed with `'o'`, `o1, o232` - * - * @property uniqueId - * @type String - */ } diff --git a/src/base/container_plugin/container_plugin.js b/src/base/container_plugin/container_plugin.js index 09ede1f3b..0393aaba8 100644 --- a/src/base/container_plugin/container_plugin.js +++ b/src/base/container_plugin/container_plugin.js @@ -15,6 +15,11 @@ export default class ContainerPlugin extends BaseObject { constructor(container) { super(container.options) this.container = container + + /** + * @property enabled + * @type {boolean} + */ this.enabled = true this.bindEvents() } diff --git a/src/base/core_plugin/core_plugin.js b/src/base/core_plugin/core_plugin.js index 076f275e1..c973737e9 100644 --- a/src/base/core_plugin/core_plugin.js +++ b/src/base/core_plugin/core_plugin.js @@ -8,6 +8,11 @@ export default class CorePlugin extends BaseObject { constructor(core) { super(core.options) this.core = core + + /** + * @property enabled + * @type {boolean} + */ this.enabled = true this.bindEvents() } diff --git a/src/base/events/events.js b/src/base/events/events.js index ff9387b3f..5eca88602 100644 --- a/src/base/events/events.js +++ b/src/base/events/events.js @@ -9,6 +9,14 @@ const slice = Array.prototype.slice const eventSplitter = /\s+/ +/** + * @function eventsApi + * @param {Object} obj + * @param {string} action + * @param {string} name + * @param {(string[]|Function)} rest + * @returns {boolean} + */ const eventsApi = function(obj, action, name, rest) { if (!name) return true @@ -32,6 +40,16 @@ const eventsApi = function(obj, action, name, rest) { return true } +/** + * + * @param {Object[]} events + * @param {Function} events[].callback + * @param {Object} events[].context + * @param {Object} events[].ctx + * @param {*[]} args + * @param {string} klass + * @param {string} name + */ const triggerEvents = function(events, args, klass, name) { let ev, i = -1 const l = events.length, a1 = args[0], a2 = args[1], a3 = args[2] @@ -168,6 +186,10 @@ export default class Events { return this } + /** + * @static + * @param {string} eventName + */ static register(eventName) { Events.Custom || (Events.Custom = {}) let property = typeof eventName === 'string' && eventName.toUpperCase().trim() @@ -181,6 +203,10 @@ export default class Events { } + /** + * @static + * @returns {*[]} + */ static listAvailableCustomEvents() { Events.Custom || (Events.Custom = {}) return Object.keys(Events.Custom).filter((property) => typeof Events.Custom[property] === 'string') @@ -199,6 +225,15 @@ export default class Events { * this.listenTo(this.core.playback, Events.PLAYBACK_PAUSE, this.callback) * ``` */ +Events.prototype.listenTo = function(obj, name, callback) { + const listeningTo = this._listeningTo || (this._listeningTo = {}) + const id = obj._listenId || (obj._listenId = uniqueId('l')) + listeningTo[id] = obj + if (!callback && typeof name === 'object') callback = this + obj.on(name, callback, this) + return this +} + /** * listen to an event once for a given `obj` * @method listenToOnce @@ -211,18 +246,14 @@ export default class Events { * this.listenToOnce(this.core.playback, Events.PLAYBACK_PAUSE, this.callback) * ``` */ -const listenMethods = { listenTo: 'on', listenToOnce: 'once' } - -Object.keys(listenMethods).forEach(function(method) { - Events.prototype[method] = function(obj, name, callback) { - const listeningTo = this._listeningTo || (this._listeningTo = {}) - const id = obj._listenId || (obj._listenId = uniqueId('l')) - listeningTo[id] = obj - if (!callback && typeof name === 'object') callback = this - obj[listenMethods[method]](name, callback, this) - return this - } -}) +Events.prototype.listenToOnce = function(obj, name, callback) { + const listeningTo = this._listeningTo || (this._listeningTo = {}) + const id = obj._listenId || (obj._listenId = uniqueId('l')) + listeningTo[id] = obj + if (!callback && typeof name === 'object') callback = this + obj.once(name, callback, this) + return this +} // PLAYER EVENTS /** diff --git a/src/base/media.js b/src/base/media.js index 808fa4954..93e5ddc39 100644 --- a/src/base/media.js +++ b/src/base/media.js @@ -1,5 +1,8 @@ /* istanbul ignore file */ // https://github.com/mathiasbynens/small +/** + * @type {string} + */ export const mp4 = 'data:video/mp4;base64,AAAAHGZ0eXBpc29tAAACAGlzb21pc28ybXA0MQAAAAhmcmVlAAAC721kYXQhEAUgpBv/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA3pwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAcCEQBSCkG//AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADengAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAcAAAAsJtb292AAAAbG12aGQAAAAAAAAAAAAAAAAAAAPoAAAALwABAAABAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAAAB7HRyYWsAAABcdGtoZAAAAAMAAAAAAAAAAAAAAAIAAAAAAAAALwAAAAAAAAAAAAAAAQEAAAAAAQAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAACRlZHRzAAAAHGVsc3QAAAAAAAAAAQAAAC8AAAAAAAEAAAAAAWRtZGlhAAAAIG1kaGQAAAAAAAAAAAAAAAAAAKxEAAAIAFXEAAAAAAAtaGRscgAAAAAAAAAAc291bgAAAAAAAAAAAAAAAFNvdW5kSGFuZGxlcgAAAAEPbWluZgAAABBzbWhkAAAAAAAAAAAAAAAkZGluZgAAABxkcmVmAAAAAAAAAAEAAAAMdXJsIAAAAAEAAADTc3RibAAAAGdzdHNkAAAAAAAAAAEAAABXbXA0YQAAAAAAAAABAAAAAAAAAAAAAgAQAAAAAKxEAAAAAAAzZXNkcwAAAAADgICAIgACAASAgIAUQBUAAAAAAfQAAAHz+QWAgIACEhAGgICAAQIAAAAYc3R0cwAAAAAAAAABAAAAAgAABAAAAAAcc3RzYwAAAAAAAAABAAAAAQAAAAIAAAABAAAAHHN0c3oAAAAAAAAAAAAAAAIAAAFzAAABdAAAABRzdGNvAAAAAAAAAAEAAAAsAAAAYnVkdGEAAABabWV0YQAAAAAAAAAhaGRscgAAAAAAAAAAbWRpcmFwcGwAAAAAAAAAAAAAAAAtaWxzdAAAACWpdG9vAAAAHWRhdGEAAAABAAAAAExhdmY1Ni40MC4xMDE=' export default { diff --git a/src/base/playback/playback.js b/src/base/playback/playback.js index 5e1c05270..b3ff1b3aa 100644 --- a/src/base/playback/playback.js +++ b/src/base/playback/playback.js @@ -31,6 +31,10 @@ export default class Playback extends UIObject { return false } + /** + * @property isAdaptive + * @return {boolean} + */ get isAdaptive() { return false } @@ -38,7 +42,7 @@ export default class Playback extends UIObject { /** * Determine if the playback has ended. * @property ended - * @type Boolean + * @type {boolean} */ get ended() { return false @@ -71,9 +75,21 @@ export default class Playback extends UIObject { */ constructor(options, i18n, playerError) { super(options) + /** + * @property settings + * @type {Object} + */ this.settings = {} + /** + * @property _i18n + * @type {string} + */ this._i18n = i18n this.playerError = playerError + /** + * @property _consented + * @type {boolean} + */ this._consented = false } diff --git a/src/base/styler/styler.js b/src/base/styler/styler.js index 0fee5d0fe..38f572e30 100644 --- a/src/base/styler/styler.js +++ b/src/base/styler/styler.js @@ -5,6 +5,21 @@ import $ from 'clappr-zepto' import template from '../template' +/** + * This callback is displayed as part of the Requester class. + * @callback Styler_getStypeFor + * @param {string} style + * @param {Object} options + * @param {string} options.baseUrl + */ +/** + * @typedef StylerType + * @type {object} + * @property {Styler_getStypeFor} getStyleFor + */ +/** + * @type {StylerType} + */ const Styler = { getStyleFor: function(style, options={ baseUrl: '' }) { return $('').html(template(style.toString())(options)) diff --git a/src/base/template.js b/src/base/template.js index 8143ae66a..20c139581 100644 --- a/src/base/template.js +++ b/src/base/template.js @@ -6,6 +6,16 @@ // By default, Underscore uses ERB-style template delimiters, change the // following template settings to use alternative delimiters. +/** + * @typedef SettingsTmplType + * @type {object} + * @property {RegExp} evaluate + * @property {RegExp} interpolate + * @property {RegExp} escape + */ +/** + * @type {SettingsTmplType} + */ var settings = { evaluate : /<%([\s\S]+?)%>/g, interpolate : /<%=([\s\S]+?)%>/g, @@ -15,8 +25,10 @@ var settings = { // When customizing `templateSettings`, if you don't want to define an // interpolation, evaluation or escaping regex, we need one that is // guaranteed not to match. +/** + * @type {RegExp} + */ var noMatch = /(.)^/ - // Certain characters need to be escaped so that they can be put into a // string literal. var escapes = { @@ -29,6 +41,9 @@ var escapes = { '\u2029': 'u2029' } +/** + * @type {RegExp} + */ var escaper = /\\|'|\r|\n|\t|\u2028|\u2029/g // List of HTML entities for escaping. @@ -40,6 +55,9 @@ var htmlEntities = { '\'': ''' } +/** + * @type {RegExp} + */ var entityRe = new RegExp('[&<>"\']', 'g') var escapeExpr = function(string) { @@ -51,9 +69,15 @@ var escapeExpr = function(string) { var counter = 0 -// JavaScript micro-templating, similar to John Resig's implementation. -// Underscore templating handles arbitrary delimiters, preserves whitespace, -// and correctly escapes quotes within interpolated code. +/** + * JavaScript micro-templating, similar to John Resig's implementation. + * Underscore templating handles arbitrary delimiters, preserves whitespace, + * and correctly escapes quotes within interpolated code. + * + * @param {string} text + * @param {*=} data + * @returns + */ var tmpl = function(text, data) { var render @@ -111,6 +135,6 @@ var tmpl = function(text, data) { return template } -tmpl.settings = settings +tmpl.settings = settings export default tmpl diff --git a/src/base/ui_container_plugin/ui_container_plugin.js b/src/base/ui_container_plugin/ui_container_plugin.js index 21b2efb72..84a146beb 100644 --- a/src/base/ui_container_plugin/ui_container_plugin.js +++ b/src/base/ui_container_plugin/ui_container_plugin.js @@ -19,6 +19,10 @@ export default class UIContainerPlugin extends UIObject { constructor(container) { super(container.options) this.container = container + /** + * @property enabled + * @type {boolean} + */ this.enabled = true this.bindEvents() } diff --git a/src/base/ui_core_plugin/ui_core_plugin.js b/src/base/ui_core_plugin/ui_core_plugin.js index a83bc090e..5473a4b73 100644 --- a/src/base/ui_core_plugin/ui_core_plugin.js +++ b/src/base/ui_core_plugin/ui_core_plugin.js @@ -8,6 +8,10 @@ export default class UICorePlugin extends UIObject { constructor(core) { super(core.options) this.core = core + /** + * @property enabled + * @type boolean + */ this.enabled = true this.bindEvents() this.render() diff --git a/src/base/ui_object/ui_object.js b/src/base/ui_object/ui_object.js index 56788eb57..da576080c 100644 --- a/src/base/ui_object/ui_object.js +++ b/src/base/ui_object/ui_object.js @@ -13,28 +13,11 @@ const delegateEventSplitter = /^(\S+)\s*(.*)$/ * @class UIObject * @constructor * @extends BaseObject - * @module base + * @module base a unique id prefixed with `'c'`, `c1, c232` + * @property {HTMLElement} el - the dom itself + * @property {HTMLElement} $el - the dom element wrapped by $ */ export default class UIObject extends BaseObject { - /** - * a unique id prefixed with `'c'`, `c1, c232` - * - * @property cid - * @type String - */ - /** - * the dom element itself - * - * @property el - * @type HTMLElement - */ - /** - * the dom element wrapped by `$` - * - * @property $el - * @type HTMLElement - */ - /** * gets the tag name for the ui component * @method tagName @@ -42,6 +25,7 @@ export default class UIObject extends BaseObject { * @return {String} tag's name */ get tagName() { return 'div' } + /** * a literal object mapping element's events to methods * @property events @@ -92,9 +76,24 @@ export default class UIObject extends BaseObject { */ constructor(options) { super(options) + /** + * @property cid + * @type string + */ this.cid = uniqueId('c') this._ensureElement() this.delegateEvents() + + /** + * @type {HTMLElement} + */ + this.$el + + /** + * @type {HTMLElement} + */ + this.el + } /** diff --git a/src/components/browser/browser.js b/src/components/browser/browser.js index 18bbf3852..bee3e611a 100644 --- a/src/components/browser/browser.js +++ b/src/components/browser/browser.js @@ -24,6 +24,17 @@ const hasFlash = function() { } } +/** + * @typedef getBrowserDataReturnType + * @type {object} + * @property {string} name + * @property {number} version + */ +/** + * @function getBrowserData + * @param {string} ua + * @returns {getBrowserDataReturnType} + */ export const getBrowserInfo = function(ua) { let parts = ua.match(/\b(playstation 4|nx|opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [], extra @@ -151,6 +162,16 @@ const setOsVersion = function(version, separator, osObject) { } // Set viewport size +/** + * @typedef ViewportSizeType + * @type {object} + * @property {number} width + * @property {number} height + */ +/** + * @function getViewportSize + * @returns {ViewportSizeType} viewportObject + */ export const getViewportSize = function() { let viewportObject = {} @@ -173,6 +194,11 @@ const setViewportOrientation = function() { } } +/** + * @function getDevice + * @param {string} ua + * @returns {string} + */ export const getDevice = function(ua) { let platformRegExp = /\((iP(?:hone|ad|od))?(?:[^;]*; ){0,2}([^)]+(?=\)))/ let matches = platformRegExp.exec(ua) diff --git a/src/components/container/container.js b/src/components/container/container.js index 604ea4f77..51f64baca 100644 --- a/src/components/container/container.js +++ b/src/components/container/container.js @@ -145,6 +145,9 @@ export default class Container extends UIObject { this.mediaControlDisabled = false this.plugins = [this.playback] this.dblTapHandler = new DoubleEventHandler(500) + /** + * @type {setTimeout | null} + */ this.clickTimer = null this.clickDelay = 200 // FIXME: could be a player option this.actionsMetadata = {} diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 000000000..e075f973c --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,109 @@ +{ + "compilerOptions": { + /* Visit https://aka.ms/tsconfig to read more about this file */ + + /* Projects */ + // "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */ + // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ + // "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */ + // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */ + // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ + // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ + + /* Language and Environment */ + "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */ + // "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ + // "jsx": "preserve", /* Specify what JSX code is generated. */ + // "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */ + // "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */ + // "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */ + // "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */ + // "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */ + // "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */ + // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ + // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ + // "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */ + + /* Modules */ + "module": "commonjs", /* Specify what module code is generated. */ + // "rootDir": "./", /* Specify the root folder within your source files. */ + // "moduleResolution": "node10", /* Specify how TypeScript looks up a file from a given module specifier. */ + // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ + // "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ + // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ + // "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */ + // "types": [], /* Specify type package names to be included without being referenced in a source file. */ + // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ + // "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */ + // "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */ + // "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */ + // "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */ + // "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */ + // "resolveJsonModule": true, /* Enable importing .json files. */ + // "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */ + // "noResolve": true, /* Disallow 'import's, 'require's or ''s from expanding the number of files TypeScript should add to a project. */ + + /* JavaScript Support */ + // "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */ + // "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ + // "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */ + + /* Emit */ + // "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ + // "declarationMap": true, /* Create sourcemaps for d.ts files. */ + // "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ + // "sourceMap": true, /* Create source map files for emitted JavaScript files. */ + // "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */ + // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */ + // "outDir": "./", /* Specify an output folder for all emitted files. */ + // "removeComments": true, /* Disable emitting comments. */ + // "noEmit": true, /* Disable emitting files from a compilation. */ + // "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ + // "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */ + // "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */ + // "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */ + // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ + // "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */ + // "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */ + // "newLine": "crlf", /* Set the newline character for emitting files. */ + // "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */ + // "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */ + // "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */ + // "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */ + // "declarationDir": "./", /* Specify the output directory for generated declaration files. */ + // "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */ + + /* Interop Constraints */ + // "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ + // "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */ + // "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ + "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */ + // "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ + "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ + + /* Type Checking */ + "strict": true, /* Enable all strict type-checking options. */ + // "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */ + // "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */ + // "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */ + // "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */ + // "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */ + // "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */ + // "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */ + // "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */ + // "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */ + // "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */ + // "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */ + // "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */ + // "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */ + // "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */ + // "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */ + // "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */ + // "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ + // "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ + + /* Completeness */ + // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ + "skipLibCheck": true /* Skip type checking all .d.ts files. */ + } +} diff --git a/types/__mocks__/htmlMock.d.ts b/types/__mocks__/htmlMock.d.ts new file mode 100644 index 000000000..f67b8b512 --- /dev/null +++ b/types/__mocks__/htmlMock.d.ts @@ -0,0 +1 @@ +export function process(src: any): any; diff --git a/types/__mocks__/styleMock.d.ts b/types/__mocks__/styleMock.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/__mocks__/styleMock.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/adaptive_playback/adaptive_playback.d.ts b/types/base/adaptive_playback/adaptive_playback.d.ts new file mode 100644 index 000000000..d4a6e7f8c --- /dev/null +++ b/types/base/adaptive_playback/adaptive_playback.d.ts @@ -0,0 +1,100 @@ +/** + * @typedef {Function} AdaptiveMediaActivatorFunction + * @function + * @param {Boolean} scheduleActivity Enable/disable activity, switch to a different media representation + * @param {Boolean} immediateFlush (default = false) Immediate switching, flushes playout buffer + * @returns {Boolean} Whether the switch request could be processed + * + */ +/** + * Video quality level description. + * In a set of quality levels, there should be exactly one of these objects representing each + * available quality at a given moment. + * @typedef {Object} VideoQualityLevel + * @class + * @property {String} id + * @property {Boolean} active + * @property {String} language + * @property {Number} width pixel + * @property {Number} height pixels + * @property {Number} bitrate bits/s + * @property {String} codec + * @member {AdaptiveMediaActivatorFunction} setActive + * + */ +/** + * Audio option available. + * @typedef {Object} AudioOption + * @class + * @property {String} id + * @property {Boolean} active + * @property {Number} volume + * @property {String} language + * @property {String} codec + * @property {Number} channels + * @property {String[]} roles + * @member {AdaptiveMediaActivatorFunction} setActive + */ +/** + * Closed caption option available. + * @typedef ClosedCaptionOption + * @class + * @property {String} id + * @property {Boolean} active + * @property {String} language + * @property {String[]} roles + * @member {AdaptiveMediaActivatorFunction} setActive + */ +export default class AdaptivePlayback { + /** + * @returns {Boolean} + */ + get isAdaptive(): boolean; + /** + * @param {Boolean} enabled + */ + set isAutoAdaptive(arg: boolean); + /** + * @returns {Boolean} + */ + get isAutoAdaptive(): boolean; + /** + * @returns {VideoQualityLevel[]} + */ + get activeVideoQualityLevels(): any[]; + /** + * @returns {VideoQualityLevel[]} + */ + get videoQualityLevels(): any[]; + /** + * @returns {AudioOption[]} + */ + get availableAudioOptions(): any[]; + /** + * @returns {AudioOption[]} + */ + get audioOptions(): any[]; + /** + * @returns {ClosedCaptionOption[]} + */ + get availableClosedCaptions(): any[]; + /** + * @returns {ClosedCaptionOption[]} + */ + get closedCaptions(): any[]; +} +export type AdaptiveMediaActivatorFunction = Function; +/** + * Video quality level description. + * In a set of quality levels, there should be exactly one of these objects representing each + * available quality at a given moment. + */ +export type VideoQualityLevel = any; +/** + * Audio option available. + */ +export type AudioOption = any; +/** + * Closed caption option available. + */ +export type ClosedCaptionOption = any; diff --git a/types/base/adaptive_playback/adaptive_playback.test.d.ts b/types/base/adaptive_playback/adaptive_playback.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/adaptive_playback/adaptive_playback.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/base_object/base_object.d.ts b/types/base/base_object/base_object.d.ts new file mode 100644 index 000000000..4e8975277 --- /dev/null +++ b/types/base/base_object/base_object.d.ts @@ -0,0 +1,33 @@ +/** + * @class BaseObject + * @constructor + * @extends Events + * @module base + */ +export default class BaseObject { + /** + * @method constructor + * @param {Object} options + */ + constructor(options?: any); + /** + * returns the object options + * @property options + * @type Object + */ + get options(): any; + /** + * the options + * + * @property _options + * @type {Object} + */ + _options: any; + /** + * a unique id prefixed with `'o'`, `o1, o232` + * + * @property uniqueId + * @type String + */ + uniqueId: string; +} diff --git a/types/base/base_object/base_object.test.d.ts b/types/base/base_object/base_object.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/base_object/base_object.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/container_plugin/container_plugin.d.ts b/types/base/container_plugin/container_plugin.d.ts new file mode 100644 index 000000000..d3ffc2060 --- /dev/null +++ b/types/base/container_plugin/container_plugin.d.ts @@ -0,0 +1,26 @@ +/** + * The base class for a container plugin + * @class ContainerPlugin + * @constructor + * @extends BaseObject + * @module base + */ +declare class ContainerPlugin { + constructor(container: any); + get playerError(): any; + container: any; + /** + * @property enabled + * @type {boolean} + */ + enabled: boolean; + enable(): void; + disable(): void; + bindEvents(): void; + destroy(): void; +} +declare namespace ContainerPlugin { + function extend(properties: any): any; + let type: string; +} +export default ContainerPlugin; diff --git a/types/base/container_plugin/container_plugin.test.d.ts b/types/base/container_plugin/container_plugin.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/container_plugin/container_plugin.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/core_plugin/core_plugin.d.ts b/types/base/core_plugin/core_plugin.d.ts new file mode 100644 index 000000000..7c2bc6b43 --- /dev/null +++ b/types/base/core_plugin/core_plugin.d.ts @@ -0,0 +1,20 @@ +declare class CorePlugin { + constructor(core: any); + get playerError(): any; + core: any; + /** + * @property enabled + * @type {boolean} + */ + enabled: boolean; + bindEvents(): void; + enable(): void; + disable(): void; + getExternalInterface(): {}; + destroy(): void; +} +declare namespace CorePlugin { + function extend(properties: any): any; + let type: string; +} +export default CorePlugin; diff --git a/types/base/core_plugin/core_plugin.test.d.ts b/types/base/core_plugin/core_plugin.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/core_plugin/core_plugin.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/error_mixin/error_mixin.d.ts b/types/base/error_mixin/error_mixin.d.ts new file mode 100644 index 000000000..ace62ef35 --- /dev/null +++ b/types/base/error_mixin/error_mixin.d.ts @@ -0,0 +1,12 @@ +export default ErrorMixin; +declare namespace ErrorMixin { + /** + * creates an error. + * @method createError + * @param {Object} error should be an object with code, description, level and raw error. + * @return {Object} Object with formatted error data including origin and scope + */ + function createError(error: any, options?: { + useCodePrefix: boolean; + }): any; +} diff --git a/types/base/error_mixin/error_mixin.test.d.ts b/types/base/error_mixin/error_mixin.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/error_mixin/error_mixin.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/events/events.d.ts b/types/base/events/events.d.ts new file mode 100644 index 000000000..ab15b6f92 --- /dev/null +++ b/types/base/events/events.d.ts @@ -0,0 +1,189 @@ +/** + * @class Events + * @constructor + * @module base + */ +declare class Events { + /** + * @static + * @param {string} eventName + */ + static register(eventName: string): void; + /** + * @static + * @returns {*[]} + */ + static listAvailableCustomEvents(): any[]; + /** + * listen to an event indefinitely, if you want to stop you need to call `off` + * @method on + * @param {String} name + * @param {Function} callback + * @param {Object} context + */ + on(name: string, callback: Function, context: any): this; + _events: {}; + /** + * listen to an event only once + * @method once + * @param {String} name + * @param {Function} callback + * @param {Object} context + */ + once(name: string, callback: Function, context: any): this; + /** + * stop listening to an event + * @method off + * @param {String} name + * @param {Function} callback + * @param {Object} context + */ + off(name: string, callback: Function, context: any): this; + /** + * triggers an event given its `name` + * @method trigger + * @param {String} name + */ + trigger(name: string, ...args: any[]): this; + /** + * stop listening an event for a given object + * @method stopListening + * @param {Object} obj + * @param {String} name + * @param {Function} callback + */ + stopListening(obj: any, name: string, callback: Function): this; + /** + * listen to an event indefinitely for a given `obj` + * @method listenTo + * @param {Object} obj + * @param {String} name + * @param {Function} callback + * @param {Object} context + * @example + * ```javascript + * this.listenTo(this.core.playback, Events.PLAYBACK_PAUSE, this.callback) + * ``` + */ + listenTo(obj: any, name: string, callback: Function): Events; + _listeningTo: {}; + /** + * listen to an event once for a given `obj` + * @method listenToOnce + * @param {Object} obj + * @param {String} name + * @param {Function} callback + * @param {Object} context + * @example + * ```javascript + * this.listenToOnce(this.core.playback, Events.PLAYBACK_PAUSE, this.callback) + * ``` + */ + listenToOnce(obj: any, name: string, callback: Function): Events; +} +declare namespace Events { + let PLAYER_READY: string; + let PLAYER_RESIZE: string; + let PLAYER_FULLSCREEN: string; + let PLAYER_PLAY: string; + let PLAYER_PAUSE: string; + let PLAYER_STOP: string; + let PLAYER_ENDED: string; + let PLAYER_SEEK: string; + let PLAYER_ERROR: string; + let ERROR: string; + let PLAYER_TIMEUPDATE: string; + let PLAYER_VOLUMEUPDATE: string; + let PLAYER_SUBTITLE_AVAILABLE: string; + let PLAYBACK_PROGRESS: string; + let PLAYBACK_TIMEUPDATE: string; + let PLAYBACK_READY: string; + let PLAYBACK_BUFFERING: string; + let PLAYBACK_BUFFERFULL: string; + let PLAYBACK_SETTINGSUPDATE: string; + let PLAYBACK_LOADEDMETADATA: string; + let PLAYBACK_HIGHDEFINITIONUPDATE: string; + let PLAYBACK_BITRATE: string; + let PLAYBACK_LEVELS_AVAILABLE: string; + let PLAYBACK_LEVEL_SWITCH_START: string; + let PLAYBACK_LEVEL_SWITCH_END: string; + let PLAYBACK_PLAYBACKSTATE: string; + let PLAYBACK_DVR: string; + let PLAYBACK_MEDIACONTROL_DISABLE: string; + let PLAYBACK_MEDIACONTROL_ENABLE: string; + let PLAYBACK_ENDED: string; + let PLAYBACK_PLAY_INTENT: string; + let PLAYBACK_PLAY: string; + let PLAYBACK_PAUSE: string; + let PLAYBACK_SEEK: string; + let PLAYBACK_SEEKED: string; + let PLAYBACK_STOP: string; + let PLAYBACK_ERROR: string; + let PLAYBACK_STATS_ADD: string; + let PLAYBACK_FRAGMENT_LOADED: string; + let PLAYBACK_LEVEL_SWITCH: string; + let PLAYBACK_SUBTITLE_AVAILABLE: string; + let PLAYBACK_SUBTITLE_CHANGED: string; + let PLAYBACK_AUDIO_AVAILABLE: string; + let PLAYBACK_AUDIO_CHANGED: string; + let CORE_CONTAINERS_CREATED: string; + let CORE_ACTIVE_CONTAINER_CHANGED: string; + let CORE_OPTIONS_CHANGE: string; + let CORE_READY: string; + let CORE_FULLSCREEN: string; + let CORE_RESIZE: string; + let CORE_SCREEN_ORIENTATION_CHANGED: string; + let CORE_MOUSE_MOVE: string; + let CORE_MOUSE_LEAVE: string; + let CONTAINER_PLAYBACKSTATE: string; + let CONTAINER_PLAYBACKDVRSTATECHANGED: string; + let CONTAINER_BITRATE: string; + let CONTAINER_STATS_REPORT: string; + let CONTAINER_DESTROYED: string; + let CONTAINER_READY: string; + let CONTAINER_RESIZE: string; + let CONTAINER_ERROR: string; + let CONTAINER_LOADEDMETADATA: string; + let CONTAINER_SUBTITLE_AVAILABLE: string; + let CONTAINER_SUBTITLE_CHANGED: string; + let CONTAINER_AUDIO_AVAILABLE: string; + let CONTAINER_AUDIO_CHANGED: string; + let CONTAINER_TIMEUPDATE: string; + let CONTAINER_PROGRESS: string; + let CONTAINER_PLAY: string; + let CONTAINER_STOP: string; + let CONTAINER_PAUSE: string; + let CONTAINER_ENDED: string; + let CONTAINER_CLICK: string; + let CONTAINER_DBLCLICK: string; + let CONTAINER_CONTEXTMENU: string; + let CONTAINER_MOUSE_ENTER: string; + let CONTAINER_MOUSE_LEAVE: string; + let CONTAINER_MOUSE_UP: string; + let CONTAINER_MOUSE_DOWN: string; + let CONTAINER_SEEK: string; + let CONTAINER_SEEKED: string; + let CONTAINER_VOLUME: string; + let CONTAINER_FULLSCREEN: string; + let CONTAINER_STATE_BUFFERING: string; + let CONTAINER_STATE_BUFFERFULL: string; + let CONTAINER_SETTINGSUPDATE: string; + let CONTAINER_HIGHDEFINITIONUPDATE: string; + let CONTAINER_MEDIACONTROL_SHOW: string; + let CONTAINER_MEDIACONTROL_HIDE: string; + let CONTAINER_MEDIACONTROL_DISABLE: string; + let CONTAINER_MEDIACONTROL_ENABLE: string; + let CONTAINER_STATS_ADD: string; + let CONTAINER_OPTIONS_CHANGE: string; + let MEDIACONTROL_RENDERED: string; + let MEDIACONTROL_FULLSCREEN: string; + let MEDIACONTROL_SHOW: string; + let MEDIACONTROL_HIDE: string; + let MEDIACONTROL_MOUSEMOVE_SEEKBAR: string; + let MEDIACONTROL_MOUSELEAVE_SEEKBAR: string; + let MEDIACONTROL_PLAYING: string; + let MEDIACONTROL_NOTPLAYING: string; + let MEDIACONTROL_CONTAINERCHANGED: string; + let MEDIACONTROL_OPTIONS_CHANGE: string; +} +export default Events; diff --git a/types/base/events/events.test.d.ts b/types/base/events/events.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/events/events.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/media.d.ts b/types/base/media.d.ts new file mode 100644 index 000000000..5b56f23b1 --- /dev/null +++ b/types/base/media.d.ts @@ -0,0 +1,8 @@ +/** + * @type {string} + */ +export const mp4: string; +declare namespace _default { + export { mp4 }; +} +export default _default; diff --git a/types/base/playback/playback.d.ts b/types/base/playback/playback.d.ts new file mode 100644 index 000000000..706f2d8ac --- /dev/null +++ b/types/base/playback/playback.d.ts @@ -0,0 +1,264 @@ +/** + * An object representing a single audio track. + * @typedef {Object} AudioTrack + * @property {string} id - A unique identifier for the track. Used to identify it among the others. + * @property {string} language - The language of the track (e.g., 'en', 'pt-BR'). + * @property {string} [label] - An optional label to be used in the UI to describe the track. + * @property {('main'|'description')} kind - The category the audio track belongs to. + * The kind 'description' is applied to audio tracks that narrate or describe the visual content. + */ +/** + * An abstraction to represent a generic playback, it's like an interface to be implemented by subclasses. + * @class Playback + * @constructor + * @extends UIObject + * @module base + */ +declare class Playback { + /** + * @method constructor + * @param {Object} options the options object + * @param {Strings} i18n the internationalization component + */ + constructor(options: any, i18n: Strings, playerError: any); + /** + * Determine if the playback does not contain video/has video but video should be ignored. + * @property isAudioOnly + * @type Boolean + */ + get isAudioOnly(): boolean; + /** + * @property isAdaptive + * @return {boolean} + */ + get isAdaptive(): boolean; + /** + * Determine if the playback has ended. + * @property ended + * @type {boolean} + */ + get ended(): boolean; + /** + * The internationalization plugin. + * @property i18n + * @type {Strings} + */ + get i18n(): Strings; + /** + * Determine if the playback is having to buffer in order for + * playback to be smooth. + * (i.e if a live stream is playing smoothly, this will be false) + * @property buffering + * @type Boolean + */ + get buffering(): boolean; + /** + * @property settings + * @type {Object} + */ + settings: any; + /** + * @property _i18n + * @type {string} + */ + _i18n: string; + playerError: any; + /** + * @property _consented + * @type {boolean} + */ + _consented: boolean; + /** + * Gives user consent to playback (mobile devices). + * @method consent + * @param {Function} callback function called when playback is consented + */ + consent(cb: any): void; + /** + * plays the playback. + * @method play + */ + play(): void; + /** + * pauses the playback. + * @method pause + */ + pause(): void; + /** + * stops the playback. + * @method stop + */ + stop(): void; + /** + * seeks the playback to a given `time` in seconds + * @method seek + * @param {Number} time should be a number between 0 and the video duration + */ + seek(time: number): void; + /** + * seeks the playback to a given `percentage` in percentage + * @method seekPercentage + * @param {Number} time should be a number between 0 and 100 + */ + seekPercentage(percentage: any): void; + /** + * The time that "0" now represents relative to when playback started. + * For a stream with a sliding window this will increase as content is + * removed from the beginning. + * @method getStartTimeOffset + * @return {Number} time (in seconds) that time "0" represents. + */ + getStartTimeOffset(): number; + /** + * gets the duration in seconds + * @method getDuration + * @return {Number} duration (in seconds) of the current source + */ + getDuration(): number; + /** + * checks if the playback is playing. + * @method isPlaying + * @return {Boolean} `true` if the current playback is playing, otherwise `false` + */ + isPlaying(): boolean; + /** + * checks if the playback is ready. + * @property isReady + * @type {Boolean} `true` if the current playback is ready, otherwise `false` + */ + get isReady(): boolean; + /** + * checks if the playback has closed caption tracks. + * @property hasClosedCaptionsTracks + * @type {Boolean} + */ + get hasClosedCaptionsTracks(): boolean; + /** + * gets the playback available closed caption tracks. + * @property closedCaptionsTracks + * @type {Array} an array of objects with at least 'id' and 'name' properties + */ + get closedCaptionsTracks(): any[]; + /** + * sets the selected closed caption track index. (-1 is disabled) + * @property closedCaptionsTrackId + * @type {Number} + */ + set closedCaptionsTrackId(arg: number); + /** + * gets the selected closed caption track index. (-1 is disabled) + * @property closedCaptionsTrackId + * @type {Number} + */ + get closedCaptionsTrackId(): number; + /** + * returns a list of the available audio tracks for the playback. + * @type {AudioTrack[]} audio tracks + */ + get audioTracks(): AudioTrack[]; + /** + * returns the audio track currently in use by the playback. + * @type {AudioTrack} audio track + */ + get currentAudioTrack(): AudioTrack; + /** + * switches the current audio track used by the playback. + * @param {string} id - id of the audio track to be set. + */ + switchAudioTrack(id: string): void; + /** + * gets the playback type (`'vod', 'live', 'aod'`) + * @method getPlaybackType + * @return {String} you should write the playback type otherwise it'll assume `'no_op'` + * @example + * ```javascript + * html5VideoPlayback.getPlaybackType() //vod + * html5AudioPlayback.getPlaybackType() //aod + * html5VideoPlayback.getPlaybackType() //live + * flashHlsPlayback.getPlaybackType() //live + * ``` + */ + getPlaybackType(): string; + /** + * checks if the playback is in HD. + * @method isHighDefinitionInUse + * @return {Boolean} `true` if the playback is playing in HD, otherwise `false` + */ + isHighDefinitionInUse(): boolean; + /** + * mutes the playback + * @method mute + */ + mute(): void; + /** + * restores the playback volume + * @method unmute + */ + unmute(): void; + /** + * sets the volume for the playback + * @method volume + * @param {Number} value a number between 0 (`muted`) to 100 (`max`) + */ + volume(value: number): void; + /** + * enables to configure the playback after its creation + * @method configure + * @param {Object} options all the options to change in form of a javascript object + */ + configure(options: any): void; + _options: any; + /** + * attempt to autoplays the playback. + * @method attemptAutoPlay + */ + attemptAutoPlay(): void; + /** + * checks if the playback can autoplay. + * @method canAutoPlay + * @param {Function} callback function where first param is Boolean and second param is playback Error or null + */ + canAutoPlay(cb: any): void; +} +declare namespace Playback { + function extend(properties: any): any; + /** + * checks if the playback can play a given `source` + * If a mimeType is provided then this will be used instead of inferring the mimetype + * from the source extension. + * @method canPlay + * @static + * @param {String} source the given source ex: `http://example.com/play.mp4` + * @param {String} [mimeType] the given mime type, ex: `'application/vnd.apple.mpegurl'` + * @return {Boolean} `true` if the playback is playable, otherwise `false` + */ + function canPlay(source: string, mimeType?: string): boolean; + let VOD: string; + let AOD: string; + let LIVE: string; + let NO_OP: string; + let type: string; +} +export default Playback; +/** + * An object representing a single audio track. + */ +export type AudioTrack = { + /** + * - A unique identifier for the track. Used to identify it among the others. + */ + id: string; + /** + * - The language of the track (e.g., 'en', 'pt-BR'). + */ + language: string; + /** + * - An optional label to be used in the UI to describe the track. + */ + label?: string; + /** + * - The category the audio track belongs to. + * The kind 'description' is applied to audio tracks that narrate or describe the visual content. + */ + kind: ('main' | 'description'); +}; diff --git a/types/base/playback/playback.test.d.ts b/types/base/playback/playback.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/playback/playback.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/polyfills.d.ts b/types/base/polyfills.d.ts new file mode 100644 index 000000000..e69de29bb diff --git a/types/base/styler/styler.d.ts b/types/base/styler/styler.d.ts new file mode 100644 index 000000000..78d2c4d65 --- /dev/null +++ b/types/base/styler/styler.d.ts @@ -0,0 +1,26 @@ +export default Styler; +/** + * This callback is displayed as part of the Requester class. + */ +export type Styler_getStypeFor = (style: string, options: { + baseUrl: string; +}) => any; +export type StylerType = { + getStyleFor: Styler_getStypeFor; +}; +/** + * This callback is displayed as part of the Requester class. + * @callback Styler_getStypeFor + * @param {string} style + * @param {Object} options + * @param {string} options.baseUrl + */ +/** + * @typedef StylerType + * @type {object} + * @property {Styler_getStypeFor} getStyleFor + */ +/** + * @type {StylerType} + */ +declare const Styler: StylerType; diff --git a/types/base/styler/styler.test.d.ts b/types/base/styler/styler.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/styler/styler.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/template.d.ts b/types/base/template.d.ts new file mode 100644 index 000000000..62636aa37 --- /dev/null +++ b/types/base/template.d.ts @@ -0,0 +1,30 @@ +export default tmpl; +export type SettingsTmplType = { + evaluate: RegExp; + interpolate: RegExp; + escape: RegExp; +}; +/** + * JavaScript micro-templating, similar to John Resig's implementation. + * Underscore templating handles arbitrary delimiters, preserves whitespace, + * and correctly escapes quotes within interpolated code. + * + * @param {string} text + * @param {*=} data + * @returns + */ +declare function tmpl(text: string, data?: any | undefined): any; +declare namespace tmpl { + export { settings }; +} +/** + * @typedef SettingsTmplType + * @type {object} + * @property {RegExp} evaluate + * @property {RegExp} interpolate + * @property {RegExp} escape + */ +/** + * @type {SettingsTmplType} + */ +declare var settings: SettingsTmplType; diff --git a/types/base/ui_container_plugin/ui_container_plugin.d.ts b/types/base/ui_container_plugin/ui_container_plugin.d.ts new file mode 100644 index 000000000..0cb8405b4 --- /dev/null +++ b/types/base/ui_container_plugin/ui_container_plugin.d.ts @@ -0,0 +1,25 @@ +/** + * The base class for an ui container plugin + * @class UIContainerPlugin + * @constructor + * @extends UIObject + * @module base + */ +declare class UIContainerPlugin { + constructor(container: any); + get playerError(): any; + container: any; + /** + * @property enabled + * @type {boolean} + */ + enabled: boolean; + enable(): void; + disable(): void; + bindEvents(): void; +} +declare namespace UIContainerPlugin { + function extend(properties: any): any; + let type: string; +} +export default UIContainerPlugin; diff --git a/types/base/ui_container_plugin/ui_container_plugin.test.d.ts b/types/base/ui_container_plugin/ui_container_plugin.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/ui_container_plugin/ui_container_plugin.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/ui_core_plugin/ui_core_plugin.d.ts b/types/base/ui_core_plugin/ui_core_plugin.d.ts new file mode 100644 index 000000000..1b3aa0a7f --- /dev/null +++ b/types/base/ui_core_plugin/ui_core_plugin.d.ts @@ -0,0 +1,20 @@ +declare class UICorePlugin { + constructor(core: any); + get playerError(): any; + core: any; + /** + * @property enabled + * @type boolean + */ + enabled: boolean; + bindEvents(): void; + getExternalInterface(): {}; + enable(): void; + disable(): void; + render(): this; +} +declare namespace UICorePlugin { + function extend(properties: any): any; + let type: string; +} +export default UICorePlugin; diff --git a/types/base/ui_core_plugin/ui_core_plugin.test.d.ts b/types/base/ui_core_plugin/ui_core_plugin.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/ui_core_plugin/ui_core_plugin.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/base/ui_object/ui_object.d.ts b/types/base/ui_object/ui_object.d.ts new file mode 100644 index 000000000..212704764 --- /dev/null +++ b/types/base/ui_object/ui_object.d.ts @@ -0,0 +1,129 @@ +/** + * A base class to create ui object. + * @class UIObject + * @constructor + * @extends BaseObject + * @module base a unique id prefixed with `'c'`, `c1, c232` + * @property {HTMLElement} el - the dom itself + * @property {HTMLElement} $el - the dom element wrapped by $ + */ +export default class UIObject { + /** + * it builds an ui component by: + * * creating an id for the component `cid` + * * making sure the element is created `$el` + * * delegating all `events` to the element + * @method constructor + * @param {Object} options the options object + */ + constructor(options: any); + /** + * gets the tag name for the ui component + * @method tagName + * @default div + * @return {String} tag's name + */ + get tagName(): string; + /** + * a literal object mapping element's events to methods + * @property events + * @type Object + * @example + * + *```javascript + * + * class MyButton extends UIObject { + * constructor(options) { + * super(options) + * this.myId = 0 + * } + * get events() { return { 'click': 'myClick' } } + * myClick(){ this.myId = 42 } + * } + * + * // when you click on MyButton the method `myClick` will be called + *``` + */ + get events(): any; + /** + * a literal object mapping attributes and values to the element + * element's attribute name and the value the attribute value + * @property attributes + * @type Object + * @example + * + *```javascript + * + * class MyButton extends UIObject { + * constructor(options) { super(options) } + * get attributes() { return { class: 'my-button'} } + * } + * + * // MyButton.el.className will be 'my-button' + * ``` + */ + get attributes(): any; + /** + * @property cid + * @type string + */ + cid: string; + /** + * @type {HTMLElement} + */ + $el: HTMLElement; + /** + * @type {HTMLElement} + */ + el: HTMLElement; + /** + * selects within the component. + * @method $ + * @param {String} selector a selector to find within the component. + * @return {HTMLElement} an element, if it exists. + * @example + * ```javascript + * fullScreenBarUIComponent.$('.button-full') //will return only `.button-full` within the component + * ``` + */ + $(selector: string): HTMLElement; + /** + * render the component, usually attach it to a real existent `element` + * @method render + * @return {UIObject} itself + */ + render(): UIObject; + /** + * removes the ui component from DOM + * @method destroy + * @return {UIObject} itself + */ + destroy(): UIObject; + /** + * set element to `el` and `$el` + * @method setElement + * @param {HTMLElement} element + * @param {Boolean} delegate whether is delegate or not + * @return {UIObject} itself + */ + setElement(element: HTMLElement, delegate: boolean): UIObject; + /** + * delegates all the original `events` on `element` to its callbacks + * @method delegateEvents + * @param {Object} events + * @return {UIObject} itself + */ + delegateEvents(events: any): UIObject; + /** + * undelegats all the `events` + * @method undelegateEvents + * @return {UIObject} itself + */ + undelegateEvents(): UIObject; + /** + * ensures the creation of this ui component + * @method _ensureElement + * @private + */ + private _ensureElement; +} diff --git a/types/base/ui_object/ui_object.test.d.ts b/types/base/ui_object/ui_object.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/base/ui_object/ui_object.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/browser/browser.d.ts b/types/components/browser/browser.d.ts new file mode 100644 index 000000000..2d95ffad2 --- /dev/null +++ b/types/components/browser/browser.d.ts @@ -0,0 +1,69 @@ +export function getBrowserInfo(ua: string): getBrowserDataReturnType; +export function getBrowserData(): { + name: string; + group: string; +}; +export function getOsData(): { + name: string; + group: string; +}; +export function getViewportSize(): ViewportSizeType; +export function getDevice(ua: string): string; +export default Browser; +export type getBrowserDataReturnType = { + name: string; + version: number; +}; +export type ViewportSizeType = { + width: number; + height: number; +}; +declare namespace Browser { + export let isEdge: boolean; + export let isChrome: boolean; + export let isSafari: boolean; + export let isFirefox: boolean; + export let isLegacyIE: boolean; + export let isIE: boolean; + export let isIE11: boolean; + export let isChromecast: boolean; + export let isMobile: boolean; + export let isiOS: boolean; + export let isAndroid: boolean; + export let isWindowsPhone: boolean; + export let isWin8App: boolean; + export let isWiiU: boolean; + export let isPS4: boolean; + export let hasLocalstorage: boolean; + export let hasFlash: boolean; + import name = name; + export { name }; + import version = version; + export { version }; + export let userAgent: string; + export namespace data { + let name_1: string; + export { name_1 as name }; + export let group: string; + } + export namespace os { + let name_2: string; + export { name_2 as name }; + let group_1: string; + export { group_1 as group }; + } + export let isWindows: boolean; + export let isMacOS: boolean; + export let isLinux: boolean; + export namespace viewport { + let width: number; + let height: number; + } + export let device: string; +} +declare namespace browserInfo { + let name_3: string; + export { name_3 as name }; + let version_1: number; + export { version_1 as version }; +} diff --git a/types/components/browser/browser.test.d.ts b/types/components/browser/browser.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/browser/browser.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/browser/browser_data.d.ts b/types/components/browser/browser_data.d.ts new file mode 100644 index 000000000..d2521c388 --- /dev/null +++ b/types/components/browser/browser_data.d.ts @@ -0,0 +1,12 @@ +export default BROWSER_DATA; +declare const BROWSER_DATA: ({ + name: string; + group: string; + identifier: string; + versionIdentifier?: undefined; +} | { + name: string; + group: string; + identifier: string; + versionIdentifier: string; +})[]; diff --git a/types/components/browser/os_data.d.ts b/types/components/browser/os_data.d.ts new file mode 100644 index 000000000..d77d3692c --- /dev/null +++ b/types/components/browser/os_data.d.ts @@ -0,0 +1,37 @@ +export default OS_DATA; +declare const OS_DATA: ({ + name: string; + group: string; + identifier: string; + version: string; + versionIdentifier?: undefined; + versionSeparator?: undefined; +} | { + name: string; + group: string; + identifier: string; + version?: undefined; + versionIdentifier?: undefined; + versionSeparator?: undefined; +} | { + name: string; + group: string; + identifier: string; + versionIdentifier: string; + version?: undefined; + versionSeparator?: undefined; +} | { + name: string; + group: string; + identifier: string; + versionIdentifier: string; + versionSeparator: string; + version?: undefined; +} | { + name: string; + group: string; + identifier: string; + versionSeparator: string; + version?: undefined; + versionIdentifier?: undefined; +})[]; diff --git a/types/components/container/container.d.ts b/types/components/container/container.d.ts new file mode 100644 index 000000000..2e892d68f --- /dev/null +++ b/types/components/container/container.d.ts @@ -0,0 +1,256 @@ +/** + * An abstraction to represent a container for a given playback + * TODO: describe its responsabilities + * @class Container + * @constructor + * @extends UIObject + * @module base + */ +export default class Container { + /** + * it builds a container + * @method constructor + * @param {Object} options the options object + * @param {Strings} i18n the internationalization component + */ + constructor(options: any, i18n: Strings, playerError: any); + /** + * container's name + * @method name + * @default Container + * @return {String} container's name + */ + get name(): string; + get attributes(): { + class: string; + 'data-container': string; + }; + get events(): { + click: string; + dblclick: string; + touchend: string; + contextmenu: string; + mouseenter: string; + mouseleave: string; + mouseup: string; + mousedown: string; + }; + /** + * Determine if the playback has ended. + * @property ended + * @type Boolean + */ + get ended(): boolean; + /** + * Determine if the playback is having to buffer in order for + * playback to be smooth. + * (i.e if a live stream is playing smoothly, this will be false) + * @property buffering + * @type Boolean + */ + get buffering(): boolean; + /** + * The internationalization plugin. + * @property i18n + * @type {Strings} + */ + get i18n(): Strings; + /** + * checks if has closed caption tracks. + * @property hasClosedCaptionsTracks + * @type {Boolean} + */ + get hasClosedCaptionsTracks(): boolean; + /** + * gets the available closed caption tracks. + * @property closedCaptionsTracks + * @type {Array} an array of objects with at least 'id' and 'name' properties + */ + get closedCaptionsTracks(): any[]; + /** + * sets the selected closed caption track index. (-1 is disabled) + * @property closedCaptionsTrackId + * @type {Number} + */ + set closedCaptionsTrackId(arg: number); + /** + * gets the selected closed caption track index. (-1 is disabled) + * @property closedCaptionsTrackId + * @type {Number} + */ + get closedCaptionsTrackId(): number; + /** + * returns a list of the available audio tracks. + * @type {import('../../base/playback/playback').AudioTrack[]} audio tracks + */ + get audioTracks(): import("../../base/playback/playback").AudioTrack[]; + /** + * returns the audio track currently in use. + * @type {import('../../base/playback/playback').AudioTrack} audio track + */ + get currentAudioTrack(): import("../../base/playback/playback").AudioTrack; + _i18n: Strings; + currentTime: number; + volume: number; + playback: any; + playerError: any; + settings: any; + isReady: boolean; + mediaControlDisabled: boolean; + plugins: any[]; + dblTapHandler: any; + /** + * @type {setTimeout | null} + */ + clickTimer: typeof setTimeout | null; + clickDelay: number; + actionsMetadata: {}; + /** + * binds playback events to the methods of the container. + * it listens to playback's events and triggers them as container events. + * + * | Playback | + * |----------| + * | progress | + * | timeupdate | + * | ready | + * | buffering | + * | bufferfull | + * | settingsupdate | + * | loadedmetadata | + * | highdefinitionupdate | + * | bitrate | + * | playbackstate | + * | dvr | + * | mediacontrol_disable | + * | mediacontrol_enable | + * | ended | + * | play | + * | pause | + * | error | + * + * ps: the events usually translate from PLABACK_x to CONTAINER_x, you can check all the events at `Event` class. + * + * @method bindEvents + */ + bindEvents(): void; + subtitleAvailable(): void; + subtitleChanged(track: any): void; + audioAvailable(tracks: any): void; + audioChanged(track: any): void; + playbackStateChanged(state: any): void; + playbackDvrStateChanged(dvrInUse: any): void; + dvrInUse: any; + updateBitrate(newBitrate: any): void; + statsReport(metrics: any): void; + getPlaybackType(): any; + /** + * returns `true` if DVR is enable otherwise `false`. + * @method isDvrEnabled + * @return {Boolean} + */ + isDvrEnabled(): boolean; + /** + * returns `true` if DVR is in use otherwise `false`. + * @method isDvrInUse + * @return {Boolean} + */ + isDvrInUse(): boolean; + /** + * destroys the container + * @method destroy + */ + destroy(): void; + setStyle(style: any): void; + animate(style: any, duration: any): any; + ready(): void; + isPlaying(): any; + getStartTimeOffset(): any; + getCurrentTime(): number; + getDuration(): any; + error(error: any): void; + loadedMetadata(metadata: any): void; + timeUpdated(timeProgress: any): void; + onProgress(...args: any[]): void; + playing(): void; + paused(): void; + stopped(): void; + /** + * plays the playback + * @method play + * @param {Object} customData + */ + play(customData?: any): void; + /** + * stops the playback + * @method stop + * @param {Object} customData + */ + stop(customData?: any): void; + switchAudioTrack(id: any): void; + /** + * pauses the playback + * @method pause + * @param {Object} customData + */ + pause(customData?: any): void; + onEnded(): void; + clicked(): void; + cancelClicked(): void; + dblClicked(): void; + dblTap(evt: any): void; + onContextMenu(event: any): void; + seek(time: any): void; + onSeek(time: any): void; + onSeeked(): void; + seekPercentage(percentage: any): void; + setVolume(value: any): void; + fullscreen(): void; + onBuffering(): void; + bufferfull(): void; + /** + * adds plugin to the container + * @method addPlugin + * @param {Object} plugin + */ + addPlugin(plugin: any): void; + /** + * checks if a plugin, given its name, exist + * @method hasPlugin + * @param {String} name + * @return {Boolean} + */ + hasPlugin(name: string): boolean; + /** + * get the plugin given its name + * @method getPlugin + * @param {String} name + */ + getPlugin(name: string): any; + mouseEnter(): void; + mouseLeave(): void; + mouseUp(): void; + mouseDown(): void; + settingsUpdate(): void; + highDefinitionUpdate(isHD: any): void; + isHighDefinitionInUse(): any; + disableMediaControl(): void; + enableMediaControl(): void; + updateStyle(): void; + enableResizeObserver(): void; + resizeObserverInterval: NodeJS.Timeout; + disableResizeObserver(): void; + checkResize(): void; + currentSize: { + width: any; + height: any; + }; + /** + * enables to configure the container after its creation + * @method configure + * @param {Object} options all the options to change in form of a javascript object + */ + configure(options: any): void; + _options: any; + render(): this; +} diff --git a/types/components/container/container.test.d.ts b/types/components/container/container.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/container/container.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/container_factory/container_factory.d.ts b/types/components/container_factory/container_factory.d.ts new file mode 100644 index 000000000..6132766a3 --- /dev/null +++ b/types/components/container_factory/container_factory.d.ts @@ -0,0 +1,13 @@ +export default class ContainerFactory { + constructor(options: any, loader: any, i18n: any, playerError: any); + set options(arg: any); + get options(): any; + _options: any; + _i18n: any; + loader: any; + playerError: any; + createContainers(): any; + findPlaybackPlugin(source: any, mimeType: any): any; + createContainer(source: any): any; + addContainerPlugins(container: any): void; +} diff --git a/types/components/container_factory/container_factory.test.d.ts b/types/components/container_factory/container_factory.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/container_factory/container_factory.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/core/core.d.ts b/types/components/core/core.d.ts new file mode 100644 index 000000000..460d87a2a --- /dev/null +++ b/types/components/core/core.d.ts @@ -0,0 +1,130 @@ +/** + * The Core is responsible to manage Containers and the player state. + * @class Core + * @constructor + * @extends UIObject + * @module components + */ +export default class Core { + constructor(options: any); + get events(): { + webkitfullscreenchange: string; + mousemove: string; + mouseleave: string; + }; + get attributes(): { + 'data-player': string; + tabindex: number; + }; + /** + * checks if the core is ready. + * @property isReady + * @type {Boolean} `true` if the core is ready, otherwise `false` + */ + get isReady(): boolean; + /** + * The internationalization plugin. + * @property i18n + * @type {Strings} + */ + get i18n(): Strings; + /** + * @deprecated + * This property currently exists for backward compatibility reasons. + * If you need to access the media control instance, use the method getPlugin('media_control'). + * This approach is still not recommended. + */ + get mediaControl(): any; + _mediaControl: any; + get dummyMediaControl(): any; + _dummyMediaControl: any; + /** + * sets the active container reference and trigger a event with the new reference. + * @property activeContainer + * @type {Object} + */ + set activeContainer(arg: any); + /** + * gets the active container reference. + * @property activeContainer + * @type {Object} + */ + get activeContainer(): any; + _activeContainer: any; + /** + * gets the active playback reference. + * @property activePlayback + * @type {Object} + */ + get activePlayback(): any; + /** + * gets the active playback's video element. + * @property activePlaybackEl + * @type {Object} + */ + get activePlaybackEl(): any; + playerError: any; + firstResize: boolean; + plugins: any[]; + containers: any[]; + _boundFullscreenHandler: () => void; + configureDomRecycler(): void; + createContainers(options: any): void; + defer: any; + containerFactory: any; + prepareContainers(): void; + updateSize(): void; + setFullscreen(): void; + previousSize: any; + currentSize: any; + setPlayerSize(): void; + resize(options: any): void; + enableResizeObserver(): void; + resizeObserverInterval: NodeJS.Timeout; + triggerResize(newSize: any): void; + oldHeight: any; + oldWidth: any; + computedSize: any; + disableResizeObserver(): void; + resolveOnContainersReady(containers: any): void; + ready: boolean; + addPlugin(plugin: any): void; + hasPlugin(name: any): boolean; + getPlugin(name: any): any; + load(sources: any, mimeType: any): void; + destroy(): void; + handleFullscreenChange(): void; + handleWindowResize(event: any): void; + _screenOrientation: any; + removeContainer(container: any): void; + setupContainer(container: any): void; + setupContainers(containers: any): any[]; + renderContainers(): void; + createContainer(source: any, options: any): any; + /** + * @deprecated + * This method currently exists for retrocompatibility reasons. + * If you want the current container reference, use the activeContainer getter. + */ + getCurrentContainer(): any; + /** + * @deprecated + * This method currently exists for retrocompatibility reasons. + * If you want the current playback reference, use the activePlayback getter. + */ + getCurrentPlayback(): any; + getPlaybackType(): any; + isFullscreen(): any; + toggleFullscreen(): void; + onMouseMove(event: any): void; + onMouseLeave(event: any): void; + /** + * enables to configure the container after its creation + * @method configure + * @param {Object} options all the options to change in form of a javascript object + */ + configure(options: any): void; + _options: any; + appendToParent(): void; + render(): this; +} diff --git a/types/components/core/core.test.d.ts b/types/components/core/core.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/core/core.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/core_factory/core_factory.d.ts b/types/components/core_factory/core_factory.d.ts new file mode 100644 index 000000000..3418a9c49 --- /dev/null +++ b/types/components/core_factory/core_factory.d.ts @@ -0,0 +1,31 @@ +/** + * The Core Factory is responsible for instantiate the core and it's plugins. + * @class CoreFactory + * @constructor + * @extends BaseObject + * @module components + */ +export default class CoreFactory { + /** + * it builds the core factory + * @method constructor + * @param {Player} player the player object + */ + constructor(player: Player); + get loader(): any; + player: Player; + /** + * creates a core and its plugins + * @method create + * @return {Core} created core + */ + create(): Core; + core: any; + /** + * given the core plugins (`loader.corePlugins`) it builds each one + * @method addCorePlugins + * @return {Core} the core with all plugins + */ + addCorePlugins(): Core; + setupExternalInterface(plugin: any): void; +} diff --git a/types/components/core_factory/core_factory.test.d.ts b/types/components/core_factory/core_factory.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/core_factory/core_factory.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/error/error.d.ts b/types/components/error/error.d.ts new file mode 100644 index 000000000..e5fe76621 --- /dev/null +++ b/types/components/error/error.d.ts @@ -0,0 +1,24 @@ +export default PlayerError; +/** + * The PlayerError is responsible to receive and propagate errors. + * @class PlayerError + * @constructor + * @extends BaseObject + * @module components + */ +declare class PlayerError { + /** + * @property Levels + * @type {Object} object with error levels + */ + static get Levels(): any; + constructor(options: {}, core: any); + get name(): string; + core: any; + /** + * creates and trigger an error. + * @method createError + * @param {Object} err should be an object with code, description, level, origin, scope and raw error. + */ + createError(err: any): void; +} diff --git a/types/components/error/error.test.d.ts b/types/components/error/error.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/error/error.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/loader/loader.d.ts b/types/components/loader/loader.d.ts new file mode 100644 index 000000000..94c8df9f5 --- /dev/null +++ b/types/components/loader/loader.d.ts @@ -0,0 +1,44 @@ +declare const _default: { + new (externalPlugins?: any, playerId?: number): { + playerId: number; + playbackPlugins: any[]; + containerPlugins: any[]; + corePlugins: any[]; + /** + * groups by type the external plugins that were passed through `options.plugins` it they're on a flat array + * @method addExternalPlugins + * @private + * @param {Object} an config object or an array of plugins + * @return {Object} plugins the config object with the plugins separated by type + */ + groupPluginsByType(plugins: any): any; + removeDups(list: any, useReversePrecedence?: boolean): any[]; + /** + * adds all the external plugins that were passed through `options.plugins` + * @method addExternalPlugins + * @private + * @param {Object} plugins the config object with all plugins + */ + addExternalPlugins(plugins: any): void; + /** + * validate if the external plugins that were passed through `options.plugins` are associated to the correct type + * @method validateExternalPluginsType + * @private + * @param {Object} plugins the config object with all plugins + */ + validateExternalPluginsType(plugins: any): void; + }; + readonly registeredPlaybacks: any[]; + readonly registeredPlugins: { + core: {}; + container: {}; + }; + checkVersionSupport(entry: any): boolean; + registerPlugin(pluginEntry: any): boolean; + registerPlayback(playbackEntry: any): boolean; + unregisterPlugin(name: any): boolean; + unregisterPlayback(name: any): boolean; + clearPlugins(): void; + clearPlaybacks(): void; +}; +export default _default; diff --git a/types/components/loader/loader.test.d.ts b/types/components/loader/loader.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/loader/loader.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/log/log.d.ts b/types/components/log/log.d.ts new file mode 100644 index 000000000..7d1ef7f24 --- /dev/null +++ b/types/components/log/log.d.ts @@ -0,0 +1,32 @@ +declare class Log { + constructor(level?: number, offLevel?: number); + set level(arg: any); + get level(): any; + _level: any; + EXCLUDE_LIST: string[]; + previousLevel: any; + offLevel: number; + debug(klass: any, ...args: any[]): void; + info(klass: any, ...args: any[]): void; + warn(klass: any, ...args: any[]): void; + error(klass: any, ...args: any[]): void; + onOff(): void; + log(klass: any, level: any, message: any): void; +} +declare namespace Log { + export { LEVEL_DEBUG }; + export { LEVEL_INFO }; + export { LEVEL_WARN }; + export { LEVEL_ERROR }; + export function getInstance(): any; + export function setLevel(level: any): void; + export function debug(...args: any[]): void; + export function info(...args: any[]): void; + export function warn(...args: any[]): void; + export function error(...args: any[]): void; +} +export default Log; +declare const LEVEL_DEBUG: 0; +declare const LEVEL_INFO: 1; +declare const LEVEL_WARN: 2; +declare const LEVEL_ERROR: 3; diff --git a/types/components/log/log.test.d.ts b/types/components/log/log.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/log/log.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/components/player/player.d.ts b/types/components/player/player.d.ts new file mode 100644 index 000000000..ce3908bfe --- /dev/null +++ b/types/components/player/player.d.ts @@ -0,0 +1,371 @@ +/** + * @class Player + * @constructor + * @extends BaseObject + * @module components + * @example + * ### Using the Player + * + * Add the following script on your HTML: + * ```html + * + * + * + * ``` + * Now, create the player: + * ```html + * + *
+ * + * + * ``` + */ +export default class Player { + /** + * @typedef {Object} PlaybackConfig + * @prop {boolean} disableContextMenu + * disables the context menu (right click) on the video element if a HTML5Video playback is used. + * @prop {boolean} preload + * video will be preloaded according to `preload` attribute options **default**: `'metadata'` + * @prop {boolean} controls + * enabled/disables displaying controls + * @prop {boolean} crossOrigin + * enables cross-origin capability for media-resources + * @prop {boolean} playInline + * enables in-line video elements + * @prop {boolean} audioOnly + * enforce audio-only playback (when possible) + * @prop {Object} externalTracks + * pass externaly loaded track to playback + * @prop {Number} [maxBufferLength] + * The default behavior for the **HLS playback** is to keep buffering indefinitely, even on VoD. + * This replicates the behavior for progressive download, which continues buffering when pausing the video, thus making the video available for playback even on slow networks. + * To change this behavior use `maxBufferLength` where **value is in seconds**. + * @prop {Number} [maxBackBufferLength] + * After how much distance of the playhead data should be pruned from the buffer (influences memory consumption + * of adaptive media-engines like Hls.js or Shaka) + * @prop {Number} [minBufferLength] + * After how much data in the buffer at least we attempt to consume it (influences QoS-related behavior + * of adaptive media-engines like Hls.js or Shaka). If this is too low, and the available bandwidth is varying a lot + * and too close to the streamed bitrate, we may continuously hit under-runs. + * @prop {Number} [initialBandwidthEstimate] + * define an initial bandwidth "guess" (or previously stored/established value) for underlying adaptive-bitreate engines + * of adaptive playback implementations, like Hls.js or Shaka + * @prop {Number} [maxAdaptiveBitrate] + * Limits the streamed bitrate (for adaptive media-engines in underlying playback implementations) + * @prop {Object} [maxAdaptiveVideoDimensions] + * Limits the video dimensions in adaptive media-engines. Should be a literal object with `height` and `width`. + * @prop {Boolean}[enableAutomaticABR] **default**: `true` + * Allows to enable/disable automatic bitrate switching in adaptive media-engines + * @prop {String} [preferredTextLanguage] **default**: `'pt-BR'` + * Allows to set a preferred text language, that may be enabled by the media-engine if available. + * @prop {String} [preferredAudioLanguage] **default**: `'pt-BR'` + * Allows to set a preferred audio language, that may be enabled by the media-engine if available. + */ + /** + * ## Player's constructor + * + * You might pass the options object to build the player. + * ```javascript + * var options = {source: "http://example.com/video.mp4", param1: "val1"}; + * var player = new Clappr.Player(options); + * ``` + * + * @method constructor + * @param {Object} options Data + * options to build a player instance + * @param {Number} [options.width] + * player's width **default**: `640` + * @param {Number} [options.height] + * player's height **default**: `360` + * @param {String} [options.parentId] + * the id of the element on the page that the player should be inserted into + * @param {Object} [options.parent] + * a reference to a dom element that the player should be inserted into + * @param {String} [options.source] + * The media source URL, or {source: <>, mimeType: <>} + * @param {Object} [options.sources] + * An array of media source URL's, or an array of {source: <>, mimeType: <>} + * @param {Boolean} [options.autoPlay] + * automatically play after page load **default**: `false` + * @param {Boolean} [options.loop] + * automatically replay after it ends **default**: `false` + * @param {Boolean} [options.chromeless] + * player acts in chromeless mode **default**: `false` + * @param {Boolean} [options.allowUserInteraction] + * whether or not the player should handle click events when in chromeless mode **default**: `false` on desktops browsers, `true` on mobile. + * @param {Boolean} [options.disableKeyboardShortcuts] + * disable keyboard shortcuts. **default**: `false`. `true` if `allowUserInteraction` is `false`. + * @param {Boolean} [options.mute] + * start the video muted **default**: `false` + * @param {String} [options.mimeType] + * add `mimeType: "application/vnd.apple.mpegurl"` if you need to use a url without extension. + * @param {Boolean} [options.actualLiveTime] + * show duration and seek time relative to actual time. + * @param {String} [options.actualLiveServerTime] + * specify server time as a string, format: "2015/11/26 06:01:03". This option is meant to be used with actualLiveTime. + * @param {Boolean} [options.persistConfig] + * persist player's settings (volume) through the same domain **default**: `true` + * @param {String} [options.preload] @deprecated + * video will be preloaded according to `preload` attribute options **default**: `'metadata'` + * @param {Number} [options.maxBufferLength] @deprecated + * the default behavior for the **HLS playback** is to keep buffering indefinitely, even on VoD. + * This replicates the behavior for progressive download, which continues buffering when pausing the video, thus making the video available for playback even on slow networks. + * To change this behavior use `maxBufferLength` where **value is in seconds**. + * @param {String} [options.gaAccount] + * enable Google Analytics events dispatch **(play/pause/stop/buffering/etc)** by adding your `gaAccount` + * @param {String} [options.gaTrackerName] + * besides `gaAccount` you can optionally, pass your favorite trackerName as `gaTrackerName` + * @param {Object} [options.mediacontrol] + * customize control bar colors, example: `mediacontrol: {seekbar: "#E113D3", buttons: "#66B2FF"}` + * @param {Boolean} [options.hideMediaControl] + * control media control auto hide **default**: `true` + * @param {Boolean} [options.hideVolumeBar] + * when embedded with width less than 320, volume bar will hide. You can force this behavior for all sizes by adding `true` **default**: `false` + * @param {String} [options.watermark] + * put `watermark: 'http://url/img.png'` on your embed parameters to automatically add watermark on your video. + * You can customize corner position by defining position parameter. Positions can be `bottom-left`, `bottom-right`, `top-left` and `top-right`. + * @param {String} [options.watermarkLink] + * `watermarkLink: 'http://example.net/'` - define URL to open when the watermark is clicked. If not provided watermark will not be clickable. + * @param {Boolean} [options.disableVideoTagContextMenu] @deprecated + * disables the context menu (right click) on the video element if a HTML5Video playback is used. + * @param {Boolean} [options.autoSeekFromUrl] + * Automatically seek to the seconds provided in the url (e.g example.com?t=100) **default**: `true` + * @param {Boolean} [options.exitFullscreenOnEnd] + * Automatically exit full screen when the media finishes. **default**: `true` + * @param {String} [options.poster] + * define a poster by adding its address `poster: 'http://url/img.png'`. It will appear after video embed, disappear on play and go back when user stops the video. + * @param {String} [options.playbackNotSupportedMessage] + * define a custom message to be displayed when a playback is not supported. + * @param {Object} [options.events] + * Specify listeners which will be registered with their corresponding player events. + * E.g. onReady -> "PLAYER_READY", onTimeUpdate -> "PLAYER_TIMEUPDATE" + * @param {PlaybackConfig} [options.playback] + * Generic `Playback` component related configuration + * @param {Boolean} [options.disableErrorScreen] + * disables the error screen plugin. + * @param {Number} [options.autoPlayTimeout] + * autoplay check timeout. + */ + constructor(options: { + width?: number; + height?: number; + parentId?: string; + parent?: any; + source?: string; + sources?: any; + autoPlay?: boolean; + loop?: boolean; + chromeless?: boolean; + allowUserInteraction?: boolean; + disableKeyboardShortcuts?: boolean; + mute?: boolean; + mimeType?: string; + actualLiveTime?: boolean; + actualLiveServerTime?: string; + persistConfig?: boolean; + preload?: string; + }); + set loader(arg: any); + get loader(): any; + _loader: any; + /** + * Determine if the playback has ended. + * @property ended + * @type Boolean + */ + get ended(): boolean; + /** + * Determine if the playback is having to buffer in order for + * playback to be smooth. + * (i.e if a live stream is playing smoothly, this will be false) + * @property buffering + * @type Boolean + */ + get buffering(): boolean; + get isReady(): boolean; + /** + * An events map that allows the user to add custom callbacks in player's options. + * @property eventsMapping + * @type {Object} + */ + get eventsMapping(): any; + _options: any; + _coreFactory: any; + /** + * Returns the parent element + * @param {String} parentId + * @param {Object} parent + * @returns {Object} the parent element + */ + _getParentElement({ parentId, parent }: string): any; + /** + * You can use this method to attach the player to a given element. You don't need to do this when you specify it during the player instantiation passing the `parentId` param. + * @method attachTo + * @param {Object} element a given element. + * @return {Player} itself + */ + attachTo(element: any): Player; + core: any; + _addEventListeners(): this; + _addContainerEventListeners(): this; + _registerOptionEventListeners(newEvents?: {}, events?: {}): this; + _containerChanged(): void; + _onReady(): void; + _ready: boolean; + _onFullscreenChange(fullscreen: any): void; + _onVolumeUpdate(volume: any): void; + _onSubtitleAvailable(): void; + _onResize(size: any): void; + _onPlay(_: any, eventMetadata?: {}): void; + _onPause(_: any, eventMetadata?: {}): void; + _onStop(eventMetadata?: {}): void; + _onEnded(): void; + _onSeek(time: any): void; + _onTimeUpdate(timeProgress: any): void; + _onError(error: any): void; + _normalizeSources(options: any): any; + /** + * resizes the current player canvas. + * @method resize + * @param {Object} size should be a literal object with `height` and `width`. + * @return {Player} itself + * @example + * ```javascript + * player.resize({height: 360, width: 640}) + * ``` + */ + resize(size: any): Player; + /** + * loads a new source. + * @method load + * @param {Array|String} sources source or sources of video. + * An array item can be a string or {source: <>, mimeType: <>} + * @param {String} mimeType a mime type, example: `'application/vnd.apple.mpegurl'` + * @param {Boolean} [autoPlay=false] whether playing should be started immediately + * @return {Player} itself + */ + load(sources: any[] | string, mimeType: string, autoPlay?: boolean): Player; + /** + * destroys the current player and removes it from the DOM. + * @method destroy + * @return {Player} itself + */ + destroy(): Player; + /** + * Gives user consent to playback. Required by mobile device after a click event before Player.load(). + * @method consent + * @param {Function} callback function called when current playback is consented + * @example + * ```javascript + * player.consent(function() { doSomethingNext(); }); + * ``` + */ + consent(cb: any): void; + /** + * plays the current video (`source`). + * @method play + * @param {Object} customData + * @return {Player} itself + */ + play(customData?: any): Player; + /** + * pauses the current video (`source`). + * @method pause + * @param {Object} customData + * @return {Player} itself + */ + pause(customData?: any): Player; + /** + * stops the current video (`source`). + * @method stop + * @param {Object} customData + * @return {Player} itself + */ + stop(customData?: any): Player; + /** + * seeks the current video (`source`). For example, `player.seek(120)` will seek to second 120 (2minutes) of the current video. + * @method seek + * @param {Number} time should be a number between 0 and the video duration. + * @return {Player} itself + */ + seek(time: number): Player; + /** + * seeks the current video (`source`). For example, `player.seek(50)` will seek to the middle of the current video. + * @method seekPercentage + * @param {Number} time should be a number between 0 and 100. + * @return {Player} itself + */ + seekPercentage(percentage: any): Player; + /** + * mutes the current video (`source`). + * @method mute + * @return {Player} itself + */ + mute(): Player; + /** + * unmutes the current video (`source`). + * @method unmute + * @return {Player} itself + */ + unmute(): Player; + /** + * checks if the player is playing. + * @method isPlaying + * @return {Boolean} `true` if the current source is playing, otherwise `false` + */ + isPlaying(): boolean; + /** + * returns `true` if DVR is enable otherwise `false`. + * @method isDvrEnabled + * @return {Boolean} + */ + isDvrEnabled(): boolean; + /** + * returns `true` if DVR is in use otherwise `false`. + * @method isDvrInUse + * @return {Boolean} + */ + isDvrInUse(): boolean; + /** + * enables to configure a player after its creation + * @method configure + * @param {Object} options all the options to change in form of a javascript object + * @return {Player} itself + */ + configure(options?: any): Player; + /** + * get a plugin by its name. + * @method getPlugin + * @param {String} name of the plugin. + * @return {Object} the plugin instance + * @example + * ```javascript + * var poster = player.getPlugin('poster'); + * poster.hidePlayButton(); + * ``` + */ + getPlugin(name: string): any; + /** + * the current time in seconds. + * @method getCurrentTime + * @return {Number} current time (in seconds) of the current source + */ + getCurrentTime(): number; + /** + * The time that "0" now represents relative to when playback started. + * For a stream with a sliding window this will increase as content is + * removed from the beginning. + * @method getStartTimeOffset + * @return {Number} time (in seconds) that time "0" represents. + */ + getStartTimeOffset(): number; + /** + * the duration time in seconds. + * @method getDuration + * @return {Number} duration time (in seconds) of the current source + */ + getDuration(): number; +} diff --git a/types/components/player/player.test.d.ts b/types/components/player/player.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/components/player/player.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/external_plugin.test.d.ts b/types/external_plugin.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/external_plugin.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/main.d.ts b/types/main.d.ts new file mode 100644 index 000000000..e7e1e4345 --- /dev/null +++ b/types/main.d.ts @@ -0,0 +1,29 @@ +declare namespace _default { + export { Player }; + export { Events }; + export { Browser }; + export { ContainerPlugin }; + export { UIContainerPlugin }; + export { CorePlugin }; + export { UICorePlugin }; + export { Playback }; + export { Container }; + export { Core }; + export { PlayerError }; + export { Loader }; + export { BaseObject }; + export { UIObject }; + export { Utils }; + export { HTML5Audio }; + export { HTML5Video }; + export { HTMLImg }; + export { Log }; + export { Styler }; + export { version }; + export { template }; + export { $ }; +} +export default _default; +export const version: any; +import template from './base/template'; +export { Player, Events, Browser, ContainerPlugin, UIContainerPlugin, CorePlugin, UICorePlugin, Playback, Container, Core, PlayerError, Loader, BaseObject, UIObject, Utils, HTML5Audio, HTML5Video, HTMLImg, Log, Styler, template, $ }; diff --git a/types/playbacks/html5_audio/html5_audio.d.ts b/types/playbacks/html5_audio/html5_audio.d.ts new file mode 100644 index 000000000..8150e908e --- /dev/null +++ b/types/playbacks/html5_audio/html5_audio.d.ts @@ -0,0 +1,14 @@ +declare class HTML5Audio { + get name(): string; + get supportedVersion(): { + min: any; + }; + get tagName(): string; + get isAudioOnly(): boolean; + updateSettings(): void; + getPlaybackType(): any; +} +declare namespace HTML5Audio { + function canPlay(resourceUrl: any, mimeType: any): any; +} +export default HTML5Audio; diff --git a/types/playbacks/html5_audio/html5_audio.test.d.ts b/types/playbacks/html5_audio/html5_audio.test.d.ts new file mode 100644 index 000000000..cb0ff5c3b --- /dev/null +++ b/types/playbacks/html5_audio/html5_audio.test.d.ts @@ -0,0 +1 @@ +export {}; diff --git a/types/playbacks/html5_video/html5_video.d.ts b/types/playbacks/html5_video/html5_video.d.ts new file mode 100644 index 000000000..111fa14a3 --- /dev/null +++ b/types/playbacks/html5_video/html5_video.d.ts @@ -0,0 +1,151 @@ +declare class HTML5Video { + constructor(...args: any[]); + get name(): string; + get supportedVersion(): { + min: any; + }; + get tagName(): "audio" | "video"; + get isAudioOnly(): any; + get attributes(): { + 'data-html5-video': string; + }; + get events(): { + canplay: string; + canplaythrough: string; + durationchange: string; + ended: string; + error: string; + loadeddata: string; + loadedmetadata: string; + pause: string; + playing: string; + progress: string; + seeking: string; + seeked: string; + stalled: string; + timeupdate: string; + waiting: string; + }; + /** + * Determine if the playback has ended. + * @property ended + * @type Boolean + */ + get ended(): boolean; + /** + * Determine if the playback is having to buffer in order for + * playback to be smooth. + * This is related to the PLAYBACK_BUFFERING and PLAYBACK_BUFFERFULL events + * @property buffering + * @type Boolean + */ + get buffering(): boolean; + get isLive(): boolean; + get dvrEnabled(): boolean; + get minimumDVRSizeConfig(): any; + get isValidMinimumDVRSizeConfig(): boolean; + get sourceMedia(): any; + _destroyed: boolean; + _loadStarted: boolean; + _isBuffering: boolean; + _playheadMoving: boolean; + _playheadMovingTimer: NodeJS.Timeout; + _stopped: boolean; + _ccTrackId: number; + _minDvrSize: any; + settings: { + default: string[]; + }; + configure(options: any): void; + attemptAutoPlay(): void; + canAutoPlay(cb: any): void; + _setupExternalTracks(tracks: any): void; + _externalTracks: any; + /** + * Sets the source url on the