chemistry-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From build...@apache.org
Subject svn commit: r868224 [10/13] - in /websites/staging/chemistry/trunk/content: ./ php/docs/ php/docs/atom/ php/docs/atom/classes/ php/docs/atom/css/ php/docs/atom/img/ php/docs/atom/img/icons/ php/docs/atom/img/iviewer/ php/docs/atom/js/ php/docs/atom/js/...
Date Wed, 03 Jul 2013 04:39:49 GMT
Added: websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.cookie.js
==============================================================================
--- websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.cookie.js (added)
+++ websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.cookie.js Wed Jul  3 04:39:47 2013
@@ -0,0 +1,104 @@
+/**
+ * Cookie plugin
+ *
+ * Copyright (c) 2006 Klaus Hartl (stilbuero.de)
+ * Dual licensed under the MIT and GPL licenses:
+ * http://www.opensource.org/licenses/mit-license.php
+ * http://www.gnu.org/licenses/gpl.html
+ *
+ */
+
+/**
+ * Create a cookie with the given name and value and other optional parameters.
+ *
+ * @example $.cookie('the_cookie', 'the_value');
+ * @desc Set the value of a cookie.
+ * @example $.cookie('the_cookie', 'the_value', {expires: 7, path: '/', domain: 'jquery.com', secure: true});
+ * @desc Create a cookie with all available options.
+ * @example $.cookie('the_cookie', 'the_value');
+ * @desc Create a session cookie.
+ * @example $.cookie('the_cookie', null);
+ * @desc Delete a cookie by passing null as value.
+ *
+ * @param String name The name of the cookie.
+ * @param String value The value of the cookie.
+ * @param Object options An object literal containing key/value pairs to provide optional cookie attributes.
+ * @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object.
+ *                             If a negative value is specified (e.g. a date in the past), the cookie will be deleted.
+ *                             If set to null or omitted, the cookie will be a session cookie and will not be retained
+ *                             when the the browser exits.
+ * @option String path The value of the path atribute of the cookie (default: path of page that created the cookie).
+ * @option String domain The value of the domain attribute of the cookie (default: domain of page that created the cookie).
+ * @option Boolean secure If true, the secure attribute of the cookie will be set and the cookie transmission will
+ *                        require a secure protocol (like HTTPS).
+ * @type undefined
+ *
+ * @name $.cookie
+ * @cat Plugins/Cookie
+ * @author Klaus Hartl/klaus.hartl@stilbuero.de
+ */
+
+/**
+ * Get the value of a cookie with the given name.
+ *
+ * @example $.cookie('the_cookie');
+ * @desc Get the value of a cookie.
+ *
+ * @param String name The name of the cookie.
+ * @return The value of the cookie.
+ * @type String
+ *
+ * @name $.cookie
+ * @cat Plugins/Cookie
+ * @author Klaus Hartl/klaus.hartl@stilbuero.de
+ */
+jQuery.cookie = function(name, value, options)
+{
+  if (typeof value != 'undefined')
+  { // name and value given, set cookie
+    options = options || {};
+    if (value === null)
+    {
+      value = '';
+      options.expires = -1;
+    }
+    var expires = '';
+    if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString))
+    {
+      var date;
+      if (typeof options.expires == 'number')
+      {
+        date = new Date();
+        date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
+      }
+      else
+      {
+        date = options.expires;
+      }
+      expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
+    }
+    var path = options.path ? '; path=' + options.path : '';
+    var domain = options.domain ? '; domain=' + options.domain : '';
+    var secure = options.secure ? '; secure' : '';
+    document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
+  }
+  else
+  { // only name given, get cookie
+    var cookieValue = null;
+    if (document.cookie && document.cookie != '')
+    {
+      var cookies = document.cookie.split(';');
+      for (var i = 0; i < cookies.length; i++)
+      {
+        var cookie = jQuery.trim(cookies[i]);
+        // Does this cookie string begin with the name we want?
+        if (cookie.substring(0, name.length + 1) == (name + '='))
+        {
+          cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+          break;
+        }
+      }
+    }
+    return cookieValue;
+  }
+};
\ No newline at end of file

