From 164975f21f84b3557185b80d736d23867ea8e210 Mon Sep 17 00:00:00 2001 From: Roman Timashev Date: Mon, 24 Nov 2014 16:40:27 +0300 Subject: [PATCH] new document views; + pdf view; documents model update --- assets/graphics/download.png | Bin 0 -> 14686 bytes assets/style/docs.scss | 1 - assets/style/document.scss | 122 ++++++++++++++------------- assets/style/pdf.scss | 2 +- client/document.js | 158 +++++------------------------------ client/ui/doc-controller.js | 52 ++++++++++++ client/ui/pdf.js | 148 ++++++++++++++++++++++++++++++++ models/documents.json | 68 +++++++-------- views/document-image.html | 1 + views/document-paper.html | 1 + views/document.html | 28 +++++-- views/pdf.html | 3 + 12 files changed, 349 insertions(+), 235 deletions(-) create mode 100644 assets/graphics/download.png create mode 100644 client/ui/doc-controller.js create mode 100644 client/ui/pdf.js create mode 100644 views/document-image.html create mode 100644 views/document-paper.html create mode 100644 views/pdf.html diff --git a/assets/graphics/download.png b/assets/graphics/download.png new file mode 100644 index 0000000000000000000000000000000000000000..ea2552b006028b1425fb0c517b93c5c7b1c5538a GIT binary patch literal 14686 zcmeI3TWB0r7{{lz(I(QO*isRZ>9(TL?#^W|$qu_4;%;gJoit6hbPHlTJ99P}vO6=* z%w{(MK`IECBCQ>>ZPUhp&-QzzWC5arIZ$F5fxe=jAv#xyWeg$J+1Wd zENte>IsgCno%x;1&dVH~7=M0K-(!6Y!)zKG%}wI#HvHYP@qYZb^z|p3@uk-qJ?Jn@ zWQX@%SO0iuj$sC$(enkjAn%b>vl3A>vxp+~iiOn-lNzd9iaLv2wuq*6BOSVN>YEU& zYw6H|xXjB|7R~6R3pScs7|*KoP3E8*B{=0dD5 zac9$^VXq)tkSExzX(KisNrY8ih_M67h!9TqFHs*p^#Uo`Dxr&#cCEZoCZ5gk*g~fCq#Izn@Llf9;<4X{h?_p zhsvme4A;Rvp{viDF|V1lo)cMa*6upqN~LRQ#~qo&2pUMcI-UHyg}6!N zm{nUvBXjsxc67UYS1+|Dr!AA$v*y@QU0=iI^#nG5DFic=!uKj=ZKSxSoj1*LCRk+? zD+t+a)?ZcZ)3T!KhR3x(#dVrmGv3OFa*B&G-iizhLRgIDg@hy~r5OJ#kJlv+k_5_* z9I~nDrTH#7qJk6?U=E<{%z<~1rnt%-Wr13dM^mMeX;&0CqgRw^#9794ifc6jWpiCg zS+i`~cvvVCO>y0tfy-ZO(wO16ilL&hTn0BpbX}8*@xjudQY?iN2|gK)#l=`Ssj0TOCSum zt+h3*rn6zw|L+6_`GI}y8nqc@+-^e!seIMiNgT7}))X5JPvbRlXS+Sf+ivVEkm9^w zfU@2`6+vtJ46Ur$)iav%4mJs|20Svwp9LYst!isk4)g_YR?AgiALacICwP~J7xs60 z4-&kvzth{Y?l*KdBR0x)Gy|7+{su?G6n<1dnM6Dujil=Hp8HG&eWHJq}uTbdM9mbhHSh zL5wLbA|fcDxF8K;OmPtrK>@`DX%J(Ii--scC@x5Y7*kwCL{LC+K^nxE;vyn~0*VXL zAjT9I5fKznT#yDarnrcRpn&3nG>9?9MMMMz6c?mHj43W6A}FA^APr(naS;(g0mTJr z5MzpqhzJTOE=YqIQ(QzuP(X1(8pN35A|iqUiVM;p#uOJ35fo5dkOncPxQK|LfZ~EQ zh%v=QL<9vC7oE1wdrr zxBhDQ^}hEu75~Ps2D0ktq|7i2PcqCauQJT7WqiHLFjbymt{r9=>0SK#q50OKbGxy2 zaV$5SumAk}4?^F1;h~=I_8r(&J~49Z(7*e>eC@;I=e~I2Z1(8qOY1({y7%GtM|K)w z|J;M$|9arhD{r1IY&`SN>%C?9g)NU>{83yUU9O+swtVx(FZ-|dFRI_3-@WwF%?mx_ zJug1~*LLf;XrJu;U}Ng3rBkOzj7w+brNUDGkx$oOxwzPSqUU div { - /* box-shadow: 1px 1px 3px 1px #333;*/ -} - -.controls { - display: inline-block; - margin-top: -4px; - /* vertical-align: middle;*/ - .block { - display: inline-block; - /* height: 100%;*/ - margin: 0px 5px; - vertical-align: middle; - } - input { - width: 30px; - height: 30px; - margin: 0 2px; - text-align: center; - font-size: .9em; - } - button { - display: inline-block; - height: 30px; - padding: 0 10px; - border-radius: 6px; - border: 2px solid #bbb; - color: #555; - background-color: white; - font-size: 1.3em; - text-align: center; - outline: none; - &:hover { - /* border: 1px solid #666;*/ - /* background-color: #eee;*/ - border: 2px solid #4d62d9; - color: #4d62d9; - } - &:active { - border: 2px solid #3d4fb2; - color: #3d4fb2; - background-color: rgba(61, 79, 178, 0.3); - } - } - a.download { - width: 22px; - height: 22px; - padding: 5px 8px; - display: inline-block; - background: #f3f3f3 url(download-icon.png) no-repeat; - background-position: 50%; - border-radius: 3px; - border: 1px solid #e0e0e0; - } -} - #page-container { background-color: #c3bfa3; transition: left 500ms; @@ -97,7 +105,7 @@ .pf { margin: 60px auto 20px; /* box-shadow: 1px 1px 3px 1px #333;*/ - box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.9); + box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.9); border-collapse: separate; } diff --git a/assets/style/pdf.scss b/assets/style/pdf.scss index 2c74b295..5eeb6b80 100644 --- a/assets/style/pdf.scss +++ b/assets/style/pdf.scss @@ -5,6 +5,7 @@ margin: 0; padding: 0; border: 0; + z-index: -1; } @media screen { @@ -62,7 +63,6 @@ position: relative; background-color: white; overflow: hidden; - margin: 0; border: 0; } diff --git a/client/document.js b/client/document.js index f5c350fc..3c61d4cf 100644 --- a/client/document.js +++ b/client/document.js @@ -1,6 +1,6 @@ var app = angular.module("document.hudozhka", ["ngRoute", "data.hudozhka"]); -app.config(function ($locationProvider, $routeProvider) { +app.config(function ($locationProvider, $sceDelegateProvider, $routeProvider) { $locationProvider.html5Mode(true); //$routeProvider // .when("/document/:doc", { @@ -9,144 +9,28 @@ app.config(function ($locationProvider, $routeProvider) { // .otherwise({ // redirectTo: "/" // }); + + $sceDelegateProvider.resourceUrlWhitelist([ + "self", + "http://static.shburg.org/**", + "http://static.shlisselburg.org/**" + ]); }); -app.controller("DocumentPageController", function ($scope, $location, docs) { +//app.factory("document", function () { +// var document; +// return { +// init:function(doc) { +// document = doc; +// }, +// +// document: document +// }; +//}); + +app.controller("DocumentPageController", function ($scope) { $scope.pageClass = "page-document"; - - var doc = $location.$$path.replace("/document/", ""); - $scope.doc = docs.doc(doc); }); -//var Doc = (function(){ -// var Document = function(baseURL){ -// this.pages = []; -// this.baseURL = baseURL; -// } -// -// Document.prototype.hasPage = function(index){ -// return index >= 0 && index < this.pages.length; -// } -// -// Document.prototype.getPageURL = function(pageNumber){ -// var s = pageNumber <2 ? "" : "/" + pageNumber; -// return this.baseURL + s; -// } -// -// Document.prototype.page = function(index){ -// return index + 1; -// } -// -// return Document; -//})(); -// -//(function(){ -// const PAGES = []; -// var currentPageIndex = 0; -// var doc = new Doc(location.pathname.replace(/\/\d+$/, "")); -// $(document).ready(function(){ -// try{ -// var hrefPage = /\/(\d+)$/.exec(location.href)[1]; -// currentPageIndex = parseInt(hrefPage) - 1; -// }catch(error){ -// -// } -// -// $("#buttonNext").click(function(event){ -// loadNext(); -// }); -// -// $("#buttonPrev").click(function(event){ -// loadPrevious(); -// }); -// -// $("#page-container .pf").each(function(index, elem){ -// var url = $(elem).data("page-url"); -// doc.pages.push(url); -// }); -// -// $("#currentPage").attr("max", doc.pages.length); -// $("#totalPages").text(doc.pages.length); -// $("#currentPage").change(function(){ -// var i = parseInt($(this).val()) - 1; -// if(i && doc.hasPage(i)){ -// loadPage(i); -// } -// }); -// -// $("#page-container").html(""); -// loadPage(currentPageIndex); -// -// window.addEventListener("popstate", function(event){ -// console.log("pops"); -// console.log(event); -// var i = event.state; -// loadPage(i); -// }); -// }); -// -// function loadNext(){ -// var i = currentPageIndex + 1; -// if(doc.hasPage(i)){ -// loadPage(i); -// }else{ -// -// } -// } -// -// function loadPrevious(){ -// var i = currentPageIndex - 1; -// if(doc.hasPage(i)){ -// loadPage(i); -// }else{ -// -// } -// } -// -// function loadPage(index){ -// if(doc.hasPage(index)){ -// var url = doc.pages[index]; -// // $.ajax( -// // url, -// -// // { -// // xhrFields: { -// // crossDomain: true, -// // withCredentials: true -// // }, -// -// // success: function(data, status){ -// // currentPageIndex = index; -// // $("#currentPage").val(doc.page(currentPageIndex)); -// // $("#page-container").html(data); -// -// // var p = doc.page(currentPageIndex); -// // console.log("look at page ", p); -// // window.history.pushState( -// // currentPageIndex, -// // "State 2013 — " + p, -// // doc.getPageURL(p) -// // ); -// // }, -// -// // error: function(xhr, aaa, error){ -// // console.log(error); -// // } -// // } -// // ); -// $.get(url, function(data){ -// currentPageIndex = index; -// $("#currentPage").val(doc.page(currentPageIndex)); -// $("#page-container").html(data); -// -// var p = doc.page(currentPageIndex); -// console.log("look at page ", p); -// window.history.pushState( -// currentPageIndex, -// "State 2013 — " + p, -// doc.getPageURL(p) -// ); -// }); -// } -// } -//})(); \ No newline at end of file +require("./ui/pdf")(app); +require("./ui/doc-controller")(app); diff --git a/client/ui/doc-controller.js b/client/ui/doc-controller.js new file mode 100644 index 00000000..682b43d1 --- /dev/null +++ b/client/ui/doc-controller.js @@ -0,0 +1,52 @@ +/** + * Created by tmshv on 24/11/14. + */ + +module.exports = function (app) { + app.controller("DocumentController", function ($scope, $location, docs) { + $scope.showControls = false; + + var doc_uri = $location.$$path.replace("/document/", ""); + $scope.document = docs.doc(doc_uri); + $scope.document.currentPage = 0; + + $scope.viewDocument = function () { + switch ($scope.document.viewer) { + case "img-sheet": + $scope.showControls = false; + return "/views/document-image.html"; + + default: + $scope.showControls = true; + return "/views/document-paper.html"; + } + }; + + $scope.totalPages = $scope.document.url.length; + $scope.currentPage = 1; + + $scope.prevPage = function () { + var i = $scope.currentPage - 1; + if (i > 0) { + $scope.currentPage = i; + $scope.document.currentPage = i - 1; + } + }; + + $scope.nextPage = function () { + var i = $scope.currentPage + 1; + if (i <= $scope.totalPages) { + $scope.currentPage = i; + $scope.document.currentPage = i - 1; + } + }; + + $scope.update = function () { + var i = $scope.currentPage; + if (i > 0 && i <= $scope.totalPages) { + $scope.currentPage = i; + $scope.document.currentPage = i - 1; + } + }; + }); +}; \ No newline at end of file diff --git a/client/ui/pdf.js b/client/ui/pdf.js new file mode 100644 index 00000000..21bc15fa --- /dev/null +++ b/client/ui/pdf.js @@ -0,0 +1,148 @@ +/** + * Created by tmshv on 24/11/14. + */ + +module.exports = function (app) { + app.directive("pdf", function () { + return { + scope: { + document: "=" + }, + templateUrl: "/views/pdf.html", + link: function (scope, element, attrs) { + + }, + + controller: function ($scope) { + var doc = $scope.document; + if (doc.extra && doc.extra.style) { + angular.element("head").append(''); + } + + $scope.$watch( + function () { + return $scope.document.currentPage; + }, + function (value) { + value = parseInt(value); + try{ + $scope.pageURL = $scope.document.url[value]; + }catch (error){ + $scope.pageURL = ""; + } + } + ); + + //const PAGES = []; + //var currentPageIndex = 0; + //var doc = new Document(location.pathname.replace(/\/\d+$/, "")); + + //$(document).ready(function(){ + // try{ + // var hrefPage = /\/(\d+)$/.exec(location.href)[1]; + // currentPageIndex = parseInt(hrefPage) - 1; + // }catch(error){ + // + // } + + //$("#buttonNext").click(function(event){ + // loadNext(); + //}); + // + //$("#buttonPrev").click(function(event){ + // loadPrevious(); + //}); + // + //$("#page-container .pf").each(function(index, elem){ + // var url = $(elem).data("page-url"); + // doc.pages.push(url); + //}); + // + //$("#currentPage").attr("max", doc.pages.length); + //$("#totalPages").text(doc.pages.length); + //$("#currentPage").change(function(){ + // var i = parseInt($(this).val()) - 1; + // if(i && doc.hasPage(i)){ + // loadPage(i); + // } + //}); + // + //$("#page-container").html(""); + //loadPage(currentPageIndex); + // + //window.addEventListener("popstate", function(event){ + // console.log("pops"); + // console.log(event); + // var i = event.state; + // loadPage(i); + //}); + //}); + + //function loadNext(){ + // var i = currentPageIndex + 1; + // if(doc.hasPage(i)){ + // loadPage(i); + // }else{ + // + // } + //} + // + //function loadPrevious(){ + // var i = currentPageIndex - 1; + // if(doc.hasPage(i)){ + // loadPage(i); + // }else{ + // + // } + //} + // + //function loadPage(index){ + // if(doc.hasPage(index)){ + // var url = doc.pages[index]; + // // $.ajax( + // // url, + // + // // { + // // xhrFields: { + // // crossDomain: true, + // // withCredentials: true + // // }, + // + // // success: function(data, status){ + // // currentPageIndex = index; + // // $("#currentPage").val(doc.page(currentPageIndex)); + // // $("#page-container").html(data); + // + // // var p = doc.page(currentPageIndex); + // // console.log("look at page ", p); + // // window.history.pushState( + // // currentPageIndex, + // // "State 2013 — " + p, + // // doc.getPageURL(p) + // // ); + // // }, + // + // // error: function(xhr, aaa, error){ + // // console.log(error); + // // } + // // } + // // ); + // $.get(url, function(data){ + // currentPageIndex = index; + // $("#currentPage").val(doc.page(currentPageIndex)); + // $("#page-container").html(data); + // + // var p = doc.page(currentPageIndex); + // console.log("look at page ", p); + // window.history.pushState( + // currentPageIndex, + // "State 2013 — " + p, + // doc.getPageURL(p) + // ); + // }); + // } + //} + } + }; + }); +}; \ No newline at end of file diff --git a/models/documents.json b/models/documents.json index 9d407089..1fe8daf2 100644 --- a/models/documents.json +++ b/models/documents.json @@ -3,47 +3,47 @@ "name": "statue-2013", "title": "устав школы за 2013 год", "path": "/document/statue-2013", - "preview": "/img/preview/statue-2013.png", + "preview": "http://static.shburg.org/art/graphics/statue-2013-preview.png", "download": "http://static.shburg.org/art/docs/hudozhka_statue-2013.pdf", "url": [ - "/f/hudozhka_statue-2013-1.page", - "/f/hudozhka_statue-2013-2.page", - "/f/hudozhka_statue-2013-3.page", - "/f/hudozhka_statue-2013-4.page", - "/f/hudozhka_statue-2013-5.page", - "/f/hudozhka_statue-2013-6.page", - "/f/hudozhka_statue-2013-7.page", - "/f/hudozhka_statue-2013-8.page", - "/f/hudozhka_statue-2013-9.page", - "/f/hudozhka_statue-2013-10.page", - "/f/hudozhka_statue-2013-11.page", - "/f/hudozhka_statue-2013-12.page", - "/f/hudozhka_statue-2013-13.page", - "/f/hudozhka_statue-2013-14.page", - "/f/hudozhka_statue-2013-15.page", - "/f/hudozhka_statue-2013-16.page", - "/f/hudozhka_statue-2013-17.page", - "/f/hudozhka_statue-2013-18.page", - "/f/hudozhka_statue-2013-19.page", - "/f/hudozhka_statue-2013-20.page", - "/f/hudozhka_statue-2013-21.page", - "/f/hudozhka_statue-2013-22.page", - "/f/hudozhka_statue-2013-23.page", - "/f/hudozhka_statue-2013-24.page", - "/f/hudozhka_statue-2013-25.page", - "/f/hudozhka_statue-2013-26.page", - "/f/hudozhka_statue-2013-27.page" + "http://static.shburg.org/art/html/hudozhka_statue-2013-1.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-2.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-3.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-4.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-5.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-6.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-7.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-8.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-9.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-10.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-11.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-12.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-13.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-14.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-15.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-16.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-17.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-18.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-19.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-20.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-21.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-22.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-23.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-24.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-25.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-26.page", + "http://static.shburg.org/art/html/hudozhka_statue-2013-27.page" ], "extra": { "style": ["http://static.shburg.org/art/docs/preview/hudozhka_statue-2013.css"] }, - "viewer": "default" + "viewer": "pdf" }, { "name": "edu-license", "title": "образовательная лицензия", "path": "/document/edu-license", - "preview": "/img/preview/license_edu.png", + "preview": "http://static.shburg.org/art/graphics/license_edu-preview.png", "url": [ "http://static.shburg.org/art/docs/hudozhka_license_edu.jpg", "http://static.shburg.org/art/docs/hudozhka_license_edu_back.jpg", @@ -55,7 +55,7 @@ "name": "gov-certificate", "title": "свидетельство о государственной регистрации права", "path": "/document/gov-certificate", - "preview": "/img/preview/certificate_gov.png", + "preview": "http://static.shburg.org/art/graphics/certificate_gov-preview.png", "url": ["http://static.shburg.org/art/docs/hudozhka_certificate_gov.jpg"], "viewer": "img-sheet" }, @@ -63,7 +63,7 @@ "name": "VAT", "title": "ИНН", "path": "/document/VAT", - "preview": "/img/preview/vatin.png", + "preview": "http://static.shburg.org/art/graphics/vatin-preview.png", "url": ["http://static.shburg.org/art/docs/hudozhka_vatin.jpg"], "viewer": "img-sheet" }, @@ -71,7 +71,7 @@ "name": "EGRYL1", "title": "свидетельство о внесении в «ЕГРЮЛ»", "path": "/document/EGRYL1", - "preview": "/img/preview/certificate_egryl1.png", + "preview": "http://static.shburg.org/art/graphics/certificate_egryl1-preview.png", "url": ["http://static.shburg.org/art/docs/hudozhka_certificate_egryl1.jpg"], "viewer": "img-sheet" }, @@ -79,7 +79,7 @@ "name": "EGRYL2", "title": "свидетельство о внесении в «ЕГРЮЛ»", "path": "/document/EGRYL2", - "preview": "/img/preview/certificate_egryl2.png", + "preview": "http://static.shburg.org/art/graphics/certificate_egryl2-preview.png", "url": ["http://static.shburg.org/art/docs/hudozhka_certificate_egryl2.jpg"], "viewer": "img-sheet" } diff --git a/views/document-image.html b/views/document-image.html new file mode 100644 index 00000000..3557469c --- /dev/null +++ b/views/document-image.html @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/views/document-paper.html b/views/document-paper.html new file mode 100644 index 00000000..b265e037 --- /dev/null +++ b/views/document-paper.html @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/views/document.html b/views/document.html index fb32e364..650c3178 100644 --- a/views/document.html +++ b/views/document.html @@ -16,21 +16,39 @@ -
+

ДХШ Шлиссельбурга , - {{doc.title}} + {{document.title}}

+ +
+
+

+ Страница + + из + {{totalPages}} +

+ +

+ + +

+ +

+ +

+
+
-
- -
+
diff --git a/views/pdf.html b/views/pdf.html new file mode 100644 index 00000000..7424b180 --- /dev/null +++ b/views/pdf.html @@ -0,0 +1,3 @@ +
+ +
\ No newline at end of file