MAJOR! Refactor bsp to class

docs/api/scripts/misc.js

@@ -67,8 +67,15 @@ function copyFunction(id) {
         var copyToClipboard = '<div class="code-copy-icon-container" onclick="copyFunction(\'' + id + '\')"><div><svg class="sm-icon" alt="click to copy"><use xlink:href="#copy-icon"></use></svg>' + tooltip + '<div></div>';
 
         // extract the code language
-        var langName = classList[classList.length - 1].split('-')[1];
+        var langName = classList[classList.length - 1];
 
+        if (typeof langName === 'string') {
+            langName = langName.split('-')[1];
+        }
+
+        /**
+         * By default language name is javascript.
+         */
         if ( langName === undefined ) { langName = 'JavaScript'; }
 
         // if(langName != undefined)

docs/api/scripts/search.js

@@ -39,20 +39,16 @@ function search(list, options, keys, searchKey) {
 
     var result = fuse.search(searchKey);
 
-    console.log(result, result.length);
     if (result.length > 20) { result = result.slice(0, 20); }
 
-    console.log(result);
     var searchUL = document.getElementById('search-item-ul');
 
-    searchUL.innerHTML = '';
-
     if (result.length === 0) {
-        searchUL.innerHTML += '<li class="p-h-n"> No Result Found </li>';
+        searchUL.innerHTML = '<li class="p-h-n"> No Result Found </li>';
     } else {
-        result.forEach(function(obj) {
-            searchUL.innerHTML += '<li>' + obj.item.link + '</li>';
-        });
+        searchUL.innerHTML = result.reduce(function(html, obj) {
+            return html + '<li>' + obj.item.link + '</li>';
+        }, '');
     }
 }
 
@@ -79,5 +75,3 @@ function setupSearch(list, options) {
         window.addEventListener('click', checkClick);
     });
 }
-
-

docs/api/styles/reset.css

@@ -240,8 +240,13 @@ ol.linenums li {
     padding-left: 0;
 }
 
+.prettyprint.linenums code,
 .prettyprint.linenums li {
-    min-height: 18px;
+    min-height: 25px;
+}
+
+.prettyprint.linenums code {
+    display: inline;
 }
 
 .prettyprint.linenums li.selected,

docs/arch/004-use-class.md

@@ -0,0 +1,27 @@
+#  004 Use Class
+
+Originally added: 1 December, 2022.
+
+##  Context
+
+BigscreenPlayer would benefit from being more in-line with established Web APIs such as `EventTarget`. To acheive this it should first become a class, so we can extend f.ex. `EventTarget`. `EventTarget` specifically would deprecate all `onStateChange` and `onTimeChange` handlers, as well as the Plugin interface.
+
+Implementing EventTarget would deprecate the current `onStateChange` and `onTimeChange` callbacks in favour of `addEventListener` as well as BSP plugins. We have had issues before with downstream consumers using these APIs in unexpected ways (see [BSP v5.6.1: Fix unregistered callbacks being called](https://github.com/bbc/bigscreen-player/releases/tag/5.6.1). Raw link: <https://github.com/bbc/bigscreen-player/releases/tag/5.6.1>).
+
+##  Decision
+
+Refactor BigscreenPlayer to use the `Class` JavaScript construct and syntax instead of `Function` syntax.
+
+##  Status
+
+Proposed.
+
+##  Consequences
+
+- Implementing BigscreenPlayer as a class makes it easier to implement Web APIs such as `EventTarget` to combat our tech debt. `EventTarget` specifically would deprecate all `onStateChange` and `onTimeChange` handlers, as well as the Plugin interface.
+
+##  Further Reading
+
+- [ADR Github Organisation](https://adr.github.io/). Raw link: <https://adr.github.io/>
+- [MDN web docs on JavaScript Classes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes). Raw link: <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes>
+- [MDN web docs on EventTarget Web API](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget). Raw link: <https://developer.mozilla.org/en-US/docs/Web/API/EventTarget>

package.json

@@ -14,16 +14,15 @@
     "CONTRIBUTING.md"
   ],
   "scripts": {
-    "prepare": "[ ! -d dist/ ] && npm run build || exit 0",
-    "docs": "npx jsdoc -c jsdoc.conf.json",
-    "build": "npm run build:clean && npm run build:bundle",
-    "build:clean": "rm -rf dist",
-    "build:bundle": "rollup -c rollup.config.js",
-    "watch": "rollup -c rollup.config.js -w",
-    "start": "rollup -c rollup.dev.config.js -w",
+    "start": "rollup --config rollup.dev.config.js --watch",
+    "watch": "rollup --config rollup.config.js --watch",
     "test": "jest",
+    "docs": "npx jsdoc --config jsdoc.conf.json",
+    "prebuild": "rm -rf dist",
+    "build": "rollup --config rollup.config.js",
     "coverage": "jest --coverage",
-    "lint": "eslint ."
+    "lint": "eslint .",
+    "prepare": "[ ! -d dist/ ] && npm run build || exit 0"
   },
   "husky": {
     "hooks": {
@@ -82,4 +81,4 @@
     "url": "https://github.com/bbc/bigscreen-player/issues"
   },
   "homepage": "https://github.com/bbc/bigscreen-player#readme"
-}
+}