Elk idee. Elk scherm.

Eén platform, drie delen.

mHub is niet één app. Het zijn drie delen die in elkaar passen, en elk daarvan is open. Twee zijn fundamenten: een contentformaat en een browser-API. Het derde zijn de apps, en elke app staat op één fundament of op allebei.

Onze favorieten. Allemaal live.

Vuma staat op beide fundamenten; de apps ernaast laten zien hoe ver één fundament alleen je brengt. Vijf apps, vijf verschillende ideeën, en elk ervan is een plek om mee te beginnen.

Vuma

Geef Vuma add-ons en het maakt er één scherm van om door te bladeren: elke catalogus die je add-ons aanbieden, zoeken in al die catalogi tegelijk, een bibliotheek, een speler die verdergaat waar je gebleven was. Het is één web-app die op telefoons, tv's en desktops draait en zelf aanraking, afstandsbediening en muis afhandelt.

Het staat op beide fundamenten: add-ons leveren de content, en in een mHub-browser voegt de Browser API de krachten toe die een gewone pagina nooit heeft. Je kunt het zelfs op een eigen pagina plaatsen, met jouw add-ons en jouw naam erop: één HTML-bestand.

Vuma openen · Maak het van jou

Waves

Radiozenders, podcasts en gratis luisterboeken als één app. Waves is één HTML-bestand bovenop dezelfde Vuma-build: vijf audio-add-ons, een blauwgroen accent en addonManager: "fixed", dus de bronnen liggen vast en de gebruiker zet ze alleen aan en uit. Bekijk de broncode: de pagina is de hele tutorial.

Live openen

Junior

Kinder-tv. Eén add-on, vrolijke kleuren, Duits vanaf het eerste scherm (locale: "de") en addonManager: "hidden": vanaf de bank valt er niets te verknoeien. Ook één HTML-bestand bovenop de Vuma-build.

Live openen

Mediathek

De add-on is de data; wat iemand erbovenop bouwt, is de app. Mediathek is één HTML-bestand direct op de ard-mediathek-add-on, zonder Vuma eronder: rijen, zoeken, series met hun afleveringen, ondertitels en een speler die onthoudt waar je gestopt bent. De add-on haalt de data op, de pagina zorgt voor het uiterlijk.

Live openen · Broncode op GitHub

Glance

Het andere fundament op zichzelf: Glance gebruikt helemaal geen add-ons. Eén HTML-bestand op de Browser API dat live weer, koppen, marktprijzen en de status van je eigen servers op één rustig scherm zet. In een gewone browser valt het netjes terug; in een mHub-app komt elke tegel tot leven.

Live openen · Broncode op GitHub

Eén idee, één map, elk scherm.

Alles met een lijst kan een add-on zijn, en alles wat een browser weigert te doen, kan een site in mHub zijn. Dit zijn ideeën die we graag gemaakt zien worden, en elk ervan is maar één prompt verwijderd: kies er een, en het komt terecht in de AI-prompt verderop.

Heb je er zelf een gemaakt? Publiceer hem op mhub.mx: we beoordelen hem, hosten hem onder jouw naam en zetten hem in de community-repository.

Je eigen app is één HTML-bestand.

Waves en Junior zijn precies dit: laad de Vuma-build, geef hem een element, roep mount aan. Dit bestand is op elke statische host een complete app met jouw add-ons, jouw naam en jouw kleuren, en het volgt de Vuma-releases vanzelf. Geen buildstap, geen servercode, geen account.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport"
  content="width=device-width, initial-scale=1.0, viewport-fit=cover, user-scalable=no">
<title>My App</title>
<link rel="stylesheet" href="https://vuma.mx/latest/style.css">
</head>
<body>
<div id="app"></div>
<script type="module">
  import { mount } from "https://vuma.mx/latest/app.js";
  mount({
    addons: [
      "https://www.mhub.mx/radio-and-podcasts",
      "https://www.mhub.mx/public-domain",
    ],
    brand: { name: "My App", colors: { accent: "#00AAFF" } },
  });
</script>
</body>
</html>

Een add-on is zijn manifest-URL. De add-ons die hier gehost worden, staan in de add-on-index, en een AI kan een nieuwe voor je bouwen.

Elke mount-optie, en waar de bestanden vandaan komen, staat beschreven in de app zelf: Zo maak je je eigen app. Die uitleg zit in de build, dus hij beschrijft de versie die je gaat laden en niet de versie waarvoor deze pagina geschreven is.

Een add-on is een map met JSON-bestanden.

