diff options
Diffstat (limited to '')
| -rw-r--r-- | js/dojo-1.6/dojox/image/MagnifierLite.xd.js | 146 |
1 files changed, 146 insertions, 0 deletions
diff --git a/js/dojo-1.6/dojox/image/MagnifierLite.xd.js b/js/dojo-1.6/dojox/image/MagnifierLite.xd.js new file mode 100644 index 0000000..ba4a414 --- /dev/null +++ b/js/dojo-1.6/dojox/image/MagnifierLite.xd.js @@ -0,0 +1,146 @@ +/*
+ Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved.
+ Available via Academic Free License >= 2.1 OR the modified BSD license.
+ see: http://dojotoolkit.org/license for details
+*/
+
+
+dojo._xdResourceLoaded(function(dojo, dijit, dojox){
+return {depends: [["provide", "dojox.image.MagnifierLite"],
+["require", "dijit._Widget"]],
+defineResource: function(dojo, dijit, dojox){if(!dojo._hasResource["dojox.image.MagnifierLite"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
+dojo._hasResource["dojox.image.MagnifierLite"] = true;
+dojo.provide("dojox.image.MagnifierLite");
+dojo.experimental("dojox.image.MagnifierLite");
+
+dojo.require("dijit._Widget");
+
+dojo.declare("dojox.image.MagnifierLite", dijit._Widget,
+ {
+ // summary: Adds magnification on a portion of an image element
+ //
+ // description: An unobtrusive way to add an unstyled overlay
+ // above the srcNode image element. The overlay/glass is a
+ // scaled version of the src image (so larger images sized down
+ // are clearer).
+ //
+ // The logic behind requiring the src image to be large is
+ // "it's going to be downloaded, anyway" so this method avoids
+ // having to make thumbnails and 2 http requests among other things.
+ //
+ // glassSize: Int
+ // the width and height of the bounding box
+ glassSize: 125,
+
+ // scale: Decimal
+ // the multiplier of the Mangification.
+ scale: 6,
+
+ postCreate: function(){
+ this.inherited(arguments);
+
+ // images are hard to make into workable templates, so just add outer overlay
+ // and skip using dijit._Templated
+ this._adjustScale();
+ this._createGlass();
+
+ this.connect(this.domNode,"onmouseenter","_showGlass");
+ this.connect(this.glassNode,"onmousemove","_placeGlass");
+ this.connect(this.img,"onmouseout","_hideGlass");
+
+ // when position of domNode changes, _adjustScale needs to run.
+ // window.resize isn't it always, FIXME:
+ this.connect(window,"onresize","_adjustScale");
+
+ },
+
+ _createGlass: function(){
+ // summary: make img and glassNode elements as children of the body
+
+ var node = this.glassNode = dojo.create('div', {
+ style:{
+ height: this.glassSize + "px",
+ width: this.glassSize + "px"
+ },
+ className:"glassNode"
+ }, dojo.body());
+
+ this.surfaceNode = node.appendChild(dojo.create('div'));
+
+ this.img = dojo.place(dojo.clone(this.domNode), node);
+ // float the image around inside the .glassNode
+ dojo.style(this.img, {
+ position: "relative",
+ top: 0, left: 0,
+ width: this._zoomSize.w + "px",
+ height: this._zoomSize.h + "px"
+ });
+
+ },
+
+ _adjustScale: function(){
+ // summary: update the calculations should this.scale change
+
+ this.offset = dojo.coords(this.domNode, true);
+ this._imageSize = { w: this.offset.w, h:this.offset.h };
+ this._zoomSize = {
+ w: this._imageSize.w * this.scale,
+ h: this._imageSize.h * this.scale
+ };
+ },
+
+ _showGlass: function(e){
+ // summary: show the overlay
+ this._placeGlass(e);
+ dojo.style(this.glassNode, {
+ visibility: "visible",
+ display:""
+ });
+
+ },
+
+ _hideGlass: function(e){
+ // summary: hide the overlay
+ dojo.style(this.glassNode, {
+ visibility: "hidden",
+ display:"none"
+ });
+ },
+
+ _placeGlass: function(e){
+ // summary: position the overlay centered under the cursor
+
+ this._setImage(e);
+ var sub = Math.floor(this.glassSize / 2);
+ dojo.style(this.glassNode,{
+ top: Math.floor(e.pageY - sub) + "px",
+ left:Math.floor(e.pageX - sub) + "px"
+ });
+
+ },
+
+ _setImage: function(e){
+ // summary: set the image's offset in the clipping window relative to the mouse position
+
+ var xOff = (e.pageX - this.offset.l) / this.offset.w,
+ yOff = (e.pageY - this.offset.t) / this.offset.h,
+ x = (this._zoomSize.w * xOff * -1) + (this.glassSize * xOff),
+ y = (this._zoomSize.h * yOff * -1) + (this.glassSize * yOff);
+
+ dojo.style(this.img, {
+ top: y + "px",
+ left: x + "px"
+ });
+
+ },
+
+ destroy: function(finalize){
+ dojo.destroy(this.glassNode);
+ this.inherited(arguments);
+ }
+
+});
+
+}
+
+}};});
|