test/spel-2.html
author ymh <ymh.work@gmail.com>
Tue, 22 Oct 2024 09:54:34 +0200
changeset 1080 2b513bcb710a
parent 1076 510fd2a482f4
permissions -rw-r--r--
increment version

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>Tests Spectacle en ligne(s)</title>
    <link href="open-sans/css/fonts.css" rel="stylesheet" type="text/css" />
    <link href="test.css" rel="stylesheet" type="text/css" />
    <script
      type="text/javascript"
      src="metadataplayer/LdtPlayer-core.js"
    ></script>
    <script type="text/javascript" src="spel-serializer.js"></script>
  </head>

  <body>
    <section style="width: 1070px; margin: 0 auto">
      <h1>Tests Spectacle en ligne(s)</h1>
      <div id="LdtPlayer"></div>
      <div id="AnnotationsListContainer"></div>
    </section>
    <script type="text/javascript">
      IriSP.widgetsDir = "metadataplayer";
      var _metadata = {
        url: "json/extrait-celestins-paris.json",
        format: "spel",
      };
      var _config = {
        width: 550,
        container: "LdtPlayer",
        default_options: {
          metadata: _metadata,
        },
        css: "metadataplayer/LdtPlayer-core.css",
        widgets: [
          {
            type: "Title",
          },
          {
            type: "JwpPlayer",
            video:
              "rtmpt://sln8pxlnphabw.cloudfront.net/cfx/st/mp4:2013-09-11_11-00-57_extrait-celesti_8878b1/original_web_low.mp4",
            height: 320,
          },
          { type: "Slider" },
          { type: "Controller" },
          {
            type: "Segments",
            annotation_type: ["performance", "discussion"],
          },
          {
            type: "Annotation",
            show_social: false,
            show_annotation_type: true,
            annotation_type: ["performance", "discussion"],
          },
          {
            type: "Polemic",
            annotation_type: "interpretation",
            polemics: [
              {
                keywords: ["performance d'un(e) comédien(ne)"],
                color: "#c00000",
              },
              {
                keywords: ["Interpétation alternative de mise en scène"],
                color: "#008000",
              },
              {
                keywords: ["Intervention de la technique"],
                color: "#0000f0",
              },
            ],
          },
          {
            type: "Annotation",
            annotation_type: "interpretation",
            show_social: false,
            arrow_position: 0,
          },
          {
            type: "SpelSyncHtml",
            container: "AnnotationsListContainer",
            height: 600,
            width: 500,
            src: "ctb.html",
          },
        ],
      };
      _myPlayer = new IriSP.Metadataplayer(_config);
    </script>
  </body>
</html>