Een add-on is een bron van content: films, radiozenders, podcasts, recepten, cursussen. Zet de map ergens op het web, voeg het adres toe in een app, en alles erin verschijnt daar, klaar om door te bladeren. Versie 2 van het protocol heeft geen server nodig: elk endpoint kan een statisch bestand op een willekeurig CDN zijn. Elke bestaande v1-add-on blijft werken; de apps vertalen tussen de twee, en v1 blijft ondersteund.

/mhub-addon.json
/catalog/{type}/{catalogId}.json
/item/{type}/{id}.json
/source/{type}/{id}.json

"resources": ["catalog",
  "item", "source",
  "resolve", "subtitle"]

// add-on blijft statisch,
// de client maakt de rit

{ "id": "my-movies", "name": "My Movies", "specVersion": 2,
  "resources": ["catalog"], "types": ["video"],
  "catalogs": [{ "id": "all", "name": "All", "type": "video" }] }

Beschrijf het. Een AI bouwt het.

Het hele add-onformaat past in één prompt, en je hoeft het nooit te lezen. Kopieer de prompt, voeg je idee toe, en de AI antwoordt met een map vol bestanden. Upload ze ergens en je add-on is live.

Lees de specificatie van het mHub Addon Protocol v2 op
https://raw.githubusercontent.com/mediahubmx/protocol/main/openapi.yaml
en bouw een add-on voor me. Een add-on is een map met statische JSON-bestanden,
klaar om naar een willekeurige webhost te uploaden. Antwoord met elk bestand: het volledige pad,
daarna de volledige inhoud.

Mijn add-on: [beschrijf hier je idee]

Kan je assistent geen links openen? Plak dan het specificatiebestand in de chat. De specificatie en complete voorbeeld-add-ons staan op GitHub.

Wat je site kan in mHub

Alles zit onder één namespace: window.mhub, en elke host levert de volledige kern. Detecteer de namespace één keer en roep hem dan gewoon aan. Geen SDK, geen buildstap, geen account: één scripttag is de hele setup, en hem zelf hosten mag ook.

De API is live in de apps en wordt met hun releases uitgerold. Schrijf er vandaag al tegen en je pagina blijft hoe dan ook werken: waar geen host is, ontbreekt window.mhub gewoon en blijft je site een gewone website. Haal een browser die hem heeft.

// cross-origin, leesbaar
const r = await mhub.fetch(url);

const s = await mhub.openStream(
  { url, headers });
video.src = s.url;

await mhub.storage.set(k, v);

{ "id": "mysite",
  "endpoints": [
    "https://a.example",
    "https://b.example" ] }

mhub.setLinks([
  { id, name, icon, url }]);

mhub.setSearch({ placeholder,
  onQuery, onSuggest });

if (mhub.device.isTV) tvUi();

mhub.setBackHandler(depth);
mhub.setImmersive(true);
<meta name="mhub" content="app dpad">

Gepubliceerd door mensen zoals jij.

Tot nu toe 56 community-add-ons van 31 makers. Log in met je e-mailadres, upload een map als zip of link er een die je zelf host, en zodra hij door de beoordeling komt, staat hij op mhub.mx/@you/addon, in de communitylijst en in de community-repository.

France 24 & RFI France Médias Monde live: France 24 in French, English, Arabic and Spanish, and the radios RFI and Monte Carlo Doualiya. Official streams, free worldwide. @steve · elders gehost ZDF Live The live channels of the ZDF, Germany's second public broadcaster: ZDF, ZDFneo, ZDFinfo, 3sat and phoenix. The streams are the ones zdf.de plays; most of them are limited to Germany, 3sat also plays in Austria and Switzerland. @jonas Kids Corner ★ For children, in English: the PBS Kids live channel, ABC Kids Listen from Australia, and a shelf of classic children's audiobooks read by LibriVox volunteers: Alice, Peter Pan, The Wind in the Willows, The Jungle Book, Anne of Green Gables and more. @sam Suomalaiset klassikot Finnish literature as audiobooks, read by LibriVox volunteers: the Kalevala, Aleksis Kivi, Juhani Aho, Minna Canth and more. Public domain, hosted by the Internet Archive. @aanikirja Русская классика ★ Russian literature as audiobooks, read by LibriVox volunteers: Pushkin, Gogol, Chekhov, Tolstoy, Dostoevsky, Turgenev and more. Public domain, hosted by the Internet Archive. @chitalka Public Broadcasters Public television and radio in English, live: PBS and PBS member stations, ABC News Australia, CBC News, plus CBC Radio One, CBC Music, NPR, ABC Radio National, ABC NewsRadio, ABC Classic, triple j and Double J. Every stream is the broadcaster's own. @sam