set svn:eol-style to native

10 files changed, 308 insertions, 308 deletions

diff --git a/demos/functional/templates/ui.autocomplete.html b/demos/functional/templates/ui.autocomplete.html
index 4811693f9..646dd3784 100644
--- a/demos/functional/templates/ui.autocomplete.html
+++ b/demos/functional/templates/ui.autocomplete.html
@@ -1,32 +1,32 @@
-<script type="text/javascript">

-

-	var autocomplete_data = '["aero", "airplane", "book","movie","music","sports","skating","swim"]';

-

-	var model = {

-		

-		renderAt: '#containerDemo',

-

-		title: 'Autocomplete Demos',

-		

-		demos: [

-

-			{

-				title: 'Simple autocomplete',

-				desc: 'With few lines of code you could build a autocomplete. You can try more options on the fly! ',

-				html: '<input id="autocomplete" type="text" /> (Try type <em>a</em>, <em>m</em> or <em>s</em>)',

-				destroy: '$("#autocomplete").autocomplete("destroy");',

-				options: [

-					{ desc: 'Attach a autocomplete', source: '$("#autocomplete").autocomplete({data:'+autocomplete_data+'});' }

-				]

-			}

-

-		]

-	};

-

-	$(function(){

-

-		uiRenderDemo(model);

-

-	});

-

+<script type="text/javascript">
+
+	var autocomplete_data = '["aero", "airplane", "book","movie","music","sports","skating","swim"]';
+
+	var model = {
+		
+		renderAt: '#containerDemo',
+
+		title: 'Autocomplete Demos',
+		
+		demos: [
+
+			{
+				title: 'Simple autocomplete',
+				desc: 'With few lines of code you could build a autocomplete. You can try more options on the fly! ',
+				html: '<input id="autocomplete" type="text" /> (Try type <em>a</em>, <em>m</em> or <em>s</em>)',
+				destroy: '$("#autocomplete").autocomplete("destroy");',
+				options: [
+					{ desc: 'Attach a autocomplete', source: '$("#autocomplete").autocomplete({data:'+autocomplete_data+'});' }
+				]
+			}
+
+		]
+	};
+
+	$(function(){
+
+		uiRenderDemo(model);
+
+	});
+
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.colorpicker.html b/demos/functional/templates/ui.colorpicker.html
index 81f5f66b2..844b6266f 100644
--- a/demos/functional/templates/ui.colorpicker.html
+++ b/demos/functional/templates/ui.colorpicker.html
@@ -1,41 +1,41 @@
-<script type="text/javascript">

-

-	var model = {

-		

-		renderAt: '#containerDemo',

-

-		title: 'Colorpicker Demos',

-		

-		demos: [

-

-			{

-				title: 'Inline colorpicker',

-				desc: 'With few lines of code you could build a colorpicker. You can try more options on the fly!',

-				html: '<div id="colorpicker" />',

-				destroy: '$("#colorpicker").colorpicker("destroy");',

-				options: [

-					{ desc: 'Make a colorpicker', source: '$("#colorpicker").colorpicker({flat:true});' }

-				]

-			},

-

-			{

-				title: 'Triggered colorpicker',

-				desc: 'With few lines of code you could build a colorpicker. You can try more options on the fly!',

-				html: '<input id="colorpicker2" /><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>',

-				destroy: '$("#colorpicker2").colorpicker("destroy");',

-				options: [

-					{ desc: 'Make a colorpicker', source: '$("#colorpicker2").colorpicker( {submit: function(e,ui) {		$("#colorpicker2").val(ui.hex);} });' },

-					{ desc: 'Fade in/out a colorpicker', source: '$("#colorpicker2").colorpicker( {show: function (e,ui) { $(this).data("colorpicker").picker.fadeIn(500);return false; }, hide: function (e,ui) { $(this).data("colorpicker").picker.fadeOut(500);return false; }, change: function(e,ui) { $("#colorpicker2").val(ui.hex); } });' }

-				]

-			}

-

-		]

-	};

-

-	$(function(){

-

-		uiRenderDemo(model);

-

-	});

-

