started work on direct control...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2015-12-17 09:14:59 +03:00
parent 997c5432c5
commit 2127b49707
6 changed files with 121 additions and 37 deletions

View File

@ -8,15 +8,6 @@ define(function(require){ var module = {}
//var DEBUG = DEBUG != null ? DEBUG : true
var util = require('lib/util')
var actions = require('lib/actions')
var features = require('lib/features')
var core = require('features/core')
var overlay = require('lib/widget/overlay')
// XXX this should not be imported!!!
// ...something wrong with requirejs(..)
if(window.nodejs != null){
@ -31,6 +22,16 @@ if(window.nodejs != null){
var browseWalk = require('lib/widget/browse-walk')
}
var util = require('lib/util')
var actions = require('lib/actions')
var features = require('lib/features')
var core = require('features/core')
var overlay = require('lib/widget/overlay')
var browse = require('lib/widget/browse')
/*********************************************************************/

View File

@ -63,6 +63,7 @@ core.ImageGridFeatures.Feature('viewer-testing', [
'app-control',
// chrome...
'ui-direct-control',
'ui-animation',
'ui-bounds-indicators',
'ui-current-image-indicator',

View File

@ -2044,15 +2044,22 @@ var CurrentImageIndicatorActions = actions.Actions({
var ribbon_set = this.ribbons.getRibbonSet()
if(ribbon_set.length == 0){
return this
return
}
var scale = this.ribbons.getScale()
var cur = this.ribbons.getImage(target)
var ribbon = this.ribbons.getRibbon(target)
// NOTE: cur may be unloaded...
var ribbon = this.ribbons.getRibbon(cur.length > 0 ? target : this.currentRibbon)
var marker = ribbon.find('.current-marker')
// remove marker if current image is not loaded...
if(cur.length == 0){
marker.remove()
return
}
// get config...
var border = this.config['current-image-border']
var min_border = this.config['current-image-min-border']
@ -2373,6 +2380,69 @@ module.AutoSingleImage = core.ImageGridFeatures.Feature({
//---------------------------------------------------------------------
// XXX add tap/click to focus...
// XXX add pinch-zoom...
// XXX add vertical scroll...
// XXX BUG: current image indicator gets shown in random places...
var DirectControl =
module.DirectControl = core.ImageGridFeatures.Feature({
title: '',
doc: '',
tag: 'ui-direct-control',
depends: [
'ui',
// this is only used to trigger reoad...
//'ui-partial-ribbons',
],
/*
config: {
'ui-direct-control-engines': [
'none',
'jquery',
],
'ui-direct-control-engine': 'jquery',
},
actions: actions.Actions({
toggleDirectControlEngine: ['Interface/',
base.makeConfigToggler('ui-direct-control-engine',
function(){ return this.config['ui-direct-control-engines'] })],
}),
*/
handlers: [
// XXX hide current image indicator as soon as the image is not visible...
// XXX inertia...
// XXX limit scroll to at least one image being on screen (center?)...
// XXX add setup/taredown...
['updateRibbon',
function(_, target){
var that = this
var r = this.ribbons.getRibbon(target)
r.length > 0
&& !r.hasClass('ui-draggable')
&& r.draggable({
axis: 'x',
stop: function(){
var c = that.ribbons.getImageByPosition('center', r)
that
.updateRibbon(c)
// XXX is this correct???
//.updateCurrentImageIndicator()
}
})
}],
],
})
//---------------------------------------------------------------------
// XXX console / log / status bar

View File

@ -175,6 +175,7 @@ typeof(require) != 'undefined' && require('nw.gui').Window.get().showDevTools()
<script src="ext-lib/jquery.js"></script>
<script src="ext-lib/jquery-ui.js"></script>
<script src="ext-lib/jquery.ui.touch-punch.min.js"></script>
<script src="lib/jli.js"></script>
<script src="lib/toggler.js"></script>

View File

@ -11,11 +11,41 @@ define(function(require){ var module = {}
/*********************************************************************/
// Quote a string and convert to RegExp to match self literally.
var quoteRegExp =
module.quoteRegExp =
function(str){
return str.replace(/([\.\\\/\(\)\[\]\$\*\+\-\{\}\@\^\&\?\<\>])/g, '\\$1')
}
// XXX do we need to quote anything else???
var path2url =
module.path2url =
function(path){
// test if we have a schema, and if yes return as-is...
if(/^(http|https|file|[\w-]*):[\\\/]{2}/.test(path)){
return path
}
// skip encoding windows drives...
var drive = path.split(/^([a-z]:[\\\/])/i)
path = drive.pop()
drive = drive.pop() || ''
return drive + (path
.split(/[\\\/]/g)
// XXX these are too aggressive...
//.map(encodeURI)
//.map(encodeURIComponent)
.join('/')
// NOTE: keep '%' the first...
.replace(/%/g, '%25')
.replace(/#/g, '%23')
.replace(/&/g, '%26'))
}
// NOTE: we are not using node's path module as we need this to work in
// all contexts, not only node... (???)
// XXX currently this is only used in node-specific modules and in
// images...
// XXX make this standard...
var normalizePath =
module.normalizePath =
function(path){
@ -37,8 +67,6 @@ function(path){
/**********************************************************************
* vim:set ts=4 sw=4 : */
return module })

View File

@ -12,6 +12,7 @@ define(function(require){ var module = {}
// XXX is this correct...
//require('ext-lib/jquery')
var util = require('lib/util')
var object = require('lib/object')
var data = require('data')
@ -22,24 +23,6 @@ var RIBBON = '.ribbon:not(.clone)'
/*********************************************************************/
function path2url(path){
// test if we have a schema, and if yes return as-is...
if(/^(http|https|file|[\w-]*):[\\\/]{2}/.test(path)){
return path
}
// skip encoding windows drives...
var drive = path.split(/^([a-z]:[\\\/])/i)
path = drive.pop()
drive = drive.pop() || ''
return drive + (path
.split(/[\\\/]/g)
.map(encodeURIComponent)
.join('/'))
}
/*********************************************************************/
//
@ -1127,7 +1110,7 @@ var RibbonsPrototype = {
return image
},
_loadImagePreviewURL: function(image, url){
url = path2url(url)
url = util.path2url(url)
// pre-cache and load image...
// NOTE: this will make images load without a blackout...
var img = new Image()
@ -1265,7 +1248,7 @@ var RibbonsPrototype = {
// the new preview (p_url) is different to current...
// NOTE: this may not work correctly for relative urls...
//|| image.css('background-image').indexOf(encodeURI(p_url)) < 0){
|| image.css('background-image').indexOf(path2url(p_url)) < 0){
|| image.css('background-image').indexOf(util.path2url(p_url)) < 0){
// sync load...
if(sync){
that._loadImagePreviewURL(image, p_url)
@ -1372,7 +1355,7 @@ var RibbonsPrototype = {
// remove everything in one go...
$(unloaded)
.detach()
.removeClass('moving')
.removeClass('moving current')
// blank out images to prevent wrong image flashing...
.css('background-image', 'none')
// clear marks...