index.html 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <meta charset="utf-8">
  4. <title>Live Coding Space</title>
  5. <script type="text/javascript" src="./web/lib/cell.js"></script>
  6. <script type="text/javascript" src="./web/lib/he.js"></script>
  7. <link rel="stylesheet" href="./web/lib/mdc/dist/material-components-web.css">
  8. <script src="./web/lib/mdc/dist/material-components-web.js"></script>
  9. <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">
  10. <script src="./web/lib/socketio/socket.io.js"></script>
  11. <link rel="stylesheet" href="./web/lib/app.css">
  12. <!--<script src="./web/lib/polyglot-lang.js" type="module"></script> -->
  13. <!-- <script src="./web/lib/app.js" type="module"></script> -->
  14. <!-- Global Site Tag (gtag.js) - Google Analytics -->
  15. <script async src="https://www.googletagmanager.com/gtag/js?id=UA-11815598-9"></script>
  16. <script>
  17. window.dataLayer = window.dataLayer || [];
  18. function gtag() { dataLayer.push(arguments) };
  19. gtag('js', new Date());
  20. gtag('config', 'UA-11815598-9');
  21. </script>
  22. <script src="./web/lib/polyglot/polyglot.min.js"></script>
  23. <script type="module">
  24. import {WebApp} from '/web/lib/app.js';
  25. //import * as app from "/web/lib/app.js";
  26. const initApp = () => {
  27. let app = new WebApp;
  28. app.getAppDetails('webapps.json');
  29. app.generateFrontPage();
  30. document.querySelector('#ruLang').addEventListener('click', function(e){
  31. app.setLanguage('ru');
  32. window.location.reload(true);
  33. });
  34. document.querySelector('#enLang').addEventListener('click', function(e){
  35. app.setLanguage('en');
  36. window.location.reload(true);
  37. });
  38. }
  39. //var socket = initWebSocket();
  40. window.onload = initApp();
  41. </script>
  42. </head>
  43. <body class="mdc-typography">
  44. <a href="https://github.com/NikolaySuslov/livecodingspace">
  45. <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/e7bbb0521b397edbd5fe43e7f760759336b5e05f/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677265656e5f3030373230302e706e67"
  46. alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png">
  47. </a>
  48. <div id="header" class="mdc-layout-grid mdc-layout-grid--align-left">
  49. <div class="mdc-layout-grid__inner">
  50. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
  51. <span class="mdc-typography--subheading2 mdc-theme--text-secondary-on-background mdc-typography">
  52. <a id="ruLang" class="mdc-typography link-in-text mdc-theme--text-hint-on-background" style="cursor:pointer">RU</a>
  53. <!--<strong>LiveCoding</strong>.space -->
  54. </span>
  55. <span class="mdc-typography--subheading2 mdc-theme--text-secondary-on-background mdc-typography">
  56. <a id="enLang" class="mdc-typography link-in-text mdc-theme--text-hint-on-background" style="cursor:pointer">EN</a>
  57. <!--<strong>LiveCoding</strong>.space -->
  58. </span>
  59. </div>
  60. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
  61. <div id="titleText">
  62. </div>
  63. </div>
  64. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
  65. <div id="headerText">
  66. </div>
  67. </div>
  68. </div>
  69. </div>
  70. <div id="about" class="mdc-layout-grid">
  71. <div class="mdc-layout-grid__inner">
  72. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-6">
  73. <div id="featuresText">
  74. </div>
  75. </div>
  76. <div class="mdc-layout-grid__cell mdc-layout-grid__cell">
  77. <iframe src="https://player.vimeo.com/video/239924195?title=0&byline=0&portrait=0" width="600" height="338" frameborder="0"
  78. webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
  79. </div>
  80. </div>
  81. </div>
  82. <hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />
  83. <div id="info" class="mdc-layout-grid">
  84. <div class="mdc-layout-grid__inner">
  85. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
  86. <div id="worldInfo">
  87. </div>
  88. <div id="reflectorMenu">
  89. <div id="reflectorSelect" class="mdc-text-field mdc-text-field--upgraded">
  90. <input id="currentReflector" type="text" class="mdc-text-field__input" id="my-text-field" aria-controls="my-text-field-helper-text" style="width:250px;">
  91. <label for="my-text-field" class="mdc-text-field__label">Reflector</label>
  92. <div class="mdc-text-field__bottom-line"></div>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. </div>
  98. <div id="main">
  99. </div>
  100. <hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />
  101. <div id="videoList">
  102. <div id="about" class="mdc-layout-grid">
  103. <div class="mdc-layout-grid__inner">
  104. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-12">
  105. <div id="demoText">
  106. </div>
  107. <iframe src="https://player.vimeo.com/video/243291223?title=0&byline=0&portrait=0" width="600" height="337" frameborder="0"
  108. webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
  109. <iframe src="https://player.vimeo.com/video/251057056?title=0&byline=0&portrait=0" width="600" height="338" frameborder="0"
  110. webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
  111. </div>
  112. </div>
  113. </div>
  114. </div>
  115. <hr class="mdc-list-divider mdc-theme--text-hint-on-background divider" />
  116. <div id="footer">
  117. <div id="about" class="mdc-layout-grid">
  118. <div class="mdc-layout-grid__inner">
  119. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-10">
  120. </div>
  121. <div class="mdc-layout-grid__cell mdc-layout-grid__cell--span-2">
  122. <h3 class="mdc-typography--subheading2 mdc-theme--text-hint-on-background"><a class="mdc-typography link-in-text mdc-theme--text-hint-on-background"
  123. href="https://www.krestianstvo.org">Krestianstvo.org</a> 2018</h3>
  124. </div>
  125. </div>
  126. </div>
  127. </div>
  128. <script>
  129. mdc.autoInit()
  130. </script>
  131. </body>
  132. </html>