+<script type="text/javascript">
+
+	var model = {
+		
+		renderAt: '#containerDemo',
+
+		title: 'Colorpicker Demos',
+		
+		demos: [
+
+			{
+				title: 'Inline colorpicker',
+				desc: 'With few lines of code you could build a colorpicker. You can try more options on the fly!',
+				html: '<div id="colorpicker" />',
+				destroy: '$("#colorpicker").colorpicker("destroy");',
+				options: [
+					{ desc: 'Make a colorpicker', source: '$("#colorpicker").colorpicker({flat:true});' }
+				]
+			},
+
+			{
+				title: 'Triggered colorpicker',
+				desc: 'With few lines of code you could build a colorpicker. You can try more options on the fly!',
+				html: '<input id="colorpicker2" /><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>',
+				destroy: '$("#colorpicker2").colorpicker("destroy");',
+				options: [
+					{ desc: 'Make a colorpicker', source: '$("#colorpicker2").colorpicker( {submit: function(e,ui) {		$("#colorpicker2").val(ui.hex);} });' },
+					{ desc: 'Fade in/out a colorpicker', source: '$("#colorpicker2").colorpicker( {show: function (e,ui) { $(this).data("colorpicker").picker.fadeIn(500);return false; }, hide: function (e,ui) { $(this).data("colorpicker").picker.fadeOut(500);return false; }, change: function(e,ui) { $("#colorpicker2").val(ui.hex); } });' }
+				]
+			}
+
+		]
+	};
+
+	$(function(){
+
+		uiRenderDemo(model);
+
+	});
+
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.dbd.html b/demos/functional/templates/ui.datepicker.dbd.html
index 6b2573461..e686b3d25 100644
--- a/demos/functional/templates/ui.datepicker.dbd.html
+++ b/demos/functional/templates/ui.datepicker.dbd.html
@@ -1,40 +1,40 @@
-<input type="text" size="10" value="" id="dayByDay"/>

-<style type="text/css">

