Commit 6bbbd58f authored by sarah's avatar sarah
Browse files

merge

parents 9ca5bc16 df363a7f
......@@ -16,12 +16,12 @@
@I-2-6: @I-2-5 + 11;
@I-2-7: @I-2-6 + 9;
@II-1: @I-2-7 + 12;
@II-2: @II-1 + 24;
@II-2: @II-1 + 22;
@II-3: @II-2 + 40;
@II-4: @II-3 + 26;
@II-5: @II-4 + 12;
@II-6: @II-5 + 28;
@III: @II-6 + 32;
@III: @II-6 + 30;
body#I-1-1 {
#pages {
......
;(function () {
if ((!document.getNamedFlows) && document.webkitGetNamedFlows) {
document.getNamedFlows = document.webkitGetNamedFlows;
}
if (!document.getNamedFlow) {
document.getNamedFlow = function (name) {
return document.getNamedFlows(name).namedItem(name);
}
}
var textFlow = document.getNamedFlow('main');
/**
* Returns first region the given node is shown within
*
* workaround for getRegionsForContent() as that function only seems to work
* on block-elements
*/
function getRegionByNode(flow, node) {
var ranges, regions = flow.getRegionsByContent(node);
if (regions.length > 0) {
return regions[0];
} else {
regions = flow.getRegions();
for (var i=0; i < regions.length; i++) {
ranges = regions[i].webkitGetRegionFlowRanges();
for (var r=0; r < ranges.length; r++) {
if (ranges[r].isPointInRange(node, 0)) {
return regions[i];
}
}
}
console.log('Could not find region for node', node);
}
}
/**
* Find page for given node, travels up the DOM tree to find
* first wrapping paper element. Does not work for Nodes in a flow.
*/
function getPageByNode (node) {
if (node) {
if (node.classList.contains('paper')) {
return node;
} else {
if (node.parentElement) {
return getPageByNode(node.parentElement);
} else {
return false;
}
}
return false;
}
}
/**
* Get page by node in region
*/
function getPageByRegionNode (flow, node) {
var region = getRegionByNode(flow, node);
if (region) {
return getPageByNode(getRegionByNode(flow, node));
} else {
return null;
}
}
/**
* Return page number for given page
*/
function getPageNum (page) {
return parseInt(page.id.replace(/\D/g, ''));
}
window.fixOrphans = function () {
var threshold = 80,
step = -.025,
max = -0.125;
spans = document.querySelectorAll('.last-line');
for (var i=0; i < spans.length; i++) {
var rects = spans[i].getClientRects(),
lineCount = rects.length; // Remember how many lines we had at the start
if (rects[rects.length-1].width <= threshold) {
var spacing = 0;
while(rects.length >= lineCount && spacing >= max) {
spacing += step;
spans[i].style.letterSpacing = spacing + 'mm';
rects = spans[i].getClientRects()
}
if (rects.length == lineCount) {
spans[i].style.letterSpacing = 0;
}
}
}
}
window.fixWidows = function () {
var threshold = 30,
p = document.querySelectorAll('p');
for (var i=0; i < p.length; i++) {
var rects = p[i].getClientRects();
if (rects.length > 1 && rects[0].height < threshold) {
p[i].classList.add('break-before');
}
}
}
window.reattachHeaders = function () {
var textFlow = document.getNamedFlow('main'),
headers = document.querySelectorAll('h4');
for (var i=0; i< headers.length; i++) {
var h = headers[i],
p = h.nextElementSibling;
if (getPageNum(getPageByRegionNode(textFlow, h)) != getPageNum(getPageByRegionNode(textFlow, p))) {
h.classList.add('break-before');
} else {
var threshold = 75,
rects = p.getClientRects();
if (rects.length > 1 && rects[0].height <= threshold) {
h.classList.add('break-before');
}
}
}
}
window.typographicFixes = function () {
fixOrphans();
reattachHeaders();
fixWidows();
}
})();
\ No newline at end of file
;(function () {
'use strict';
window.buildIndex = function (callback) {
var dummyIndexJSON = "{\"problematisation\":[1,4,6,2,3,10,5,7],\"integrality\":[1,3,5,6,7,10],\"enunciation\":[1,2,10,3,4,8,9,6],\"formulation\":[1,3,4,6,10,2,7,9],\"discursive object\":[1,2,5],\"détournements\":[1],\"lekton\":[2,4,5],\"singularity\":[4,9,2,11,5],\"statement\":[5,10,3,7,9,13],\"history\":[9,1,2,4,5,3,7,11,13,6,14,12],\"urbanism\":[9,1,2,3,5,6,8,10,11,12,4,13,16],\"event\":[10,1,2,3,4,5,8],\"fault line\":[10,4,5],\"birth\":[2,4,5,6,8,11,12,1,3],\"street\":[3,4,12,5,8,6,9,10,11,13,1,2,7,16],\"police\":[3,5,2,10,12],\"palimpsest in action\":[4],\"disappearance\":[4,11,12,9],\"accidental intertwining\":[1],\"ideal city\":[1,2,4,9],\"evil\":[2,3,12,16,9,11,8],\"chance\":[2,4,11,9,10],\"archaeological method\":[3],\"conspiracy\":[3,1,2,4,12,5,6],\"aesthetics\":[3,1,7,9,6,8,10,11],\"ethics\":[4,1,2,7,8,12,3,5,6,9,10],\"provenance\":[5,6,11],\"immanent\":[10,7],\"public domain\":[11,13],\"public space\":[11,12],\"polis\":[12,7,1,3,4,9],\"machine\":[1,2,11,13,4,9],\"concatenation\":[1],\"savoir\":[2,3,5,11,4,9,10,8,12,13,6,1,7],\"medical topography\":[4],\"exercise\":[5,3,11,12,2],\"ventilation\":[6,8,9,11,12],\"problematisations\":[7,10],\"rupture\":[7,4,5,8],\"concatenations\":[1],\"historical subject\":[2],\"vector\":[7,13,3],\"aesthetic\":[8,2,10,12,11],\"focal point\":[10,11,12,1,2,5],\"political territory\":[12,13],\"\":[13],\" as institution\":[13],\"street as institution\":[13],\"arsenal\":[2],\"mathēsis\":[1,5,9,16,4,7],\"wisconst\":[1,5,6,9,16,4,7,8],\"resemblance\":[2,5,13,14,15,7],\"‘as if’\":[2,5],\"ars combinatoria\":[5,6],\"civil life\":[5,12,16,1,9,3,4,6,7,8],\"expert\":[5,6,7,9],\"constancy\":[5,6,4,7,8,9,10,11,12,1,2,3],\"dissimulation\":[8,9],\"vital ascesis\":[12,1],\"subject of initiative\":[3],\"dispositif\":[3,11],\"myth\":[4],\"gemüt\":[5,8],\"technologies of the self\":[5,6,8,2],\"structural dissidence\":[11],\"inertia\":[12],\"indifference\":[10],\"vita politica\":[1,4],\"passivum\":[10],\"ghemoed\":[8],\"hypermodern dilettante\":[9]}",
indexJSON = window.localStorage.getItem('the-riddle-index'),
index = (indexJSON) ? JSON.parse(indexJSON) : JSON.parse(dummyIndexJSON),
indexContainer = document.querySelector('#index'),
keys = Object.keys(index);
keys.sort();
for (var k = 0; k < keys.length; k++) {
var key = keys[k],
pages = index[key];
pages.sort(function (a, b) {
if (a < b) {
return -1;
} else {
if (a > b) {
return 1;
}
return 0;
}
});
console.log(pages);
var entry = document.createElement('section'),
entryLabel = document.createElement('span'),
entryLabelText = document.createTextNode(key);
entry.classList.add('index-entry');
entryLabel.classList.add('index-entry-label');
entryLabel.appendChild(entryLabelText);
entry.appendChild(entryLabel);
for (var i=0; i < pages.length; i++) {
var pageNum = document.createElement('span'),
pageNumText = document.createTextNode(pages[i]);
pageNum.classList.add('index-pagenum');
pageNum.appendChild(pageNumText);
entry.appendChild(pageNum);
}
indexContainer.appendChild(entry);
}
callback();
};
})();
\ No newline at end of file
......@@ -455,6 +455,11 @@
page-break-inside: avoid;
-webkit-region-break-inside: avoid;
&.stacked {
clear: none;
margin-right: 9mm;
}
&.full {
max-width: @page-width;
}
......@@ -564,9 +569,18 @@
font-family: 'Dauphine';
font-size: 80%;
}
}
/* Specific modifications */
#I-1-4 {
#main {
p:nth-of-type(2) {
-webkit-region-break-before: always;
}
}
}
span.img_ref, #main section.excursion span.img_ref{
display: none;
}
......
// Wrap image s
// Make page 1 cover
// Add pages untill all flows fit
// Go page by page through them
// If image compare page nums, if placed before text, insert break
// requestAnimationFrame
// Get classes on page elements
// If class in list to take, add class to page
// If image region empty reveal secondary text frame increase pagenumber
;(function () {
'use strict';
if ((!document.getNamedFlows) && document.webkitGetNamedFlows) {
document.getNamedFlows = document.webkitGetNamedFlows;
}
if (!document.getNamedFlow) {
document.getNamedFlow = function (name) {
return document.getNamedFlows(name).namedItem(name);
}
}
var master, container,
textFlow = document.getNamedFlow('main'),
imageFlow = document.getNamedFlow('images'),
captionFlow = document.getNamedFlow('figcaptions');
function getStartPage () {
var selector = "body#" + document.body.id + " #pages",
stylesheets = document.styleSheets;
for (var s=0; s < stylesheets.length; s++) {
var rules = stylesheets[s].cssRules;
for (var r=0; r < rules.length;r++) {
if (rules[r].selectorText == selector) {
return parseInt(/\d+/.exec(rules[r].style.counterReset)[0]);
}
}
}
}
function insertBreakBefore (refNode, className) {
var brkNode = document.createElement('div');
brkNode.classList.add('break-after');
brkNode.classList.add(className);
refNode.parentElement.insertBefore(brkNode, refNode);
}
/**
* Returns first region the given node is shown within
*
* workaround for getRegionsForContent() as that function only seems to work
* on block-elements
*/
function getRegionByNode(flow, node) {
var ranges, regions = flow.getRegionsByContent(node);
if (regions.length > 0) {
return regions[0];
} else {
regions = flow.getRegions();
for (var i=0; i < regions.length; i++) {
ranges = regions[i].webkitGetRegionFlowRanges();
for (var r=0; r < ranges.length; r++) {
if (ranges[r].isPointInRange(node, 0)) {
return regions[i];
}
}
}
console.log('Could not find region for node', node);
}
}
/**
* Returns nodes within given region
*/
function regionContent (flow, region) {
var ranges = region.webkitGetRegionFlowRanges(),
flowContent = flow.getContent(),
regionContent = [];
for (var r=0; r < ranges.length; r++) {
for (var i=0; i < flowContent.length; i++) {
if (ranges[r].isPointInRange(flowContent[i])) {
regionContent.push(flowContent[i]);
}
}
}
return regionContent;
}
/**
* Return page number for given page
*/
function getPageNum (page) {
return parseInt(page.id.replace(/\D/g, ''));
}
/**
* Retreive page by number
*/
function getPageByNum (num) {
return document.querySelector('#page-' + num);
}
/**
* Find page for given node, travels up the DOM tree to find
* first wrapping paper element. Does not work for Nodes in a flow.
*/
function getPageByNode (node) {
if (node) {
if (node.classList.contains('paper')) {
return node;
} else {
if (node.parentElement) {
return getPageByNode(node.parentElement);
} else {
return false;
}
}
return false;
}
}
/**
* Get page by node in region
*/
function getPageByRegionNode (flow, node) {
return getPageByNode(getRegionByNode(flow, node));
}
/**
* Return the region on the page with given number
*/
function getRegionByPageNum (flow, num) {
var regionPageNum, regions = flow.getRegions();
for (var i = 0; i < regions.length; i++) {
regionPageNum = getPageNum(getPageByNode(regions[i]));
if (regionPageNum == num) {
return regions[i];
} else if (regionPageNum > num) {
return null;
}
}
}
function getNodeIndex(nodes, refnode) {
for (var i=0; i < nodes.length; i++) {
if (nodes[i] == refnode) {
return i;
}
}
}
function wrapImages () {
var im, wrapper, clsName, imgs = document.querySelectorAll("#main img");
for (var i=0;i<imgs.length;i++) {
im = imgs[i];
wrapper = document.createElement("div");
wrapper.classList.add("img");
while (im.classList.length > 0) {
clsName = im.classList[0];
if (clsName != 'None') {
wrapper.classList.add(clsName);
im.classList.remove(clsName);
}
}
wrapper.appendChild(im.cloneNode());
im.parentNode.replaceChild(wrapper, im);
if (wrapper.classList.contains('insert-break-before')) {
wrapper.classList.remove('insert-break-before');
var breakDiv = document.createElement("div");
breakDiv.classList.add('break-before');
breakDiv.classList.add('img_break');
wrapper.parentElement.insertBefore(breakDiv, wrapper);
}
}
var imgs = document.querySelectorAll("#main div.img");
for (var i=0; i<imgs.length; i++) {
if (imgs[i].classList.contains('wrap-next')) {
var wrapper = document.createElement('div');
wrapper.classList.add('wrapped_images');
for (var c=0; c<imgs[i].classList.length; c++) {
wrapper.classList.add(imgs[i].classList[c]);
}
imgs[i].parentNode.insertBefore(wrapper, imgs[i]);
var caption = imgs[i].nextElementSibling;
wrapper.appendChild(imgs[i]);
wrapper.appendChild(caption);
imgs[i].classList.remove('img');
do {
i++;
var caption = imgs[i].nextElementSibling;
imgs[i].classList.remove('img');
wrapper.appendChild(imgs[i]);
wrapper.appendChild(caption);
} while (i < imgs.length && imgs[i].classList.contains('wrap-next'));
}
}
}
function addPages(amount) {
var page, pagenum, offset = getStartPage();
for (var i=0;i<amount;i++) {
page = master.cloneNode(true);
container.appendChild(page);
pagenum = offset + document.querySelectorAll('.paper').length;
page.setAttribute('id', 'page-'+pagenum);
if (pagenum == 1) {
page.classList.add('cover');
}
}
}
function fitContent (callback) {
if (textFlow.overset || imageFlow.overset || captionFlow.overset) {
addPages(25);
window.requestAnimationFrame(function () { fitContent(callback) });
} else {
callback();
}
}
/**
* Return content in flow on given page
*/
function getPageFlowContent (num, flow) {
var region = getRegionByPageNum(flow, num);
if (region) {
return regionContent(flow, region);
} else {
return [];
}
}
function getNextNodeInFlow (flow, refnode) {
var flowContent = flow.getContent(),
refIndex = getNodeIndex(flowContent, refnode);
if (refIndex + 1 < flowContent.length) {
return flowContent[refIndex + 1];
} else {
return null;
}
}
function findFirstEmptyPage (flow) {
var regions = flow.getRegions();
for (var i=0; i<regions.length;i++) {
if (regions[i].webkitRegionOverset == 'empty' && !regions[i].classList.contains('secondary')) {
return getPageNum(getPageByNode(regions[i]));
}
}
}
function getImageRef (image) {
while(!image.classList.contains('img')) {
image = image.parentNode;
}
var ref = image.previousElementSibling;
while(!(ref.classList.contains('img_ref'))) {
ref = ref.previousElementSibling;
}
return ref;
}
var pageNum;
document.addEventListener("storiesloaded", function () {
container = document.querySelector('#pages');
master = document.querySelector('#master-page');
master.removeAttribute('id');
master.remove();
wrapImages();
fitContent (function() {
function alignCaptions () {
var caption, captionPage, captionIndex,
img, imgPage,
captions = captionFlow.getContent();
for (var i=0; i < captions.length; i++) {
caption = captions[i],
captionPage = getPageNum(getPageByRegionNode(captionFlow, caption));
img = caption.previousElementSibling;
while (!img.classList.contains('img')) {
img = img.parentElement;
}
imgPage = getPageNum(getPageByRegionNode(imageFlow, img));
while (captionPage < imgPage) {
insertBreakBefore(caption.parentElement, 'figcaption_break');
captionPage = getPageNum(getPageByRegionNode(captionFlow, caption));
imgPage = getPageNum(getPageByRegionNode(imageFlow, img));
}
}
}
function allowedAsMainImage(image, pageNum) {
var imageRef = getImageRef(image),
imageRefPageNum = getPageNum(getPageByRegionNode(textFlow, imageRef)),
buffer = (image.classList.contains('cheat')) ? 1 : 0;
buffer = (image.classList.contains('cheat-a-lot')) ? 2 : buffer;
if (pageNum+buffer >= imageRefPageNum) {
return true;
} else {
return false;
}
}
function allowedAsNextImage (image, pageNum) {
if (image.classList.contains('full') || image.classList.contains('not-secondary')) {
return false;
} else {
var imageRef = getImageRef(image),
imageRefPageNum = getPageNum(getPageByRegionNode(textFlow, imageRef)),
buffer = (image.classList.contains('cheat')) ? 1 : 0;
buffer = (image.classList.contains('cheat-a-lot')) ? 2 : buffer;
if (pageNum+buffer >= imageRefPageNum) {
return true;
}
return false