diff options
author | Luciano Iam <lucianito@gmail.com> | 2020-04-11 17:31:34 +0200 |
---|---|---|
committer | Robin Gareus <robin@gareus.org> | 2020-04-11 22:30:41 +0200 |
commit | 40a03e4cf5ab30a3c50d68ffa50542963c4faeb1 (patch) | |
tree | c80c8299b66bf4c96de21a60d926ce6760f47c62 /share | |
parent | 01e25a3199fa71e26a14671e329e5d565d0f1864 (diff) |
WebSockets: update index page to use JS client lib, cleanup code
Diffstat (limited to 'share')
-rw-r--r-- | share/web_surfaces/index.html | 3 | ||||
-rw-r--r-- | share/web_surfaces/index/main.js | 63 |
2 files changed, 25 insertions, 41 deletions
diff --git a/share/web_surfaces/index.html b/share/web_surfaces/index.html index a01a46d417..2f32d9e64c 100644 --- a/share/web_surfaces/index.html +++ b/share/web_surfaces/index.html @@ -32,7 +32,6 @@ </div> </div> </div> - <script src="shared/ardour.js"></script> - <script src="index/main.js"></script> + <script type="module" src="index/main.js"></script> </body> </html> diff --git a/share/web_surfaces/index/main.js b/share/web_surfaces/index/main.js index 6c648653cb..2402074e82 100644 --- a/share/web_surfaces/index/main.js +++ b/share/web_surfaces/index/main.js @@ -16,48 +16,45 @@ * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA. */ -(() => { +import { Ardour } from '../shared/ardour.js'; - const INDEX_RESOURCE = 'index.json'; +(() => { - async function fetchIndex (url) { - const response = await fetch(url); - - if (response.status == 200) { - return await response.json(); - } else { - throw new Error(`HTTP response status ${response.status}`); + async function main () { + try { + const index = await new Ardour().getAvailableSurfaces(); + printIndex(index); + } catch (err) { + printError(`Error loading index: ${err.message}`); } - } - function buildItem (groupPath, surface) { - const li = document.createElement('li'); - li.innerHTML = `<li> - <a href="${groupPath}/${surface.path}/">${surface.name}</a> - <p>${surface.description}</p> - </li>`; - return li; + document.getElementById('loading').style.display = 'none'; } function printIndex (index) { - for (let group of index) { - const path = group['path']; - const span = document.querySelector(`#${path} span`); - span.innerHTML = group['diskPath']; - - let surfaces = group.surfaces; + for (const group of index) { + const surfaces = group.surfaces; + const groupPath = group['path']; + const groupPathSpan = document.querySelector(`#${groupPath} span`); + + groupPathSpan.innerHTML = group['diskPath']; if (surfaces.length > 0) { - const ul = document.querySelector(`#${path} > ul`); + const ul = document.querySelector(`#${groupPath} > ul`); surfaces.sort((a, b) => a.name.localeCompare(b.name)); - for (surface of surfaces) { - ul.appendChild(buildItem(path, surface)); + for (const surface of surfaces) { + const li = document.createElement('li'); + li.innerHTML = `<li> + <a href="${groupPath}/${surface.path}/">${surface.name}</a> + <p>${surface.description}</p> + </li>`; + ul.appendChild(li); } } else { const p = document.createElement('p'); p.innerHTML = '<p>No surfaces found</p>'; - document.getElementById(path).appendChild(p); + document.getElementById(groupPath).appendChild(p); } } @@ -70,18 +67,6 @@ error.style.display = 'inline'; } - async function main () { - try { - const indexUrl = `${location.protocol}//${location.host}/${INDEX_RESOURCE}`; - const index = await fetchIndex (indexUrl); - printIndex(index); - } catch (err) { - printError(`Error loading ${INDEX_RESOURCE}: ${err.message}`); - } - - document.getElementById('loading').style.display = 'none'; - } - main(); })(); |