diff --git a/ui (gen4)/data.js b/ui (gen4)/data.js
index e508e43b..e298e4b7 100755
--- a/ui (gen4)/data.js
+++ b/ui (gen4)/data.js
@@ -312,6 +312,13 @@ module.DataPrototype = {
// NOTE: in both the above cases if gid|order is found explicitly
// it will be returned.
//
+ // Get next/prev image (offset of 1):
+ // .getImage('next')
+ // .getImage('prev')
+ // .getImage(gid|order, 'next'[, list|ribbon])
+ // .getImage(gid|order, 'prev'[, list|ribbon])
+ // -> gid
+ //
// Get image at an offset from a given image:
// .getImage(gid|order, offset[, list|ribbon])
// -> gid
@@ -398,6 +405,10 @@ module.DataPrototype = {
: offset > 0 ? 'after'
: mode
offset = Math.abs(offset)
+ } else if(mode == 'next'){
+ offset = 1
+ } else if(mode == 'prev'){
+ offset = -1
} else {
var offset = 0
mode = mode == null ? 'before' : mode
@@ -620,6 +631,11 @@ module.DataPrototype = {
// .getRibbon('current')
// -> ribbon gid
//
+ // Get first/last ribbon:
+ // .getRibbon('first')
+ // .getRibbon('last')
+ // -> ribbon gid
+ //
// Get base ribbon:
// .getRibbon('base')
// -> base ribbon gid
@@ -652,6 +668,13 @@ module.DataPrototype = {
getRibbon: function(target, offset){
target = target == null ? this.current : target
+ if(target == 'first'){
+ return this.ribbon_order[0]
+
+ } else if(target == 'last'){
+ return this.ribbon_order.slice(-1)[0]
+ }
+
if(target == 'before' || target == 'after'){
offset = target
target = 'current'
diff --git a/ui (gen4)/index.html b/ui (gen4)/index.html
index 4fefeea2..2883b352 100755
--- a/ui (gen4)/index.html
+++ b/ui (gen4)/index.html
@@ -5,9 +5,9 @@
-
+
diff --git a/ui (gen4)/lib/actions.js b/ui (gen4)/lib/actions.js
index a4e40b6e..94e25bd8 100755
--- a/ui (gen4)/lib/actions.js
+++ b/ui (gen4)/lib/actions.js
@@ -201,7 +201,7 @@ function Action(name, doc, ldoc, func){
// ...searching the inheritance chain is not reliable as a
// method can be referenced more than once, both with the
// same as well as under different names...
- var handlers = getHandlers(name)
+ var handlers = getHandlers.call(this, name)
.map(function(h){ return h.apply(that, args) })
// NOTE: this action will get included and called by the code
@@ -250,6 +250,10 @@ module.MetaActions = {
get actions(){
var res = []
for(var k in this){
+ // avoid recursion...
+ if(k == 'actions' || k == 'length'){
+ continue
+ }
// get only actions...
if(this[k] instanceof Action){
res.push(k)
@@ -269,15 +273,16 @@ module.MetaActions = {
getDoc: function(actions){
var res = {}
var that = this
- actions = actions == null ? this.actions()
+ actions = actions == null ? this.actions
: arguments.length > 1 ? args2array(arguments)
: typeof(actions) == typeof('str') ? [actions]
: actions
// get the first defined set of docs in the inheritance chain...
actions.forEach(function(n){
var cur = that
+ res[n] = []
while(cur.__proto__ != null){
- if(cur[n].doc != null){
+ if(cur[n] != null && cur[n].doc != null){
res[n] = [ cur[n].doc, cur[n].long_doc ]
break
}
diff --git a/ui (gen4)/ribbons.js b/ui (gen4)/ribbons.js
index 6e0d4a95..ba3b34a2 100755
--- a/ui (gen4)/ribbons.js
+++ b/ui (gen4)/ribbons.js
@@ -855,6 +855,10 @@ module.RibbonsPrototype = {
// clear all...
if(gids == null || gids == '*'){
this.viewer.find('.ribbon').remove()
+ // reset offsets...
+ this.viewer.find('.ribbon-set').css({
+ top: '',
+ })
// clear one or more gids...
} else {
@@ -888,23 +892,13 @@ module.RibbonsPrototype = {
// NOTE: overflowing offset will focus first/last image.
//
// XXX interaction animation...
- focusImage: function(gid){
+ focusImage: function(target){
var cur = this.viewer
.find('.current.image')
-
- // relative keywords...
- gid = gid == 'next' ? 1
- : gid == 'prev' ? -1
- : gid
-
- // offset...
- if(typeof(gid) == typeof(123)){
- return this.focusImage(this.getImage(gid))
- }
+ var next = this.getImage(target)
cur.removeClass('current')
- return this.getImage(gid)
- .addClass('current')
+ return next.addClass('current')
},
// Set base ribbon...
@@ -1259,7 +1253,7 @@ module.RibbonsPrototype = {
// center an image horizontally...
// XXX
centerImage: function(target, mode, offset){
- offset = offset == null ? this._getOffset(target) : offset
+ offset = offset == null ? this._getOffset(target, 'center', 'center', mode) : offset
// horizontal offset, current ribbon...
this.getRibbon(target)
@@ -1303,26 +1297,6 @@ Ribbons.prototype.constructor = Ribbons
-/*********************************************************************/
-
-// XXX keep this here or move this to a different module???
-module.setupActionHandlers = function(ribbons, context, actions){
-
- context.on('focusImage', function(evt, img){
- img = ribbons.focusImage(img)
- ribbons
- .centerImage(img)
- .centerRibbon(img)
- })
-
-
- // XXX this does not need focus ribbon handlers as the Data will
- // get those, chose an image and trigger the appropriate
- // focusImage event...
-}
-
-
-
/**********************************************************************
* vim:set ts=4 sw=4 : */
return module })
diff --git a/ui (gen4)/testing.js b/ui (gen4)/testing.js
index bab8f991..77e92594 100755
--- a/ui (gen4)/testing.js
+++ b/ui (gen4)/testing.js
@@ -22,9 +22,9 @@ var ribbons =
module.ribbons =
require('ribbons')
-var actions =
-module.actions =
- require('actions')
+var v =
+module.v =
+ require('viewer')
@@ -77,17 +77,19 @@ module.loadTestRibbons = function(ribbons, data, images, viewer){
var setupActions =
-module.setupActions = function(viewer, r){
+module.setupActions = function(viewer){
viewer = viewer == null ? $('.viewer') : viewer
- r = r == null ? makeTestRibbons(viewer, images) : r
+ //r = r == null ? makeTestRibbons(viewer, images) : r
- /*
- var a = actions.setupBaseActions(viewer, {})
- actions.setupUIActions(viewer, a)
- ribbons.setupActionHandlers(r, viewer, a)
+ var vv = Object.create(v.Viewer)
- return a
- */
+ vv.load({
+ data: data.Data(module.mock_data),
+ viewer: viewer,
+ images: makeTestImages(),
+ })
+
+ return vv
}
diff --git a/ui (gen4)/ui.js b/ui (gen4)/ui.js
index e3eac753..af844c22 100755
--- a/ui (gen4)/ui.js
+++ b/ui (gen4)/ui.js
@@ -35,6 +35,8 @@ var testing = require('testing')
var client = require('client')
+var viewer = require('viewer')
+
/*********************************************************************/
@@ -117,9 +119,7 @@ $(function(){
window.DEBUG && console.log(k)
}))
- // XXX
- window.r = testing.loadTestRibbons()
- window.a = testing.setupActions(null, r)
+ window.a = testing.setupActions()
})
diff --git a/ui (gen4)/viewer.js b/ui (gen4)/viewer.js
index af7eb053..979cacae 100755
--- a/ui (gen4)/viewer.js
+++ b/ui (gen4)/viewer.js
@@ -9,6 +9,11 @@ console.log('>>> viewer')
//var DEBUG = DEBUG != null ? DEBUG : true
+var actions = require('lib/actions')
+
+var data = require('data')
+var ribbons = require('ribbons')
+
/*********************************************************************/
//
@@ -20,11 +25,146 @@ console.log('>>> viewer')
//
//
-var Client = {
-}
+var Client =
+module.Client =
+actions.Actions({
+ // basic life-cycle actions...
+ load: [
+ function(d){
+ this.data = data.Data(d.data)
+ }],
+ clear: [
+ function(){
+ delete this.data
+ }],
-var Viewer = {
-}
+
+ focusImage: ['Focus image',
+ function(img){
+ this.data.focusImage(img)
+ }],
+ focusRibbon: ['Focus Ribbon',
+ function(target){
+ var data = this.data
+ var r = data.getRibbon(target)
+ var t = data.getImage('current', r)
+ // XXX is there a 'last' special case???
+ t = t == null ? data.getImage('first', r) : t
+
+ this.focusImage(t, r)
+ }],
+
+ // shorthands for .focusImage(..) and .focusRibbon(..)...
+ firstImage: ['Focus first image in current ribbon',
+ function(){ this.focusImage('first') }],
+ lastImage: ['Focus last image in current ribbon',
+ function(){ this.focusImage('last') }],
+
+ prevImage: ['Focus previous image',
+ function(){ this.focusImage('prev') }],
+ nextImage: ['Focus next image',
+ function(){ this.focusImage('next') }],
+
+ firstRibbon: ['Focus previous ribbon',
+ function(){ this.focusRibbon('fisrt') }],
+ lastRibbon: ['Focus next ribbon',
+ function(){ this.focusRibbon('last') }],
+
+ prevRibbon: ['Focus previous ribbon',
+ function(){ this.focusRibbon('before') }],
+ nextRibbon: ['Focus next ribbon',
+ function(){ this.focusRibbon('after') }],
+
+})
+
+
+// XXX do partial loading...
+var Viewer =
+module.Viewer =
+actions.Actions(Client, {
+ load: [
+ function(data){
+ // recycle the viewer...
+ var viewer = data.viewer
+ viewer = viewer == null && this.ribbons != null
+ ? this.ribbons.viewer
+ : viewer
+
+ this.ribbons = ribbons.Ribbons(viewer, data.images)
+
+ return function(){
+ // XXX do a partial load...
+ this.ribbons.updateData(this.data)
+ this.focusImage()
+ }
+ }],
+ clear: [
+ // XXX do we need to delete the ribbons???
+ function(){
+ this.ribbons.clear()
+ delete this.ribbons
+ }],
+
+
+ focusImage: [
+ // XXX skip invisible ribbons (???)
+ // XXX load data chunks...
+ function(target){
+ var ribbons = this.ribbons
+ var data = this.data
+
+ if(data != null){
+ var gid = data.getImage(target)
+ gid = gid == null ? data.getImage('current') : gid
+
+ // XXX see if we need to load a new data set...
+ // XXX
+
+ target = ribbons.focusImage(gid)
+
+ } else {
+ target = ribbons.focusImage(target)
+ var gid = ribbons.getElemGID(target)
+ }
+
+ // align current ribbon...
+ ribbons
+ .centerRibbon(target)
+ .centerImage(target)
+
+ // align other ribbons...
+ if(data != null){
+ var ribbon = data.getRibbon(gid)
+ for(var r in data.ribbons){
+ // skip the current ribbon...
+ if(r == ribbon){
+ continue
+ }
+
+ // XXX skip off-screen ribbons...
+ // XXX
+
+ // center...
+ // XXX is there a 'last' special case here???
+ var t = data.getImage(gid, r)
+ if(t == null){
+ ribbons.centerImage(data.getImage('first', r), 'before')
+ } else {
+ ribbons.centerImage(t, 'after')
+ }
+ }
+ }
+ }],
+
+ // XXX
+ prevScreen: ['Focus previous image one screen width away',
+ function(){
+ }],
+ // XXX
+ nextScreen: ['Focus next image one screen width away',
+ function(){
+ }],
+})