Initial commit of intern.ccwn.org contentsHEADmaster

6 files changed, 388 insertions, 0 deletions

diff --git a/js/dojo/dojox/widget/Dialog.js b/js/dojo/dojox/widget/Dialog.js
new file mode 100644
index 0000000..0ca4bc5
--- /dev/null
+++ b/js/dojo/dojox/widget/Dialog.js
@@ -0,0 +1,253 @@
+//>>built
+require({cache:{
+'url:dojox/widget/Dialog/Dialog.html':"<div class=\"dojoxDialog\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"${id}_title\">\n\t<div dojoAttachPoint=\"titleBar\" class=\"dojoxDialogTitleBar\">\n\t\t<span dojoAttachPoint=\"titleNode\" class=\"dojoxDialogTitle\" id=\"${id}_title\">${title}</span>\n\t</div>\n\t<div dojoAttachPoint=\"dojoxDialogWrapper\">\n\t\t<div dojoAttachPoint=\"containerNode\" class=\"dojoxDialogPaneContent\"></div>\n\t</div>\n\t<div dojoAttachPoint=\"closeButtonNode\" class=\"dojoxDialogCloseIcon\" dojoAttachEvent=\"onclick: onCancel\">\n\t\t\t<span dojoAttachPoint=\"closeText\" class=\"closeText\">x</span>\n\t</div>\n</div>\n"}});
+define("dojox/widget/Dialog", [
+	"dojo", "dojox", "dojo/text!./Dialog/Dialog.html", 
+	"dijit/Dialog", "dojo/window", "dojox/fx", "./DialogSimple"
+], function(dojo, dojox, template){
+
+	dojo.getObject('widget', true, dojox);
+	
+	dojo.declare('dojox.widget.Dialog', dojox.widget.DialogSimple,
+		{
+		// summary:
+		//		A Lightbox-like Modal-dialog for HTML Content
+		//
+		// description:
+		//		An HTML-capable Dialog widget with advanced sizing
+		//		options, animated show/hide and other useful options.
+		//
+		//		This Dialog is also very easy to apply custom styles to.
+		//
+		//		It works identically to a `dijit.Dialog` with several
+		//		additional parameters.
+
+		templateString: template,
+
+		// sizeToViewport: Boolean
+		//		If true, fix the size of the dialog to the Viewport based on
+		//		viewportPadding value rather than the calculated or natural
+		//		stlye. If false, base the size on a passed dimension attribute.
+		//		Eitherway, the viewportPadding value is used if the the content
+		//		extends beyond the viewport size for whatever reason.
+		sizeToViewport: false,
+
+		// viewportPadding: Integer
+		//		If sizeToViewport="true", this is the amount of padding in pixels to leave
+		//		between the dialog border and the viewport edge.
+		//		This value is also used when sizeToViewport="false" and dimensions exceeded
+		//		by dialog content to ensure dialog does not go outside viewport boundary
+		viewportPadding: 35,
+
+		// dimensions: Array
+		//		A two-element array of [widht,height] to animate the Dialog to if sizeToViewport="false"
+		//		Defaults to [300,300]
+		dimensions: null,
+
+		// easing: Function?|String?
+		//		An easing function to apply to the sizing animation.
+		easing: null,
+
+		// sizeDuration: Integer
+		//		Time (in ms) to use in the Animation for sizing.
+		sizeDuration: dijit._defaultDuration,
+
+		// sizeMethod: String
+		//		To be passed to dojox.fx.sizeTo, one of "chain" or "combine" to effect
+		//		the animation sequence.
+		sizeMethod: "chain",
+
+		// showTitle: Boolean
+		//		Toogle to show or hide the Title area. Can only be set at startup.
+		showTitle: false,
+
+		// draggable: Boolean
+		//		Make the pane draggable. Differs from dijit.Dialog by setting default to false
+		draggable: false, // simply over-ride the default from dijit.Dialog
+
+		// modal: Boolean
+		//		If true, this Dialog instance will be truly modal and prevent closing until
+		//		explicitly told to by calling hide() - Defaults to false to preserve previous
+		//		behaviors.
+		modal: false,
+
+		constructor: function(props, node){
+			this.easing = props.easing || dojo._defaultEasing;
+			this.dimensions = props.dimensions || [300, 300];
+		},
+
+		_setup: function(){
+			// summary: Piggyback on dijit.Dialog's _setup for load-time options, deferred to
+
+			this.inherited(arguments);
+			if(!this._alreadyInitialized){
+				this._navIn = dojo.fadeIn({ node: this.closeButtonNode });
+				this._navOut = dojo.fadeOut({ node: this.closeButtonNode });
+				if(!this.showTitle){
+					dojo.addClass(this.domNode,"dojoxDialogNoTitle");
+				}
+			}
+		},
+
+		layout: function(e){
+			this._setSize();
+			this.inherited(arguments);
+		},
+
+		_setSize: function(){
+			// summary: cache and set our desired end position
+			this._vp = dojo.window.getBox();
+			var tc = this.containerNode,
+				vpSized = this.sizeToViewport
+			;
+			return this._displaysize = {
+				w: vpSized ? tc.scrollWidth : this.dimensions[0],
+				h: vpSized ? tc.scrollHeight : this.dimensions[1]
+			}; // Object
+		},
+
+		show: function(){
+			if(this.open){ return; }
+
+			this._setSize();
+			dojo.style(this.closeButtonNode,"opacity", 0);
+			dojo.style(this.domNode, {
+				overflow: "hidden",
+				opacity: 0,
+				width: "1px",
+				height: "1px"
+			});
+			dojo.style(this.containerNode, {
+				opacity: 0,
+				overflow: "hidden"
+			});
+
+			this.inherited(arguments);
+
+			if(this.modal){
+				// prevent escape key from closing dialog
+				// connect to body to trap this event from the Dialog a11y code, and stop escape key
+				// from doing anything in the modal:true case:
+				this._modalconnects.push(dojo.connect(dojo.body(), "onkeypress", function(e){
+					if(e.charOrCode == dojo.keys.ESCAPE){
+						dojo.stopEvent(e);
+					}
+				}));
+			}else{
+				// otherwise, allow clicking on the underlay to close
+				this._modalconnects.push(dojo.connect(dijit._underlay.domNode, "onclick", this, "onCancel"));
+			}
+			this._modalconnects.push(dojo.connect(this.domNode,"onmouseenter",this,"_handleNav"));
+			this._modalconnects.push(dojo.connect(this.domNode,"onmouseleave",this,"_handleNav"));
+
+		},
+
+		_handleNav: function(e){
+			// summary: Handle's showing or hiding the close icon
+
+			var navou = "_navOut",
+				navin = "_navIn",
+				animou = (e.type == "mouseout" ? navin : navou),
+				animin = (e.type == "mouseout" ? navou : navin)
+			;
+
+			this[animou].stop();
+			this[animin].play();
+
+		},
+
+		// an experiment in a quicksilver-like hide. too choppy for me.
+		/*
+		hide: function(){
+			// summary: Hide the dialog
+
+			// if we haven't been initialized yet then we aren't showing and we can just return
+			if(!this._alreadyInitialized){
+				return;
+			}
+
+			this._fadeIn && this._fadeIn.stop();
+
+			if (this._scrollConnected){
+				this._scrollConnected = false;
+			}
+			dojo.forEach(this._modalconnects, dojo.disconnect);
+			this._modalconnects = [];
+			if(this.refocus){
+				this.connect(this._fadeOut,"onEnd",dojo.hitch(dijit,"focus",this._savedFocus));
+			}
+			if(this._relativePosition){
+				delete this._relativePosition;
+			}
+
+			dojox.fx.sizeTo({
+				node: this.domNode,
+				duration:this.sizeDuration || this.duration,
+				width: this._vp.w - 1,
+				height: 5,
+				onBegin: dojo.hitch(this,function(){
+					this._fadeOut.play(this.sizeDuration / 2);
+				})
+			}).play();
+
+			this.open = false;
+		}, */
+
+		_position: function(){
+
+			if(!this._started){ return; } // prevent content: from firing this anim #8914
+
+			if(this._sizing){
+				this._sizing.stop();
+				this.disconnect(this._sizingConnect);
+				delete this._sizing;
+			}
+
+			this.inherited(arguments);
+
+			if(!this.open){ dojo.style(this.containerNode, "opacity", 0); }
+			var pad = this.viewportPadding * 2;
+
+			var props = {
+				node: this.domNode,
+				duration: this.sizeDuration || dijit._defaultDuration,
+				easing: this.easing,
+				method: this.sizeMethod
+			};
+
+			var ds = this._displaysize || this._setSize();
+			props['width'] = ds.w = (ds.w + pad >= this._vp.w || this.sizeToViewport)
+				? this._vp.w - pad : ds.w;
+
+			props['height'] = ds.h = (ds.h + pad >= this._vp.h || this.sizeToViewport)
+				? this._vp.h - pad : ds.h;
+
+			this._sizing = dojox.fx.sizeTo(props);
+			this._sizingConnect = this.connect(this._sizing,"onEnd","_showContent");
+			this._sizing.play();
+
+		},
+
+		_showContent: function(e){
+			// summary: Show the inner container after sizing animation
+
+			var container = this.containerNode;
+			dojo.style(this.domNode, {
+				overflow: "visible",
+				opacity: 1
+			});
+			dojo.style(this.closeButtonNode,"opacity",1);
+			dojo.style(container, {
+				height: this._displaysize.h - this.titleNode.offsetHeight + "px",
+				width: this._displaysize.w + "px",
+				overflow:"auto"
+			});
+			dojo.anim(container, { opacity:1 });
+		}
+
+	});
+
+	return dojox.widget.Dialog;
+
+});
+
diff --git a/js/dojo/dojox/widget/Dialog/Dialog.css b/js/dojo/dojox/widget/Dialog/Dialog.css
new file mode 100644
index 0000000..fd41fce
--- /dev/null
+++ b/js/dojo/dojox/widget/Dialog/Dialog.css
@@ -0,0 +1,112 @@
+
+.dojoxDialog {
+	position: absolute;
+	z-index: 999;
+	outline:0;
+}
+
+.dojoxDialog .closeText {
+	display:none;
+	/* for the onhover border in high contrast on IE: */
+	position:absolute;
+}
+
+.dojoxDialogFixed div.dojoxDialogTitleBar {
+	cursor:default; 
+}
+
+.dojoxDialogWrapper {
+	left: 0;
+	top: 0;
+}
+
+.dojoxDialog {
+	background: #fff;
+	-webkit-box-shadow: 0px 5px 10px #adadad;
+	-moz-border-radius:9pt;
+	-webkit-border-radius:8pt;
+	border:1px solid #b7b7b7;
+	padding:1.5em 3px 3px 3px;
+}
+
+.dojoxDialogFocused {
+	border:1px solid #ccc;
+}
+
+.dojoxDialog .dojoxDialogPaneContent {
+	border:none;
+	padding:0;
+}
+
+.dojoxDialogTitleBar {
+	/* outer container for the titlebar of the dialog */
+	cursor:move;
+	top:0;
+	left:0;
+	right:0;
+	background:#ededed;
+	height:1.5em;
+	outline:0; /* remove this line if keyboard focus on dialog startup is an issue. tab still takes you to first focusable element */
+	-moz-border-radius-topleft:8pt;
+	-moz-border-radius-topright:8pt;
+	-webkik-border-radius-topleft:7pt;
+	-webkit-border-radius-topright:7pt;
+}
+.dj_webkit .dojoxDialogTitleBar {
+	border:1px solid #ccc;
+}
+
+.dojoxDialogNoTitle .dojoxDialogTitleBar {
+	display:none;
+}
+
+.dojoxDialogContent {
+	/* the body of the dialog */
+	padding: 3px;
+	margin-top:1.2em;
+}
+
+/* pseudo-tundra-like */
+
+.dojoxDialogTitle {
+	font-weight: bold;
+	padding: 8px 12px 8px 12px;
+	outline:0;
+	border-bottom:#b7b7b7;
+}
+
+div.dojoxDialogNoTitle {
+	padding-top:9px;
+}
+
+.dojoxDialogCloseIcon, .dojoxDialogCloseIconHover {
+	background : url("images/dialogCloseButton.png") no-repeat top right;
+	position: absolute;
+	vertical-align: middle;
+	left: -19px;
+	top: -19px;
+	height: 29px;
+	width: 29px;
+	cursor: pointer;
+	z-index: 999;
+}
+.dj_ie6 .dojoxDialogCloseIcon {
+	background-image: url("images/dialogCloseButton.gif");
+}
+
+.dojoxDialog div.dijitDialogCloseIconHover,
+.dojoxDialog div.dijitDialogCloseIconActive {
+    background-position:0 0;
+}
+
+.dojoxDialog .dijitDialogCloseIconHover {
+    background-image: url("images/dialogCloseButton.png");
+}
+.dj_ie6 .dojoxDialog .dijitDialogCloseIconHover {
+    background-image: url("images/dialogCloseButton.gif");
+}
+
+.dojoxDialogNoTitle .dojoxDialogCloseIcon {
+	top: -15px;
+	left: -15px;
+}
diff --git a/js/dojo/dojox/widget/Dialog/Dialog.html b/js/dojo/dojox/widget/Dialog/Dialog.html
new file mode 100644
index 0000000..dad17de
--- /dev/null
+++ b/js/dojo/dojox/widget/Dialog/Dialog.html
@@ -0,0 +1,11 @@
+<div class="dojoxDialog" tabindex="-1" role="dialog" aria-labelledby="${id}_title">
+	<div dojoAttachPoint="titleBar" class="dojoxDialogTitleBar">
+		<span dojoAttachPoint="titleNode" class="dojoxDialogTitle" id="${id}_title">${title}</span>
+	</div>
+	<div dojoAttachPoint="dojoxDialogWrapper">
+		<div dojoAttachPoint="containerNode" class="dojoxDialogPaneContent"></div>
+	</div>
+	<div dojoAttachPoint="closeButtonNode" class="dojoxDialogCloseIcon" dojoAttachEvent="onclick: onCancel">
+			<span dojoAttachPoint="closeText" class="closeText">x</span>
+	</div>
+</div>
diff --git a/js/dojo/dojox/widget/Dialog/images/dialogCloseButton.gif b/js/dojo/dojox/widget/Dialog/images/dialogCloseButton.gif
new file mode 100644
index 0000000..1f45a5c
--- /dev/null
+++ b/js/dojo/dojox/widget/Dialog/images/dialogCloseButton.gif
diff --git a/js/dojo/dojox/widget/Dialog/images/dialogCloseButton.png b/js/dojo/dojox/widget/Dialog/images/dialogCloseButton.png
new file mode 100644
index 0000000..9d2f423
--- /dev/null
+++ b/js/dojo/dojox/widget/Dialog/images/dialogCloseButton.png
diff --git a/js/dojo/dojox/widget/DialogSimple.js b/js/dojo/dojox/widget/DialogSimple.js
new file mode 100644
index 0000000..a5d6c79
--- /dev/null
+++ b/js/dojo/dojox/widget/DialogSimple.js
@@ -0,0 +1,12 @@
+//>>built
+define("dojox/widget/DialogSimple", ["dojo", "dijit", "dojox", "dijit/Dialog", "dojox/layout/ContentPane"], function(dojo, dijit, dojox){
+
+	dojo.getObject("widget", true, dojox);
+	return dojo.declare("dojox.widget.DialogSimple", [dojox.layout.ContentPane, dijit._DialogBase], {
+		// summary: A Simple Dialog Mixing the `dojox.layout.ContentPane` functionality over
+		//		top of a vanilla `dijit.Dialog`. See `dojox.widget.Dialog` for a more flexible
+		//		dialog option allowing animations and different styles/theme support.
+	});
+	
+});
+