Added: websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.iviewer.js
==============================================================================
--- websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.iviewer.js (added)
+++ websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.iviewer.js Wed Jul  3 04:39:47 2013
@@ -0,0 +1,1045 @@
+/*
+ * iviewer Widget for jQuery UI
+ * https://github.com/can3p/iviewer
+ *
+ * Copyright (c) 2009 - 2012 Dmitry Petrov
+ * Dual licensed under the MIT and GPL licenses.
+ *  - http://www.opensource.org/licenses/mit-license.php
+ *  - http://www.gnu.org/copyleft/gpl.html
+ *
+ * Author: Dmitry Petrov
+ * Version: 0.7
+ */
+
+( function( $, undefined ) {
+
+//this code was taken from the https://github.com/furf/jquery-ui-touch-punch
+var mouseEvents = {
+    touchstart: 'mousedown',
+    touchmove: 'mousemove',
+    touchend: 'mouseup'
+};
+
+/**
+ * Convert a touch event to a mouse-like
+ */
+function makeMouseEvent (event) {
+    var touch = event.originalEvent.changedTouches[0];
+
+    return $.extend(event, {
+        type:    mouseEvents[event.type],
+        which:   1,
+        pageX:   touch.pageX,
+        pageY:   touch.pageY,
+        screenX: touch.screenX,
+        screenY: touch.screenY,
+        clientX: touch.clientX,
+        clientY: touch.clientY,
+        isTouchEvent: true
+    });
+}
+
+var mouseProto = $.ui.mouse.prototype,
+    _mouseInit = $.ui.mouse.prototype._mouseInit;
+
+mouseProto._mouseInit = function() {
+    var self = this;
+    self._touchActive = false;
+
+    this.element.bind( 'touchstart.' + this.widgetName, function(event) {
+        self._touchActive = true;
+        return self._mouseDown(makeMouseEvent(event));
+    })
+
+    var self = this;
+    // these delegates are required to keep context
+    this._mouseMoveDelegate = function(event) {
+        if (self._touchActive) {
+            return self._mouseMove(makeMouseEvent(event));
+        }
+    };
+    this._mouseUpDelegate = function(event) {
+        if (self._touchActive) {
+            self._touchActive = false;
+            return self._mouseUp(makeMouseEvent(event));
+        }
+    };
+
+    $(document)
+        .bind('touchmove.'+ this.widgetName, this._mouseMoveDelegate)
+        .bind('touchend.' + this.widgetName, this._mouseUpDelegate);
+
+    _mouseInit.apply(this);
+}
+
+/**
+ * Simple implementation of jQuery like getters/setters
+ * var val = something();
+ * something(val);
+ */
+var setter = function(setter, getter) {
+    return function(val) {
+        if (arguments.length === 0) {
+            return getter.apply(this);
+        } else {
+            setter.apply(this, arguments);
+        }
+    }
+};
+
+/**
+ * Internet explorer rotates image relative left top corner, so we should
+ * shift image when it's rotated.
+ */
+var ieTransforms = {
+        '0': {
+            marginLeft: 0,
+            marginTop: 0,
+            filter: 'progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod="auto expand")'
+        },
+
+        '90': {
+            marginLeft: -1,
+            marginTop: 1,
+            filter: 'progid:DXImageTransform.Microsoft.Matrix(M11=0, M12=-1, M21=1, M22=0, SizingMethod="auto expand")'
+        },
+
+        '180': {
+            marginLeft: 0,
+            marginTop: 0,
+            filter: 'progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=-1, SizingMethod="auto expand")'
+        },
+
+        '270': {
+            marginLeft: -1,
+            marginTop: 1,
+            filter: 'progid:DXImageTransform.Microsoft.Matrix(M11=0, M12=1, M21=-1, M22=0, SizingMethod="auto expand")'
+        }
+    },
+    useIeTransforms = (jQuery.browser.msie && parseInt(jQuery.browser.version, 10) <= 8);
+
+$.widget( "ui.iviewer", $.ui.mouse, {
+    widgetEventPrefix: "iviewer",
+    options : {
+        /**
+        * start zoom value for image, not used now
+        * may be equal to "fit" to fit image into container or scale in %
+        **/
+        zoom: "fit",
+        /**
+        * base value to scale image
+        **/
+        zoom_base: 100,
+        /**
+        * maximum zoom
+        **/
+        zoom_max: 800,
+        /**
+        * minimum zoom
+        **/
+        zoom_min: 25,
+        /**
+        * base of rate multiplier.
+        * zoom is calculated by formula: zoom_base * zoom_delta^rate
+        **/
+        zoom_delta: 1.4,
+        /**
+        * whether the zoom should be animated.
+        */
+        zoom_animation: true,
+        /**
+        * if true plugin doesn't add its own controls
+        **/
+        ui_disabled: false,
+        /**
+        * if false, plugin doesn't bind resize event on window and this must
+        * be handled manually
+        **/
+        update_on_resize: true,
+        /**
+        * event is triggered when zoom value is changed
+        * @param int new zoom value
+        * @return boolean if false zoom action is aborted
+        **/
+        onZoom: jQuery.noop,
+        /**
+        * event is triggered when zoom value is changed after image is set to the new dimensions
+        * @param int new zoom value
+        * @return boolean if false zoom action is aborted
+        **/
+        onAfterZoom: jQuery.noop,
+        /**
+        * event is fired on drag begin
+        * @param object coords mouse coordinates on the image
+        * @return boolean if false is returned, drag action is aborted
+        **/
+        onStartDrag: jQuery.noop,
+        /**
+        * event is fired on drag action
+        * @param object coords mouse coordinates on the image
+        **/
+        onDrag: jQuery.noop,
+        /**
+        * event is fired on drag stop
+        * @param object coords mouse coordinates on the image
+        **/
+        onStopDrag: jQuery.noop,
+        /**
+        * event is fired when mouse moves over image
+        * @param object coords mouse coordinates on the image
+        **/
+        onMouseMove: jQuery.noop,
+        /**
+        * mouse click event
+        * @param object coords mouse coordinates on the image
+        **/
+        onClick: jQuery.noop,
+        /**
+        * event is fired when image starts to load
+        */
+        onStartLoad: null,
+        /**
+        * event is fired, when image is loaded and initially positioned
+        */
+        onFinishLoad: null
+    },
+
+    _create: function() {
+        var me = this;
+
+        //drag variables
+        this.dx = 0;
+        this.dy = 0;
+
+        /* object containing actual information about image
+        *   @img_object.object - jquery img object
+        *   @img_object.orig_{width|height} - original dimensions
+        *   @img_object.display_{width|height} - actual dimensions
+        */
+        this.img_object = {};
+
+        this.zoom_object = {}; //object to show zoom status
+
+        this._angle = 0;
+
+        this.current_zoom = this.options.zoom;
+
+        if(this.options.src === null){
+            return;
+        }
+
+        this.container = this.element;
+
+        this._updateContainerInfo();
+
+        //init container
+        this.container.css("overflow","hidden");
+
+        if(this.options.update_on_resize == true)
+        {
+            $(window).resize(function()
+            {
+                me._updateContainerInfo();
+            });
+        }
+
+        this.img_object = new $.ui.iviewer.ImageObject(this.options.zoom_animation);
+
+        //init object
+        this.img_object.object()
+            //bind mouse events
+            .click(function(e){return me._click(e)})
+            .mousewheel(function(ev, delta)
+            {
+                //this event is there instead of containing div, because
+                //at opera it triggers many times on div
+                var zoom = (delta > 0)?1:-1;
+                me.zoom_by(zoom);
+                return false;
+            })
+            .prependTo(this.container);
+
+        this.container.bind('mousemove', function(ev) { me._handleMouseMove(ev); });
+
+        this.loadImage(this.options.src);
+
+        if(!this.options.ui_disabled)
+        {
+            this.createui();
+        }
+
+        this._mouseInit();
+    },
+
+    destroy: function() {
+        this._mouseDestroy();
+    },
+
+    _updateContainerInfo: function()
+    {
+        this.options.height = this.container.height();
+        this.options.width = this.container.width();
+    },
+
+    loadImage: function( src )
+    {
+        this.current_zoom = this.options.zoom;
+        var me = this;
+
+        this._trigger('onStartLoad', 0, src);
+
+        this.img_object.load(src, function() {
+                me.container.addClass("iviewer_cursor");
+
+                if(me.options.zoom == "fit"){
+                    me.fit(true);
+                }
+                else {
+                    me.set_zoom(me.options.zoom, true);
+                }
+
+                if(me.options.onFinishLoad)
+                {
+                    me._trigger('onFinishLoad', 0, src);
+                }
+        });
+    },
+
+    /**
+    * fits image in the container
+    *
+    * @param {boolean} skip_animation
+    **/
+    fit: function(skip_animation)
+    {
+        var aspect_ratio = this.img_object.orig_width() / this.img_object.orig_height();
+        var window_ratio = this.options.width /  this.options.height;
+        var choose_left = (aspect_ratio > window_ratio);
+        var new_zoom = 0;
+
+        if(choose_left){
+            new_zoom = this.options.width / this.img_object.orig_width() * 100;
+        }
+        else {
+            new_zoom = this.options.height / this.img_object.orig_height() * 100;
+        }
+
+      this.set_zoom(new_zoom, skip_animation);
+    },
+
+    /**
+    * center image in container
+    **/
+    center: function()
+    {
+        this.setCoords(-Math.round((this.img_object.display_width() - this.options.width)/2),
+                -Math.round((this.img_object.display_height() - this.options.height)/2));
+    },
+
+    /**
+    *   move a point in container to the center of display area
+    *   @param x a point in container
+    *   @param y a point in container
+    **/
+    moveTo: function(x, y)
+    {
+        var dx = x-Math.round(this.options.width/2);
+        var dy = y-Math.round(this.options.height/2);
+
+        var new_x = this.img_object.x() - dx;
+        var new_y = this.img_object.y() - dy;
+
+        this.setCoords(new_x, new_y);
+    },
+
+    /**
+     * Get container offset object.
+     */
+    getContainerOffset: function() {
+        return jQuery.extend({}, this.container.offset());
+    },
+
+    /**
+    * set coordinates of upper left corner of image object
+    **/
+    setCoords: function(x,y)
+    {
+        //do nothing while image is being loaded
+        if(!this.img_object.loaded()) { return; }
+
+        var coords = this._correctCoords(x,y);
+        this.img_object.x(coords.x);
+        this.img_object.y(coords.y);
+    },
+
+    _correctCoords: function( x, y )
+    {
+        x = parseInt(x, 10);
+        y = parseInt(y, 10);
+
+        //check new coordinates to be correct (to be in rect)
+        if(y > 0){
+            y = 0;
+        }
+        if(x > 0){
+            x = 0;
+        }
+        if(y + this.img_object.display_height() < this.options.height){
+            y = this.options.height - this.img_object.display_height();
+        }
+        if(x + this.img_object.display_width() < this.options.width){
+            x = this.options.width - this.img_object.display_width();
+        }
+        if(this.img_object.display_width() <= this.options.width){
+            x = -(this.img_object.display_width() - this.options.width)/2;
+        }
+        if(this.img_object.display_height() <= this.options.height){
+            y = -(this.img_object.display_height() - this.options.height)/2;
+        }
+
+        return { x: x, y:y };
+    },
+
+
+    /**
+    * convert coordinates on the container to the coordinates on the image (in original size)
+    *
+    * @return object with fields x,y according to coordinates or false
+    * if initial coords are not inside image
+    **/
+    containerToImage : function (x,y)
+    {
+        var coords = { x : x - this.img_object.x(),
+                 y :  y - this.img_object.y()
+        };
+
+        coords = this.img_object.toOriginalCoords(coords);
+
+        return { x :  util.descaleValue(coords.x, this.current_zoom),
+                 y :  util.descaleValue(coords.y, this.current_zoom)
+        };
+    },
+
+    /**
+    * convert coordinates on the image (in original size, and zero angle) to the coordinates on the container
+    *
+    * @return object with fields x,y according to coordinates
+    **/
+    imageToContainer : function (x,y)
+    {
+        var coords = {
+                x : util.scaleValue(x, this.current_zoom),
+                y : util.scaleValue(y, this.current_zoom)
+            };
+
+        return this.img_object.toRealCoords(coords);
+    },
+
+    /**
+    * get mouse coordinates on the image
+    * @param e - object containing pageX and pageY fields, e.g. mouse event object
+    *
+    * @return object with fields x,y according to coordinates or false
+    * if initial coords are not inside image
+    **/
+    _getMouseCoords : function(e)
+    {
+        var containerOffset = this.container.offset();
+            coords = this.containerToImage(e.pageX - containerOffset.left, e.pageY - containerOffset.top);
+
+        return coords;
+    },
+
+    /**
+    * set image scale to the new_zoom
+    *
+    * @param {number} new_zoom image scale in %
+    * @param {boolean} skip_animation
+    **/
+    set_zoom: function(new_zoom, skip_animation)
+    {
+        if (this._trigger('onZoom', 0, new_zoom) == false) {
+            return;
+        }
+
+        //do nothing while image is being loaded
+        if(!this.img_object.loaded()) { return; }
+
+        if(new_zoom <  this.options.zoom_min)
+        {
+            new_zoom = this.options.zoom_min;
+        }
+        else if(new_zoom > this.options.zoom_max)
+        {
+            new_zoom = this.options.zoom_max;
+        }
+
+        /* we fake these values to make fit zoom properly work */
+        if(this.current_zoom == "fit")
+        {
+            var old_x = Math.round(this.options.width/2 + this.img_object.orig_width()/2);
+            var old_y = Math.round(this.options.height/2 + this.img_object.orig_height()/2);
+            this.current_zoom = 100;
+        }
+        else {
+            var old_x = -this.img_object.x() + Math.round(this.options.width/2);
+            var old_y = -this.img_object.y() + Math.round(this.options.height/2);
+        }
+
+        var new_width = util.scaleValue(this.img_object.orig_width(), new_zoom);
+        var new_height = util.scaleValue(this.img_object.orig_height(), new_zoom);
+        var new_x = util.scaleValue( util.descaleValue(old_x, this.current_zoom), new_zoom);
+        var new_y = util.scaleValue( util.descaleValue(old_y, this.current_zoom), new_zoom);
+
+        new_x = this.options.width/2 - new_x;
+        new_y = this.options.height/2 - new_y;
+
+        this.img_object.display_width(new_width);
+        this.img_object.display_height(new_height);
+
+        var coords = this._correctCoords( new_x, new_y ),
+            self = this;
+
+        this.img_object.setImageProps(new_width, new_height, coords.x, coords.y,
+                                        skip_animation, function() {
+            self._trigger('onAfterZoom', 0, new_zoom );
+        });
+        this.current_zoom = new_zoom;
+
+        this.update_status();
+    },
+
+    /**
+    * changes zoom scale by delta
+    * zoom is calculated by formula: zoom_base * zoom_delta^rate
+    * @param Integer delta number to add to the current multiplier rate number
+    **/
+    zoom_by: function(delta)
+    {
+        var closest_rate = this.find_closest_zoom_rate(this.current_zoom);
+
+        var next_rate = closest_rate + delta;
+        var next_zoom = this.options.zoom_base * Math.pow(this.options.zoom_delta, next_rate)
+        if(delta > 0 && next_zoom < this.current_zoom)
+        {
+            next_zoom *= this.options.zoom_delta;
+        }
+
+        if(delta < 0 && next_zoom > this.current_zoom)
+        {
+            next_zoom /= this.options.zoom_delta;
+        }
+
+        this.set_zoom(next_zoom);
+    },
+
+    /**
+    * Rotate image
+    * @param {num} deg Degrees amount to rotate. Positive values rotate image clockwise.
+    *     Currently 0, 90, 180, 270 and -90, -180, -270 values are supported
+    *
+    * @param {boolean} abs If the flag is true if, the deg parameter will be considered as
+    *     a absolute value and relative otherwise.
+    * @return {num|null} Method will return current image angle if called without any arguments.
+    **/
+    angle: function(deg, abs) {
+        if (arguments.length === 0) { return this.img_object.angle(); }
+
+        if (deg < -270 || deg > 270 || deg % 90 !== 0) { return; }
+        if (!abs) { deg += this.img_object.angle(); }
+        if (deg < 0) { deg += 360; }
+        if (deg >= 360) { deg -= 360; }
+
+        if (deg === this.img_object.angle()) { return; }
+
+        this.img_object.angle(deg);
+        //the rotate behavior is different in all editors. For now we  just center the
+        //image. However, it will be better to try to keep the position.
+        this.center();
+        this._trigger('angle', 0, { angle: this.img_object.angle() });
+    },
+
+    /**
+    * finds closest multiplier rate for value
+    * basing on zoom_base and zoom_delta values from settings
+    * @param Number value zoom value to examine
+    **/
+    find_closest_zoom_rate: function(value)
+    {
+        if(value == this.options.zoom_base)
+        {
+            return 0;
+        }
+
+        function div(val1,val2) { return val1 / val2 };
+        function mul(val1,val2) { return val1 * val2 };
+
+        var func = (value > this.options.zoom_base)?mul:div;
+        var sgn = (value > this.options.zoom_base)?1:-1;
+
+        var mltplr = this.options.zoom_delta;
+        var rate = 1;
+
+        while(Math.abs(func(this.options.zoom_base, Math.pow(mltplr,rate)) - value) >
+              Math.abs(func(this.options.zoom_base, Math.pow(mltplr,rate+1)) - value))
+        {
+            rate++;
+        }
+
+        return sgn * rate;
+    },
+
+    /* update scale info in the container */
+    update_status: function()
+    {
+        if(!this.options.ui_disabled)
+        {
+            var percent = Math.round(100*this.img_object.display_height()/this.img_object.orig_height());
+            if(percent)
+            {
+                this.zoom_object.html(percent + "%");
+            }
+        }
+    },
+
+    /**
+     * Get some information about the image.
+     *     Currently orig_(width|height), display_(width|height), angle, zoom and src params are supported.
+     *
+     *  @param {string} parameter to check
+     *  @param {boolean} withoutRotation if param is orig_width or orig_height and this flag is set to true,
+     *      method will return original image width without considering rotation.
+     *
+     */
+    info: function(param, withoutRotation) {
+        if (!param) { return; }
+
+        switch (param) {
+            case 'orig_width':
+            case 'orig_height':
+                if (withoutRotation) {
+                    return (this.img_object.angle() % 180 === 0 ? this.img_object[param]() :
+                            param === 'orig_width' ? this.img_object.orig_height() : 
+                                                        this.img_object.orig_width());
+                } else {
+                    return this.img_object[param]();
+                }
+            case 'display_width':
+            case 'display_height':
+            case 'angle':
+                return this.img_object[param]();
+            case 'zoom':
+                return this.current_zoom;
+            case 'src':
+                return this.img_object.object().attr('src');
+        }
+    },
+
+    /**
+    *   callback for handling mousdown event to start dragging image
+    **/
+    _mouseStart: function( e )
+    {
+        $.ui.mouse.prototype._mouseStart.call(this, e);
+        if (this._trigger('onStartDrag', 0, this._getMouseCoords(e)) === false) {
+            return false;
+        }
+
+        /* start drag event*/
+        this.container.addClass("iviewer_drag_cursor");
+
+        this.dx = e.pageX - this.img_object.x();
+        this.dy = e.pageY - this.img_object.y();
+        return true;
+    },
+
+    _mouseCapture: function( e ) {
+        return true;
+    },
+
+    /**
+     * Handle mouse move if needed. User can avoid using this callback, because
+     *    he can get the same information through public methods.
+     *  @param {jQuery.Event} e
+     */
+    _handleMouseMove: function(e) {
+        this._trigger('onMouseMove', e, this._getMouseCoords(e));
+    },
+
+    /**
+    *   callback for handling mousemove event to drag image
+    **/
+    _mouseDrag: function(e)
+    {
+        $.ui.mouse.prototype._mouseDrag.call(this, e);
+        var ltop =  e.pageY - this.dy;
+        var lleft = e.pageX - this.dx;
+
+        this.setCoords(lleft, ltop);
+        this._trigger('onDrag', e, this._getMouseCoords(e));
+        return false;
+    },
+
+    /**
+    *   callback for handling stop drag
+    **/
+    _mouseStop: function(e)
+    {
+        $.ui.mouse.prototype._mouseStop.call(this, e);
+        this.container.removeClass("iviewer_drag_cursor");
+        this._trigger('onStopDrag', 0, this._getMouseCoords(e));
+    },
+
+    _click: function(e)
+    {
+        this._trigger('onClick', 0, this._getMouseCoords(e));
+    },
+
+    /**
+    *   create zoom buttons info box
+    **/
+    createui: function()
+    {
+        var me=this;
+
+        $("<div>", { 'class': "iviewer_zoom_in iviewer_common iviewer_button"})
+                    .bind('mousedown touchstart',function(){me.zoom_by(1); return false;})
+                    .appendTo(this.container);
+
+        $("<div>", { 'class': "iviewer_zoom_out iviewer_common iviewer_button"})
+                    .bind('mousedown touchstart',function(){me.zoom_by(- 1); return false;})
+                    .appendTo(this.container);
+
+        $("<div>", { 'class': "iviewer_zoom_zero iviewer_common iviewer_button"})
+                    .bind('mousedown touchstart',function(){me.set_zoom(100); return false;})
+                    .appendTo(this.container);
+
+        $("<div>", { 'class': "iviewer_zoom_fit iviewer_common iviewer_button"})
+                    .bind('mousedown touchstart',function(){me.fit(this); return false;})
+                    .appendTo(this.container);
+
+        this.zoom_object = $("<div>").addClass("iviewer_zoom_status iviewer_common")
+                                    .appendTo(this.container);
+
+        $("<div>", { 'class': "iviewer_rotate_left iviewer_common iviewer_button"})
+                    .bind('mousedown touchstart',function(){me.angle(-90); return false;})
+                    .appendTo(this.container);
+
+        $("<div>", { 'class': "iviewer_rotate_right iviewer_common iviewer_button" })
+                    .bind('mousedown touchstart',function(){me.angle(90); return false;})
+                    .appendTo(this.container);
+
+        this.update_status(); //initial status update
+    }
+
+} );
+
+/**
+ * @class $.ui.iviewer.ImageObject Class represents image and provides public api without
+ *     extending image prototype.
+ * @constructor
+ * @param {boolean} do_anim Do we want to animate image on dimension changes?
+ */
+$.ui.iviewer.ImageObject = function(do_anim) {
+    this._img = $("<img>")
+            //this is needed, because chromium sets them auto otherwise
+            .css({ position: "absolute", top :"0px", left: "0px"});
+
+    this._loaded = false;
+    this._swapDimensions = false;
+    this._do_anim = do_anim || false;
+    this.x(0, true);
+    this.y(0, true);
+    this.angle(0);
+};
+
+
+/** @lends $.ui.iviewer.ImageObject.prototype */
+(function() {
+    /**
+     * Restore initial object state.
+     *
+     * @param {number} w Image width.
+     * @param {number} h Image height.
+     */
+    this._reset = function(w, h) {
+        this._angle = 0;
+        this._swapDimensions = false;
+        this.x(0);
+        this.y(0);
+
+        this.orig_width(w);
+        this.orig_height(h);
+        this.display_width(w);
+        this.display_height(h);
+    };
+
+    /**
+     * Check if image is loaded.
+     *
+     * @return {boolean}
+     */
+    this.loaded = function() { return this._loaded; };
+
+    /**
+     * Load image.
+     *
+     * @param {string} src Image url.
+     * @param {Function=} loaded Function will be called on image load.
+     */
+    this.load = function(src, loaded) {
+        var self = this;
+
+        loaded = loaded || jQuery.noop;
+        this._loaded = false;
+
+        //If we assign new image url to the this._img IE9 fires onload event and image width and
+        //height are set to zero. So, we create another image object and load image through it.
+        var img = new Image();
+        img.onload = function() {
+            self._loaded = true;
+            self._reset(this.width, this.height);
+
+            self._img[0].src = src;
+            loaded();
+        };
+        img.src = src;
+
+        this._img
+            .removeAttr("src")
+            .removeAttr("width")
+            .removeAttr("height")
+            .removeAttr("style")
+            .css({ position: "absolute", top :"0px", left: "0px"})
+
+        this.angle(0);
+    };
+
+    this._dimension = function(prefix, name) {
+        var horiz = '_' + prefix + '_' + name,
+            vert = '_' + prefix + '_' + (name === 'height' ? 'width' : 'height');
+        return setter(function(val) {
+                this[this._swapDimensions ? horiz: vert] = val;
+            },
+            function() {
+                return this[this._swapDimensions ? horiz: vert];
+            });
+    };
+
+    /**
+     * Getters and setter for common image dimensions.
+     *    display_ means real image tag dimensions
+     *    orig_ means physical image dimensions.
+     *  Note, that dimensions are swapped if image is rotated. It necessary,
+     *  because as little as possible code should know about rotation.
+     */
+    this.display_width = this._dimension('display', 'width'),
+    this.display_height = this._dimension('display', 'height'),
+    this.display_diff = function() { return Math.floor( this.display_width() - this.display_height() ) };
+    this.orig_width = this._dimension('orig', 'width'),
+    this.orig_height = this._dimension('orig', 'height'),
+
+    /**
+     * Setter for  X coordinate. If image is rotated we need to additionaly shift an
+     *     image to map image coordinate to the visual position.
+     *
+     * @param {number} val Coordinate value.
+     * @param {boolean} skipCss If true, we only set the value and do not touch the dom.
+     */
+    this.x = setter(function(val, skipCss) { 
+            this._x = val;
+            if (!skipCss) {
+                this._img.css("left",this._x + (this._swapDimensions ? this.display_diff() / 2 : 0) + "px");
+            }
+        },
+        function() {
+            return this._x;
+        });
+
+    /**
+     * Setter for  Y coordinate. If image is rotated we need to additionaly shift an
+     *     image to map image coordinate to the visual position.
+     *
+     * @param {number} val Coordinate value.
+     * @param {boolean} skipCss If true, we only set the value and do not touch the dom.
+     */
+    this.y = setter(function(val, skipCss) {
+            this._y = val;
+            if (!skipCss) {
+                this._img.css("top",this._y - (this._swapDimensions ? this.display_diff() / 2 : 0) + "px");
+            }
+        },
+       function() {
+            return this._y;
+       });
+
+    /**
+     * Perform image rotation.
+     *
+     * @param {number} deg Absolute image angle. The method will work with values 0, 90, 180, 270 degrees.
+     */
+    this.angle = setter(function(deg) {
+            var prevSwap = this._swapDimensions;
+
+            this._angle = deg;
+            this._swapDimensions = deg % 180 !== 0;
+            
+            if (prevSwap !== this._swapDimensions) {
+                var verticalMod = this._swapDimensions ? -1 : 1;
+                this.x(this.x() - verticalMod * this.display_diff() / 2, true);
+                this.y(this.y() + verticalMod * this.display_diff() / 2, true);
+            };
+
+            var cssVal = 'rotate(' + deg + 'deg)',
+                img = this._img;
+
+            jQuery.each(['', '-webkit-', '-moz-', '-o-', '-ms-'], function(i, prefix) {
+                img.css(prefix + 'transform', cssVal);
+            });
+
+            if (useIeTransforms) {
+                jQuery.each(['-ms-', ''], function(i, prefix) {
+                    img.css(prefix + 'filter', ieTransforms[deg].filter);
+                });
+
+                img.css({
+                    marginLeft: ieTransforms[deg].marginLeft * this.display_diff() / 2,
+                    marginTop: ieTransforms[deg].marginTop * this.display_diff() / 2
+                });
+            }
+        },
+       function() { return this._angle; });
+
+    /**
+     * Map point in the container coordinates to the point in image coordinates.
+     *     You will get coordinates of point on image with respect to rotation,
+     *     but will be set as if image was not rotated.
+     *     So, if image was rotated 90 degrees, it's (0,0) point will be on the
+     *     top right corner.
+     *
+     * @param {{x: number, y: number}} point Point in container coordinates.
+     * @return  {{x: number, y: number}}
+     */
+    this.toOriginalCoords = function(point) {
+        switch (this.angle()) {
+            case 0: return { x: point.x, y: point.y }
+            case 90: return { x: point.y, y: this.display_width() - point.x }
+            case 180: return { x: this.display_width() - point.x, y: this.display_height() - point.y }
+            case 270: return { x: this.display_height() - point.y, y: point.x }
+        }
+    };
+
+    /**
+     * Map point in the image coordinates to the point in container coordinates.
+     *     You will get coordinates of point on container with respect to rotation.
+     *     Note, if image was rotated 90 degrees, it's (0,0) point will be on the
+     *     top right corner.
+     *
+     * @param {{x: number, y: number}} point Point in container coordinates.
+     * @return  {{x: number, y: number}}
+     */
+    this.toRealCoords = function(point) {
+        switch (this.angle()) {
+            case 0: return { x: this.x() + point.x, y: this.y() + point.y }
+            case 90: return { x: this.x() + this.display_width() - point.y, y: this.y() + point.x}
+            case 180: return { x: this.x() + this.display_width() - point.x, y: this.y() + this.display_height() - point.y}
+            case 270: return { x: this.x() + point.y, y: this.y() + this.display_height() - point.x}
+        }
+    };
+
+    /**
+     * @return {jQuery} Return image node. this is needed to add event handlers.
+     */
+    this.object = setter(jQuery.noop,
+                           function() { return this._img; });
+
+    /**
+     * Change image properties.
+     *
+     * @param {number} disp_w Display width;
+     * @param {number} disp_h Display height;
+     * @param {number} x
+     * @param {number} y
+     * @param {boolean} skip_animation If true, the animation will be skiped despite the
+     *     value set in constructor.
+     * @param {Function=} complete Call back will be fired when zoom will be complete.
+     */
+    this.setImageProps = function(disp_w, disp_h, x, y, skip_animation, complete) {
+        complete = complete || jQuery.noop;
+
+        this.display_width(disp_w);
+        this.display_height(disp_h);
+        this.x(x, true);
+        this.y(y, true);
+
+        var w = this._swapDimensions ? disp_h : disp_w;
+        var h = this._swapDimensions ? disp_w : disp_h;
+
+        var params = {
+            width: w,
+            height: h,
+            top: y - (this._swapDimensions ? this.display_diff() / 2 : 0) + "px",
+            left: x + (this._swapDimensions ? this.display_diff() / 2 : 0) + "px" 
+        };
+
+        if (useIeTransforms) {
+            jQuery.extend(params, {
+                marginLeft: ieTransforms[this.angle()].marginLeft * this.display_diff() / 2,
+                marginTop: ieTransforms[this.angle()].marginTop * this.display_diff() / 2
+            });
+        }
+
+        var swapDims = this._swapDimensions,
+            img = this._img;
+
+        //here we come: another IE oddness. If image is rotated 90 degrees with a filter, than
+        //width and height getters return real width and height of rotated image. The bad news
+        //is that to set height you need to set a width and vice versa. Fuck IE.
+        //So, in this case we have to animate width and height manually.
+        if(useIeTransforms && swapDims) {
+            var ieh = this._img.width(),
+                iew = this._img.height(),
+                iedh = params.height - ieh;
+                iedw = params.width - iew;
+
+            delete params.width;
+            delete params.height;
+        }
+
+        if (this._do_anim && !skip_animation) {
+            this._img.animate(params, {
+                duration: 200, 
+                complete: complete,
+                step: function(now, fx) {
+                    if(useIeTransforms && swapDims && (fx.prop === 'top')) {
+                        var percent = (now - fx.start) / (fx.end - fx.start);
+
+                        img.height(ieh + iedh * percent);
+                        img.width(iew + iedw * percent);
+                        img.css('top', now);
+                    }
+                }
+            });
+        } else {
+            this._img.css(params);
+            setTimeout(complete, 0); //both if branches should behave equally.
+        }
+    };
+
+}).apply($.ui.iviewer.ImageObject.prototype);
+
+
+
+var util = {
+    scaleValue: function(value, toZoom)
+    {
+        return value * toZoom / 100;
+    },
+
+    descaleValue: function(value, fromZoom)
+    {
+        return value * 100 / fromZoom;
+    }
+};
+
+ } )( jQuery, undefined );

