diff --git a/TODO.otl b/TODO.otl
index 552f916..4fc4e73 100755
--- a/TODO.otl
+++ b/TODO.otl
@@ -1,4 +1,4 @@
-[_] 29% Priority work
+[_] 35% Priority work
[_] 50% general todo
[_] make layer default state configurable...
| e.g. setting "shown"/"hidden" classes in HTML and adding
@@ -45,7 +45,7 @@
[_] 0% issue download
[_] whole edition dowload and update (primary mode)
[_] seporate issue download (secondary)
- [_] 0% stage 2 - templates and examples
+ [_] 25% stage 2 - templates and examples
[_] 0% default cover templates
[_] 0% default page templates
| a template is a class and predefined content...
@@ -70,8 +70,8 @@
[_] text with title
[_] text with image
[_] plain
- [_] 0% default actions
- [_] show in overlay
+ [X] 100% default actions
+ [X] show/hide layer
[_] 0% stage 3 - advanced features
[_] 0% edition editor / publisher
[_] create/delete edition
diff --git a/index.html b/index.html
index 5982d39..35bcb2b 100755
--- a/index.html
+++ b/index.html
@@ -30,7 +30,7 @@ $(document).ready(function(){
$('.viewer')
.swipe({
- swipeStatus: swipeUpdate,
+ swipeStatus: swipeHandler,
// XXX change this to pinch...
swipeUp: function(){
//togglePageView('off')
@@ -74,6 +74,8 @@ $(document).ready(function(){
fingers: $.fn.swipe.fingers.ALL
})
+
+ // XXX do we need these here??
$('.button.cover').swipe({click: goToMagazineCover})
$('.button.next-article').swipe({click: nextArticle})
$('.button.prev-article').swipe({click: prevArticle})
@@ -141,8 +143,8 @@ $(document).ready(function(){
Page #1
Named page
- Anchor on page #3
- BUG: currently navigation via existing anchors
+ Anchor on page #3
+ currently navigation via existing anchors
will break the layout, so use the name attribute
on any other tags (see example).
diff --git a/magazine.css b/magazine.css
index a85a036..0900a21 100755
--- a/magazine.css
+++ b/magazine.css
@@ -125,6 +125,51 @@ body {
background: white;
}
+.magazine:before {
+ position: absolute;
+ display: inline-block;
+ text-align: center;
+
+ height: 300px;
+ width: 600px;
+ left: -300px;
+ top: -50%;
+
+ content: 'COVER';
+ font-weight: bold;
+ font-size: 150px;
+
+ color: #888;
+
+ -webkit-transform: rotate(-90deg);
+ -moz-transform: rotate(-90deg);
+ -o-transform: rotate(-90deg);
+ -ms-transform: rotate(-90deg);
+ transform: rotate(-90deg);
+}
+.magazine:after {
+ position: absolute;
+ display: inline-block;
+ text-align: center;
+
+ height: 300px;
+ width: 600px;
+ right: -450px;
+ top: -50%;
+
+ content: 'END';
+ font-weight: bold;
+ font-size: 150px;
+
+ color: #888;
+
+ -webkit-transform: rotate(-90deg);
+ -moz-transform: rotate(-90deg);
+ -o-transform: rotate(-90deg);
+ -ms-transform: rotate(-90deg);
+ transform: rotate(-90deg);
+}
+
.article {
width: auto;
overflow: visible;
diff --git a/magazine.js b/magazine.js
index 207c283..6fecd47 100755
--- a/magazine.js
+++ b/magazine.js
@@ -314,7 +314,7 @@ function fitPagesToContent(n){
}
-function swipeUpdate(evt, phase, direction, distance, duration, fingers){
+function swipeHandler(evt, phase, direction, distance, duration, fingers){
var pages = $('.page')
var cur = $('.current.page')
var n = pages.index(cur)
@@ -421,7 +421,7 @@ function goToArticleCover(){
function nextArticle(){
var cur = $('.current.page').parents('.article')
- // we are at the magazine cover cover...
+ // we are at the magazine cover...
if(cur.length == 0){
return setCurrentPage(
$('.article .page:first-child').first())
@@ -437,9 +437,10 @@ function nextArticle(){
// XXX this is almost exactly the same as nextArticle...
function prevArticle(){
var cur = $('.current.page').parents('.article')
- // we are at the magazine cover cover...
+ // we are at the magazine cover...
if(cur.length == 0){
- return $('.current.page')
+ //return $('.current.page')
+ return setCurrentPage()
}
// just find the prev one...
var articles = $('.article')