diff --git a/p2p-media-loader-core/.editorconfig b/p2p-media-loader-core/.editorconfig
index 4b43aa8e..6c761897 100644
--- a/p2p-media-loader-core/.editorconfig
+++ b/p2p-media-loader-core/.editorconfig
@@ -7,6 +7,7 @@ end_of_line              = lf
 charset                  = utf-8
 trim_trailing_whitespace = true
 insert_final_newline     = true
+max_line_length          = 120
 [*.md]
 trim_trailing_whitespace = false
 [*.json]
diff --git a/p2p-media-loader-core/.eslintrc b/p2p-media-loader-core/.eslintrc
index b22e2242..0484f2e1 100644
--- a/p2p-media-loader-core/.eslintrc
+++ b/p2p-media-loader-core/.eslintrc
@@ -11,7 +11,8 @@
         "eslint:recommended",
         "plugin:@typescript-eslint/eslint-recommended",
         "plugin:@typescript-eslint/recommended",
-        "plugin:@typescript-eslint/recommended-requiring-type-checking"
+        "plugin:@typescript-eslint/recommended-requiring-type-checking",
+        "prettier"
     ],
     "env": {
         "browser": true
diff --git a/p2p-media-loader-core/lib/bandwidth-approximator.ts b/p2p-media-loader-core/lib/bandwidth-approximator.ts
index 1b44fb92..e0241375 100644
--- a/p2p-media-loader-core/lib/bandwidth-approximator.ts
+++ b/p2p-media-loader-core/lib/bandwidth-approximator.ts
@@ -37,7 +37,7 @@ export class BandwidthApproximator {
 
         const interval = Math.min(SMOOTH_INTERVAL, timeStamp);
         this.lastBandwidth.push(new NumberWithTime(this.currentBytesSum / interval, timeStamp));
-    }
+    };
 
     // in bytes per millisecond
     public getBandwidth = (timeStamp: number): number => {
@@ -53,13 +53,13 @@ export class BandwidthApproximator {
         }
 
         return maxBandwidth;
-    }
+    };
 
     public getSmoothInterval = (): number => {
         return SMOOTH_INTERVAL;
-    }
+    };
 
     public getMeasureInterval = (): number => {
         return MEASURE_INTERVAL;
-    }
+    };
 }
diff --git a/p2p-media-loader-core/lib/http-media-manager.ts b/p2p-media-loader-core/lib/http-media-manager.ts
index da53df16..21425136 100644
--- a/p2p-media-loader-core/lib/http-media-manager.ts
+++ b/p2p-media-loader-core/lib/http-media-manager.ts
@@ -20,21 +20,20 @@ import { STEEmitter } from "./stringly-typed-event-emitter";
 import { Segment } from "./loader-interface";
 import { SegmentValidatorCallback, XhrSetupCallback, SegmentUrlBuilder } from "./hybrid-loader";
 
-export class HttpMediaManager extends STEEmitter<
-    "segment-loaded" | "segment-error" | "bytes-downloaded"
-> {
-
-    private xhrRequests = new Map<string, {xhr: XMLHttpRequest, segment: Segment}>();
+export class HttpMediaManager extends STEEmitter<"segment-loaded" | "segment-error" | "bytes-downloaded"> {
+    private xhrRequests = new Map<string, { xhr: XMLHttpRequest; segment: Segment }>();
     private failedSegments = new Map<string, number>();
     private debug = Debug("p2pml:http-media-manager");
 
-    public constructor(readonly settings: {
-        httpFailedSegmentTimeout: number,
-        httpUseRanges: boolean,
-        segmentValidator?: SegmentValidatorCallback,
-        xhrSetup?: XhrSetupCallback
-        segmentUrlBuilder?: SegmentUrlBuilder
-    }) {
+    public constructor(
+        readonly settings: {
+            httpFailedSegmentTimeout: number;
+            httpUseRanges: boolean;
+            segmentValidator?: SegmentValidatorCallback;
+            xhrSetup?: XhrSetupCallback;
+            segmentUrlBuilder?: SegmentUrlBuilder;
+        }
+    ) {
         super();
     }
 
@@ -45,9 +44,7 @@ export class HttpMediaManager extends STEEmitter<
 
         this.cleanTimedOutFailedSegments();
 
-        const segmentUrl = this.settings.segmentUrlBuilder
-            ? this.settings.segmentUrlBuilder(segment)
-            : segment.url;
+        const segmentUrl = this.settings.segmentUrlBuilder ? this.settings.segmentUrlBuilder(segment) : segment.url;
 
         this.debug("http segment download", segmentUrl);
 
@@ -60,7 +57,7 @@ export class HttpMediaManager extends STEEmitter<
         if (segment.range) {
             xhr.setRequestHeader("Range", segment.range);
             downloadedPieces = undefined; // TODO: process downloadedPieces for segments with range headers too
-        } else if ((downloadedPieces !== undefined) && this.settings.httpUseRanges) {
+        } else if (downloadedPieces !== undefined && this.settings.httpUseRanges) {
             let bytesDownloaded = 0;
             for (const piece of downloadedPieces) {
                 bytesDownloaded += piece.byteLength;
@@ -79,9 +76,9 @@ export class HttpMediaManager extends STEEmitter<
             this.settings.xhrSetup(xhr, segmentUrl);
         }
 
-        this.xhrRequests.set(segment.id, {xhr, segment});
+        this.xhrRequests.set(segment.id, { xhr, segment });
         xhr.send();
-    }
+    };
 
     public abort = (segment: Segment): void => {
         const request = this.xhrRequests.get(segment.id);
@@ -91,29 +88,29 @@ export class HttpMediaManager extends STEEmitter<
             this.xhrRequests.delete(segment.id);
             this.debug("http segment abort", segment.id);
         }
-    }
+    };
 
     public isDownloading = (segment: Segment): boolean => {
         return this.xhrRequests.has(segment.id);
-    }
+    };
 
     public isFailed = (segment: Segment): boolean => {
         const time = this.failedSegments.get(segment.id);
         return time !== undefined && time > this.now();
-    }
+    };
 
-    public getActiveDownloads = (): ReadonlyMap<string, {segment: Segment}> => {
+    public getActiveDownloads = (): ReadonlyMap<string, { segment: Segment }> => {
         return this.xhrRequests;
-    }
+    };
 
     public getActiveDownloadsCount = (): number => {
         return this.xhrRequests.size;
-    }
+    };
 
     public destroy = (): void => {
-        this.xhrRequests.forEach(request => request.xhr.abort());
+        this.xhrRequests.forEach((request) => request.xhr.abort());
         this.xhrRequests.clear();
-    }
+    };
 
     private setupXhrEvents = (xhr: XMLHttpRequest, segment: Segment, downloadedPieces?: ArrayBuffer[]) => {
         let prevBytesLoaded = 0;
@@ -125,14 +122,14 @@ export class HttpMediaManager extends STEEmitter<
         });
 
         xhr.addEventListener("load", async (event) => {
-            if ((xhr.status < 200) || (xhr.status >= 300)) {
+            if (xhr.status < 200 || xhr.status >= 300) {
                 this.segmentFailure(segment, event, xhr);
                 return;
             }
 
             let data = xhr.response as ArrayBuffer;
 
-            if ((downloadedPieces !== undefined) && (xhr.status === 206)) {
+            if (downloadedPieces !== undefined && xhr.status === 206) {
                 let bytesDownloaded = 0;
                 for (const piece of downloadedPieces) {
                     bytesDownloaded += piece.byteLength;
@@ -160,7 +157,7 @@ export class HttpMediaManager extends STEEmitter<
         xhr.addEventListener("timeout", (event: unknown) => {
             this.segmentFailure(segment, event, xhr);
         });
-    }
+    };
 
     private segmentDownloadFinished = async (segment: Segment, data: ArrayBuffer, xhr: XMLHttpRequest) => {
         segment.responseUrl = xhr.responseURL === null ? undefined : xhr.responseURL;
@@ -177,7 +174,7 @@ export class HttpMediaManager extends STEEmitter<
 
         this.xhrRequests.delete(segment.id);
         this.emit("segment-loaded", segment, data);
-    }
+    };
 
     private segmentFailure = (segment: Segment, error: unknown, xhr: XMLHttpRequest) => {
         segment.responseUrl = xhr.responseURL === null ? undefined : xhr.responseURL;
@@ -185,7 +182,7 @@ export class HttpMediaManager extends STEEmitter<
         this.xhrRequests.delete(segment.id);
         this.failedSegments.set(segment.id, this.now() + this.settings.httpFailedSegmentTimeout);
         this.emit("segment-error", segment, error);
-    }
+    };
 
     private cleanTimedOutFailedSegments = () => {
         const now = this.now();
@@ -197,9 +194,8 @@ export class HttpMediaManager extends STEEmitter<
             }
         });
 
-        candidates.forEach(id => this.failedSegments.delete(id));
-    }
+        candidates.forEach((id) => this.failedSegments.delete(id));
+    };
 
     private now = () => performance.now();
-
 }
diff --git a/p2p-media-loader-core/lib/hybrid-loader.ts b/p2p-media-loader-core/lib/hybrid-loader.ts
index 5979ee5d..d19d82a0 100644
--- a/p2p-media-loader-core/lib/hybrid-loader.ts
+++ b/p2p-media-loader-core/lib/hybrid-loader.ts
@@ -51,11 +51,10 @@ const defaultSettings: HybridLoaderSettings = {
     webRtcMaxMessageSize: 64 * 1024 - 1,
     trackerAnnounce: ["wss://tracker.novage.com.ua", "wss://tracker.openwebtorrent.com"],
     peerRequestsPerAnnounce: 10,
-    rtcConfig: (Peer as { config: RTCConfiguration }).config
+    rtcConfig: (Peer as { config: RTCConfiguration }).config,
 };
 
 export class HybridLoader extends EventEmitter implements LoaderInterface {
-
     private readonly debug = Debug("p2pml:hybrid-loader");
     private readonly debugSegments = Debug("p2pml:hybrid-loader-segments");
     private readonly httpManager: HttpMediaManager;
@@ -69,8 +68,8 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
     private masterSwarmId?: string;
 
     public static isSupported = (): boolean => {
-        return (window.RTCPeerConnection.prototype.createDataChannel !== undefined);
-    }
+        return window.RTCPeerConnection.prototype.createDataChannel !== undefined;
+    };
 
     public constructor(settings: Partial<HybridLoaderSettings> = {}) {
         super();
@@ -89,9 +88,10 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
             }
         }
 
-        this.segmentsStorage = (this.settings.segmentsStorage === undefined
-            ? new SegmentsMemoryStorage(this.settings)
-            : this.settings.segmentsStorage);
+        this.segmentsStorage =
+            this.settings.segmentsStorage === undefined
+                ? new SegmentsMemoryStorage(this.settings)
+                : this.settings.segmentsStorage;
 
         this.debug("loader settings", this.settings);
 
@@ -113,8 +113,12 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 this.p2pManager.sendSegmentsMapToAll(this.createSegmentsMap(storageSegments));
             }
         });
-        this.p2pManager.on("bytes-downloaded", (bytes: number, peerId: string) => this.onPieceBytesDownloaded("p2p", bytes, peerId));
-        this.p2pManager.on("bytes-uploaded", (bytes: number, peerId: string) => this.onPieceBytesUploaded("p2p", bytes, peerId));
+        this.p2pManager.on("bytes-downloaded", (bytes: number, peerId: string) =>
+            this.onPieceBytesDownloaded("p2p", bytes, peerId)
+        );
+        this.p2pManager.on("bytes-uploaded", (bytes: number, peerId: string) =>
+            this.onPieceBytesUploaded("p2p", bytes, peerId)
+        );
         this.p2pManager.on("peer-connected", this.onPeerConnect);
         this.p2pManager.on("peer-closed", this.onPeerClose);
         this.p2pManager.on("tracker-update", this.onTrackerUpdate);
@@ -122,19 +126,31 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
 
     private createHttpManager = () => {
         return new HttpMediaManager(this.settings);
-    }
+    };
 
     private createP2PManager = () => {
         return new P2PMediaManager(this.segmentsStorage, this.settings);
-    }
+    };
 
     public load = async (segments: Segment[], streamSwarmId: string): Promise<void> => {
-        if (this.httpRandomDownloadInterval === undefined) { // Do once on first call
-            this.httpRandomDownloadInterval = setInterval(this.downloadRandomSegmentOverHttp, this.settings.httpDownloadProbabilityInterval);
-
-            if (this.settings.httpDownloadInitialTimeout > 0 && this.settings.httpDownloadInitialTimeoutPerSegment > 0) {
+        if (this.httpRandomDownloadInterval === undefined) {
+            // Do once on first call
+            this.httpRandomDownloadInterval = setInterval(
+                this.downloadRandomSegmentOverHttp,
+                this.settings.httpDownloadProbabilityInterval
+            );
+
+            if (
+                this.settings.httpDownloadInitialTimeout > 0 &&
+                this.settings.httpDownloadInitialTimeoutPerSegment > 0
+            ) {
                 // Initialize initial HTTP download timeout (i.e. download initial segments over P2P)
-                this.debugSegments("enable initial HTTP download timeout", this.settings.httpDownloadInitialTimeout, "per segment", this.settings.httpDownloadInitialTimeoutPerSegment);
+                this.debugSegments(
+                    "enable initial HTTP download timeout",
+                    this.settings.httpDownloadInitialTimeout,
+                    "per segment",
+                    this.settings.httpDownloadInitialTimeoutPerSegment
+                );
                 this.httpDownloadInitialTimeoutTimestamp = this.now();
                 setTimeout(this.processInitialSegmentTimeout, this.settings.httpDownloadInitialTimeoutPerSegment + 100);
             }
@@ -154,7 +170,7 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
 
         // stop all http requests and p2p downloads for segments that are not in the new load
         for (const segment of this.segmentsQueue) {
-            if (!segments.find(f => f.url === segment.url)) {
+            if (!segments.find((f) => f.url === segment.url)) {
                 this.debug("remove segment", segment.url);
                 if (this.httpManager.isDownloading(segment)) {
                     updateSegmentsMap = true;
@@ -168,7 +184,7 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
 
         if (this.debug.enabled) {
             for (const segment of segments) {
-                if (!this.segmentsQueue.find(f => f.url === segment.url)) {
+                if (!this.segmentsQueue.find((f) => f.url === segment.url)) {
                     this.debug("add segment", segment.url);
                 }
             }
@@ -181,7 +197,7 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         }
 
         let storageSegments = await this.segmentsStorage.getSegmentsMap(this.masterSwarmId);
-        updateSegmentsMap = (this.processSegmentsQueue(storageSegments) || updateSegmentsMap);
+        updateSegmentsMap = this.processSegmentsQueue(storageSegments) || updateSegmentsMap;
 
         if (await this.cleanSegmentsStorage()) {
             storageSegments = await this.segmentsStorage.getSegmentsMap(this.masterSwarmId);
@@ -191,23 +207,21 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         if (updateSegmentsMap && !this.settings.consumeOnly) {
             this.p2pManager.sendSegmentsMapToAll(this.createSegmentsMap(storageSegments));
         }
-    }
+    };
 
     public getSegment = async (id: string): Promise<Segment | undefined> => {
-        return this.masterSwarmId === undefined
-            ? undefined
-            : this.segmentsStorage.getSegment(id, this.masterSwarmId);
-    }
+        return this.masterSwarmId === undefined ? undefined : this.segmentsStorage.getSegment(id, this.masterSwarmId);
+    };
 
     public getSettings = (): HybridLoaderSettings => {
         return this.settings;
-    }
+    };
 
     public getDetails = (): { peerId: string } => {
         return {
-            peerId: this.p2pManager.getPeerId()
+            peerId: this.p2pManager.getPeerId(),
         };
-    }
+    };
 
     public destroy = async (): Promise<void> => {
         if (this.httpRandomDownloadInterval !== undefined) {
@@ -222,7 +236,7 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         this.p2pManager.destroy();
         this.masterSwarmId = undefined;
         await this.segmentsStorage.destroy();
-    }
+    };
 
     private processInitialSegmentTimeout = async () => {
         if (this.httpRandomDownloadInterval === undefined) {
@@ -241,11 +255,13 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
             // Set one more timeout for a next segment
             setTimeout(this.processInitialSegmentTimeout, this.settings.httpDownloadInitialTimeoutPerSegment);
         }
-    }
+    };
 
-    private processSegmentsQueue = (storageSegments: Map<string, {segment: Segment}>) => {
-        this.debugSegments("process segments queue. priority",
-                this.segmentsQueue.length > 0 ? this.segmentsQueue[0].priority : 0);
+    private processSegmentsQueue = (storageSegments: Map<string, { segment: Segment }>) => {
+        this.debugSegments(
+            "process segments queue. priority",
+            this.segmentsQueue.length > 0 ? this.segmentsQueue[0].priority : 0
+        );
 
         if (this.masterSwarmId === undefined || this.segmentsQueue.length === 0) {
             return false;
@@ -267,8 +283,11 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
             }
 
             const httpTimeout = this.now() - this.httpDownloadInitialTimeoutTimestamp;
-            httpAllowed = (httpTimeout >= this.settings.httpDownloadInitialTimeout)
-                    || ((firstNotDownloadePriority !== undefined) && (httpTimeout > this.settings.httpDownloadInitialTimeoutPerSegment) && (firstNotDownloadePriority <= 0));
+            httpAllowed =
+                httpTimeout >= this.settings.httpDownloadInitialTimeout ||
+                (firstNotDownloadePriority !== undefined &&
+                    httpTimeout > this.settings.httpDownloadInitialTimeoutPerSegment &&
+                    firstNotDownloadePriority <= 0);
 
             if (httpAllowed) {
                 this.debugSegments("cancel initial HTTP download timeout - timed out");
@@ -283,7 +302,11 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 continue;
             }
 
-            if (segment.priority <= this.settings.requiredSegmentsPriority && httpAllowed && !this.httpManager.isFailed(segment)) {
+            if (
+                segment.priority <= this.settings.requiredSegmentsPriority &&
+                httpAllowed &&
+                !this.httpManager.isFailed(segment)
+            ) {
                 // Download required segments over HTTP
                 if (this.httpManager.getActiveDownloadsCount() >= this.settings.simultaneousHttpDownloads) {
                     // Not enough HTTP download resources. Abort one of the HTTP downloads.
@@ -311,7 +334,8 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 continue;
             }
 
-            if (segment.priority <= this.settings.requiredSegmentsPriority) { // Download required segments over P2P
+            if (segment.priority <= this.settings.requiredSegmentsPriority) {
+                // Download required segments over P2P
                 segmentsMap = segmentsMap ? segmentsMap : this.p2pManager.getOverallSegmentsMap();
 
                 if (segmentsMap.get(segment.id) !== MediaPeerSegmentStatus.Loaded) {
@@ -340,8 +364,10 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 continue;
             }
 
-            if (this.p2pManager.getActiveDownloadsCount() < this.settings.simultaneousP2PDownloads &&
-                    segment.priority <= this.settings.p2pDownloadMaxPriority) {
+            if (
+                this.p2pManager.getActiveDownloadsCount() < this.settings.simultaneousP2PDownloads &&
+                segment.priority <= this.settings.p2pDownloadMaxPriority
+            ) {
                 if (this.p2pManager.download(segment)) {
                     this.debugSegments("P2P download", segment.priority, segment.url);
                 }
@@ -349,28 +375,32 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         }
 
         return updateSegmentsMap;
-    }
+    };
 
     private downloadRandomSegmentOverHttp = async () => {
-        if (this.masterSwarmId === undefined ||
-                this.httpRandomDownloadInterval === undefined ||
-                this.httpDownloadInitialTimeoutTimestamp !== -Infinity ||
-                this.httpManager.getActiveDownloadsCount() >= this.settings.simultaneousHttpDownloads ||
-                (this.settings.httpDownloadProbabilitySkipIfNoPeers && this.p2pManager.getPeers().size === 0) ||
-                this.settings.consumeOnly) {
+        if (
+            this.masterSwarmId === undefined ||
+            this.httpRandomDownloadInterval === undefined ||
+            this.httpDownloadInitialTimeoutTimestamp !== -Infinity ||
+            this.httpManager.getActiveDownloadsCount() >= this.settings.simultaneousHttpDownloads ||
+            (this.settings.httpDownloadProbabilitySkipIfNoPeers && this.p2pManager.getPeers().size === 0) ||
+            this.settings.consumeOnly
+        ) {
             return;
         }
 
         const storageSegments = await this.segmentsStorage.getSegmentsMap(this.masterSwarmId);
         const segmentsMap = this.p2pManager.getOverallSegmentsMap();
 
-        const pendingQueue = this.segmentsQueue.filter(s =>
-            !this.p2pManager.isDownloading(s) &&
-            !this.httpManager.isDownloading(s) &&
-            !segmentsMap.has(s.id) &&
-            !this.httpManager.isFailed(s) &&
-            (s.priority <= this.settings.httpDownloadMaxPriority) &&
-            !storageSegments.has(s.id));
+        const pendingQueue = this.segmentsQueue.filter(
+            (s) =>
+                !this.p2pManager.isDownloading(s) &&
+                !this.httpManager.isDownloading(s) &&
+                !segmentsMap.has(s.id) &&
+                !this.httpManager.isFailed(s) &&
+                s.priority <= this.settings.httpDownloadMaxPriority &&
+                !storageSegments.has(s.id)
+        );
 
         if (pendingQueue.length === 0) {
             return;
@@ -384,16 +414,16 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         this.debugSegments("HTTP download (random)", segment.priority, segment.url);
         this.httpManager.download(segment);
         this.p2pManager.sendSegmentsMapToAll(this.createSegmentsMap(storageSegments));
-    }
+    };
 
     private onPieceBytesDownloaded = (method: "http" | "p2p", bytes: number, peerId?: string) => {
         this.bandwidthApproximator.addBytes(bytes, this.now());
         this.emit(Events.PieceBytesDownloaded, method, bytes, peerId);
-    }
+    };
 
     private onPieceBytesUploaded = (method: "p2p", bytes: number, peerId?: string) => {
         this.emit(Events.PieceBytesUploaded, method, bytes, peerId);
-    }
+    };
 
     private onSegmentLoaded = async (segment: Segment, data: ArrayBuffer, peerId?: string) => {
         this.debugSegments("segment loaded", segment.id, segment.url);
@@ -414,7 +444,7 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         if (!this.settings.consumeOnly) {
             this.p2pManager.sendSegmentsMapToAll(this.createSegmentsMap(storageSegments));
         }
-    }
+    };
 
     private onSegmentError = async (segment: Segment, details: unknown, peerId?: string) => {
         this.debugSegments("segment error", segment.id, segment.url, peerId, details);
@@ -425,14 +455,14 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 this.p2pManager.sendSegmentsMapToAll(this.createSegmentsMap(storageSegments));
             }
         }
-    }
+    };
 
     private getStreamSwarmId = (segment: Segment) => {
         return segment.streamId === undefined ? segment.masterSwarmId : `${segment.masterSwarmId}+${segment.streamId}`;
-    }
+    };
 
-    private createSegmentsMap = (storageSegments: Map<string, {segment: Segment}>) => {
-        const segmentsMap: {[key: string]: [string, number[]]} = {};
+    private createSegmentsMap = (storageSegments: Map<string, { segment: Segment }>) => {
+        const segmentsMap: { [key: string]: [string, number[]] } = {};
 
         const addSegmentToMap = (segment: Segment, status: MediaPeerSegmentStatus) => {
             const streamSwarmId = this.getStreamSwarmId(segment);
@@ -444,7 +474,7 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 segmentsMap[streamSwarmId] = segmentsIdsAndStatuses;
             }
             const segmentsStatuses = segmentsIdsAndStatuses[1];
-            segmentsIdsAndStatuses[0] += ((segmentsStatuses.length === 0) ? segmentId : `|${segmentId}`);
+            segmentsIdsAndStatuses[0] += segmentsStatuses.length === 0 ? segmentId : `|${segmentId}`;
             segmentsStatuses.push(status);
         };
 
@@ -457,23 +487,28 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
         }
 
         return segmentsMap;
-    }
+    };
 
-    private onPeerConnect = async (peer: {id: string}) => {
+    private onPeerConnect = async (peer: { id: string }) => {
         this.emit(Events.PeerConnect, peer);
         if (!this.settings.consumeOnly && this.masterSwarmId !== undefined) {
-            this.p2pManager.sendSegmentsMap(peer.id, this.createSegmentsMap(await this.segmentsStorage.getSegmentsMap(this.masterSwarmId)));
+            this.p2pManager.sendSegmentsMap(
+                peer.id,
+                this.createSegmentsMap(await this.segmentsStorage.getSegmentsMap(this.masterSwarmId))
+            );
         }
-    }
+    };
 
     private onPeerClose = (peerId: string) => {
         this.emit(Events.PeerClose, peerId);
-    }
+    };
 
     private onTrackerUpdate = async (data: { incomplete?: number }) => {
-        if (this.httpDownloadInitialTimeoutTimestamp !== -Infinity &&
-                data.incomplete !== undefined && data.incomplete <= 1) {
-
+        if (
+            this.httpDownloadInitialTimeoutTimestamp !== -Infinity &&
+            data.incomplete !== undefined &&
+            data.incomplete <= 1
+        ) {
             this.debugSegments("cancel initial HTTP download timeout - no peers");
 
             this.httpDownloadInitialTimeoutTimestamp = -Infinity;
@@ -486,26 +521,27 @@ export class HybridLoader extends EventEmitter implements LoaderInterface {
                 }
             }
         }
-    }
+    };
 
     private cleanSegmentsStorage = async (): Promise<boolean> => {
         if (this.masterSwarmId === undefined) {
             return false;
         }
 
-        return this.segmentsStorage.clean(this.masterSwarmId,
-            (id: string) => this.segmentsQueue.find(queueSegment => queueSegment.id === id) !== undefined);
-    }
+        return this.segmentsStorage.clean(
+            this.masterSwarmId,
+            (id: string) => this.segmentsQueue.find((queueSegment) => queueSegment.id === id) !== undefined
+        );
+    };
 
     private now = () => {
         return performance.now();
-    }
-
+    };
 }
 
 export interface SegmentsStorage {
     storeSegment: (segment: Segment) => Promise<void>;
-    getSegmentsMap: (masterSwarmId: string) => Promise<Map<string, {segment: Segment}>>;
+    getSegmentsMap: (masterSwarmId: string) => Promise<Map<string, { segment: Segment }>>;
     getSegment: (id: string, masterSwarmId: string) => Promise<Segment | undefined>;
     clean: (masterSwarmId: string, lockedSegmentsFilter?: (id: string) => boolean) => Promise<boolean>;
     destroy: () => Promise<void>;
diff --git a/p2p-media-loader-core/lib/loader-interface.ts b/p2p-media-loader-core/lib/loader-interface.ts
index 8f81baae..8ac0d34f 100644
--- a/p2p-media-loader-core/lib/loader-interface.ts
+++ b/p2p-media-loader-core/lib/loader-interface.ts
@@ -70,12 +70,11 @@ export enum Events {
      * Emitted when a segment piece has been uploaded.
      * Args: method (can be "p2p" only), bytes
      */
-    PieceBytesUploaded = "piece_bytes_uploaded"
+    PieceBytesUploaded = "piece_bytes_uploaded",
 }
 
 export interface LoaderInterface {
-    on:
-        ((eventName: string, listener: (...params: unknown[]) => void) => this) & 
+    on: ((eventName: string, listener: (...params: unknown[]) => void) => this) &
         ((eventName: Events.SegmentLoaded, listener: (segment: Segment) => void) => this) &
         ((eventName: Events.SegmentError, listener: (segment: Segment, error: unknown) => void) => this) &
         ((eventName: Events.SegmentAbort, listener: (segment: Segment) => void) => this);
diff --git a/p2p-media-loader-core/lib/media-peer.ts b/p2p-media-loader-core/lib/media-peer.ts
index 85917812..fa4fc016 100644
--- a/p2p-media-loader-core/lib/media-peer.ts
+++ b/p2p-media-loader-core/lib/media-peer.ts
@@ -28,24 +28,30 @@ enum MediaPeerCommands {
     SegmentAbsent,
     SegmentsMap,
     SegmentRequest,
-    CancelSegmentRequest
+    CancelSegmentRequest,
 }
 
-type MediaPeerCommand = {
-    c: MediaPeerCommands.SegmentAbsent | MediaPeerCommands.SegmentRequest | MediaPeerCommands.CancelSegmentRequest;
-    i: string;
-} | {
-    c: MediaPeerCommands.SegmentsMap;
-    m: {[key: string]: [string, number[]]};
-} | {
-    c: MediaPeerCommands.SegmentData;
-    i: string;
-    s: number;
-};
+type MediaPeerCommand =
+    | {
+          c:
+              | MediaPeerCommands.SegmentAbsent
+              | MediaPeerCommands.SegmentRequest
+              | MediaPeerCommands.CancelSegmentRequest;
+          i: string;
+      }
+    | {
+          c: MediaPeerCommands.SegmentsMap;
+          m: { [key: string]: [string, number[]] };
+      }
+    | {
+          c: MediaPeerCommands.SegmentData;
+          i: string;
+          s: number;
+      };
 
 export enum MediaPeerSegmentStatus {
     Loaded,
-    LoadingByHttp
+    LoadingByHttp,
 }
 
 class DownloadingSegment {
@@ -55,9 +61,16 @@ class DownloadingSegment {
 }
 
 export class MediaPeer extends STEEmitter<
-    "connect" | "close" | "data-updated" |
-    "segment-request" | "segment-absent" | "segment-loaded" | "segment-error" | "segment-timeout" |
-    "bytes-downloaded" | "bytes-uploaded"
+    | "connect"
+    | "close"
+    | "data-updated"
+    | "segment-request"
+    | "segment-absent"
+    | "segment-loaded"
+    | "segment-error"
+    | "segment-timeout"
+    | "bytes-downloaded"
+    | "bytes-uploaded"
 > {
     public id: string;
     public remoteAddress = "";
@@ -67,12 +80,14 @@ export class MediaPeer extends STEEmitter<
     private debug = Debug("p2pml:media-peer");
     private timer: ReturnType<typeof setTimeout> | null = null;
 
-    // eslint-disable-next-line
-    constructor(readonly peer: any,
-            readonly settings: {
-                p2pSegmentDownloadTimeout: number,
-                webRtcMaxMessageSize: number
-            }) {
+    constructor(
+        // eslint-disable-next-line
+        readonly peer: any,
+        readonly settings: {
+            p2pSegmentDownloadTimeout: number;
+            webRtcMaxMessageSize: number;
+        }
+    ) {
         super();
 
         this.peer.on("connect", this.onPeerConnect);
@@ -87,17 +102,17 @@ export class MediaPeer extends STEEmitter<
         this.debug("peer connect", this.id, this);
         this.remoteAddress = this.peer.remoteAddress;
         this.emit("connect", this);
-    }
+    };
 
     private onPeerClose = () => {
         this.debug("peer close", this.id, this);
         this.terminateSegmentRequest();
         this.emit("close", this);
-    }
+    };
 
     private onPeerError = (error: unknown) => {
         this.debug("peer error", this.id, error, this);
-    }
+    };
 
     private receiveSegmentPiece = (data: ArrayBuffer): void => {
         if (!this.downloadingSegment) {
@@ -128,7 +143,7 @@ export class MediaPeer extends STEEmitter<
             this.terminateSegmentRequest();
             this.emit("segment-error", this, segmentId, "Too many bytes received for segment");
         }
-    }
+    };
 
     private getJsonCommand = (data: ArrayBuffer) => {
         const bytes = new Uint8Array(data);
@@ -143,7 +158,7 @@ export class MediaPeer extends STEEmitter<
         }
 
         return null;
-    }
+    };
 
     private onPeerData = (data: ArrayBuffer) => {
         const command = this.getJsonCommand(data);
@@ -175,10 +190,12 @@ export class MediaPeer extends STEEmitter<
                 break;
 
             case MediaPeerCommands.SegmentData:
-                if (this.downloadingSegmentId
-                        && this.downloadingSegmentId === command.i
-                        && typeof command.s === "number"
-                        && command.s >= 0) {
+                if (
+                    this.downloadingSegmentId &&
+                    this.downloadingSegmentId === command.i &&
+                    typeof command.s === "number" &&
+                    command.s >= 0
+                ) {
                     this.downloadingSegment = new DownloadingSegment(command.i, command.s);
                     this.cancelResponseTimeoutTimer();
                 }
@@ -199,7 +216,7 @@ export class MediaPeer extends STEEmitter<
             default:
                 break;
         }
-    }
+    };
 
     private createSegmentsMap = (segments: unknown) => {
         if (!(segments instanceof Object)) {
@@ -210,10 +227,12 @@ export class MediaPeer extends STEEmitter<
 
         for (const streamSwarmId of Object.keys(segments)) {
             const swarmData = (segments as Record<string, unknown>)[streamSwarmId];
-            if (!(swarmData instanceof Array) ||
-                    (swarmData.length !== 2) ||
-                    (typeof swarmData[0] !== "string") ||
-                    !(swarmData[1] instanceof Array)) {
+            if (
+                !(swarmData instanceof Array) ||
+                swarmData.length !== 2 ||
+                typeof swarmData[0] !== "string" ||
+                !(swarmData[1] instanceof Array)
+            ) {
                 return new Map<string, MediaPeerSegmentStatus>();
             }
 
@@ -235,41 +254,42 @@ export class MediaPeer extends STEEmitter<
         }
 
         return segmentsMap;
-    }
+    };
 
     private sendCommand = (command: MediaPeerCommand): void => {
         this.debug("peer send command", this.id, command, this);
         this.peer.write(JSON.stringify(command));
-    }
+    };
 
     public destroy = (): void => {
         this.debug("peer destroy", this.id, this);
         this.terminateSegmentRequest();
         this.peer.destroy();
-    }
+    };
 
     public getDownloadingSegmentId = (): string | null => {
         return this.downloadingSegmentId;
-    }
+    };
 
     public getSegmentsMap = (): Map<string, MediaPeerSegmentStatus> => {
         return this.segmentsMap;
-    }
+    };
 
