el.CPU.prevFocus() implementation and mutualise with nextFocus()

Keys ↑ and ↓ mapped onto chapters, then on playlist #108
dascritch · Apr 2, 2021 · bf4c359 · bf4c359
1 parent 69aa796
commit bf4c359
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 56 deletions.
diff --git a/src/element_cpu.js b/src/element_cpu.js
@@ -1482,69 +1482,72 @@ export class CPU_element_api {
 		return target.id ?? target?.closest('[id]')?.id;
 	}
 
-	/// TODO TDD
+	/**
+	 * @summary browse yo with focus in panels using ↑ key
+	 * @private
+	 */
 	prevFocus() {
-/*
-		// if nowhere, , previous point from current cue
-		// back in the same plane.
-		// if at start, last point from previous plane
-		// if at top, do nothing
-		let container = findContainer(event.target);
-		console.log('prevcue' , container.focusedId())
-		let [planeName, pointName] = planeAndPointNamesFromId( container.focusedId() );
-		if (!planeName) {
-			if (!container.planePoints('_chapters')) {
-				return ;
-			}
-			planeName = '_chapters';
-			[,pointName] = planeAndPointNamesFromId(body_className_playing_cue);
-		}
-		let points = container.planePoints(planeName);
-		if (!points) {
-			return; /// TODO
-		}
-		container.focusPoint(planeName, adjacentKey( points , pointName, -1) );
-*/
+		relativeFocus(this, false);
 	}
 
-	/// TODO  TDD
+	/**
+	 * @summary browse down with focus in panels using ↓ key
+	 * @private
+	 */
 	nextFocus() {
-		const planeNames = this.planeNames();
-		if (planeNames.length == 0) {
-			// no planes no gain, as we say in airports
-			return;
-		}
+		relativeFocus(this, true);
+	}
 
