<a href="https://github.com/NikolaySuslov/livecodingspace">
  <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/e7bbb0521b397edbd5fe43e7f760759336b5e05f/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677265656e5f3030373230302e706e67"
    alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png">
</a>

<div id="header" class="mdc-layout-grid mdc-layout-grid--align-left">
  <div class="mdc-layout-grid__inner">
    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
      <span class="mdc-typography--subtitle1 mdc-theme--text-secondary-on-background mdc-typography">
        <a id="ruLang" class="mdc-typography link-in-text mdc-theme--text-hint-on-background" style="cursor:pointer">RU</a>
        <!--<strong>LiveCoding</strong>.space -->
      </span>
      <span class="mdc-typography--subtitle1 mdc-theme--text-secondary-on-background mdc-typography">
        <a id="enLang" class="mdc-typography link-in-text mdc-theme--text-hint-on-background" style="cursor:pointer">EN</a>
        <!--<strong>LiveCoding</strong>.space -->
      </span>
    </div>
    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
      <div id="titleText">
        <h1 class="mdc-typography--headline3 mdc-theme--text-secondary-on-background mdc-typography"><a class="mdc-typography link-in-text"
            style="cursor: pointer;" onclick="window.location.reload(true)"><strong>LiveCoding</strong>.пространство</a>
          <!--<strong>LiveCoding</strong>.space -->
        </h1>
      </div>

    </div>



    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
      <div id="headerText">
        <h1 class="mdc-typography mdc-typography--headline4 mdc-typography--adjust-margin mdc-theme--text-hint-on-background">Виртуальное
          обучающее пространство в веб-браузере с функциями живого кодирования, возможностью создания собственных языков
          программирования, технологий виртуальной/дополненной/смешанной реальности WebVR.<br> На основе: <strong>Virtual
            World Framework | A-Frame | Ohm language | OSC.js | Gun DB... </strong> проект <a class="mdc-typography link-in-text mdc-theme--text-hint-on-background"
            href="https://www.krestianstvo.org"><strong>Krestianstvo.org</strong></a> </h1>
      </div>
    </div>
  </div>
</div>
<div id="about" class="mdc-layout-grid">
  <div class="mdc-layout-grid__inner">
    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-6">
      <div id="featuresText">
        <h1 class="mdc-typography--headline4 mdc-theme--text-hint-on-background">О программе</h1>
        <ul class="featureList mdc-typography mdc-typography--headline5 mdc-theme--text-hint-on-background">
          <li><strong> Децентрализованная модель приложения </strong> на основе <strong>A-Frame</strong> компонентов и <strong>VWF</strong>
            архитектуры распределенных вычислений (репликация и виртуальное время) в сети. </li>
          <li>(<span id="alpha" style="font-size: 14; color: red">New!</span>)
            <a class="mdc-typography link-in-text-vis mdc-theme--text-hint-on-background" href="https://gun.eco/"><strong>GunDB
                storage system</strong> </a>
            for serving Proxy VWF components, Worlds prototypes, World save states, User Inventories ect. in fully decentralized (peer-to-peer
            or multi-master) DB </li>
          <li>(<span id="alpha" style="font-size: 14; color: red">New!</span>)
            <a class="mdc-typography link-in-text-vis mdc-theme--text-hint-on-background" href="https://gun.eco/docs/Auth"><strong>GunDB
                SEA</strong> </a> framework for user authorization and P2P identities</li>
          <li><strong>Ohm</strong> драйвер для совместного создания пользовательских языков программирования, грамматик,
            парсеров, токенайзеров внутри виртуального пространства</li>
          <li><strong>Редактор кода и параметров объектов</strong> прямо в веб-браузере на основе Cell.js</li>
          <li>Работа с <strong>OSC </strong>сообщениями через <a class="mdc-typography link-in-text mdc-theme--text-hint-on-background"
              href="https://github.com/NikolaySuslov/osc-relay-lcs">OSC relay</a></li>
          <li><strong>Аватары</strong> (простые или GLTF модели с анимацией)</li>
          <li><strong>Мульти-оконные</strong> и мульти-мониторные/компьютерные/телефонные проекции с применением виртуальных
            камер со <strong>смещением вида</strong></li>
          <li><strong>WebRTC</strong> для видео/аудио потоковой передачи данных P2P, с функциями <strong>звукового 3D позиционирования</strong>
            в виртуальном пространстве</li>
          <li><strong>GearVR, Windows MixedReality</strong> контроллеры движения</li>
        </ul>

        <h4 class="mdc-typography--headline5 mdc-theme--text-hint-on-background"><a class="mdc-typography link-in-text mdc-theme--text-hint-on-background"
          href="https://www.krestianstvo.org/books/doc/sdk3/">Читать документацию</a> </h4>

      </div>
    </div>

    <div class="mdc-layout-grid__cell mdc-layout-grid__cell">
      <iframe src="https://player.vimeo.com/video/239924195?title=0&byline=0&portrait=0" width="600" height="338" frameborder="0"
        webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

    </div>

  </div>
</div>
<hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />




<div id="videoList">
  <div id="about" class="mdc-layout-grid">
    <div class="mdc-layout-grid__inner">
      <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
        <div id="demoText">
          <h1 class="mdc-typography--headline4 mdc-theme--text-hint-on-background">Видео демонстрации</h1>
        </div>



        <iframe src="https://player.vimeo.com/video/243291223?title=0&byline=0&portrait=0" width="600" height="337" frameborder="0"
          webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>


        <iframe src="https://player.vimeo.com/video/251057056?title=0&byline=0&portrait=0" width="600" height="338" frameborder="0"
          webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
      </div>
    </div>
  </div>
</div>
<hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />

<div id="info" class="mdc-layout-grid">
  <div class="mdc-layout-grid__inner">
    <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
      <div id="worldInfo">
        <h1 class="mdc-typography--headline4 mdc-theme--text-hint-on-background">Виртуальные миры</h1>
        <h1 class="mdc-typography mdc-typography--headline5 mdc-theme--text-hint-on-background">Чтобы начать работу в виртуальном обучающем пространстве, выберите один из прототипов миров и запустите его нажав
          на кнопку <strong>Создать</strong>. Для вновь созданного мира сгенерируется уникальная ссылка, которая отобразиться
          под его описанием. Для совместной работы, войдите с помощью этой ссылки с другого компьютера или окна браузера.
          Из прототипа можно создавать неограниченное количество миров. Рядом с ссылками так же указывается количество пользователей,
          находящихся онлайн в указанном мире.</h1>
      </div>
    </div>
  </div>
</div>

<hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />