میلاد ، بدون روتوش

دیروز داشتم با docs.google.com کار می کردم که طبق عادت Ctrl+s زدم و خیلی قشنگ صفحه ذخیره شد و پنجره ی Save as مرورگر ظاهر نشد. به نظرم خوب اومد که برای CRM جدید شرکت از short cut های کیبورد استفاده کنم.
دوجو دستوری به نام dojo.keys داره که وظیفش دادن کد کلیدهای کیبورد و میتونید با کلید فشرده شده مقایسه کنید.

خروجی onkeypress event ،آبجکتیست که چند متغیر ( ctrlKey, altKey, shiftKey, metaKey ) همیشه داره و با مقادیر true یا false  مشخص میکنه اون کلید ها همزمان فشار داده شده یا نه.

	dojo.ready(function () {
		var handleEnterKey = function (e) {
			console.log(e);
			if (e.ctrlKey == true && e.charOrCode == 'f') {
				alert('Ctrl+f');
				dojo.stopEvent(e);
			}else if (e.ctrlKey == true && e.charOrCode == 's') {
				alert('Ctrl+s');
				dojo.stopEvent(e);
			}else if (e.charOrCode == dojo.keys.ENTER) {
				alert('ENTER');
				dojo.stopEvent(e);
			}

		}
		dojo.connect(dojo.doc, "onkeypress", handleEnterKey);
	});

در جی کوئری تابعی به نام one داریم که باعث اجرا شدن کد فقط برای یکبار می شود.این تابع متاسفانه در دوجو موجود نیست ولی براحتی با چند خط ساده پیاده سازی می شود.

var handle = dojo.connect(dojo.byId("Button1"),"onclick",function(e){
    alert("Button1 : This will be displayed only once.");
    dojo.disconnect(handle);
});

Try It:

dojo.disconnect <->  jquery.unbind

dojo.connect <->  jquery.bind

jquery.one

در برنامه هایی که با تکنولوژی ای جکس نوشته میشن استفاده از Json به خاطر حجم کم  و … (دلایل دیگه ای که من نمیدونم) امری بدیهی شده. بعضی از مواقع باید آبجکت به رشته و یا رشته به آبجکت تبدیل گردد. دو تابع مفید در دوجو:

dojo.toJson : ورودی این تابع ، آبجکت است و رشته ای Json را به عنوان خروجی ارسال می کند.

 // a simple object
 var obj = { a:"one", b:3, c:true };

 // convert it to a string:
 var data = dojo.toJson(obj);
 console.log(data, typeof data);
 >>> {"a":"one","b":3,"c":true} string

dojo.fromJson: وروردی تابع ،رشته است و آبجکتی را به عنوان خروجی ارسال می کند.

var json = '{"a":"one","b":3,"c":true}';
var obj = dojo.fromJson(json);
console.log(obj.a, obj.b, obj.c);
>>> one 3 true

dojo.objectToQuery: همونطور که در مثال می بینید این تایع آبجکتی را به عنوان ورودی گرفته و آن را تبدیل به کوئری کرده و به خروجی می دهد.

(کوئری رشته ای  است که در موقع ارسال فرم با تکنیک GET در مرورگر دیده میشود)

  var uri = "http://some.server.org/somecontext/";
  var query = {
    foo: ["bar", "baz"],
    bit: "byte"
  };

  //Assemble the new uri with its query string attached.
  var queryStr = dojo.objectToQuery(query);
  uri = uri + "?" + queryStr;

  //The uri should look like:
  // http://some.server.org/somecontext/?foo=bar&foo=bar2&bit=byte

و تابع dojo.queryToObject که دقیقا برعکس بالا عمل میکند:

var uri = "http://some.server.org/somecontext/?foo=bar&foo=bar2&bit=byte";
var query = uri.substring(uri.indexOf("?") + 1, uri.length);
var queryObject = dojo.queryToObject(query);

//The structure of queryObject will be:
// {
//   foo: ["bar", "bar2],
//   bit: "byte"
// }

و توابع دیگری مانند formToJson و formToQuery [که قبلا توضیح دادم]

و اگر به بحث Object references در Json علاقه دارید باید از اکستنشن dojox.json.ref استفاده کنید.

میتونم بگم دوجو مفیدترین چیزی که من تو طراحی وب یاد گرفتم.این اصلا مهم نیست ، مهم اینه بعد از چند ماه انتظار ورژن ۱٫۴ این ابزار منتشر شد.

Dojo 1.4 is hot off the presses, with more than seven months of significant improvements to performance, stability, and features.

Of particular interest:

IO Pipeline topics

dojo.cache

dojo.contentHandlers

dojo.hash with native HTML5 onhashchange event support where available

Traversal and manipulation for NodeLists (the return value for dojo.query)

dojo.ready (easier to type than dojo.addOnLoad)

Hundreds of refinements to the Dijit API and collection of Dijits, and a few new widgets in DojoX

DataChart widget and other improvements to charting

dojox.drawing lands!

Editor improvements and new plug-ins in both Dijit and DojoX

Grid is faster, and the EnhancedGrid lands!

ForestStoreModel for the TreeGrid

GFX improvements

dojox.jq, a very experimental module aimed at trying to match the jQuery API as close as possible, but using Dojo underneath

Dojo build system optionally supports the Google Closure Tools compiler

Significant speed improvements, especially in IE

Read the full Dojo 1.4 release notes for more details! And thanks to everyone in the Dojo community that helped make this release great!

چند روز پیش دیوید والش تو مطلبی با عنوان Remove Broken Images Using MooTools or jQuery نحوه حذف عکس های لود نشده با جی کوئری و موتولز نوشته که منم راغب شدم با دوجو اون تکه کد بازنویسی کنم.

البته طبق معمول IE از این event پشتیبانی نمیکنه.

try it:

dojo.addOnLoad(function(){
   dojo.query("img").connect("onerror", function(evt){
       dojo.destroy(evt.target);
   });
});

api.dojotoolkit - docs.dojocampus

dojo.hitch(foo, "bar")();
//runs foo.bar() in the scope of foo
dojo.hitch(foo, myFunction);
//returns a function that runs myFunction in the scope of foo

somFunction(somObject.someMethod)

var theAccumulator= {
	total: 0,
	clear: function() {
		this.total= 0;
	},
	add: function(x) {
		this.total+= x;
	},
	getResult: function() {
		return this.total;
	}
};

theAccumulator.clear();
theAccumulator.add(100);
theAccumulator.add(200);
printResult(theAccumulator.getResult);

printResult(function(){return theAccumulator.getResult();});

printResult(dojo.hitch(theAccumulator, "getResult" ));

یکی از راههای ارسال مقادیر فرم ، استفاده از متد GET . و اگه برای ارسال مقادیر با متد GET در صفحاتی که به صورت ای جکس نوشته شده باشه مصر باشیم باید تمام node های یک فرم را اسکن کرده و با تابع encodeURI انکد کنیم.

تابع formToQuery دوجو دقیقا همین کارو انجام میده یعنی ID یک فرمو میگیره و مقداریو بر میگردونه که دقیقا GET میشه.نقطه قوتش اینه که از ورودی های hidden و آرایه ها و … کاملا پشتیبانی میکنه.

try it:

در جاوا اسکریپت برای ساختن الگویی از کاراکترها از RegExp استفاده میکنیم که از یونیکد نیز پشتیبانی می کند،دیروز منبعی پیدا کردم که رنجی از کدهای حروف زبانهای مختلف لیست کرده بود.

کد حروف عربی (فارسی):۰۶۰۰-۰۶FF.

Regular Expression: Match Unicode Block Range

Try It:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script>
function findPersianChar(obj){
	var patt1=new RegExp("[\u0600-\u06FF]");
	if(patt1.test(obj.value)==true){
		alert('i found');
	}else{
		alert('i cant found');
	}
}
</script>
</head>
<body>
	<textarea id="text" name="text"></textarea>
	<br/>
	<button onclick="findPersianChar(getElementById('text'));" >click me</button>
</body>
</html>

ابزارهای زیادی برای توسعه وب وجود دارد که شاید هیچ وقت اسم اونارو نشنویم ، آزمایشگاه موزیلا فهرستی از این ابزارها جمع آوری و دسته بندی کرده که دیدنش برای طرح های وب مفیده.برای دیدن این صفحه باید از مرورگرهای مدرن که از canvas پشتیبانی میکنن استفاده کنید(Firefox 3.5, Safari 4, Chrome 2, or Opera 9).