Added: websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.iviewer.min.js
==============================================================================
--- websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.iviewer.min.js (added)
+++ websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.iviewer.min.js Wed Jul  3 04:39:47 2013
@@ -0,0 +1,42 @@
+/*
+ * iviewer Widget for jQuery UI
+ * https://github.com/can3p/iviewer
+ *
+ * Copyright (c) 2009 - 2012 Dmitry Petrov
+ * Dual licensed under the MIT and GPL licenses.
+ *  - http://www.opensource.org/licenses/mit-license.php
+ *  - http://www.gnu.org/copyleft/gpl.html
+ *
+ * Author: Dmitry Petrov
+ * Version: 0.7
+ */
+(function($,undefined){var mouseEvents={touchstart:"mousedown",touchmove:"mousemove",touchend:"mouseup"};function makeMouseEvent(event){var touch=event.originalEvent.changedTouches[0];return $.extend(event,{type:mouseEvents[event.type],which:1,pageX:touch.pageX,pageY:touch.pageY,screenX:touch.screenX,screenY:touch.screenY,clientX:touch.clientX,clientY:touch.clientY,isTouchEvent:true})}var mouseProto=$.ui.mouse.prototype,_mouseInit=$.ui.mouse.prototype._mouseInit;mouseProto._mouseInit=function(){var self=
+this;self._touchActive=false;this.element.bind("touchstart."+this.widgetName,function(event){self._touchActive=true;return self._mouseDown(makeMouseEvent(event))});var self=this;this._mouseMoveDelegate=function(event){if(self._touchActive)return self._mouseMove(makeMouseEvent(event))};this._mouseUpDelegate=function(event){if(self._touchActive){self._touchActive=false;return self._mouseUp(makeMouseEvent(event))}};$(document).bind("touchmove."+this.widgetName,this._mouseMoveDelegate).bind("touchend."+
+this.widgetName,this._mouseUpDelegate);_mouseInit.apply(this)};var setter=function(setter,getter){return function(val){if(arguments.length===0)return getter.apply(this);else setter.apply(this,arguments)}};var ieTransforms={"0":{marginLeft:0,marginTop:0,filter:'progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod="auto expand")'},"90":{marginLeft:-1,marginTop:1,filter:'progid:DXImageTransform.Microsoft.Matrix(M11=0, M12=-1, M21=1, M22=0, SizingMethod="auto expand")'},"180":{marginLeft:0,
+marginTop:0,filter:'progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=-1, SizingMethod="auto expand")'},"270":{marginLeft:-1,marginTop:1,filter:'progid:DXImageTransform.Microsoft.Matrix(M11=0, M12=1, M21=-1, M22=0, SizingMethod="auto expand")'}},useIeTransforms=jQuery.browser.msie&&parseInt(jQuery.browser.version,10)<=8;$.widget("ui.iviewer",$.ui.mouse,{widgetEventPrefix:"iviewer",options:{zoom:"fit",zoom_base:100,zoom_max:800,zoom_min:25,zoom_delta:1.4,zoom_animation:true,ui_disabled:false,
+update_on_resize:true,onZoom:jQuery.noop,onAfterZoom:jQuery.noop,onStartDrag:jQuery.noop,onDrag:jQuery.noop,onStopDrag:jQuery.noop,onMouseMove:jQuery.noop,onClick:jQuery.noop,onStartLoad:null,onFinishLoad:null},_create:function(){var me=this;this.dx=0;this.dy=0;this.img_object={};this.zoom_object={};this._angle=0;this.current_zoom=this.options.zoom;if(this.options.src===null)return;this.container=this.element;this._updateContainerInfo();this.container.css("overflow","hidden");if(this.options.update_on_resize==
+true)$(window).resize(function(){me._updateContainerInfo()});this.img_object=new $.ui.iviewer.ImageObject(this.options.zoom_animation);this.img_object.object().click(function(e){return me._click(e)}).mousewheel(function(ev,delta){var zoom=delta>0?1:-1;me.zoom_by(zoom);return false}).prependTo(this.container);this.container.bind("mousemove",function(ev){me._handleMouseMove(ev)});this.loadImage(this.options.src);if(!this.options.ui_disabled)this.createui();this._mouseInit()},destroy:function(){this._mouseDestroy()},
+_updateContainerInfo:function(){this.options.height=this.container.height();this.options.width=this.container.width()},loadImage:function(src){this.current_zoom=this.options.zoom;var me=this;this._trigger("onStartLoad",0,src);this.img_object.load(src,function(){me.container.addClass("iviewer_cursor");if(me.options.zoom=="fit")me.fit(true);else me.set_zoom(me.options.zoom,true);if(me.options.onFinishLoad)me._trigger("onFinishLoad",0,src)})},fit:function(skip_animation){var aspect_ratio=this.img_object.orig_width()/
+this.img_object.orig_height();var window_ratio=this.options.width/this.options.height;var choose_left=aspect_ratio>window_ratio;var new_zoom=0;if(choose_left)new_zoom=this.options.width/this.img_object.orig_width()*100;else new_zoom=this.options.height/this.img_object.orig_height()*100;this.set_zoom(new_zoom,skip_animation)},center:function(){this.setCoords(-Math.round((this.img_object.display_width()-this.options.width)/2),-Math.round((this.img_object.display_height()-this.options.height)/2))},moveTo:function(x,
+y){var dx=x-Math.round(this.options.width/2);var dy=y-Math.round(this.options.height/2);var new_x=this.img_object.x()-dx;var new_y=this.img_object.y()-dy;this.setCoords(new_x,new_y)},getContainerOffset:function(){return jQuery.extend({},this.container.offset())},setCoords:function(x,y){if(!this.img_object.loaded())return;var coords=this._correctCoords(x,y);this.img_object.x(coords.x);this.img_object.y(coords.y)},_correctCoords:function(x,y){x=parseInt(x,10);y=parseInt(y,10);if(y>0)y=0;if(x>0)x=0;
+if(y+this.img_object.display_height()<this.options.height)y=this.options.height-this.img_object.display_height();if(x+this.img_object.display_width()<this.options.width)x=this.options.width-this.img_object.display_width();if(this.img_object.display_width()<=this.options.width)x=-(this.img_object.display_width()-this.options.width)/2;if(this.img_object.display_height()<=this.options.height)y=-(this.img_object.display_height()-this.options.height)/2;return{x:x,y:y}},containerToImage:function(x,y){var coords=
+{x:x-this.img_object.x(),y:y-this.img_object.y()};coords=this.img_object.toOriginalCoords(coords);return{x:util.descaleValue(coords.x,this.current_zoom),y:util.descaleValue(coords.y,this.current_zoom)}},imageToContainer:function(x,y){var coords={x:util.scaleValue(x,this.current_zoom),y:util.scaleValue(y,this.current_zoom)};return this.img_object.toRealCoords(coords)},_getMouseCoords:function(e){var containerOffset=this.container.offset();coords=this.containerToImage(e.pageX-containerOffset.left,e.pageY-
+containerOffset.top);return coords},set_zoom:function(new_zoom,skip_animation){if(this._trigger("onZoom",0,new_zoom)==false)return;if(!this.img_object.loaded())return;if(new_zoom<this.options.zoom_min)new_zoom=this.options.zoom_min;else if(new_zoom>this.options.zoom_max)new_zoom=this.options.zoom_max;if(this.current_zoom=="fit"){var old_x=Math.round(this.options.width/2+this.img_object.orig_width()/2);var old_y=Math.round(this.options.height/2+this.img_object.orig_height()/2);this.current_zoom=100}else{var old_x=
+-this.img_object.x()+Math.round(this.options.width/2);var old_y=-this.img_object.y()+Math.round(this.options.height/2)}var new_width=util.scaleValue(this.img_object.orig_width(),new_zoom);var new_height=util.scaleValue(this.img_object.orig_height(),new_zoom);var new_x=util.scaleValue(util.descaleValue(old_x,this.current_zoom),new_zoom);var new_y=util.scaleValue(util.descaleValue(old_y,this.current_zoom),new_zoom);new_x=this.options.width/2-new_x;new_y=this.options.height/2-new_y;this.img_object.display_width(new_width);
+this.img_object.display_height(new_height);var coords=this._correctCoords(new_x,new_y),self=this;this.img_object.setImageProps(new_width,new_height,coords.x,coords.y,skip_animation,function(){self._trigger("onAfterZoom",0,new_zoom)});this.current_zoom=new_zoom;this.update_status()},zoom_by:function(delta){var closest_rate=this.find_closest_zoom_rate(this.current_zoom);var next_rate=closest_rate+delta;var next_zoom=this.options.zoom_base*Math.pow(this.options.zoom_delta,next_rate);if(delta>0&&next_zoom<
+this.current_zoom)next_zoom*=this.options.zoom_delta;if(delta<0&&next_zoom>this.current_zoom)next_zoom/=this.options.zoom_delta;this.set_zoom(next_zoom)},angle:function(deg,abs){if(arguments.length===0)return this.img_object.angle();if(deg<-270||deg>270||deg%90!==0)return;if(!abs)deg+=this.img_object.angle();if(deg<0)deg+=360;if(deg>=360)deg-=360;if(deg===this.img_object.angle())return;this.img_object.angle(deg);this.center();this._trigger("angle",0,{angle:this.img_object.angle()})},find_closest_zoom_rate:function(value){if(value==
+this.options.zoom_base)return 0;function div(val1,val2){return val1/val2}function mul(val1,val2){return val1*val2}var func=value>this.options.zoom_base?mul:div;var sgn=value>this.options.zoom_base?1:-1;var mltplr=this.options.zoom_delta;var rate=1;while(Math.abs(func(this.options.zoom_base,Math.pow(mltplr,rate))-value)>Math.abs(func(this.options.zoom_base,Math.pow(mltplr,rate+1))-value))rate++;return sgn*rate},update_status:function(){if(!this.options.ui_disabled){var percent=Math.round(100*this.img_object.display_height()/
+this.img_object.orig_height());if(percent)this.zoom_object.html(percent+"%")}},info:function(param,withoutRotation){if(!param)return;switch(param){case "orig_width":case "orig_height":if(withoutRotation)return this.img_object.angle()%180===0?this.img_object[param]():param==="orig_width"?this.img_object.orig_height():this.img_object.orig_width();else return this.img_object[param]();case "display_width":case "display_height":case "angle":return this.img_object[param]();case "zoom":return this.current_zoom;
+case "src":return this.img_object.object().attr("src")}},_mouseStart:function(e){$.ui.mouse.prototype._mouseStart.call(this,e);if(this._trigger("onStartDrag",0,this._getMouseCoords(e))===false)return false;this.container.addClass("iviewer_drag_cursor");this.dx=e.pageX-this.img_object.x();this.dy=e.pageY-this.img_object.y();return true},_mouseCapture:function(e){return true},_handleMouseMove:function(e){this._trigger("onMouseMove",e,this._getMouseCoords(e))},_mouseDrag:function(e){$.ui.mouse.prototype._mouseDrag.call(this,
+e);var ltop=e.pageY-this.dy;var lleft=e.pageX-this.dx;this.setCoords(lleft,ltop);this._trigger("onDrag",e,this._getMouseCoords(e));return false},_mouseStop:function(e){$.ui.mouse.prototype._mouseStop.call(this,e);this.container.removeClass("iviewer_drag_cursor");this._trigger("onStopDrag",0,this._getMouseCoords(e))},_click:function(e){this._trigger("onClick",0,this._getMouseCoords(e))},createui:function(){var me=this;$("<div>",{"class":"iviewer_zoom_in iviewer_common iviewer_button"}).bind("mousedown touchstart",
+function(){me.zoom_by(1);return false}).appendTo(this.container);$("<div>",{"class":"iviewer_zoom_out iviewer_common iviewer_button"}).bind("mousedown touchstart",function(){me.zoom_by(-1);return false}).appendTo(this.container);$("<div>",{"class":"iviewer_zoom_zero iviewer_common iviewer_button"}).bind("mousedown touchstart",function(){me.set_zoom(100);return false}).appendTo(this.container);$("<div>",{"class":"iviewer_zoom_fit iviewer_common iviewer_button"}).bind("mousedown touchstart",function(){me.fit(this);
+return false}).appendTo(this.container);this.zoom_object=$("<div>").addClass("iviewer_zoom_status iviewer_common").appendTo(this.container);$("<div>",{"class":"iviewer_rotate_left iviewer_common iviewer_button"}).bind("mousedown touchstart",function(){me.angle(-90);return false}).appendTo(this.container);$("<div>",{"class":"iviewer_rotate_right iviewer_common iviewer_button"}).bind("mousedown touchstart",function(){me.angle(90);return false}).appendTo(this.container);this.update_status()}});$.ui.iviewer.ImageObject=
+function(do_anim){this._img=$("<img>").css({position:"absolute",top:"0px",left:"0px"});this._loaded=false;this._swapDimensions=false;this._do_anim=do_anim||false;this.x(0,true);this.y(0,true);this.angle(0)};(function(){this._reset=function(w,h){this._angle=0;this._swapDimensions=false;this.x(0);this.y(0);this.orig_width(w);this.orig_height(h);this.display_width(w);this.display_height(h)};this.loaded=function(){return this._loaded};this.load=function(src,loaded){var self=this;loaded=loaded||jQuery.noop;
+this._loaded=false;var img=new Image;img.onload=function(){self._loaded=true;self._reset(this.width,this.height);self._img[0].src=src;loaded()};img.src=src;this._img.removeAttr("src").removeAttr("width").removeAttr("height").removeAttr("style").css({position:"absolute",top:"0px",left:"0px"});this.angle(0)};this._dimension=function(prefix,name){var horiz="_"+prefix+"_"+name,vert="_"+prefix+"_"+(name==="height"?"width":"height");return setter(function(val){this[this._swapDimensions?horiz:vert]=val},
+function(){return this[this._swapDimensions?horiz:vert]})};this.display_width=this._dimension("display","width"),this.display_height=this._dimension("display","height"),this.display_diff=function(){return Math.floor(this.display_width()-this.display_height())};this.orig_width=this._dimension("orig","width"),this.orig_height=this._dimension("orig","height"),this.x=setter(function(val,skipCss){this._x=val;if(!skipCss)this._img.css("left",this._x+(this._swapDimensions?this.display_diff()/2:0)+"px")},
+function(){return this._x});this.y=setter(function(val,skipCss){this._y=val;if(!skipCss)this._img.css("top",this._y-(this._swapDimensions?this.display_diff()/2:0)+"px")},function(){return this._y});this.angle=setter(function(deg){var prevSwap=this._swapDimensions;this._angle=deg;this._swapDimensions=deg%180!==0;if(prevSwap!==this._swapDimensions){var verticalMod=this._swapDimensions?-1:1;this.x(this.x()-verticalMod*this.display_diff()/2,true);this.y(this.y()+verticalMod*this.display_diff()/2,true)}var cssVal=
+"rotate("+deg+"deg)",img=this._img;jQuery.each(["","-webkit-","-moz-","-o-","-ms-"],function(i,prefix){img.css(prefix+"transform",cssVal)});if(useIeTransforms){jQuery.each(["-ms-",""],function(i,prefix){img.css(prefix+"filter",ieTransforms[deg].filter)});img.css({marginLeft:ieTransforms[deg].marginLeft*this.display_diff()/2,marginTop:ieTransforms[deg].marginTop*this.display_diff()/2})}},function(){return this._angle});this.toOriginalCoords=function(point){switch(this.angle()){case 0:return{x:point.x,
+y:point.y};case 90:return{x:point.y,y:this.display_width()-point.x};case 180:return{x:this.display_width()-point.x,y:this.display_height()-point.y};case 270:return{x:this.display_height()-point.y,y:point.x}}};this.toRealCoords=function(point){switch(this.angle()){case 0:return{x:this.x()+point.x,y:this.y()+point.y};case 90:return{x:this.x()+this.display_width()-point.y,y:this.y()+point.x};case 180:return{x:this.x()+this.display_width()-point.x,y:this.y()+this.display_height()-point.y};case 270:return{x:this.x()+
+point.y,y:this.y()+this.display_height()-point.x}}};this.object=setter(jQuery.noop,function(){return this._img});this.setImageProps=function(disp_w,disp_h,x,y,skip_animation,complete){complete=complete||jQuery.noop;this.display_width(disp_w);this.display_height(disp_h);this.x(x,true);this.y(y,true);var w=this._swapDimensions?disp_h:disp_w;var h=this._swapDimensions?disp_w:disp_h;var params={width:w,height:h,top:y-(this._swapDimensions?this.display_diff()/2:0)+"px",left:x+(this._swapDimensions?this.display_diff()/
+2:0)+"px"};if(useIeTransforms)jQuery.extend(params,{marginLeft:ieTransforms[this.angle()].marginLeft*this.display_diff()/2,marginTop:ieTransforms[this.angle()].marginTop*this.display_diff()/2});var swapDims=this._swapDimensions,img=this._img;if(useIeTransforms&&swapDims){var ieh=this._img.width(),iew=this._img.height(),iedh=params.height-ieh;iedw=params.width-iew;delete params.width;delete params.height}if(this._do_anim&&!skip_animation)this._img.animate(params,{duration:200,complete:complete,step:function(now,
+fx){if(useIeTransforms&&swapDims&&fx.prop==="top"){var percent=(now-fx.start)/(fx.end-fx.start);img.height(ieh+iedh*percent);img.width(iew+iedw*percent);img.css("top",now)}}});else{this._img.css(params);setTimeout(complete,0)}}}).apply($.ui.iviewer.ImageObject.prototype);var util={scaleValue:function(value,toZoom){return value*toZoom/100},descaleValue:function(value,fromZoom){return value*100/fromZoom}}})(jQuery,undefined);

