Estoy construyendo una extensión de Chrome. El objetivo es ordenar todas las pestañas abiertas de youtube por duración del video (menor a mayor).
Encontré este código de este proyecto de GitHub , explicado en este tutorial :
popup.js
function byAlphabeticalURLOrder(tab1, tab2) { if (tab1.url < tab2.url) { return -1; } else if (tab1.url > tab2.url) { return 1; } return 0; } chrome.tabs.query({windowId: chrome.windows.WINDOW_ID_CURRENT}, (tabs) => { tabs.sort(byAlphabeticalURLOrder); for (let i = 0; i < tabs.length; i++) { chrome.tabs.move(tabs[i].id, {index: i}); } });Este código funciona perfectamente con la clasificación por orden alfabético. Sin embargo, quiero ajustarlo para ordenar por duración del video.
Así que escribí este archivo para obtener la duración del video de todas las pestañas abiertas, pero aún no puedo llegar a la parte de "ordenar o mover pestañas".
popup.js
chrome.tabs.query({ windowId: chrome.windows.WINDOW_ID_CURRENT }, (tabs) => { chrome.tabs.query({}, function (tabs) { for (var i = 0; i < tabs.length; i++) { chrome.tabs.executeScript(tabs[i].id, { code: '(' + function () { return { seconds: document.querySelector("video").duration }; } + ')()' }, function (result) { document.write(result[0].seconds + '<br>'); }); } }); }); Salida (Duración del video en segundos) - (Aparece en popup.html ):
1229.041 187.501 510.581 609.941 1473.821 955.481 5464.281 59.201 1787.701 1523.941No está claro lo que ha intentado, pero puede agregar esos valores a los objetos en la matriz en su ciclo existente y luego ordenar esa matriz en un segundo ciclo. Debido a que executeScript es asíncrono, debe esperar a que finalice el primer ciclo, lo que significa resolver una lista de promesas, luego ordenar la lista según la duración del video y luego mover las pestañas.
Esto es lo que se me ocurrió para MV3. Probablemente haya formas más limpias de hacer esto (soy bastante nuevo en esto):
* Ediciones: ediciones menores para limpiar la organización del código. Función adjunta a la acción (es decir, se ejecuta al hacer clic en el botón del icono de extensión de Chrome).
emergente.js
chrome.action.onClicked.addListener(sortTabsbyDuration); async function sortTabsbyDuration() { async function createListEntry(tabId, i) { return new Promise((resolve) => { if (/\.youtube\.com\/watch\?/.test(tabs[i].url)) { chrome.scripting.executeScript( { target: { tabId: tabId }, func: getYouTubeLength, args: [tabId] }, (returnValue) => { resolve(returnValue[0].result); } ); } else { resolve({ tabId: tabId, vidLength: 9999999999, }); } }); } function getYouTubeLength(aTab) { let vidLength = document.querySelector("video").duration; if (!vidLength) { vidLength=1; } return { tabId: aTab, vidLength: vidLength, }; } // MAIN: const tabs = await chrome.tabs.query({ currentWindow: true }); let promiseList = []; for (var index = 0; index < tabs.length; index++) { promiseList.push(createListEntry(tabs[index].id, index)); } const promisesFinished = Promise.all(promiseList); const sortedList = (await promisesFinished).sort((a, b) => { return a.vidLength - b.vidLength; }); console.log(sortedList); for (let index = 0; index < sortedList.length; index++) { await chrome.tabs.move(sortedList[index].tabId, { index: index }); } }manifiesto.json
{ "manifest_version": 3, "name": "Sort Your Tubes", "version": "0.0.0.2", "action": { "default_title": "Click to sort YouTube videos by video length." }, "background": { "service_worker": "popup.js" }, "permissions": [ "tabs", "scripting" ], "host_permissions": [ "*://www.youtube.com/*" ] }