Tween

استاندارد فعلی برای الحاق فیلم‌های فلش به اسناد HTML، استفاده از جاوااسکریپته. کتابخانه‌های قدرتمندی مثل SWFObject هم برای این منظور توسعه داده شده‌اند. چرا باید با این شیوه فایل فلش رو اضافه کنیم؟ چون علاوه بر این‌که اسناد رو تمیز نگه‌می‌داره امکان ارائه محتوا (مثلا متن یا تصویر جایگزین) هم به کاربر می‌ده (این از نظر accessibility خیلی اهمیت داره چون کاربرانی که از نرم‌افزارهای صفحه‌خوان استفاده می‌کنند قادر به مشاهده فیلم فلش نیستند) تا در صورتی که بازدیدکننده به هر دلیلی به فلش پلیر دسترسی نداشت نمایش داده بشه و یا حتی امکان نصب فلش پلیر رو بهش بده.
این‌ها خیلی خوبه ولی من زیاد با این روش موافق نیستم. چون در صورتی که کاربر فلش پلیر رو داشته باشه (و ۹۹ درصد رایانه‌های جهان فلش پلیر رو نصب شده دارند) ولی جاوااسکریپت غیرفعال باشه باز چیزی نمی‌بینه. (آمار مربوطه رو در این‌جا ببینید.) دوم نیاز به بارگذاری کتابخونه هست. یه درخواست (httprequest) اضافی برای براگذاری کتابخانه لازمه و swfobject، حدود ۱۰ کیلوبایت حجم داره. بعلاوه، زمان پردازش صفحه رو هم بالا می‌بره. این از اون نظر مهمه که مثلا اسکریپت اصلاح فایل‌های PNG در مرورگر IE6 فقط ۵۰۰ میلی ثانیه به زمان پردازش صفحه اضافه می‌کنه ولی تست یاهو نشون داد همین ۵۰۰ میلی ثانیه تعداد بازدیدها از سایت یاهو رو دو درصد کم‌تر کرد. [آمار این تکه آخری رو از حذف گفتم. ممکنه اشتباه باشه.]

اینا رو گفتم که به این برسم که مدتی قبل در بخش Snippetهای سایت CSS-Tricks به این قطعه کد فوق مفید برخوردم که کاملاً valid هست در همه‌های مرورگرها هم به خوبی کار می‌کنه. داشته باشیدش یه جایی دم دست که خیلی به کار می‌خوره.

<object type="application/x-shockwave-flash"
data="your-flash-file.swf"
width="0" height="0">
<param name="movie" value="your-flash-file.swf" />
<param name="quality" value="high"/>
</object>

آیا راه بهتری برای چپاندن فیلم فلش در صفحه وجود داره؟

من عاشق گوگل کروم‌ام! حتی یادم نمی‌آید قبل از کروم اصلاً چگونه وب‌گردی می‌کرده‌ام! حالا تصورش را بکنید، به کافی‌نت می‌روید و تنها مرورگر در دسترس IE و یا حداکثر فایرفاکس است (مشکل فایرفاکس این است که زیاد کرش می‌کند و مقداری هم کند است). تنها راه چاره این است که همیشه مرورگرم را همراه خودم داشته باشم. بهتر آن‌که، تنظیمات آن هم مطابق میل خودم باشد و Bookmarkهایم را هم با خود داشته باشد. این‌جاست که باید به نرم‌افزارهای Portable متوسل شد.

ساخت کروم قابل حمل

ابتدا کروم را از این‌جا دریافت کنید: http://build.chromium.org/buildbot/snapshots/chromium-rel-xp/
فایل را از حالت فشرده خارج کرده و از فایل chrome.exe یک کپی بگیرید تا از آن یک میانبر بسازید.
روی میانبر کلیک راست کرده و گزینه Properties را انتخاب کنید. در کادر مقابل Target عبارت زیر را وارد کنید:
–user-data-dir=Profile
میانبر خود را اجرا کنید. TADA!
همین!

یکی از دوستان در مسابقات SOOK در بخش رم‌های DDR2 مقام اول و در بخش تست ۳DMark01 مقام سوم رو به‌دست آورد. اگرچه هنوز شیرینی‌شو نداده ولی بهش تبریک می‌گم!

دوست عزیزم مسلم هم هفته آینده مسابقات المپیاد طراحی وب داره. خواهش می‌کنم براش دعا کنید. امیدوارم مسابقه رو ضربه فنی کنی مسلم خان!

توابع پوسته

توابع پوسته به اون توابعی گفته می‌شه که به تهیه‌کننده پوسته امکان استفاده از اون‌ها رو با فراخوانی‌شون می‌ده. مثلاً the_title یه تابع هست که عنوان نوشته رو برمی‌گردونه؛ افزونه نظرسنجی وردپرس توابعی رو برای نمایش نظرسنجی در مکان دلخواه در پوسته فراهم کرده. برای معرفی توابع کافیه اون‌ها رو در فایل افزونه‌تون تعریف کنید و بعد اون توابع در دسترس پوسته‌ها هستند.
یه مثال کاربردی: می‌دونید که برای افزودن فرم جستجو به پوسته، یه فایل با محتویات زیر با نام مثلاً searchform.php ساخته می‌شه و بعد در سایر فایل‌های پوسته، include می‌شه.

فایل searchform.php

[php]
<form method="get" id="searchform" action="<?php echo $_SERVER['PHP_SELF'];

?>">
<div>
<input type="text" value="<?php echo wp_specialchars($s, 1); ?>" name="s" id="s"

/>
<input type="submit" id="searchsubmit" value="جستجو" />
</div>
</form>
[/php]

نحوه چپاندن فرم جستجو در فایل‌های پوسته:

[php]
<?php include (TEMPLATEPATH . "/searchform.php"); ?>
[/php]

حالا، بیاید یه تابع بسازیم تا بتونیم فرم جستجو رو با فراخوانی search یا search_form نمایش بدیم. فایل افزونه رو باز کنید و کدهای زیر رو توش قرار بدید:

[php]
<?php

function search_form() { ?>
<form method="get" id="searchform" action="<?php echo $_SERVER['PHP_SELF'];

?>">
<div>
<input type="text" value="<?php echo wp_specialchars($s, 1); ?>" name="s" id="s"

/>
<input type="submit" id="searchsubmit" value="جستجو" />
</div>
</form>
<?php } ?>

[/php]

این تابع فرم جستجو رو اکو می‌کنه. حالا در پوسته برای نمایش فرم جستجو کافیه تابع search_form رو فراخوانی کنید:

[php]
<?php search_form(); ?>
[/php]

این از این. حالا، وردپرس امکان گذاشتن کد برای اجرا لابه‌لای نوشته‌ها رو نمی‌ده (هرچند افزونه برای این موجوده). راه حل ارائه شده استفاده از shortcodeهاست. این‌ها ساختاری شبیه این دارند:

[shortcode param1="value" param2="value"]

مثلاً برای گذاشتن یه فرم نظرسنجی در نوشته از shortcodeها استفاده می‌شه. نیز shortcodeهای فراهم شده توسط خود وردپرس: (فوق‌العاده مفید)

[audio]: converts a link to an mp3 fle into an audio player
[digg]: embeds a voting button for your link on Digg
[fickr]: embeds a Flickr video
[googlemaps]: embeds Google Maps
[googlevideo]: embeds a Google Video
[livevideo]: embeds a video from LiveVideo
[odeo]: embeds an Odeo audio fle
[podtech]: embeds audio or video from the PodTech Network
[polldaddy]: embeds a PollDaddy poll(use without the space)
[redlasso]: embeds a video from Redlasso
[rockyou]: embeds a slideshow from RockYou
[slideshare]: embeds a slideshow from Slideshare.net
[sourcecode][/sourcecode]: preserves the formatting of source code
[splashcast]: embeds Splashcast media
[vimeo]: embeds a Vimeo video
[youtube]: embeds a YouTube video
(منبع: کتاب Wordpress 2.7 Cookbook)

نحوه ساخت این shortcodeها بدین صورت هست که باید یه تابع بسازید و به وردپرس بگید می‌خواید این تابع با چه shortcodeی اجرا بشه. برای این‌کار از تابع add_shortcode استفاده می‌کنیم. این تابع دو پارامتر می‌گیره، پارامتر اول نام shortcode و پارامتر دوم نام تابع هست:

[php]
add_shortcode(’search’, ’search_form’);
[/php]