-    public sendSegmentsMap = (segmentsMap: {[key: string]: [string, number[]]}): void => {
-        this.sendCommand({c: MediaPeerCommands.SegmentsMap, m: segmentsMap});
-    }
+    public sendSegmentsMap = (segmentsMap: { [key: string]: [string, number[]] }): void => {
+        this.sendCommand({ c: MediaPeerCommands.SegmentsMap, m: segmentsMap });
+    };
 
     public sendSegmentData = (segmentId: string, data: ArrayBuffer): void => {
         this.sendCommand({
             c: MediaPeerCommands.SegmentData,
             i: segmentId,
-            s: data.byteLength
+            s: data.byteLength,
         });
 
         let bytesLeft = data.byteLength;
         while (bytesLeft > 0) {
-            const bytesToSend = (bytesLeft >= this.settings.webRtcMaxMessageSize ? this.settings.webRtcMaxMessageSize : bytesLeft);
+            const bytesToSend =
+                bytesLeft >= this.settings.webRtcMaxMessageSize ? this.settings.webRtcMaxMessageSize : bytesLeft;
             const buffer = Buffer.from(data, data.byteLength - bytesLeft, bytesToSend);
 
             this.peer.write(buffer);
@@ -277,21 +297,21 @@ export class MediaPeer extends STEEmitter<
         }
 
         this.emit("bytes-uploaded", this, data.byteLength);
-    }
+    };
 
     public sendSegmentAbsent = (segmentId: string): void => {
-        this.sendCommand({c: MediaPeerCommands.SegmentAbsent, i: segmentId});
-    }
+        this.sendCommand({ c: MediaPeerCommands.SegmentAbsent, i: segmentId });
+    };
 
     public requestSegment = (segmentId: string): void => {
         if (this.downloadingSegmentId) {
             throw new Error("A segment is already downloading: " + this.downloadingSegmentId);
         }
 
-        this.sendCommand({c: MediaPeerCommands.SegmentRequest, i: segmentId});
+        this.sendCommand({ c: MediaPeerCommands.SegmentRequest, i: segmentId });
         this.downloadingSegmentId = segmentId;
         this.runResponseTimeoutTimer();
-    }
+    };
 
     public cancelSegmentRequest = (): ArrayBuffer[] | undefined => {
         let downloadingSegment: ArrayBuffer[] | undefined;
@@ -300,11 +320,11 @@ export class MediaPeer extends STEEmitter<
             const segmentId = this.downloadingSegmentId;
             downloadingSegment = this.downloadingSegment ? this.downloadingSegment.pieces : undefined;
             this.terminateSegmentRequest();
-            this.sendCommand({c: MediaPeerCommands.CancelSegmentRequest, i: segmentId});
+            this.sendCommand({ c: MediaPeerCommands.CancelSegmentRequest, i: segmentId });
         }
 
         return downloadingSegment;
-    }
+    };
 
     private runResponseTimeoutTimer = (): void => {
         this.timer = setTimeout(() => {
@@ -316,18 +336,18 @@ export class MediaPeer extends STEEmitter<
             this.cancelSegmentRequest();
             this.emit("segment-timeout", this, segmentId); // TODO: send peer not responding event
         }, this.settings.p2pSegmentDownloadTimeout);
-    }
+    };
 
     private cancelResponseTimeoutTimer = (): void => {
         if (this.timer) {
             clearTimeout(this.timer);
             this.timer = null;
         }
-    }
+    };
 
     private terminateSegmentRequest = () => {
         this.downloadingSegmentId = null;
         this.downloadingSegment = null;
         this.cancelResponseTimeoutTimer();
-    }
+    };
 }
diff --git a/p2p-media-loader-core/lib/p2p-media-manager.ts b/p2p-media-loader-core/lib/p2p-media-manager.ts
index 3d9c7cab..47584efb 100644
--- a/p2p-media-loader-core/lib/p2p-media-manager.ts
+++ b/p2p-media-loader-core/lib/p2p-media-manager.ts
@@ -30,14 +30,11 @@ import { version } from "./index";
 import { SegmentsStorage, SegmentValidatorCallback } from "./hybrid-loader";
 
 const PEER_PROTOCOL_VERSION = 2;
-const PEER_ID_VERSION_STRING = version.replace(/\d*./g, v => `0${parseInt(v, 10) % 100}`.slice(-2)).slice(0, 4);
+const PEER_ID_VERSION_STRING = version.replace(/\d*./g, (v) => `0${parseInt(v, 10) % 100}`.slice(-2)).slice(0, 4);
 const PEER_ID_VERSION_PREFIX = `-WW${PEER_ID_VERSION_STRING}-`; // Using WebTorrent client ID in order to not be banned by websocket trackers
 
 class PeerSegmentRequest {
-    constructor(
-        readonly peerId: string,
-        readonly segment: Segment
-    ) {}
+    constructor(readonly peerId: string, readonly segment: Segment) {}
 }
 
 function generatePeerId(): ArrayBuffer {
@@ -54,9 +51,14 @@ function generatePeerId(): ArrayBuffer {
 }
 
 export class P2PMediaManager extends STEEmitter<
-    "peer-connected" | "peer-closed" | "peer-data-updated" |
-    "segment-loaded" | "segment-error" | "bytes-downloaded" |
-    "bytes-uploaded" | "tracker-update"
+    | "peer-connected"
+    | "peer-closed"
+    | "peer-data-updated"
+    | "segment-loaded"
+    | "segment-error"
+    | "bytes-downloaded"
+    | "bytes-uploaded"
+    | "tracker-update"
 > {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     private trackerClient: any = null;
@@ -67,21 +69,22 @@ export class P2PMediaManager extends STEEmitter<
     private readonly peerId: ArrayBuffer;
     private debug = Debug("p2pml:p2p-media-manager");
     private pendingTrackerClient: {
-        isDestroyed: boolean
+        isDestroyed: boolean;
     } | null = null;
     private masterSwarmId?: string;
 
     public constructor(
-            private segmentsStorage: SegmentsStorage,
-            private settings: {
-                useP2P: boolean,
-                trackerAnnounce: string[],
-                p2pSegmentDownloadTimeout: number,
-                segmentValidator?: SegmentValidatorCallback,
-                webRtcMaxMessageSize: number,
-                rtcConfig?: RTCConfiguration,
-                peerRequestsPerAnnounce: number
-            }) {
+        private segmentsStorage: SegmentsStorage,
+        private settings: {
+            useP2P: boolean;
+            trackerAnnounce: string[];
+            p2pSegmentDownloadTimeout: number;
+            segmentValidator?: SegmentValidatorCallback;
+            webRtcMaxMessageSize: number;
+            rtcConfig?: RTCConfiguration;
+            peerRequestsPerAnnounce: number;
+        }
+    ) {
         super();
 
         this.peerId = settings.useP2P ? generatePeerId() : new ArrayBuffer(0);
@@ -93,11 +96,11 @@ export class P2PMediaManager extends STEEmitter<
 
     public getPeers = (): Map<string, MediaPeer> => {
         return this.peers;
-    }
+    };
 
     public getPeerId = (): string => {
         return Buffer.from(this.peerId).toString("hex");
-    }
+    };
 
     public setStreamSwarmId = (streamSwarmId: string, masterSwarmId: string): void => {
         if (this.streamSwarmId === streamSwarmId) {
@@ -111,7 +114,7 @@ export class P2PMediaManager extends STEEmitter<
         this.debug("stream swarm ID", this.streamSwarmId);
 
         this.pendingTrackerClient = {
-            isDestroyed: false
+            isDestroyed: false,
         };
 
         const pendingTrackerClient = this.pendingTrackerClient;
@@ -130,7 +133,7 @@ export class P2PMediaManager extends STEEmitter<
             this.trackerClient.destroy();
             this.trackerClient = null;
         }
-    }
+    };
 
     private createClient = (infoHash: ArrayBuffer): void => {
         if (!this.settings.useP2P) {
@@ -145,7 +148,7 @@ export class P2PMediaManager extends STEEmitter<
             port: 6881, // a dummy value allows running in Node.js environment
             getAnnounceOpts: () => {
                 return { numwant: this.settings.peerRequestsPerAnnounce };
-            }
+            },
         };
 
         let oldTrackerClient = this.trackerClient;
@@ -162,20 +165,20 @@ export class P2PMediaManager extends STEEmitter<
             oldTrackerClient.destroy();
             oldTrackerClient = null;
         }
-    }
+    };
 
     private onTrackerError = (error: unknown) => {
         this.debug("tracker error", error);
-    }
+    };
 
     private onTrackerWarning = (warning: unknown) => {
         this.debug("tracker warning", warning);
-    }
+    };
 
     private onTrackerUpdate = (data: unknown): void => {
         this.debug("tracker update", data);
         this.emit("tracker-update", data);
-    }
+    };
 
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     private onTrackerPeer = (trackerPeer: any): void => {
@@ -208,7 +211,7 @@ export class P2PMediaManager extends STEEmitter<
         }
 
         peerCandidatesById.push(peer);
-    }
+    };
 
     public download = (segment: Segment): boolean => {
         if (this.isDownloading(segment)) {
@@ -218,8 +221,10 @@ export class P2PMediaManager extends STEEmitter<
         const candidates: MediaPeer[] = [];
 
         for (const peer of this.peers.values()) {
-            if ((peer.getDownloadingSegmentId() === null) &&
-                    (peer.getSegmentsMap().get(segment.id) === MediaPeerSegmentStatus.Loaded)) {
+            if (
+                peer.getDownloadingSegmentId() === null &&
+                peer.getSegmentsMap().get(segment.id) === MediaPeerSegmentStatus.Loaded
+            ) {
                 candidates.push(peer);
             }
         }
@@ -232,7 +237,7 @@ export class P2PMediaManager extends STEEmitter<
         peer.requestSegment(segment.id);
         this.peerSegmentRequests.set(segment.id, new PeerSegmentRequest(peer.id, segment));
         return true;
-    }
+    };
 
     public abort = (segment: Segment): ArrayBuffer[] | undefined => {
         let downloadingSegment: ArrayBuffer[] | undefined;
@@ -245,15 +250,15 @@ export class P2PMediaManager extends STEEmitter<
             this.peerSegmentRequests.delete(segment.id);
         }
         return downloadingSegment;
-    }
+    };
 
     public isDownloading = (segment: Segment): boolean => {
         return this.peerSegmentRequests.has(segment.id);
-    }
+    };
 
     public getActiveDownloadsCount = (): number => {
         return this.peerSegmentRequests.size;
-    }
+    };
 
     public destroy = (swarmChange = false): void => {
         this.streamSwarmId = null;
@@ -277,7 +282,7 @@ export class P2PMediaManager extends STEEmitter<
             this.pendingTrackerClient = null;
         }
 
-        this.peers.forEach(peer => peer.destroy());
+        this.peers.forEach((peer) => peer.destroy());
         this.peers.clear();
 
         this.peerSegmentRequests.clear();
@@ -288,18 +293,18 @@ export class P2PMediaManager extends STEEmitter<
             }
         }
         this.peerCandidates.clear();
-    }
+    };
 
-    public sendSegmentsMapToAll = (segmentsMap: {[key: string]: [string, number[]]}): void => {
-        this.peers.forEach(peer => peer.sendSegmentsMap(segmentsMap));
-    }
+    public sendSegmentsMapToAll = (segmentsMap: { [key: string]: [string, number[]] }): void => {
+        this.peers.forEach((peer) => peer.sendSegmentsMap(segmentsMap));
+    };
 
-    public sendSegmentsMap = (peerId: string, segmentsMap: {[key: string]: [string, number[]]}): void => {
+    public sendSegmentsMap = (peerId: string, segmentsMap: { [key: string]: [string, number[]] }): void => {
         const peer = this.peers.get(peerId);
         if (peer) {
             peer.sendSegmentsMap(segmentsMap);
         }
-    }
+    };
 
     public getOverallSegmentsMap = (): Map<string, MediaPeerSegmentStatus> => {
         const overallSegmentsMap = new Map<string, MediaPeerSegmentStatus>();
@@ -315,15 +320,15 @@ export class P2PMediaManager extends STEEmitter<
         }
 
         return overallSegmentsMap;
-    }
+    };
 
     private onPieceBytesDownloaded = (peer: MediaPeer, bytes: number) => {
         this.emit("bytes-downloaded", bytes, peer.id);
-    }
+    };
 
     private onPieceBytesUploaded = (peer: MediaPeer, bytes: number) => {
         this.emit("bytes-uploaded", bytes, peer.id);
-    }
+    };
 
     private onPeerConnect = (peer: MediaPeer) => {
         const connectedPeer = this.peers.get(peer.id);
@@ -349,8 +354,8 @@ export class P2PMediaManager extends STEEmitter<
             this.peerCandidates.delete(peer.id);
         }
 
-        this.emit("peer-connected", {id: peer.id, remoteAddress: peer.remoteAddress});
-    }
+        this.emit("peer-connected", { id: peer.id, remoteAddress: peer.remoteAddress });
+    };
 
     private onPeerClose = (peer: MediaPeer) => {
         if (this.peers.get(peer.id) !== peer) {
@@ -382,11 +387,11 @@ export class P2PMediaManager extends STEEmitter<
         this.peers.delete(peer.id);
         this.emit("peer-data-updated");
         this.emit("peer-closed", peer.id);
-    }
+    };
 
     private onPeerDataUpdated = () => {
         this.emit("peer-data-updated");
-    }
+    };
 
     private onSegmentRequest = async (peer: MediaPeer, segmentId: string) => {
         if (this.masterSwarmId === undefined) {
@@ -399,7 +404,7 @@ export class P2PMediaManager extends STEEmitter<
         } else {
             peer.sendSegmentAbsent(segmentId);
         }
-    }
+    };
 
     private onSegmentLoaded = async (peer: MediaPeer, segmentId: string, data: ArrayBuffer) => {
         const peerSegmentRequest = this.peerSegmentRequests.get(segmentId);
@@ -423,12 +428,12 @@ export class P2PMediaManager extends STEEmitter<
 
         this.peerSegmentRequests.delete(segmentId);
         this.emit("segment-loaded", segment, data, peer.id);
-    }
+    };
 
     private onSegmentAbsent = (peer: MediaPeer, segmentId: string) => {
         this.peerSegmentRequests.delete(segmentId);
         this.emit("peer-data-updated");
-    }
+    };
 
     private onSegmentError = (peer: MediaPeer, segmentId: string, description: string) => {
         const peerSegmentRequest = this.peerSegmentRequests.get(segmentId);
@@ -436,7 +441,7 @@ export class P2PMediaManager extends STEEmitter<
             this.peerSegmentRequests.delete(segmentId);
             this.emit("segment-error", peerSegmentRequest.segment, description, peer.id);
         }
-    }
+    };
 
     private onSegmentTimeout = (peer: MediaPeer, segmentId: string) => {
         const peerSegmentRequest = this.peerSegmentRequests.get(segmentId);
@@ -447,5 +452,5 @@ export class P2PMediaManager extends STEEmitter<
                 this.emit("peer-data-updated");
             }
         }
-    }
+    };
 }
diff --git a/p2p-media-loader-core/lib/segments-memory-storage.ts b/p2p-media-loader-core/lib/segments-memory-storage.ts
index ef2dbfcf..582f4bb7 100644
--- a/p2p-media-loader-core/lib/segments-memory-storage.ts
+++ b/p2p-media-loader-core/lib/segments-memory-storage.ts
@@ -18,20 +18,22 @@ import { Segment } from "./loader-interface";
 import { SegmentsStorage } from "./hybrid-loader";
 
 export class SegmentsMemoryStorage implements SegmentsStorage {
-    private cache = new Map<string, {segment: Segment, lastAccessed: number}>();
+    private cache = new Map<string, { segment: Segment; lastAccessed: number }>();
 
-    constructor(private settings: {
-        cachedSegmentExpiration: number,
-        cachedSegmentsCount: number
-    }) { }
+    constructor(
+        private settings: {
+            cachedSegmentExpiration: number;
+            cachedSegmentsCount: number;
+        }
+    ) {}
 
     public storeSegment = async (segment: Segment): Promise<void> => {
-        this.cache.set(segment.id, {segment, lastAccessed: performance.now()});
-    }
+        this.cache.set(segment.id, { segment, lastAccessed: performance.now() });
+    };
 
-    public getSegmentsMap = async (): Promise<Map<string, {segment: Segment}>> => {
+    public getSegmentsMap = async (): Promise<Map<string, { segment: Segment }>> => {
         return this.cache;
-    }
+    };
 
     public getSegment = async (id: string): Promise<Segment | undefined> => {
         const cacheItem = this.cache.get(id);
@@ -42,15 +44,15 @@ export class SegmentsMemoryStorage implements SegmentsStorage {
 
         cacheItem.lastAccessed = performance.now();
         return cacheItem.segment;
-    }
+    };
 
     public hasSegment = async (id: string): Promise<boolean> => {
         return this.cache.has(id);
-    }
+    };
 
     public clean = async (masterSwarmId: string, lockedSegmentsFilter?: (id: string) => boolean): Promise<boolean> => {
         const segmentsToDelete: string[] = [];
-        const remainingSegments: {segment: Segment, lastAccessed: number}[] = [];
+        const remainingSegments: { segment: Segment; lastAccessed: number }[] = [];
 
         // Delete old segments
         const now = performance.now();
@@ -69,7 +71,7 @@ export class SegmentsMemoryStorage implements SegmentsStorage {
             remainingSegments.sort((a, b) => a.lastAccessed - b.lastAccessed);
 
             for (const cachedSegment of remainingSegments) {
-                if ((lockedSegmentsFilter === undefined) || !lockedSegmentsFilter(cachedSegment.segment.id)) {
+                if (lockedSegmentsFilter === undefined || !lockedSegmentsFilter(cachedSegment.segment.id)) {
                     segmentsToDelete.push(cachedSegment.segment.id);
                     countOverhead--;
                     if (countOverhead === 0) {
@@ -79,11 +81,11 @@ export class SegmentsMemoryStorage implements SegmentsStorage {
             }
         }
 
-        segmentsToDelete.forEach(id => this.cache.delete(id));
+        segmentsToDelete.forEach((id) => this.cache.delete(id));
         return segmentsToDelete.length > 0;
-    }
+    };
 
     public destroy = async (): Promise<void> => {
         this.cache.clear();
-    }
+    };
 }
diff --git a/p2p-media-loader-core/lib/stringly-typed-event-emitter.ts b/p2p-media-loader-core/lib/stringly-typed-event-emitter.ts
index e30b432b..bb9d907a 100644
--- a/p2p-media-loader-core/lib/stringly-typed-event-emitter.ts
+++ b/p2p-media-loader-core/lib/stringly-typed-event-emitter.ts
@@ -18,7 +18,7 @@
 
 import { EventEmitter } from "events";
 
-export class STEEmitter<T extends (string | symbol)> extends EventEmitter {
+export class STEEmitter<T extends string | symbol> extends EventEmitter {
     public on = (event: T, listener: (...args: any[]) => void): this => super.on(event, listener);
     public emit = (event: T, ...args: any[]): boolean => super.emit(event, ...args);
 }
diff --git a/p2p-media-loader-core/package-lock.json b/p2p-media-loader-core/package-lock.json
index 00591ce7..f21dfec9 100644
--- a/p2p-media-loader-core/package-lock.json
+++ b/p2p-media-loader-core/package-lock.json
@@ -146,9 +146,9 @@
       "dev": true
     },
     "@types/eslint": {
-      "version": "7.2.7",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.7.tgz",
-      "integrity": "sha512-EHXbc1z2GoQRqHaAT7+grxlTJ3WE2YNeD6jlpPoRc83cCoThRY+NUWjCUZaYmk51OICkPXn2hhphcWcWXgNW0Q==",
+      "version": "7.2.8",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.8.tgz",
+      "integrity": "sha512-RTKvBsfz0T8CKOGZMfuluDNyMFHnu5lvNr4hWEsQeHXH6FcmIDIozOyWMh36nLGMwVd5UFNXC2xztA8lln22MQ==",
       "dev": true,
       "requires": {
         "@types/estree": "*",
@@ -1030,9 +1030,9 @@
       "dev": true
     },
     "caniuse-lite": {
-      "version": "1.0.30001204",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001204.tgz",
-      "integrity": "sha512-JUdjWpcxfJ9IPamy2f5JaRDCaqJOxDzOSKtbdx4rH9VivMd1vIzoPumsJa9LoMIi4Fx2BV2KZOxWhNkBjaYivQ==",
+      "version": "1.0.30001205",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001205.tgz",
+      "integrity": "sha512-TL1GrS5V6LElbitPazidkBMD9sa448bQDDLrumDqaggmKFcuU2JW1wTOHJPukAcOMtEmLcmDJEzfRrf+GjM0Og==",
       "dev": true
     },
     "chalk": {
@@ -1518,9 +1518,9 @@
       }
     },
     "electron-to-chromium": {
-      "version": "1.3.703",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.703.tgz",
-      "integrity": "sha512-SVBVhNB+4zPL+rvtWLw7PZQkw/Eqj1HQZs22xtcqW36+xoifzEOEEDEpkxSMfB6RFeSIOcG00w6z5mSqLr1Y6w==",
+      "version": "1.3.706",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.706.tgz",
+      "integrity": "sha512-IcXgNXeW6+ObrvHnQtjhokjdOPI/DQ5j0f9M6gUy82kc9GNTMxq/mTkxWlPBSpqO1mAomR1uPDsssKDMj1V4Cw==",
       "dev": true
     },
     "elliptic": {
@@ -1704,6 +1704,12 @@
         }
       }
     },
+    "eslint-config-prettier": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.1.0.tgz",
+      "integrity": "sha512-oKMhGv3ihGbCIimCAjqkdzx2Q+jthoqnXSP+d86M9tptwugycmTFdVR4IpLgq2c4SHifbwO90z2fQ8/Aio73yw==",
+      "dev": true
+    },
     "eslint-scope": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
@@ -2725,18 +2731,18 @@
       }
     },
     "mime-db": {
-      "version": "1.46.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.46.0.tgz",
-      "integrity": "sha512-svXaP8UQRZ5K7or+ZmfNhg2xX3yKDMUzqadsSqi4NCH/KomcH75MAMYAGVlvXn4+b/xOPhS3I2uHKRUzvjY7BQ==",
+      "version": "1.47.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.47.0.tgz",
+      "integrity": "sha512-QBmA/G2y+IfeS4oktet3qRZ+P5kPhCKRXxXnQEudYqUaEioAU1/Lq2us3D/t1Jfo4hE9REQPrbB7K5sOczJVIw==",
       "dev": true
     },
     "mime-types": {
-      "version": "2.1.29",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.29.tgz",
-      "integrity": "sha512-Y/jMt/S5sR9OaqteJtslsFZKWOIIqMACsJSiHghlCAyhf7jfVYjKBmLiX8OgpWeW+fjJ2b+Az69aPFPkUOY6xQ==",
+      "version": "2.1.30",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.30.tgz",
+      "integrity": "sha512-crmjA4bLtR8m9qLpHvgxSChT+XoSlZi8J4n/aIdn3z92e/U47Z0V/yl+Wh9W046GgFVAmoNR/fmdbZYcSSIUeg==",
       "dev": true,
       "requires": {
-        "mime-db": "1.46.0"
+        "mime-db": "1.47.0"
       }
     },
     "mimic-fn": {
@@ -3255,6 +3261,12 @@
       "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
       "dev": true
     },
+    "prettier": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.2.1.tgz",
+      "integrity": "sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==",
+      "dev": true
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -3920,9 +3932,9 @@
       },
       "dependencies": {
         "ajv": {
-          "version": "8.0.1",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.0.1.tgz",
-          "integrity": "sha512-46ZA4TalFcLLqX1dEU3dhdY38wAtDydJ4e7QQTVekLUTzXkb1LfqU6VOBXC/a9wiv4T094WURqJH6ZitF92Kqw==",
+          "version": "8.0.5",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.0.5.tgz",
+          "integrity": "sha512-RkiLa/AeJx7+9OvniQ/qeWu0w74A8DiPPBclQ6ji3ZQkv5KamO+QGpqmi7O4JIw3rHGUXZ6CoP9tsAkn3gyazg==",
           "dev": true,
           "requires": {
             "fast-deep-equal": "^3.1.1",
@@ -4278,9 +4290,9 @@
       }
     },
     "webpack": {
-      "version": "5.28.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.28.0.tgz",
-      "integrity": "sha512-1xllYVmA4dIvRjHzwELgW4KjIU1fW4PEuEnjsylz7k7H5HgPOctIq7W1jrt3sKH9yG5d72//XWzsHhfoWvsQVg==",
+      "version": "5.30.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.30.0.tgz",
+      "integrity": "sha512-Zr9NIri5yzpfmaMea2lSMV1UygbW0zQsSlGLMgKUm63ACXg6alhd1u4v5UBSBjzYKXJN6BNMGVM7w165e7NxYA==",
       "dev": true,
       "requires": {
         "@types/eslint-scope": "^3.7.0",
diff --git a/p2p-media-loader-core/package.json b/p2p-media-loader-core/package.json
index 474c6aad..1bd37209 100644
--- a/p2p-media-loader-core/package.json
+++ b/p2p-media-loader-core/package.json
@@ -55,8 +55,10 @@
     "browserify": "^17.0.0",
     "copyfiles": "^2.4.1",
     "eslint": "^7.23.0",
+    "eslint-config-prettier": "^8.1.0",
     "mkdirp": "^1.0.4",
     "mocha": "^8.3.2",
+    "prettier": "^2.2.1",
     "terser": "^5.6.1",
     "ts-loader": "^8.1.0",
     "ts-mockito": "^2.6.1",
diff --git a/p2p-media-loader-demo/.editorconfig b/p2p-media-loader-demo/.editorconfig
index 4b43aa8e..6c761897 100644
--- a/p2p-media-loader-demo/.editorconfig
+++ b/p2p-media-loader-demo/.editorconfig
@@ -7,6 +7,7 @@ end_of_line              = lf
 charset                  = utf-8
 trim_trailing_whitespace = true
 insert_final_newline     = true
+max_line_length          = 120
 [*.md]
 trim_trailing_whitespace = false
 [*.json]
diff --git a/p2p-media-loader-demo/index.html b/p2p-media-loader-demo/index.html
index 8715e12a..926bd8dd 100644
--- a/p2p-media-loader-demo/index.html
+++ b/p2p-media-loader-demo/index.html
@@ -16,1398 +16,1466 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-
-    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-106860120-1"></script>
-    <script>window.dataLayer = window.dataLayer||[];function gtag(){dataLayer.push(arguments)};gtag('js',new Date());gtag('config','UA-106860120-1');</script>
-
-    <title>P2P Media Loader</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <head>
+        <meta charset="UTF-8" />
+
+        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-106860120-1"></script>
+        <script>
+            window.dataLayer = window.dataLayer || [];
+            function gtag() {
+                dataLayer.push(arguments);
+            }
+            gtag("js", new Date());
+            gtag("config", "UA-106860120-1");
+        </script>
+
+        <title>P2P Media Loader</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+        <script async src="node_modules/p2p-media-loader-core/build/p2p-media-loader-core.min.js"></script>
+        <script async src="p2p-graph.js"></script>
+
+        <script>
+            const URL_P2P_MEDIA_LOADER_HLSJS =
+                "node_modules/p2p-media-loader-hlsjs/build/p2p-media-loader-hlsjs.min.js";
+            const URL_P2P_MEDIA_LOADER_SHAKA =
+                "node_modules/p2p-media-loader-shaka/build/p2p-media-loader-shaka.min.js";
+        </script>
+
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
+        <script async src="https://cdnjs.cloudflare.com/ajax/libs/rickshaw/1.6.3/rickshaw.min.js"></script>
+
+        <link
+            type="text/css"
+            rel="stylesheet"
+            href="https://cdnjs.cloudflare.com/ajax/libs/rickshaw/1.6.3/rickshaw.min.css"
+        />
+
+        <style>
+            body {
+                font: normal 400 16px "Roboto", sans-serif;
+                color: #333333;
+                margin-top: 1em;
+                margin-bottom: 3em;
+            }
 
-    <script async src="node_modules/p2p-media-loader-core/build/p2p-media-loader-core.min.js"></script>
-    <script async src="p2p-graph.js"></script>
+            .main-header .title {
+                text-align: center;
+            }
 
-    <script>
-        const URL_P2P_MEDIA_LOADER_HLSJS = "node_modules/p2p-media-loader-hlsjs/build/p2p-media-loader-hlsjs.min.js";
-        const URL_P2P_MEDIA_LOADER_SHAKA = "node_modules/p2p-media-loader-shaka/build/p2p-media-loader-shaka.min.js";
-    </script>
+            .container {
+                padding: 0 15px;
+                margin: 0 auto;
+            }
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
-    <script async src="https://cdnjs.cloudflare.com/ajax/libs/rickshaw/1.6.3/rickshaw.min.js"></script>
+            @media (min-width: 576px) {
+                .container {
+                    max-width: 540px;
+                }
+            }
 
-    <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rickshaw/1.6.3/rickshaw.min.css">
+            @media (min-width: 768px) {
+                .container {
+                    max-width: 720px;
+                }
+            }
 
-    <style>
-        body {
-            font: normal 400 16px 'Roboto', sans-serif;
-            color: #333333;
-            margin-top: 1em;
-            margin-bottom: 3em;
-        }
+            @media (min-width: 992px) {
+                .container {
+                    max-width: 960px;
+                }
+            }
 
-        .main-header .title {
-            text-align: center;
-        }
+            @media (min-width: 1200px) {
+                .container {
+                    max-width: 1140px;
+                }
+            }
 
-        .container {
-            padding: 0 15px;
-            margin: 0 auto;
-        }
+            #main-view *,
+            ::after,
+            ::before {
+                box-sizing: border-box;
+            }
 
-        @media (min-width: 576px) {
-            .container {
-                max-width: 540px;
+            #main-view .wrapper {
+                display: flex;
+                flex-wrap: wrap;
             }
-        }
 
-        @media (min-width: 768px) {
-            .container {
-                max-width: 720px;
+            #main-view .wrapper .column-1,
+            #main-view .wrapper .column-2 {
+                width: 100%;
             }
-        }
 
-        @media (min-width: 992px) {
-            .container {
-                max-width: 960px;
+            @media (min-width: 768px) {
+                #main-view .wrapper .column-1 {
+                    flex: 0 0 66.666667%;
+                    max-width: 66.666667%;
+                    padding-right: 30px;
+                }
+
+                #main-view .wrapper .column-2 {
+                    flex: 0 0 33.333333%;
+                    max-width: 33.333333%;
+                }
             }
-        }
 
-        @media (min-width: 1200px) {
-            .container {
-                max-width: 1140px;
+            #video {
+                width: 100%;
             }
-        }
-
-        #main-view *, ::after, ::before {
-            box-sizing: border-box;
-        }
-
-        #main-view .wrapper {
-            display: flex;
-            flex-wrap: wrap;
-        }
-
-        #main-view .wrapper .column-1,
-        #main-view .wrapper .column-2 {
-            width: 100%;
-        }
-
-        @media (min-width: 768px) {
-            #main-view .wrapper .column-1 {
-                flex: 0 0 66.666667%;
-                max-width: 66.666667%;
-                padding-right: 30px;
+
+            .embed-responsive {
+                position: relative;
+                display: block;
+                width: 100%;
+                padding: 0;
+                overflow: hidden;
             }
 
-            #main-view .wrapper .column-2 {
-                flex: 0 0 33.333333%;
-                max-width: 33.333333%;
+            #main-view .form-group {
+                display: flex;
+                flex-direction: column;
+                margin-bottom: 1em;
             }
