+ robots.txt, sitemap.xml;

assets/style/breadcrumbs.scss

@@ -0,0 +1,57 @@
+nav.breadcrumbs{
+  width: 80%;
+  margin: 0 auto;
+  padding: .35em 0 0;
+  color: #bbb;
+
+  a {
+    color: #9990e0;
+  }
+
+  ul{
+    list-style: none;
+
+    li {
+      display: inline-block;
+
+      &:not(:first-child):before{
+        content: '⟶';
+        margin-left: .4em;
+      }
+    }
+  }
+}
+
+@media screen and (max-width: 31.25em) {
+  nav.breadcrumbs{
+    width: 100%;
+    margin: 0;
+    font-size: 0.75em;
+
+    ul{
+      li {
+        &:not(:first-child):before{
+          content: '>';
+          margin-left: .2em;
+        }
+      }
+    }
+  }
+}
+
+@media screen and (min-width: 31.25em) and (max-width: 59.99999em){
+  nav.breadcrumbs{
+    width: 100%;
+    margin: 0;
+    font-size: 0.75em;
+
+    ul{
+      li {
+        &:not(:first-child):before{
+          content: '>';
+          margin-left: .2em;
+        }
+      }
+    }
+  }
+}

assets/style/docs.scss

@@ -1,68 +1,40 @@
 .page-docs {
   &.ng-leave {
-	transform-origin: 50% 50%;
+    transform-origin: 50% 50%;
-	animation: rotateOutNewspaper .3s both ease-in;
+    animation: rotateOutNewspaper .3s both ease-in;
   }
 
   &.ng-enter {
-	animation: scaleUp 0.3s both ease-in
+    animation: scaleUp 0.3s both ease-in
   }
 }
 