الان تابع search_form ما با [search] فراخوانی می‌شه.
برای گرفتن پارامتر از shortcodeها ابتدا باید تو بخش تعریف آرگومان‌های تابع (بین پرانتزها) یه متغیر رو برای دسترسی به پارامترهای ارسالی مشخص کرد. یعنی:

[php]
function search($atts) {
[/php]

حالا باید دریافت‌شون کنیم:

[php]
extract(shortcode_atts(array(
‘dir’ => ”,
), $atts));
[/php]

اینو بذارید خط اول تابع. پارامترها رو تو اون آرایه تعریف می‌کنیم. مثلاً این‌جا یه پارامتر dir داریم که مقدار پیش‌فرضش رو هم خالی تعیین کردیم. بعد از اجرای این کد، به تک‌تک پارامترها به عنوان یه متغیر دسترسی داریم:

[php]
echo $dir."Hello!";
[/php]

dead easy!

در قسمت بعد راجع به تعریف ابزارک بحث می‌کنیم.

خیلی دوست دارم دفترچه خاطراتی برای خودم داشته باشم ولی از این متنفرم که کسی بیاد و اون رو بخونه. بنابراین تصمیم گرفتم نوشته‌هام رو با خطی بنویسم که فقط خودم بتونم بخونمش. فعلاً در حال بررسی خط نوشتاری الف‌هام (درباره خط و زبان مردمان سرزمین میانه) و شاید خط دورفی (که برخلاف خط الف‌ها زیبایی کم‌تری داره). بعدها راجع به این‌ها بیشتر می‌نویسم. ولی هفته قبل مطلبی دیدم راجع به کد مورس. البته استفاده از اون الان چندان رایج نیست و متاسفانه بر خلاف تصور من، برای نوشتن (اونم در حد دفترچه خاطرات) اصلاً مناسب نیست.

به هر حال، دست به کار شدم و دو تابع جاوااسکریپت نوشتم برای تبدیل نوشته به حروف مورس و برعکس:

[js]
function toMorse(text) {

var text = text.toLowerCase(text),
len = text.length,
morse = [];

for (var i=1; i<=len; i++) {

switch (text.charAt(i-1)) {
case ‘a’ :
morse[i] = ‘.-’;
break;
case ‘b’ :
morse[i] = ‘-…’;
break;
case ‘c’ :
morse[i] = ‘-.-.’;
break;
….
}

}

return morse.join(’ ‘);

}

function deMorse(morse) {

var letters = morse.split(’ ‘),
text = ”;

for (var i=1; i<letters.length; i++) {

switch (letters[i].toString()) {

case ‘.-’:
text += ‘a’;
break;
case ‘-…’:
text += ‘b’;
break;
case ‘-.-.’:
text += ‘c’;
break;
….
}

}

return text;

}

[/js]

در تابع toMorse ما رشته رو دریافت می‌کنیم و به ازای هر کاراکتر با دستور switch کد مورس اون حرف رو برمی‌گردونیم. در deMorse هم ما رشته‌ی کد مورس رو می‌گیریم و با متد split رشته رو به آرایه‌ای تبدیل می‌کنیم که هر عضوش برابر با یک کاراکتره. باز هم دستور switch برای هر عضو آرایه و بازگردوندن کاراکتر متناظر اون.

مشاهده دمو

مدخل کد مورس در ویکی‌پدیا فارسی

دارم به لیست نرم‌افزارها و تکنولوژی‌هایی نگاه می‌کنم که دارم سعی می‌کنم یاد بگیرمشون:
Adobe ColdFusion
Adobe Flex
Adobe AIR
همه‌ش ادوبی شد؟ آخه من عاشق ادوبی‌ام!
HTML5 & CSS3
Microformat: درباره این بعداً بیشتر می‌نویسم.
ARIA: یا همون Accessible Rich Internet Application، ایضا این نیز توضیحات بیشتر بعدا.
جوملا و دروپال: با جوملا قبلا سایت راه‌اندازی کردم منتهی در کار با جوملا حرفه‌ای نیستم. درباره دروپال هم که کلاً تعطیلم. گفته شده که دروپال Content Management System نیست و Content Management Framework هست. باید حتماً سلام‌علیکی خدمتش داشته باشم.
دات نت مایکروسافت: عقیده‌ی غالب اینه که هم درآمد دات‌نتی بیشتره و هم بازار کارش (در ایران منظورمه). ولی فکر می‌کنم بی‌خیال این بشم چون وقت و انرژی زیادی می‌خواد تا مهارت کافی در برنامه‌نویسی دات‌نت به دست بیارم.

قبل از ورود به طراحی وب، مشغول کاوش «شبکه»های رایانه‌ای، مباحث امنیت و مدیریت سیستم‌ها بودم. فکر می‌کردم شبکه مبحث‌ایه که هرچی در موردش مطالعه می‌کنی باز هم کمه. باید اقرار کنم وب هم مثل همون و شاید بدتره. “روزانه” در حال تغییره.

ضرب‌المثلی داریم که به زبون بومی می‌گه: «چَش اَتِرسِه، دس کار اَکُد» یعنی فرد با دیدن حجم کاری که باید انجام بده می‌ترسه ولی بعد که انجامش می‌ده می‌بینه چیز سختی هم نبوده. تا ببینیم چه شود.

تا این‌جا ما یک افزونه ساختیم که عملاً هیچ کاری انجام نمی‌ده. باید به وردپرس بگیم که کدهای ما رو در چه زمانی اجرا کنه. این‌کارو به دو صورت می‌شه انجام داد: قلاب‌های افزونه (Plugin Hooks) و توابع پوسته (Template Tags).

قلاب‌های افزونه
وردپرس موقعی که می‌خواد کاری انجام بده ابتدا بررسی می‌کنه که آیا تابعی خودشو به این تابعی که الان می‌خواد اجرا بشه متصل کرده یا نه. در این صورت اون تابع رو اجرا می‌کنه. یک مثال. حتماً تا به حال موقع ساخت پوسته متوجه فراخوانی توابع wp_head و wp_footer در لابه‌لای تگ‌های HTML قالب شدید. دلیل فراخوانی این توابع اینه که اگر افزونه‌ای نیاز داشت اطلاعاتی در هدر یا فوتر بنویسه (مثلاً چسبوندن شیوه‌نامه خودش و یا نمایش اطلاعات) خودش رو بچسبونه به این توابع تا در زمانی که وردپرس مشغول رندر صفحه برای نمایش به کاربر هست اون توابع رو اجرا کنه.
تقریبا برای هر عملیاتی که وردپرس که انجام می‌ده قلاب‌های مناسب وجود داره. مثلاً وقتی که یه کاربر در سایت ثبت نام می‌کنه، وقتی یک مطلب جدید نوشته یا حذف می‌شه، وقتی دیدگاهی ارسال می‌شه، و… این قلاب‌ها این انعطاف‌پذیری رو به نویسنده‌ی افزونه می‌دن تا بتونه کدهای خودش رو در زمان مناسب اجرا کنه و تغییرات دلخواه رو در هسته وردپرس بدون دستکاری مستقیم فایل‌ها انجام بده.
لیستی از قلاب‌ها رو در این‌جا ببینید: http://codex.wordpress.org/Plugin_API

حالا، ما دو نوع قلاب داریم: Action و Filter. با استفاده از فیلترها وردپرس از توابع ما انتظار داره بعد از اجرای کدهاشون مقداری رو برگردونند (دستور return) ولی در اکشن‌ها نیازی به برگرداندن مقدار نیست. مثلا، می‌دونید که تابع the_content که درون حلقه وردپرس استفاده می‌شه محتوای نوشته‌ها رو برمی‌گردونه. ما می‌تونیم یه تابع بنویسیم و متصلش کنیم به این تابع the_content، کدهای مورد نظر رو روی محتوا اجرا کنیم (مثلاً ویرایش، تبدیل کاراکترها، اضافه کردن متنی به نوشته و…) و بعد باید خود محتوا رو دوباره به وردپرس برگردونیم.

تئوری کافیه! فایل افزونه‌ای که در آموزش قبلی ایجاد کردید رو باز کنید و کدهای زیر رو توش کپی کنید:

[php]
&lt;?php

add_filter(’the_content’, ‘bigbang’);

function bigbang($content) {

}
?&gt;
[/php]

اتصال تابع مورد نظر به یکی از توابع وردپرس با دستور add_filter انجام می‌شه. پارامتر اول تابعی هست که می‌خوایم بهش متصل شیم و پارامتر دوم تابع ما هست که عملیات پردازش رو انجام می‌ده. خیلی ساده، یه تابع با نام بیگ‌بنگ! معرفی کردیم تا زمان اجرای تابع the_content (که مسئول فرستادن محتوای نوشته به مرورگر هست) اجرا بشه.
الان با مرورگر خود به مسیر وردپرس‌تون برید. چی می‌بینید؟ بوم! محتوای پست‌ها نمایش داده نمی‌شه! این به این دلیل هست که همان‌طور که گفتیم فیلترها از توابع ما انتظار دارند مقداری رو برگردونیم. در واقع، با معرفی متغیر $content به عنوان پارامتر تابع سفارشی ما، می‌تونیم به محتوای ارسال شده از طرف وردپرس به تابع‌مون دسترسی داشته باشیم، روش عملیات انجام بدیم و در نهایت مقدار پردازش شده رو برگردونیم. با برنگردوندن مقدار وردپرس هیچی رو نمایش نمی‌ده.
وسط براکت‌های تابع دستور return $content; رو اضافه کنید. دوباره سایت رو ببینید: محتوا بدون تغییر نمایش داده می‌شه.
ایده رو گرفتید؟ کافیه متغیر $content رو ویرایش کنید و دوباره برش گردونید.
علاوه بر تابع add_filter، تابع add_action رو هم داریم که می‌تونیم به یه اکشن متصل بشیم. مثلا، گفتیم که تابع wp_head رو در بخش head فایل header.php فراخوانی می‌کنیم. می‌تونیم با add_action به اون تابع متصل بشیم و اطلاعات مورد نیازمون رو در بخش هدر سند تولید شده توسط وردپرس بنویسیم:

[php]
function dolly_css() {
echo &quot;
&lt;style type=’text/css’&gt;
#dolly {
position: absolute;
top: 4.5em;
margin: 0;
padding: 0;
}
&lt;/style&gt;&quot;;

}

add_action(’wp_head’, ‘dolly_css’);
[/php]

از اکشن استفاده کردیم، چون در این‌جا ما مقداری رو برگشت ندادیم (return) بلکه خیلی ساده با دستور echo اطلاعات رو به خروجی فرستادیم.

این‌ها رو داشته باشید تا در قسمت بعدی چندین افزونه مفید بنویسیم!

مدتی قبل ایده‌ای داشتم برای ساخت برنامه‌ای برای نگه‌داری snippetها (قطعه کدهای قابل استفاده مجدد) و تصمیم گرفتم از AIR برای برنامه‌نویسیش استفاده کنم. ایر امکان استفاده از پایگاه داده‌ای SQLite رو می‌ده، یه دیتابیس کم‌حجم که قابل انتقال به همراه برنامه نیز هست. حالا، مرجع مورد استفاده من AIRforJSDevPocketGuide بود (در سایت ادوبی پیدا می‌شه) که احتمالاً قدیمیه چون کدهای مربوط به اتصال به دیتابیس حتی وقتی از روی مرجع عینا کپی می‌کردم نیز فایده‌ای نداشت و اتصالی برقرار نمی‌شد. تا این‌که مقاله jQuery and AIR – Moving from web page to application در سایت insideRIA رو دیدم. در این مقاله سعی شده یه بازی مبتنی بر جاوااسکریپت و با کمک AIR ساخته بشه. روش اتصال به دیتابیس طبق توضیحات این مقاله مقداری متفاوت هست:
دیتابیس رو در ابتدای شروع برنامه کپی می‌کنیم به App Storage folder (که هر نرم‌افزار مبتنی بر AIR یه دونه برای نیازهاش داره) و بعد از کپی کردن به اون‌جا به پایگاه داده وصل می‌شیم:

[js]
//I handle copying the db from local to storage dir
var installTo = air.File.applicationStorageDirectory
var installToFile = installTo.resolvePath("words.db")
if(!installToFile.exists) {
air.trace("Copying db file to "+installToFile.nativePath)
var installFromLoc = air.File.applicationDirectory
var installFromFile = installFromLoc.resolvePath("database/words.db")
air.trace("from "+installFromFile.nativePath)
try {
installFromFile.copyTo(installToFile,true)
} catch(error) {
//Total Failure…
alert(error.message+’\n’+error.details)
air.NativeApplication.nativeApplication.exit()
return
}
}

//connect to db
try {
dbcon = new air.SQLConnection()
var dbFile = air.File.applicationStorageDirectory.resolvePath("words.db")
dbcon.open(dbFile)
} catch(error) {
//Total Failure…
alert(error.message+’\n’+error.details)
air.NativeApplication.nativeApplication.exit()
return
}
[/js]
قطعه کد از همون مقاله بالا آورده شده.

مشکل اتصال حل شد، ولی من دیگه قصد تکمیل برنامه رو ندارم!
می‌تونید پیش‌نمایش اولیه اینترفیس رو ببینید:

مشاهده دمو :: توجه کنید که در دمو فقط سه گزینه اولی شامل محتوا هستند.

