mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-31 19:30:07 +00:00
moved all data format conversion to formats.js + some tweaks...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
20f1685782
commit
56e3e2e907
@ -9,6 +9,8 @@ define(function(require){ var module = {}
|
|||||||
console.log('>>> data')
|
console.log('>>> data')
|
||||||
|
|
||||||
|
|
||||||
|
module.DATA_VERSION = '3.0'
|
||||||
|
|
||||||
|
|
||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
//
|
//
|
||||||
@ -1396,27 +1398,6 @@ module.DataPrototype = {
|
|||||||
|
|
||||||
/****************************************** JSON serialization ***/
|
/****************************************** JSON serialization ***/
|
||||||
|
|
||||||
// Convert gen3 data to gen4 json...
|
|
||||||
convertDataGen3: function(data){
|
|
||||||
data = data.version == null ? convertDataGen1(data) : data
|
|
||||||
var that = this
|
|
||||||
var res = {}
|
|
||||||
res.version = '3.0'
|
|
||||||
res.current = data.current
|
|
||||||
res.order = data.order.slice()
|
|
||||||
res.ribbon_order = []
|
|
||||||
res.ribbons = {}
|
|
||||||
// generate gids...
|
|
||||||
data.ribbons.forEach(function(e){
|
|
||||||
var gid = that.newGid('R')
|
|
||||||
res.ribbon_order.push(gid)
|
|
||||||
res.ribbons[gid] = e.slice()
|
|
||||||
})
|
|
||||||
// we set the base to the first ribbon...
|
|
||||||
res.base = res.ribbon_order[0]
|
|
||||||
return res
|
|
||||||
},
|
|
||||||
|
|
||||||
// Load data from JSON...
|
// Load data from JSON...
|
||||||
//
|
//
|
||||||
// NOTE: this loads in-place, use .fromJSON(..) to create new data...
|
// NOTE: this loads in-place, use .fromJSON(..) to create new data...
|
||||||
@ -1424,7 +1405,7 @@ module.DataPrototype = {
|
|||||||
if(typeof(data) == typeof('str')){
|
if(typeof(data) == typeof('str')){
|
||||||
data = JSON.parse(data)
|
data = JSON.parse(data)
|
||||||
}
|
}
|
||||||
data = data.version < '3.0' ? this.convertDataGen3(data) : data
|
data = formats.updateData(data)
|
||||||
this.base = data.base
|
this.base = data.base
|
||||||
this.current = data.current
|
this.current = data.current
|
||||||
this.order = data.order.slice()
|
this.order = data.order.slice()
|
||||||
@ -1443,7 +1424,7 @@ module.DataPrototype = {
|
|||||||
// the result...
|
// the result...
|
||||||
dumpJSON: function(mode){
|
dumpJSON: function(mode){
|
||||||
var res = {
|
var res = {
|
||||||
varsion: '3.0',
|
varsion: module.DATA_VERSION,
|
||||||
base: this.base,
|
base: this.base,
|
||||||
current: this.current,
|
current: this.current,
|
||||||
order: this.order.slice(),
|
order: this.order.slice(),
|
||||||
|
|||||||
129
ui (gen4)/formats.js
Executable file
129
ui (gen4)/formats.js
Executable file
@ -0,0 +1,129 @@
|
|||||||
|
/**********************************************************************
|
||||||
|
*
|
||||||
|
*
|
||||||
|
*
|
||||||
|
**********************************************************************/
|
||||||
|
|
||||||
|
define(function(require){ var module = {}
|
||||||
|
console.log('>>> formats')
|
||||||
|
|
||||||
|
|
||||||
|
module.VERSIONS = []
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*********************************************************************/
|
||||||
|
|
||||||
|
|
||||||
|
// Convert legacy Gen1 data format to Gen3 format version 2.0+
|
||||||
|
//
|
||||||
|
// XXX external deps:
|
||||||
|
// imageDateCmp
|
||||||
|
//module.convertDataGen1 =
|
||||||
|
module.VERSIONS['2.0'] =
|
||||||
|
function(data, cmp){
|
||||||
|
var res = {
|
||||||
|
data: {
|
||||||
|
version: '2.0',
|
||||||
|
current: null,
|
||||||
|
ribbons: [],
|
||||||
|
order: [],
|
||||||
|
},
|
||||||
|
images: {}
|
||||||
|
}
|
||||||
|
cmp = cmp == null ?
|
||||||
|
function(a, b){
|
||||||
|
return imageDateCmp(a, b, null, res.images)
|
||||||
|
}
|
||||||
|
: cmp
|
||||||
|
var ribbons = res.data.ribbons
|
||||||
|
var order = res.data.order
|
||||||
|
var images = res.images
|
||||||
|
|
||||||
|
// position...
|
||||||
|
res.data.current = data.position
|
||||||
|
|
||||||
|
// ribbons and images...
|
||||||
|
$.each(data.ribbons, function(i, input_images){
|
||||||
|
var ribbon = []
|
||||||
|
ribbons.push(ribbon)
|
||||||
|
for(var id in input_images){
|
||||||
|
var image = input_images[id]
|
||||||
|
ribbon.push(id)
|
||||||
|
order.push(id)
|
||||||
|
images[id] = image
|
||||||
|
}
|
||||||
|
ribbon.sort(cmp)
|
||||||
|
})
|
||||||
|
|
||||||
|
order.sort(cmp)
|
||||||
|
|
||||||
|
// XXX STUB
|
||||||
|
res.data.current = order[0]
|
||||||
|
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Convert gen3 data to gen4 v3.0+...
|
||||||
|
//
|
||||||
|
// NOTE: this will just convert the JSON format and will not construct
|
||||||
|
// the Data object...
|
||||||
|
// NOTE: this uses require('data').Data().newGid(..) for ribbon gid
|
||||||
|
// generation...
|
||||||
|
//module.convertDataGen3 =
|
||||||
|
module.VERSIONS['3.0'] =
|
||||||
|
function(data){
|
||||||
|
data = data.version == null ? module.VERSIONS['2.0'](data) : data
|
||||||
|
|
||||||
|
// XXX is this the right way to go???
|
||||||
|
var that = require('data').Data()
|
||||||
|
|
||||||
|
var res = {}
|
||||||
|
res.version = '3.0'
|
||||||
|
res.current = data.current
|
||||||
|
res.order = data.order.slice()
|
||||||
|
res.ribbon_order = []
|
||||||
|
res.ribbons = {}
|
||||||
|
// generate gids...
|
||||||
|
data.ribbons.forEach(function(e){
|
||||||
|
var gid = that.newGid('R')
|
||||||
|
res.ribbon_order.push(gid)
|
||||||
|
res.ribbons[gid] = e.slice()
|
||||||
|
})
|
||||||
|
// we set the base to the first ribbon...
|
||||||
|
res.base = res.ribbon_order[0]
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Get latest updater version...
|
||||||
|
//
|
||||||
|
module.getLatestUpdaterVersion = function(){
|
||||||
|
return Object.keys(module.VERSIONS).sort().pop()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*********************************************************************/
|
||||||
|
|
||||||
|
// Update data (JSON) to latest version...
|
||||||
|
//
|
||||||
|
// This is the main entry point in this module.
|
||||||
|
//
|
||||||
|
// Takes any compatable JSON data version and converts it to the latest
|
||||||
|
// format.
|
||||||
|
// NOTE: if data is already in the latest format this will return it
|
||||||
|
// as-is.
|
||||||
|
module.updateData = function(data){
|
||||||
|
var v = module.getLatestUpdaterVersion()
|
||||||
|
return data.version < v
|
||||||
|
? module.VERSIONS[v](data)
|
||||||
|
: data
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**********************************************************************
|
||||||
|
* vim:set ts=4 sw=4 : */
|
||||||
|
return module })
|
||||||
@ -4,6 +4,13 @@
|
|||||||
*
|
*
|
||||||
**********************************************************************/
|
**********************************************************************/
|
||||||
|
|
||||||
|
define(function(require){ var module = {}
|
||||||
|
console.log('>>> image')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*********************************************************************/
|
||||||
|
|
||||||
// A stub image, also here for documentation...
|
// A stub image, also here for documentation...
|
||||||
var STUB_IMAGE_DATA = {
|
var STUB_IMAGE_DATA = {
|
||||||
// Entity GID...
|
// Entity GID...
|
||||||
@ -108,6 +115,8 @@ var IMAGE_UPDATERS = []
|
|||||||
// Run all the image update functions registered in IMAGE_UPDATERS, on
|
// Run all the image update functions registered in IMAGE_UPDATERS, on
|
||||||
// an image...
|
// an image...
|
||||||
//
|
//
|
||||||
|
var updateImageIndicators =
|
||||||
|
module.updateImageIndicators =
|
||||||
function updateImageIndicators(gid, image){
|
function updateImageIndicators(gid, image){
|
||||||
gid = gid == null ? getImageGID() : gid
|
gid = gid == null ? getImageGID() : gid
|
||||||
image = image == null ? getImage() : $(image)
|
image = image == null ? getImage() : $(image)
|
||||||
@ -121,6 +130,8 @@ function updateImageIndicators(gid, image){
|
|||||||
|
|
||||||
|
|
||||||
// helper...
|
// helper...
|
||||||
|
var _loadImagePreviewURL =
|
||||||
|
module._loadImagePreviewURL =
|
||||||
function _loadImagePreviewURL(image, url){
|
function _loadImagePreviewURL(image, url){
|
||||||
// pre-cache and load image...
|
// pre-cache and load image...
|
||||||
// NOTE: this will make images load without a blackout...
|
// NOTE: this will make images load without a blackout...
|
||||||
@ -140,6 +151,8 @@ function _loadImagePreviewURL(image, url){
|
|||||||
// NOTE: care must be taken to reset ALL attributes an image can have,
|
// NOTE: care must be taken to reset ALL attributes an image can have,
|
||||||
// a common bug if this is not done correctly, is that some settings
|
// a common bug if this is not done correctly, is that some settings
|
||||||
// may leak to newly loaded images...
|
// may leak to newly loaded images...
|
||||||
|
var updateImage =
|
||||||
|
module.updateImage =
|
||||||
function updateImage(image, gid, size, sync){
|
function updateImage(image, gid, size, sync){
|
||||||
image = image == null ? getImage() : $(image)
|
image = image == null ? getImage() : $(image)
|
||||||
sync = sync == null ? CONFIG.load_img_sync : sync
|
sync = sync == null ? CONFIG.load_img_sync : sync
|
||||||
@ -237,6 +250,8 @@ function updateImage(image, gid, size, sync){
|
|||||||
// distance from current image, loading the closest images first...
|
// distance from current image, loading the closest images first...
|
||||||
//
|
//
|
||||||
// If CONFIG.update_sync is set, this will run asynchronously.
|
// If CONFIG.update_sync is set, this will run asynchronously.
|
||||||
|
var updateImages =
|
||||||
|
module.updateImages =
|
||||||
function updateImages(list, size, cmp){
|
function updateImages(list, size, cmp){
|
||||||
var deferred = $.Deferred()
|
var deferred = $.Deferred()
|
||||||
|
|
||||||
@ -289,6 +304,8 @@ function updateImages(list, size, cmp){
|
|||||||
//
|
//
|
||||||
// NOTE: this is not needed for square image blocks.
|
// NOTE: this is not needed for square image blocks.
|
||||||
// NOTE: if an image block is square, this will remove the margins.
|
// NOTE: if an image block is square, this will remove the margins.
|
||||||
|
var correctImageProportionsForRotation =
|
||||||
|
module.correctImageProportionsForRotation =
|
||||||
function correctImageProportionsForRotation(images, container){
|
function correctImageProportionsForRotation(images, container){
|
||||||
container = container == null ? $('.viewer') : container
|
container = container == null ? $('.viewer') : container
|
||||||
|
|
||||||
@ -347,3 +364,4 @@ function correctImageProportionsForRotation(images, container){
|
|||||||
|
|
||||||
/**********************************************************************
|
/**********************************************************************
|
||||||
* vim:set ts=4 sw=4 : */
|
* vim:set ts=4 sw=4 : */
|
||||||
|
return module })
|
||||||
|
|||||||
@ -4,9 +4,13 @@
|
|||||||
*
|
*
|
||||||
**********************************************************************/
|
**********************************************************************/
|
||||||
|
|
||||||
|
define(function(require){ var module = {}
|
||||||
|
console.log('>>> images')
|
||||||
|
|
||||||
//var DEBUG = DEBUG != null ? DEBUG : true
|
//var DEBUG = DEBUG != null ? DEBUG : true
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
|
|
||||||
|
|
||||||
@ -14,3 +18,4 @@
|
|||||||
|
|
||||||
/**********************************************************************
|
/**********************************************************************
|
||||||
* vim:set ts=4 sw=4 : */
|
* vim:set ts=4 sw=4 : */
|
||||||
|
return module })
|
||||||
|
|||||||
@ -4,13 +4,35 @@
|
|||||||
*
|
*
|
||||||
**********************************************************************/
|
**********************************************************************/
|
||||||
|
|
||||||
//var DEBUG = DEBUG != null ? DEBUG : true
|
define(function(require){ var module = {}
|
||||||
|
console.log('>>> loader')
|
||||||
|
|
||||||
|
var data = require('data')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
|
|
||||||
|
module.loadData = function(target, callback){
|
||||||
|
// Data...
|
||||||
|
if(target instanceof data.Data){
|
||||||
|
callback(target)
|
||||||
|
|
||||||
|
// Object...
|
||||||
|
} else if(typeof(target) == typeof({})){
|
||||||
|
callback(data.Data(target))
|
||||||
|
|
||||||
|
// String...
|
||||||
|
} else if(typeof(target) == typeof('str')){
|
||||||
|
// url...
|
||||||
|
if(/^(http:|file:|app:|embed:)/.test(target)){
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**********************************************************************
|
/**********************************************************************
|
||||||
* vim:set ts=4 sw=4 : */
|
* vim:set ts=4 sw=4 : */
|
||||||
|
return module })
|
||||||
|
|||||||
@ -10,6 +10,9 @@ console.log('>>> ribbons')
|
|||||||
|
|
||||||
//var DEBUG = DEBUG != null ? DEBUG : true
|
//var DEBUG = DEBUG != null ? DEBUG : true
|
||||||
|
|
||||||
|
var data = require('data')
|
||||||
|
var image = require('image')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
@ -57,15 +60,21 @@ module.RibbonsClassPrototype = {
|
|||||||
.append($('<div>')
|
.append($('<div>')
|
||||||
.addClass('ribbon-set'))
|
.addClass('ribbon-set'))
|
||||||
},
|
},
|
||||||
|
// XXX NOTE: quots removal might render this incompatible with older data formats...
|
||||||
createRibbon: function(gid){
|
createRibbon: function(gid){
|
||||||
return $('<div>')
|
return $('<div>')
|
||||||
.addClass('ribbon')
|
.addClass('ribbon')
|
||||||
.setAttribute('gid', JSON.stringify(gid))
|
.attr('gid', JSON.stringify(gid)
|
||||||
|
// this removes the extra quots...
|
||||||
|
.slice(1,-1))
|
||||||
},
|
},
|
||||||
|
// XXX NOTE: quots removal might render this incompatible with older data formats...
|
||||||
createImage: function(gid){
|
createImage: function(gid){
|
||||||
return $('<div>')
|
return $('<div>')
|
||||||
.addClass('image')
|
.addClass('image')
|
||||||
.setAttribute('gid', JSON.stringify(gid))
|
.attr('gid', JSON.stringify(gid)
|
||||||
|
// this removes the extra quots...
|
||||||
|
.slice(1,-1))
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -89,6 +98,7 @@ module.RibbonsPrototype = {
|
|||||||
return this.viewer.find('.current.image').parents('.ribbon').first()
|
return this.viewer.find('.current.image').parents('.ribbon').first()
|
||||||
|
|
||||||
} else if(typeof(target) == typeof('str')){
|
} else if(typeof(target) == typeof('str')){
|
||||||
|
//return this.viewer.find('.ribbon[gid="'+JSON.stringify(target)+'"]')
|
||||||
return this.viewer.find('.ribbon[gid='+JSON.stringify(target)+']')
|
return this.viewer.find('.ribbon[gid='+JSON.stringify(target)+']')
|
||||||
}
|
}
|
||||||
return $(target).filter('.ribbon')
|
return $(target).filter('.ribbon')
|
||||||
@ -98,6 +108,7 @@ module.RibbonsPrototype = {
|
|||||||
return this.viewer.find('.current.image')
|
return this.viewer.find('.current.image')
|
||||||
|
|
||||||
} else if(typeof(target) == typeof('str')){
|
} else if(typeof(target) == typeof('str')){
|
||||||
|
//return this.viewer.find('.image[gid="'+JSON.stringify(target)+'"]')
|
||||||
return this.viewer.find('.image[gid='+JSON.stringify(target)+']')
|
return this.viewer.find('.image[gid='+JSON.stringify(target)+']')
|
||||||
}
|
}
|
||||||
return $(target).filter('.image')
|
return $(target).filter('.image')
|
||||||
@ -134,7 +145,7 @@ module.RibbonsPrototype = {
|
|||||||
|
|
||||||
// place the ribbon...
|
// place the ribbon...
|
||||||
if(ribbons.length == 0){
|
if(ribbons.length == 0){
|
||||||
this.viewer.find('ribbon-set').append(ribbon)
|
this.viewer.find('.ribbon-set').append(ribbon)
|
||||||
|
|
||||||
} else if(ribbons.length <= position){
|
} else if(ribbons.length <= position){
|
||||||
ribbons.last().after(ribbon)
|
ribbons.last().after(ribbon)
|
||||||
@ -195,7 +206,7 @@ module.RibbonsPrototype = {
|
|||||||
images.eq(position).before(image)
|
images.eq(position).before(image)
|
||||||
}
|
}
|
||||||
|
|
||||||
return updateImage(image)
|
return image.updateImage(image)
|
||||||
},
|
},
|
||||||
|
|
||||||
// XXX do we need shorthands like shiftImageUp/shiftImageDown/... here?
|
// XXX do we need shorthands like shiftImageUp/shiftImageDown/... here?
|
||||||
@ -251,10 +262,10 @@ module.RibbonsPrototype = {
|
|||||||
img.attr('orientation', o)
|
img.attr('orientation', o)
|
||||||
}
|
}
|
||||||
// account for proportions...
|
// account for proportions...
|
||||||
correctImageProportionsForRotation(img)
|
image.correctImageProportionsForRotation(img)
|
||||||
// XXX this is a bit of an overkill but it will update the
|
// XXX this is a bit of an overkill but it will update the
|
||||||
// preview if needed...
|
// preview if needed...
|
||||||
//updateImage(img)
|
//image.updateImage(img)
|
||||||
})
|
})
|
||||||
return target
|
return target
|
||||||
},
|
},
|
||||||
@ -341,7 +352,7 @@ module.RibbonsPrototype = {
|
|||||||
loaded.eq(i).before(img.detach())
|
loaded.eq(i).before(img.detach())
|
||||||
}
|
}
|
||||||
|
|
||||||
updateImage(img)
|
image.updateImage(img)
|
||||||
})
|
})
|
||||||
|
|
||||||
// remove the rest of the stuff in ribbon...
|
// remove the rest of the stuff in ribbon...
|
||||||
@ -398,6 +409,8 @@ function Ribbons(viewer){
|
|||||||
return new Ribbons(viewer)
|
return new Ribbons(viewer)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.viewer = $(viewer)
|
||||||
|
|
||||||
return this
|
return this
|
||||||
}
|
}
|
||||||
Ribbons.__proto__ = RibbonsClassPrototype
|
Ribbons.__proto__ = RibbonsClassPrototype
|
||||||
|
|||||||
@ -29,7 +29,7 @@ var ribbons = require('ribbons')
|
|||||||
/*********************************************************************/
|
/*********************************************************************/
|
||||||
|
|
||||||
// XXX add this to the global doc...
|
// XXX add this to the global doc...
|
||||||
window.GLOBAL_KEYBOARD = {
|
module.GLOBAL_KEYBOARD = {
|
||||||
'Global bindings': {
|
'Global bindings': {
|
||||||
doc: 'NOTE: binding priority is the same as the order of sections '+
|
doc: 'NOTE: binding priority is the same as the order of sections '+
|
||||||
'on this page.',
|
'on this page.',
|
||||||
@ -101,7 +101,7 @@ $(function(){
|
|||||||
$(document)
|
$(document)
|
||||||
.keydown(
|
.keydown(
|
||||||
keyboard.makeKeyboardHandler(
|
keyboard.makeKeyboardHandler(
|
||||||
GLOBAL_KEYBOARD,
|
module.GLOBAL_KEYBOARD,
|
||||||
function(k){
|
function(k){
|
||||||
window.DEBUG && console.log(k)
|
window.DEBUG && console.log(k)
|
||||||
}))
|
}))
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user