-.act{
+.documents-block {
-	text-decoration: none;
+  margin: 3em 0 0;
-	border-bottom: 1px dashed #688fff;
+
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  align-items: baseline;
 }
 
-.docblock{
+.doc {
-	margin-bottom: 40px;
+  margin: 0 1.2em 2.5em;
-	text-align: center;
 
-	h2{
+  p {
-		margin-left: 50px;
+    text-align: center;
-		text-align: left;
+  }
-	}
+  img {
-
+    max-width: 100%;
-	.panel{
+  }
-		text-align: left;
-		li{
-			display: inline-block;
-			margin: 0 5px;
-		}
-
-		.select{
-			padding:2px 6px 2px 6px;
-			background-color: #688fff;
-			color: white;
-			border: none;
-		}
-	}
-}
-
-.doc{
-	display: inline-block;
-	margin: 30px 35px;
-
-	img{
-		display: block;
-		margin-left: auto;
-		margin-right: auto;
-		max-width:360px;
-	}
-
-	.docinfo{
-		margin: 0;
-		padding: 0;
-		display: block;
-	}
 }
 
-@media screen and (max-device-width: 400px){
+@media (max-width: 31.25em) {
-  .doc{
+  .documents-block {
-	margin: 30px 35px;
+    margin: 1em 0 0;
+  }
 
-	img{
+  .doc {
-	  max-width: 250px;
+    margin: 0 0 2em;
-	}
   }
 }

assets/style/footer.scss

@@ -1,56 +1,74 @@
-footer{
+footer {
+  color: #e3e3e3;
+  background-color: #151515;
+  font-size: 0.9em;
+  padding: 0 0.5em 0.5em;
   position: relative;
-  background-color: black;
-  color: #ffffff;
-  overflow-x: scroll;
-  margin: 0;
 
-  &:before{
+  &:before {
     content: '';
     position: absolute;
     top: -3px;
+    left: 0;
     width: 100%;
     height: 3px;
+    z-index: 100;
     background-image: url('/graphics/rawline.png');
   }
 
-  .info-block{
+  h4{
-    display: flex;
+    font-size: 1.3em;
-    margin: 0;
+    color: white;
-
+    margin: 0.5em 0 0.7em;
-    & > div{
-      margin: 0 30px 0 10px;
-    }
   }
 
-  a{
+  ul {
-    color: #738cdb;
+    padding: 0 0.5em 0 1em;
-  }
-
-  ul{
     list-style: none;
+
+    li {
+      margin: 0 0 0.5em;
+    }
   }
-}
 
-.footer-content{
+  a {
-  min-width: 500px;
+    padding: 0.15em 0;
-}
+    line-height: 1.5em;
+    color: #738cdb;
+    text-decoration: none;
+    border-bottom: 1px solid #2c3652;
+  }
 
-@media screen and (max-device-width: 500px){
+  .info-block {
-  footer{
+    display: flex;
-    font-size: 8pt;
+    flex-wrap: wrap;
+    justify-content: space-between;
 
-    .info-block{
+    & > div {
-      display: block;
+      box-sizing: border-box;
-      margin: 0;
+      padding: 0 1em;
+    }
+  }
 
-      & > div{
+  .contacts {
-        margin: 0 30px 0 10px;
+    & > div {
-      }
+      padding: 0 1em;
+    }
 
-      p{
+    p {
-        margin: 0;
+      margin: 0.5em 1em;
-      }
+    }
+  }
+
+  .copyright {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: baseline;
+    justify-content: space-between;
+
+    span {
+      padding: 1.5em 1em 0.25em;
+      box-sizing: padding-box;
     }
   }
 }

assets/style/gallery.scss

@@ -0,0 +1,184 @@
+.gallery-block {
+  margin: 2em 0 0;
+  display: block;
+}
+
+.gallery-period{
+  margin-bottom: 2em;
+  
+  & > div{
+    margin: 1.5em 0 0;
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    align-items: flex-start;
+  }
+
+  p.period{
+    text-align: center;
+    font-size: 1.5em;
+    font-weight: bold;
+  }
+}
+
+.gallery-album {
+  margin: 0 1em 2em;
+
+  h3{
+    margin: 0 0 0.35em;
+  }
+
+  img {
+    max-width: 100%;
+  }
+}
+
+.album-block {
+  width: 100%;
+  margin: 1em auto 2em;
+
+  h3 {
+    text-align: center;
+    margin: 1.5em 0 1em;
+  }
+
+  .fotorama__nav-wrap {
+    margin: 6em 0 0;
+  }
+
+  .fotorama__stage{
+    overflow: inherit;
+  }
+
+  .fotorama__stage__frame{
+    overflow: inherit;
+  }
+
+  .album {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: center;
+  }
+
+  .album-info {
+    width: 80%;
+    margin: 0 0 3em;
+  }
+
+  .album-info p {
+    margin: 0 0 .5em;
+  }
+
+  .album-item {
+    width: 80%;
+    box-sizing: border-box;
+    margin: 0 0 4em;
+    position: relative;
+    background-color: white;
+    padding: 6em;
+    box-shadow: 0 4px 14px -10px rgba(0,0,0, .85);
+
+    &.vertical {
+      width: 47%;
+      min-width: 30em;
+      max-width: 35em;
+    }
+
+    img{
+      width: 100%;
+      box-sizing: border-box;
+      border: .25em solid #eee;
+      border-top-color: #bbb;
+      border-left-color: #ddd;
+    }
+  }
+
+  .product-info{
+    text-align: center;
+    position: absolute;
+    width: 100%;
+    left: 0;
+    bottom: 1em;
+
+    & > div {
+      display: inline-block;
+      padding: .5em 1em;
+      background-color: white;
+      border: 1px solid #f5f5f5;
+      border-radius: .25em;
+      box-shadow: 0 5p/x 4px -4px rgba(0,0,0, .5);
+    }
+
+    p {
+      font-size: 0.75em;
+    }
+    
+    .title {
+      font-weight: bold;
+    }
+  }
+}
+
+@media screen and (max-width: 31.25em) {
+  .album-block {
+    width: 100%;
+    margin: 1em auto 2em;
+
+    h3 {
+      text-align: left;
+      margin: 1em 0 0.5em;
+    }
+
+    .album-info{
+      width: 100%;
+      margin: 0 0 2em;
+    }
+
+    .album-item {
+      width: 100%;
+      padding: 1em 1em 5em;
+      margin: 0 0 2em;
+
+      img{
+        border: .1em solid #eee;
+        border-top-color: #bbb;
+        border-left-color: #ddd;
+      }
+    }
+
+    .product-info {
+      bottom: .5em;
+    }
+  }
+
+  .gallery-album {
+    margin: 0 0 1em;
+  }
+}
+
+@media screen and (min-width: 31.25em) and (max-width: 59.99999em){
+  .album-block {
+    .album-info{
+      width: 100%;
+      margin: 0 0 2em;
+      font-size: 0.75em;
+    }
+
+    .album-item {
+      width: 100%;
+      padding: 2em 2em 5em;
+      margin: 0 0 2em;
+
+      img{
+        border: .15em solid #eee;
+        border-top-color: #bbb;
+        border-left-color: #ddd;
+      }
+    }
+
+    .product-info {
+      bottom: .5em;
+    }
+  }
+}

assets/style/home.scss

@@ -22,7 +22,7 @@
     font-size: 18pt;
     text-align: center;
     font-weight: normal;
-    margin: 0;
+    margin: 1em 0 0;
     padding: 0;
   }
 }

assets/style/main.scss

@@ -1,23 +1,59 @@
-body {
+* {
-	font-family: "PT Sans", Arial, sans-serif;
+  margin: 0;
-	margin: 0;
+  padding: 0;
-	padding: 0;
+}
 
-    min-width: 320px;
+html, body {
+  height: 100%;
+}
+
+body {
+  font-family: "PT Sans", Arial, sans-serif;
+  min-width: 320px;
+}
+
+.wrapper {
+  display: flex;
+  min-height: 100%;
+  flex-direction: column;
+}
+
+.content {
+  flex: 1;
+  width: 90%;
+  margin: 0 auto;
 }
 
 a {
   color: #3f9cea;
   text-decoration: none;
   border-bottom: 1px solid rgba(63, 156, 234, 0.25);
+
+  &:hover {
+    border-bottom: 1px solid rgba(63, 156, 234, 0.5);
+  }
+
+  &:active {
+    border-bottom: 1px solid rgb(63, 156, 234);
+  }
+
+  &.invisible {
+    border-bottom: none;
+  }
 }
 
-a:hover {
+h3 a {
-  border-bottom: 1px solid rgba(63, 156, 234, 0.5);
+  color: black;
-}
+  text-decoration: none;
+  border-bottom: 1px solid #ddd;
 
-a:active {
+  &:hover {
-  border-bottom: 1px solid rgb(63, 156, 234);
+    border-bottom: 1px solid #484848;
+  }
+
+  &:active {
+    border-bottom: 1px solid #000000;
+  }
 }
 
 ul.submenu {
@@ -28,14 +64,14 @@ ul.submenu {
   text-align: center;
 
   li {
-	display: inline-block;
+    display: inline-block;
-	vertical-align: top;
+    vertical-align: top;
-	margin: 0 30px 0 0;
+    margin: 0 30px 0 0;
 
-	p {
+    p {
-	  margin: 2px 0 0;
+      margin: 2px 0 0;
-	  font-size: 0.75em;
+      font-size: 0.75em;
-	  color: #999;
+      color: #999;
-	}
+    }
   }
 }

assets/style/menu.scss

@@ -1,80 +1,76 @@
-.menu {
+header {
-  $text_color: #666;
+  nav {
+    overflow-x: scroll;
+    -webkit-overflow-scrolling: touch;
+    width: 100%;
+    max-height: 15em;
 
-  position:relative;
+    background-color: black;
-  width: 100%;
+    font-size: 1.1em;
-  background-color: black;
+    color: #666;
-  color: $text_color;
-  font-size: 13pt;
 
-  ul {
+    & :link, & :visited {
-    margin: 0 0 0 10px;
-
-    li {
-      display: inline-block;
-      padding: 5px 3px 13px 3px;
-      margin-right: 30px;
-    }
-  }
-
-  :link, :visited {
-    text-decoration: none;
-    border-bottom: 1px solid #333;
-    color: #ccc;
-  }
-
-  a:hover {
-    color: white;
-    border-bottom: 1px solid #555;
-  }
-
-  .vk {
-    float: right;
-    margin: 13px 15px 0 0;
-    border: none;
-  }
-
-  .selected {
-    border-top: 4px solid white;
-    font-weight: bold;
-
-    a:link, a:visited{
-      color: white;
       text-decoration: none;
-      border-bottom: none;
+      border-bottom: 1px solid #333;
+      color: #a2a2a2;
     }
 
-    &.blue{
-      border-top: 4px solid #3f9cea;
-    }
-
-    &.green{
-      border-top: 4px solid #5cbe40;
-    }
-
-    &.yellow{
-      border-top: 4px solid #ffee00;
-    }
-
-    &.pink {
-      border-top: 4px solid #f655a0;
-    }
-  }
-}
-
-@media screen and (max-device-width: 500px){
-  .menu {
-    font-size: 10pt;
-
     ul {
-      margin: 0 0 0 5px;
+      list-style: none;
-      padding: 0 0 0 0;
+      white-space: nowrap;
 
       li {
-        display: inline-block;
+        display: inline-block; /* 6 */
-        padding: 3px 3px 10px 3px;
+        padding: 0.3em 0.2em 0.5em;
-        margin: 0 4px 5px 0;
+        margin: 0 0.5em;
+      }
+    }
+
+    a:hover {
+      color: white;
+      border-bottom: 1px solid #555;
+    }
+
+    .selected {
+      border-top: 4px solid white;
+      font-weight: bold;
+
+      a:link, a:visited {
+        color: white;
+        text-decoration: none;
+        border-bottom: none;
+      }
+
+      &.blue {
+        border-top: 4px solid #3f9cea;
+      }
+
+      &.green {
+        border-top: 4px solid #5cbe40;
+      }
+
+      &.yellow {
+        border-top: 4px solid #ffee00;
+      }
+
+      &.pink {
+        border-top: 4px solid #f655a0;
+      }
+
+      &.red {
+        border-top: 4px solid #f61b14;
       }
     }
   }
 }
+
+@media (min-width: 31.25em) {
+  header{
+    max-height: none;
+    overflow: hidden;
+
+    nav ul {
+      width: 100%;
+    }
+  }
+}

assets/style/tape-viewer.scss

@@ -1,9 +1,14 @@
 .tape-block{
   width: 70%;
-  max-width: 800px;
+  max-width: 1000px;
-  min-width: 300px;
 
-  margin: 50px auto 100px;
+  margin: 2em auto;
+
+  &.simplified{
+    .tape{
+      display: none;
+    }
+  }
 }
 
 .tape-block-content{
@@ -42,13 +47,10 @@
   }
 }
 
-@media screen and (max-device-width: 400px) {
+@media screen and (max-device-width: 31.25em) {
   .tape-block {
-    width: 70%;
+    width: 90%;
-    max-width: 250px;
+    margin: 1.5em auto;
-    min-width: 200px;
-
-    margin: 50px auto 100px;
   }
 
   .tape-block-content {

assets/style/timeline-content.scss

@@ -1,39 +0,0 @@
-.timeline {
-  .timeline-record {
-    .user{
-      margin-top: 4px;
-
-      span{
-        vertical-align: top;
-        line-height: 40px;
-      }
-
-      img {
-        width: 40px;
-        height: 40px;
-        border-radius: 50%;
-      }
-    }
-
-    .date{
-      margin: 5px 0 0;
-      color: #999;
-      font-size: 0.75em;
-    }
-
-    .body{
-      a{
-        border-bottom: none;
-      }
-
-      img {
-        width: 100%;
-        max-width: 500px;
-        box-sizing: border-box;
-        border-radius: 5px;
-        border: 8px solid white;
-        box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.35);
-      }
-    }
-  }
-}

assets/style/timeline-instagram.scss

@@ -0,0 +1,34 @@
+.timeline-record {
+  .instagram {
+    margin: 0 auto;
+    max-width: 640px;
+
+    .head {
+      width: 100%;
+      margin: 0 0 .5em;
+
+      .user {
+        span {
+          vertical-align: top;
+          line-height: 40px;
+        }
+
+        img {
+          width: 40px;
+          height: 40px;
+          border-radius: 50%;
+        }
+      }
+    }
+
+    .body img {
+      width: 100%;
+      height: auto;
+      box-sizing: border-box;
+      border: .5em solid white;
+      box-shadow: 0 .2em 0.35em rgba(0, 0, 0, 0.35);
+      border-radius: .35em;
+      margin: 0 0 1em;
+    }
+  }
+}

assets/style/timeline-record.scss

@@ -0,0 +1,8 @@
+.timeline-record {
+  margin: 0 0 3em;
+  .date {
+    margin: 0 0 0.45em;
+    font-size: 0.75em;
+    color: #999;
+  }
+}

assets/style/timeline.scss

@@ -1,72 +1,13 @@
 .timeline{
-  min-width: 400px;
+  display: flex;
-  position: relative;
+  flex-direction: column;
-  display: block;
+  width: 70%;
-  width: 75%;
+  margin: 0 auto 2em;
-  margin: 0 auto 50px;
 }
 
-.timeline-record{
+.timeline-footer{
-  position: relative;
+  display: flex;
-
+  justify-content: center;
-  .body {
-    margin: 0 0 50px;
-
-    img{
-      margin: 0 auto;
-      display: block;
-      min-height: 500px;
-    }
-  }
-}
-
-@media screen and (max-device-width: 400px) {
-  .timeline {
-    min-width: 0;
-    position: relative;
-    margin: 0 0 50px;
-
-    .head{
-      margin: 0;
-      padding: 0;
-    }
-
-    .body{
-      margin: 0 0 40px;
-      padding: 0;
-    }
-
-    .body p{
-      text-align: left;
-      margin: 0 0 2px;
-      padding: 0;
-    }
-
-    .timeline-record {
-      position: relative;
-      display: flex;
-
-      .head, .body {
-        position: relative;
-        width: 90%;
-        box-sizing: border-box;
-      }
-
-      .head {
-        padding: 5px 20px;
-      }
-
-      .body {
-        padding: 0 20px;
-      }
-    }
-  }
-}
-
-.timeline-end{
-  width: 50%;
-  margin: 0 auto;
-  text-align: center;
 
   button.more{
     position: relative;
@@ -89,3 +30,9 @@
     }
   }
 }
+
+@media screen and (max-device-width: 31.25em) {
+  .timeline {
+    width: 98%;
+  }
+}

bin/www.js

@@ -10,5 +10,6 @@ var instagram = require("../instagram");
 db.init(config.db.uri)
     //.then(instagram)
     .then(function () {
-        server(config.port);
+        var app = server();
+        app.listen(config.port);
     });

bower.json

@@ -22,9 +22,9 @@
   "dependencies": {
     "fotorama": "~4.6.2",
     "jquery": "~2.1.1",
-    "angular-route": "~1.3.3",
+    "angular-route": "~1.4.1",
-    "angular-animate": "~1.3.3",
+    "angular-animate": "~1.4.1",
-    "angular": "~1.3.3",
+    "angular": "~1.4.1",
     "angulartics": "~0.17.2",
     "angular-spinner": "~0.6.1",
     "socket.io-client": "~1.3.5"

client/api/api.js

@@ -2,11 +2,16 @@
  * Created by tmshv on 22/11/14.
  */
 
+var APINews = require("./news");
+var APIGallery = require("./gallery");
+
 module.exports = function(app) {
+    var minute = 1000 * 60;
+
     app.factory("api", function ($http) {
         var api = {};
-        var Endpoint = require("./news");
+        api.news = new APINews($http);
-        api.news = new Endpoint($http);
+        api.gallery = new APIGallery($http, minute);
 
         return api;
     });

client/api/gallery.js

@@ -0,0 +1,22 @@
+/**
+ * Created by tmshv on 22/11/14.
+ */
+
+function APIGallery(http){
+    this.request = http;
+}
+
+APIGallery.prototype.year = function(year) {
+    return this.request.get("/gallery/" + year, {cache: true});
+};
+
+APIGallery.prototype.album = function(year, course, album) {
+    var url = '/gallery/{year}/{course}/{album}'
+        .replace('{year}', year)
+        .replace('{course}', course)
+        .replace('{album}', album);
+
+    return this.request.get(url, {cache: true});
+};
+
+module.exports = APIGallery;

client/app.js

@@ -19,7 +19,7 @@ app.config(function ($locationProvider, $routeProvider) {
             name: "/",
             templateUrl: "/views/home.html",
             controller: "HomePageController",
-            title:"ДШХ Шлиссельбурга"
+            title:"ДХШ Шлиссельбурга"
         },
         {
             name: "/schedule",
@@ -33,6 +33,17 @@ app.config(function ($locationProvider, $routeProvider) {
             controller: "TeamPageController",
             title:"Преподаватели"
         },
+        {
+            name: "/gallery",
+            templateUrl: "/views/gallery.html",
+            controller: "GalleryPageController",
+            title:"Работы учащихся"
+        },
+        {
+            name: "/gallery/:year/:course/:album",
+            templateUrl: "/views/gallery-album.html",
+            controller: "AlbumPageController"
+        },
         {
             name: "/docs",
             templateUrl: "/views/docs.html",
@@ -50,33 +61,31 @@ app.config(function ($locationProvider, $routeProvider) {
     });
 });
 
-app.run(function($location, $rootScope, $http, config) {
+app.run(function($location, $rootScope, $http) {
     $rootScope.$on("$routeChangeSuccess", function (event, current) {
-        $rootScope.title = current["$$route"].title;
+        var title = current["$$route"].title;
+        if(title) $rootScope.title = title;
     });
 
-    $rootScope.contact = {
-        address: config.address,
-        telephone: config.telephone,
-        email: config.email
-    };
-
-    $rootScope.now = {
-        year: new Date().getFullYear()
-    };
-
     $http.defaults.headers.common["Accept"] = "application/json";
 });
 
 require("./api/api")(app);
 require("./services/io")(app);
 require("./ui/menu")(app);
+require("./ui/breadcrumbs")(app);
 require("./ui/timeline")(app);
+require("./filters/strip")(app);
+require("./filters/remove-hashtags")(app);
+require("./filters/removeNewline")(app);
 require("./filters/uppercase-first")(app);
 require("./pages/home")(app);
 require("./pages/schedule")(app);
 require("./pages/team")(app);
+require("./pages/gallery")(app);
 require("./pages/docs")(app);
+require("./controllers/ContactsController")(app);
+require("./controllers/CopyrightController")(app);
 
 app.controller("SchedulePageController", function ($scope) {
     $scope.pageClass = "page-schedule";

client/controllers/ContactsController.js

@@ -0,0 +1,7 @@
+module.exports = function (app) {
+    app.controller('ContactsController', function ($scope, config) {
+        $scope.address = config.address;
+        $scope.telephone = config.telephone;
+        $scope.email = config.email;
+    });
+};

client/controllers/CopyrightController.js

@@ -0,0 +1,10 @@
+module.exports = function (app) {
+    app.controller('CopyrightController', function ($scope, $rootScope) {
+        $scope.developer = true;
+        $scope.now = new Date().getFullYear();
+
+        $rootScope.$on('$routeChangeSuccess', function (event, current) {
+            $scope.developer = current['$$route'].originalPath == '/';
+        });
+    });
+};

client/data.js

@@ -14,8 +14,11 @@ angular.module("hudozhka.data", [])
     })
     .service("config", function(){
         return {
-            telephone: "8 (81362) 76-312",
+            telephone: "+7 (81362) 76-312",
             email: "hudozka@gmail.com",
-            address: "г. Шлиссельбург, ул. 18-го января, д. 3"
+            address: ["г. Шлиссельбург", "ул. 18 января", "д. 3"]
+                .reduce(function(address, item){
+                    return address + (address == '' ? '' : ' ') + item.replace(' ', String.fromCharCode(0xA0));
+                }, '')
         };
     });

client/filters/remove-hashtags.js

@@ -0,0 +1,11 @@
+/**
+ * Created by tmshv on 21/11/14.
+ */
+
+module.exports = function(app) {
+    app.filter("removeHashtags", function () {
+        return function(string) {
+            return string.replace(/(#[^\s]+)/g, '');
+        };
+    });
+};

client/filters/removeNewline.js

@@ -0,0 +1,11 @@
+/**
+ * Created by tmshv on 21/11/14.
+ */
+
+module.exports = function(app) {
+    app.filter("removeNewline", function () {
+        return function(string) {
+            return string.replace(/(\n)/g, ' ');
+        };
+    });
+};

client/filters/strip.js

@@ -0,0 +1,13 @@
+/**
+ * Created by tmshv on 21/11/14.
+ */
+
+module.exports = function(app) {
+    app.filter("strip", function () {
+        return function(string) {
+            return string
+                .replace(/^\s+/, '')
+                .replace(/\s+$/, '');
+        };
+    });
+};

client/pages/gallery.js

@@ -0,0 +1,114 @@
+module.exports = function (app) {
+    app.directive("gFotorama", function () {
+        return {
+            restrict: "A",
+            link: function (scope, element, attrs) {
+                element.addClass('fotorama');
+                var $fotorama = $(element.fotorama());
+                var fotorama = $fotorama.data('fotorama');
+                fotorama.setOptions({
+                    width: "100%",
+                    maxheight: 500,
+                    loop: true,
+                    nav: "thumbs"
+                });
+
+                //$fotorama.on('fotorama:show', function (e, fotorama, extra) {
+                $fotorama.on('fotorama:error', function (e, fotorama, extra) {
+                    console.log('## ' + e.type);
+                    console.log('active frame', fotorama.activeFrame);
+                    console.log('additional data', extra);
+                });
+
+                scope.$watch(attrs.gFotorama, function (value) {
+                    console.log(value);
+                    fotorama.load(value);
+                });
+            }
+        }
+    });
+
+    app.controller("GalleryPageController", function ($scope, api) {
+            $scope.years = [];
+            var years = [2015, 2014, 2013, 2012, 2011, 2010];
+            years.forEach(function (year, year_index) {
+                api.gallery.year(year)
+                    .success(function (albums) {
+                        if (albums.length) {
+                            $scope.years[year_index] = {
+                                year: year,
+                                albums: albums.map(function (album) {
+                                    var preview = album.content[0];
+                                    album.preview_url = preview.content.medium.url;
+                                    //album.fotorama = album.content.map(productToFotorama);
+
+                                    return album;
+                                })
+                            };
+                        }
+                    })
+            });
+        }
+    );
+
+    app.controller("AlbumPageController", function ($scope, $rootScope, $http, $routeParams, team, api, menu) {
+        menu.activate('/gallery');
+
+        var year_uri = $routeParams.year;
+        var course_uri = $routeParams.course;
+        var album_uri = $routeParams.album;
+        api.gallery.album(
+            year_uri,
+            course_uri,
+            album_uri
+        )
+            .success(function (album) {
+                //var preview = album.content[0];
+                //album.preview_url = preview.content.medium.url;
+                //album.fotorama = album.content.map(productToFotorama);
+
+                album.teacherName = team.name(album['teacher']);
+
+                $scope.album = album;
+                $scope.crumbs = [
+                    {
+                        url: '/gallery',
+                        name: 'Галерея'
+                    },
+                    {
+                        //url: '/gallery/{year}'.replace('{year}', year_uri),
+                        name: year_uri
+                    },
+                    {
+                        //url: '/gallery/{year}/{course}'
+                        //    .replace('{year}', year_uri)
+                        //    .replace('{course}', course_uri),
+                        name: album.course
+                    },
+                    {
+                        name: album.title
+                    }
+                ];
+                $rootScope.title = album.title;
+            });
+    });
+};
+
+function productToFotorama(product) {
+    //var tpl =  '<div class="album-item"><div><p>' + product.author + '</p><p>' + product.authorAge  + ' лет</p></div></div>';
+
+    var $e = $('<div class="album-item"><div></div></div>');
+    var $c = $e.find('.album-item div');
+    $('<p></p>').text(product.author).appendTo($c);
+    if (product['authorAge']) {
+        $('<p></p>').text(product['authorAge'] + ' лет').appendTo($c);
+    }
+
+    return {
+        img: product.content["big"].url,
+        thumb: product.content["small"].url,
+        full: product.content["original"].url,
+        //html: $.parseHTML(tpl)[0]
+        html: $e
+    };
+}

client/pages/home.js

@@ -4,8 +4,26 @@
 
 module.exports = function (app) {
     app.controller("HomePageController", function ($scope, config) {
+        var fotorama;
+
         $scope.pageClass = "page-home";
 
-        $(".fotorama").fotorama();
+        var $tape = $('.tape-block');
+        var $fotorama = $('.fotorama');
+
+        $tape.addClass('simplified');
+        $fotorama.on('fotorama:ready', function () {
+            $tape.removeClass('simplified');
+            fotorama.setOptions({
+                nav: 'dots'
+            });
+        });
+
+        fotorama = $fotorama.fotorama().data('fotorama');
+        fotorama.load([
+            {img: 'http://static.shburg.org/art/img/cat1.jpg'},
+            {img: 'http://static.shburg.org/art/img/cat2.jpg'},
+            {img: 'http://static.shburg.org/art/img/cat3.jpg'}
+        ]);
     });
 };

client/ui/breadcrumbs.js

@@ -0,0 +1,11 @@
+module.exports = function(app) {
+    app.directive('breadcrumbs', function () {
+        return {
+            restrict: 'E',
+            templateUrl: '/views/breadcrumbs.html',
+            scope: {
+                crumbs: '='
+            }
+        };
+    });
+};

client/ui/menu.js

@@ -2,30 +2,45 @@
  * Created by tmshv on 05/11/14.
  */
 
-var menu = require("../../models/menu.json");
+module.exports = function (app) {
+    app.factory("menu", function ($route, $rootScope) {
+        function Menu() {
+            this.items = require("../../models/menu.json");
+            this.current = null;
+        }
 
-module.exports = function(app) {
+        Menu.prototype.activate = function (path) {
-    app.service("menu", function ($route) {
+            var f = this.items.filter(function (i) {
-        menu.isActive = function (path) {
+                return i.url === path;
-            if ($route.current && $route.current.regexp) {
+            });
-                return $route.current.regexp.test(path);
+
+            if(f.length) {
+                this.current = f[0];
             }
-            return false;
         };
 
+        var menu = new Menu();
+        $rootScope.$on('$routeChangeSuccess', function (event, current) {
+            var path = current['$$route'].originalPath;
+            menu.activate(path);
+        });
+
         return menu;
     });
 
     app.controller("MenuController", function ($scope, menu) {
-        $scope.vkgroup = menu.vkgroup;
+        $scope.menu = menu;
-        $scope.menu = menu.menu;
 
-        $scope.isCurrent = function(item) {
+        $scope.isActive = function (item) {
-            return menu.isActive(item.url);
+            if(menu.current) {
+                return item.url == menu.current.url;
+            }else{
+                return false;
+            }
         };
 
-        $scope.isValid = function(item) {
+        $scope.isValid = function (item) {
-            return Boolean(item.url);
+            return 'url' in item;
         };
     });
 };

client/ui/timeline.js

@@ -37,7 +37,7 @@ module.exports = function(app) {
                 image: post.data.image.standard_resolution.url,
                 url: post.data.url,
                 username: name,
-                //userpic: post.data.user.profile_picture,
+                userpic: 'https://igcdn-photos-a-a.akamaihd.net/hphotos-ak-xaf1/t51.2885-19/11357496_464997000344800_2124591831_a.jpg',
                 text: post.body,
                 //text: postText(post),
                 type: post.type
@@ -67,6 +67,11 @@ module.exports = function(app) {
                     return i['type'];
                 };
 
+                $scope.showFooter = function () {
+                    var canLoadMore = true;
+                    return $scope.feed && $scope.feed.length && canLoadMore;
+                };
+
                 $scope.loadNext = function () {
                     $scope.timelineUpdating = true;
                     usSpinnerService.spin("timelineMore");
@@ -78,9 +83,6 @@ module.exports = function(app) {
                         .success(function (list) {
                             $scope.timelineUpdating = false;
                             usSpinnerService.stop("timelineMore");
-                            //$timeout(function () {
-                            //
-                            //}, 5000);
 
                             var feed = list.map(function (post) {
                                 if(post.type == "instagram") return toInstagram(post);
@@ -96,7 +98,6 @@ module.exports = function(app) {
 
                 io.on("post", function (params) {
                     var posts = params instanceof Array ? params : [params];
-                    console.log("post", posts);
 
                     var feed = posts.map(function (post) {
                         if(post.type == "instagram") return toInstagram(post);

config.js

@@ -1,4 +1,5 @@
 var fs = require("fs");
+var path = require("path");
 const MENU = require("./models/menu.json");
 
 const team = require("./models/team");
@@ -9,24 +10,42 @@ const schedule = require("./models/schedule");
 var privateFile = process.env["PRIVATE"] || "private.json";
 var privateData = JSON.parse(fs.readFileSync(privateFile, "utf-8"));
 
-var config = {
+var index_file = process.env["INDEX"] || "templates/main.html";
-	defaultIndex: "/templates/index.html" || process.env["INDEX"],
-	port: process.env["PORT"] || 3000,
-	pub: "./",
-	data: {
-		menu: MENU,
-		documents: document.docs,
-		team: team.team,
-		courses: course.courses
-	},
 
-	db: {
+var config = {
-		uri: "mongodb://localhost:27017/hudozka"
+    defaultIndex: path.join(__dirname, index_file),
-	}
+    port: process.env["PORT"] || 3000,
+    pub: "./",
+    data: {
+        menu: MENU,
+        documents: document.docs,
+        team: team.team,
+        courses: course.courses
+    },
+
+    db: {
+        uri: "mongodb://localhost:27017/hudozka"
+    },
+
+    prerender: {
+        prerender: "http://service.prerender.io/",
+        prerenderToken: "",
+        protocol: "http",
+        host: "art.shlisselburg.org"
+    },
+
+    instagram: {
+        default_user: "hudozka",
+        tag_callback: "http://art.shlisselburg.org/instagram/callback/11",
+        client_id: "",
+        client_secret: "",
+        redirect_uri: "http://art.shlisselburg.org/instagram/auth/callback",
+        tags: ["shlb_hudozka"]
+    }
 };
 
 module.exports = Object.keys(privateData)
-	.reduce(function (config, key) {
+    .reduce(function (config, key) {
-		config[key] = privateData[key];
+        config[key] = privateData[key];
-		return config;
+        return config;
-	}, config);
+    }, config);

deploy.sh

@@ -15,8 +15,8 @@ env GZIP=-9 tar -czf $tarpath \
 echo "build file: $tarpath"
 
 ssh shburg.et "rm -rf art/*"
-scp $tarpath shburg@37.139.6.120:~
+scp $tarpath shburg@146.185.183.243:~
-scp install.sh shburg@37.139.6.120:~
+scp install.sh shburg@146.185.183.243:~
 ssh shburg.et "./install.sh"
 rm $tarpath
 echo "art.shlisselburg.org deployment completed successfully"

gulpfile.js

@@ -27,6 +27,12 @@ gulp.task("copy", function(){
 
 	gulp.src("./3rdparty/*")
 		.pipe(gulp.dest("./public"));
+
+	gulp.src("robots.txt")
+		.pipe(gulp.dest("./public"));
+
+	gulp.src("sitemap.xml")
+		.pipe(gulp.dest("./public"));
 });
 
 gulp.task("compile", function(){

models/menu.json

@@ -1,33 +1,34 @@
-{
+[
-	"menu": [
+  {
-		  {
+    "text": "Школа",
-				"text": "Школа",
+    "url": "/",
-				"url": "/",
+    "color": "blue"
-				"color": "blue"
+  },
-		  },
+  {
-		  {
+    "text": "События"
-				"text": "Расписание",
+  },
-				"url": "/schedule",
+  {
-				"color": "green"
+    "text": "Расписание",
-		  },
+    "url": "/schedule",
-		  {
+    "color": "green"
-				"text": "Занятия",
+  },
-				"color": ""
+  {
-		  },
+    "text": "Занятия",
-		  {
+    "color": ""
-				"text": "Коллектив",
+  },
-				"url": "/team",
+  {
-				"color": "pink"
+    "text": "Коллектив",
-		  },
+    "url": "/team",
-		  {
+    "color": "pink"
-				"text": "Галерея",
+  },
-				"color": ""
+  {
-		  },
+    "text": "Галерея",
-		  {
+    "url": "/gallery",
-				"text": "Документы",
+    "color": "red"
-				"url": "/docs",
+  },
-				"color": "yellow"
+  {
-		  }
+    "text": "Документы",
-	],
+    "url": "/docs",
-	"vkgroup": "https://vk.com/club10436104"
+    "color": "yellow"
-}
+  }
+]

package.json

@@ -27,7 +27,7 @@
     "koa-useragent": "0.0.5",
     "koa.io": "0.0.3",
     "mz": "^1.3.0",
-    "promised-mongo": "^0.11.1",
+    "promised-mongo": "git+https://git@github.com/tmshv/promised-mongo",
     "thunkify": "^2.1.2"
   },
   "devDependencies": {

robots.txt

@@ -0,0 +1,7 @@
+User-agent: *
+Disallow: 
+Allow: /
+Host: art.shlisselburg.org
+Sitemap: http://art.shlisselburg.org/sitemap.xml
+Crawl-delay: 3
+Crawl-rate: 1/3

routes/gallery.js

@@ -0,0 +1,83 @@
+/**
+ * Created by tmshv on 22/11/14.
+ */
+
+var co = require("co");
+var route = require("koa-route");
+var router = require("./");
+var db = require("../core/db");
+
+module.exports = function (app) {
+    app.use(route.get("/gallery", router.accepts({
+        "text/html": router.index(),
+        "text/plain": router.index(),
+        "application/json": function *() {
+            var query = {};
+            var albums = yield db.c("albums")
+                .find(query)
+                .toArray();
+
+            albums = yield albums.map(processAlbum);
+            this.body = albums;
+        }
+    })));
+
+    app.use(route.get("/gallery/:year", router.accepts({
+        "text/html": router.index(),
+        "text/plain": router.index(),
+        "application/json": function *(year) {
+            year = parseInt(year);
+            var start = new Date(year, 0, 1);
+            var end = new Date(year, 11, 31);
+            var query = {
+                date: {$gte: start, $lt: end}
+            };
+            var albums = yield db.c("albums")
+                .find(query)
+                .toArray();
+
+            albums = yield albums.map(processAlbum);
+            this.body = albums;
+        }
+    })));
+
+    app.use(route.get("/gallery/:year/:course/:album", router.accepts({
+        "text/html": router.index(),
+        "text/plain": router.index(),
+        "application/json": function *(year, course, album) {
+            year = parseInt(year);
+            course = '/' + course;
+            album = '/' + album;
+            var start = new Date(year, 0, 1);
+            var end = new Date(year, 11, 31);
+            var query = {
+                date: {$gte: start, $lt: end},
+                course_uri: course,
+                uri: album
+            };
+
+            var a = yield db.c("albums").findOne(query);
+            a = yield processAlbum(a);
+            this.body = a;
+        }
+    })));
+};
+
+function processAlbum(album) {
+    return co(function *() {
+        album.url = '/gallery/{year}{course}{album}'
+            .replace('{year}', album.date.getFullYear())
+            .replace('{course}', album.course_uri)
+            .replace('{album}', album.uri);
+
+        album.content = yield album.content.map(function (product_id) {
+            return co(function *() {
+                var product = yield db.c("products").findOne({_id: product_id});
+                if (product) return product;
+                else return null;
+            });
+        });
+
+        return album;
+    });
+}

routes/index.js

@@ -17,18 +17,16 @@ function accepts(routes, def) {
         if (types.length) {
             var type = types[0];
             yield routes[type].apply(this, arguments);
-        } else if(def){
+        } else if (def) {
             yield def;
-        }else{
+        } else {
             this.status = 406;
         }
     };
 }
 
 function index(filename) {
-    if (!filename){
+    if (!filename) filename = config['defaultIndex'];
-        filename = path.join(__dirname, "..", config.defaultIndex);
-    }
 
     return function *() {
         this.type = "text/html";

server.js

@@ -28,20 +28,20 @@ app.use(serve(path.join(__dirname, "templates")));
 app.use(helmet.defaults());
 
 app.use(function *(next) {
-	var q = this.query;
+    var q = this.query;
-	this.query = Object.keys(q)
+    this.query = Object.keys(q)
-		.reduce(function (q, key) {
+        .reduce(function (q, key) {
-			var v = q[key];
+            var v = q[key];
-			if(v === "true"){
+            if (v === "true") {
-				v = true;
+                v = true;
-			}else if(v === "false"){
+            } else if (v === "false") {
-				v = false;
+                v = false;
-			}
+            }
-			q[key] = v;
+            q[key] = v;
-			return q;
+            return q;
-		}, q);
+        }, q);
 
-	yield next;
+    yield next;
 });
 
 app.use(route.get("/", routes.index()));
@@ -49,32 +49,18 @@ app.use(route.get("/team", routes.index()));
 app.use(route.get("/docs", routes.index()));
 
 app.use(route.get("/document/:doc", routes.index(
-	path.join(__dirname, "templates/document.html")
+    path.join(__dirname, "templates/document.html")
 )));
 
 require("./routes/schedule")(app);
 require("./routes/news")(app);
-
+require("./routes/gallery")(app);
-require("./routes/404")(app);
 
 require("./instagram/router")(app);
 require("./instagram/io")(app);
 
-if (process.env["NODE_ENV"] === "development") {
+require("./routes/404")(app);
-	app.use(route.get("/debug", function *() {
-		var out = {};
-		out.ip = this.ip;
-		out.host = this.host;
-		out.headers = this.headers;
-		out.protocol = this.protocol;
-		out.query = this.query;
-		out.url = this.url;
-
-		this.type = "application/json";
-		this.body = out;
-	}));
-}
 
 module.exports = function (port) {
-	app.listen(port);
+    return app;
 };

sitemap.xml

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+	<url>
+		<loc>http://art.shlisselburg.org</loc>
+		<changefreq>daily</changefreq>
+	</url>
+
+	<url>
+		<loc>http://art.shlisselburg.org/schedule</loc>
+		<changefreq>weekly</changefreq>
+	</url>
+	
+	<url>
+		<loc>http://art.shlisselburg.org/team</loc>
+		<changefreq>montly</changefreq>
+	</url>	
+
+	<url>
+		<loc>http://art.shlisselburg.org/gallery</loc>
+		<changefreq>weekly</changefreq>
+	</url>
+	
+	<url>
+		<loc>http://art.shlisselburg.org/docs</loc>
+		<changefreq>weekly</changefreq>
+	</url>
+</urlset>

templates/main-dev.html

@@ -29,21 +29,34 @@
     <script src="/app.js"></script>
 </head>
 <body>
-<div class="menu" ng-controller="MenuController">
+<div class="wrapper">
-    <ul>
+    <header>
-        <li ng-repeat="item in menu" class="{{item.color}}" ng-class="{selected:isCurrent(item)}">
+        <nav role="navigation" ng-controller="MenuController">
-            <span ng-hide="isValid(item)">{{item.text}}</span>
+            <ul>
-            <a href="{{item.url}}" ng-show="isValid(item)">{{item.text}}</a>
+                <li ng-repeat="item in menu.items" class="{{item.color}}" ng-class="{selected: isActive(item)}">
-        </li>
+                    <span ng-hide="isValid(item)">{{item.text}}</span>
-        <!--<a href="{{vkgroup}}" class="vk"><img src="/graphics/icon.vk.png"></a>-->
+                    <a href="{{item.url}}" ng-show="isValid(item)">{{item.text}}</a>
-    </ul>
+                </li>
-</div>
+            </ul>
+        </nav>
+    </header>
 
-<div class="page {{pageClass}}" ng-view></div>
+    <div class="content">
+        <div class="page {{pageClass}}" ng-view autoscroll="true"></div>
+    </div>
 
-<footer>
+    <footer>
-    <div class="footer-content">
         <div class="info-block">
+            <div>
+                <h4>Документы</h4>
+                <ul>
+                    <li><a target="_blank" href="/document/edu-license">Лицензия на осуществление образовательной деятельности</a></li>
+                    <li><a target="_blank" href="/document/gov-certificate">Свидетельство о государственной регистрации права</a></li>
+                    <li><a target="_blank" href="/document/EGRYL1">Свидетельство о внесении в «ЕГРЮЛ»</a></li>
+                    <li><a target="_blank" href="/document/VAT">ИНН</a></li>
+                    <li><a target="_blank" href="/document/statue-2013">Устав школы</a></li>
+                </ul>
+            </div>
             <div>
                 <h4>Ссылки на образовательные сайты</h4>
                 <ul>
@@ -58,29 +71,22 @@
                     <li><a href="http://kirovskdmh.ucoz.ru">kirovskdmh.ucoz.ru</a> — Музыкальная школа Кировска</li>
                 </ul>
             </div>
+        </div>
 
+        <div class="contacts" ng-controller="ContactsController">
             <div>
-                <h4>Документы</h4>
+                <h4>Контактная информация</h4>
-                <ul>
+                <p>Адрес: {{address}}</p>
-                    <li><a target="_blank" href="/document/edu-license">Лицензия на осуществление образовательной деятельности</a></li>
+                <p>Телефон: {{telephone}}</p>
-                    <li><a target="_blank" href="/document/gov-certificate">Свидетельство о государственной регистрации права</a></li>
+                <p>Почта: <a href="mailto:{{email}}">{{email}}</a></p>
-                    <li><a target="_blank" href="/document/EGRYL1">Свидетельство о внесении в «ЕГРЮЛ»</a></li>
-                    <li><a target="_blank" href="/document/VAT">ИНН</a></li>
-                    <li><a target="_blank" href="/document/statue-2013">Устав школы</a></li>
-                </ul>
             </div>
         </div>
 
-        <div class="info-block">
+        <div class="copyright" ng-controller="CopyrightController">
-            <div>
+            <span>©&nbsp;2014...{{now}} Художественная&nbsp;школа&nbsp;Шлиссельбурга</span>
-                <p>© 2014...{{now.year}}</p>
+            <span ng-show="developer">Разработка и поддержка сайта — <a href="tmshv.ru?utm_source=artshburg&utm_medium=developer&utm_campaign=tmshv_ru">www.tmshv.ru</a></span>
-                <p>Художественная школа Шлиссельбурга</p>
-                <p>Адрес: {{contact.address}}</p>
-                <p>Телефон: {{contact.telephone}}</p>
-                <p>Почта: <a href="mailto:{{contact.email}}">{{contact.email}}</a></p>
-            </div>
         </div>
-    </div>
+    </footer>
-</footer>
+</div>
 </body>
 </html>

templates/main.html

@@ -46,21 +46,34 @@
     </script>
 </head>
 <body>
-<div class="menu" ng-controller="MenuController">
+<div class="wrapper">
-    <ul>
+    <header>
-        <li ng-repeat="item in menu" class="{{item.color}}" ng-class="{selected:isCurrent(item)}">
+        <nav role="navigation" ng-controller="MenuController">
-            <span ng-hide="isValid(item)">{{item.text}}</span>
+            <ul>
-            <a href="{{item.url}}" ng-show="isValid(item)">{{item.text}}</a>
+                <li ng-repeat="item in menu.items" class="{{item.color}}" ng-class="{selected: isActive(item)}">
-        </li>
+                    <span ng-hide="isValid(item)">{{item.text}}</span>
-        <!--<a href="{{vkgroup}}" class="vk"><img src="/graphics/icon.vk.png"></a>-->
+                    <a href="{{item.url}}" ng-show="isValid(item)">{{item.text}}</a>
-    </ul>
+                </li>
-</div>
+            </ul>
+        </nav>
+    </header>
 
-<div class="page {{pageClass}}" ng-view></div>
+    <div class="content">
+        <div class="page {{pageClass}}" ng-view autoscroll="true"></div>
+    </div>
 
-<footer>
+    <footer>
-    <div class="footer-content">
         <div class="info-block">
+            <div>
+                <h4>Документы</h4>
+                <ul>
+                    <li><a target="_blank" href="/document/edu-license">Лицензия на осуществление образовательной деятельности</a></li>
+                    <li><a target="_blank" href="/document/gov-certificate">Свидетельство о государственной регистрации права</a></li>
+                    <li><a target="_blank" href="/document/EGRYL1">Свидетельство о внесении в «ЕГРЮЛ»</a></li>
+                    <li><a target="_blank" href="/document/VAT">ИНН</a></li>
+                    <li><a target="_blank" href="/document/statue-2013">Устав школы</a></li>
+                </ul>
+            </div>
             <div>
                 <h4>Ссылки на образовательные сайты</h4>
                 <ul>
@@ -75,29 +88,22 @@
                     <li><a href="http://kirovskdmh.ucoz.ru">kirovskdmh.ucoz.ru</a> — Музыкальная школа Кировска</li>
                 </ul>
             </div>
+        </div>
 
+        <div class="contacts" ng-controller="ContactsController">
             <div>
-                <h4>Документы</h4>
+                <h4>Контактная информация</h4>
-                <ul>
+                <p>Адрес: {{address}}</p>
-                    <li><a target="_blank" href="/document/edu-license">Лицензия на осуществление образовательной деятельности</a></li>
+                <p>Телефон: {{telephone}}</p>
-                    <li><a target="_blank" href="/document/gov-certificate">Свидетельство о государственной регистрации права</a></li>
+                <p>Почта: <a href="mailto:{{email}}">{{email}}</a></p>
-                    <li><a target="_blank" href="/document/EGRYL1">Свидетельство о внесении в «ЕГРЮЛ»</a></li>
-                    <li><a target="_blank" href="/document/VAT">ИНН</a></li>
-                    <li><a target="_blank" href="/document/statue-2013">Устав школы</a></li>
-                </ul>
             </div>
         </div>
 
-        <div class="info-block">
+        <div class="copyright" ng-controller="CopyrightController">
-            <div>
+            <span>©&nbsp;2014...{{now}} Художественная&nbsp;школа&nbsp;Шлиссельбурга</span>
-                <p>© 2014...{{now.year}}</p>
+            <span ng-show="developer">Разработка и поддержка сайта — <a href="http://tmshv.ru?utm_source=artshburg&utm_medium=developer&utm_campaign=tmshv_ru">www.tmshv.ru</a></span>
-                <p>Художественная школа Шлиссельбурга</p>
-                <p>Адрес: {{contact.address}}</p>
-                <p>Телефон: {{contact.telephone}}</p>
-                <p>Почта: <a href="mailto:{{contact.email}}">{{contact.email}}</a></p>
-            </div>
         </div>
-    </div>
+    </footer>
-</footer>
+</div>
 </body>
 </html>

templates/views/breadcrumbs.html

@@ -0,0 +1,8 @@
+<nav class="breadcrumbs">
+    <ul>
+        <li ng-repeat="i in crumbs">
+            <a ng-show="i.url" href="{{i.url}}">{{i.name}}</a>
+            <span ng-hide="i.url">{{i.name}}</span>
+        </li>
+    </ul>
+</nav>

templates/views/docs.html

@@ -1,10 +1,11 @@
-<div class="main" ng-controller="DocumentsController">
+<div class="documents-block"  ng-controller="DocumentsController">
-    <div class="docblock"><h2>Лицензии, свидетельства и уставы</h2>
+    <div class="doc" ng-repeat="doc in documents">
-        <div class="doc" ng-repeat="doc in documents">
+        <a href="{{doc.url}}" target="_blank" class="invisible">
-            <a href="{{doc.url}}" target="_blank">
+            <img ng-src="{{doc.preview}}">
-                <img ng-src="{{doc.preview}}">
+        </a>
-                <span>{{doc.title | uppercaseFirst}}</span>
+
-            </a>
+        <p>
-        </div>
+            <a href="{{doc.url}}" target="_blank">{{doc.title | uppercaseFirst}}</a>
+        </p>
     </div>
 </div>

templates/views/gallery-album.html

@@ -0,0 +1,27 @@
+<breadcrumbs crumbs="crumbs"></breadcrumbs>
+
+<div class="album-block" ng-controller="AlbumPageController">
+    <h3>{{album.title}}</h3>
+
+    <div class="album" ng-show="album">
+        <div class="album-info">
+            <p>Предмет: {{album.course}}</p>
+            <p>Преподаватель: {{album.teacherName}}</p>
+            <p class="description" ng-show="album.description">{{album.description}}</p>
+        </div>
+
+        <div class="album-item" ng-repeat="product in album.content">
+            <img ng-src="{{product.content.big.url}}" alt=""/>
+
+            <div class="product-info">
+                <div>
+                    <p ng-show="product.title" class="title">{{product.title | removeNewline}}</p>
+
+                    <p>{{product.author}}</p>
+
+                    <p ng-show="product.authorAge">{{product.authorAge}} лет</p>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

templates/views/gallery.html

@@ -0,0 +1,22 @@
+<div class="gallery-block" ng-controller="GalleryPageController">
+
+    <div class="gallery-period" ng-repeat="period in years">
+        <p class="period">{{period.year}}</p>
+        <div><div class="gallery-album" ng-repeat="album in period.albums">
+            <h3><a href="{{album.url}}">{{album.title}}</a></h3>
+            <a href="{{album.url}}" class="invisible">
+                <img ng-src="{{album.preview_url}}" alt=""/>
+            </a>
+            <p>{{album.course}}</p>
+        </div></div>
+    </div>
+
+
+    <!--<div class="gallery-album" ng-repeat="album in albums">-->
+        <!--<h3><a href="{{album.url}}">{{album.title}}</a></h3>-->
+        <!--<a href="{{album.url}}" class="invisible">-->
+            <!--<img ng-src="{{album.preview_url}}" alt=""/>-->
+        <!--</a>-->
+        <!--<p>{{album.course}}</p>-->
+    <!--</div>-->
+</div>

templates/views/home.html

@@ -1,7 +1,7 @@
 <div class="main-block">
-    <div>
+    <!--<div>-->
         <!--&lt;!&ndash;<a href="tel://{{telephone}}"></a>&ndash;&gt;-->
-        <span class="telephone">{{contact.telephone}}</span>
+        <!--<span class="telephone">{{contact.telephone}}</span>-->
 
         <!--&lt;!&ndash;<ul class="submenu">&ndash;&gt;-->
             <!--&lt;!&ndash;<li><a href="/team#director">директор</a><p>М. Г. Тимашева</p></li>&ndash;&gt;-->
@@ -9,7 +9,7 @@
             <!--&lt;!&ndash;<li><a href="/contacts">контактная информация</a></li>&ndash;&gt;-->
             <!--&lt;!&ndash;<li><a href="/awards">награды</a></li>&ndash;&gt;-->
         <!--&lt;!&ndash;</ul>&ndash;&gt;-->
-    </div>
+    <!--</div>-->
 
     <h1>Шлиссельбургская детская художественная&nbsp;школа</h1>
 </div>
@@ -24,13 +24,11 @@
         <div class="fotorama"
              data-transition="crossfade"
              data-autoplay="6000"
+             data-nav="false"
              data-arrows="false"
              data-width="100%"
              data-fit="cover"
              data-loop="true">
-            <img src="http://static.shburg.org/art/img/cat1.jpg" alt="">
-            <img src="http://static.shburg.org/art/img/cat2.jpg" alt="">
-            <img src="http://static.shburg.org/art/img/cat3.jpg" alt="">
         </div>
     </div>
 </div>

templates/views/timeline-gram.html

@@ -1,15 +1,16 @@
-<div class="head">
+<div class="instagram">
-    <div class="user">
+    <div class="head">
-        <img ng-src="{{post.userpic}}" alt=""/>
+        <p class="date">{{post.date | date : "dd.MM.yyyy"}}</p>
-        <span>{{post.username}}</span>
+        <div class="user">
+            <img ng-src="{{post.userpic}}" alt=""/>
+            <span>{{post.username}}</span>
+        </div>
     </div>
-    <p class="date">{{post.date | date : "dd.MM.yyyy"}}</p>
-</div>
 
-<div class="body">
+    <div class="body">
-    <!--<h2>Рисунок</h2>-->
+        <a href="{{post.url}}" target="_blank" class="invisible">
-    <p>{{post.text}}</p>
+            <img ng-src="{{post.image}}" alt="">
-    <a href="{{post.url}}" target="_blank">
+        </a>
-        <img ng-src="{{post.image}}" alt="">
+        <p>{{post.text | removeHashtags | strip}}</p>
-    </a>
+    </div>
 </div>

templates/views/timeline-post.html

@@ -1,9 +1,9 @@
 <div class="head">
-    <a name="{{post.uri}}"></a>
+    <div>
-
+        <p class="date"><a href="#{{post.uri}}">{{post.date | date : "dd.MM.yyyy"}}</a></p>
+    </div>
 </div>
 
 <div class="body">
-    <div><p class="date"><a href="#{{post.uri}}">{{post.date | date : "dd.MM.yyyy"}}</a></p></div>
     <div class="message" ng-bind-html="message"></div>
 </div>

templates/views/timeline.html

@@ -5,7 +5,7 @@
                      ng-class="{left: isEven($index), right: !isEven($index)}">
 
     </timeline-record>
-    <div class="timeline-end">
+    <div class="timeline-footer" ng-show="showFooter()">
         <button class="more"
                 ng-click="loadNext()"
                 ng-disabled="timelineUpdating">