-        }
-
-        #video {
-            width: 100%;
-        }
-
-        .embed-responsive {
-            position: relative;
-            display: block;
-            width: 100%;
-            padding: 0;
-            overflow: hidden;
-        }
-
-        #main-view .form-group {
-            display: flex;
-            flex-direction: column;
-            margin-bottom: 1em;
-        }
-
-        #main-view .form-group label {
-            margin-bottom: 0.5em;
-        }
-
-        #main-view .form-control {
-            display: block;
-            width: 100%;
-            height: calc(2.25em + 2px);
-            padding: .375em .75em;
-            font-size: 1em;
-            line-height: 1.5em;
-            color: #495057;
-            background-color: #fff;
-            background-clip: padding-box;
-            border: 1px solid #ced4da;
-            border-radius: .25em;
-        }
-
-        #main-view .form-button {
-            text-align: center;
-            white-space: nowrap;
-            border: 1px solid transparent;
-            padding: .375em .75em;
-            font-size: 1em;
-            line-height: 1.5em;
-            border-radius: .25em;
-            color: #fff;
-            background-color: #972e2d;
-            border-color: #972e2d;
-            margin-bottom: 5px;
-        }
-
-        #main-view .form-button:hover {
-            background-color: #c60000;
-            border-color: #c60000;
-        }
-
-        #main-view .form-button:focus {
-            outline: none;
-        }
-
-        #main-view .embed-responsive::before {
-            display: block;
-            content: "";
-        }
-
-        #main-view .embed-responsive .embed-responsive-item {
-            position: absolute;
-            top: 0;
-            bottom: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            border: 0;
-        }
-
-        #main-view .embed-responsive-16by9::before {
-            padding-top: 56.25%;
-        }
-
-        #main-view #level {
-            margin-top: 2px;
-            width: auto;
-            float: right;
-        }
-
-        #graph {
-            max-width: 100%;
-            overflow: hidden;
-            margin: 3em auto;
-            border: 1px solid #eee;
-        }
-
-        #chart_container {
-            position: relative;
-            margin: 3em auto;
-            padding-left: 20px;
-            max-width: 100%;
-        }
-
-        #y_axis {
-            position: absolute;
-            top: 0;
-            width: 40px;
-            left: -20px;
-        }
-
-        #y_axis > svg {
-            overflow: visible;
-        }
-
-        #legend {
-            position: absolute;
-            top: 20px;
-            left: 40px;
-            z-index: 1;
-        }
-
-        #legend-totals {
-            position: absolute;
-            bottom: 20px;
-            left: 40px;
-            z-index: 1;
-        }
-
-        #main-view .hide {
-            display: none;
-        }
-
-    </style>
-
-</head>
-<body>
-<div class="container">
-<header class="main-header">
-    <h1 class="title">P2P Media Loader Demo</h1>
-    Git: <a href="https://github.com/novage/p2p-media-loader">https://github.com/novage/p2p-media-loader</a>
-    <hr>
-</header>
-
-<div id="main-view">
-    <div id="error-webrtc-data-channels" class="hide">
-        WebRTC Data Channels API is not supported by your browser. P2P disabled.<br>
-        Read more at <a href="http://iswebrtcreadyyet.com/legacy.html" target="_blank">Is WebRTC ready yet?</a>.
-        <hr>
-    </div>
-    <div id="error-hls-js" class="hide">
-        Your browser doesn't support hls.js engine. P2P disabled.<br>
-        Read more at <a href="https://en.wikipedia.org/wiki/Media_Source_Extensions" target="_blank">Media Source Extensions</a>.
-        <hr>
-    </div>
-    <div id="error-shakaplayer" class="hide">
-        Your browser doesn't support Shaka Player engine. P2P disabled.<br>
-        Read more at <a href="https://en.wikipedia.org/wiki/Media_Source_Extensions" target="_blank">Media Source Extensions</a>.
-        <hr>
-    </div>
-    <div class="wrapper">
-        <div class="column-1">
-            <div id="video_container"></div>
-            <div id="chart_container">
-                <div id="legend"></div>
-                <div id="legend-totals"></div>
-                <div id="y_axis"></div>
-                <div id="chart"></div>
-            </div>
-        </div>
-        <div class="column-2">
-            <form id="videoUrlForm">
-                <div class="form-group">
-                    <label for="url">Video URL<span id="https-only" class="hide"> (HTTPS only)</span>:</label>
-                    <input type="text" class="form-control" id="url" name="url" placeholder="Please enter video url" required
-                        value="https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8" />
-                </div>
-                <div class="form-group">
-                    <label for="type">Player:</label>
-                    <select class="form-control" id="type" name="type">
-                        <optgroup label="Hls.js P2P Engine (HLS only)">
-                            <option value="clappr" selected>Clappr</option>
-                            <option value="hlsjs">Hls.js</option>
-                            <option value="flowplayer">Flowplayer</option>
-                            <option value="mediaelement">MediaElement</option>
-                            <option value="videojs-contrib-hlsjs">VideoJs-Contrib-HlsJs</option>
-                            <option value="videojs-hlsjs-plugin">VideoJs-HlsJs-Plugin</option>
-                            <option value="jwplayer">JWPlayer</option>
-                            <option value="dplayer">DPlayer</option>
-                            <option value="plyr">Plyr</option>
-                        </optgroup>
-                        <optgroup label="Shaka P2P Engine (HLS and DASH)">
-                            <option value="shakaplayer">Shaka Player</option>
-                            <option value="clappr-shaka">Clappr (DASH only)</option>
-                            <option value="dplayer-shaka">DPlayer</option>
-                            <option value="plyr-shaka">Plyr</option>
-                        </optgroup>
-                    </select>
-                </div>
-                <button type="submit" class="form-button" onclick="this.form.target=''">Apply</button>
-                <button type="submit" class="form-button" onclick="this.form.target='_blank'">Create new peer</button>
-            </form>
-            <div id="graph"></div>
-            <h3>Trackers:</h3>
-            <div id="announce"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    function waitForGlobalObject(objectName, objectNextName) {
-        return new Promise((resolve) => {
-            function check() {
-                if ((window[objectName] !== undefined)
-                        && ((objectNextName === undefined) || window[objectName][objectNextName] !== undefined)) {
-                    resolve();
-                } else {
-                    setTimeout(check, 200);
-                }
+
+            #main-view .form-group label {
+                margin-bottom: 0.5em;
             }
 
-            check();
-        });
-    }
-
-    function waitForModule(moduleName) {
-        return new Promise((resolve) => {
-            function check() {
-                try {
-                    resolve(require(moduleName));
-                } catch (e) {
-                    setTimeout(check, 200);
-                }
+            #main-view .form-control {
+                display: block;
+                width: 100%;
+                height: calc(2.25em + 2px);
+                padding: 0.375em 0.75em;
+                font-size: 1em;
+                line-height: 1.5em;
+                color: #495057;
+                background-color: #fff;
+                background-clip: padding-box;
+                border: 1px solid #ced4da;
+                border-radius: 0.25em;
             }
 
-            check();
-        });
-    }
-
-    function loadScript(src) {
-        return new Promise((resolve, reject) => {
-            const script= document.createElement('script');
-            script.type= 'text/javascript';
-            script.onload = () => {
-                resolve();
-            };
-            script.onerror = () => {
-                console.log("Failed to load script", src);
-                reject();
-            };
-            script.src = src;
-            document.head.appendChild(script);
-        });
-    }
-
-    function loadStyle(src) {
-        return new Promise((resolve, reject) => {
-            const link= document.createElement('link');
-            link.rel = 'stylesheet';
-            link.type= 'text/css';
-            link.onload = () => {
-                resolve();
-            };
-            link.onerror = () => {
-                console.log("Failed to load CSS", src);
-                reject();
-            };
-            link.href = src;
-            document.head.appendChild(link);
-        });
-    }
-
-    class DemoApp {
-        async init() {
-            await waitForGlobalObject("p2pml", "core");
-
-            this.isP2PSupported = p2pml.core.HybridLoader.isSupported();
-            if (!this.isP2PSupported) {
-                document.querySelector("#error-webrtc-data-channels").classList.remove("hide");
+            #main-view .form-button {
+                text-align: center;
+                white-space: nowrap;
+                border: 1px solid transparent;
+                padding: 0.375em 0.75em;
+                font-size: 1em;
+                line-height: 1.5em;
+                border-radius: 0.25em;
+                color: #fff;
+                background-color: #972e2d;
+                border-color: #972e2d;
+                margin-bottom: 5px;
             }
 
-            if (location.protocol == "https:") {
-                document.querySelector("#https-only").classList.remove("hide");
+            #main-view .form-button:hover {
+                background-color: #c60000;
+                border-color: #c60000;
             }
 
-            this.liveSyncDurationCount = 7;
+            #main-view .form-button:focus {
+                outline: none;
+            }
 
-            this.initForm();
+            #main-view .embed-responsive::before {
+                display: block;
+                content: "";
+            }
 
-            var videoUrlForm = document.getElementById("videoUrlForm");
-            this.videoUrl = videoUrlForm.url.value.trim();
-            this.playerType = videoUrlForm.type.value;
-            this.videoContainer = document.getElementById("video_container");
+            #main-view .embed-responsive .embed-responsive-item {
+                position: absolute;
+                top: 0;
+                bottom: 0;
+                left: 0;
+                width: 100%;
+                height: 100%;
+                border: 0;
+            }
 
-            this.loadSpeedTimespan = 10; // seconds
+            #main-view .embed-responsive-16by9::before {
+                padding-top: 56.25%;
+            }
 
-            const P2PGraphClass = await waitForModule("p2p-graph");
-            this.graph = new P2PGraphClass("#graph");
-            this.graph.add({ id: "me", name: "You", me: true });
+            #main-view #level {
+                margin-top: 2px;
+                width: auto;
+                float: right;
+            }
 
-            await waitForGlobalObject("Rickshaw");
-            this.initChart();
+            #graph {
+                max-width: 100%;
+                overflow: hidden;
+                margin: 3em auto;
+                border: 1px solid #eee;
+            }
 
-            this.restartDemo();
-        }
+            #chart_container {
+                position: relative;
+                margin: 3em auto;
+                padding-left: 20px;
+                max-width: 100%;
+            }
 
-        initForm() {
-            var form = document.getElementById("videoUrlForm");
-            var params = new URLSearchParams(document.location.search);
+            #y_axis {
+                position: absolute;
+                top: 0;
+                width: 40px;
+                left: -20px;
+            }
 
-            var value = params.get("url");
-            if (value) {
-                form.url.value = value;
+            #y_axis > svg {
+                overflow: visible;
             }
 
-            value = params.get("type");
-            if (value) {
-                form.type.value = value;
+            #legend {
+                position: absolute;
+                top: 20px;
+                left: 40px;
+                z-index: 1;
             }
 
-            value = params.get("swarm");
-            if (value) {
-                this.swarmId = value;
+            #legend-totals {
+                position: absolute;
+                bottom: 20px;
+                left: 40px;
+                z-index: 1;
             }
 
-            value = params.get("trackers");
-            if (value) {
-                this.trackers = value.split(",");
+            #main-view .hide {
+                display: none;
             }
