Skip to content

Commit 41fdec0

Browse files
jashkenasjashkenas
committed
first draft of a new mini version of the docviewer for < 500px wide sizes
1 parent 669562e commit 41fdec0

10 files changed

Lines changed: 91 additions & 16 deletions

File tree

‎public/assets/templates.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/images/DV/embed/tabs-small.png‎

1.62 KB
Loading

‎public/javascripts/DV/helpers/construction.js‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ _.extend(DV.Schema.helpers, {
2222

2323
var pdfURL = doc.resources.pdf;
2424
pdfURL = pdfURL && this.viewer.options.pdf !== false ? '<a target="_blank" href="' + pdfURL + '">Original Document (PDF) &raquo;</a>' : '';
25-
25+
2626
var contributorList = '' + this.viewer.schema.document.contributor +', '+ this.viewer.schema.document.contributor_organization;
2727

2828
var showAnnotations = this.showAnnotations();
@@ -38,10 +38,17 @@ _.extend(DV.Schema.helpers, {
3838
story_url: storyURL,
3939
print_notes_url: printNotesURL,
4040
descriptionContainer: JST.descriptionContainer({ description: description}),
41-
autoZoom: this.viewer.options.zoom == 'auto'
41+
autoZoom: this.viewer.options.zoom == 'auto',
42+
mini: false
4243
};
4344

44-
if (this.viewer.options.width && this.viewer.options.height) {
45+
var width = this.viewer.options.width;
46+
var height = this.viewer.options.height;
47+
if (width && height) {
48+
if (width < 500) {
49+
this.viewer.options.mini = true;
50+
viewerOptions.mini = true;
51+
}
4552
DV.jQuery(this.viewer.options.container).css({
4653
position: 'relative',
4754
width: this.viewer.options.width,

‎public/javascripts/DV/helpers/helpers.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -473,10 +473,7 @@ DV.Schema.helpers = {
473473
var windowWidth = this.elements.window.outerWidth(true);
474474
var zoom;
475475
if (this.viewer.options.zoom == 'auto') {
476-
zoom = Math.min(
477-
700,
478-
windowWidth - (this.viewer.models.pages.REDUCED_PADDING * 2)
479-
);
476+
zoom = Math.min(700, windowWidth - (this.viewer.models.pages.getPadding() * 2));
480477
} else {
481478
zoom = this.viewer.options.zoom;
482479
}

‎public/javascripts/DV/lib/page_set.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -121,13 +121,10 @@ DV.PageSet.prototype.zoom = function(argHash){
121121

122122
// Zoom the text container.
123123
DV.PageSet.prototype.zoomText = function() {
124-
var padding = this.viewer.models.pages.DEFAULT_PADDING;
124+
var padding = this.viewer.models.pages.getPadding();
125125
var width = this.viewer.models.pages.zoomLevel;
126126
this.viewer.$('.DV-textContents').width(width - padding);
127127
this.viewer.$('.DV-textPage').width(width);
128-
if (this.viewer.options.zoom == 'auto') {
129-
padding = this.viewer.models.pages.REDUCED_PADDING;
130-
}
131128
this.viewer.elements.collection.css({'width' : width + padding});
132129
};
133130

‎public/javascripts/DV/models/page.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,9 @@ DV.model.Pages = function(viewer) {
2525
// Embed reduces padding.
2626
this.REDUCED_PADDING = 44;
2727

28+
// Mini padding, when < 500 px wide.
29+
this.MINI_PADDING = 18;
30+
2831
this.zoomLevel = this.viewer.models.document.zoomLevel;
2932
this.baseWidth = this.BASE_WIDTH;
3033
this.baseHeight = this.BASE_HEIGHT;
@@ -52,6 +55,17 @@ DV.model.Pages.prototype = {
5255
return string;
5356
},
5457

58+
// Return the appropriate padding for the size of the viewer.
59+
getPadding: function() {
60+
if (this.viewer.options.mini) {
61+
return this.MINI_PADDING;
62+
} else if (this.viewer.options.zoom == 'auto') {
63+
return this.REDUCED_PADDING;
64+
} else {
65+
return this.DEFAULT_PADDING;
66+
}
67+
},
68+
5569
// The zoom factor is the ratio of the image width to the baseline width.
5670
zoomFactor : function() {
5771
return this.zoomLevel / this.BASE_WIDTH;

‎public/javascripts/DV/views/viewer.jst‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
<!--[if lte IE 8]><div class="DV-docViewer DV-clearfix DV-viewDocument DV-ie <% if (autoZoom) { %>DV-autoZoom<% } %> <% if (!options.sidebar) { %>DV-hideSidebar<% } else { %>DV-hideFooter<% } %>"><![endif]-->
2-
<!--[if (!IE)|(gte IE 9)]><!--><div class="DV-docViewer DV-clearfix DV-viewDocument <% if (autoZoom) { %>DV-autoZoom<% } %> <% if (!options.sidebar) { %>DV-hideSidebar<% } else { %>DV-hideFooter<% } %>"><!-- <![endif]-->
1+
<!--[if lte IE 8]><div class="DV-docViewer DV-clearfix DV-viewDocument DV-ie <% if (autoZoom) { %>DV-autoZoom<% } %> <% if (mini) { %>DV-mini<% } %> <% if (!options.sidebar) { %>DV-hideSidebar<% } else { %>DV-hideFooter<% } %>"><![endif]-->
2+
<!--[if (!IE)|(gte IE 9)]><!--><div class="DV-docViewer DV-clearfix DV-viewDocument <% if (autoZoom) { %>DV-autoZoom<% } %> <% if (mini) { %>DV-mini<% } %> <% if (!options.sidebar) { %>DV-hideSidebar<% } else { %>DV-hideFooter<% } %>"><!-- <![endif]-->
33

44
<div class="DV-docViewerWrapper">
55

‎public/stylesheets/DV/components/minimode.css‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,42 @@
1717
.DV-autoZoom .DV-textPage {
1818
margin-left: 35px;
1919
}
20+
.DV-mini .DV-textPage {
21+
margin-left: 7px;
22+
}
2023

2124
.DV-autoZoom .p0,
2225
.DV-autoZoom .p1,
2326
.DV-autoZoom .p2 {
2427
padding-left: 35px;
2528
}
29+
.DV-mini .p0,
30+
.DV-mini .p1,
31+
.DV-mini .p2 {
32+
padding-left: 7px;
33+
}
34+
35+
.DV-mini .DV-controls {
36+
height: 30px;
37+
}
38+
.DV-mini .DV-header .DV-fullscreen {
39+
left: 4px; top: 3px;
40+
}
41+
.DV-mini .DV-zoomControls {
42+
margin-top: 3px;
43+
}
44+
.DV-mini .DV-docViewer-Container {
45+
top: 31px;
46+
}
47+
.DV-mini .DV-views {
48+
margin-left: 6px;
49+
}
50+
.DV-mini .DV-views div {
51+
margin-top: 4px;
52+
}
53+
.DV-mini .DV-views div span {
54+
padding: 7px 10px 6px;
55+
}
2656

2757
/* ================= */
2858
/* = Page Elements = */
@@ -35,3 +65,17 @@
3565
padding-left: 0px;
3666
}
3767

68+
/* Annotations ---------------------------------------*/
69+
70+
.DV-mini .DV-annotationTab {
71+
background-image: url(../../../images/DV/embed/tabs-small.png);
72+
width: 29px;
73+
left: -13px;
74+
height: 15px;
75+
}
76+
.DV-mini .DV-activeAnnotation .DV-annotationTab {
77+
background-position: 0 -30px;
78+
}
79+
.DV-mini .DV-activeAnnotation .DV-annotationClose {
80+
background-position: 4px 2px;
81+
}

‎public/stylesheets/DV/components/pages.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,9 @@
1515
position:absolute;
1616
z-index:10001;
1717
}
18+
.DV-mini .DV-pageMeta {
19+
display: none;
20+
}
1821

1922
.DV-pageNumber {
2023
display:inline;

‎viewer-mini-debug.html‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -72,14 +72,27 @@
7272

7373
<div id="document-viewer"></div>
7474
<script type="text/javascript">
75-
DV.load('http://www.documentcloud.org/documents/87099-birth-certificate-long-form.js', {
75+
DV.load('http://www.documentcloud.org/documents/96522-torrance-statement-on-crime-map.js', {
7676
container: '#document-viewer',
77-
width: 600,
77+
width: 499,
7878
height: 700,
7979
sidebar: false,
8080
search: false
8181
});
8282
</script>
8383

84+
<br /> <br /> <br /> <br />
85+
86+
<div id="document-viewer-2"></div>
87+
<script type="text/javascript">
88+
DV.load('http://www.documentcloud.org/documents/87099-birth-certificate-long-form.js', {
89+
container: '#document-viewer-2',
90+
width: 350,
91+
height: 400,
92+
sidebar: false,
93+
search: false
94+
});
95+
</script>
96+
8497
</body>
8598
</html>

0 commit comments

Comments
 (0)