Added: websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.mousewheel.min.js
==============================================================================
--- websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.mousewheel.min.js (added)
+++ websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.mousewheel.min.js Wed Jul  3 04:39:47 2013
@@ -0,0 +1,13 @@
+/*! Copyright (c) 2011 Brandon Aaron (http://brandonaaron.net)
+ * Licensed under the MIT License (LICENSE.txt).
+ *
+ * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
+ * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
+ * Thanks to: Seamus Leahy for adding deltaX and deltaY
+ *
+ * Version: 3.0.6
+ * 
+ * Requires: 1.2.2+
+ */
+(function(d){function e(a){var b=a||window.event,c=[].slice.call(arguments,1),f=0,e=0,g=0,a=d.event.fix(b);a.type="mousewheel";b.wheelDelta&&(f=b.wheelDelta/120);b.detail&&(f=-b.detail/3);g=f;b.axis!==void 0&&b.axis===b.HORIZONTAL_AXIS&&(g=0,e=-1*f);b.wheelDeltaY!==void 0&&(g=b.wheelDeltaY/120);b.wheelDeltaX!==void 0&&(e=-1*b.wheelDeltaX/120);c.unshift(a,f,e,g);return(d.event.dispatch||d.event.handle).apply(this,c)}var c=["DOMMouseScroll","mousewheel"];if(d.event.fixHooks)for(var h=c.length;h;)d.event.fixHooks[c[--h]]=
+d.event.mouseHooks;d.event.special.mousewheel={setup:function(){if(this.addEventListener)for(var a=c.length;a;)this.addEventListener(c[--a],e,false);else this.onmousewheel=e},teardown:function(){if(this.removeEventListener)for(var a=c.length;a;)this.removeEventListener(c[--a],e,false);else this.onmousewheel=null}};d.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})})(jQuery);
\ No newline at end of file

