mirror of
https://github.com/flynx/PortableMag.git
synced 2025-10-29 11:10:08 +00:00
rewritten createCSSClassToggler in a more general way, now it can work with class lists as well...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
57ed5db808
commit
1316658062
@ -163,7 +163,7 @@ $(document).ready(function(){
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<div class="viewer dark">
|
<div class="viewer light">
|
||||||
|
|
||||||
<!-- Splash screen -->
|
<!-- Splash screen -->
|
||||||
<div class="splash noSwipe">
|
<div class="splash noSwipe">
|
||||||
|
|||||||
109
lib/jli.js
109
lib/jli.js
@ -28,8 +28,13 @@
|
|||||||
// class change...
|
// class change...
|
||||||
// a way around this is to pass an empty function as callback_b
|
// a way around this is to pass an empty function as callback_b
|
||||||
//
|
//
|
||||||
function createCSSClassToggler(elem, css_class, callback_a, callback_b){
|
|
||||||
// prepare the pre/post callbacks...
|
function createCSSClassToggler(elem, class_list, callback_a, callback_b){
|
||||||
|
var bool_action = false
|
||||||
|
if(typeof(class_list) == typeof('')){
|
||||||
|
class_list = ['none', class_list]
|
||||||
|
bool_action = true
|
||||||
|
}
|
||||||
if(callback_b == null){
|
if(callback_b == null){
|
||||||
var callback_pre = null
|
var callback_pre = null
|
||||||
var callback_post = callback_a
|
var callback_post = callback_a
|
||||||
@ -37,44 +42,96 @@ function createCSSClassToggler(elem, css_class, callback_a, callback_b){
|
|||||||
var callback_pre = callback_a
|
var callback_pre = callback_a
|
||||||
var callback_post = callback_b
|
var callback_post = callback_b
|
||||||
}
|
}
|
||||||
// build the acual toggler function...
|
|
||||||
|
// XXX make this generic...
|
||||||
var func = function(action){
|
var func = function(action){
|
||||||
|
elem = $(elem)
|
||||||
|
// option number...
|
||||||
|
if(typeof(action) == typeof(1)){
|
||||||
|
// range check...
|
||||||
|
if(action < 0 || action >= class_list.length){
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
if(bool_action){
|
||||||
|
action = action == 0 ? 'off' : 'on'
|
||||||
|
} else {
|
||||||
|
action = class_list[action]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// we need to get the current state...
|
||||||
if(action == null || action == '?'){
|
if(action == null || action == '?'){
|
||||||
var getter = action == '?' ? true : false
|
|
||||||
action = 'on'
|
|
||||||
// get current state...
|
// get current state...
|
||||||
if( $(elem).hasClass(css_class) ){
|
var cur = 'none'
|
||||||
action = 'off'
|
for(var i=0; i < class_list.length; i++){
|
||||||
|
if(elem.hasClass(class_list[i])){
|
||||||
|
cur = class_list[i]
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// just asking for info...
|
||||||
|
if(action == '?'){
|
||||||
|
return bool_action ? (cur == 'none' ? 'off' : 'on') : cur
|
||||||
}
|
}
|
||||||
if(getter){
|
|
||||||
// as the above actions indicate intent and not state,
|
// invalid action...
|
||||||
// we'll need to swap the values...
|
} else if((bool_action && ['on', 'off'].indexOf(action) == -1)
|
||||||
return action == 'on' ? 'off' : 'on'
|
|| (!bool_action && class_list.indexOf(action) == -1)){
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
var cls = bool_action ? class_list[1] : action
|
||||||
|
// get the right class...
|
||||||
|
if(action == null){
|
||||||
|
var i = class_list.indexOf(cur)+1
|
||||||
|
i = i == -1 ? 0 : i
|
||||||
|
i = i == class_list.length ? 0 : i
|
||||||
|
cls = class_list[i]
|
||||||
|
|
||||||
|
if(bool_action){
|
||||||
|
action = cls == 'none' ? 'off' : 'on'
|
||||||
|
} else {
|
||||||
|
action = cls
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if(callback_pre != null){
|
|
||||||
callback_pre(action)
|
// pre callback...
|
||||||
|
if(callback_a != null){
|
||||||
|
callback_a(action)
|
||||||
}
|
}
|
||||||
// play with the class...
|
// update the element...
|
||||||
if(action == 'on'){
|
elem.removeClass(class_list.join(' '))
|
||||||
$(elem).addClass(css_class)
|
if(cls != 'none' && action != 'off'){
|
||||||
} else {
|
elem.addClass(cls)
|
||||||
$(elem).removeClass(css_class)
|
|
||||||
}
|
}
|
||||||
if(callback_post != null){
|
// post callback...
|
||||||
callback_post(action)
|
if(callback_b != null){
|
||||||
|
callback_b(action)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return action
|
||||||
}
|
}
|
||||||
func.doc = 'With no arguments this will toggle between "on" and '+
|
|
||||||
'"off".\n'+
|
func.class_list = class_list
|
||||||
'If either "on" or "off" are given then this will switch '+
|
if(bool_action){
|
||||||
'to that mode.\n'+
|
func.doc = 'With no arguments this will toggle between "on" and '+
|
||||||
'If "?" is given, this will return either "on" or "off" '+
|
'"off".\n'+
|
||||||
'depending on the current state.'
|
'If either "on" or "off" are given then this will switch '+
|
||||||
|
'to that mode.\n'+
|
||||||
|
'If "?" is given, this will return either "on" or "off" '+
|
||||||
|
'depending on the current state.'
|
||||||
|
}else{
|
||||||
|
func.doc = 'With no arguments this will toggle between '+
|
||||||
|
class_list +' in cycle.\n' +
|
||||||
|
'if any of the state names or its number is given then that '+
|
||||||
|
'state is switched on.'+
|
||||||
|
'If "?" is given, this will return the current state.'
|
||||||
|
}
|
||||||
|
|
||||||
return func
|
return func
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// show a jQuary opject in viewer overlay...
|
// show a jQuary opject in viewer overlay...
|
||||||
// XXX need to set .scrollTop(0) when showing different UI...
|
// XXX need to set .scrollTop(0) when showing different UI...
|
||||||
// ...and not set it when the UI is the same
|
// ...and not set it when the UI is the same
|
||||||
|
|||||||
@ -68,13 +68,20 @@ var FULL_HISTORY_ENABLED = false
|
|||||||
// NOTE: this is used mostly for styling and drag assisting...
|
// NOTE: this is used mostly for styling and drag assisting...
|
||||||
var togglePageDragging = createCSSClassToggler('.viewer', 'dragging')
|
var togglePageDragging = createCSSClassToggler('.viewer', 'dragging')
|
||||||
|
|
||||||
|
|
||||||
// toggle global editor mode...
|
// toggle global editor mode...
|
||||||
var toggleEditorMode = createCSSClassToggler('.viewer', 'editor-mode')
|
var toggleEditorMode = createCSSClassToggler('.viewer', 'editor-mode')
|
||||||
|
|
||||||
// toggles the editor mode, used for inline magazine editor...
|
// toggles the editor mode, used for inline magazine editor...
|
||||||
var toggleInlineEditorMode = createCSSClassToggler('.viewer', 'inline-editor-mode noSwipe')
|
var toggleInlineEditorMode = createCSSClassToggler('.viewer', 'inline-editor-mode noSwipe')
|
||||||
|
|
||||||
|
// toggle between viewer themes...
|
||||||
|
toggleThemes = createCSSClassToggler('.viewer', [
|
||||||
|
'light',
|
||||||
|
'none',
|
||||||
|
'dark'
|
||||||
|
])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// this is here only for speed, helps with dragging...
|
// this is here only for speed, helps with dragging...
|
||||||
// DO NOT USE DIRECTLY!
|
// DO NOT USE DIRECTLY!
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user