Chaque idée. Chaque écran.

Une plateforme, trois parties.

mHub n'est pas une application. Ce sont trois parties qui s'emboîtent, et chacune d'elles est ouverte. Deux sont des fondations : un format de contenu et une API de navigateur. La troisième, ce sont les applications, et chacune repose sur l'une des fondations ou sur les deux.

Nos préférées. Toutes en ligne.

Vuma repose sur les deux fondations ; les applications à ses côtés montrent jusqu'où une seule fondation peut mener. Cinq applications, cinq idées différentes, et chacune est un point de départ.

Vuma

Donnez des addons à Vuma et elle les réunit sur un seul écran à parcourir : tous les catalogues que proposent vos addons, une recherche sur l'ensemble, une bibliothèque, un lecteur qui reprend là où vous vous êtes arrêté. C'est une seule application web qui fonctionne aussi bien sur téléphone que sur téléviseur ou ordinateur, et qui gère elle-même le tactile, la télécommande et le pointeur.

Elle repose sur les deux fondations : les addons apportent le contenu, et dans un navigateur mHub, la Browser API ajoute les pouvoirs qu'une page ordinaire n'a jamais. Vous pouvez même l'intégrer à votre propre page, avec vos addons et votre nom : un seul fichier HTML.

Ouvrir Vuma · Faites-la vôtre

Waves

Stations de radio, podcasts et livres audio gratuits réunis dans une seule application. Waves est un seul fichier HTML sur le même build de Vuma : cinq addons audio, une couleur d'accent bleu sarcelle, et addonManager: "fixed", si bien que les sources sont fixées et que l'utilisateur ne fait que les activer ou les désactiver. Affichez son code source : la page est à elle seule tout le tutoriel.

Ouvrir en ligne

Junior

La télé pour enfants. Un addon, des couleurs vives, l'allemand dès le premier écran (locale: "de"), et addonManager: "hidden" : rien à dérégler depuis le canapé. Là aussi, un seul fichier HTML sur le build de Vuma.

Ouvrir en ligne

Mediathek

L'addon, ce sont les données ; ce que l'on construit par-dessus, c'est l'application. Mediathek est un seul fichier HTML posé directement sur l'addon ard-mediathek, sans Vuma en dessous : rangées, recherche, séries avec leurs épisodes, sous-titres, et un lecteur qui se souvient de l'endroit où vous vous êtes arrêté. L'addon va chercher les données, la page s'occupe de l'apparence.

Ouvrir en ligne · Code source sur GitHub

Glance

L'autre fondation, seule : Glance n'utilise aucun addon. Un fichier HTML sur la Browser API, qui réunit la météo en direct, les gros titres, les cours des marchés et l'état de vos propres serveurs sur un écran calme. Dans un navigateur ordinaire, elle se dégrade en douceur ; dans une application mHub, chaque tuile s'anime.

Ouvrir en ligne · Code source sur GitHub

Une idée, un dossier, tous les écrans.

Tout ce qui tient dans une liste peut devenir un addon, et tout ce qu'un navigateur refuse de faire peut devenir un site dans mHub. Voici des idées que nous aimerions voir réalisées, et chacune n'est qu'à un prompt de distance : choisissez-en une, et elle arrive dans le prompt pour l'IA plus bas.

Vous avez réalisé l'une de ces idées ? Publiez-la sur mhub.mx : nous la vérifions, l'hébergeons sous votre nom et la référençons dans le dépôt de la communauté.

Votre propre application tient dans un fichier HTML.

Waves et Junior, c'est exactement cela : charger le build de Vuma, lui donner un élément, appeler mount. Ce fichier, sur n'importe quel hébergeur statique, est une application complète avec vos addons, votre nom et vos couleurs, et il suit tout seul les nouvelles versions de Vuma. Sans compilation, sans code serveur, sans compte.

<!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>

Un addon, c'est l'URL de son manifeste. Ceux qui sont hébergés ici figurent dans l'index des addons, et une IA peut vous en construire un nouveau.

Chaque option de mount, et la provenance des fichiers, sont documentées dans l'application elle-même : Créer votre propre application. Cette documentation est livrée avec le build, elle décrit donc la version que vous allez charger, et non celle pour laquelle cette page a été écrite.

Un addon est un dossier de fichiers JSON.

Un addon est une source de contenu : films, stations de radio, podcasts, recettes, cours. Placez le dossier n'importe où sur le web, ajoutez son adresse dans une application, et tout ce qu'il contient y apparaît, prêt à être parcouru. La version 2 du protocole n'a besoin d'aucun serveur : chaque point d'accès peut être un fichier statique sur n'importe quel CDN. Tous les addons v1 existants continuent de fonctionner ; les applications font la conversion entre les deux, et la v1 reste prise en charge.

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

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

// l'addon reste statique,
// le client fait le trajet

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

Décrivez-le. Une IA le construit.

Tout le format des addons tient dans un seul prompt, et vous n'avez jamais besoin de le lire. Copiez le prompt, ajoutez votre idée, et l'IA répond avec un dossier de fichiers. Mettez-les en ligne n'importe où, et votre addon est disponible.

Lisez la spécification mHub Addon Protocol v2 à l'adresse
https://raw.githubusercontent.com/mediahubmx/protocol/main/openapi.yaml
et construisez-moi un addon. Un addon est un dossier de fichiers JSON statiques,
prêt à être mis en ligne sur n'importe quel hébergeur web. Répondez avec chaque fichier :
son chemin complet, puis son contenu intégral.

Mon addon : [décrivez votre idée ici]

Si votre assistant ne peut pas ouvrir de liens, collez plutôt le fichier de spécification dans la conversation. La spécification et des exemples d'addons complets se trouvent sur GitHub.

Ce que votre site peut faire dans mHub

Tout se trouve sous un seul espace de noms : window.mhub, et chaque hôte fournit l'intégralité du noyau. Détectez l'espace de noms une fois, puis appelez-le, tout simplement. Pas de SDK, pas de compilation, pas de compte : une balise script suffit, et vous pouvez l'héberger vous-même.

L'API est disponible dans les applications et se déploie au fil de leurs versions. Codez avec elle dès aujourd'hui, votre page continuera de fonctionner dans tous les cas : là où aucun hôte n'est présent, window.mhub est simplement absent et votre site reste un site web ordinaire. Obtenez un navigateur qui l'intègre.

// cross-origin, lisible
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">

Publiés par des gens comme vous.

À ce jour, 56 addons communautaires de 31 créateurs. Connectez-vous avec votre adresse e-mail, envoyez un dossier au format zip ou indiquez le lien d'un dossier que vous hébergez, et une fois la vérification passée, il est en ligne sur mhub.mx/@you/addon, dans la liste de la communauté et dans son dépôt.

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 · hébergé ailleurs 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