لطفاً مشترک http://feeds.feedburner.com/tweener شوید!

در این سری مقالات قصد دارم به نحوه ساخت افزونه برای سیستم قدرتمند وردپرس بپردازم. ابتدا به مقدمات می‌پردازیم و در مقاله‌های بعدی چندین افزونه خواهیم نوشت.

بخش اول: مقدمات

افزونه چیست؟
Codex وردپرس، افزونه را این‌گونه تعریف می‌کند:
افزونه وردپرس برنامه یا مجموعه‌ای از یک یا چندین تابع است که با زبان PHP نوشته شده باشند و به امکانات و یا سرویس‌هایی را به وردپرس می‌افزایند. این‌کار به کمک واسط برنامه‌نویسی افزونه وردپرس (Plugin Application Program Interface) صورت می‌گیرد. +

مشخصا، برای دنبال کردن مطالب شما باید آشنایی اولیه با PHP و نیز خود سیستم وردپرس داشته باشید (کتابچه راهنمای کامل وردپرس فارسی را ببینید).

ابتدا باید یک ایده‌ی کلی از آن‌چه افزونه شما می‌خواهد انجام دهد داشته باشید و سپس باید یک نام (که ترجیحاً منحصر به‌فرد باشد) برای آن انتخاب کنید. برای اطمینان از یکتایی نام، مخازن (Repository) افزونه‌ها را بررسی کنید و یا از گوگل کمک بگیرید.
به شاخه wp-content/plugins بروید و یک فایل php با نام دلخواه ایجاد کنید. کدهای افزونه می‌توانند در یک یا چندین فایل قرار بگیرند و خود افزونه نیز ممکن است تعدادی فایل‌های جانبی (تصاویر، کدهای جاوااسکریپت، شیوه‌نامه‌ها، فایل‌های زبان و…) داشته باشد. در چنین شرایطی برای ممانعت از شلوغ‌بازی در /plugins یک دایرکتوری مجزا برای افزونه درست کرده و فایل‌های افزونه را در آن‌جا قرار می‌دهیم.
می‌دانید که برای شناسایی پوسته‌ها توسط وردپرس باید اطلاعاتی را به ابتدای فایل style.css خود اضافه کنیم تا وردپرس آن را به عنوان یک پوسته شناسایی کند. برای افزونه‌ها نیز این مطلب صدق می‌کند. فایل php اصلی افزونه خود را باز کرده و اطلاعات زیر را در آن قرار دهید:

[php]
<?php
/*
Plugin Name: Name Of The Plugin
Plugin URI: http://URI_Of_Page_Describing_Plugin_and_Updates
Description: A brief description of the Plugin.
Version: The Plugin’s Version Number, e.g.: 1.0
Author: Name Of The Plugin Author
Author URI: http://URI_Of_The_Plugin_Author
*/
?>
[/php]

عناوین واضح‌اند. تنها تعریف لازم همان Plugin Name است و بقیه اطلاعات تنها برای نمایش در جدول صفحه مدیریت افزونه‌ها استفاده می‌شوند.
به صفحه مدیریت افزونه‌ها در محیط مدیریت بروید، می‌بینید که وردپرس افزونه را شناسایی کرده و آن را در لیست افزونه‌های غیرفعال قرار می‌دهد. روی دکمه «فعال کردن» کلیک کنید و افزونه را فعال کنید.
چه تغییراتی رخ داد؟ هیچ! هنوز به وردپرس نگفته‌ایم چه‌کار کند.
تبریک می‌گویم. اولین افزونه خود را نوشتید!

پی‌نوشت. لحن نوشته رسمی بود. فکر نکنم اصلاً از این جور نوشتن خوشم بیاد! در آموزش‌های بعدی لحن رو عوض می‌کنم. |)