Как подключить Ruffle

Шаг 1. Положите папку на сайт

Распакуйте ruffle-0.5.0.zip и положите папку ruffle-0.5.0 на сайт целиком, например как /ruffle/. Страницу нужно открывать с веб-сервера: с диска (file://) Ruffle не запустится.

Шаг 2. Одна строка в <head>

<script src="/ruffle/ruffle.js"></script>

Шаг 3. Ролик вставляется как в 2003 году

Ничего не меняйте. Обычный код из Dreamweaver или Flash подходит:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
  codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0"
  width="540" height="405">
  <param name="movie" value="files/noir.swf">
  <param name="quality" value="high">
  <embed src="files/noir.swf" quality="high"
    pluginspage="http://www.macromedia.com/go/getflashplayer"
    type="application/x-shockwave-flash" width="540" height="405"></embed>
</object>

В IE6 и Opera 9 этот код играет настоящий Flash Player, в новых браузерах - Ruffle.

Настройки

Настройки задаются в window.RufflePlayer.config. Например, так ролик запускается сразу и без лишних плашек:

<script type="text/javascript">
window.RufflePlayer = window.RufflePlayer || {};
window.RufflePlayer.config = {
    autoplay: "on",
    unmuteOverlay: "hidden"
};
</script>
<script src="/ruffle/ruffle.js"></script>

Зачем это и как ещё убрать заставку Ruffle - в разделе «Как это сделано у нас».

Что нужно знать

• ruffle.js догружает файлы .wasm из своей папки. Если подключать скрипт с другого домена, этот домен должен разрешать такую загрузку (заголовок CORS). Проще держать папку на том же сайте.
• Файлы .wasm большие (около 14 МБ каждый, браузер скачивает только один). Хорошо, если сервер отдаёт их с типом application/wasm и сжатием.