Mercurial > hg > digilib-old
changeset 946:aa5a978a5311
moved button code into plugin
| author | robcast |
|---|---|
| date | Mon, 02 Jan 2012 17:12:39 +0100 |
| parents | d90eb52966be |
| children | 5bde01bcfb16 |
| files | webapp/src/main/webapp/jquery/digilib.html webapp/src/main/webapp/jquery/jquery.digilib.buttons.js webapp/src/main/webapp/jquery/jquery.digilib.js |
| diffstat | 3 files changed, 441 insertions(+), 376 deletions(-) [+] |
line wrap: on
line diff
--- a/webapp/src/main/webapp/jquery/digilib.html Wed Dec 28 22:10:31 2011 +0100 +++ b/webapp/src/main/webapp/jquery/digilib.html Mon Jan 02 17:12:39 2012 +0100 @@ -15,11 +15,11 @@ <script type="text/javascript" src="jquery.cookie.js"></script> <script type="text/javascript" src="jquery.digilib.js"></script> <script type="text/javascript" src="jquery.digilib.geometry.js"></script> - <script type="text/javascript" src="jquery.digilib.birdseye.js"></script> - <script type="text/javascript" src="jquery.digilib.regions.js"></script> + <script type="text/javascript" src="jquery.digilib.buttons.js"></script> +<!-- <script type="text/javascript" src="jquery.digilib.birdseye.js"></script> + <script type="text/javascript" src="jquery.digilib.regions.js"></script> --> <link rel="stylesheet" type="text/css" href="jquery.digilib.css" /> - <script type="text/javascript"> $(document).ready(function(){ var opts = {
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.buttons.js Mon Jan 02 17:12:39 2012 +0100 @@ -0,0 +1,427 @@ +/** +digilib buttons plugin + */ + +(function($) { + + // plugin object with digilib data + var digilib; + + var buttons = { + reference : { + onclick : "reference", + tooltip : "get a reference URL", + icon : "reference.png" + }, + zoomin : { + onclick : ["zoomBy", 1.4], + tooltip : "zoom in", + icon : "zoom-in.png" + }, + zoomout : { + onclick : ["zoomBy", 0.7], + tooltip : "zoom out", + icon : "zoom-out.png" + }, + zoomarea : { + onclick : "zoomArea", + tooltip : "zoom area", + icon : "zoom-area.png" + }, + zoomfull : { + onclick : "zoomFull", + tooltip : "view the whole image", + icon : "zoom-full.png" + }, + pagewidth : { + onclick : ["zoomFull", "width"], + tooltip : "page width", + icon : "pagewidth.png" + }, + back : { + onclick : ["gotoPage", "-1"], + tooltip : "goto previous image", + icon : "back.png" + }, + fwd : { + onclick : ["gotoPage", "+1"], + tooltip : "goto next image", + icon : "fwd.png" + }, + page : { + onclick : "gotoPage", + tooltip : "goto image number", + icon : "page.png" + }, + help : { + onclick : "showAboutDiv", + tooltip : "about Digilib", + icon : "help.png" + }, + reset : { + onclick : "reset", + tooltip : "reset image", + icon : "reset.png" + }, + mark : { + onclick : "setMark", + tooltip : "set a mark", + icon : "mark.png" + }, + delmark : { + onclick : "removeMark", + tooltip : "delete the last mark", + icon : "delmark.png" + }, + hmir : { + onclick : ["mirror", "h"], + tooltip : "mirror horizontally", + icon : "mirror-horizontal.png" + }, + vmir : { + onclick : ["mirror", "v"], + tooltip : "mirror vertically", + icon : "mirror-vertical.png" + }, + rot : { + onclick : "rotate", + tooltip : "rotate image", + icon : "rotate.png" + }, + brgt : { + onclick : "brightness", + tooltip : "set brightness", + icon : "brightness.png" + }, + cont : { + onclick : "contrast", + tooltip : "set contrast", + icon : "contrast.png" + }, + rgb : { + onclick : "javascript:setParamWin('rgb', '...')", + tooltip : "set rgb values", + icon : "rgb.png" + }, + quality : { + onclick : "setQuality", + tooltip : "set image quality", + icon : "quality.png" + }, + size : { + onclick : "javascript:toggleSizeMenu()", + tooltip : "set page size", + icon : "size.png" + }, + calibrationx : { + onclick : "calibrate", + tooltip : "calibrate screen resolution", + icon : "calibration-x.png" + }, + scale : { + onclick : "setScaleMode", + tooltip : "change image scale", + icon : "original-size.png" + }, + toggleoptions : { + onclick : "moreButtons", + tooltip : "more options", + icon : "options.png" + }, + moreoptions : { + onclick : ["moreButtons", "+1"], + tooltip : "more options", + icon : "options.png" + }, + lessoptions : { + onclick : ["moreButtons", "-1"], + tooltip : "less options", + icon : "options.png" + }, + up : { + onclick : ["moveZoomArea", 0, -1], + tooltip : "move zoom area up", + icon : "up.png" + }, + down : { + onclick : ["moveZoomArea", 0, 1], + tooltip : "move zoom area down", + icon : "down.png" + }, + left : { + onclick : ["moveZoomArea", -1, 0], + tooltip : "move zoom area left", + icon : "left.png" + }, + right : { + onclick : ["moveZoomArea", 1, 0], + tooltip : "move zoom area right", + icon : "right.png" + }, + SEP : { + icon : "sep.png" + } + }; + + var defaults = { + // buttons + 'buttons' : buttons, + // defaults for digilib buttons + 'buttonSettings' : { + 'fullscreen' : { + // path to button images (must end with a slash) + 'imagePath' : 'img/fullscreen/', + 'buttonSetWidth' : 36, + 'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","pagewidth","back","fwd","page","help","reset","toggleoptions"], + 'specialSet' : ["mark","delmark","hmir","vmir","rot","brgt","cont","rgb","quality","size","calibrationx","scale","lessoptions"], + 'arrowSet' : ["up", "down", "left", "right"], + 'buttonSets' : ['standardSet', 'specialSet'] + }, + 'embedded' : { + 'imagePath' : 'img/embedded/16/', + 'buttonSetWidth' : 18, + 'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","help","reset","toggleoptions"], + 'specialSet' : ["mark","delmark","hmir","vmir","rot","brgt","cont","rgb","quality","scale","lessoptions"], + 'arrowSet' : ["up", "down", "left", "right"], + 'buttonSets' : ['standardSet', 'specialSet'] + } + }, + // number of visible button groups + 'visibleButtonSets' : 1, + }; + + var actions = { + // display more (or less) button sets + moreButtons : function (data, more) { + var settings = data.settings; + if (more == null) { + // toggle more or less (only works for 2 sets) + var maxbtns = settings.buttonSettings[settings.interactionMode].buttonSets.length; + if (settings.visibleButtonSets >= maxbtns) { + more = '-1'; + } else { + more = '+1'; + } + } + if (more === '-1') { + // remove set + var setIdx = settings.visibleButtonSets - 1; + if (showButtons(data, false, setIdx, true)) { + settings.visibleButtonSets--; + } + } else { + // add set + var setIdx = settings.visibleButtonSets; + if (showButtons(data, true, setIdx, true)) { + settings.visibleButtonSets++; + } + } + // persist setting + digilib.fn.storeOptions(data); + }, + + }; + + // plugin installation called by digilib on plugin object. + var install = function(plugin) { + digilib = plugin; + console.debug('installing buttons plugin. digilib:', digilib); + // add defaults, actions, buttons + $.extend(digilib.defaults, defaults); + $.extend(digilib.actions, actions); + $.extend(digilib.buttons, buttons); + // export functions + digilib.fn.createButton = createButton; + }; + + // plugin initialization + var init = function (data) { + console.debug('initialising buttons plugin. data:', data); + /* create buttons before scaler + for (var i = 0; i < data.settings.visibleButtonSets; ++i) { + showButtons(data, true, i); + } */ + // install event handler + var $data = $(data); + $data.bind('setup', handleSetup); + }; + + + var handleSetup = function (evt) { + console.debug("stub: handleSetup"); + var data = this; + // create buttons before scaler + for (var i = 0; i < data.settings.visibleButtonSets; ++i) { + showButtons(data, true, i); + } + }; + + // creates HTML structure for a single button + var createButton = function (data, $div, buttonName) { + var $elem = data.$elem; + var settings = data.settings; + var mode = settings.interactionMode; + var imagePath = settings.buttonSettings[mode].imagePath; + // make relative imagePath absolute + if (imagePath.charAt(0) !== '/' && imagePath.substring(0,3) !== 'http') { + imagePath = settings.digilibBaseUrl + '/jquery/' + imagePath; + } + var buttonConfig = settings.buttons[buttonName]; + // button properties + var action = buttonConfig.onclick; + var tooltip = buttonConfig.tooltip; + var icon = imagePath + buttonConfig.icon; + // construct the button html + var $button = $('<div class="button"></div>'); + var $a = $('<a/>'); + var $img = $('<img class="button"/>'); + $div.append($button); + $button.append($a); + $a.append($img); + // add attributes and bindings + $button.attr('title', tooltip); + $button.addClass('button-' + buttonName); + $img.attr('src', icon); + // create handler for the buttons + $button.on('click.digilib', (function () { + // we create a new closure to capture the value of action + if ($.isArray(action)) { + // the handler function calls digilib with action and parameters + return function (evt) { + console.debug('click action=', action, ' evt=', evt); + $elem.digilib.apply($elem, action); + return false; + }; + } else { + // the handler function calls digilib with action + return function (evt) { + console.debug('click action=', action, ' evt=', evt); + $elem.digilib(action); + return false; + }; + } + })()); + }; + + // creates HTML structure for buttons in elem + var createButtons = function (data, buttonSetIdx) { + var $elem = data.$elem; + var settings = data.settings; + var mode = settings.interactionMode; + var buttonSettings = settings.buttonSettings[mode]; + var buttonGroup = buttonSettings.buttonSets[buttonSetIdx]; + if (buttonGroup == null) { + // no buttons here + return; + } + // button divs are marked with class "keep" + var $buttonsDiv = $('<div class="keep buttons"/>'); + var buttonNames = buttonSettings[buttonGroup]; + for (var i = 0; i < buttonNames.length; i++) { + var buttonName = buttonNames[i]; + createButton(data, $buttonsDiv, buttonName); + } + // make buttons div scroll if too large for window + if ($buttonsDiv.height() > $(window).height() - 10) { + $buttonsDiv.css('position', 'absolute'); + } + // buttons hidden at first + $buttonsDiv.hide(); + $elem.append($buttonsDiv); + if (data.$buttonSets == null) { + // first button set + data.$buttonSets = [$buttonsDiv]; + } else { + $elem.append($buttonsDiv); + data.$buttonSets[buttonSetIdx] = $buttonsDiv; + } + return $buttonsDiv; + }; + + // display more (or less) button sets + var showButtons = function (data, more, setIdx, animated) { + var atime = animated ? 'fast': 0; + // get button width from settings + var mode = data.settings.interactionMode; + var btnWidth = data.settings.buttonSettings[mode].buttonSetWidth; + if (more) { + // add set + var $otherSets = data.$elem.find('div.buttons:visible'); + var $set; + if (data.$buttonSets && data.$buttonSets[setIdx]) { + // set exists + $set = data.$buttonSets[setIdx]; + } else { + $set = createButtons(data, setIdx); + } + if ($set == null) return false; + // include border in calculation + //var btnWidth = $set.outerWidth(); + // console.debug("btnWidth", btnWidth); + // move remaining sets left and show new set + if ($otherSets.length > 0) { + $otherSets.animate({right : '+='+btnWidth+'px'}, atime, + function () {$set.show();}); + } else { + $set.show(); + } + } else { + // remove set + var $set = data.$buttonSets[setIdx]; + if ($set == null) return false; + //var btnWidth = $set.outerWidth(); + // hide last set + $set.hide(); + // take remaining sets and move right + var $otherSets = data.$elem.find('div.buttons:visible'); + $otherSets.animate({right : '-='+btnWidth+'px'}, atime); + } + return true; + }; + + // check for buttons to highlight TODO: improve this! + var highlightButtons = function (data, name, on) { + var $buttons = data.$elem.find('div.buttons:visible'); // include hidden? + // add a class for highlighted button + var highlight = function (name, on) { + var $button = $buttons.find('div.button-' + name); + if (on) { + $button.addClass('button-on'); + } else { + $button.removeClass('button-on'); + } + }; + if (name != null) { + return highlight(name, on); + } + var flags = data.scalerFlags; + var settings = data.settings; + highlight('rot', settings.rot); + highlight('brgt', settings.brgt); + highlight('cont', settings.cont); + highlight('bird', settings.isBirdDivVisible); + highlight('help', settings.isAboutDivVisible); + highlight('hmir', flags.hmir); + highlight('vmir', flags.vmir); + highlight('quality', flags.q1 || flags.q2); + highlight('zoomin', ! isFullArea(data.zoomArea)); + }; + + // plugin object with name and init + // shared objects filled by digilib on registration + var plugin = { + name : 'buttons', + install : install, + init : init, + //buttons : {}, + actions : {}, + fn : {}, + plugins : {} + }; + + if ($.fn.digilib == null) { + $.error("jquery.digilib.buttons must be loaded after jquery.digilib!"); + } else { + $.fn.digilib('plugin', plugin); + } +})(jQuery);
--- a/webapp/src/main/webapp/jquery/jquery.digilib.js Wed Dec 28 22:10:31 2011 +0100 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.js Mon Jan 02 17:12:39 2012 +0100 @@ -35,165 +35,10 @@ } (function($) { - var buttons = { - reference : { - onclick : "reference", - tooltip : "get a reference URL", - icon : "reference.png" - }, - zoomin : { - onclick : ["zoomBy", 1.4], - tooltip : "zoom in", - icon : "zoom-in.png" - }, - zoomout : { - onclick : ["zoomBy", 0.7], - tooltip : "zoom out", - icon : "zoom-out.png" - }, - zoomarea : { - onclick : "zoomArea", - tooltip : "zoom area", - icon : "zoom-area.png" - }, - zoomfull : { - onclick : "zoomFull", - tooltip : "view the whole image", - icon : "zoom-full.png" - }, - pagewidth : { - onclick : ["zoomFull", "width"], - tooltip : "page width", - icon : "pagewidth.png" - }, - back : { - onclick : ["gotoPage", "-1"], - tooltip : "goto previous image", - icon : "back.png" - }, - fwd : { - onclick : ["gotoPage", "+1"], - tooltip : "goto next image", - icon : "fwd.png" - }, - page : { - onclick : "gotoPage", - tooltip : "goto image number", - icon : "page.png" - }, - help : { - onclick : "showAboutDiv", - tooltip : "about Digilib", - icon : "help.png" - }, - reset : { - onclick : "reset", - tooltip : "reset image", - icon : "reset.png" - }, - mark : { - onclick : "setMark", - tooltip : "set a mark", - icon : "mark.png" - }, - delmark : { - onclick : "removeMark", - tooltip : "delete the last mark", - icon : "delmark.png" - }, - hmir : { - onclick : ["mirror", "h"], - tooltip : "mirror horizontally", - icon : "mirror-horizontal.png" - }, - vmir : { - onclick : ["mirror", "v"], - tooltip : "mirror vertically", - icon : "mirror-vertical.png" - }, - rot : { - onclick : "rotate", - tooltip : "rotate image", - icon : "rotate.png" - }, - brgt : { - onclick : "brightness", - tooltip : "set brightness", - icon : "brightness.png" - }, - cont : { - onclick : "contrast", - tooltip : "set contrast", - icon : "contrast.png" - }, - rgb : { - onclick : "javascript:setParamWin('rgb', '...')", - tooltip : "set rgb values", - icon : "rgb.png" - }, - quality : { - onclick : "setQuality", - tooltip : "set image quality", - icon : "quality.png" - }, - size : { - onclick : "javascript:toggleSizeMenu()", - tooltip : "set page size", - icon : "size.png" - }, - calibrationx : { - onclick : "calibrate", - tooltip : "calibrate screen resolution", - icon : "calibration-x.png" - }, - scale : { - onclick : "setScaleMode", - tooltip : "change image scale", - icon : "original-size.png" - }, - toggleoptions : { - onclick : "moreButtons", - tooltip : "more options", - icon : "options.png" - }, - moreoptions : { - onclick : ["moreButtons", "+1"], - tooltip : "more options", - icon : "options.png" - }, - lessoptions : { - onclick : ["moreButtons", "-1"], - tooltip : "less options", - icon : "options.png" - }, - up : { - onclick : ["moveZoomArea", 0, -1], - tooltip : "move zoom area up", - icon : "up.png" - }, - down : { - onclick : ["moveZoomArea", 0, 1], - tooltip : "move zoom area down", - icon : "down.png" - }, - left : { - onclick : ["moveZoomArea", -1, 0], - tooltip : "move zoom area left", - icon : "left.png" - }, - right : { - onclick : ["moveZoomArea", 1, 0], - tooltip : "move zoom area right", - icon : "right.png" - }, - SEP : { - icon : "sep.png" - } - }; var defaults = { // version of this script - 'version' : 'jquery.digilib.js 2.0b4', + 'version' : 'jquery.digilib.js 2.1a1', // logo url 'logoUrl' : 'img/digilib-logo-text1.png', // homepage url (behind logo) @@ -234,28 +79,6 @@ // fullscreen = take parameters from page URL, keep state in page URL // embedded = take parameters from Javascript options, keep state inside object 'interactionMode' : 'fullscreen', - // buttons - 'buttons' : buttons, - // defaults for digilib buttons - 'buttonSettings' : { - 'fullscreen' : { - // path to button images (must end with a slash) - 'imagePath' : 'img/fullscreen/', - 'buttonSetWidth' : 36, - 'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","pagewidth","back","fwd","page","help","reset","toggleoptions"], - 'specialSet' : ["mark","delmark","hmir","vmir","rot","brgt","cont","rgb","quality","size","calibrationx","scale","lessoptions"], - 'arrowSet' : ["up", "down", "left", "right"], - 'buttonSets' : ['standardSet', 'specialSet'] - }, - 'embedded' : { - 'imagePath' : 'img/embedded/16/', - 'buttonSetWidth' : 18, - 'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","help","reset","toggleoptions"], - 'specialSet' : ["mark","delmark","hmir","vmir","rot","brgt","cont","rgb","quality","scale","lessoptions"], - 'arrowSet' : ["up", "down", "left", "right"], - 'buttonSets' : ['standardSet', 'specialSet'] - } - }, // arrow bar overlays for moving the zoomed area 'showZoomArrows' : true, // zoom arrow bar minimal width (for small images) @@ -264,8 +87,6 @@ 'zoomArrowWidth' : 32, // by what percentage should the arrows move the zoomed area? 'zoomArrowMoveFactor' : 0.5, - // number of visible button groups - 'visibleButtonSets' : 1, // is the "about" window shown? 'isAboutDivVisible' : false, // default size of background image for drag-scroll (same as Bird's Eye View image) @@ -397,6 +218,7 @@ for (n in plugins) { var p = plugins[n]; if (typeof p.init === 'function') { + // call the plugins init() method p.init(data); } } @@ -404,13 +226,8 @@ if (data.scaleMode === 'pixel' || data.scaleMode === 'size') { loadImageInfo(data); // triggers "imageInfo" on completion } - // create buttons before scaler - for (var i = 0; i < elemSettings.visibleButtonSets; ++i) { - showButtons(data, true, i); - } // create HTML structure for scaler, taking width of buttons div into account setupScalerDiv(data); - highlightButtons(data); // about window creation - TODO: could be deferred? restrict to only one item? setupAboutDiv(data); // arrow overlays for moving zoomed detail @@ -434,7 +251,7 @@ showAboutDiv : function(data, show) { var on = showDiv(data.settings.isAboutDivVisible, data.$aboutDiv, show); data.settings.isAboutDivVisible = on; - highlightButtons(data, 'help', on); + //FIXME: highlightButtons(data, 'help', on); }, // goto given page nr (+/-: relative) @@ -580,35 +397,6 @@ redisplay(data); }, - // display more (or less) button sets - moreButtons : function (data, more) { - var settings = data.settings; - if (more == null) { - // toggle more or less (only works for 2 sets) - var maxbtns = settings.buttonSettings[settings.interactionMode].buttonSets.length; - if (settings.visibleButtonSets >= maxbtns) { - more = '-1'; - } else { - more = '+1'; - } - } - if (more === '-1') { - // remove set - var setIdx = settings.visibleButtonSets - 1; - if (showButtons(data, false, setIdx, true)) { - settings.visibleButtonSets--; - } - } else { - // add set - var setIdx = settings.visibleButtonSets; - if (showButtons(data, true, setIdx, true)) { - settings.visibleButtonSets++; - } - } - // persist setting - storeOptions(data); - }, - // reset image parameters to defaults TODO: improve this! reset : function (data) { var settings = data.settings; @@ -624,7 +412,7 @@ settings.dw = params.dw; settings.dh = params.dh; settings.isBirdDivVisible = false; - settings.visibleButtonSets = 1; + settings.visibleButtonSets = 1; // FIXME // resets zoomArea, marks, scalerflags data.zoomArea = FULL_AREA.copy(); data.marks = []; @@ -976,7 +764,7 @@ loadImageInfo(data); } } - highlightButtons(data); // TODO: better solution + //FIXME: highlightButtons(data); // invalidate background data.hasPreviewBg = false; // send event @@ -1003,7 +791,7 @@ loadImageInfo(data); } } - highlightButtons(data); // TODO: better solution + //FIXME: highlightButtons(data); // TODO: better solution // invalidate background data.hasPreviewBg = false; // send event @@ -1039,7 +827,8 @@ console.debug("fixing border height for getFullscreenImgSize!"); borderH = 5; } - var buttonsW = 0; + // FIXME! + var buttonsW = 0; if (data.settings.visibleButtonSets) { // get button width from settings buttonsW = data.settings.buttonSettings[mode].buttonSetWidth; @@ -1114,88 +903,6 @@ data.$scaler.css('cursor', 'progress'); }; - // creates HTML structure for a single button - var createButton = function (data, $div, buttonName) { - var $elem = data.$elem; - var settings = data.settings; - var mode = settings.interactionMode; - var imagePath = settings.buttonSettings[mode].imagePath; - // make relative imagePath absolute - if (imagePath.charAt(0) !== '/' && imagePath.substring(0,3) !== 'http') { - imagePath = settings.digilibBaseUrl + '/jquery/' + imagePath; - } - var buttonConfig = settings.buttons[buttonName]; - // button properties - var action = buttonConfig.onclick; - var tooltip = buttonConfig.tooltip; - var icon = imagePath + buttonConfig.icon; - // construct the button html - var $button = $('<div class="button"></div>'); - var $a = $('<a/>'); - var $img = $('<img class="button"/>'); - $div.append($button); - $button.append($a); - $a.append($img); - // add attributes and bindings - $button.attr('title', tooltip); - $button.addClass('button-' + buttonName); - $img.attr('src', icon); - // create handler for the buttons - $button.on('click.digilib', (function () { - // we create a new closure to capture the value of action - if ($.isArray(action)) { - // the handler function calls digilib with action and parameters - return function (evt) { - console.debug('click action=', action, ' evt=', evt); - $elem.digilib.apply($elem, action); - return false; - }; - } else { - // the handler function calls digilib with action - return function (evt) { - console.debug('click action=', action, ' evt=', evt); - $elem.digilib(action); - return false; - }; - } - })()); - }; - - // creates HTML structure for buttons in elem - var createButtons = function (data, buttonSetIdx) { - var $elem = data.$elem; - var settings = data.settings; - var mode = settings.interactionMode; - var buttonSettings = settings.buttonSettings[mode]; - var buttonGroup = buttonSettings.buttonSets[buttonSetIdx]; - if (buttonGroup == null) { - // no buttons here - return; - } - // button divs are marked with class "keep" - var $buttonsDiv = $('<div class="keep buttons"/>'); - var buttonNames = buttonSettings[buttonGroup]; - for (var i = 0; i < buttonNames.length; i++) { - var buttonName = buttonNames[i]; - createButton(data, $buttonsDiv, buttonName); - } - // make buttons div scroll if too large for window - if ($buttonsDiv.height() > $(window).height() - 10) { - $buttonsDiv.css('position', 'absolute'); - } - // buttons hidden at first - $buttonsDiv.hide(); - $elem.append($buttonsDiv); - if (data.$buttonSets == null) { - // first button set - data.$buttonSets = [$buttonsDiv]; - } else { - $elem.append($buttonsDiv); - data.$buttonSets[buttonSetIdx] = $buttonsDiv; - } - return $buttonsDiv; - }; - // creates arrow overlays for moving the zoomed area var setupZoomArrows = function (data) { var $elem = data.$elem; @@ -1210,8 +917,9 @@ var $arrowsDiv = $('<div class="keep arrows"/>'); $elem.append($arrowsDiv); // create all arrow buttons + // TODO: do this without buttons plugin? $.each(arrowNames, function(i, arrowName){ - createButton(data, $arrowsDiv, arrowName); + fn.createButton(data, $arrowsDiv, arrowName); }); }; @@ -1323,75 +1031,6 @@ return isVisible; }; - // display more (or less) button sets - var showButtons = function (data, more, setIdx, animated) { - var atime = animated ? 'fast': 0; - // get button width from settings - var mode = data.settings.interactionMode; - var btnWidth = data.settings.buttonSettings[mode].buttonSetWidth; - if (more) { - // add set - var $otherSets = data.$elem.find('div.buttons:visible'); - var $set; - if (data.$buttonSets && data.$buttonSets[setIdx]) { - // set exists - $set = data.$buttonSets[setIdx]; - } else { - $set = createButtons(data, setIdx); - } - if ($set == null) return false; - // include border in calculation - //var btnWidth = $set.outerWidth(); - // console.debug("btnWidth", btnWidth); - // move remaining sets left and show new set - if ($otherSets.length > 0) { - $otherSets.animate({right : '+='+btnWidth+'px'}, atime, - function () {$set.show();}); - } else { - $set.show(); - } - } else { - // remove set - var $set = data.$buttonSets[setIdx]; - if ($set == null) return false; - //var btnWidth = $set.outerWidth(); - // hide last set - $set.hide(); - // take remaining sets and move right - var $otherSets = data.$elem.find('div.buttons:visible'); - $otherSets.animate({right : '-='+btnWidth+'px'}, atime); - } - return true; - }; - - // check for buttons to highlight TODO: improve this! - var highlightButtons = function (data, name, on) { - var $buttons = data.$elem.find('div.buttons:visible'); // include hidden? - // add a class for highlighted button - var highlight = function (name, on) { - var $button = $buttons.find('div.button-' + name); - if (on) { - $button.addClass('button-on'); - } else { - $button.removeClass('button-on'); - } - }; - if (name != null) { - return highlight(name, on); - } - var flags = data.scalerFlags; - var settings = data.settings; - highlight('rot', settings.rot); - highlight('brgt', settings.brgt); - highlight('cont', settings.cont); - highlight('bird', settings.isBirdDivVisible); - highlight('help', settings.isAboutDivVisible); - highlight('hmir', flags.hmir); - highlight('vmir', flags.vmir); - highlight('quality', flags.q1 || flags.q2); - highlight('zoomin', ! isFullArea(data.zoomArea)); - }; - // create Transform from area and $img var getImgTrafo = function ($img, area, rot, hmir, vmir, mode, data) { var picrect = geom.rectangle($img); @@ -1927,7 +1566,6 @@ storeOptions : storeOptions, redisplay : redisplay, updateDisplay : updateDisplay, - highlightButtons : highlightButtons, showDiv : showDiv, setZoomBg : setZoomBg, getImgTrafo : getImgTrafo, @@ -1953,7 +1591,7 @@ plugins[plugin.name] = plugin; // share common objects plugin.defaults = defaults; - plugin.buttons = buttons; + //plugin.buttons = buttons; FIXME plugin.actions = actions; plugin.fn = fn; plugin.plugins = plugins;