-		const scanToNextPlane = (fromPlane) => {
-			for(let id = planeNames.indexOf(fromPlane) +1; id < planeNames.length ; id++) {
-				let out = planeNames[id];
-				let {track, panel, points} = this.plane(out);
-				if (((track !== false) || (panel !== false)) && (points) && (Object.keys(points).length > 0)) {
-					return out;
-				}
-			}
-		};
+}
+
+function relativeFocus(self, go_foward) {
+	const planeNames = self.planeNames();
+	if (planeNames.length == 0) {
+		return;
+	}
 
-		let previous_pointName, planeName, pointName, planePointNames;
-		let wasFocused = this.focused();
-		if (wasFocused) {
-			if (!wasFocused.id) {
-				wasFocused = wasFocused.closest('[id]');
+	const validPlane = (data) => {
+		let {track, panel, points} = self.plane(data);
+		return (((track !== false) || (panel !== false)) && (points) && (Object.keys(points).length > 0));
+	};
+
+	const scanToPrevPlane = (fromPlane) => {
+		for(let id = planeNames.indexOf(fromPlane) -1; id > 0 ; id--) {
+			let out = planeNames[id];
+			if (validPlane(out)) {
+				return out;
 			}
-			[planeName,previous_pointName] = planeAndPointNamesFromId(wasFocused.id);
-		}
-		if (previous_pointName) {
-			planePointNames = this.planePointNames(planeName);
-			pointName = adjacentArrayValue(planePointNames, previous_pointName, 1);
 		}
-		if (!pointName) {
-			planeName = scanToNextPlane(planeName);
-			if (!planeName) {
-				return;
+	};
+	const scanToNextPlane = (fromPlane) => {
+		for(let id = planeNames.indexOf(fromPlane) +1; id < planeNames.length ; id++) {
+			let out = planeNames[id];
+			if (validPlane(out)) {
+				return out;
 			}
-			pointName = this.planePointNames(planeName)[0];
 		}
-		this.focusPoint(planeName, pointName);
-	}
+	};
 
+	let previous_pointName, planeName, pointName, planePointNames;
+	let wasFocused = self.focused();
+	if (wasFocused) {
+		if (!wasFocused.id) {
+			wasFocused = wasFocused.closest('[id]');
+		}
+		[planeName,previous_pointName] = planeAndPointNamesFromId(wasFocused.id);
+	}
+	if (previous_pointName) {
+		planePointNames = self.planePointNames(planeName);
+		pointName = adjacentArrayValue(planePointNames, previous_pointName, go_foward?1:-1);
+	}
+	if (!pointName) {
+		planeName = go_foward ? scanToNextPlane(planeName) : scanToPrevPlane(planeName);
+		if (!planeName) {
+			return;
+		}
+		let points = self.planePointNames(planeName);
+		pointName = points[go_foward ? 0 : (points.length-1)];
+	}
+	self.focusPoint(planeName, pointName);
 }
+
diff --git a/src/trigger.js b/src/trigger.js
@@ -2,7 +2,7 @@ import {oncePassiveEvent, adjacentArrayValue, findContainer, warn} from './utils
 import {isAudiotagStreamed} from './media_element_extension.js';
 import {timeInSeconds} from './convert.js';
 import {buildPlaylist} from './build_playlist.js';
-import {planeAndPointNamesFromId} from './element_cpu.js'
+import {planeAndPointNamesFromId} from './element_cpu.js';
 
 const KEY_LEFT_ARROW = 37;
 const KEY_RIGHT_ARROW = 39;

diff --git a/tests/tests-interface.js b/tests/tests-interface.js
@@ -767,7 +767,7 @@ document.querySelector('#get_focus').addEventListener('click', function() {
 		assert.ok(!componenttag.shadowRoot.querySelector('style#style_injection'), 'removeCss destroyed <style>');
 	});
 
-	QUnit.test( "element.CPU.nextFocus()", function( assert ) {
+	QUnit.test( "element.CPU.prevFocus() and element.CPU.nextFocus()", function( assert ) {
 		const points = {
 			a : { text : 'a' },
 			b : { text : 'b' }
@@ -786,6 +786,8 @@ document.querySelector('#get_focus').addEventListener('click', function() {
 		componenttag.CPU.bulkPoints('plane4', points);
 		componenttag.CPU.addPlane('plane5', {track:true, panel:false});
 		componenttag.CPU.bulkPoints('plane5', points);
+		componenttag.CPU.prevFocus();
+		assert.equal(componenttag.CPU.focusedId(), 'control', 'prevFocus() out of planes doesnt move');
 		componenttag.CPU.nextFocus();
 		assert.equal(componenttag.CPU.focused().closest('[id]').id, 'panel_«plane1»_point_«a»', 'nextFocus() with no plane yet focused take the first point of the first listed plane');
 		componenttag.CPU.nextFocus();
@@ -798,6 +800,17 @@ document.querySelector('#get_focus').addEventListener('click', function() {
 		componenttag.CPU.nextFocus();
 		componenttag.CPU.nextFocus();
 		assert.equal(componenttag.CPU.focused().closest('[id]').id, 'track_«plane5»_point_«b»', 'nextFocus() at the end of panels stays on last focused point');
+		componenttag.CPU.prevFocus();
+		assert.equal(componenttag.CPU.focused().closest('[id]').id, 'track_«plane5»_point_«a»', 'prevFocus() at the end of panels goes back from one point');
+		componenttag.CPU.focusPoint('plane3','a');
+		componenttag.CPU.prevFocus();
+		assert.equal(componenttag.CPU.focused().closest('[id]').id, 'panel_«plane2»_point_«b»', 'prevFocus() at the begining of a panel goes back at the end of previous panel');
+		componenttag.CPU.focusPoint('plane5','a');
+		componenttag.CPU.prevFocus();
+		assert.equal(componenttag.CPU.focused().closest('[id]').id, 'panel_«plane2»_point_«b»', 'prevFocus() at the begining of a panel goes back at the end of the previous panel with points and with or a track or a panel');
+		componenttag.CPU.focusPoint('plane1','a');
+		componenttag.CPU.prevFocus();
+		assert.equal(componenttag.CPU.focused().closest('[id]').id, 'panel_«plane1»_point_«a»', 'prevFocus() at the begining of the first panel does nothing');
 
 		componenttag.CPU.removePlane('plane1');
 		componenttag.CPU.removePlane('plane2');