Added: websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.panzoom.js
==============================================================================
--- websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.panzoom.js (added)
+++ websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.panzoom.js Wed Jul  3 04:39:47 2013
@@ -0,0 +1,467 @@
+/*
+ * jQuery PanZoom Plugin
+ * Pan and zoom an image within a parent div.
+ *
+ * version: 0.9.0
+ * @requires jQuery v1.4.2 or later (earlier probably work, but untested so far)
+ *
+ * Copyright (c) 2011 Ben Lumley
+ * Examples and documentation at: https://github.com/benlumley/jQuery-PanZoom
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+*/
+
+(function( $ ){
+
+  $.fn.panZoom = function(method) {
+
+    if ( methods[method] ) {
+      return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
+    } else if ( typeof method === 'object' || ! method ) {
+      return methods.init.apply( this, arguments );
+    } else {
+      $.error( 'Method ' +  method + ' does not exist' );
+    }
+
+  };
+
+	$.fn.panZoom.defaults = {
+      zoomIn   					: 	false,
+      zoomOut 					: 	false,
+		  panUp							:		false,
+		  panDown						:		false,
+		  panLeft						:		false,
+		  panRight					:		false,
+			fit								: 	false,
+		  out_x1						:		false,
+		  out_y1						:		false,
+		  out_x2						:		false,
+		  out_y2						:		false,
+			min_width					:   20,
+			min_height 				:   20,
+			zoom_step					:   3,
+			pan_step  				:   3,
+			debug							: 	false,
+			directedit				:   false,
+      aspect    				:   true,
+      factor    				:   1,
+		  animate   				:   true,
+			animate_duration	: 	200,
+		 	animate_easing		: 	'linear',
+			double_click	 		: 	true,
+			mousewheel				: 	true,
+			mousewheel_delta	: 	1,
+			draggable					:   true,
+			clickandhold			: 	true
+  };
+
+	var settings = {}
+
+  var methods = {
+		'init': function (options) {
+			$.extend(settings, $.fn.panZoom.defaults, options);
+  		setupCSS.apply(this);
+			setupData.apply(this);
+			setupBindings.apply(this);
+			methods.readPosition.apply(this);
+		},
+
+		'destroy': function () {
+			$(window).unbind('.panZoom');
+			this.removeData('panZoom');
+		},
+
+		'loadImage': function () {
+			var data = this.data('panZoom');
+      loadTargetDimensions.apply(this);
+			methods.updatePosition.apply(this);
+			if (data.last_image != null && data.last_image != this.attr('src')) {
+        methods.fit.apply(this);
+			}
+			data.last_image = this.attr('src');
+			data.loaded = true;
+		},
+
+	  'readPosition': function () {
+				var data = this.data('panZoom');
+		 		if (settings.out_x1) { data.position.x1 = settings.out_x1.val()*settings.factor }
+		 		if (settings.out_y1) { data.position.y1 = settings.out_y1.val()*settings.factor }
+		 		if (settings.out_x2) { data.position.x2 = settings.out_x2.val()*settings.factor }
+		 		if (settings.out_y2) { data.position.y2 = settings.out_y2.val()*settings.factor }
+				methods.updatePosition.apply(this);
+		 },
+
+		'updatePosition': function() {
+			validatePosition.apply(this);
+			writePosition.apply(this);
+			applyPosition.apply(this);
+		},
+
+	  'fit': function () {
+			var data = this.data('panZoom');
+			data.position.x1 = 0;
+			data.position.y1 = 0;
+			data.position.x2 = data.viewport_dimensions.x;
+			data.position.y2 = data.viewport_dimensions.y;
+			methods.updatePosition.apply(this);
+		},
+
+		'zoomIn': function (steps) {
+			var data = this.data('panZoom');
+			if (typeof(steps) == 'undefined') {
+				var steps = getStepDimensions.apply(this);
+			}
+            console.debug(data.position);
+			console.debug(data.viewport_dimensions);
+			data.position.x1 = data.position.x1*1 - steps.zoom.x;
+			data.position.x2 = data.position.x2*1 + steps.zoom.x;
+			data.position.y1 = data.position.y1*1 - steps.zoom.y;
+			data.position.y2 = data.position.y2*1 + steps.zoom.y;
+			methods.updatePosition.apply(this);
+		 },
+
+		'zoomOut': function (steps) {
+			var data = this.data('panZoom');
+			if (typeof(steps) == 'undefined') {
+				var steps = getStepDimensions.apply(this);
+			}
+			data.position.x1 = data.position.x1*1 + steps.zoom.x;
+			data.position.x2 = data.position.x2*1 - steps.zoom.x;
+			data.position.y1 = data.position.y1*1 + steps.zoom.y;
+			data.position.y2 = data.position.y2*1 - steps.zoom.y;
+			methods.updatePosition.apply(this);
+		 },
+
+		'panUp': function () {
+			var data = this.data('panZoom');
+			var steps = getStepDimensions.apply(this);
+			data.position.y1 -= steps.pan.y;
+			data.position.y2 -= steps.pan.y;
+			methods.updatePosition.apply(this);
+		},
+
+		'panDown': function () {
+			var data = this.data('panZoom');
+			var steps = getStepDimensions.apply(this);
+			data.position.y1 = data.position.y1*1 + steps.pan.y;
+			data.position.y2 = data.position.y2*1 + steps.pan.y;
+			methods.updatePosition.apply(this);
+		},
+
+		'panLeft': function () {
+			var data = this.data('panZoom');
+			var steps = getStepDimensions.apply(this);
+			data.position.x1 -= steps.pan.x;
+			data.position.x2 -= steps.pan.x;
+			methods.updatePosition.apply(this);
+		},
+
+		'panRight': function () {
+			var data = this.data('panZoom');
+			var steps = getStepDimensions.apply(this);
+			data.position.x1 = data.position.x1*1 + steps.pan.x;
+			data.position.x2 = data.position.x2*1 + steps.pan.x;
+			methods.updatePosition.apply(this);
+		},
+
+		'mouseWheel': function (delta) {
+			// first calculate how much to zoom in/out
+			var steps = getStepDimensions.apply(this);
+			steps.zoom.x = steps.zoom.x * (Math.abs(delta) / settings.mousewheel_delta);
+			steps.zoom.y = steps.zoom.y * (Math.abs(delta) / settings.mousewheel_delta);
+
+			// then do it
+			if (delta > 0) {
+				methods.zoomIn.apply(this, [steps]);
+			} else if (delta < 0) {
+				methods.zoomOut.apply(this, [steps]);
+			}
+		},
+
+		'dragComplete': function() {
+			var data = this.data('panZoom');
+			data.position.x1 = this.position().left;
+			data.position.y1 = this.position().top;
+			data.position.x2 = this.position().left*1 + this.width();
+			data.position.y2 = this.position().top*1 + this.height();
+			methods.updatePosition.apply(this);
+		},
+
+		'mouseDown': function (action) {
+			methods[action].apply(this);
+
+			if (settings.clickandhold) {
+				var data = this.data('panZoom');
+				methods.mouseUp.apply(this);
+				data.mousedown_interval = window.setInterval(function (that, action) {
+					that.panZoom(action);
+				}, settings.animate_duration, this, action);
+			}
+		},
+
+		'mouseUp': function() {
+			var data = this.data('panZoom');
+			window.clearInterval(data.mousedown_interval);
+		}
+
+  }
+
+	function setupBindings() {
+
+		eventData = { target: this }
+
+		// bind up controls
+		if (settings.zoomIn) {
+			settings.zoomIn.bind('mousedown.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseDown', 'zoomIn');
+			}).bind('mouseleave.panZoom mouseup.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseUp');
+			});
+		}
+
+		if (settings.zoomOut) {
+			settings.zoomOut.bind('mousedown.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseDown', 'zoomOut');
+			}).bind('mouseleave.panZoom mouseup.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseUp');
+			});
+		}
+
+		if (settings.panUp) {
+			settings.panUp.bind('mousedown.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseDown', 'panUp');
+			}).bind('mouseleave.panZoom mouseup.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseUp');
+			});
+		}
+
+		if (settings.panDown) {
+			settings.panDown.bind('mousedown.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseDown', 'panDown');
+			}).bind('mouseleave.panZoom mouseup.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseUp');
+			});
+		}
+
+		if (settings.panLeft) {
+			settings.panLeft.bind('mousedown.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseDown', 'panLeft');
+			}).bind('mouseleave.panZoom mouseup.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseUp');
+			});
+		}
+
+		if (settings.panRight) {
+			settings.panRight.bind('mousedown.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseDown', 'panRight');
+			}).bind('mouseleave.panZoom mouseup.panZoom', eventData, function(event) {
+				event.preventDefault(); event.data.target.panZoom('mouseUp');
+			});
+		}
+
+		if (settings.fit) { settings.fit.bind('click.panZoom', eventData, function(event) { event.preventDefault(); event.data.target.panZoom('fit'); } ); }
+
+		// double click
+		if (settings.double_click) {
+			this.bind('dblclick.panZoom', eventData, function(event, delta) { event.data.target.panZoom('zoomIn') } );
+		}
+
+		// mousewheel
+		if (settings.mousewheel && typeof(this.mousewheel) == 'function') {
+			this.parent().mousewheel(function(event, delta) { event.preventDefault(); $(this).find('img').panZoom('mouseWheel', delta) } );
+		} else if (settings.mousewheel) {
+			alert('Mousewheel requires mousewheel from jQuery tools - please include jQuery tools or disable mousewheel to remove this warning.')
+		}
+
+		// direct form input
+		if (settings.directedit) {
+			$(settings.out_x1).add(settings.out_y1).add(settings.out_x2).add(settings.out_y2).bind('change.panZoom blur.panZoom', eventData, function(event) { event.data.target.panZoom('readPosition') } );
+		}
+
+		if (settings.draggable && typeof(this.draggable) == 'function') {
+			this.draggable({
+				stop: function () { $(this).panZoom('dragComplete');	}
+			});
+		}	else if (settings.draggable) {
+				alert('Draggable requires jQuery UI - please include jQuery UI or disable draggable to remove this warning.')
+		}
+
+		// image load
+		$(this).bind('load.panZoom', eventData, function (event) { event.data.target.panZoom('loadImage') })
+
+	}
+
+	function setupData() {
+		this.data('panZoom', {
+			target_element: this,
+			target_dimensions: { x: null, y: null },
+			viewport_element: this.parent(),
+			viewport_dimensions: { x: this.parent().width(), y: this.parent().height() },
+			position: { x1: null, y1: null, x2: null, y2: null },
+			last_image: null,
+			loaded: false,
+			mousewheel_delta: 0,
+			mousedown_interval: false
+		});
+		if (settings.debug) {
+			console.log(this.data('panZoom'));
+		}
+	}
+
+	function setupCSS() {
+		if (this.parent().css('position') == 'static') {
+			this.parent().css('position', 'relative');
+		}
+		this.css({
+			'position': 'absolute',
+			'top': 0,
+			'left': 0
+		});
+		if (settings.draggable) {
+			this.css({
+				'cursor': 'move'
+			});
+		}
+	}
+
+	function validatePosition() {
+		var data = this.data('panZoom');
+		// if dimensions are too small...
+		if ( data.position.x2 - data.position.x1 < settings.min_width/settings.factor || data.position.y2 - data.position.y1 < settings.min_height/settings.factor ) {
+			// and second co-ords are zero (IE: no dims set), fit image
+			if (data.position.x2 == 0 || data.position.y2 == 0) {
+				methods.fit.apply(this);
+			}
+			// otherwise, backout a bit
+			else {
+				if (data.position.x2 - data.position.x1 < settings.min_width/settings.factor) {
+					data.position.x2 = data.position.x1*1+settings.min_width/settings.factor;
+				}
+				if (data.position.y2 - data.position.y1 < settings.min_height/settings.factor) {
+	  			data.position.y2 = data.position.y1*1+settings.min_height/settings.factor;
+				}
+			}
+		}
+
+		if (settings.aspect) {
+			target = data.target_dimensions.ratio;
+			current = getCurrentAspectRatio.apply(this)
+			if (current > target) {
+				new_width = getHeight.apply(this) * target;
+				diff = getWidth.apply(this) - new_width;
+				data.position.x1 = data.position.x1*1 + (diff/2);
+				data.position.x2 = data.position.x2*1 - (diff/2);
+			} else if (current < target) {
+				new_height = getWidth.apply(this) / target;
+				diff = getHeight.apply(this) - new_height;
+				data.position.y1 = data.position.y1*1 + (diff/2);
+				data.position.y2 = data.position.y2*1 - (diff/2);
+			}
+		}
+
+
+	}
+
+  function applyPosition() {
+		var data = this.data('panZoom');
+
+    width = getWidth.apply(this);
+    height = getHeight.apply(this);
+    left_offset = getLeftOffset.apply(this);
+    top_offset = getTopOffset.apply(this);
+
+		properties = {
+			'top': Math.round(top_offset),
+			'left': Math.round(left_offset),
+			'width': Math.round(width),
+			'height': Math.round(height)
+		}
+
+		if (data.loaded && settings.animate) {
+			applyAnimate.apply(this, [ properties ]);
+		} else {
+			applyCSS.apply(this, [ properties ]);
+		}
+
+		if (settings.debug) {
+			console.log('--');
+			console.log('width:' + width);
+			console.log('height:' + height);
+			console.log('left:' + left_offset);
+			console.log('top:' + top_offset);
+		}
+	}
+
+	function applyCSS() {
+		this.css(	properties );
+	}
+
+	function applyAnimate() {
+		this.stop().animate(	properties , settings.animate_duration, settings.animate_easing);
+	}
+
+  function getWidth() {
+		var data = this.data('panZoom');
+    width = (data.position.x2 - data.position.x1);
+    return width;
+  }
+
+  function getLeftOffset() {
+		var data = this.data('panZoom');
+    return data.position.x1;
+  }
+
+  function getHeight() {
+		var data = this.data('panZoom');
+		height = (data.position.y2 - data.position.y1);
+    return height;
+  }
+
+  function getTopOffset() {
+		var data = this.data('panZoom');
+		top_offset = data.position.y1;
+    return top_offset;
+  }
+
+	function getCurrentAspectRatio() {
+		return (getWidth.apply(this) / getHeight.apply(this));
+	}
+
+	function writePosition() {
+		var data = this.data('panZoom');
+ 		if (settings.out_x1) { settings.out_x1.val(Math.round(data.position.x1 / settings.factor)) }
+ 		if (settings.out_y1) { settings.out_y1.val(Math.round(data.position.y1 / settings.factor)) }
+ 		if (settings.out_x2) { settings.out_x2.val(Math.round(data.position.x2 / settings.factor)) }
+ 		if (settings.out_y2) { settings.out_y2.val(Math.round(data.position.y2 / settings.factor)) }
+	}
+
+	function getStepDimensions() {
+		var data = this.data('panZoom');
+		ret = {
+			zoom: {
+				x: (settings.zoom_step/100 * data.viewport_dimensions.x),
+				y: (settings.zoom_step/100 * data.viewport_dimensions.y)
+			},
+			pan: {
+				x: (settings.pan_step/100 * data.viewport_dimensions.x),
+				y: (settings.pan_step/100 * data.viewport_dimensions.y)
+			}
+		}
+		return ret;
+	}
+
+	function loadTargetDimensions() {
+		var data = this.data('panZoom');
+		var img = document.createElement('img');
+    img.src = this.attr('src');
+    img.id = "jqpz-temp";
+    $('body').append(img);
+    data.target_dimensions.x = $('#jqpz-temp').width();
+		data.target_dimensions.y = $('#jqpz-temp').height();
+    $('#jqpz-temp').remove();
+    data.target_dimensions.ratio = data.target_dimensions.x / data.target_dimensions.y;
+	}
+
+})( jQuery );
\ No newline at end of file