-        }
+        </style>
+    </head>
+    <body>
+        <div class="container">
+            <header class="main-header">
+                <h1 class="title">P2P Media Loader Demo</h1>
+                Git: <a href="https://github.com/novage/p2p-media-loader">https://github.com/novage/p2p-media-loader</a>
+                <hr />
+            </header>
+
+            <div id="main-view">
+                <div id="error-webrtc-data-channels" class="hide">
+                    WebRTC Data Channels API is not supported by your browser. P2P disabled.<br />
+                    Read more at
+                    <a href="http://iswebrtcreadyyet.com/legacy.html" target="_blank">Is WebRTC ready yet?</a>.
+                    <hr />
+                </div>
+                <div id="error-hls-js" class="hide">
+                    Your browser doesn't support hls.js engine. P2P disabled.<br />
+                    Read more at
+                    <a href="https://en.wikipedia.org/wiki/Media_Source_Extensions" target="_blank"
+                        >Media Source Extensions</a
+                    >.
+                    <hr />
+                </div>
+                <div id="error-shakaplayer" class="hide">
+                    Your browser doesn't support Shaka Player engine. P2P disabled.<br />
+                    Read more at
+                    <a href="https://en.wikipedia.org/wiki/Media_Source_Extensions" target="_blank"
+                        >Media Source Extensions</a
+                    >.
+                    <hr />
+                </div>
+                <div class="wrapper">
+                    <div class="column-1">
+                        <div id="video_container"></div>
+                        <div id="chart_container">
+                            <div id="legend"></div>
+                            <div id="legend-totals"></div>
+                            <div id="y_axis"></div>
+                            <div id="chart"></div>
+                        </div>
+                    </div>
+                    <div class="column-2">
+                        <form id="videoUrlForm">
+                            <div class="form-group">
+                                <label for="url"
+                                    >Video URL<span id="https-only" class="hide"> (HTTPS only)</span>:</label
+                                >
+                                <input
+                                    type="text"
+                                    class="form-control"
+                                    id="url"
+                                    name="url"
+                                    placeholder="Please enter video url"
+                                    required
+                                    value="https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8"
+                                />
+                            </div>
+                            <div class="form-group">
+                                <label for="type">Player:</label>
+                                <select class="form-control" id="type" name="type">
+                                    <optgroup label="Hls.js P2P Engine (HLS only)">
+                                        <option value="clappr" selected>Clappr</option>
+                                        <option value="hlsjs">Hls.js</option>
+                                        <option value="flowplayer">Flowplayer</option>
+                                        <option value="mediaelement">MediaElement</option>
+                                        <option value="videojs-contrib-hlsjs">VideoJs-Contrib-HlsJs</option>
+                                        <option value="videojs-hlsjs-plugin">VideoJs-HlsJs-Plugin</option>
+                                        <option value="jwplayer">JWPlayer</option>
+                                        <option value="dplayer">DPlayer</option>
+                                        <option value="plyr">Plyr</option>
+                                    </optgroup>
+                                    <optgroup label="Shaka P2P Engine (HLS and DASH)">
+                                        <option value="shakaplayer">Shaka Player</option>
+                                        <option value="clappr-shaka">Clappr (DASH only)</option>
+                                        <option value="dplayer-shaka">DPlayer</option>
+                                        <option value="plyr-shaka">Plyr</option>
+                                    </optgroup>
+                                </select>
+                            </div>
+                            <button type="submit" class="form-button" onclick="this.form.target=''">Apply</button>
+                            <button type="submit" class="form-button" onclick="this.form.target='_blank'">
+                                Create new peer
+                            </button>
+                        </form>
+                        <div id="graph"></div>
+                        <h3>Trackers:</h3>
+                        <div id="announce"></div>
+                    </div>
+                </div>
+            </div>
+
+            <script>
+                function waitForGlobalObject(objectName, objectNextName) {
+                    return new Promise((resolve) => {
+                        function check() {
+                            if (
+                                window[objectName] !== undefined &&
+                                (objectNextName === undefined || window[objectName][objectNextName] !== undefined)
+                            ) {
+                                resolve();
+                            } else {
+                                setTimeout(check, 200);
+                            }
+                        }
 
-        async restartDemo() {
-            this.downloadStats = [];
-            this.downloadTotals = { http: 0, p2p: 0 };
-            this.uploadStats = [];
-            this.uploadTotal = 0;
+                        check();
+                    });
+                }
 
-            while (this.videoContainer.hasChildNodes()) {
-                this.videoContainer.removeChild(this.videoContainer.lastChild);
-            }
+                function waitForModule(moduleName) {
+                    return new Promise((resolve) => {
+                        function check() {
+                            try {
+                                resolve(require(moduleName));
+                            } catch (e) {
+                                setTimeout(check, 200);
+                            }
+                        }
+
+                        check();
+                    });
+                }
 
-            const config = {
-                segments: {
-                    swarmId: this.swarmId
-                },
-                loader: {
+                function loadScript(src) {
+                    return new Promise((resolve, reject) => {
+                        const script = document.createElement("script");
+                        script.type = "text/javascript";
+                        script.onload = () => {
+                            resolve();
+                        };
+                        script.onerror = () => {
+                            console.log("Failed to load script", src);
+                            reject();
+                        };
+                        script.src = src;
+                        document.head.appendChild(script);
+                    });
                 }
-            };
 
-            if (this.trackers) {
-                config.loader.trackerAnnounce = this.trackers;
-            }
+                function loadStyle(src) {
+                    return new Promise((resolve, reject) => {
+                        const link = document.createElement("link");
+                        link.rel = "stylesheet";
+                        link.type = "text/css";
+                        link.onload = () => {
+                            resolve();
+                        };
+                        link.onerror = () => {
+                            console.log("Failed to load CSS", src);
+                            reject();
+                        };
+                        link.href = src;
+                        document.head.appendChild(link);
+                    });
+                }
 
-            switch (this.playerType) {
-                case "hlsjs":
-                case "clappr":
-                case "flowplayer":
-                case "mediaelement":
-                case "videojs-contrib-hlsjs":
-                case "videojs-hlsjs-plugin":
-                case "dplayer":
-                case "jwplayer":
-                case "plyr":
-                    await loadScript("https://cdn.jsdelivr.net/npm/hls.js@latest");
-
-                    if (!Hls.isSupported()) {
-                        document.querySelector("#error-hls-js").classList.remove("hide");
-                    }
+                class DemoApp {
+                    async init() {
+                        await waitForGlobalObject("p2pml", "core");
+
+                        this.isP2PSupported = p2pml.core.HybridLoader.isSupported();
+                        if (!this.isP2PSupported) {
+                            document.querySelector("#error-webrtc-data-channels").classList.remove("hide");
+                        }
+
+                        if (location.protocol == "https:") {
+                            document.querySelector("#https-only").classList.remove("hide");
+                        }
+
+                        this.liveSyncDurationCount = 7;
+
+                        this.initForm();
+
+                        var videoUrlForm = document.getElementById("videoUrlForm");
+                        this.videoUrl = videoUrlForm.url.value.trim();
+                        this.playerType = videoUrlForm.type.value;
+                        this.videoContainer = document.getElementById("video_container");
 
-                    await loadScript(URL_P2P_MEDIA_LOADER_HLSJS);
-                    this.engine = this.isP2PSupported ? new p2pml.hlsjs.Engine(config) : undefined;
-                    break;
-
-                case "shakaplayer":
-                case "dplayer-shaka":
-                case "clappr-shaka":
-                case "plyr-shaka":
-                    await Promise.all([
-                        loadScript("https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"),
-                        loadScript("https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js")
-                    ]);
-
-                    shaka.polyfill.installAll();
-                    if (!shaka.Player.isBrowserSupported()) {
-                        document.querySelector("#error-shakaplayer").classList.remove("hide");
+                        this.loadSpeedTimespan = 10; // seconds
+
+                        const P2PGraphClass = await waitForModule("p2p-graph");
+                        this.graph = new P2PGraphClass("#graph");
+                        this.graph.add({ id: "me", name: "You", me: true });
+
+                        await waitForGlobalObject("Rickshaw");
+                        this.initChart();
+
+                        this.restartDemo();
                     }
 
-                    await loadScript(URL_P2P_MEDIA_LOADER_SHAKA);
-                    this.engine = this.isP2PSupported ? new p2pml.shaka.Engine(config) : undefined;
-                    break;
+                    initForm() {
+                        var form = document.getElementById("videoUrlForm");
+                        var params = new URLSearchParams(document.location.search);
 
-                default:
-                    console.error('Unexpected player type: ', this.playerType);
-                    return;
-            }
+                        var value = params.get("url");
+                        if (value) {
+                            form.url.value = value;
+                        }
 
-            switch (this.playerType) {
-                case "hlsjs":
-                    this.initHlsJsPlayer();
-                    break;
+                        value = params.get("type");
+                        if (value) {
+                            form.type.value = value;
+                        }
 
-                case "clappr":
-                    this.initClapprPlayer();
-                    break;
+                        value = params.get("swarm");
+                        if (value) {
+                            this.swarmId = value;
+                        }
 
-                case "flowplayer":
-                    this.initFlowplayerPlayer();
-                    break;
+                        value = params.get("trackers");
+                        if (value) {
+                            this.trackers = value.split(",");
+                        }
+                    }
 
-                case "mediaelement":
-                    this.initMediaElementPlayer();
-                    break;
+                    async restartDemo() {
+                        this.downloadStats = [];
+                        this.downloadTotals = { http: 0, p2p: 0 };
+                        this.uploadStats = [];
+                        this.uploadTotal = 0;
 
-                case "videojs-contrib-hlsjs":
-                    this.initVideoJsContribHlsJsPlayer();
-                    break;
+                        while (this.videoContainer.hasChildNodes()) {
+                            this.videoContainer.removeChild(this.videoContainer.lastChild);
+                        }
 
-                case "videojs-hlsjs-plugin":
-                    this.initVideoJsHlsJsPlugin();
-                    break;
+                        const config = {
+                            segments: {
+                                swarmId: this.swarmId,
+                            },
+                            loader: {},
+                        };
 
-                case "jwplayer":
-                    this.initJwPlayer();
-                    break;
+                        if (this.trackers) {
+                            config.loader.trackerAnnounce = this.trackers;
+                        }
 
-                case "dplayer":
-                    this.initDPlayerHlsJs();
-                    break;
+                        switch (this.playerType) {
+                            case "hlsjs":
+                            case "clappr":
+                            case "flowplayer":
+                            case "mediaelement":
+                            case "videojs-contrib-hlsjs":
+                            case "videojs-hlsjs-plugin":
+                            case "dplayer":
+                            case "jwplayer":
+                            case "plyr":
+                                await loadScript("https://cdn.jsdelivr.net/npm/hls.js@latest");
+
+                                if (!Hls.isSupported()) {
+                                    document.querySelector("#error-hls-js").classList.remove("hide");
+                                }
+
+                                await loadScript(URL_P2P_MEDIA_LOADER_HLSJS);
+                                this.engine = this.isP2PSupported ? new p2pml.hlsjs.Engine(config) : undefined;
+                                break;
+
+                            case "shakaplayer":
+                            case "dplayer-shaka":
+                            case "clappr-shaka":
+                            case "plyr-shaka":
+                                await Promise.all([
+                                    loadScript("https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"),
+                                    loadScript(
+                                        "https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"
+                                    ),
+                                ]);
+
+                                shaka.polyfill.installAll();
+                                if (!shaka.Player.isBrowserSupported()) {
+                                    document.querySelector("#error-shakaplayer").classList.remove("hide");
+                                }
+
+                                await loadScript(URL_P2P_MEDIA_LOADER_SHAKA);
+                                this.engine = this.isP2PSupported ? new p2pml.shaka.Engine(config) : undefined;
+                                break;
+
+                            default:
+                                console.error("Unexpected player type: ", this.playerType);
+                                return;
+                        }
 
-                case "plyr":
-                    this.initPlyrPlayerHlsJs();
-                    break;
+                        switch (this.playerType) {
+                            case "hlsjs":
+                                this.initHlsJsPlayer();
+                                break;
 
-                case "shakaplayer":
-                    this.initShakaPlayer();
-                    break;
+                            case "clappr":
+                                this.initClapprPlayer();
+                                break;
 
-                case "clappr-shaka":
-                    this.initClapprPlayer(true);
-                    break;
+                            case "flowplayer":
+                                this.initFlowplayerPlayer();
+                                break;
 
-                case "dplayer-shaka":
-                    this.initDPlayerShaka();
-                    break;
+                            case "mediaelement":
+                                this.initMediaElementPlayer();
+                                break;
 
-                case "plyr-shaka":
-                    this.initPlyrPlayerShaka();
-                    break;
-            }
+                            case "videojs-contrib-hlsjs":
+                                this.initVideoJsContribHlsJsPlayer();
+                                break;
 
-            if (this.isP2PSupported) {
-                this.engine.on(p2pml.core.Events.PieceBytesDownloaded, this.onBytesDownloaded.bind(this));
-                this.engine.on(p2pml.core.Events.PieceBytesUploaded, this.onBytesUploaded.bind(this));
+                            case "videojs-hlsjs-plugin":
+                                this.initVideoJsHlsJsPlugin();
+                                break;
 
-                var trackerAnnounce = this.engine.getSettings().loader.trackerAnnounce;
-                if (Array.isArray(trackerAnnounce)) {
-                    document.getElementById("announce").innerHTML = trackerAnnounce.join("<br />");
-                }
-            }
+                            case "jwplayer":
+                                this.initJwPlayer();
+                                break;
 
-            this.refreshChart();
-            this.refreshGraph();
-        }
+                            case "dplayer":
+                                this.initDPlayerHlsJs();
+                                break;
 
-        async initHlsJsPlayer() {
-            if (!Hls.isSupported()) {
-                return;
-            }
-            var video = document.createElement("video");
-            video.id = "video";
-            video.volume = 0;
-            video.setAttribute("playsinline", "");
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            video.setAttribute("controls", "");
-            this.videoContainer.appendChild(video);
-
-            var level = document.createElement("select");
-            level.id = "level";
-            level.classList.add("form-control");
-            this.videoContainer.appendChild(level);
-
-            var hls = new Hls({
-                liveSyncDurationCount: this.liveSyncDurationCount,
-                loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader
-            });
-
-            if (this.isP2PSupported) {
-                p2pml.hlsjs.initHlsJsPlayer(hls);
-            }
+                            case "plyr":
+                                this.initPlyrPlayerHlsJs();
+                                break;
 
-            hls.loadSource(this.videoUrl);
-            hls.attachMedia(video);
-            hls.on(Hls.Events.MANIFEST_PARSED, () => {
-                this.hlsLevelSwitcher.init(hls, level);
-            });
-        }
-
-        async initClapprPlayer(isShaka) {
-            const scriptsPromise = (async () => {
-                await loadScript("https://cdn.jsdelivr.net/npm/clappr@latest");
-                await loadScript("https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js");
-            })();
-
-            var outer = document.createElement("div");
-            outer.className = "embed-responsive embed-responsive-16by9";
-            var video = document.createElement("div");
-            video.id = "video";
-            video.className = "embed-responsive-item";
-            outer.appendChild(video);
-            this.videoContainer.appendChild(outer);
-
-            var setup = {
-                parentId: "#video",
-                plugins: [],
-                source: this.videoUrl,
-                width: "100%",
-                height: "100%",
-                muted: true,
-                mute: true,
-                autoPlay: true,
-                playback: {
-                    playInline: true
-                }
-            };
-
-            if (isShaka) {
-                await scriptsPromise;
-                await loadScript("https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js");
-                setup.plugins.push(DashShakaPlayback);
-                setup.shakaOnBeforeLoad = (shakaPlayerInstance) => {
-                    if (this.isP2PSupported) {
-                        this.engine.initShakaPlayer(shakaPlayerInstance);
-                    }
-                };
-            } else {
-                setup.playback.hlsjsConfig = {
-                    liveSyncDurationCount: this.liveSyncDurationCount,
-                    loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader
-                };
-            }
+                            case "shakaplayer":
+                                this.initShakaPlayer();
+                                break;
+
+                            case "clappr-shaka":
+                                this.initClapprPlayer(true);
+                                break;
 
-            await scriptsPromise;
+                            case "dplayer-shaka":
+                                this.initDPlayerShaka();
+                                break;
 
-            setup.plugins.push(LevelSelector);
+                            case "plyr-shaka":
+                                this.initPlyrPlayerShaka();
+                                break;
+                        }
 
-            var player = new Clappr.Player(setup);
+                        if (this.isP2PSupported) {
+                            this.engine.on(p2pml.core.Events.PieceBytesDownloaded, this.onBytesDownloaded.bind(this));
+                            this.engine.on(p2pml.core.Events.PieceBytesUploaded, this.onBytesUploaded.bind(this));
 
-            if (!isShaka && this.isP2PSupported) {
-                p2pml.hlsjs.initClapprPlayer(player);
-            }
-        }
-
-        async initMediaElementPlayer() {
-            const scriptPromise = loadScript("https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelement-and-player.min.js");
-            loadStyle("https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelementplayer.min.css");
-
-            var video = document.createElement("video");
-            video.id = "video";
-            video.volume = 0;
-            video.setAttribute("playsinline", "");
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            this.videoContainer.appendChild(video);
-
-            await scriptPromise;
-
-            // allow only one supported renderer
-            mejs.Renderers.order = ["native_hls"];
-
-            var player = new MediaElementPlayer("video", {
-                stretching: "responsive",
-                startVolume: 0,
-                hls: {
-                    liveSyncDurationCount: this.liveSyncDurationCount,
-                    loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader
-                },
-                success: (mediaElement) => {
-                    if (this.isP2PSupported) {
-                        p2pml.hlsjs.initMediaElementJsPlayer(mediaElement)
+                            var trackerAnnounce = this.engine.getSettings().loader.trackerAnnounce;
+                            if (Array.isArray(trackerAnnounce)) {
+                                document.getElementById("announce").innerHTML = trackerAnnounce.join("<br />");
+                            }
+                        }
+
+                        this.refreshChart();
+                        this.refreshGraph();
                     }
-                }
-            });
-
-            player.setSrc(this.videoUrl);
-            //player.options.forceLive = true;
-
-            player.load();
-            player.play();
-        }
-
-        async initFlowplayerPlayer() {
-            const scriptPromise = loadScript("https://releases.flowplayer.org/7.2.7/flowplayer.min.js");
-            loadStyle("https://releases.flowplayer.org/7.2.7/skin/skin.css");
-
-            var video = document.createElement("div");
-            video.id = "video";
-            video.className = "fp-slim";
-            this.videoContainer.appendChild(video);
-
-            await scriptPromise;
-
-            var player = flowplayer("#video", {
-                autoplay: true,
-                muted: true,
-                live: true,
-                clip: {
-                    sources: [{
-                        type: "application/x-mpegurl",
-                        src: this.videoUrl
-                    }]
-                },
-                hlsjs: {
-                    liveSyncDurationCount: this.liveSyncDurationCount,
-                    loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader,
-                    safari: true
-                }
-            });
 
-            if (this.isP2PSupported) {
-                p2pml.hlsjs.initFlowplayerHlsJsPlayer(player);
-            }
-        }
-
-        async initVideoJsContribHlsJsPlayer() {
-            const scriptPromise = (async () => {
-                await loadScript("https://vjs.zencdn.net/7.6.0/video.js");
-                await loadScript("https://cdn.jsdelivr.net/npm/videojs-contrib-hls.js@latest");
-            })();
-
-            loadStyle("https://vjs.zencdn.net/7.6.0/video-js.css");
-
-            var outer = document.createElement("div");
-            outer.className = "embed-responsive embed-responsive-16by9";
-            var video = document.createElement("video");
-            video.id = "video";
-            video.preload = "none";
-            video.className = "embed-responsive-item video-js vjs-default-skin";
-            video.volume = 0;
-            video.setAttribute("playsinline", "");
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            video.setAttribute("controls", "");
-            outer.appendChild(video);
-            this.videoContainer.appendChild(outer);
-
-            await scriptPromise;
-
-            var player = videojs("video", {
-                html5: {
-                    hlsjsConfig: {
-                        liveSyncDurationCount: this.liveSyncDurationCount,
-                        loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader
+                    async initHlsJsPlayer() {
+                        if (!Hls.isSupported()) {
+                            return;
+                        }
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.volume = 0;
+                        video.setAttribute("playsinline", "");
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        video.setAttribute("controls", "");
+                        this.videoContainer.appendChild(video);
+
+                        var level = document.createElement("select");
+                        level.id = "level";
+                        level.classList.add("form-control");
+                        this.videoContainer.appendChild(level);
+
+                        var hls = new Hls({
+                            liveSyncDurationCount: this.liveSyncDurationCount,
+                            loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader,
+                        });
+
+                        if (this.isP2PSupported) {
+                            p2pml.hlsjs.initHlsJsPlayer(hls);
+                        }
+
+                        hls.loadSource(this.videoUrl);
+                        hls.attachMedia(video);
+                        hls.on(Hls.Events.MANIFEST_PARSED, () => {
+                            this.hlsLevelSwitcher.init(hls, level);
+                        });
                     }
-                }
-            });
 
-            if (this.isP2PSupported) {
-                p2pml.hlsjs.initVideoJsContribHlsJsPlayer(player);
-            }
+                    async initClapprPlayer(isShaka) {
+                        const scriptsPromise = (async () => {
+                            await loadScript("https://cdn.jsdelivr.net/npm/clappr@latest");
+                            await loadScript(
+                                "https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"
+                            );
+                        })();
+
+                        var outer = document.createElement("div");
+                        outer.className = "embed-responsive embed-responsive-16by9";
+                        var video = document.createElement("div");
+                        video.id = "video";
+                        video.className = "embed-responsive-item";
+                        outer.appendChild(video);
+                        this.videoContainer.appendChild(outer);
+
+                        var setup = {
+                            parentId: "#video",
+                            plugins: [],
+                            source: this.videoUrl,
+                            width: "100%",
+                            height: "100%",
+                            muted: true,
+                            mute: true,
+                            autoPlay: true,
+                            playback: {
+                                playInline: true,
+                            },
+                        };
+
+                        if (isShaka) {
+                            await scriptsPromise;
+                            await loadScript(
+                                "https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"
+                            );
+                            setup.plugins.push(DashShakaPlayback);
+                            setup.shakaOnBeforeLoad = (shakaPlayerInstance) => {
+                                if (this.isP2PSupported) {
+                                    this.engine.initShakaPlayer(shakaPlayerInstance);
+                                }
+                            };
+                        } else {
+                            setup.playback.hlsjsConfig = {
+                                liveSyncDurationCount: this.liveSyncDurationCount,
+                                loader: this.isP2PSupported
+                                    ? this.engine.createLoaderClass()
+                                    : Hls.DefaultConfig.loader,
+                            };
+                        }
 
-            player.src({
-                type: "application/x-mpegURL",
-                src: this.videoUrl
-            });
-
-            player.ready(() => {
-                player.volume(0);
-                player.play();
-            });
-        }
-
-        async initVideoJsHlsJsPlugin() {
-            const scriptPromise = await (async () => {
-                await loadScript("https://vjs.zencdn.net/7.6.0/video.js");
-                await Promise.all([
-                    loadScript("https://cdn.streamroot.io/videojs-hlsjs-plugin/1/stable/videojs-hlsjs-plugin.js"),
-                    loadScript("https://cdn.jsdelivr.net/npm/videojs-contrib-quality-levels@latest/dist/videojs-contrib-quality-levels.min.js"),
-                    loadScript("https://cdn.jsdelivr.net/npm/videojs-http-source-selector@latest/dist/videojs-http-source-selector.js")
-                ]);
-            })();
-
-            loadStyle("https://vjs.zencdn.net/7.6.0/video-js.css");
-
-            var outer = document.createElement("div");
-            outer.className = "embed-responsive embed-responsive-16by9";
-            var video = document.createElement("video");
-            video.id = "video";
-            video.className = "embed-responsive-item video-js vjs-default-skin";
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            video.setAttribute("controls", "");
-            outer.appendChild(video);
-            this.videoContainer.appendChild(outer);
-
-            await scriptPromise;
-
-            if (this.isP2PSupported) {
-                p2pml.hlsjs.initVideoJsHlsJsPlugin();
-            }
+                        await scriptsPromise;
+
+                        setup.plugins.push(LevelSelector);
 
-            var player = videojs("video", {
-                html5: {
-                    hlsjsConfig: {
-                        liveSyncDurationCount: this.liveSyncDurationCount,
-                        loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader
+                        var player = new Clappr.Player(setup);
+
+                        if (!isShaka && this.isP2PSupported) {
+                            p2pml.hlsjs.initClapprPlayer(player);
+                        }
                     }
-                }
-            });
-
-            player.httpSourceSelector();
-
-            player.src({
-                src: this.videoUrl,
-                type: "application/x-mpegURL"
-            });
-        }
-
-        async initJwPlayer() {
-            const scriptPromise = await Promise.all([
-                loadScript("https://content.jwplatform.com/libraries/aG3IMhIy.js"),
-                loadScript("https://cdn.jsdelivr.net/npm/@hola.org/jwplayer-hlsjs@latest/dist/jwplayer.hlsjs.min.js")
-            ]);
-
-            var video = document.createElement("div");
-            video.id = "video";
-            video.volume = 0;
-            video.setAttribute("playsinline", "");
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            this.videoContainer.appendChild(video);
-
-            await scriptPromise;
-
-            var player = jwplayer("video");
-            player.setup({ file: this.videoUrl, mute: true });
-
-            jwplayer_hls_provider.attach();
-
-            if (this.isP2PSupported) {
-                p2pml.hlsjs.initJwPlayer(player, {
-                    liveSyncDurationCount: this.liveSyncDurationCount,
-                    loader: this.engine.createLoaderClass()
-                });
-            }
-        }
 
-        async initDPlayerHlsJs() {
-            if (!Hls.isSupported()) {
-                return;
-            }
+                    async initMediaElementPlayer() {
+                        const scriptPromise = loadScript(
+                            "https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelement-and-player.min.js"
+                        );
+                        loadStyle(
+                            "https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelementplayer.min.css"
+                        );
+
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.volume = 0;
+                        video.setAttribute("playsinline", "");
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        this.videoContainer.appendChild(video);
+
+                        await scriptPromise;
+
+                        // allow only one supported renderer
+                        mejs.Renderers.order = ["native_hls"];
+
+                        var player = new MediaElementPlayer("video", {
+                            stretching: "responsive",
+                            startVolume: 0,
+                            hls: {
+                                liveSyncDurationCount: this.liveSyncDurationCount,
+                                loader: this.isP2PSupported
+                                    ? this.engine.createLoaderClass()
+                                    : Hls.DefaultConfig.loader,
+                            },
+                            success: (mediaElement) => {
+                                if (this.isP2PSupported) {
+                                    p2pml.hlsjs.initMediaElementJsPlayer(mediaElement);
+                                }
+                            },
+                        });
 
-            const scriptPromise = loadScript("https://cdn.jsdelivr.net/npm/dplayer@latest");
-            loadStyle("https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css");
-
-            var outer = document.createElement("div");
-            outer.id = "dplayer";
-            this.videoContainer.appendChild(outer);
-
-            await scriptPromise;
-
-            window.dp = new DPlayer({
-                container: document.getElementById("dplayer"),
-                video: {
-                    url: this.videoUrl,
-                    type: "customHls",
-                    customType: {
-                        "customHls": (video, player) => {
-                            const hls = new Hls({
-                                liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                                loader: this.engine.createLoaderClass()
-                            });
+                        player.setSrc(this.videoUrl);
+                        //player.options.forceLive = true;
 
-                            p2pml.hlsjs.initHlsJsPlayer(hls);
+                        player.load();
+                        player.play();
+                    }
+
+                    async initFlowplayerPlayer() {
+                        const scriptPromise = loadScript("https://releases.flowplayer.org/7.2.7/flowplayer.min.js");
+                        loadStyle("https://releases.flowplayer.org/7.2.7/skin/skin.css");
+
+                        var video = document.createElement("div");
+                        video.id = "video";
+                        video.className = "fp-slim";
+                        this.videoContainer.appendChild(video);
+
+                        await scriptPromise;
+
+                        var player = flowplayer("#video", {
+                            autoplay: true,
+                            muted: true,
+                            live: true,
+                            clip: {
+                                sources: [
+                                    {
+                                        type: "application/x-mpegurl",
+                                        src: this.videoUrl,
+                                    },
+                                ],
+                            },
+                            hlsjs: {
+                                liveSyncDurationCount: this.liveSyncDurationCount,
+                                loader: this.isP2PSupported
+                                    ? this.engine.createLoaderClass()
+                                    : Hls.DefaultConfig.loader,
+                                safari: true,
+                            },
+                        });
 
-                            hls.loadSource(video.src);
-                            hls.attachMedia(video);
+                        if (this.isP2PSupported) {
+                            p2pml.hlsjs.initFlowplayerHlsJsPlayer(player);
                         }
                     }
-                }
-            });
-        }
 
-        async initDPlayerShaka() {
-            if (!shaka.Player.isBrowserSupported()) {
-                return;
-            }
+                    async initVideoJsContribHlsJsPlayer() {
+                        const scriptPromise = (async () => {
+                            await loadScript("https://vjs.zencdn.net/7.6.0/video.js");
+                            await loadScript("https://cdn.jsdelivr.net/npm/videojs-contrib-hls.js@latest");
+                        })();
+
+                        loadStyle("https://vjs.zencdn.net/7.6.0/video-js.css");
+
+                        var outer = document.createElement("div");
+                        outer.className = "embed-responsive embed-responsive-16by9";
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.preload = "none";
+                        video.className = "embed-responsive-item video-js vjs-default-skin";
+                        video.volume = 0;
+                        video.setAttribute("playsinline", "");
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        video.setAttribute("controls", "");
+                        outer.appendChild(video);
+                        this.videoContainer.appendChild(outer);
+
+                        await scriptPromise;
+
+                        var player = videojs("video", {
+                            html5: {
+                                hlsjsConfig: {
+                                    liveSyncDurationCount: this.liveSyncDurationCount,
+                                    loader: this.isP2PSupported
+                                        ? this.engine.createLoaderClass()
+                                        : Hls.DefaultConfig.loader,
+                                },
+                            },
+                        });
 
-            const scriptPromise = loadScript("https://cdn.jsdelivr.net/npm/dplayer@latest");
-            loadStyle("https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css");
+                        if (this.isP2PSupported) {
+                            p2pml.hlsjs.initVideoJsContribHlsJsPlayer(player);
+                        }
 
-            var outer = document.createElement("div");
-            outer.id = "dplayer";
-            this.videoContainer.appendChild(outer);
+                        player.src({
+                            type: "application/x-mpegURL",
+                            src: this.videoUrl,
+                        });
 
-            await scriptPromise;
+                        player.ready(() => {
+                            player.volume(0);
+                            player.play();
+                        });
+                    }
 
-            window.dp = new DPlayer({
-                container: document.getElementById("dplayer"),
-                video: {
-                    url: this.videoUrl,
-                    type: "customHlsOrDash",
-                    customType: {
-                        "customHlsOrDash": (video, player) => {
-                            const src = video.src; // Shaka Player changes video.src to blob URL
-                            const shakaPlayer = new shaka.Player(video);
+                    async initVideoJsHlsJsPlugin() {
+                        const scriptPromise = await (async () => {
+                            await loadScript("https://vjs.zencdn.net/7.6.0/video.js");
+                            await Promise.all([
+                                loadScript(
+                                    "https://cdn.streamroot.io/videojs-hlsjs-plugin/1/stable/videojs-hlsjs-plugin.js"
+                                ),
+                                loadScript(
+                                    "https://cdn.jsdelivr.net/npm/videojs-contrib-quality-levels@latest/dist/videojs-contrib-quality-levels.min.js"
+                                ),
+                                loadScript(
+                                    "https://cdn.jsdelivr.net/npm/videojs-http-source-selector@latest/dist/videojs-http-source-selector.js"
+                                ),
+                            ]);
+                        })();
+
+                        loadStyle("https://vjs.zencdn.net/7.6.0/video-js.css");
+
+                        var outer = document.createElement("div");
+                        outer.className = "embed-responsive embed-responsive-16by9";
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.className = "embed-responsive-item video-js vjs-default-skin";
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        video.setAttribute("controls", "");
+                        outer.appendChild(video);
+                        this.videoContainer.appendChild(outer);
+
+                        await scriptPromise;
+
+                        if (this.isP2PSupported) {
+                            p2pml.hlsjs.initVideoJsHlsJsPlugin();
+                        }
 
-                            const onError = function(error) { console.error("Error code", error.code, "object", error); }
-                            shakaPlayer.addEventListener("error", function(event) { onError(event.detail); });
+                        var player = videojs("video", {
+                            html5: {
+                                hlsjsConfig: {
+                                    liveSyncDurationCount: this.liveSyncDurationCount,
+                                    loader: this.isP2PSupported
+                                        ? this.engine.createLoaderClass()
+                                        : Hls.DefaultConfig.loader,
+                                },
+                            },
+                        });
 
-                            this.engine.initShakaPlayer(shakaPlayer);
+                        player.httpSourceSelector();
 
-                            shakaPlayer.load(src).catch(onError);
+                        player.src({
+                            src: this.videoUrl,
+                            type: "application/x-mpegURL",
+                        });
+                    }
+
+                    async initJwPlayer() {
+                        const scriptPromise = await Promise.all([
+                            loadScript("https://content.jwplatform.com/libraries/aG3IMhIy.js"),
+                            loadScript(
+                                "https://cdn.jsdelivr.net/npm/@hola.org/jwplayer-hlsjs@latest/dist/jwplayer.hlsjs.min.js"
+                            ),
+                        ]);
+
+                        var video = document.createElement("div");
+                        video.id = "video";
+                        video.volume = 0;
+                        video.setAttribute("playsinline", "");
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        this.videoContainer.appendChild(video);
+
+                        await scriptPromise;
+
+                        var player = jwplayer("video");
+                        player.setup({ file: this.videoUrl, mute: true });
+
+                        jwplayer_hls_provider.attach();
+
+                        if (this.isP2PSupported) {
+                            p2pml.hlsjs.initJwPlayer(player, {
+                                liveSyncDurationCount: this.liveSyncDurationCount,
+                                loader: this.engine.createLoaderClass(),
+                            });
                         }
                     }
-                }
-            });
-        }
 
-        initShakaPlayer() {
-            if (!shaka.Player.isBrowserSupported()) {
-                return;
-            }
+                    async initDPlayerHlsJs() {
+                        if (!Hls.isSupported()) {
+                            return;
+                        }
 
-            var video = document.createElement("video");
-            video.id = "video";
-            video.volume = 0;
-            video.setAttribute("playsinline", "");
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            video.setAttribute("controls", "");
-            this.videoContainer.appendChild(video);
-
-            var level = document.createElement("select");
-            level.id = "level";
-            level.classList.add("form-control");
-            this.videoContainer.appendChild(level);
-
-            var player = new shaka.Player(video);
-            if (this.isP2PSupported) {
-                this.engine.initShakaPlayer(player);
-            }
-            this.shakaLevelSwitcher.init(player, level);
-            player.load(this.videoUrl);
-        }
+                        const scriptPromise = loadScript("https://cdn.jsdelivr.net/npm/dplayer@latest");
+                        loadStyle("https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css");
+
+                        var outer = document.createElement("div");
+                        outer.id = "dplayer";
+                        this.videoContainer.appendChild(outer);
+
+                        await scriptPromise;
+
+                        window.dp = new DPlayer({
+                            container: document.getElementById("dplayer"),
+                            video: {
+                                url: this.videoUrl,
+                                type: "customHls",
+                                customType: {
+                                    customHls: (video, player) => {
+                                        const hls = new Hls({
+                                            liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                                            loader: this.engine.createLoaderClass(),
+                                        });
+
+                                        p2pml.hlsjs.initHlsJsPlayer(hls);
+
+                                        hls.loadSource(video.src);
+                                        hls.attachMedia(video);
+                                    },
+                                },
+                            },
+                        });
+                    }
 
-        async initPlyrPlayerHlsJs() {
-            if (!Hls.isSupported()) {
-                return;
-            }
+                    async initDPlayerShaka() {
+                        if (!shaka.Player.isBrowserSupported()) {
+                            return;
+                        }
 
-            const scriptPromise = loadScript("https://cdn.plyr.io/3.5.6/plyr.js");
-            loadStyle("https://cdn.plyr.io/3.5.6/plyr.css");
+                        const scriptPromise = loadScript("https://cdn.jsdelivr.net/npm/dplayer@latest");
+                        loadStyle("https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css");
+
+                        var outer = document.createElement("div");
+                        outer.id = "dplayer";
+                        this.videoContainer.appendChild(outer);
+
+                        await scriptPromise;
+
+                        window.dp = new DPlayer({
+                            container: document.getElementById("dplayer"),
+                            video: {
+                                url: this.videoUrl,
+                                type: "customHlsOrDash",
+                                customType: {
+                                    customHlsOrDash: (video, player) => {
+                                        const src = video.src; // Shaka Player changes video.src to blob URL
+                                        const shakaPlayer = new shaka.Player(video);
+
+                                        const onError = function (error) {
+                                            console.error("Error code", error.code, "object", error);
+                                        };
+                                        shakaPlayer.addEventListener("error", function (event) {
+                                            onError(event.detail);
+                                        });
+
+                                        this.engine.initShakaPlayer(shakaPlayer);
+
+                                        shakaPlayer.load(src).catch(onError);
+                                    },
+                                },
+                            },
+                        });
+                    }
 
-            var video = document.createElement("video");
-            video.id = "video";
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            video.setAttribute("controls", "");
-            this.videoContainer.appendChild(video);
+                    initShakaPlayer() {
+                        if (!shaka.Player.isBrowserSupported()) {
+                            return;
+                        }
 
-            var level = document.createElement("select");
-            level.id = "level";
-            level.classList.add("form-control");
-            this.videoContainer.appendChild(level);
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.volume = 0;
+                        video.setAttribute("playsinline", "");
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        video.setAttribute("controls", "");
+                        this.videoContainer.appendChild(video);
+
+                        var level = document.createElement("select");
+                        level.id = "level";
+                        level.classList.add("form-control");
+                        this.videoContainer.appendChild(level);
+
+                        var player = new shaka.Player(video);
+                        if (this.isP2PSupported) {
+                            this.engine.initShakaPlayer(player);
+                        }
+                        this.shakaLevelSwitcher.init(player, level);
+                        player.load(this.videoUrl);
+                    }
 
-            await scriptPromise;
+                    async initPlyrPlayerHlsJs() {
+                        if (!Hls.isSupported()) {
+                            return;
+                        }
 
-            var player = new Plyr(video, {
-                captions: {
-                    active: true,
-                    update: true,
-                }
-            });
+                        const scriptPromise = loadScript("https://cdn.plyr.io/3.5.6/plyr.js");
+                        loadStyle("https://cdn.plyr.io/3.5.6/plyr.css");
 
-            var hls = new Hls({
-                liveSyncDurationCount: this.liveSyncDurationCount,
-                loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader
-            });
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        video.setAttribute("controls", "");
+                        this.videoContainer.appendChild(video);
 
-            if (this.isP2PSupported) {
-                p2pml.hlsjs.initHlsJsPlayer(hls);
-            }
+                        var level = document.createElement("select");
+                        level.id = "level";
+                        level.classList.add("form-control");
+                        this.videoContainer.appendChild(level);
 
-            hls.loadSource(this.videoUrl);
-            hls.attachMedia(video);
-            hls.on(Hls.Events.MANIFEST_PARSED, () => {
-                this.hlsLevelSwitcher.init(hls, level);
-            });
-        }
+                        await scriptPromise;
 
-        async initPlyrPlayerShaka() {
-            if (!shaka.Player.isBrowserSupported()) {
-                return;
-            }
+                        var player = new Plyr(video, {
+                            captions: {
+                                active: true,
+                                update: true,
+                            },
+                        });
 
-            const scriptPromise = loadScript("https://cdn.plyr.io/3.5.6/plyr.js");
-            loadStyle("https://cdn.plyr.io/3.5.6/plyr.css");
+                        var hls = new Hls({
+                            liveSyncDurationCount: this.liveSyncDurationCount,
+                            loader: this.isP2PSupported ? this.engine.createLoaderClass() : Hls.DefaultConfig.loader,
+                        });
 
-            var video = document.createElement("video");
-            video.id = "video";
-            video.volume = 0;
-            video.setAttribute("muted", "");
-            video.setAttribute("autoplay", "");
-            video.setAttribute("controls", "");
-            this.videoContainer.appendChild(video);
+                        if (this.isP2PSupported) {
+                            p2pml.hlsjs.initHlsJsPlayer(hls);
+                        }
 
-            var level = document.createElement("select");
-            level.id = "level";
-            level.classList.add("form-control");
-            this.videoContainer.appendChild(level);
+                        hls.loadSource(this.videoUrl);
+                        hls.attachMedia(video);
+                        hls.on(Hls.Events.MANIFEST_PARSED, () => {
+                            this.hlsLevelSwitcher.init(hls, level);
+                        });
+                    }
 
-            await scriptPromise;
+                    async initPlyrPlayerShaka() {
+                        if (!shaka.Player.isBrowserSupported()) {
+                            return;
+                        }
 
-            var player = new Plyr(video);
+                        const scriptPromise = loadScript("https://cdn.plyr.io/3.5.6/plyr.js");
+                        loadStyle("https://cdn.plyr.io/3.5.6/plyr.css");
 
-            var shakaPlayer = new shaka.Player(video);
-            if (this.isP2PSupported) {
-                this.engine.initShakaPlayer(shakaPlayer);
-            }
-            this.shakaLevelSwitcher.init(shakaPlayer, level);
-            shakaPlayer.load(this.videoUrl);
-        }
-
-        initChart() {
-            var chartConf = {
-                element: document.querySelector("#chart"),
-                renderer: 'multi',
-                interpolation: "basis",
-                stack: false,
-                min: 'auto',
-                strokeWidth: 1,
-                series: [
-                    {name: "Upload P2P", color: "#88eab9", data: [], renderer: 'area'},
-                    {name: " - P2P", color: "#88b9ea", data: [], renderer: 'area'},
-                    {name: " - HTTP", color: "#eae288", data: [], renderer: 'area'},
-                    {name: "Download", color: "#f64", data: [], renderer: 'line'}
-                ]
-            };
-
-            this.chart = new Rickshaw.Graph(chartConf);
-
-            new Rickshaw.Graph.Axis.X({
-                graph: this.chart,
-                tickFormat: () => ''
-            });
-
-            new Rickshaw.Graph.Axis.Y({
-                graph: this.chart,
-                orientation: 'left',
-                element: document.getElementById('y_axis')
-            });
-
-            this.legend = new Rickshaw.Graph.Legend({
-                graph: this.chart,
-                element: document.getElementById('legend')
-            });
-
-            this.legendTotals = new Rickshaw.Graph.Legend({
-                graph: this.chart,
-                element: document.getElementById("legend-totals")
-            });
-
-            this.chart.render();
-            setInterval(this.updateChartData.bind(this), 500);
-
-            var chartResize = () => {
-                chartConf.width = this.chart.element.clientWidth;
-                this.chart.configure(chartConf);
-                this.chart.render();
-            };
-
-            chartResize();
-            window.addEventListener("resize", chartResize);
-        }
-
-        refreshChart() {
-            if (!this.chart) {
-                return;
-            }
+                        var video = document.createElement("video");
+                        video.id = "video";
+                        video.volume = 0;
+                        video.setAttribute("muted", "");
+                        video.setAttribute("autoplay", "");
+                        video.setAttribute("controls", "");
+                        this.videoContainer.appendChild(video);
 
-            var data0 = this.chart.series[0].data;
-            var data1 = this.chart.series[1].data;
-            var data2 = this.chart.series[2].data;
-            var data3 = this.chart.series[3].data;
-            var lastX = data0.length > 0 ? data0[data0.length - 1].x : -1;
-
-            var seriesDataMapper = (currentValue, index) => ({x: index + lastX + 1, y: 0});
-
-            data0.length = 0;
-            data1.length = 0;
-            data2.length = 0;
-            data3.length = 0;
-
-            var stubData = Array.apply(null, Array(200)).map(seriesDataMapper);
-            data0.push.apply(data0, stubData.slice(0));
-            data1.push.apply(data1, stubData.slice(0));
-            data2.push.apply(data2, stubData.slice(0));
-            data3.push.apply(data3, stubData.slice(0));
-
-            this.chart.update();
-        }
-
-        updateChartData() {
-            var downloadSpeed = this.getDownloadSpeed();
-            var http = Number((downloadSpeed.http * 8 / 1000000).toFixed(2));
-            var p2p = Number((downloadSpeed.p2p * 8 / 1000000).toFixed(2));
-            var total = Number((http + p2p).toFixed(2));
-            var upload = Number(this.getUploadSpeed() * 8 / 1000000).toFixed(2);
-
-            var data0 = this.chart.series[0].data;
-            var data1 = this.chart.series[1].data;
-            var data2 = this.chart.series[2].data;
-            var data3 = this.chart.series[3].data;
-            var x = data0.length > 0 ? data0[data0.length - 1].x + 1 : 0;
-
-            data0.shift();
-            data1.shift();
-            data2.shift();
-            data3.shift();
-            data0.push({x: x, y: -upload});
-            data1.push({x: x, y: total});
-            data2.push({x: x, y: http});
-            data3.push({x: x, y: total});
-            this.chart.update();
-
-            this.formatChartLegendLine(0, total);
-            this.formatChartLegendLine(1, http);
-            this.formatChartLegendLine(2, p2p);
-            this.formatChartLegendLine(3, upload);
-
-            this.updateLegendTotals();
-        }
-
-        formatChartLegendLine(index, speed) {
-            if (this.legend) {
-                var line = this.legend.lines[index];
-                line.element.childNodes[1].textContent = line.series.name + ' - ' + speed + ' Mbit/s';
-            }
-        }
+                        var level = document.createElement("select");
+                        level.id = "level";
+                        level.classList.add("form-control");
+                        this.videoContainer.appendChild(level);
 
-        updateLegendTotals() {
-            if (!this.legendTotals) {
-                return;
-            }
+                        await scriptPromise;
 
-            var httpMb = this.downloadTotals.http / 1048576;
-            var p2pMb = this.downloadTotals.p2p / 1048576;
-            var totalMb = httpMb + p2pMb;
-            var uploadMb = this.uploadTotal / 1048576;
-
-            if (totalMb != 0) {
-                this.legendTotals.lines[0].element.childNodes[1].textContent
-                    = "Download - "
-                    + Number(totalMb).toFixed(1) + " MiB";
-
-                this.legendTotals.lines[1].element.childNodes[1].textContent
-                    = " - HTTP - "
-                    + Number(httpMb).toFixed(1) + " MiB - "
-                    + Number((httpMb * 100) / totalMb).toFixed(0) + "%";
-
-                this.legendTotals.lines[2].element.childNodes[1].textContent
-                    = " - P2P - "
-                    + Number(p2pMb).toFixed(1) + " MiB - "
-                    + Number((p2pMb * 100) / totalMb).toFixed(0) + "%";
-
-                this.legendTotals.lines[3].element.childNodes[1].textContent
-                    = "Upload P2P - "
-                    + Number(uploadMb).toFixed(1) + " MiB";
-            }
-        }
-
-        getDownloadSpeed() {
-            var startingPoint = performance.now() - (this.loadSpeedTimespan * 1000);
-            var httpSize = 0;
-            var p2pSize = 0;
-
-            var i = this.downloadStats.length;
-            while (i--) {
-                var stat = this.downloadStats[i];
-                if (stat.timestamp < startingPoint) {
-                    break;
-                }
+                        var player = new Plyr(video);
 
-                if (stat.method === "p2p") {
-                    p2pSize += stat.size;
-                } else if (stat.method === "http") {
-                    httpSize += stat.size;
-                }
-            }
+                        var shakaPlayer = new shaka.Player(video);
+                        if (this.isP2PSupported) {
+                            this.engine.initShakaPlayer(shakaPlayer);
+                        }
+                        this.shakaLevelSwitcher.init(shakaPlayer, level);
+                        shakaPlayer.load(this.videoUrl);
+                    }
 
-            this.downloadStats.splice(0, i + 1);
+                    initChart() {
+                        var chartConf = {
+                            element: document.querySelector("#chart"),
+                            renderer: "multi",
+                            interpolation: "basis",
+                            stack: false,
+                            min: "auto",
+                            strokeWidth: 1,
+                            series: [
+                                { name: "Upload P2P", color: "#88eab9", data: [], renderer: "area" },
+                                { name: " - P2P", color: "#88b9ea", data: [], renderer: "area" },
+                                { name: " - HTTP", color: "#eae288", data: [], renderer: "area" },
+                                { name: "Download", color: "#f64", data: [], renderer: "line" },
+                            ],
+                        };
+
+                        this.chart = new Rickshaw.Graph(chartConf);
+
+                        new Rickshaw.Graph.Axis.X({
+                            graph: this.chart,
+                            tickFormat: () => "",
+                        });
 
-            return {p2p: p2pSize / this.loadSpeedTimespan, http: httpSize / this.loadSpeedTimespan};
-        }
+                        new Rickshaw.Graph.Axis.Y({
+                            graph: this.chart,
+                            orientation: "left",
+                            element: document.getElementById("y_axis"),
+                        });
 
-        getUploadSpeed() {
-            var startingPoint = performance.now() - (this.loadSpeedTimespan * 1000);
-            var size = 0;
+                        this.legend = new Rickshaw.Graph.Legend({
+                            graph: this.chart,
+                            element: document.getElementById("legend"),
+                        });
 
-            var i = this.uploadStats.length;
-            while (i--) {
-                var stat = this.uploadStats[i];
-                if (stat.timestamp < startingPoint) {
-                    break;
-                }
+                        this.legendTotals = new Rickshaw.Graph.Legend({
+                            graph: this.chart,
+                            element: document.getElementById("legend-totals"),
+                        });
 
-                size += stat.size;
-            }
+                        this.chart.render();
+                        setInterval(this.updateChartData.bind(this), 500);
 
-            this.uploadStats.splice(0, i + 1);
+                        var chartResize = () => {
+                            chartConf.width = this.chart.element.clientWidth;
+                            this.chart.configure(chartConf);
+                            this.chart.render();
+                        };
 
-            return size / this.loadSpeedTimespan;
-        }
+                        chartResize();
+                        window.addEventListener("resize", chartResize);
+                    }
 
-        onBytesDownloaded(method, size) {
-            this.downloadStats.push({method: method, size: size, timestamp: performance.now()});
-            this.downloadTotals[method] += size;
-        }
+                    refreshChart() {
+                        if (!this.chart) {
+                            return;
+                        }
 
-        onBytesUploaded(method, size) {
-            this.uploadStats.push({size: size, timestamp: performance.now()});
-            this.uploadTotal += size;
-        }
+                        var data0 = this.chart.series[0].data;
+                        var data1 = this.chart.series[1].data;
+                        var data2 = this.chart.series[2].data;
+                        var data3 = this.chart.series[3].data;
+                        var lastX = data0.length > 0 ? data0[data0.length - 1].x : -1;
 
-        refreshGraph(p2pLoader) {
-            if (!this.graph) {
-                return;
-            }
+                        var seriesDataMapper = (currentValue, index) => ({ x: index + lastX + 1, y: 0 });
 
-            var nodes = this.graph.list();
-            for (var i = 0; i < nodes.length; i++) {
-                if (nodes[i].id !== "me") {
-                    this.graph.disconnect("me", nodes[i].id);
-                    this.graph.remove(nodes[i].id);
-                }
-            }
+                        data0.length = 0;
+                        data1.length = 0;
+                        data2.length = 0;
+                        data3.length = 0;
 
-            if (this.isP2PSupported) {
-                this.engine.on(p2pml.core.Events.PeerConnect, this.onPeerConnect.bind(this));
-                this.engine.on(p2pml.core.Events.PeerClose, this.onPeerClose.bind(this));
-            }
-        }
+                        var stubData = Array.apply(null, Array(200)).map(seriesDataMapper);
+                        data0.push.apply(data0, stubData.slice(0));
+                        data1.push.apply(data1, stubData.slice(0));
+                        data2.push.apply(data2, stubData.slice(0));
+                        data3.push.apply(data3, stubData.slice(0));
 
-        onPeerConnect(peer) {
-            if (!this.graph.hasPeer(peer.id)) {
-                this.graph.add({id: peer.id, name: peer.remoteAddress || 'Unknown'});
-                this.graph.connect("me", peer.id);
-            }
-        }
+                        this.chart.update();
+                    }
 
-        onPeerClose(id) {
-            if (this.graph.hasPeer(id)) {
-                this.graph.disconnect("me", id);
-                this.graph.remove(id);
-            }
-        }
-
-        constructor() {
-            this.hlsLevelSwitcher = {
-                auto: "Auto",
-                hls: undefined,
-                select: undefined,
-
-                init: function (hls, select) {
-                    if (hls.levelController.levels.length < 2) {
-                        select.style.display = "none";
-                        return;
-                    } else {
-                        select.style.display = "block";
+                    updateChartData() {
+                        var downloadSpeed = this.getDownloadSpeed();
+                        var http = Number(((downloadSpeed.http * 8) / 1000000).toFixed(2));
+                        var p2p = Number(((downloadSpeed.p2p * 8) / 1000000).toFixed(2));
+                        var total = Number((http + p2p).toFixed(2));
+                        var upload = Number((this.getUploadSpeed() * 8) / 1000000).toFixed(2);
+
+                        var data0 = this.chart.series[0].data;
+                        var data1 = this.chart.series[1].data;
+                        var data2 = this.chart.series[2].data;
+                        var data3 = this.chart.series[3].data;
+                        var x = data0.length > 0 ? data0[data0.length - 1].x + 1 : 0;
+
+                        data0.shift();
+                        data1.shift();
+                        data2.shift();
+                        data3.shift();
+                        data0.push({ x: x, y: -upload });
+                        data1.push({ x: x, y: total });
+                        data2.push({ x: x, y: http });
+                        data3.push({ x: x, y: total });
+                        this.chart.update();
+
+                        this.formatChartLegendLine(0, total);
+                        this.formatChartLegendLine(1, http);
+                        this.formatChartLegendLine(2, p2p);
+                        this.formatChartLegendLine(3, upload);
+
+                        this.updateLegendTotals();
                     }
 
-                    this.hls = hls;
-                    this.select = select;
+                    formatChartLegendLine(index, speed) {
+                        if (this.legend) {
+                            var line = this.legend.lines[index];
+                            line.element.childNodes[1].textContent = line.series.name + " - " + speed + " Mbit/s";
+                        }
+                    }
 
-                    this._clearOptions();
-                    this._addOption(this.auto);
-                    hls.levelController.levels.forEach((e, i) => {
-                        var name = [];
-                        if (e.height) {
-                            name.push(e.height + "p");
+                    updateLegendTotals() {
+                        if (!this.legendTotals) {
+                            return;
                         }
-                        if (e.bitrate) {
-                            name.push(Math.round(e.bitrate / 1000) + "k");
+
+                        var httpMb = this.downloadTotals.http / 1048576;
+                        var p2pMb = this.downloadTotals.p2p / 1048576;
+                        var totalMb = httpMb + p2pMb;
+                        var uploadMb = this.uploadTotal / 1048576;
+
+                        if (totalMb != 0) {
+                            this.legendTotals.lines[0].element.childNodes[1].textContent =
+                                "Download - " + Number(totalMb).toFixed(1) + " MiB";
+
+                            this.legendTotals.lines[1].element.childNodes[1].textContent =
+                                " - HTTP - " +
+                                Number(httpMb).toFixed(1) +
+                                " MiB - " +
+                                Number((httpMb * 100) / totalMb).toFixed(0) +
+                                "%";
+
+                            this.legendTotals.lines[2].element.childNodes[1].textContent =
+                                " - P2P - " +
+                                Number(p2pMb).toFixed(1) +
+                                " MiB - " +
+                                Number((p2pMb * 100) / totalMb).toFixed(0) +
+                                "%";
+
+                            this.legendTotals.lines[3].element.childNodes[1].textContent =
+                                "Upload P2P - " + Number(uploadMb).toFixed(1) + " MiB";
                         }
-                        if (name.length === 0) {
-                            name.push("Quality #" + i);
+                    }
+
+                    getDownloadSpeed() {
+                        var startingPoint = performance.now() - this.loadSpeedTimespan * 1000;
+                        var httpSize = 0;
+                        var p2pSize = 0;
+
+                        var i = this.downloadStats.length;
+                        while (i--) {
+                            var stat = this.downloadStats[i];
+                            if (stat.timestamp < startingPoint) {
+                                break;
+                            }
+
+                            if (stat.method === "p2p") {
+                                p2pSize += stat.size;
+                            } else if (stat.method === "http") {
+                                httpSize += stat.size;
+                            }
                         }
-                        this._addOption(name.join(" / "), i);
-                    });
 
-                    hls.on(Hls.Events.LEVEL_SWITCHED, this._hlsLevelSwitch.bind(this));
+                        this.downloadStats.splice(0, i + 1);
 
-                    this.select.addEventListener("change", (event) => {
-                        hls.nextLevel = event.target.selectedIndex - 1;
-                        this._hlsLevelSwitch();
-                    });
-                },
-
-                _hlsLevelSwitch: function () {
-                    var auto = this.select.querySelector("option:not([data-index])");
-                    var curr = this.select.querySelector("option[data-index='" + this.hls.currentLevel + "']");
-                    if (this.hls.autoLevelEnabled || this.hls.currentLevel === -1) {
-                        auto.selected = true;
-                        auto.text = curr ? curr.text + " (" + this.auto + ")" : this.auto;
-                    } else {
-                        curr.selected = true;
-                        auto.text = this.auto;
+                        return { p2p: p2pSize / this.loadSpeedTimespan, http: httpSize / this.loadSpeedTimespan };
                     }
-                },
 
-                _clearOptions: function () {
-                    while (this.select.options.length) {
-                        this.select.remove(0);
-                    }
-                },
+                    getUploadSpeed() {
+                        var startingPoint = performance.now() - this.loadSpeedTimespan * 1000;
+                        var size = 0;
 
-                _addOption: function (text, index) {
-                    var option = document.createElement("option");
-                    option.text = text;
-                    if (index !== undefined) {
-                        option.dataset.index = index;
-                    }
-                    this.select.add(option);
-                }
-            };
+                        var i = this.uploadStats.length;
+                        while (i--) {
+                            var stat = this.uploadStats[i];
+                            if (stat.timestamp < startingPoint) {
+                                break;
+                            }
 
-            this.shakaLevelSwitcher = {
-                auto: "Auto",
-                player: undefined,
-                select: undefined,
+                            size += stat.size;
+                        }
 
-                init: function (player, select) {
-                    this.player = player;
-                    this.select = select;
+                        this.uploadStats.splice(0, i + 1);
 
-                    player.addEventListener("trackschanged", () => {
-                        this._clearOptions();
-                        this._addOption(this.auto);
-                        this.player.getVariantTracks().forEach((e, i) => {
-                            var name = [];
+                        return size / this.loadSpeedTimespan;
+                    }
 
-                            if (e.height) {
-                                name.push(e.height + "p");
-                            }
+                    onBytesDownloaded(method, size) {
+                        this.downloadStats.push({ method: method, size: size, timestamp: performance.now() });
+                        this.downloadTotals[method] += size;
+                    }
 
-                            if (e.bandwidth) {
-                                name.push(Math.round(e.bandwidth / 1000) + "k");
-                            }
+                    onBytesUploaded(method, size) {
+                        this.uploadStats.push({ size: size, timestamp: performance.now() });
+                        this.uploadTotal += size;
+                    }
 
-                            if (e.label) {
-                                name.push(e.label);
-                            } else if (e.language) {
-                                name.push(e.language);
-                            }
+                    refreshGraph(p2pLoader) {
+                        if (!this.graph) {
+                            return;
+                        }
 
-                            if (name.length === 0) {
-                                name.push("Variant #" + i);
+                        var nodes = this.graph.list();
+                        for (var i = 0; i < nodes.length; i++) {
+                            if (nodes[i].id !== "me") {
+                                this.graph.disconnect("me", nodes[i].id);
+                                this.graph.remove(nodes[i].id);
                             }
+                        }
 
-                            this._addOption(name.join(" / "), e.id);
-                        });
-                    });
-
-                    player.addEventListener("adaptation", () => {
-                        var variantId = this.player.getVariantTracks().find(i => i.active === true).id;
-                        var curr = this.select.querySelector("option[data-variant-id='" + variantId + "']");
-                        var auto = this.select.querySelector("option:not([data-variant-id])");
-                        auto.text = curr ? curr.text + " (" + this.auto + ")" : this.auto;
-                    });
+                        if (this.isP2PSupported) {
+                            this.engine.on(p2pml.core.Events.PeerConnect, this.onPeerConnect.bind(this));
+                            this.engine.on(p2pml.core.Events.PeerClose, this.onPeerClose.bind(this));
+                        }
+                    }
 
-                    select.addEventListener("change", () => {
-                        var variantId = this.select.selectedOptions[ 0 ].dataset.variantId;
-                        if (variantId) {
-                            var variant = this.player.getVariantTracks().find(i => i.id == variantId);
-                            this.player.configure({ abr: { enabled: false } });
-                            this.player.selectVariantTrack(variant);
-                            var auto = this.select.querySelector("option:not([data-variant-id])");
-                            auto.text = this.auto;
-                        } else {
-                            this.player.configure({ abr: { enabled: true } });
+                    onPeerConnect(peer) {
+                        if (!this.graph.hasPeer(peer.id)) {
+                            this.graph.add({ id: peer.id, name: peer.remoteAddress || "Unknown" });
+                            this.graph.connect("me", peer.id);
                         }
-                    });
-                },
+                    }
 
-                _clearOptions: function () {
-                    while (this.select.options.length) {
-                        this.select.remove(0);
+                    onPeerClose(id) {
+                        if (this.graph.hasPeer(id)) {
+                            this.graph.disconnect("me", id);
+                            this.graph.remove(id);
+                        }
                     }
-                },
 
-                _addOption: function (text, variantId) {
-                    var option = document.createElement("option");
-                    option.text = text;
-                    if (variantId) {
-                        option.dataset.variantId = variantId;
+                    constructor() {
+                        this.hlsLevelSwitcher = {
+                            auto: "Auto",
+                            hls: undefined,
+                            select: undefined,
+
+                            init: function (hls, select) {
+                                if (hls.levelController.levels.length < 2) {
+                                    select.style.display = "none";
+                                    return;
+                                } else {
+                                    select.style.display = "block";
+                                }
+
+                                this.hls = hls;
+                                this.select = select;
+
+                                this._clearOptions();
+                                this._addOption(this.auto);
+                                hls.levelController.levels.forEach((e, i) => {
+                                    var name = [];
+                                    if (e.height) {
+                                        name.push(e.height + "p");
+                                    }
+                                    if (e.bitrate) {
+                                        name.push(Math.round(e.bitrate / 1000) + "k");
+                                    }
+                                    if (name.length === 0) {
+                                        name.push("Quality #" + i);
+                                    }
+                                    this._addOption(name.join(" / "), i);
+                                });
+
+                                hls.on(Hls.Events.LEVEL_SWITCHED, this._hlsLevelSwitch.bind(this));
+
+                                this.select.addEventListener("change", (event) => {
+                                    hls.nextLevel = event.target.selectedIndex - 1;
+                                    this._hlsLevelSwitch();
+                                });
+                            },
+
+                            _hlsLevelSwitch: function () {
+                                var auto = this.select.querySelector("option:not([data-index])");
+                                var curr = this.select.querySelector(
+                                    "option[data-index='" + this.hls.currentLevel + "']"
+                                );
+                                if (this.hls.autoLevelEnabled || this.hls.currentLevel === -1) {
+                                    auto.selected = true;
+                                    auto.text = curr ? curr.text + " (" + this.auto + ")" : this.auto;
+                                } else {
+                                    curr.selected = true;
+                                    auto.text = this.auto;
+                                }
+                            },
+
+                            _clearOptions: function () {
+                                while (this.select.options.length) {
+                                    this.select.remove(0);
+                                }
+                            },
+
+                            _addOption: function (text, index) {
+                                var option = document.createElement("option");
+                                option.text = text;
+                                if (index !== undefined) {
+                                    option.dataset.index = index;
+                                }
+                                this.select.add(option);
+                            },
+                        };
+
+                        this.shakaLevelSwitcher = {
+                            auto: "Auto",
+                            player: undefined,
+                            select: undefined,
+
+                            init: function (player, select) {
+                                this.player = player;
+                                this.select = select;
+
+                                player.addEventListener("trackschanged", () => {
+                                    this._clearOptions();
+                                    this._addOption(this.auto);
+                                    this.player.getVariantTracks().forEach((e, i) => {
+                                        var name = [];
+
+                                        if (e.height) {
+                                            name.push(e.height + "p");
+                                        }
+
+                                        if (e.bandwidth) {
+                                            name.push(Math.round(e.bandwidth / 1000) + "k");
+                                        }
+
+                                        if (e.label) {
+                                            name.push(e.label);
+                                        } else if (e.language) {
+                                            name.push(e.language);
+                                        }
+
+                                        if (name.length === 0) {
+                                            name.push("Variant #" + i);
+                                        }
+
+                                        this._addOption(name.join(" / "), e.id);
+                                    });
+                                });
+
+                                player.addEventListener("adaptation", () => {
+                                    var variantId = this.player.getVariantTracks().find((i) => i.active === true).id;
+                                    var curr = this.select.querySelector("option[data-variant-id='" + variantId + "']");
+                                    var auto = this.select.querySelector("option:not([data-variant-id])");
+                                    auto.text = curr ? curr.text + " (" + this.auto + ")" : this.auto;
+                                });
+
+                                select.addEventListener("change", () => {
+                                    var variantId = this.select.selectedOptions[0].dataset.variantId;
+                                    if (variantId) {
+                                        var variant = this.player.getVariantTracks().find((i) => i.id == variantId);
+                                        this.player.configure({ abr: { enabled: false } });
+                                        this.player.selectVariantTrack(variant);
+                                        var auto = this.select.querySelector("option:not([data-variant-id])");
+                                        auto.text = this.auto;
+                                    } else {
+                                        this.player.configure({ abr: { enabled: true } });
+                                    }
+                                });
+                            },
+
+                            _clearOptions: function () {
+                                while (this.select.options.length) {
+                                    this.select.remove(0);
+                                }
+                            },
+
+                            _addOption: function (text, variantId) {
+                                var option = document.createElement("option");
+                                option.text = text;
+                                if (variantId) {
+                                    option.dataset.variantId = variantId;
+                                }
+                                this.select.add(option);
+                            },
+                        };
                     }
-                    this.select.add(option);
                 }
-            };
-        }
-    }
-
-    window.demo = new DemoApp();
-    window.demo.init();
 
-</script>
-</div>
-</body>
+                window.demo = new DemoApp();
+                window.demo.init();
+            </script>
+        </div>
+    </body>
 </html>
diff --git a/p2p-media-loader-demo/package-lock.json b/p2p-media-loader-demo/package-lock.json
index 64276760..65c8409e 100644
--- a/p2p-media-loader-demo/package-lock.json
+++ b/p2p-media-loader-demo/package-lock.json
@@ -951,6 +951,12 @@
       "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
       "dev": true
     },
+    "eslint-config-prettier": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.1.0.tgz",
+      "integrity": "sha512-oKMhGv3ihGbCIimCAjqkdzx2Q+jthoqnXSP+d86M9tptwugycmTFdVR4IpLgq2c4SHifbwO90z2fQ8/Aio73yw==",
+      "dev": true
+    },
     "events": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
@@ -1663,6 +1669,12 @@
         "sha.js": "^2.4.8"
       }
     },
+    "prettier": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.2.1.tgz",
+      "integrity": "sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==",
+      "dev": true
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
diff --git a/p2p-media-loader-demo/package.json b/p2p-media-loader-demo/package.json
index 15df52c5..14dec1b0 100644
--- a/p2p-media-loader-demo/package.json
+++ b/p2p-media-loader-demo/package.json
@@ -39,6 +39,8 @@
     "browserify": "^17.0.0",
     "browserify-versionify": "^1.0.6",
     "copyfiles": "^2.4.1",
+    "eslint-config-prettier": "^8.1.0",
+    "prettier": "^2.2.1",
     "terser": "^5.6.1"
   }
 }
diff --git a/p2p-media-loader-hlsjs/.editorconfig b/p2p-media-loader-hlsjs/.editorconfig
index 4b43aa8e..6c761897 100644
--- a/p2p-media-loader-hlsjs/.editorconfig
+++ b/p2p-media-loader-hlsjs/.editorconfig
@@ -7,6 +7,7 @@ end_of_line              = lf
 charset                  = utf-8
 trim_trailing_whitespace = true
 insert_final_newline     = true
+max_line_length          = 120
 [*.md]
 trim_trailing_whitespace = false
 [*.json]
diff --git a/p2p-media-loader-hlsjs/.eslintrc b/p2p-media-loader-hlsjs/.eslintrc
index b22e2242..0484f2e1 100644
--- a/p2p-media-loader-hlsjs/.eslintrc
+++ b/p2p-media-loader-hlsjs/.eslintrc
@@ -11,7 +11,8 @@
         "eslint:recommended",
         "plugin:@typescript-eslint/eslint-recommended",
         "plugin:@typescript-eslint/recommended",
-        "plugin:@typescript-eslint/recommended-requiring-type-checking"
+        "plugin:@typescript-eslint/recommended-requiring-type-checking",
+        "prettier"
     ],
     "env": {
         "browser": true
diff --git a/p2p-media-loader-hlsjs/demo/clappr.html b/p2p-media-loader-hlsjs/demo/clappr.html
index 8d3c37dd..846e18c8 100644
--- a/p2p-media-loader-hlsjs/demo/clappr.html
+++ b/p2p-media-loader-hlsjs/demo/clappr.html
@@ -15,56 +15,50 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Clappr player with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <script src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
-
-    <style>
-        #video {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="video"></div>
-
-    <script>
-
-        if (p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            var player = new Clappr.Player({
-                parentId: "#video",
-                source: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
-                playback: {
-                    hlsjsConfig: {
-                        liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                        loader: engine.createLoaderClass()
-                    }
-                }
-            });
-
-            p2pml.hlsjs.initClapprPlayer(player);
-
-            player.setVolume(1); // 1%
-            player.play();
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Clappr player with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <script src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
+
+        <style>
+            #video {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="video"></div>
+
+        <script>
+            if (p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                var player = new Clappr.Player({
+                    parentId: "#video",
+                    source: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                    playback: {
+                        hlsjsConfig: {
+                            liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                            loader: engine.createLoaderClass(),
+                        },
+                    },
+                });
+
+                p2pml.hlsjs.initClapprPlayer(player);
+
+                player.setVolume(1); // 1%
+                player.play();
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/dplayer.html b/p2p-media-loader-hlsjs/demo/dplayer.html
index 0024b86a..9f3db164 100644
--- a/p2p-media-loader-hlsjs/demo/dplayer.html
+++ b/p2p-media-loader-hlsjs/demo/dplayer.html
@@ -15,61 +15,57 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
+    <head>
+        <meta charset="UTF-8" />
 
-    <meta charset="UTF-8">
+        <title>DPlayer with hls.js engine and P2P demo</title>
 
-    <title>DPlayer with hls.js engine and P2P demo</title>
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
 
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css" />
+        <script src="https://cdn.jsdelivr.net/npm/dplayer@latest"></script>
 
-    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css">
-    <script src="https://cdn.jsdelivr.net/npm/dplayer@latest"></script>
+        <style>
+            #dplayer {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="dplayer"></div>
 
-    <style>
-        #dplayer {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
+        <script>
+            if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
+                window.dp = new DPlayer({
+                    container: document.getElementById("dplayer"),
+                    video: {
+                        url: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                        type: "customHls",
+                        customType: {
+                            customHls: function (video, player) {
+                                const engine = new p2pml.hlsjs.Engine();
 
-</head>
-<body>
+                                const hls = new Hls({
+                                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                                    loader: engine.createLoaderClass(),
+                                });
 
-    <div id="dplayer"></div>
+                                p2pml.hlsjs.initHlsJsPlayer(hls);
 
-    <script>
-        if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
-            window.dp = new DPlayer({
-                container: document.getElementById("dplayer"),
-                video: {
-                    url: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
-                    type: "customHls",
-                    customType: {
-                        "customHls": function (video, player) {
-                            const engine = new p2pml.hlsjs.Engine();
-
-                            const hls = new Hls({
-                                liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                                loader: engine.createLoaderClass()
-                            });
-
-                            p2pml.hlsjs.initHlsJsPlayer(hls);
-
-                            hls.loadSource(video.src);
-                            hls.attachMedia(video);
-                        }
-                    }
-                }
-            });
-        } else {
-            document.write("Not supported :(");
-        }
-    </script>
-
-</body>
+                                hls.loadSource(video.src);
+                                hls.attachMedia(video);
+                            },
+                        },
+                    },
+                });
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/flowplayer.html b/p2p-media-loader-hlsjs/demo/flowplayer.html
index 30df745c..d2b1cbfb 100644
--- a/p2p-media-loader-hlsjs/demo/flowplayer.html
+++ b/p2p-media-loader-hlsjs/demo/flowplayer.html
@@ -15,61 +15,58 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Flowplayer with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
-
-    <link rel="stylesheet" href="https://releases.flowplayer.org/7.2.7/skin/skin.css">
-    <script src="https://releases.flowplayer.org/7.2.7/flowplayer.min.js"></script>
-
-    <style>
-        #video {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="video" class="fp-slim"></div>
-
-    <script>
-
-        if (p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            var player = flowplayer("#video", {
-                autoplay: true,
-                muted: true,
-                clip: {
-                    sources: [{
-                        src: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
-                        type: "application/x-mpegurl"
-                    }]
-                },
-                hlsjs: {
-                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                    loader: engine.createLoaderClass(),
-                    safari: true
-                }
-            });
-
-            p2pml.hlsjs.initFlowplayerHlsJsPlayer(player);
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Flowplayer with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
+
+        <link rel="stylesheet" href="https://releases.flowplayer.org/7.2.7/skin/skin.css" />
+        <script src="https://releases.flowplayer.org/7.2.7/flowplayer.min.js"></script>
+
+        <style>
+            #video {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="video" class="fp-slim"></div>
+
+        <script>
+            if (p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                var player = flowplayer("#video", {
+                    autoplay: true,
+                    muted: true,
+                    clip: {
+                        sources: [
+                            {
+                                src:
+                                    "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                                type: "application/x-mpegurl",
+                            },
+                        ],
+                    },
+                    hlsjs: {
+                        liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                        loader: engine.createLoaderClass(),
+                        safari: true,
+                    },
+                });
+
+                p2pml.hlsjs.initFlowplayerHlsJsPlayer(player);
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/hlsjs.html b/p2p-media-loader-hlsjs/demo/hlsjs.html
index 7a64d3d3..e8984884 100644
--- a/p2p-media-loader-hlsjs/demo/hlsjs.html
+++ b/p2p-media-loader-hlsjs/demo/hlsjs.html
@@ -15,52 +15,46 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Hls.js player with P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
-
-    <style>
-        #video {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <video id="video" controls muted></video>
-
-    <script>
-
-        if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            var hls = new Hls({
-                liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                loader: engine.createLoaderClass()
-            });
-
-            p2pml.hlsjs.initHlsJsPlayer(hls);
-
-            hls.loadSource("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
-
-            var video = document.getElementById("video");
-            hls.attachMedia(video);
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Hls.js player with P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
+
+        <style>
+            #video {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <video id="video" controls muted></video>
+
+        <script>
+            if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                var hls = new Hls({
+                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                    loader: engine.createLoaderClass(),
+                });
+
+                p2pml.hlsjs.initHlsJsPlayer(hls);
+
+                hls.loadSource("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
+
+                var video = document.getElementById("video");
+                hls.attachMedia(video);
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/jwplayer.html b/p2p-media-loader-hlsjs/demo/jwplayer.html
index 02be0f82..217aa144 100644
--- a/p2p-media-loader-hlsjs/demo/jwplayer.html
+++ b/p2p-media-loader-hlsjs/demo/jwplayer.html
@@ -15,56 +15,51 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>JWPlayer with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/@hola.org/jwplayer-hlsjs@latest/dist/jwplayer.hlsjs.min.js"></script>
-
-    <script src="https://content.jwplatform.com/libraries/aG3IMhIy.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
-
-    <style>
-        #wrapper {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-    <div id="wrapper">
-        <div id="player"></div>
-    </div>
-
-    <script>
-
-        if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            var player = jwplayer("player");
-
-            player.setup({
-                file: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8"
-            });
-
-            jwplayer_hls_provider.attach();
-
-            p2pml.hlsjs.initJwPlayer(player, {
-                liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                loader: engine.createLoaderClass()
-            });
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>JWPlayer with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/@hola.org/jwplayer-hlsjs@latest/dist/jwplayer.hlsjs.min.js"></script>
+
+        <script src="https://content.jwplatform.com/libraries/aG3IMhIy.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
+
+        <style>
+            #wrapper {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="wrapper">
+            <div id="player"></div>
+        </div>
+
+        <script>
+            if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                var player = jwplayer("player");
+
+                player.setup({
+                    file: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                });
+
+                jwplayer_hls_provider.attach();
+
+                p2pml.hlsjs.initJwPlayer(player, {
+                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                    loader: engine.createLoaderClass(),
+                });
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/mediaelementjs.html b/p2p-media-loader-hlsjs/demo/mediaelementjs.html
index 3b5741fd..a19f7639 100644
--- a/p2p-media-loader-hlsjs/demo/mediaelementjs.html
+++ b/p2p-media-loader-hlsjs/demo/mediaelementjs.html
@@ -15,64 +15,61 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>MediaElement player with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelementplayer.min.css">
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelement-and-player.min.js"></script>
-
-    <style>
-        #wrapper {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="wrapper">
-        <video id="video"></video>
-    </div>
-
-    <script>
-
-        if (p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            // allow only one supported renderer
-            mejs.Renderers.order = [ "native_hls" ];
-
-            var player = new MediaElementPlayer("video", {
-                stretching: "responsive",
-                startVolume: 0.01, // 1%
-                hls: {
-                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                    loader: engine.createLoaderClass()
-                },
-                success: function (mediaElement) {
-                    p2pml.hlsjs.initMediaElementJsPlayer(mediaElement);
-                }
-            });
-
-            player.setSrc("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
-            player.options.forceLive = true;
-
-            player.load();
-            player.play();
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>MediaElement player with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <link
+            rel="stylesheet"
+            href="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelementplayer.min.css"
+        />
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.9/mediaelement-and-player.min.js"></script>
+
+        <style>
+            #wrapper {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="wrapper">
+            <video id="video"></video>
+        </div>
+
+        <script>
+            if (p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                // allow only one supported renderer
+                mejs.Renderers.order = ["native_hls"];
+
+                var player = new MediaElementPlayer("video", {
+                    stretching: "responsive",
+                    startVolume: 0.01, // 1%
+                    hls: {
+                        liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                        loader: engine.createLoaderClass(),
+                    },
+                    success: function (mediaElement) {
+                        p2pml.hlsjs.initMediaElementJsPlayer(mediaElement);
+                    },
+                });
+
+                player.setSrc("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
+                player.options.forceLive = true;
+
+                player.load();
+                player.play();
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/offlineplayback.html b/p2p-media-loader-hlsjs/demo/offlineplayback.html
index 3f1f9119..015a6821 100644
--- a/p2p-media-loader-hlsjs/demo/offlineplayback.html
+++ b/p2p-media-loader-hlsjs/demo/offlineplayback.html
@@ -15,191 +15,200 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
+    <head>
+        <meta charset="UTF-8" />
 
-    <meta charset="UTF-8">
+        <title>Offline playback with hls.js engine and P2P demo</title>
 
-    <title>Offline playback with hls.js engine and P2P demo</title>
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
 
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
 
-    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
-
-    <style>
-        #video {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <video id="video" controls muted></video>
-
-    <script>
-        function initIndexedDb() {
-            return new Promise((resolve, reject) => {
-                const request = window.indexedDB.open("assets", 1);
-
-                request.onupgradeneeded = (event) => {
-                    console.info("Upgrading from", event.oldVersion, "to", event.newVersion);
-                    const db = event.target.result;
-
-                    switch (event.oldVersion) {
-                        case 0: { // create DB
-                            db.createObjectStore("assets", { keyPath: ["requestUri", "requestRange", "masterSwarmId"] });
-                            db.createObjectStore("segmentsData", { keyPath: ["id", "masterSwarmId"] });
-                            const segments = db.createObjectStore("segments", { keyPath: ["id", "masterSwarmId"] });
-                            segments.createIndex("masterSwarmId", "masterSwarmId", { multiEntry: true });
-                        } break;
-
-                        default:
-                            throw new Error("unknown database version:", event.oldVersion);
-                    }
-                };
-
-                request.onerror = (event) => reject(event);
-                request.onsuccess = (event) => resolve(event.target.result);
-            });
-        }
-
-        class IdbAssetsStorage {
-            constructor(db) {
-                this.db = db;
+        <style>
+            #video {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
             }
+        </style>
+    </head>
+    <body>
+        <video id="video" controls muted></video>
 
-            storeAsset(asset) {
+        <script>
+            function initIndexedDb() {
                 return new Promise((resolve, reject) => {
-                    const request = this.db.transaction(["assets"], "readwrite").objectStore("assets")
-                            .put(asset.requestRange === undefined ? {...asset, requestRange: ""} : asset);
-                    request.onerror = (event) => reject(event);
-                    request.onsuccess = (event) => resolve();
-                });
-            }
+                    const request = window.indexedDB.open("assets", 1);
+
+                    request.onupgradeneeded = (event) => {
+                        console.info("Upgrading from", event.oldVersion, "to", event.newVersion);
+                        const db = event.target.result;
+
+                        switch (event.oldVersion) {
+                            case 0:
+                                {
+                                    // create DB
+                                    db.createObjectStore("assets", {
+                                        keyPath: ["requestUri", "requestRange", "masterSwarmId"],
+                                    });
+                                    db.createObjectStore("segmentsData", { keyPath: ["id", "masterSwarmId"] });
+                                    const segments = db.createObjectStore("segments", {
+                                        keyPath: ["id", "masterSwarmId"],
+                                    });
+                                    segments.createIndex("masterSwarmId", "masterSwarmId", { multiEntry: true });
+                                }
+                                break;
+
+                            default:
+                                throw new Error("unknown database version:", event.oldVersion);
+                        }
+                    };
 
-            getAsset(requestUri, requestRange, masterSwarmId) {
-                return new Promise((resolve, reject) => {
-                    const request = this.db.transaction(["assets"]).objectStore("assets")
-                            .get([requestUri, requestRange === undefined ? "" : requestRange, masterSwarmId]);
                     request.onerror = (event) => reject(event);
                     request.onsuccess = (event) => resolve(event.target.result);
                 });
             }
 
-            destroy() {
-            }
-        }
-
-        class IdbSegmentsStorage {
-            constructor(db) {
-                this.db = db;
-            }
-
-            storeSegment(segment) {
-                return new Promise((resolve, reject) => {
-                    const segmentWithoutData = {...segment};
-                    delete segmentWithoutData.data;
-
-                    const transaction = this.db.transaction(["segments", "segmentsData"], "readwrite")
-                    transaction.objectStore("segments").put(segmentWithoutData).onsuccess = () => {
-                        transaction.objectStore("segmentsData").put({
-                            id: segment.id,
-                            masterSwarmId: segment.masterSwarmId,
-                            data: segment.data
-                        });
-                    }
-
-                    transaction.onerror = (event) => reject(event);
-                    transaction.oncomplete = () => resolve();
-                });
-            }
+            class IdbAssetsStorage {
+                constructor(db) {
+                    this.db = db;
+                }
+
+                storeAsset(asset) {
+                    return new Promise((resolve, reject) => {
+                        const request = this.db
+                            .transaction(["assets"], "readwrite")
+                            .objectStore("assets")
+                            .put(asset.requestRange === undefined ? { ...asset, requestRange: "" } : asset);
+                        request.onerror = (event) => reject(event);
+                        request.onsuccess = (event) => resolve();
+                    });
+                }
+
+                getAsset(requestUri, requestRange, masterSwarmId) {
+                    return new Promise((resolve, reject) => {
+                        const request = this.db
+                            .transaction(["assets"])
+                            .objectStore("assets")
+                            .get([requestUri, requestRange === undefined ? "" : requestRange, masterSwarmId]);
+                        request.onerror = (event) => reject(event);
+                        request.onsuccess = (event) => resolve(event.target.result);
+                    });
+                }
 
-            getSegmentsMap(masterSwarmId) {
-                return new Promise((resolve, reject) => {
-                    const cursor = this.db.transaction(["segments"]).objectStore("segments").index("masterSwarmId").openCursor(IDBKeyRange.only(masterSwarmId));
-                    const result = new Map();
-
-                    cursor.onerror = (event) => reject(event);
-                    cursor.onsuccess = (event) => {
-                        const cursor = event.target.result;
-                        if (cursor) {
-                            result.set(cursor.value.id, {segment: cursor.value});
-                            cursor.continue();
-                        } else {
-                            resolve(result);
-                        }
-                    };
-                });
+                destroy() {}
             }
 
-            getSegment(id, masterSwarmId) {
-                return new Promise((resolve, reject) => {
-                    const transaction = this.db.transaction(["segments", "segmentsData"]);
-
-                    let segment;
-                    transaction.objectStore("segments").get([id, masterSwarmId]).onsuccess = (event) => {
-                        segment = event.target.result;
-                        if (segment === undefined) {
-                            return;
-                        }
-
-                        transaction.objectStore("segmentsData").get([id, masterSwarmId]).onsuccess = (event) => {
-                            segment.data = event.target.result.data;
+            class IdbSegmentsStorage {
+                constructor(db) {
+                    this.db = db;
+                }
+
+                storeSegment(segment) {
+                    return new Promise((resolve, reject) => {
+                        const segmentWithoutData = { ...segment };
+                        delete segmentWithoutData.data;
+
+                        const transaction = this.db.transaction(["segments", "segmentsData"], "readwrite");
+                        transaction.objectStore("segments").put(segmentWithoutData).onsuccess = () => {
+                            transaction.objectStore("segmentsData").put({
+                                id: segment.id,
+                                masterSwarmId: segment.masterSwarmId,
+                                data: segment.data,
+                            });
                         };
-                    };
 
-                    transaction.onerror = (event) => reject(event);
-                    transaction.oncomplete = () => resolve(segment);
-                });
-            }
-
-            clean() {}
-            destroy() {}
-        }
-
-        (async () => {
-            const db = await initIndexedDb();
-            const assetsStorage = new IdbAssetsStorage(db);
-            const segmentsStorage = new IdbSegmentsStorage(db);
-
-            if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
-                var engine = new p2pml.hlsjs.Engine({
-                    segments: {
-                        assetsStorage: assetsStorage
-                    },
-                    loader: {
-                        segmentsStorage: segmentsStorage
-                    }
-                });
-
-                var hls = new Hls({
-                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                    loader: engine.createLoaderClass(),
-                });
-
-                p2pml.hlsjs.initHlsJsPlayer(hls);
-
-                hls.on(Hls.Events.MANIFEST_PARSED, () => {
-                    // disable ABR
-                    hls.autoLevelEnabled = false;
-                    hls.loadLevel = 0;
-                });
+                        transaction.onerror = (event) => reject(event);
+                        transaction.oncomplete = () => resolve();
+                    });
+                }
+
+                getSegmentsMap(masterSwarmId) {
+                    return new Promise((resolve, reject) => {
+                        const cursor = this.db
+                            .transaction(["segments"])
+                            .objectStore("segments")
+                            .index("masterSwarmId")
+                            .openCursor(IDBKeyRange.only(masterSwarmId));
+                        const result = new Map();
+
+                        cursor.onerror = (event) => reject(event);
+                        cursor.onsuccess = (event) => {
+                            const cursor = event.target.result;
+                            if (cursor) {
+                                result.set(cursor.value.id, { segment: cursor.value });
+                                cursor.continue();
+                            } else {
+                                resolve(result);
+                            }
+                        };
+                    });
+                }
+
+                getSegment(id, masterSwarmId) {
+                    return new Promise((resolve, reject) => {
+                        const transaction = this.db.transaction(["segments", "segmentsData"]);
+
+                        let segment;
+                        transaction.objectStore("segments").get([id, masterSwarmId]).onsuccess = (event) => {
+                            segment = event.target.result;
+                            if (segment === undefined) {
+                                return;
+                            }
+
+                            transaction.objectStore("segmentsData").get([id, masterSwarmId]).onsuccess = (event) => {
+                                segment.data = event.target.result.data;
+                            };
+                        };
 
-                hls.on(Hls.Events.MEDIA_ATTACHED, () => {
-                    hls.loadSource("https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/hls.m3u8");
-                });
+                        transaction.onerror = (event) => reject(event);
+                        transaction.oncomplete = () => resolve(segment);
+                    });
+                }
 
-                hls.attachMedia(document.getElementById("video"));
-            } else {
-                document.write("Not supported :(");
+                clean() {}
+                destroy() {}
             }
-        })();
-
-    </script>
 
-</body>
+            (async () => {
+                const db = await initIndexedDb();
+                const assetsStorage = new IdbAssetsStorage(db);
+                const segmentsStorage = new IdbSegmentsStorage(db);
+
+                if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
+                    var engine = new p2pml.hlsjs.Engine({
+                        segments: {
+                            assetsStorage: assetsStorage,
+                        },
+                        loader: {
+                            segmentsStorage: segmentsStorage,
+                        },
+                    });
+
+                    var hls = new Hls({
+                        liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                        loader: engine.createLoaderClass(),
+                    });
+
+                    p2pml.hlsjs.initHlsJsPlayer(hls);
+
+                    hls.on(Hls.Events.MANIFEST_PARSED, () => {
+                        // disable ABR
+                        hls.autoLevelEnabled = false;
+                        hls.loadLevel = 0;
+                    });
+
+                    hls.on(Hls.Events.MEDIA_ATTACHED, () => {
+                        hls.loadSource("https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/hls.m3u8");
+                    });
+
+                    hls.attachMedia(document.getElementById("video"));
+                } else {
+                    document.write("Not supported :(");
+                }
+            })();
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/plyr.html b/p2p-media-loader-hlsjs/demo/plyr.html
index eaa952fa..f6fc73e0 100644
--- a/p2p-media-loader-hlsjs/demo/plyr.html
+++ b/p2p-media-loader-hlsjs/demo/plyr.html
@@ -15,58 +15,52 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Plyr player with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <link rel="stylesheet" href="https://cdn.plyr.io/3.5.6/plyr.css">
-    <script src="https://cdn.plyr.io/3.5.6/plyr.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
-
-    <style>
-        #wrapper {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="wrapper">
-        <video id="video"></video>
-    </div>
-
-    <script>
-
-        if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            var video = document.getElementById("video");
-            var player = new Plyr(video, {captions: {active: true, update: true}});
-
-            var hls = new Hls({
-                liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                loader: engine.createLoaderClass()
-            });
-
-            p2pml.hlsjs.initHlsJsPlayer(hls);
-
-            hls.loadSource("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
-
-            hls.attachMedia(video);
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Plyr player with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <link rel="stylesheet" href="https://cdn.plyr.io/3.5.6/plyr.css" />
+        <script src="https://cdn.plyr.io/3.5.6/plyr.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
+
+        <style>
+            #wrapper {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="wrapper">
+            <video id="video"></video>
+        </div>
+
+        <script>
+            if (Hls.isSupported() && p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                var video = document.getElementById("video");
+                var player = new Plyr(video, { captions: { active: true, update: true } });
+
+                var hls = new Hls({
+                    liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                    loader: engine.createLoaderClass(),
+                });
+
+                p2pml.hlsjs.initHlsJsPlayer(hls);
+
+                hls.loadSource("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
+
+                hls.attachMedia(video);
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/videojs-contrib-hlsjs.html b/p2p-media-loader-hlsjs/demo/videojs-contrib-hlsjs.html
index a23e255d..2e241062 100644
--- a/p2p-media-loader-hlsjs/demo/videojs-contrib-hlsjs.html
+++ b/p2p-media-loader-hlsjs/demo/videojs-contrib-hlsjs.html
@@ -15,63 +15,57 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Video.js player with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <link href="https://vjs.zencdn.net/7.6.0/video-js.css" rel="stylesheet">
-    <script src="https://vjs.zencdn.net/7.6.0/video.js"></script>
-
-    <script src="https://cdn.jsdelivr.net/npm/videojs-contrib-hls.js@latest"></script>
-
-    <style>
-        #video {
-            max-width: 100%;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <video id="video" class="video-js vjs-default-skin" preload="none" autoplay controls></video>
-
-    <script>
-
-        if (p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            var player = videojs("video", {
-                html5: {
-                    hlsjsConfig: {
-                        liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                        loader: engine.createLoaderClass()
-                    }
-                }
-            });
-
-            p2pml.hlsjs.initVideoJsContribHlsJsPlayer(player);
-
-            player.src({
-                src: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
-                type: "application/x-mpegURL"
-            });
-
-            player.ready(function() {
-                player.volume(0.01); // 1%
-            });
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Video.js player with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <link href="https://vjs.zencdn.net/7.6.0/video-js.css" rel="stylesheet" />
+        <script src="https://vjs.zencdn.net/7.6.0/video.js"></script>
+
+        <script src="https://cdn.jsdelivr.net/npm/videojs-contrib-hls.js@latest"></script>
+
+        <style>
+            #video {
+                max-width: 100%;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <video id="video" class="video-js vjs-default-skin" preload="none" autoplay controls></video>
+
+        <script>
+            if (p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                var player = videojs("video", {
+                    html5: {
+                        hlsjsConfig: {
+                            liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                            loader: engine.createLoaderClass(),
+                        },
+                    },
+                });
+
+                p2pml.hlsjs.initVideoJsContribHlsJsPlayer(player);
+
+                player.src({
+                    src: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                    type: "application/x-mpegURL",
+                });
+
+                player.ready(function () {
+                    player.volume(0.01); // 1%
+                });
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/demo/videojs-hlsjs-plugin.html b/p2p-media-loader-hlsjs/demo/videojs-hlsjs-plugin.html
index 6f0a52d5..a386de49 100644
--- a/p2p-media-loader-hlsjs/demo/videojs-hlsjs-plugin.html
+++ b/p2p-media-loader-hlsjs/demo/videojs-hlsjs-plugin.html
@@ -15,59 +15,53 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Video.js player with hls.js engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-hlsjs.js"></script>
-
-    <link href="http://vjs.zencdn.net/7.6.0/video-js.css" rel="stylesheet">
-    <script src="http://vjs.zencdn.net/7.6.0/video.js"></script>
-
-    <script src="https://cdn.streamroot.io/videojs-hlsjs-plugin/1/stable/videojs-hlsjs-plugin.js"></script>
-
-    <style>
-        #video {
-            max-width: 100%;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <video id="video" class="video-js vjs-default-skin" controls autoplay muted></video>
-
-    <script>
-
-        if (p2pml.hlsjs.Engine.isSupported()) {
-            var engine = new p2pml.hlsjs.Engine();
-
-            p2pml.hlsjs.initVideoJsHlsJsPlugin();
-
-            var player = videojs("video", {
-                html5: {
-                    hlsjsConfig: {
-                        liveSyncDurationCount: 7, // To have at least 7 segments in queue
-                        loader: engine.createLoaderClass()
-                    }
-                }
-            });
-
-            player.src({
-                src: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
-                type: "application/x-mpegURL"
-            });
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Video.js player with hls.js engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-hlsjs.js"></script>
+
+        <link href="http://vjs.zencdn.net/7.6.0/video-js.css" rel="stylesheet" />
+        <script src="http://vjs.zencdn.net/7.6.0/video.js"></script>
+
+        <script src="https://cdn.streamroot.io/videojs-hlsjs-plugin/1/stable/videojs-hlsjs-plugin.js"></script>
+
+        <style>
+            #video {
+                max-width: 100%;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <video id="video" class="video-js vjs-default-skin" controls autoplay muted></video>
+
+        <script>
+            if (p2pml.hlsjs.Engine.isSupported()) {
+                var engine = new p2pml.hlsjs.Engine();
+
+                p2pml.hlsjs.initVideoJsHlsJsPlugin();
+
+                var player = videojs("video", {
+                    html5: {
+                        hlsjsConfig: {
+                            liveSyncDurationCount: 7, // To have at least 7 segments in queue
+                            loader: engine.createLoaderClass(),
+                        },
+                    },
+                });
+
+                player.src({
+                    src: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                    type: "application/x-mpegURL",
+                });
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-hlsjs/lib/declarations.d.ts b/p2p-media-loader-hlsjs/lib/declarations.d.ts
index 603edad7..52deaba2 100644
--- a/p2p-media-loader-hlsjs/lib/declarations.d.ts
+++ b/p2p-media-loader-hlsjs/lib/declarations.d.ts
@@ -17,8 +17,8 @@
 declare module "m3u8-parser" {
     export class Parser {
         constructor();
-        push (m3u8: string): void;
-        end (): void;
+        push(m3u8: string): void;
+        end(): void;
         manifest: Manifest;
     }
 
@@ -30,12 +30,12 @@ declare module "m3u8-parser" {
 
     export type Segment = {
         uri: string;
-        byteRange?: { length: number; offset: number; };
-    }
+        byteRange?: { length: number; offset: number };
+    };
 
     export type Playlist = {
         uri: string;
-    }
+    };
 }
 
 // FIXME: fixes hls.js internal .js module import
diff --git a/p2p-media-loader-hlsjs/lib/engine.ts b/p2p-media-loader-hlsjs/lib/engine.ts
index 670b2564..2fbf1828 100644
--- a/p2p-media-loader-hlsjs/lib/engine.ts
+++ b/p2p-media-loader-hlsjs/lib/engine.ts
@@ -15,17 +15,8 @@
  */
 
 import { EventEmitter } from "events";
-import {
-    Events,
-    LoaderInterface,
-    HybridLoader,
-    HybridLoaderSettings,
-} from "p2p-media-loader-core";
-import {
-    SegmentManager,
-    ByteRange,
-    SegmentManagerSettings,
-} from "./segment-manager";
+import { Events, LoaderInterface, HybridLoader, HybridLoaderSettings } from "p2p-media-loader-core";
+import { SegmentManager, ByteRange, SegmentManagerSettings } from "./segment-manager";
 import { HlsJsLoader } from "./hlsjs-loader";
 import type { LoaderCallbacks, LoaderConfiguration, LoaderContext } from "hls.js/src/types/loader";
 
@@ -46,18 +37,11 @@ export class Engine extends EventEmitter {
         super();
 
         this.loader = new HybridLoader(settings.loader);
-        this.segmentManager = new SegmentManager(
-            this.loader,
-            settings.segments
-        );
+        this.segmentManager = new SegmentManager(this.loader, settings.segments);
 
         Object.keys(Events)
             .map((eventKey) => Events[eventKey as keyof typeof Events])
-            .forEach((event) =>
-                this.loader.on(event, (...args: unknown[]) =>
-                    this.emit(event, ...args)
-                )
-            );
+            .forEach((event) => this.loader.on(event, (...args: unknown[]) => this.emit(event, ...args)));
     }
 
     public createLoaderClass(): new () => unknown {
@@ -117,12 +101,7 @@ export class Engine extends EventEmitter {
         };
     }
 
-    public setPlayingSegment(
-        url: string,
-        byteRange: ByteRange,
-        start: number,
-        duration: number
-    ): void {
+    public setPlayingSegment(url: string, byteRange: ByteRange, start: number, duration: number): void {
         this.segmentManager.setPlayingSegment(url, byteRange, start, duration);
     }
 
@@ -142,10 +121,6 @@ export interface Asset {
 
 export interface AssetsStorage {
     storeAsset(asset: Asset): Promise<void>;
-    getAsset(
-        requestUri: string,
-        requestRange: string | undefined,
-        masterSwarmId: string
-    ): Promise<Asset | undefined>;
+    getAsset(requestUri: string, requestRange: string | undefined, masterSwarmId: string): Promise<Asset | undefined>;
     destroy(): Promise<void>;
 }
diff --git a/p2p-media-loader-hlsjs/lib/hlsjs-loader.ts b/p2p-media-loader-hlsjs/lib/hlsjs-loader.ts
index 86a9580a..16595150 100644
--- a/p2p-media-loader-hlsjs/lib/hlsjs-loader.ts
+++ b/p2p-media-loader-hlsjs/lib/hlsjs-loader.ts
@@ -27,20 +27,26 @@ export class HlsJsLoader {
         this.segmentManager = segmentManager;
     }
 
-    public async load(context: LoaderContext, _config: LoaderConfiguration, callbacks: LoaderCallbacks<LoaderContext>): Promise<void> {
-        if ((context as unknown as { type: unknown }).type) {
+    public async load(
+        context: LoaderContext,
+        _config: LoaderConfiguration,
+        callbacks: LoaderCallbacks<LoaderContext>
+    ): Promise<void> {
+        if (((context as unknown) as { type: unknown }).type) {
             try {
                 const result = await this.segmentManager.loadPlaylist(context.url);
                 this.successPlaylist(result, context, callbacks);
             } catch (e) {
                 this.error(e, context, callbacks);
             }
-        } else if ((context as unknown as { frag: unknown }).frag) {
+        } else if (((context as unknown) as { frag: unknown }).frag) {
             try {
-                const result = await this.segmentManager.loadSegment(context.url,
-                    (context.rangeStart === undefined) || (context.rangeEnd === undefined)
+                const result = await this.segmentManager.loadSegment(
+                    context.url,
+                    context.rangeStart === undefined || context.rangeEnd === undefined
                         ? undefined
-                        : { offset: context.rangeStart, length: context.rangeEnd - context.rangeStart });
+                        : { offset: context.rangeStart, length: context.rangeEnd - context.rangeStart }
+                );
                 const { content } = result;
                 if (content !== undefined) {
                     setTimeout(() => this.successSegment(content, result.downloadBandwidth, context, callbacks), 0);
@@ -54,13 +60,19 @@ export class HlsJsLoader {
     }
 
     public abort(context: LoaderContext): void {
-        this.segmentManager.abortSegment(context.url,
-            (context.rangeStart === undefined) || (context.rangeEnd === undefined)
+        this.segmentManager.abortSegment(
+            context.url,
+            context.rangeStart === undefined || context.rangeEnd === undefined
                 ? undefined
-                : { offset: context.rangeStart, length: context.rangeEnd - context.rangeStart });
+                : { offset: context.rangeStart, length: context.rangeEnd - context.rangeStart }
+        );
     }
 
-    private successPlaylist(xhr: {response: string, responseURL: string}, context: LoaderContext, callbacks: LoaderCallbacks<LoaderContext>): void {
+    private successPlaylist(
+        xhr: { response: string; responseURL: string },
+        context: LoaderContext,
+        callbacks: LoaderCallbacks<LoaderContext>
+    ): void {
         const now = performance.now();
 
         const stats = {
@@ -72,15 +84,29 @@ export class HlsJsLoader {
             total: xhr.response.length,
         };
 
-        callbacks.onSuccess({
-            url: xhr.responseURL,
-            data: xhr.response
-        }, stats, context, undefined);
+        callbacks.onSuccess(
+            {
+                url: xhr.responseURL,
+                data: xhr.response,
+            },
+            stats,
+            context,
+            undefined
+        );
     }
 
-    private successSegment(content: ArrayBuffer, downloadBandwidth: number | undefined, context: LoaderContext, callbacks: LoaderCallbacks<LoaderContext>): void {
+    private successSegment(
+        content: ArrayBuffer,
+        downloadBandwidth: number | undefined,
+        context: LoaderContext,
+        callbacks: LoaderCallbacks<LoaderContext>
+    ): void {
         const now = performance.now();
-        const downloadTime = content.byteLength / (((downloadBandwidth === undefined) || (downloadBandwidth <= 0)) ? DEFAULT_DOWNLOAD_BANDWIDTH : downloadBandwidth);
+        const downloadTime =
+            content.byteLength /
+            (downloadBandwidth === undefined || downloadBandwidth <= 0
+                ? DEFAULT_DOWNLOAD_BANDWIDTH
+                : downloadBandwidth);
 
         const stats = {
             trequest: now - DEFAULT_DOWNLOAD_LATENCY - downloadTime,
@@ -88,16 +114,25 @@ export class HlsJsLoader {
             tload: now - 1,
             tparsed: now,
             loaded: content.byteLength,
-            total: content.byteLength
-        }
+            total: content.byteLength,
+        };
 
-        callbacks.onSuccess({
-            url: context.url,
-            data: content
-        }, stats, context, undefined);
+        callbacks.onSuccess(
+            {
+                url: context.url,
+                data: content,
+            },
+            stats,
+            context,
+            undefined
+        );
     }
 
-    private error(error: { code: number; text: string; }, context: LoaderContext, callbacks: LoaderCallbacks<LoaderContext>): void {
+    private error(
+        error: { code: number; text: string },
+        context: LoaderContext,
+        callbacks: LoaderCallbacks<LoaderContext>
+    ): void {
         callbacks.onError(error, context, undefined);
     }
 }
diff --git a/p2p-media-loader-hlsjs/lib/index.ts b/p2p-media-loader-hlsjs/lib/index.ts
index b7747e4f..145aee07 100644
--- a/p2p-media-loader-hlsjs/lib/index.ts
+++ b/p2p-media-loader-hlsjs/lib/index.ts
@@ -54,7 +54,12 @@ export function initFlowplayerHlsJsPlayer(player: any): void {
 export function initVideoJsContribHlsJsPlayer(player: any): void {
     player.ready(() => {
         const options = player.tech_.options_;
-        if (options && options.hlsjsConfig && options.hlsjsConfig.loader && typeof options.hlsjsConfig.loader.getEngine === "function") {
+        if (
+            options &&
+            options.hlsjsConfig &&
+            options.hlsjsConfig.loader &&
+            typeof options.hlsjsConfig.loader.getEngine === "function"
+        ) {
             initHlsJsEvents(player.tech_, options.hlsjsConfig.loader.getEngine());
         }
     });
@@ -78,11 +83,12 @@ export function initMediaElementJsPlayer(mediaElement: any): void {
         if (hls && hls.config && hls.config.loader && typeof hls.config.loader.getEngine === "function") {
             const engine: Engine = hls.config.loader.getEngine();
 
-            if (event.data && (event.data.length > 1)) {
+            if (event.data && event.data.length > 1) {
                 const frag = event.data[1].frag;
-                const byteRange = (frag.byteRange.length !== 2)
-                    ? undefined
-                    : { offset: frag.byteRange[0], length: frag.byteRange[1] - frag.byteRange[0] };
+                const byteRange =
+                    frag.byteRange.length !== 2
+                        ? undefined
+                        : { offset: frag.byteRange[0], length: frag.byteRange[1] - frag.byteRange[0] };
                 engine.setPlayingSegment(frag.url, byteRange, frag.start, frag.duration);
             }
         }
@@ -97,7 +103,7 @@ export function initMediaElementJsPlayer(mediaElement: any): void {
     mediaElement.addEventListener("hlsError", (event: any) => {
         const hls = mediaElement.hlsPlayer;
         if (hls && hls.config && hls.config.loader && typeof hls.config.loader.getEngine === "function") {
-            if ((event.data !== undefined) && (event.data.details === "bufferStalledError")) {
+            if (event.data !== undefined && event.data.details === "bufferStalledError") {
                 const engine: Engine = hls.config.loader.getEngine();
                 engine.setPlayingSegmentByCurrentTime(hls.media.currentTime);
             }
@@ -118,9 +124,10 @@ export function initJwPlayer(player: any, hlsjsConfig: any): void {
 function initHlsJsEvents(player: any, engine: Engine): void {
     player.on("hlsFragChanged", (_event: string, data: any) => {
         const frag = data.frag;
-        const byteRange = (frag.byteRange.length !== 2)
-            ? undefined
-            : { offset: frag.byteRange[0], length: frag.byteRange[1] - frag.byteRange[0] };
+        const byteRange =
+            frag.byteRange.length !== 2
+                ? undefined
+                : { offset: frag.byteRange[0], length: frag.byteRange[1] - frag.byteRange[0] };
         engine.setPlayingSegment(frag.url, byteRange, frag.start, frag.duration);
     });
     player.on("hlsDestroying", async () => {
@@ -130,8 +137,7 @@ function initHlsJsEvents(player: any, engine: Engine): void {
         if (errorData.details === "bufferStalledError") {
             const htmlMediaElement = (player.media === undefined
                 ? player.el_ // videojs-contrib-hlsjs
-                : player.media // all others
-            ) as HTMLMediaElement | undefined;
+                : player.media) as HTMLMediaElement | undefined; // all others
             if (htmlMediaElement) {
                 engine.setPlayingSegmentByCurrentTime(htmlMediaElement.currentTime);
             }
diff --git a/p2p-media-loader-hlsjs/lib/segment-manager.ts b/p2p-media-loader-hlsjs/lib/segment-manager.ts
index 731d0f9e..9ae7c217 100644
--- a/p2p-media-loader-hlsjs/lib/segment-manager.ts
+++ b/p2p-media-loader-hlsjs/lib/segment-manager.ts
@@ -24,7 +24,7 @@ const defaultSettings: SegmentManagerSettings = {
     assetsStorage: undefined,
 };
 
-export type ByteRange = { length: number, offset: number } | undefined;
+export type ByteRange = { length: number; offset: number } | undefined;
 
 export class SegmentManager {
     private readonly loader: LoaderInterface;
@@ -32,13 +32,13 @@ export class SegmentManager {
     private readonly variantPlaylists = new Map<string, Playlist>();
     private segmentRequest: SegmentRequest | null = null;
     private playQueue: {
-        segmentSequence: number,
-        segmentUrl: string,
-        segmentByteRange: ByteRange,
+        segmentSequence: number;
+        segmentUrl: string;
+        segmentByteRange: ByteRange;
         playPosition?: {
-            start: number,
-            duration: number
-        }
+            start: number;
+            duration: number;
+        };
     }[] = [];
     private readonly settings: SegmentManagerSettings;
 
@@ -66,7 +66,7 @@ export class SegmentManager {
             this.masterPlaylist = playlist;
 
             for (const [key, variantPlaylist] of this.variantPlaylists) {
-                const {streamSwarmId, found, index} = this.getStreamSwarmId(variantPlaylist.requestUrl);
+                const { streamSwarmId, found, index } = this.getStreamSwarmId(variantPlaylist.requestUrl);
                 if (!found) {
                     this.variantPlaylists.delete(key);
                 } else {
@@ -75,20 +75,21 @@ export class SegmentManager {
                 }
             }
         } else {
-            const {streamSwarmId, found, index} = this.getStreamSwarmId(requestUrl);
+            const { streamSwarmId, found, index } = this.getStreamSwarmId(requestUrl);
 
-            if (found || (this.masterPlaylist === null)) { // do not add audio and subtitles to variants
+            if (found || this.masterPlaylist === null) {
+                // do not add audio and subtitles to variants
                 playlist.streamSwarmId = streamSwarmId;
-                playlist.streamId = (this.masterPlaylist === null ? undefined : "V" + index.toString());
+                playlist.streamId = this.masterPlaylist === null ? undefined : "V" + index.toString();
                 this.variantPlaylists.set(requestUrl, playlist);
                 this.updateSegments();
             }
         }
     }
 
-    public async loadPlaylist(url: string): Promise<{response: string, responseURL: string}> {
+    public async loadPlaylist(url: string): Promise<{ response: string; responseURL: string }> {
         const assetsStorage = this.settings.assetsStorage;
-        let xhr: {response: string, responseURL: string} | undefined;
+        let xhr: { response: string; responseURL: string } | undefined;
 
         if (assetsStorage !== undefined) {
             let masterSwarmId: string | undefined;
@@ -121,7 +122,10 @@ export class SegmentManager {
         return xhr;
     }
 
-    public async loadSegment(url: string, byteRange: ByteRange): Promise<{content: ArrayBuffer | undefined, downloadBandwidth?: number}> {
+    public async loadSegment(
+        url: string,
+        byteRange: ByteRange
+    ): Promise<{ content: ArrayBuffer | undefined; downloadBandwidth?: number }> {
         const segmentLocation = this.getSegmentLocation(url, byteRange);
         const byteRangeString = byteRangeToString(byteRange);
 
@@ -138,14 +142,16 @@ export class SegmentManager {
 
                 if (masterSwarmId === undefined && this.variantPlaylists.size === 1) {
                     const result = this.variantPlaylists.values().next();
-                    if (!result.done) { // always true
+                    if (!result.done) {
+                        // always true
                         masterSwarmId = result.value.requestUrl.split("?")[0];
                     }
                 }
 
                 if (masterManifestUri === undefined && this.variantPlaylists.size === 1) {
                     const result = this.variantPlaylists.values().next();
-                    if (!result.done) { // always true
+                    if (!result.done) {
+                        // always true
                         masterManifestUri = result.value.requestUrl;
                     }
                 }
@@ -177,8 +183,9 @@ export class SegmentManager {
             return { content, downloadBandwidth: 0 };
         }
 
-        const segmentSequence = (segmentLocation.playlist.manifest.mediaSequence ? segmentLocation.playlist.manifest.mediaSequence : 0)
-            + segmentLocation.segmentIndex;
+        const segmentSequence =
+            (segmentLocation.playlist.manifest.mediaSequence ? segmentLocation.playlist.manifest.mediaSequence : 0) +
+            segmentLocation.segmentIndex;
 
         if (this.playQueue.length > 0) {
             const previousSegment = this.playQueue[this.playQueue.length - 1];
@@ -192,21 +199,30 @@ export class SegmentManager {
             this.segmentRequest.onError("Cancel segment request: simultaneous segment requests are not supported");
         }
 
-        const promise = new Promise<{content: ArrayBuffer | undefined, downloadBandwidth?: number}>((resolve, reject) => {
-            this.segmentRequest = new SegmentRequest(url, byteRange, segmentSequence, segmentLocation.playlist.requestUrl,
-                (content: ArrayBuffer | undefined, downloadBandwidth?: number) => resolve({content, downloadBandwidth}),
-                error => reject(error));
-        });
+        const promise = new Promise<{ content: ArrayBuffer | undefined; downloadBandwidth?: number }>(
+            (resolve, reject) => {
+                this.segmentRequest = new SegmentRequest(
+                    url,
+                    byteRange,
+                    segmentSequence,
+                    segmentLocation.playlist.requestUrl,
+                    (content: ArrayBuffer | undefined, downloadBandwidth?: number) =>
+                        resolve({ content, downloadBandwidth }),
+                    (error) => reject(error)
+                );
+            }
+        );
 
-        this.playQueue.push({segmentUrl: url, segmentByteRange: byteRange, segmentSequence: segmentSequence});
+        this.playQueue.push({ segmentUrl: url, segmentByteRange: byteRange, segmentSequence: segmentSequence });
         void this.loadSegments(segmentLocation.playlist, segmentLocation.segmentIndex, true);
 
         return promise;
     }
 
     public setPlayingSegment(url: string, byteRange: ByteRange, start: number, duration: number): void {
-        const urlIndex = this.playQueue.findIndex(segment =>
-                (segment.segmentUrl === url) && compareByteRanges(segment.segmentByteRange, byteRange));
+        const urlIndex = this.playQueue.findIndex(
+            (segment) => segment.segmentUrl === url && compareByteRanges(segment.segmentByteRange, byteRange)
+        );
 
         if (urlIndex >= 0) {
             this.playQueue = this.playQueue.slice(urlIndex);
@@ -233,8 +249,11 @@ export class SegmentManager {
     }
 
     public abortSegment(url: string, byteRange: ByteRange): void {
-        if (this.segmentRequest && (this.segmentRequest.segmentUrl === url) &&
-                compareByteRanges(this.segmentRequest.segmentByteRange, byteRange)) {
+        if (
+            this.segmentRequest &&
+            this.segmentRequest.segmentUrl === url &&
+            compareByteRanges(this.segmentRequest.segmentByteRange, byteRange)
+        ) {
             this.segmentRequest.onSuccess(undefined, 0);
             this.segmentRequest = null;
         }
@@ -262,38 +281,53 @@ export class SegmentManager {
             return;
         }
 
-        const segmentLocation = this.getSegmentLocation(this.segmentRequest.segmentUrl, this.segmentRequest.segmentByteRange);
+        const segmentLocation = this.getSegmentLocation(
+            this.segmentRequest.segmentUrl,
+            this.segmentRequest.segmentByteRange
+        );
         if (segmentLocation) {
             void this.loadSegments(segmentLocation.playlist, segmentLocation.segmentIndex, false);
         }
     }
 
     private onSegmentLoaded = (segment: Segment) => {
-        if (this.segmentRequest && (this.segmentRequest.segmentUrl === segment.url) &&
-                (byteRangeToString(this.segmentRequest.segmentByteRange) === segment.range)) {
+        if (
+            this.segmentRequest &&
+            this.segmentRequest.segmentUrl === segment.url &&
+            byteRangeToString(this.segmentRequest.segmentByteRange) === segment.range
+        ) {
             // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
             this.segmentRequest.onSuccess(segment.data!.slice(0), segment.downloadBandwidth);
             this.segmentRequest = null;
         }
-    }
+    };
 
     private onSegmentError = (segment: Segment, error: unknown) => {
-        if (this.segmentRequest && (this.segmentRequest.segmentUrl === segment.url) &&
-                (byteRangeToString(this.segmentRequest.segmentByteRange) === segment.range)) {
+        if (
+            this.segmentRequest &&
+            this.segmentRequest.segmentUrl === segment.url &&
+            byteRangeToString(this.segmentRequest.segmentByteRange) === segment.range
+        ) {
             this.segmentRequest.onError(error);
             this.segmentRequest = null;
         }
-    }
+    };
 
     private onSegmentAbort = (segment: Segment) => {
-        if (this.segmentRequest && (this.segmentRequest.segmentUrl === segment.url) &&
-                (byteRangeToString(this.segmentRequest.segmentByteRange) === segment.range)) {
+        if (
+            this.segmentRequest &&
+            this.segmentRequest.segmentUrl === segment.url &&
+            byteRangeToString(this.segmentRequest.segmentByteRange) === segment.range
+        ) {
             this.segmentRequest.onError("Loading aborted: internal abort");
             this.segmentRequest = null;
         }
-    }
+    };
 
-    private getSegmentLocation(url: string, byteRange: ByteRange): { playlist: Playlist, segmentIndex: number } | undefined {
+    private getSegmentLocation(
+        url: string,
+        byteRange: ByteRange
+    ): { playlist: Playlist; segmentIndex: number } | undefined {
         for (const playlist of this.variantPlaylists.values()) {
             const segmentIndex = playlist.getSegmentIndex(url, byteRange);
             if (segmentIndex >= 0) {
@@ -314,7 +348,11 @@ export class SegmentManager {
 
         const masterSwarmId = this.getMasterSwarmId();
 
-        for (let i = segmentIndex; i < playlistSegments.length && segments.length < this.settings.forwardSegmentCount; ++i) {
+        for (
+            let i = segmentIndex;
+            i < playlistSegments.length && segments.length < this.settings.forwardSegmentCount;
+            ++i
+        ) {
             const segment = playlist.manifest.segments[i];
 
             const url = playlist.getSegmentAbsoluteUrl(segment.uri);
@@ -339,7 +377,8 @@ export class SegmentManager {
 
         if (loadSegmentId) {
             const segment = await this.loader.getSegment(loadSegmentId);
-            if (segment) { // Segment already loaded by loader
+            if (segment) {
+                // Segment already loaded by loader
                 this.onSegmentLoaded(segment);
             }
         }
@@ -350,24 +389,26 @@ export class SegmentManager {
     }
 
     private getMasterSwarmId() {
-        const settingsSwarmId = (this.settings.swarmId && (this.settings.swarmId.length !== 0)) ? this.settings.swarmId : undefined;
+        const settingsSwarmId =
+            this.settings.swarmId && this.settings.swarmId.length !== 0 ? this.settings.swarmId : undefined;
         if (settingsSwarmId !== undefined) {
             return settingsSwarmId;
         }
 
-        return (this.masterPlaylist !== null)
-            ? this.masterPlaylist.requestUrl.split("?")[0]
-            : undefined;
+        return this.masterPlaylist !== null ? this.masterPlaylist.requestUrl.split("?")[0] : undefined;
     }
 
-    private getStreamSwarmId(playlistUrl: string): {streamSwarmId: string, found: boolean, index: number} {
+    private getStreamSwarmId(playlistUrl: string): { streamSwarmId: string; found: boolean; index: number } {
         const masterSwarmId = this.getMasterSwarmId();
 
         if (this.masterPlaylist && this.masterPlaylist.manifest.playlists && masterSwarmId) {
             for (let i = 0; i < this.masterPlaylist.manifest.playlists.length; ++i) {
-                const url = new URL(this.masterPlaylist.manifest.playlists[i].uri, this.masterPlaylist.responseUrl).toString();
+                const url = new URL(
+                    this.masterPlaylist.manifest.playlists[i].uri,
+                    this.masterPlaylist.responseUrl
+                ).toString();
                 if (url === playlistUrl) {
-                    return {streamSwarmId: `${masterSwarmId}+V${i}`, found: true, index: i};
+                    return { streamSwarmId: `${masterSwarmId}+V${i}`, found: true, index: i };
                 }
             }
         }
@@ -375,11 +416,15 @@ export class SegmentManager {
         return {
             streamSwarmId: masterSwarmId ?? playlistUrl.split("?")[0],
             found: false,
-            index: -1
+            index: -1,
         };
     }
 
-    private async loadContent(url: string, responseType: XMLHttpRequestResponseType, range?: string): Promise<XMLHttpRequest> {
+    private async loadContent(
+        url: string,
+        responseType: XMLHttpRequestResponseType,
+        range?: string
+    ): Promise<XMLHttpRequest> {
         return new Promise<XMLHttpRequest>((resolve, reject) => {
             const xhr = new XMLHttpRequest();
             xhr.open("GET", url, true);
@@ -419,7 +464,7 @@ class Playlist {
             const segment = this.manifest.segments[i];
             const segmentUrl = this.getSegmentAbsoluteUrl(segment.uri);
 
-            if ((url === segmentUrl) && compareByteRanges(segment.byteRange, byteRange)) {
+            if (url === segmentUrl && compareByteRanges(segment.byteRange, byteRange)) {
                 return i;
             }
         }
@@ -462,9 +507,7 @@ export interface SegmentManagerSettings {
 }
 
 function compareByteRanges(b1: ByteRange, b2: ByteRange) {
-    return (b1 === undefined)
-        ? (b2 === undefined)
-        : ((b2 !== undefined) && (b1.length === b2.length) && (b1.offset === b2.offset));
+    return b1 === undefined ? b2 === undefined : b2 !== undefined && b1.length === b2.length && b1.offset === b2.offset;
 }
 
 function byteRangeToString(byteRange: ByteRange): string | undefined {
diff --git a/p2p-media-loader-hlsjs/package-lock.json b/p2p-media-loader-hlsjs/package-lock.json
index ef8db5e8..b6445042 100644
--- a/p2p-media-loader-hlsjs/package-lock.json
+++ b/p2p-media-loader-hlsjs/package-lock.json
@@ -153,9 +153,9 @@
       "dev": true
     },
     "@types/eslint": {
-      "version": "7.2.7",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.7.tgz",
-      "integrity": "sha512-EHXbc1z2GoQRqHaAT7+grxlTJ3WE2YNeD6jlpPoRc83cCoThRY+NUWjCUZaYmk51OICkPXn2hhphcWcWXgNW0Q==",
+      "version": "7.2.8",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.8.tgz",
+      "integrity": "sha512-RTKvBsfz0T8CKOGZMfuluDNyMFHnu5lvNr4hWEsQeHXH6FcmIDIozOyWMh36nLGMwVd5UFNXC2xztA8lln22MQ==",
       "dev": true,
       "requires": {
         "@types/estree": "*",
@@ -1053,9 +1053,9 @@
       "dev": true
     },
     "caniuse-lite": {
-      "version": "1.0.30001204",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001204.tgz",
-      "integrity": "sha512-JUdjWpcxfJ9IPamy2f5JaRDCaqJOxDzOSKtbdx4rH9VivMd1vIzoPumsJa9LoMIi4Fx2BV2KZOxWhNkBjaYivQ==",
+      "version": "1.0.30001205",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001205.tgz",
+      "integrity": "sha512-TL1GrS5V6LElbitPazidkBMD9sa448bQDDLrumDqaggmKFcuU2JW1wTOHJPukAcOMtEmLcmDJEzfRrf+GjM0Og==",
       "dev": true
     },
     "chalk": {
@@ -1555,9 +1555,9 @@
       }
     },
     "electron-to-chromium": {
-      "version": "1.3.703",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.703.tgz",
-      "integrity": "sha512-SVBVhNB+4zPL+rvtWLw7PZQkw/Eqj1HQZs22xtcqW36+xoifzEOEEDEpkxSMfB6RFeSIOcG00w6z5mSqLr1Y6w==",
+      "version": "1.3.706",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.706.tgz",
+      "integrity": "sha512-IcXgNXeW6+ObrvHnQtjhokjdOPI/DQ5j0f9M6gUy82kc9GNTMxq/mTkxWlPBSpqO1mAomR1uPDsssKDMj1V4Cw==",
       "dev": true
     },
     "elliptic": {
@@ -1741,6 +1741,12 @@
         }
       }
     },
+    "eslint-config-prettier": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.1.0.tgz",
+      "integrity": "sha512-oKMhGv3ihGbCIimCAjqkdzx2Q+jthoqnXSP+d86M9tptwugycmTFdVR4IpLgq2c4SHifbwO90z2fQ8/Aio73yw==",
+      "dev": true
+    },
     "eslint-scope": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
@@ -2809,18 +2815,18 @@
       }
     },
     "mime-db": {
-      "version": "1.46.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.46.0.tgz",
-      "integrity": "sha512-svXaP8UQRZ5K7or+ZmfNhg2xX3yKDMUzqadsSqi4NCH/KomcH75MAMYAGVlvXn4+b/xOPhS3I2uHKRUzvjY7BQ==",
+      "version": "1.47.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.47.0.tgz",
+      "integrity": "sha512-QBmA/G2y+IfeS4oktet3qRZ+P5kPhCKRXxXnQEudYqUaEioAU1/Lq2us3D/t1Jfo4hE9REQPrbB7K5sOczJVIw==",
       "dev": true
     },
     "mime-types": {
-      "version": "2.1.29",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.29.tgz",
-      "integrity": "sha512-Y/jMt/S5sR9OaqteJtslsFZKWOIIqMACsJSiHghlCAyhf7jfVYjKBmLiX8OgpWeW+fjJ2b+Az69aPFPkUOY6xQ==",
+      "version": "2.1.30",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.30.tgz",
+      "integrity": "sha512-crmjA4bLtR8m9qLpHvgxSChT+XoSlZi8J4n/aIdn3z92e/U47Z0V/yl+Wh9W046GgFVAmoNR/fmdbZYcSSIUeg==",
       "dev": true,
       "requires": {
-        "mime-db": "1.46.0"
+        "mime-db": "1.47.0"
       }
     },
     "mimic-fn": {
@@ -3348,6 +3354,12 @@
       "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
       "dev": true
     },
+    "prettier": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.2.1.tgz",
+      "integrity": "sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==",
+      "dev": true
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -4080,9 +4092,9 @@
       },
       "dependencies": {
         "ajv": {
-          "version": "8.0.1",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.0.1.tgz",
-          "integrity": "sha512-46ZA4TalFcLLqX1dEU3dhdY38wAtDydJ4e7QQTVekLUTzXkb1LfqU6VOBXC/a9wiv4T094WURqJH6ZitF92Kqw==",
+          "version": "8.0.5",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.0.5.tgz",
+          "integrity": "sha512-RkiLa/AeJx7+9OvniQ/qeWu0w74A8DiPPBclQ6ji3ZQkv5KamO+QGpqmi7O4JIw3rHGUXZ6CoP9tsAkn3gyazg==",
           "dev": true,
           "requires": {
             "fast-deep-equal": "^3.1.1",
@@ -4443,9 +4455,9 @@
       }
     },
     "webpack": {
-      "version": "5.28.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.28.0.tgz",
-      "integrity": "sha512-1xllYVmA4dIvRjHzwELgW4KjIU1fW4PEuEnjsylz7k7H5HgPOctIq7W1jrt3sKH9yG5d72//XWzsHhfoWvsQVg==",
+      "version": "5.30.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.30.0.tgz",
+      "integrity": "sha512-Zr9NIri5yzpfmaMea2lSMV1UygbW0zQsSlGLMgKUm63ACXg6alhd1u4v5UBSBjzYKXJN6BNMGVM7w165e7NxYA==",
       "dev": true,
       "requires": {
         "@types/eslint-scope": "^3.7.0",
diff --git a/p2p-media-loader-hlsjs/package.json b/p2p-media-loader-hlsjs/package.json
index 1996b5ce..27c0c7c6 100644
--- a/p2p-media-loader-hlsjs/package.json
+++ b/p2p-media-loader-hlsjs/package.json
@@ -48,9 +48,11 @@
     "@typescript-eslint/parser": "^4.20.0",
     "browserify": "^17.0.0",
     "eslint": "^7.23.0",
+    "eslint-config-prettier": "^8.1.0",
     "hls.js": "^0.14.17",
     "mkdirp": "^1.0.4",
     "mocha": "^8.3.2",
+    "prettier": "^2.2.1",
     "sinon": "^10.0.0",
     "terser": "^5.6.1",
     "ts-loader": "^8.1.0",
diff --git a/p2p-media-loader-shaka/.editorconfig b/p2p-media-loader-shaka/.editorconfig
index 4b43aa8e..6c761897 100644
--- a/p2p-media-loader-shaka/.editorconfig
+++ b/p2p-media-loader-shaka/.editorconfig
@@ -7,6 +7,7 @@ end_of_line              = lf
 charset                  = utf-8
 trim_trailing_whitespace = true
 insert_final_newline     = true
+max_line_length          = 120
 [*.md]
 trim_trailing_whitespace = false
 [*.json]
diff --git a/p2p-media-loader-shaka/.eslintrc b/p2p-media-loader-shaka/.eslintrc
index b22e2242..0484f2e1 100644
--- a/p2p-media-loader-shaka/.eslintrc
+++ b/p2p-media-loader-shaka/.eslintrc
@@ -11,7 +11,8 @@
         "eslint:recommended",
         "plugin:@typescript-eslint/eslint-recommended",
         "plugin:@typescript-eslint/recommended",
-        "plugin:@typescript-eslint/recommended-requiring-type-checking"
+        "plugin:@typescript-eslint/recommended-requiring-type-checking",
+        "prettier"
     ],
     "env": {
         "browser": true
diff --git a/p2p-media-loader-shaka/demo/clappr.html b/p2p-media-loader-shaka/demo/clappr.html
index 746e8747..f58e51f0 100644
--- a/p2p-media-loader-shaka/demo/clappr.html
+++ b/p2p-media-loader-shaka/demo/clappr.html
@@ -15,55 +15,49 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Clappr player with Shaka Player engine and P2P demo (MPEG-DASH only)</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-shaka.js"></script>
-
-    <script src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
-    <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
-    <script src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
-
-    <style>
-        #video {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="video"></div>
-
-    <script>
-
-        if (p2pml.shaka.Engine.isSupported()) {
-            var engine = new p2pml.shaka.Engine();
-
-            var player = new Clappr.Player({
-                parentId: "#video",
-                source: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.mpd",
-                plugins: [DashShakaPlayback],
-                shakaOnBeforeLoad: function(shakaPlayerInstance) {
-                    engine.initShakaPlayer(shakaPlayerInstance);
-                }
-            });
-
-            player.setVolume(1); // 1%
-            player.play();
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Clappr player with Shaka Player engine and P2P demo (MPEG-DASH only)</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-shaka.js"></script>
+
+        <script src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
+        <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
+        <script src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
+
+        <style>
+            #video {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="video"></div>
+
+        <script>
+            if (p2pml.shaka.Engine.isSupported()) {
+                var engine = new p2pml.shaka.Engine();
+
+                var player = new Clappr.Player({
+                    parentId: "#video",
+                    source: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.mpd",
+                    plugins: [DashShakaPlayback],
+                    shakaOnBeforeLoad: function (shakaPlayerInstance) {
+                        engine.initShakaPlayer(shakaPlayerInstance);
+                    },
+                });
+
+                player.setVolume(1); // 1%
+                player.play();
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-shaka/demo/dplayer.html b/p2p-media-loader-shaka/demo/dplayer.html
index 64003f95..3f4d7735 100644
--- a/p2p-media-loader-shaka/demo/dplayer.html
+++ b/p2p-media-loader-shaka/demo/dplayer.html
@@ -15,66 +15,66 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>DPlayer with Shaka Player engine and P2P demo (HLS or MPEG-DASH)</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-shaka.js"></script>
-
-    <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
-
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css">
-    <script src="https://cdn.jsdelivr.net/npm/dplayer@latest"></script>
-
-    <style>
-        #dplayer {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="dplayer"></div>
-
-    <script>
-        shaka.polyfill.installAll();
-
-        if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
-            window.dp = new DPlayer({
-                container: document.getElementById("dplayer"),
-                video: {
-                    url: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.mpd",
-                    //url: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
-                    type: "customHlsOrDash",
-                    customType: {
-                        "customHlsOrDash": function (video, player) {
-                            const engine = new p2pml.shaka.Engine();
-
-                            const src = video.src; // Shaka Player changes video.src to blob URL
-                            const shakaPlayer = new shaka.Player(video);
-
-                            const onError = function(error) { console.error("Error code", error.code, "object", error); }
-                            shakaPlayer.addEventListener("error", function(event) { onError(event.detail); });
-
-                            engine.initShakaPlayer(shakaPlayer);
-
-                            shakaPlayer.load(src).catch(onError);
-                        }
-                    }
-                }
-            });
-        } else {
-            document.write("Not supported :(");
-        }
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>DPlayer with Shaka Player engine and P2P demo (HLS or MPEG-DASH)</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-shaka.js"></script>
+
+        <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/p2p-dplayer@latest/dist/DPlayer.min.css" />
+        <script src="https://cdn.jsdelivr.net/npm/dplayer@latest"></script>
+
+        <style>
+            #dplayer {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="dplayer"></div>
+
+        <script>
+            shaka.polyfill.installAll();
+
+            if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
+                window.dp = new DPlayer({
+                    container: document.getElementById("dplayer"),
+                    video: {
+                        url: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.mpd",
+                        //url: "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8",
+                        type: "customHlsOrDash",
+                        customType: {
+                            customHlsOrDash: function (video, player) {
+                                const engine = new p2pml.shaka.Engine();
+
+                                const src = video.src; // Shaka Player changes video.src to blob URL
+                                const shakaPlayer = new shaka.Player(video);
+
+                                const onError = function (error) {
+                                    console.error("Error code", error.code, "object", error);
+                                };
+                                shakaPlayer.addEventListener("error", function (event) {
+                                    onError(event.detail);
+                                });
+
+                                engine.initShakaPlayer(shakaPlayer);
+
+                                shakaPlayer.load(src).catch(onError);
+                            },
+                        },
+                    },
+                });
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-shaka/demo/offlineplayback.html b/p2p-media-loader-shaka/demo/offlineplayback.html
index 5694b3f1..917c2698 100644
--- a/p2p-media-loader-shaka/demo/offlineplayback.html
+++ b/p2p-media-loader-shaka/demo/offlineplayback.html
@@ -15,176 +15,197 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Offline playback with Shaka Player engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-shaka.js"></script>
-
-    <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
-
-</head>
-<body>
-
-    <video id="video" width="640" poster="https://shaka-player-demo.appspot.com/assets/poster.jpg" controls autoplay muted></video>
-
-    <script>
-        function initIndexedDb() {
-            return new Promise((resolve, reject) => {
-                const request = window.indexedDB.open("assets", 1);
-
-                request.onupgradeneeded = (event) => {
-                    console.info("Upgrading from", event.oldVersion, "to", event.newVersion);
-                    const db = event.target.result;
-
-                    switch (event.oldVersion) {
-                        case 0: { // create DB
-                            db.createObjectStore("assets", { keyPath: ["requestUri", "requestRange", "masterSwarmId"] });
-                            db.createObjectStore("segmentsData", { keyPath: ["id", "masterSwarmId"] });
-                            const segments = db.createObjectStore("segments", { keyPath: ["id", "masterSwarmId"] });
-                            segments.createIndex("masterSwarmId", "masterSwarmId", { multiEntry: true });
-                        } break;
-
-                        default:
-                            throw new Error("unknown database version:", event.oldVersion);
-                    }
-                };
-
-                request.onerror = (event) => reject(event);
-                request.onsuccess = (event) => resolve(event.target.result);
-            });
-        }
-
-        class IdbAssetsStorage {
-            constructor(db) {
-                this.db = db;
-            }
-
-            storeAsset(asset) {
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Offline playback with Shaka Player engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-shaka.js"></script>
+
+        <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
+    </head>
+    <body>
+        <video
+            id="video"
+            width="640"
+            poster="https://shaka-player-demo.appspot.com/assets/poster.jpg"
+            controls
+            autoplay
+            muted
+        ></video>
+
+        <script>
+            function initIndexedDb() {
                 return new Promise((resolve, reject) => {
-                    const request = this.db.transaction(["assets"], "readwrite").objectStore("assets")
-                            .put(asset.requestRange === undefined ? {...asset, requestRange: ""} : asset);
-                    request.onerror = (event) => reject(event);
-                    request.onsuccess = (event) => resolve();
-                });
-            }
+                    const request = window.indexedDB.open("assets", 1);
+
+                    request.onupgradeneeded = (event) => {
+                        console.info("Upgrading from", event.oldVersion, "to", event.newVersion);
+                        const db = event.target.result;
+
+                        switch (event.oldVersion) {
+                            case 0:
+                                {
+                                    // create DB
+                                    db.createObjectStore("assets", {
+                                        keyPath: ["requestUri", "requestRange", "masterSwarmId"],
+                                    });
+                                    db.createObjectStore("segmentsData", { keyPath: ["id", "masterSwarmId"] });
+                                    const segments = db.createObjectStore("segments", {
+                                        keyPath: ["id", "masterSwarmId"],
+                                    });
+                                    segments.createIndex("masterSwarmId", "masterSwarmId", { multiEntry: true });
+                                }
+                                break;
+
+                            default:
+                                throw new Error("unknown database version:", event.oldVersion);
+                        }
+                    };
 
-            getAsset(requestUri, requestRange, masterSwarmId) {
-                return new Promise((resolve, reject) => {
-                    const request = this.db.transaction(["assets"]).objectStore("assets")
-                            .get([requestUri, requestRange === undefined ? "" : requestRange, masterSwarmId]);
                     request.onerror = (event) => reject(event);
                     request.onsuccess = (event) => resolve(event.target.result);
                 });
             }
 
-            destroy() {
-            }
-        }
-
-        class IdbSegmentsStorage {
-            constructor(db) {
-                this.db = db;
-            }
-
-            storeSegment(segment) {
-                return new Promise((resolve, reject) => {
-                    const segmentWithoutData = {...segment};
-                    delete segmentWithoutData.data;
-
-                    const transaction = this.db.transaction(["segments", "segmentsData"], "readwrite")
-                    transaction.objectStore("segments").put(segmentWithoutData).onsuccess = () => {
-                        transaction.objectStore("segmentsData").put({
-                            id: segment.id,
-                            masterSwarmId: segment.masterSwarmId,
-                            data: segment.data
-                        });
-                    }
-
-                    transaction.onerror = (event) => reject(event);
-                    transaction.oncomplete = () => resolve();
-                });
-            }
+            class IdbAssetsStorage {
+                constructor(db) {
+                    this.db = db;
+                }
+
+                storeAsset(asset) {
+                    return new Promise((resolve, reject) => {
+                        const request = this.db
+                            .transaction(["assets"], "readwrite")
+                            .objectStore("assets")
+                            .put(asset.requestRange === undefined ? { ...asset, requestRange: "" } : asset);
+                        request.onerror = (event) => reject(event);
+                        request.onsuccess = (event) => resolve();
+                    });
+                }
+
+                getAsset(requestUri, requestRange, masterSwarmId) {
+                    return new Promise((resolve, reject) => {
+                        const request = this.db
+                            .transaction(["assets"])
+                            .objectStore("assets")
+                            .get([requestUri, requestRange === undefined ? "" : requestRange, masterSwarmId]);
+                        request.onerror = (event) => reject(event);
+                        request.onsuccess = (event) => resolve(event.target.result);
+                    });
+                }
 
-            getSegmentsMap(masterSwarmId) {
-                return new Promise((resolve, reject) => {
-                    const cursor = this.db.transaction(["segments"]).objectStore("segments").index("masterSwarmId").openCursor(IDBKeyRange.only(masterSwarmId));
-                    const result = new Map();
-
-                    cursor.onerror = (event) => reject(event);
-                    cursor.onsuccess = (event) => {
-                        const cursor = event.target.result;
-                        if (cursor) {
-                            result.set(cursor.value.id, {segment: cursor.value});
-                            cursor.continue();
-                        } else {
-                            resolve(result);
-                        }
-                    };
-                });
+                destroy() {}
             }
 
-            getSegment(id, masterSwarmId) {
-                return new Promise((resolve, reject) => {
-                    const transaction = this.db.transaction(["segments", "segmentsData"]);
-
-                    let segment;
-                    transaction.objectStore("segments").get([id, masterSwarmId]).onsuccess = (event) => {
-                        segment = event.target.result;
-                        if (segment === undefined) {
-                            return;
-                        }
+            class IdbSegmentsStorage {
+                constructor(db) {
+                    this.db = db;
+                }
+
+                storeSegment(segment) {
+                    return new Promise((resolve, reject) => {
+                        const segmentWithoutData = { ...segment };
+                        delete segmentWithoutData.data;
+
+                        const transaction = this.db.transaction(["segments", "segmentsData"], "readwrite");
+                        transaction.objectStore("segments").put(segmentWithoutData).onsuccess = () => {
+                            transaction.objectStore("segmentsData").put({
+                                id: segment.id,
+                                masterSwarmId: segment.masterSwarmId,
+                                data: segment.data,
+                            });
+                        };
 
-                        transaction.objectStore("segmentsData").get([id, masterSwarmId]).onsuccess = (event) => {
-                            segment.data = event.target.result.data;
+                        transaction.onerror = (event) => reject(event);
+                        transaction.oncomplete = () => resolve();
+                    });
+                }
+
+                getSegmentsMap(masterSwarmId) {
+                    return new Promise((resolve, reject) => {
+                        const cursor = this.db
+                            .transaction(["segments"])
+                            .objectStore("segments")
+                            .index("masterSwarmId")
+                            .openCursor(IDBKeyRange.only(masterSwarmId));
+                        const result = new Map();
+
+                        cursor.onerror = (event) => reject(event);
+                        cursor.onsuccess = (event) => {
+                            const cursor = event.target.result;
+                            if (cursor) {
+                                result.set(cursor.value.id, { segment: cursor.value });
+                                cursor.continue();
+                            } else {
+                                resolve(result);
+                            }
+                        };
+                    });
+                }
+
+                getSegment(id, masterSwarmId) {
+                    return new Promise((resolve, reject) => {
+                        const transaction = this.db.transaction(["segments", "segmentsData"]);
+
+                        let segment;
+                        transaction.objectStore("segments").get([id, masterSwarmId]).onsuccess = (event) => {
+                            segment = event.target.result;
+                            if (segment === undefined) {
+                                return;
+                            }
+
+                            transaction.objectStore("segmentsData").get([id, masterSwarmId]).onsuccess = (event) => {
+                                segment.data = event.target.result.data;
+                            };
                         };
-                    };
 
-                    transaction.onerror = (event) => reject(event);
-                    transaction.oncomplete = () => resolve(segment);
-                });
-            }
+                        transaction.onerror = (event) => reject(event);
+                        transaction.oncomplete = () => resolve(segment);
+                    });
+                }
 
-            clean() {}
-            destroy() {}
-        }
-
-        (async () => {
-            const db = await initIndexedDb();
-            const assetsStorage = new IdbAssetsStorage(db);
-            const segmentsStorage = new IdbSegmentsStorage(db);
-
-            shaka.polyfill.installAll();
-
-            if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
-                var settings = {
-                    segments: {
-                        assetsStorage: assetsStorage
-                    },
-                    loader: {
-                        segmentsStorage: segmentsStorage
-                    }
-                };
-                var engine = new p2pml.shaka.Engine(settings);
-
-                var video = document.getElementById("video");
-                var player = new shaka.Player(video);
-                var onError = function(error) { console.error("Error code", error.code, "object", error); }
-                player.addEventListener("error", function(event) { onError(event.detail); });
-
-                engine.initShakaPlayer(player);
-
-                player.configure({ abr: { enabled: false }}); // disable ABR
-                player.load("https://storage.googleapis.com/shaka-demo-assets/angel-one/dash.mpd").catch(onError);
-            } else {
-                document.write("Not supported :(");
+                clean() {}
+                destroy() {}
             }
-        })();
-    </script>
 
-</body>
+            (async () => {
+                const db = await initIndexedDb();
+                const assetsStorage = new IdbAssetsStorage(db);
+                const segmentsStorage = new IdbSegmentsStorage(db);
+
+                shaka.polyfill.installAll();
+
+                if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
+                    var settings = {
+                        segments: {
+                            assetsStorage: assetsStorage,
+                        },
+                        loader: {
+                            segmentsStorage: segmentsStorage,
+                        },
+                    };
+                    var engine = new p2pml.shaka.Engine(settings);
+
+                    var video = document.getElementById("video");
+                    var player = new shaka.Player(video);
+                    var onError = function (error) {
+                        console.error("Error code", error.code, "object", error);
+                    };
+                    player.addEventListener("error", function (event) {
+                        onError(event.detail);
+                    });
+
+                    engine.initShakaPlayer(player);
+
+                    player.configure({ abr: { enabled: false } }); // disable ABR
+                    player.load("https://storage.googleapis.com/shaka-demo-assets/angel-one/dash.mpd").catch(onError);
+                } else {
+                    document.write("Not supported :(");
+                }
+            })();
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-shaka/demo/plyr.html b/p2p-media-loader-shaka/demo/plyr.html
index 58864177..7ba8582d 100644
--- a/p2p-media-loader-shaka/demo/plyr.html
+++ b/p2p-media-loader-shaka/demo/plyr.html
@@ -15,53 +15,47 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Plyr player with Shaka Player engine and P2P demo</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-shaka.js"></script>
-
-    <link rel="stylesheet" href="https://cdn.plyr.io/3.5.6/plyr.css">
-    <script src="https://cdn.plyr.io/3.5.6/plyr.js"></script>
-    <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.5/shaka-player.compiled.js"></script>
-
-    <style>
-        #wrapper {
-            width: 720px;
-            margin-left: auto;
-            margin-right: auto;
-            display: block;
-        }
-    </style>
-
-</head>
-<body>
-
-    <div id="wrapper">
-        <video id="video" controls></video>
-    </div>
-
-    <script>
-
-        if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
-            var engine = new p2pml.shaka.Engine();
-
-            var video = document.getElementById("video");
-            var player = new Plyr(video);
-
-            shaka.polyfill.installAll();
-            var shakaPlayer = new shaka.Player(video);
-            engine.initShakaPlayer(shakaPlayer);
-            shakaPlayer.load("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Plyr player with Shaka Player engine and P2P demo</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-shaka.js"></script>
+
+        <link rel="stylesheet" href="https://cdn.plyr.io/3.5.6/plyr.css" />
+        <script src="https://cdn.plyr.io/3.5.6/plyr.js"></script>
+        <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.5/shaka-player.compiled.js"></script>
+
+        <style>
+            #wrapper {
+                width: 720px;
+                margin-left: auto;
+                margin-right: auto;
+                display: block;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="wrapper">
+            <video id="video" controls></video>
+        </div>
+
+        <script>
+            if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
+                var engine = new p2pml.shaka.Engine();
+
+                var video = document.getElementById("video");
+                var player = new Plyr(video);
+
+                shaka.polyfill.installAll();
+                var shakaPlayer = new shaka.Player(video);
+                engine.initShakaPlayer(shakaPlayer);
+                shakaPlayer.load("https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8");
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-shaka/demo/shakaplayer.html b/p2p-media-loader-shaka/demo/shakaplayer.html
index 8b8c2ed2..77ab8527 100644
--- a/p2p-media-loader-shaka/demo/shakaplayer.html
+++ b/p2p-media-loader-shaka/demo/shakaplayer.html
@@ -15,46 +15,53 @@
     limitations under the License.
 -->
 <html lang="en">
-<head>
-
-    <meta charset="UTF-8">
-
-    <title>Shaka Player with P2P demo (HLS or MPEG-DASH)</title>
-
-    <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
-    <script src="../build/p2p-media-loader-shaka.js"></script>
-
-    <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
-    <script src="https://ajax.googleapis.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
-
-</head>
-<body>
-
-    <video id="video" width="640" poster="https://shaka-player-demo.appspot.com/assets/poster.jpg" controls autoplay muted></video>
-
-    <script>
-
-        shaka.polyfill.installAll();
-
-        if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
-            var engine = new p2pml.shaka.Engine();
-
-            var video = document.getElementById("video");
-            var player = new shaka.Player(video);
-            var onError = function(error) { console.error("Error code", error.code, "object", error); }
-            player.addEventListener("error", function(event) { onError(event.detail); });
-
-            engine.initShakaPlayer(player);
-
-            player.load(
-                //"https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8"
-                "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.mpd"
-            ).catch(onError);
-        } else {
-            document.write("Not supported :(");
-        }
-
-    </script>
-
-</body>
+    <head>
+        <meta charset="UTF-8" />
+
+        <title>Shaka Player with P2P demo (HLS or MPEG-DASH)</title>
+
+        <script src="../node_modules/p2p-media-loader-core/build/p2p-media-loader-core.js"></script>
+        <script src="../build/p2p-media-loader-shaka.js"></script>
+
+        <script src="https://github.com/videojs/mux.js/releases/download/v5.1.2/mux.js"></script>
+        <script src="https://ajax.googleapis.com/ajax/libs/shaka-player/2.5.1/shaka-player.compiled.js"></script>
+    </head>
+    <body>
+        <video
+            id="video"
+            width="640"
+            poster="https://shaka-player-demo.appspot.com/assets/poster.jpg"
+            controls
+            autoplay
+            muted
+        ></video>
+
+        <script>
+            shaka.polyfill.installAll();
+
+            if (shaka.Player.isBrowserSupported() && p2pml.shaka.Engine.isSupported()) {
+                var engine = new p2pml.shaka.Engine();
+
+                var video = document.getElementById("video");
+                var player = new shaka.Player(video);
+                var onError = function (error) {
+                    console.error("Error code", error.code, "object", error);
+                };
+                player.addEventListener("error", function (event) {
+                    onError(event.detail);
+                });
+
+                engine.initShakaPlayer(player);
+
+                player
+                    .load(
+                        //"https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8"
+                        "https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.mpd"
+                    )
+                    .catch(onError);
+            } else {
+                document.write("Not supported :(");
+            }
+        </script>
+    </body>
 </html>
diff --git a/p2p-media-loader-shaka/lib/declarations.d.ts b/p2p-media-loader-shaka/lib/declarations.d.ts
index a9635c61..95caf817 100644
--- a/p2p-media-loader-shaka/lib/declarations.d.ts
+++ b/p2p-media-loader-shaka/lib/declarations.d.ts
@@ -27,14 +27,14 @@ namespace shaka {
             static install(): void;
         }
 
-        class Fullscreen extends polyfill_install { }
-        class IndexedDB extends polyfill_install { }
-        class InputEvent extends polyfill_install { }
-        class MathRound extends polyfill_install { }
-        class MediaSource extends polyfill_install { }
-        class VideoPlaybackQuality extends polyfill_install { }
-        class VideoPlayPromise extends polyfill_install { }
-        class VTTCue extends polyfill_install { }
+        class Fullscreen extends polyfill_install {}
+        class IndexedDB extends polyfill_install {}
+        class InputEvent extends polyfill_install {}
+        class MathRound extends polyfill_install {}
+        class MediaSource extends polyfill_install {}
+        class VideoPlaybackQuality extends polyfill_install {}
+        class VideoPlayPromise extends polyfill_install {}
+        class VTTCue extends polyfill_install {}
 
         class PatchedMediaKeysMs extends polyfill_install {
             static setMediaKeys(mediaKeys: MediaKeys): void;
@@ -62,27 +62,27 @@ namespace shaka {
     }
 
     interface EventMap {
-        "abrstatuschanged": Player.AbrStatusChangedEvent,
-        "adaptation": Player.AdaptationEvent,
-        "buffering": Player.BufferingEvent,
-        "drmsessionupdate": Player.DrmSessionUpdateEvent,
-        "emsg": Player.EmsgEvent,
-        "error": Player.ErrorEvent,
-        "expirationupdated": Player.ExpirationUpdatedEvent,
-        "largegap": Player.LargeGapEvent,
-        "loading": Player.LoadingEvent,
-        "manifestparsed": Player.ManifestParsedEvent,
-        "onstatechange": Player.StateChangeEvent,
-        "onstateidle": Player.StateIdleEvent,
-        "streaming": Player.StreamingEvent,
-        "textchanged": Player.TextChangedEvent,
-        "texttrackvisibility": Player.TextTrackVisibilityEvent,
-        "timelineregionadded": Player.TimelineRegionAddedEvent,
-        "timelineregionenter": Player.TimelineRegionEnterEvent,
-        "timelineregionexit": Player.TimelineRegionExitEvent,
-        "trackschanged": Player.TracksChangedEvent,
-        "unloading": Player.UnloadingEvent,
-        "variantchanged": Player.VariantChangedEvent,
+        abrstatuschanged: Player.AbrStatusChangedEvent;
+        adaptation: Player.AdaptationEvent;
+        buffering: Player.BufferingEvent;
+        drmsessionupdate: Player.DrmSessionUpdateEvent;
+        emsg: Player.EmsgEvent;
+        error: Player.ErrorEvent;
+        expirationupdated: Player.ExpirationUpdatedEvent;
+        largegap: Player.LargeGapEvent;
+        loading: Player.LoadingEvent;
+        manifestparsed: Player.ManifestParsedEvent;
+        onstatechange: Player.StateChangeEvent;
+        onstateidle: Player.StateIdleEvent;
+        streaming: Player.StreamingEvent;
+        textchanged: Player.TextChangedEvent;
+        texttrackvisibility: Player.TextTrackVisibilityEvent;
+        timelineregionadded: Player.TimelineRegionAddedEvent;
+        timelineregionenter: Player.TimelineRegionEnterEvent;
+        timelineregionexit: Player.TimelineRegionExitEvent;
+        trackschanged: Player.TracksChangedEvent;
+        unloading: Player.UnloadingEvent;
+        variantchanged: Player.VariantChangedEvent;
     }
 
     class Player extends util.FakeEventTarget implements util.IDestroyable {
@@ -139,7 +139,8 @@ namespace shaka {
         addEventListener<K extends keyof EventMap>(
             type: K,
             listener: (event: EventMap[K]) => boolean | void | undefined,
-            options?: AddEventListenerOptions): void;
+            options?: AddEventListenerOptions
+        ): void;
 
         // eslint-disable-next-line no-dupe-class-members
         addEventListener(
@@ -975,13 +976,24 @@ namespace shaka {
             destroy(): Promise<unknown>;
         }
 
-
-        declare const HttpXHRPlugin: {
-            static parse: (uri: string, request: extern.Request, requestType: net.NetworkingEngine.RequestType, progressUpdated?: shaka.extern.ProgressUpdated) => util.AbortableOperation.<shaka.extern.Response>
-        } | {
-            (uri: string, request: extern.Request, requestType: net.NetworkingEngine.RequestType, progressUpdated?: shaka.extern.ProgressUpdated): util.AbortableOperation.<shaka.extern.Response>;
-            static parse: undefined;
-        };
+        declare const HttpXHRPlugin:
+            | {
+                  static parse: (
+                      uri: string,
+                      request: extern.Request,
+                      requestType: net.NetworkingEngine.RequestType,
+                      progressUpdated?: shaka.extern.ProgressUpdated
+                  ) => util.AbortableOperation<shaka.extern.Response>;
+              }
+            | {
+                  (
+                      uri: string,
+                      request: extern.Request,
+                      requestType: net.NetworkingEngine.RequestType,
+                      progressUpdated?: shaka.extern.ProgressUpdated
+                  ): util.AbortableOperation<shaka.extern.Response>;
+                  static parse: undefined;
+              };
     }
 
     namespace media {
@@ -1244,11 +1256,7 @@ namespace shaka {
         namespace StringUtils {
             function fromBytesAutoDetect(data: BufferSource | null): string;
             function fromUTF8(data: BufferSource | null): string;
-            function fromUTF16(
-                data: BufferSource | null,
-                littleEndian?: boolean,
-                opt_noThrow?: boolean
-            ): string;
+            function fromUTF16(data: BufferSource | null, littleEndian?: boolean, opt_noThrow?: boolean): string;
             function toUTF8(str: string): ArrayBuffer;
         }
 
@@ -1257,7 +1265,6 @@ namespace shaka {
         }
 
         class FakeEventTarget {
-
             /**
              * A work-alike for EventTarget. Only DOM elements may be true
              * EventTargets, but this can be used as a base class to
@@ -1315,12 +1322,7 @@ namespace shaka {
         }
 
         class Error {
-            constructor(
-                severity: Error.Severity,
-                category: Error.Category,
-                code: Error.Code,
-                ...var_args: unknown
-            );
+            constructor(severity: Error.Severity, category: Error.Category, code: Error.Code, ...var_args: unknown);
 
             data: Array<unknown>;
             category: util.Error.Category;
@@ -1461,19 +1463,9 @@ namespace shaka {
     }
 
     namespace extern {
-        type ProgressUpdated = (
-            duration: number,
-            downloadedBytes: number,
-            remainingBytes: number
-        ) => void;
-        type RequestFilter = (
-            type: net.NetworkingEngine.RequestType,
-            request: Request
-        ) => void | Promise<unknown>;
-        type ResponseFilter = (
-            type: net.NetworkingEngine.RequestType,
-            response: Response
-        ) => void | Promise<unknown>;
+        type ProgressUpdated = (duration: number, downloadedBytes: number, remainingBytes: number) => void;
+        type RequestFilter = (type: net.NetworkingEngine.RequestType, request: Request) => void | Promise<unknown>;
+        type ResponseFilter = (type: net.NetworkingEngine.RequestType, response: Response) => void | Promise<unknown>;
         type SchemePlugin = (
             uri: string,
             request: Request,
@@ -1954,7 +1946,7 @@ namespace shaka {
             update(): void;
         }
 
-        interface TimelineRegionInfo { }
+        interface TimelineRegionInfo {}
     }
 
     namespace hls {
diff --git a/p2p-media-loader-shaka/lib/engine.ts b/p2p-media-loader-shaka/lib/engine.ts
index 1add206a..35751f34 100644
--- a/p2p-media-loader-shaka/lib/engine.ts
+++ b/p2p-media-loader-shaka/lib/engine.ts
@@ -25,7 +25,6 @@ export interface ShakaEngineSettings {
 }
 
 export class Engine extends EventEmitter {
-
     public static isSupported(): boolean {
         return HybridLoader.isSupported();
     }
@@ -40,8 +39,8 @@ export class Engine extends EventEmitter {
         this.segmentManager = new SegmentManager(this.loader, settings.segments);
 
         Object.keys(Events)
-            .map(eventKey => Events[eventKey as keyof typeof Events])
-            .forEach(event => this.loader.on(event, (...args: unknown[]) => this.emit(event, ...args)));
+            .map((eventKey) => Events[eventKey as keyof typeof Events])
+            .forEach((event) => this.loader.on(event, (...args: unknown[]) => this.emit(event, ...args)));
     }
 
     public async destroy(): Promise<void> {
@@ -54,20 +53,19 @@ export class Engine extends EventEmitter {
     } {
         return {
             segments: this.segmentManager.getSettings(),
-            loader: this.loader.getSettings()
+            loader: this.loader.getSettings(),
         };
     }
 
-    public getDetails(): { loader: unknown; } {
+    public getDetails(): { loader: unknown } {
         return {
-            loader: this.loader.getDetails()
+            loader: this.loader.getDetails(),
         };
     }
 
     public initShakaPlayer(player: shaka.Player): void {
         integration.initShakaPlayer(player, this.segmentManager);
     }
-
 }
 
 export interface Asset {
diff --git a/p2p-media-loader-shaka/lib/integration.ts b/p2p-media-loader-shaka/lib/integration.ts
index f9dd64e0..3409db9d 100644
--- a/p2p-media-loader-shaka/lib/integration.ts
+++ b/p2p-media-loader-shaka/lib/integration.ts
@@ -16,13 +16,18 @@
 
 import Debug from "debug";
 import { SegmentManager } from "./segment-manager";
-import { HookedShakaManifest, HookedShakaNetworkingEngine, ShakaDashManifestParserProxy, ShakaHlsManifestParserProxy } from "./manifest-parser-proxy";
+import {
+    HookedShakaManifest,
+    HookedShakaNetworkingEngine,
+    ShakaDashManifestParserProxy,
+    ShakaHlsManifestParserProxy,
+} from "./manifest-parser-proxy";
 import { getSchemedUri, getMasterSwarmId } from "./utils";
 import { ParserSegment } from "./parser-segment";
 
 const debug = Debug("p2pml:shaka:index");
 
-type HookedRequest = shaka.extern.Request & { p2pml?: { player: shaka.Player, segmentManager: SegmentManager } };
+type HookedRequest = shaka.extern.Request & { p2pml?: { player: shaka.Player; segmentManager: SegmentManager } };
 
 export function initShakaPlayer(player: shaka.Player, segmentManager: SegmentManager): void {
     registerParserProxies();
@@ -40,7 +45,7 @@ export function initShakaPlayer(player: shaka.Player, segmentManager: SegmentMan
 
             lastPlayheadTimeReported = 0;
 
-            const manifest = player.getManifest() as (HookedShakaManifest | null);
+            const manifest = player.getManifest() as HookedShakaManifest | null;
             if (manifest && manifest.p2pml) {
                 manifest.p2pml.parser.reset();
             }
@@ -60,9 +65,11 @@ export function initShakaPlayer(player: shaka.Player, segmentManager: SegmentMan
     });
 
     debug("register request filter");
-    player.getNetworkingEngine().registerRequestFilter((requestType: shaka.net.NetworkingEngine.RequestType, request: shaka.extern.Request) => {
-        (request as HookedRequest).p2pml = { player, segmentManager };
-    });
+    player
+        .getNetworkingEngine()
+        .registerRequestFilter((requestType: shaka.net.NetworkingEngine.RequestType, request: shaka.extern.Request) => {
+            (request as HookedRequest).p2pml = { player, segmentManager };
+        });
 }
 
 function registerParserProxies() {
@@ -80,7 +87,12 @@ function initializeNetworkingEngine() {
     shaka.net.NetworkingEngine.registerScheme("https", processNetworkRequest);
 }
 
-function processNetworkRequest(uri: string, request: HookedRequest, requestType: shaka.net.NetworkingEngine.RequestType, progressUpdated?: shaka.extern.ProgressUpdated): shaka.util.AbortableOperation<shaka.extern.Response> {
+function processNetworkRequest(
+    uri: string,
+    request: HookedRequest,
+    requestType: shaka.net.NetworkingEngine.RequestType,
+    progressUpdated?: shaka.extern.ProgressUpdated
+): shaka.util.AbortableOperation<shaka.extern.Response> {
     const xhrPlugin = shaka.net.HttpXHRPlugin.parse ? shaka.net.HttpXHRPlugin.parse : shaka.net.HttpXHRPlugin;
 
     const { p2pml } = request;
@@ -108,11 +120,16 @@ function processNetworkRequest(uri: string, request: HookedRequest, requestType:
         segment = manifest?.p2pml?.parser?.find(uri, request.headers?.Range);
     }
 
-    if (segment !== undefined && segment.streamType === "video") { // load segment using P2P loader
+    if (segment !== undefined && segment.streamType === "video") {
+        // load segment using P2P loader
         debug("request", "load", segment.identity);
 
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-        const promise = segmentManager.load(segment, getSchemedUri((player.getAssetUri ? player.getAssetUri() : player.getManifestUri())!), getPlayheadTime(player));
+        const promise = segmentManager.load(
+            segment,
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            getSchemedUri((player.getAssetUri ? player.getAssetUri() : player.getManifestUri())!),
+            getPlayheadTime(player)
+        );
 
         const abort = async () => {
             // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
@@ -121,7 +138,8 @@ function processNetworkRequest(uri: string, request: HookedRequest, requestType:
         };
 
         return new shaka.util.AbortableOperation(promise, abort);
-    } else if (assetsStorage && masterSwarmId && masterManifestUri) { // load or store the asset using assets storage
+    } else if (assetsStorage && masterSwarmId && masterManifestUri) {
+        // load or store the asset using assets storage
         const responsePromise = (async () => {
             const asset = await assetsStorage.getAsset(uri, request.headers?.Range, masterSwarmId);
             if (asset !== undefined) {
@@ -130,7 +148,7 @@ function processNetworkRequest(uri: string, request: HookedRequest, requestType:
                     uri: asset.responseUri,
                     originalUri: asset.requestUri,
                     fromCache: true,
-                    headers: {}
+                    headers: {},
                 };
             } else {
                 const response = await xhrPlugin(uri, request, requestType, progressUpdated).promise;
@@ -140,14 +158,15 @@ function processNetworkRequest(uri: string, request: HookedRequest, requestType:
                     requestUri: uri,
                     requestRange: request.headers?.Range,
                     responseUri: response.uri,
-                    data: response.data
+                    data: response.data,
                 });
                 return response;
             }
         })();
 
         return new shaka.util.AbortableOperation(responsePromise, async () => undefined);
-    } else { // load asset using default plugin
+    } else {
+        // load asset using default plugin
         return xhrPlugin(uri, request, requestType, progressUpdated);
     }
 }
diff --git a/p2p-media-loader-shaka/lib/manifest-parser-proxy.ts b/p2p-media-loader-shaka/lib/manifest-parser-proxy.ts
index ac9aae7c..6227d68e 100644
--- a/p2p-media-loader-shaka/lib/manifest-parser-proxy.ts
+++ b/p2p-media-loader-shaka/lib/manifest-parser-proxy.ts
@@ -19,13 +19,12 @@ import { ParserSegment, ParserSegmentCache } from "./parser-segment";
 export type HookedShakaStream = shaka.extern.Stream & {
     getSegmentReferenceOriginal: shaka.extern.GetSegmentReferenceFunction;
     createSegmentIndexOriginal: shaka.extern.CreateSegmentIndexFunction;
-    getPosition: () => number
+    getPosition: () => number;
 };
 export type HookedShakaManifest = shaka.extern.Manifest & { p2pml?: { parser: ShakaManifestParserProxy } };
 export type HookedShakaNetworkingEngine = shaka.net.NetworkingEngine & { p2pml?: { masterManifestUri: string } };
 
 export class ShakaManifestParserProxy implements shaka.extern.ManifestParser {
-
     private readonly cache: ParserSegmentCache = new ParserSegmentCache(200);
     private readonly originalManifestParser: shaka.extern.ManifestParser;
     private manifest?: HookedShakaManifest;
@@ -42,9 +41,14 @@ export class ShakaManifestParserProxy implements shaka.extern.ManifestParser {
         return this.originalManifestParser instanceof shaka.dash.DashParser;
     }
 
-    public async start(uri: string, playerInterface: shaka.extern.ManifestParser.PlayerInterface): Promise<shaka.extern.Manifest> {
+    public async start(
+        uri: string,
+        playerInterface: shaka.extern.ManifestParser.PlayerInterface
+    ): Promise<shaka.extern.Manifest> {
         // Tell P2P Media Loader's networking engine code about currently loading manifest
-        const networkingEngine = playerInterface.networkingEngine as shaka.net.NetworkingEngine & { p2pml?: { masterManifestUri: string } };
+        const networkingEngine = playerInterface.networkingEngine as shaka.net.NetworkingEngine & {
+            p2pml?: { masterManifestUri: string };
+        };
         networkingEngine.p2pml = { masterManifestUri: uri };
 
         this.manifest = await this.originalManifestParser.start(uri, playerInterface);
@@ -53,7 +57,7 @@ export class ShakaManifestParserProxy implements shaka.extern.ManifestParser {
             const processedStreams = [];
 
             for (const variant of period.variants) {
-                if ((variant.video !== null) && (processedStreams.indexOf(variant.video) === -1)) {
+                if (variant.video !== null && processedStreams.indexOf(variant.video) === -1) {
                     if (variant.video.getSegmentReference as shaka.extern.GetSegmentReferenceFunction | undefined) {
                         this.hookGetSegmentReference(variant.video as HookedShakaStream);
                     } else {
@@ -62,7 +66,7 @@ export class ShakaManifestParserProxy implements shaka.extern.ManifestParser {
                     processedStreams.push(variant.video);
                 }
 
-                if ((variant.audio !== null) && (processedStreams.indexOf(variant.audio) === -1)) {
+                if (variant.audio !== null && processedStreams.indexOf(variant.audio) === -1) {
                     if (variant.audio.getSegmentReference as shaka.extern.GetSegmentReferenceFunction | undefined) {
                         this.hookGetSegmentReference(variant.audio as HookedShakaStream);
                     } else {
@@ -124,7 +128,8 @@ export class ShakaManifestParserProxy implements shaka.extern.ManifestParser {
 
             // eslint-disable-next-line @typescript-eslint/unbound-method
             const getOriginal = stream.segmentIndex.get;
-            stream.getSegmentReferenceOriginal = (segmentNumber: number) => getOriginal.call(stream.segmentIndex, segmentNumber);
+            stream.getSegmentReferenceOriginal = (segmentNumber: number) =>
+                getOriginal.call(stream.segmentIndex, segmentNumber);
 
             stream.segmentIndex.get = (segmentNumber: number) => {
                 const reference = stream.getSegmentReferenceOriginal(segmentNumber);
@@ -151,7 +156,7 @@ export class ShakaManifestParserProxy implements shaka.extern.ManifestParser {
             }
         }
         return -1;
-    }
+    };
 }
 
 export class ShakaDashManifestParserProxy extends ShakaManifestParserProxy {
diff --git a/p2p-media-loader-shaka/lib/parser-segment.ts b/p2p-media-loader-shaka/lib/parser-segment.ts
index 8f050d16..f46fe33b 100644
--- a/p2p-media-loader-shaka/lib/parser-segment.ts
+++ b/p2p-media-loader-shaka/lib/parser-segment.ts
@@ -18,8 +18,10 @@ import { getSchemedUri } from "./utils";
 import { HookedShakaStream } from "./manifest-parser-proxy";
 
 export class ParserSegment {
-
-    public static create(stream: HookedShakaStream, segmentReference: shaka.media.SegmentReference | null): ParserSegment | undefined {
+    public static create(
+        stream: HookedShakaStream,
+        segmentReference: shaka.media.SegmentReference | null
+    ): ParserSegment | undefined {
         if (!segmentReference) {
             return undefined;
         }
@@ -34,21 +36,15 @@ export class ParserSegment {
 
         const startByte = segmentReference.getStartByte();
         const endByte = segmentReference.getEndByte();
-        const range = startByte || endByte
-            ? `bytes=${startByte || ""}-${endByte || ""}`
-            : undefined;
+        const range = startByte || endByte ? `bytes=${startByte || ""}-${endByte || ""}` : undefined;
 
         const streamTypeCode = stream.type.substring(0, 1).toUpperCase();
         const streamPosition = stream.getPosition();
         const streamIsHls = streamPosition >= 0;
 
-        const streamIdentity = streamIsHls
-            ? `${streamTypeCode}${streamPosition}`
-            : `${streamTypeCode}${stream.id}`;
+        const streamIdentity = streamIsHls ? `${streamTypeCode}${streamPosition}` : `${streamTypeCode}${stream.id}`;
 
-        const identity = streamIsHls
-            ? `${segmentReference.getPosition()}`
-            : `${Number(start).toFixed(3)}`;
+        const identity = streamIsHls ? `${segmentReference.getPosition()}` : `${Number(start).toFixed(3)}`;
 
         return new ParserSegment(
             stream.id,
@@ -59,9 +55,9 @@ export class ParserSegment {
             segmentReference.getPosition(),
             start,
             end,
-            getSchemedUri(uris[ 0 ]),
+            getSchemedUri(uris[0]),
             range,
-            () => ParserSegment.create(stream, stream.getSegmentReferenceOriginal(segmentReference.getPosition() - 1)),
+            () => ParserSegment.create(stream, stream.getSegmentReferenceOriginal(segmentReference.getPosition() - 1))
         );
     }
 
@@ -78,11 +74,9 @@ export class ParserSegment {
         readonly range: string | undefined,
         readonly next: () => ParserSegment | undefined
     ) {}
-
 } // end of ParserSegment
 
 export class ParserSegmentCache {
-
     private readonly segments: ParserSegment[] = [];
     private readonly maxSegments: number;
 
@@ -91,7 +85,7 @@ export class ParserSegmentCache {
     }
 
     public find(uri: string, range?: string): ParserSegment | undefined {
-        return this.segments.find(i => i.uri === uri && i.range === range);
+        return this.segments.find((i) => i.uri === uri && i.range === range);
     }
 
     public add(stream: HookedShakaStream, segmentReference: shaka.media.SegmentReference | null): void {
@@ -107,5 +101,4 @@ export class ParserSegmentCache {
     public clear(): void {
         this.segments.splice(0);
     }
-
 } // end of ParserSegmentCache
diff --git a/p2p-media-loader-shaka/lib/segment-manager.ts b/p2p-media-loader-shaka/lib/segment-manager.ts
index 25ed084a..66b6ac5b 100644
--- a/p2p-media-loader-shaka/lib/segment-manager.ts
+++ b/p2p-media-loader-shaka/lib/segment-manager.ts
@@ -28,7 +28,6 @@ const defaultSettings: SegmentManagerSettings = {
 };
 
 export class SegmentManager {
-
     private readonly debug = Debug("p2pml:shaka:sm");
     private readonly loader: LoaderInterface;
     private readonly requests = new Map<string, Request>();
@@ -71,7 +70,11 @@ export class SegmentManager {
         return this.settings;
     }
 
-    public async load(parserSegment: ParserSegment, manifestUri: string, playheadTime: number): Promise<shaka.extern.Response> {
+    public async load(
+        parserSegment: ParserSegment,
+        manifestUri: string,
+        playheadTime: number
+    ): Promise<shaka.extern.Response> {
         this.manifestUri = manifestUri;
         this.playheadTime = playheadTime;
 
@@ -101,7 +104,7 @@ export class SegmentManager {
     }
 
     private refreshLoad(): LoaderSegment {
-        const lastRequestedSegment = this.segmentHistory[ this.segmentHistory.length - 1 ];
+        const lastRequestedSegment = this.segmentHistory[this.segmentHistory.length - 1];
         const safePlayheadTime = this.playheadTime > 0.1 ? this.playheadTime : lastRequestedSegment.start;
         const sequence: ParserSegment[] = this.segmentHistory.reduce((a: ParserSegment[], i) => {
             if (i.start >= safePlayheadTime) {
@@ -117,7 +120,7 @@ export class SegmentManager {
         const lastRequestedSegmentIndex = sequence.length - 1;
 
         do {
-            const next = sequence[ sequence.length - 1 ].next();
+            const next = sequence[sequence.length - 1].next();
             if (next) {
                 sequence.push(next);
             } else {
@@ -139,7 +142,7 @@ export class SegmentManager {
         }));
 
         this.loader.load(loaderSegments, `${masterSwarmId}+${lastRequestedSegment.streamIdentity}`);
-        return loaderSegments[ lastRequestedSegmentIndex ];
+        return loaderSegments[lastRequestedSegmentIndex];
     }
 
     private pushSegmentHistory(segment: ParserSegment) {
@@ -148,7 +151,10 @@ export class SegmentManager {
             this.segmentHistory.splice(0, this.settings.maxHistorySegments * 0.2);
         }
 
-        if (this.segmentHistory.length > 0 && this.segmentHistory[ this.segmentHistory.length - 1 ].start > segment.start) {
+        if (
+            this.segmentHistory.length > 0 &&
+            this.segmentHistory[this.segmentHistory.length - 1].start > segment.start
+        ) {
             this.debug("segment history reset due to playhead seek back");
             this.segmentHistory.splice(0);
         }
@@ -159,7 +165,12 @@ export class SegmentManager {
     private reportSuccess(request: Request, loaderSegment: LoaderSegment) {
         let timeMs: number | undefined;
 
-        if (loaderSegment.downloadBandwidth !== undefined && loaderSegment.downloadBandwidth > 0 && loaderSegment.data && loaderSegment.data.byteLength > 0) {
+        if (
+            loaderSegment.downloadBandwidth !== undefined &&
+            loaderSegment.downloadBandwidth > 0 &&
+            loaderSegment.data &&
+            loaderSegment.data.byteLength > 0
+        ) {
             timeMs = Math.trunc(loaderSegment.data.byteLength / loaderSegment.downloadBandwidth);
         }
 
@@ -190,7 +201,7 @@ export class SegmentManager {
             this.debug("request delete", segment.id);
             this.requests.delete(segment.id);
         }
-    }
+    };
 
     private onSegmentError = (segment: LoaderSegment, error: unknown) => {
         if (this.requests.has(segment.id)) {
@@ -199,7 +210,7 @@ export class SegmentManager {
             this.debug("request delete from error", segment.id);
             this.requests.delete(segment.id);
         }
-    }
+    };
 
     private onSegmentAbort = (segment: LoaderSegment) => {
         if (this.requests.has(segment.id)) {
@@ -208,8 +219,7 @@ export class SegmentManager {
             this.debug("request delete from abort", segment.id);
             this.requests.delete(segment.id);
         }
-    }
-
+    };
 }
 
 class Request {
diff --git a/p2p-media-loader-shaka/lib/utils.ts b/p2p-media-loader-shaka/lib/utils.ts
index a8394a7a..e90cff2f 100644
--- a/p2p-media-loader-shaka/lib/utils.ts
+++ b/p2p-media-loader-shaka/lib/utils.ts
@@ -18,7 +18,6 @@ export function getSchemedUri(uri: string): string {
     return uri.startsWith("//") ? window.location.protocol + uri : uri;
 }
 
-export function getMasterSwarmId(masterManifestUri: string, settings: {swarmId?: string}) : string {
-    return (settings.swarmId && (settings.swarmId.length !== 0)) ?
-                settings.swarmId : masterManifestUri.split("?")[0];
+export function getMasterSwarmId(masterManifestUri: string, settings: { swarmId?: string }): string {
+    return settings.swarmId && settings.swarmId.length !== 0 ? settings.swarmId : masterManifestUri.split("?")[0];
 }
diff --git a/p2p-media-loader-shaka/package-lock.json b/p2p-media-loader-shaka/package-lock.json
index 30eb32c2..83ef9b29 100644
--- a/p2p-media-loader-shaka/package-lock.json
+++ b/p2p-media-loader-shaka/package-lock.json
@@ -116,9 +116,9 @@
       "dev": true
     },
     "@types/eslint": {
-      "version": "7.2.7",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.7.tgz",
-      "integrity": "sha512-EHXbc1z2GoQRqHaAT7+grxlTJ3WE2YNeD6jlpPoRc83cCoThRY+NUWjCUZaYmk51OICkPXn2hhphcWcWXgNW0Q==",
+      "version": "7.2.8",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.8.tgz",
+      "integrity": "sha512-RTKvBsfz0T8CKOGZMfuluDNyMFHnu5lvNr4hWEsQeHXH6FcmIDIozOyWMh36nLGMwVd5UFNXC2xztA8lln22MQ==",
       "dev": true,
       "requires": {
         "@types/estree": "*",
@@ -945,9 +945,9 @@
       "dev": true
     },
     "caniuse-lite": {
-      "version": "1.0.30001204",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001204.tgz",
-      "integrity": "sha512-JUdjWpcxfJ9IPamy2f5JaRDCaqJOxDzOSKtbdx4rH9VivMd1vIzoPumsJa9LoMIi4Fx2BV2KZOxWhNkBjaYivQ==",
+      "version": "1.0.30001205",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001205.tgz",
+      "integrity": "sha512-TL1GrS5V6LElbitPazidkBMD9sa448bQDDLrumDqaggmKFcuU2JW1wTOHJPukAcOMtEmLcmDJEzfRrf+GjM0Og==",
       "dev": true
     },
     "chalk": {
@@ -1397,9 +1397,9 @@
       }
     },
     "electron-to-chromium": {
-      "version": "1.3.703",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.703.tgz",
-      "integrity": "sha512-SVBVhNB+4zPL+rvtWLw7PZQkw/Eqj1HQZs22xtcqW36+xoifzEOEEDEpkxSMfB6RFeSIOcG00w6z5mSqLr1Y6w==",
+      "version": "1.3.706",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.706.tgz",
+      "integrity": "sha512-IcXgNXeW6+ObrvHnQtjhokjdOPI/DQ5j0f9M6gUy82kc9GNTMxq/mTkxWlPBSpqO1mAomR1uPDsssKDMj1V4Cw==",
       "dev": true
     },
     "elliptic": {
@@ -1583,6 +1583,12 @@
         }
       }
     },
+    "eslint-config-prettier": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.1.0.tgz",
+      "integrity": "sha512-oKMhGv3ihGbCIimCAjqkdzx2Q+jthoqnXSP+d86M9tptwugycmTFdVR4IpLgq2c4SHifbwO90z2fQ8/Aio73yw==",
+      "dev": true
+    },
     "eslint-scope": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
@@ -2543,18 +2549,18 @@
       }
     },
     "mime-db": {
-      "version": "1.46.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.46.0.tgz",
-      "integrity": "sha512-svXaP8UQRZ5K7or+ZmfNhg2xX3yKDMUzqadsSqi4NCH/KomcH75MAMYAGVlvXn4+b/xOPhS3I2uHKRUzvjY7BQ==",
+      "version": "1.47.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.47.0.tgz",
+      "integrity": "sha512-QBmA/G2y+IfeS4oktet3qRZ+P5kPhCKRXxXnQEudYqUaEioAU1/Lq2us3D/t1Jfo4hE9REQPrbB7K5sOczJVIw==",
       "dev": true
     },
     "mime-types": {
-      "version": "2.1.29",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.29.tgz",
-      "integrity": "sha512-Y/jMt/S5sR9OaqteJtslsFZKWOIIqMACsJSiHghlCAyhf7jfVYjKBmLiX8OgpWeW+fjJ2b+Az69aPFPkUOY6xQ==",
+      "version": "2.1.30",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.30.tgz",
+      "integrity": "sha512-crmjA4bLtR8m9qLpHvgxSChT+XoSlZi8J4n/aIdn3z92e/U47Z0V/yl+Wh9W046GgFVAmoNR/fmdbZYcSSIUeg==",
       "dev": true,
       "requires": {
-        "mime-db": "1.46.0"
+        "mime-db": "1.47.0"
       }
     },
     "mimic-fn": {
@@ -2927,6 +2933,12 @@
       "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
       "dev": true
     },
+    "prettier": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.2.1.tgz",
+      "integrity": "sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==",
+      "dev": true
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -3603,9 +3615,9 @@
       },
       "dependencies": {
         "ajv": {
-          "version": "8.0.1",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.0.1.tgz",
-          "integrity": "sha512-46ZA4TalFcLLqX1dEU3dhdY38wAtDydJ4e7QQTVekLUTzXkb1LfqU6VOBXC/a9wiv4T094WURqJH6ZitF92Kqw==",
+          "version": "8.0.5",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.0.5.tgz",
+          "integrity": "sha512-RkiLa/AeJx7+9OvniQ/qeWu0w74A8DiPPBclQ6ji3ZQkv5KamO+QGpqmi7O4JIw3rHGUXZ6CoP9tsAkn3gyazg==",
           "dev": true,
           "requires": {
             "fast-deep-equal": "^3.1.1",
@@ -3924,9 +3936,9 @@
       }
     },
     "webpack": {
-      "version": "5.28.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.28.0.tgz",
-      "integrity": "sha512-1xllYVmA4dIvRjHzwELgW4KjIU1fW4PEuEnjsylz7k7H5HgPOctIq7W1jrt3sKH9yG5d72//XWzsHhfoWvsQVg==",
+      "version": "5.30.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.30.0.tgz",
+      "integrity": "sha512-Zr9NIri5yzpfmaMea2lSMV1UygbW0zQsSlGLMgKUm63ACXg6alhd1u4v5UBSBjzYKXJN6BNMGVM7w165e7NxYA==",
       "dev": true,
       "requires": {
         "@types/eslint-scope": "^3.7.0",
diff --git a/p2p-media-loader-shaka/package.json b/p2p-media-loader-shaka/package.json
index 788634a2..6b15ea3c 100644
--- a/p2p-media-loader-shaka/package.json
+++ b/p2p-media-loader-shaka/package.json
@@ -46,7 +46,9 @@
     "@typescript-eslint/parser": "^4.20.0",
     "browserify": "^17.0.0",
     "eslint": "^7.23.0",
+    "eslint-config-prettier": "^8.1.0",
     "mkdirp": "^1.0.4",
+    "prettier": "^2.2.1",
     "terser": "^5.6.1",
     "ts-loader": "^8.1.0",
     "typescript": "^4.2.3",