index.html 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <!DOCTYPE html>
  2. <html lang="en" prefix="og: http://ogp.me/ns#" debug="true">
  3. <head>
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  5. <meta charset="utf-8">
  6. <title>Photo store</title>
  7. <meta name="viewport" content="width = device-width, initial-scale = 1.0">
  8. <link rel="stylesheet" href="/css/site.css">
  9. <script src="/js/site.js"></script>
  10. <!-- Core CSS file -->
  11. <link rel="stylesheet" href="/css/photoswipe.css">
  12. <!-- Skin CSS file (styling of UI - buttons, caption, etc.)
  13. In the folder of skin CSS file there are also:
  14. - .png and .svg icons sprite,
  15. - preloader.gif (for browsers that do not support CSS animations) -->
  16. <link rel="stylesheet" href="/css/default-skin.css">
  17. <link rel="stylesheet" href="/css/font-awesome.min.css">
  18. <!-- Core JS file -->
  19. <script src="/js/photoswipe.min.js"></script>
  20. <!-- UI JS file -->
  21. <script src="/js/photoswipe-ui-default.js"></script>
  22. <!--[if lt IE 9]>
  23. <script>
  24. document.createElement('figure');
  25. </script>
  26. <![endif]-->
  27. </head>
  28. <body>
  29. <div class="section section--head">
  30. <div class="row row--heading">
  31. <h1>PhotoStore</h1>
  32. <a href="/incoming/"><h3>Incoming</h3></a>
  33. </div>
  34. </div>
  35. <div class="section">
  36. <div class="row">
  37. <div id="albums" class="demo-gallery"></div>
  38. </div>
  39. </div>
  40. <div id="gallery" class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
  41. <div class="pswp__bg"></div>
  42. <div class="pswp__scroll-wrap">
  43. <div class="pswp__container">
  44. <div class="pswp__item"></div>
  45. <div class="pswp__item"></div>
  46. <div class="pswp__item"></div>
  47. </div>
  48. <div class="pswp__ui pswp__ui--hidden">
  49. <div class="pswp__top-bar">
  50. <div class="pswp__counter"></div>
  51. <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
  52. <!--<button class="pswp__button pswp__button--share" title="Share"></button> -->
  53. <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
  54. <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
  55. <button class="pswp__button pswp__button--cover pswp__button--fa fa fa-bookmark-o" title="Set as cover"></button>
  56. <button class="pswp__button pswp__button--hide pswp__button--fa fa fa-eye-slash" title="Hide"></button>
  57. <div class="pswp__preloader">
  58. <div class="pswp__preloader__icn">
  59. <div class="pswp__preloader__cut">
  60. <div class="pswp__preloader__donut"></div>
  61. </div>
  62. </div>
  63. </div>
  64. </div>
  65. <div class="pswp__loading-indicator"><div class="pswp__loading-indicator__line"></div></div>
  66. <!--<div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
  67. <div class="pswp__share-tooltip">
  68. </div>
  69. </div>
  70. -->
  71. <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
  72. <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
  73. <div class="pswp__caption">
  74. <div class="pswp__caption__center">
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. </div>
  80. <script type="text/javascript">
  81. jsonGET('/api/albums/', function(data) {
  82. if (data)
  83. setAlbums(data);
  84. });
  85. </script>
  86. </body>
  87. </html>