-.ar_day { color: white !important; background: #eee url(templates/images/ar.gif) no-repeat center !important; }

-.au_day { color: blue !important; background: #eee url(templates/images/au.gif) no-repeat center !important; }

-.br_day { color: green !important; background: #eee url(templates/images/br.gif) no-repeat center !important; }

-.cn_day { color: red !important; background: #eee url(templates/images/cn.gif) no-repeat center !important; }

-.id_day { color: white !important; background: #eee url(templates/images/id.gif) no-repeat center !important; }

-.ie_day { color: white !important; background: #eee url(templates/images/ie.gif) no-repeat center !important; }

-.ke_day { color: red !important; background: #eee url(templates/images/ke.gif) no-repeat center !important; }

-.lb_day { color: white !important; background: #eee url(templates/images/lb.gif) no-repeat center !important; }

-.nz_day { color: blue !important; background: #eee url(templates/images/nz.gif) no-repeat center !important; }

-.se_day { color: blue !important; background: #eee url(templates/images/se.gif) no-repeat center !important; }

-.us_day { color: white !important; background: #eee url(templates/images/us.gif) no-repeat center !important; }

-.za_day { color: green !important; background: #eee url(templates/images/za.gif) no-repeat center !important; }

-</style>

-<script type="text/javascript">

-var natDays = [[1, 26, "au"], [2, 6, "nz"], [3, 17, "ie"], [4, 27, "za"], [5, 25, "ar"], [6, 6, "se"], 

-    [7, 4, "us"], [8, 17, "id"], [9, 7, "br"], [10, 1, "cn"], [11, 22, "lb"], [12, 12, "ke"]]; 

- 

-function nationalDays(date) { 

-    for (i = 0; i < natDays.length; i++) { 

-        if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 

-            return [false, natDays[i][2] + "_day"]; 

-        } 

-    } 

-    return [true, ""]; 

-}

-

-function highlightToday(date, inst) { 

-    var today = new Date(); 

-    today = new Date(today.getFullYear(), today.getMonth(), today.getDate()); 

-    return $.datepicker.dateStatus(date, inst) + 

-        (today.getTime() == date.getTime() ? " (today)" : ""); 

-} 

-

-function showDayOfYear(date) {

-	var lastYearEnd = new Date(date.getFullYear() - 1, 12 - 1, 31, 0, 0, 0, 0);

-	return [true, "", "Day " + ((date.getTime() - lastYearEnd.getTime()) / 86400000) + " of  the year"];

-}

+<input type="text" size="10" value="" id="dayByDay"/>
+<style type="text/css">
+.ar_day { color: white !important; background: #eee url(templates/images/ar.gif) no-repeat center !important; }
+.au_day { color: blue !important; background: #eee url(templates/images/au.gif) no-repeat center !important; }
+.br_day { color: green !important; background: #eee url(templates/images/br.gif) no-repeat center !important; }
+.cn_day { color: red !important; background: #eee url(templates/images/cn.gif) no-repeat center !important; }
+.id_day { color: white !important; background: #eee url(templates/images/id.gif) no-repeat center !important; }
+.ie_day { color: white !important; background: #eee url(templates/images/ie.gif) no-repeat center !important; }
+.ke_day { color: red !important; background: #eee url(templates/images/ke.gif) no-repeat center !important; }
+.lb_day { color: white !important; background: #eee url(templates/images/lb.gif) no-repeat center !important; }
+.nz_day { color: blue !important; background: #eee url(templates/images/nz.gif) no-repeat center !important; }
+.se_day { color: blue !important; background: #eee url(templates/images/se.gif) no-repeat center !important; }
+.us_day { color: white !important; background: #eee url(templates/images/us.gif) no-repeat center !important; }
+.za_day { color: green !important; background: #eee url(templates/images/za.gif) no-repeat center !important; }
+</style>
+<script type="text/javascript">
+var natDays = [[1, 26, "au"], [2, 6, "nz"], [3, 17, "ie"], [4, 27, "za"], [5, 25, "ar"], [6, 6, "se"], 
+    [7, 4, "us"], [8, 17, "id"], [9, 7, "br"], [10, 1, "cn"], [11, 22, "lb"], [12, 12, "ke"]]; 
+ 
+function nationalDays(date) { 
+    for (i = 0; i < natDays.length; i++) { 
+        if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 
+            return [false, natDays[i][2] + "_day"]; 
+        } 
+    } 
+    return [true, ""]; 
+}
+
+function highlightToday(date, inst) { 
+    var today = new Date(); 
+    today = new Date(today.getFullYear(), today.getMonth(), today.getDate()); 
+    return $.datepicker.dateStatus(date, inst) + 
+        (today.getTime() == date.getTime() ? " (today)" : ""); 
+} 
+
+function showDayOfYear(date) {
+	var lastYearEnd = new Date(date.getFullYear() - 1, 12 - 1, 31, 0, 0, 0, 0);
+	return [true, "", "Day " + ((date.getTime() - lastYearEnd.getTime()) / 86400000) + " of  the year"];
+}
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.dlg.html b/demos/functional/templates/ui.datepicker.dlg.html
index 4d5eaaa7f..fe82c181b 100644
--- a/demos/functional/templates/ui.datepicker.dlg.html
+++ b/demos/functional/templates/ui.datepicker.dlg.html
@@ -1,6 +1,6 @@
-<input type="text" size="10" value="" id="dialog" readonly="readonly"/> <button id="dialogButton" type="button">Open dialog</button>

-<script type="text/javascript">

-function setDateFromDialog(date) { 

-    $("#dialog").val(date); 

-}

+<input type="text" size="10" value="" id="dialog" readonly="readonly"/> <button id="dialogButton" type="button">Open dialog</button>
+<script type="text/javascript">
+function setDateFromDialog(date) { 
+    $("#dialog").val(date); 
+}
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.inl.html b/demos/functional/templates/ui.datepicker.inl.html
index 9543a98eb..925ef0718 100644
--- a/demos/functional/templates/ui.datepicker.inl.html
+++ b/demos/functional/templates/ui.datepicker.inl.html
@@ -1,14 +1,14 @@
-<input type="text" id="altInline" size="10"/>

-<div id="inline"></div>

-<p style="clear: both;"><!-- See day-by-day example for highlighting days code --></p>

-<script type="text/javascript">

-function setInlineDate() {

-	try {

-		var date = $.datepicker.parseDate("mm/dd/yy", $("#altInline").val());

-		$("#inline").datepicker("setDate", date);

-	}

-	catch (e) {

-		// Ignore

-	}

-}

+<input type="text" id="altInline" size="10"/>
+<div id="inline"></div>
+<p style="clear: both;"><!-- See day-by-day example for highlighting days code --></p>
+<script type="text/javascript">
+function setInlineDate() {
+	try {
+		var date = $.datepicker.parseDate("mm/dd/yy", $("#altInline").val());
+		$("#inline").datepicker("setDate", date);
+	}
+	catch (e) {
+		// Ignore
+	}
+}
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.sel.html b/demos/functional/templates/ui.datepicker.sel.html
index 3f8185af2..a05b48438 100644
--- a/demos/functional/templates/ui.datepicker.sel.html
+++ b/demos/functional/templates/ui.datepicker.sel.html
@@ -1,54 +1,54 @@
-<select id="selectMonth"><option value="01">Jan</option><option value="02">Feb</option>

-	<option value="03">Mar</option><option value="04">Apr</option>

-	<option value="05">May</option><option value="06">Jun</option>

-	<option value="07">Jul</option><option value="08">Aug</option>

-	<option value="09">Sep</option><option value="10">Oct</option>

-	<option value="11">Nov</option><option value="12">Dec</option></select>

-<select id="selectDay"><option value="01">1</option><option value="02">2</option>

-	<option value="03">3</option><option value="04">4</option>

-	<option value="05">5</option><option value="06">6</option>

-	<option value="07">7</option><option value="08">8</option>

-	<option value="09">9</option><option value="10">10</option>

-	<option value="11">11</option><option value="12">12</option>

-	<option value="13">13</option><option value="14">14</option>

-	<option value="15">15</option><option value="16">16</option>

-	<option value="17">17</option><option value="18">18</option>

-	<option value="19">19</option><option value="20">20</option>

-	<option value="21">21</option><option value="22">22</option>

-	<option value="23">23</option><option value="24">24</option>

-	<option value="25">25</option><option value="26">26</option>

-	<option value="27">27</option><option value="28">28</option>

-	<option value="29">29</option><option value="30">30</option>

-	<option value="31">31</option></select>

-<select id="selectYear"><option value="2001">2001</option><option value="2002">2002</option>

-	<option value="2003">2003</option><option value="2004">2004</option>

-	<option value="2005">2005</option><option value="2006">2006</option>

-	<option value="2007">2007</option><option value="2008">2008</option>

-	<option value="2009">2009</option><option value="2010">2010</option></select>

-<input type="hidden" size="10" id="linkedDates" disabled="disabled"/></p>

-<script type="text/javascript">

-// Prepare to show a date picker linked to three select controls

-function readLinked() {

-	$("#linkedDates").val($("#selectMonth").val() + "/" +

-		$("#selectDay").val() + "/" + $("#selectYear").val());

-	return {};

-}

-

-// Update three select controls to match a date picker selection

-function updateLinked(date) {

-	$("#selectMonth").val(date.substring(0, 2));

-	$("#selectDay").val(date.substring(3, 5));

-	$("#selectYear").val(date.substring(6, 10));

-}

-

-// Prevent selection of invalid dates through the select controls

-function checkLinkedDays() {

-	var daysInMonth = 32 - new Date($("#selectYear").val(),

-		$("#selectMonth").val() - 1, 32).getDate();

-	$("#selectDay option").attr("disabled", "");

-	$("#selectDay option:gt(" + (daysInMonth - 1) +")").attr("disabled", "disabled");

-	if ($("#selectDay").val() > daysInMonth) {

-		$("#selectDay").val(daysInMonth);

-	}

-}

-</script>

+<select id="selectMonth"><option value="01">Jan</option><option value="02">Feb</option>
+	<option value="03">Mar</option><option value="04">Apr</option>
+	<option value="05">May</option><option value="06">Jun</option>
+	<option value="07">Jul</option><option value="08">Aug</option>
+	<option value="09">Sep</option><option value="10">Oct</option>
+	<option value="11">Nov</option><option value="12">Dec</option></select>
+<select id="selectDay"><option value="01">1</option><option value="02">2</option>
+	<option value="03">3</option><option value="04">4</option>
+	<option value="05">5</option><option value="06">6</option>
+	<option value="07">7</option><option value="08">8</option>
+	<option value="09">9</option><option value="10">10</option>
+	<option value="11">11</option><option value="12">12</option>
+	<option value="13">13</option><option value="14">14</option>
+	<option value="15">15</option><option value="16">16</option>
+	<option value="17">17</option><option value="18">18</option>
+	<option value="19">19</option><option value="20">20</option>
+	<option value="21">21</option><option value="22">22</option>
+	<option value="23">23</option><option value="24">24</option>
+	<option value="25">25</option><option value="26">26</option>
+	<option value="27">27</option><option value="28">28</option>
+	<option value="29">29</option><option value="30">30</option>
+	<option value="31">31</option></select>
+<select id="selectYear"><option value="2001">2001</option><option value="2002">2002</option>
+	<option value="2003">2003</option><option value="2004">2004</option>
+	<option value="2005">2005</option><option value="2006">2006</option>
+	<option value="2007">2007</option><option value="2008">2008</option>
+	<option value="2009">2009</option><option value="2010">2010</option></select>
+<input type="hidden" size="10" id="linkedDates" disabled="disabled"/></p>
+<script type="text/javascript">
+// Prepare to show a date picker linked to three select controls
+function readLinked() {
+	$("#linkedDates").val($("#selectMonth").val() + "/" +
+		$("#selectDay").val() + "/" + $("#selectYear").val());
+	return {};
+}
+
+// Update three select controls to match a date picker selection
+function updateLinked(date) {
+	$("#selectMonth").val(date.substring(0, 2));
+	$("#selectDay").val(date.substring(3, 5));
+	$("#selectYear").val(date.substring(6, 10));
+}
+
+// Prevent selection of invalid dates through the select controls
+function checkLinkedDays() {
+	var daysInMonth = 32 - new Date($("#selectYear").val(),
+		$("#selectMonth").val() - 1, 32).getDate();
+	$("#selectDay option").attr("disabled", "");
+	$("#selectDay option:gt(" + (daysInMonth - 1) +")").attr("disabled", "disabled");
+	if ($("#selectDay").val() > daysInMonth) {
+		$("#selectDay").val(daysInMonth);
+	}
+}
+</script>
diff --git a/demos/functional/templates/ui.datepicker.two.html b/demos/functional/templates/ui.datepicker.two.html
index 639aa0518..62e927859 100644
--- a/demos/functional/templates/ui.datepicker.two.html
+++ b/demos/functional/templates/ui.datepicker.two.html
@@ -1,7 +1,7 @@
-<input type="text" size="10" value="" id="startDate"/> to <input type="text" size="10" value="" id="endDate"/>

-<script type="text/javascript">

-function customRange(input) {

-	return {minDate: (input.id == "endDate" ? $("#startDate").datepicker("getDate") : null),

-		maxDate: (input.id == "startDate" ? $("#endDate").datepicker("getDate") : null)};

-}

+<input type="text" size="10" value="" id="startDate"/> to <input type="text" size="10" value="" id="endDate"/>
+<script type="text/javascript">
+function customRange(input) {
+	return {minDate: (input.id == "endDate" ? $("#startDate").datepicker("getDate") : null),
+		maxDate: (input.id == "startDate" ? $("#endDate").datepicker("getDate") : null)};
+}
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.magnifier.html b/demos/functional/templates/ui.magnifier.html
index fd701ae3b..fddef3d6b 100644
--- a/demos/functional/templates/ui.magnifier.html
+++ b/demos/functional/templates/ui.magnifier.html
@@ -1,52 +1,52 @@
-<script type="text/javascript">

-

-	var model = {

-		

-		renderAt: '#containerDemo',

-

-		title: 'Magnifier Demos',

-		

-		demos: [

-

-			{

-				title: 'Simple Magnifier',

-				desc: 'With few lines of code you could build a magnifier. You can try more options on the fly!',

-				html: '<div id="magnifier"><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /></div>',

-				destroy: '$("#magnifier").magnifier("destroy");',

-				options: [

-					{ desc: 'Attach a magnifier', source: '$("#magnifier").magnifier();' },

-					{ desc: 'Small magnification', source: '$("#magnifier").magnifier({magnification:1.5});' },

-					{ desc: 'Disable the magnifier', source: '$("#magnifier").magnifier("disable");' }

-				]

-			},

-

-			{

-				title: 'Opacity Magnifier',

-				desc: 'With few lines of code you could build a magnifier. You can try more options on the fly!',

-				html: '<div id="magnifier2"><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /></div>',

-				destroy: '$("#magnifier2").magnifier("destroy");',

-				options: [

-					{ desc: 'Opacity option', source: '$("#magnifier2").magnifier({opacity:{min:0.4,max:1.0}});' }

-				]

-			},

-

-			{

-				title: 'Overlap Magnifier',

-				desc: 'With few lines of code you could build a magnifier. You can try more options on the fly!',

-				html: '<div style="height:16px;">&nbsp;</div><div id="magnifier3"><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /></div><div style="height:84px;">&nbsp;</div>',

-				destroy: '$("#magnifier3").magnifier("destroy");',

-				options: [

-					{ desc: 'Overlap option', source: '$("#magnifier3").magnifier({overlap:true});' }

-				]

-			}

-

-		]

-	};

-

-	$(function(){

-

-		uiRenderDemo(model);

-

-	});

-

+<script type="text/javascript">
+
+	var model = {
+		
+		renderAt: '#containerDemo',
+
+		title: 'Magnifier Demos',
+		
+		demos: [
+
+			{
+				title: 'Simple Magnifier',
+				desc: 'With few lines of code you could build a magnifier. You can try more options on the fly!',
+				html: '<div id="magnifier"><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /></div>',
+				destroy: '$("#magnifier").magnifier("destroy");',
+				options: [
+					{ desc: 'Attach a magnifier', source: '$("#magnifier").magnifier();' },
+					{ desc: 'Small magnification', source: '$("#magnifier").magnifier({magnification:1.5});' },
+					{ desc: 'Disable the magnifier', source: '$("#magnifier").magnifier("disable");' }
+				]
+			},
+
+			{
+				title: 'Opacity Magnifier',
+				desc: 'With few lines of code you could build a magnifier. You can try more options on the fly!',
+				html: '<div id="magnifier2"><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /></div>',
+				destroy: '$("#magnifier2").magnifier("destroy");',
+				options: [
+					{ desc: 'Opacity option', source: '$("#magnifier2").magnifier({opacity:{min:0.4,max:1.0}});' }
+				]
+			},
+
+			{
+				title: 'Overlap Magnifier',
+				desc: 'With few lines of code you could build a magnifier. You can try more options on the fly!',
+				html: '<div style="height:16px;">&nbsp;</div><div id="magnifier3"><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /><img src="images/clock.png" width="64" height="64" alt="demo image" /></div><div style="height:84px;">&nbsp;</div>',
+				destroy: '$("#magnifier3").magnifier("destroy");',
+				options: [
+					{ desc: 'Overlap option', source: '$("#magnifier3").magnifier({overlap:true});' }
+				]
+			}
+
+		]
+	};
+
+	$(function(){
+
+		uiRenderDemo(model);
+
+	});
+
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.progressbar.html b/demos/functional/templates/ui.progressbar.html
index cb99c33a9..6c33203e6 100644
--- a/demos/functional/templates/ui.progressbar.html
+++ b/demos/functional/templates/ui.progressbar.html
@@ -1,35 +1,35 @@
-<script type="text/javascript">

-

-	var model = {

-		

-		renderAt: '#containerDemo',

-

-		title: 'Progressbar Demos',

-		

-		demos: [

-

-			{

-				title: 'Simple Progressbar',

-				desc: 'With few lines of code you could build a progressbar. You can try more options on the fly!',

-				html: '<div id="progressbar"></div>',

-				destroy: '$("#progressbar").progressbar("destroy");',

-				options: [

-					{ desc: 'Start a progressbar', source: '$("#progressbar").progressbar({interval:2000}); $("#progressbar").progressbar("start");' },

-					{ desc: 'With different increment', source: '$("#progressbar").progressbar({interval:2000, increment:100}).progressbar("start");' },

-					{ desc: 'Set progress to 50%', source: '$("#progressbar").progressbar().progressbar("progress", 50);' },

-					{ desc: 'Callback when finish', source: '$("#progressbar").progressbar({interval: 1000, stop:function(){alert("Finished");}}).progressbar("start");' },

-					{ desc: 'Enable the progressbar', source: '$("#progressbar").progressbar().progressbar("enable");' },

-					{ desc: 'Disable the progressbar', source: '$("#progressbar").progressbar().progressbar("disable");' }

-				]

-			}

-

-		]

-	};

-

-	$(function(){

-

-		uiRenderDemo(model);

-

-	});

-

+<script type="text/javascript">
+
+	var model = {
+		
+		renderAt: '#containerDemo',
+
+		title: 'Progressbar Demos',
+		
+		demos: [
+
+			{
+				title: 'Simple Progressbar',
+				desc: 'With few lines of code you could build a progressbar. You can try more options on the fly!',
+				html: '<div id="progressbar"></div>',
+				destroy: '$("#progressbar").progressbar("destroy");',
+				options: [
+					{ desc: 'Start a progressbar', source: '$("#progressbar").progressbar({interval:2000}); $("#progressbar").progressbar("start");' },
+					{ desc: 'With different increment', source: '$("#progressbar").progressbar({interval:2000, increment:100}).progressbar("start");' },
+					{ desc: 'Set progress to 50%', source: '$("#progressbar").progressbar().progressbar("progress", 50);' },
+					{ desc: 'Callback when finish', source: '$("#progressbar").progressbar({interval: 1000, stop:function(){alert("Finished");}}).progressbar("start");' },
+					{ desc: 'Enable the progressbar', source: '$("#progressbar").progressbar().progressbar("enable");' },
+					{ desc: 'Disable the progressbar', source: '$("#progressbar").progressbar().progressbar("disable");' }
+				]
+			}
+
+		]
+	};
+
+	$(function(){
+
+		uiRenderDemo(model);
+
+	});
+
 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.spinner.html b/demos/functional/templates/ui.spinner.html
index acfc1bb80..3db5f288b 100644
--- a/demos/functional/templates/ui.spinner.html
+++ b/demos/functional/templates/ui.spinner.html
@@ -1,36 +1,36 @@
-<script type="text/javascript">

-

-	var model = {

-		

-		renderAt: '#containerDemo',

-

-		title: 'Spinner Demos',

-		

-		demos: [

-

-			{

-				title: 'Simple spinner',

-				desc: 'With few lines of code you could build a spinner. You can try more options on the fly!',

-				html: '<input id="spinner" type="text" />',

-				destroy: '$("#spinner").spinner("destroy");',

-				options: [

-					{ desc: 'Make a spinner', source: '$("#spinner").spinner();' },

-					{ desc: 'A spinner with min and max value', source: '$("#spinner").spinner({min:-100, max:150});' },

-					{ desc: 'Big stepping', source: '$("#spinner").spinner({stepping:100});' },

-					{ desc: 'Currency option', source: '$("#spinner").spinner({currency:"$"});' },

-					{ desc: 'Disable incremental option', source: '$("#spinner").spinner({incremental:false});' },

-					{ desc: 'Disable the spinner', source: '$("#spinner").spinner().spinner("disable");' },

-					{ desc: 'Enable the spinner', source: '$("#spinner").spinner().spinner("enable");' }

-				]

-			}

-

-		]

-	};

-

-	$(function(){

-

-		uiRenderDemo(model);

-

-	});

-

+<script type="text/javascript">
+
+	var model = {
+		
+		renderAt: '#containerDemo',
+
+		title: 'Spinner Demos',
+		
+		demos: [
+
+			{
+				title: 'Simple spinner',
+				desc: 'With few lines of code you could build a spinner. You can try more options on the fly!',
+				html: '<input id="spinner" type="text" />',
+				destroy: '$("#spinner").spinner("destroy");',
+				options: [
+					{ desc: 'Make a spinner', source: '$("#spinner").spinner();' },
+					{ desc: 'A spinner with min and max value', source: '$("#spinner").spinner({min:-100, max:150});' },
+					{ desc: 'Big stepping', source: '$("#spinner").spinner({stepping:100});' },
+					{ desc: 'Currency option', source: '$("#spinner").spinner({currency:"$"});' },
+					{ desc: 'Disable incremental option', source: '$("#spinner").spinner({incremental:false});' },
+					{ desc: 'Disable the spinner', source: '$("#spinner").spinner().spinner("disable");' },
+					{ desc: 'Enable the spinner', source: '$("#spinner").spinner().spinner("enable");' }
+				]
+			}
+
+		]
+	};
+
+	$(function(){
+
+		uiRenderDemo(model);
+
+	});
+
 </script>
\ No newline at end of file