Added: websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.splitter.js
==============================================================================
--- websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.splitter.js (added)
+++ websites/staging/chemistry/trunk/content/php/docs/atom/js/jquery.splitter.js Wed Jul  3 04:39:47 2013
@@ -0,0 +1,228 @@
+/*
+ * jQuery.splitter.js - two-pane splitter window plugin
+ *
+ * version 1.51 (2009/01/09)
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+ */
+
+/**
+ * The splitter() plugin implements a two-pane resizable splitter window.
+ * The selected elements in the jQuery object are converted to a splitter;
+ * each selected element should have two child elements, used for the panes
+ * of the splitter. The plugin adds a third child element for the splitbar.
+ *
+ * For more details see: http://methvin.com/splitter/
+ *
+ *
+ * @example $('#MySplitter').splitter();
+ * @desc Create a vertical splitter with default settings
+ *
+ * @example $('#MySplitter').splitter({type: 'h', accessKey: 'M'});
+ * @desc Create a horizontal splitter resizable via Alt+Shift+M
+ *
+ * @name splitter
+ * @type jQuery
+ * @param Object options Options for the splitter (not required)
+ * @cat Plugins/Splitter
+ * @return jQuery
+ * @author Dave Methvin (dave.methvin@gmail.com)
+ */
+;
+(function($) {
+
+    $.fn.splitter = function(args) {
+        args = args || {};
+        return this.each(function() {
+            var zombie;      // left-behind splitbar for outline resizes
+            function startSplitMouse(evt) {
+                if (opts.outline)
+                    zombie = zombie || bar.clone(false).insertAfter(A);
+                panes.css("-webkit-user-select", "none");   // Safari selects A/B text on a move
+                bar.addClass(opts.activeClass);
+                $('<div class="splitterMask"></div>').insertAfter(bar);
+                A._posSplit = A[0][opts.pxSplit] - evt[opts.eventPos];
+                $(document)
+                        .bind("mousemove", doSplitMouse)
+                        .bind("mouseup", endSplitMouse);
+            }
+
+            function doSplitMouse(evt) {
+                var newPos = A._posSplit + evt[opts.eventPos];
+                if (opts.outline) {
+                    newPos = Math.max(0, Math.min(newPos, splitter._DA - bar._DA));
+                    bar.css(opts.origin, newPos);
+                } else
+                    resplit(newPos);
+            }
+
+            function endSplitMouse(evt) {
+                $('div.splitterMask').remove();
+                bar.removeClass(opts.activeClass);
+                var newPos = A._posSplit + evt[opts.eventPos];
+                if (opts.outline) {
+                    zombie.remove();
+                    zombie = null;
+                    resplit(newPos);
+                }
+                panes.css("-webkit-user-select", "text");   // let Safari select text again
+                $(document)
+                        .unbind("mousemove", doSplitMouse)
+                        .unbind("mouseup", endSplitMouse);
+            }
+
+            function resplit(newPos) {
+                // Constrain new splitbar position to fit pane size limits
+                newPos = Math.max(A._min, splitter._DA - B._max,
+                        Math.min(newPos, A._max, splitter._DA - bar._DA - B._min));
+                // Resize/position the two panes
+                bar._DA = bar[0][opts.pxSplit];      // bar size may change during dock
+                bar.css(opts.origin, newPos).css(opts.fixed, splitter._DF);
+                A.css(opts.origin, 0).css(opts.split, newPos).css(opts.fixed, splitter._DF);
+                B.css(opts.origin, newPos + bar._DA)
+                        .css(opts.split, splitter._DA - bar._DA - newPos).css(opts.fixed, splitter._DF);
+                // IE fires resize for us; all others pay cash
+                if (!$.browser.msie)
+                    panes.trigger("resize");
+            }
+
+            function dimSum(jq, dims) {
+                // Opera returns -1 for missing min/max width, turn into 0
+                var sum = 0;
+                for (var i = 1; i < arguments.length; i++)
+                    sum += Math.max(parseInt(jq.css(arguments[i])) || 0, 0);
+                return sum;
+            }
+
+            // Determine settings based on incoming opts, element classes, and defaults
+            var vh = (args.splitHorizontal ? 'h' : args.splitVertical ? 'v' : args.type) || 'v';
+            var opts = $.extend({
+                activeClass: 'active',   // class name for active splitter
+                pxPerKey: 8,         // splitter px moved per keypress
+                tabIndex: 0,         // tab order indicator
+                accessKey: ''         // accessKey for splitbar
+            }, {
+                v: {               // Vertical splitters:
+                    keyLeft: 39, keyRight: 37, cursor: "e-resize",
+                    splitbarClass: "vsplitbar", outlineClass: "voutline",
+                    type: 'v', eventPos: "pageX", origin: "left",
+                    split: "width",  pxSplit: "offsetWidth",  side1: "Left", side2: "Right",
+                    fixed: "height", pxFixed: "offsetHeight", side3: "Top",  side4: "Bottom"
+                },
+                h: {               // Horizontal splitters:
+                    keyTop: 40, keyBottom: 38,  cursor: "n-resize",
+                    splitbarClass: "hsplitbar", outlineClass: "houtline",
+                    type: 'h', eventPos: "pageY", origin: "top",
+                    split: "height", pxSplit: "offsetHeight", side1: "Top",  side2: "Bottom",
+                    fixed: "width",  pxFixed: "offsetWidth",  side3: "Left", side4: "Right"
+                }
+            }[vh], args);
+
+            // Create jQuery object closures for splitter and both panes
+            var splitter = $(this).css({position: "relative"});
+            var panes = $(">*", splitter[0]).css({
+                position: "absolute",          // positioned inside splitter container
+                "z-index": "1",               // splitbar is positioned above
+                "-moz-outline-style": "none"   // don't show dotted outline
+            });
+            var A = $(panes[0]);      // left  or top
+            var B = $(panes[1]);      // right or bottom
+
+            // Focuser element, provides keyboard support; title is shown by Opera accessKeys
+            var focuser = $('<a href="javascript:void(0)"></a>')
+                    .attr({accessKey: opts.accessKey, tabIndex: opts.tabIndex, title: opts.splitbarClass})
+                    .bind($.browser.opera ? "click" : "focus", function() {
+                        this.focus();
+                        bar.addClass(opts.activeClass)
+                    })
+                    .bind("keydown", function(e) {
+                        var key = e.which || e.keyCode;
+                        var dir = key == opts["key" + opts.side1] ? 1 : key == opts["key" + opts.side2] ? -1 : 0;
+                        if (dir)
+                            resplit(A[0][opts.pxSplit] + dir * opts.pxPerKey, false);
+                    })
+                    .bind("blur", function() {
+                        bar.removeClass(opts.activeClass)
+                    });
+
+            // Splitbar element, can be already in the doc or we create one
+            var bar = $(panes[2] || '<div></div>')
+                    .insertAfter(A).css("z-index", "100").append(focuser)
+                    .attr({"class": opts.splitbarClass, unselectable: "on"})
+                    .css({position: "absolute",   "user-select": "none", "-webkit-user-select": "none",
+                        "-khtml-user-select": "none", "-moz-user-select": "none", "top": "0px"})
+                    .bind("mousedown", startSplitMouse);
+            // Use our cursor unless the style specifies a non-default cursor
+            if (/^(auto|default|)$/.test(bar.css("cursor")))
+                bar.css("cursor", opts.cursor);
+
+            // Cache several dimensions for speed, rather than re-querying constantly
+            bar._DA = bar[0][opts.pxSplit];
+            splitter._PBF = $.boxModel ? dimSum(splitter, "border" + opts.side3 + "Width", "border" + opts.side4 + "Width") : 0;
+            splitter._PBA = $.boxModel ? dimSum(splitter, "border" + opts.side1 + "Width", "border" + opts.side2 + "Width") : 0;
+            A._pane = opts.side1;
+            B._pane = opts.side2;
+            $.each([A,B], function() {
+                this._min = opts["min" + this._pane] || dimSum(this, "min-" + opts.split);
+                this._max = opts["max" + this._pane] || dimSum(this, "max-" + opts.split) || 9999;
+                this._init = opts["size" + this._pane] === true ?
+                        parseInt($.curCSS(this[0], opts.split)) : opts["size" + this._pane];
+            });
+
+            // Determine initial position, get from cookie if specified
+            var initPos = A._init;
+            if (!isNaN(B._init))   // recalc initial B size as an offset from the top or left side
+                initPos = splitter[0][opts.pxSplit] - splitter._PBA - B._init - bar._DA;
+            if (opts.cookie) {
+                if (!$.cookie)
+                    alert('jQuery.splitter(): jQuery cookie plugin required');
+                var ckpos = parseInt($.cookie(opts.cookie));
+                if (!isNaN(ckpos))
+                    initPos = ckpos;
+                $(window).bind("unload", function() {
+                    var state = String(bar.css(opts.origin));   // current location of splitbar
+                    $.cookie(opts.cookie, state, {expires: opts.cookieExpires || 365,
+                        path: opts.cookiePath || document.location.pathname});
+                });
+            }
+            if (isNaN(initPos))   // King Solomon's algorithm
+                initPos = Math.round((splitter[0][opts.pxSplit] - splitter._PBA - bar._DA) / 2);
+
+            // Resize event propagation and splitter sizing
+            if (opts.anchorToWindow) {
+                // Account for margin or border on the splitter container and enforce min height
+                splitter._hadjust = dimSum(splitter, "borderTopWidth", "borderBottomWidth", "marginBottom");
+                splitter._hmin = Math.max(dimSum(splitter, "minHeight"), 20);
+                $(window).bind("resize",
+                        function() {
+                            var top = splitter.offset().top;
+                            var wh = $(window).height();
+                            splitter.css("height", Math.max(wh - top - splitter._hadjust, splitter._hmin) + "px");
+                            if (!$.browser.msie) splitter.trigger("resize");
+                        }).trigger("resize");
+            }
+            else if (opts.resizeToWidth && !$.browser.msie)
+                $(window).bind("resize", function() {
+                    splitter.trigger("resize");
+                });
+
+            // Resize event handler; triggered immediately to set initial position
+            splitter.bind("resize",
+                    function(e, size) {
+                        // Custom events bubble in jQuery 1.3; don't Yo Dawg
+                        if (e.target != this) return;
+                        // Determine new width/height of splitter container
+                        splitter._DF = splitter[0][opts.pxFixed] - splitter._PBF;
+                        splitter._DA = splitter[0][opts.pxSplit] - splitter._PBA;
+                        // Bail if splitter isn't visible or content isn't there yet
+                        if (splitter._DF <= 0 || splitter._DA <= 0) return;
+                        // Re-divvy the adjustable dimension; maintain size of the preferred pane
+                        resplit(!isNaN(size) ? size : (!(opts.sizeRight || opts.sizeBottom) ? A[0][opts.pxSplit] :
+                                splitter._DA - B[0][opts.pxSplit] - bar._DA));
+                    }).trigger("resize", [initPos]);
+        });
+    };
+
+})(jQuery);
\ No newline at end of file



Mime
View raw message