CS101 – Lecture 41

السلام علیکم
کیسے مزاج ہیں؟
ہمارا پچھلا جو لیکچر ویب ڈیویلپمنٹ کے بارے میں تھا وہ سٹرنگ مینوپلیشن کے بارے میں تھا ہم نے مختلف میتھڈز ڈسکس کئے تھے جن کے ذریعے کسی سٹرنگ کو چینج کیا جا سکے یا اس کی مدد سے کوئی انفارمیشن حاصل کی جا سکے اور ان میتھڈز کی مدد سے ہم نے چھوٹی چھوٹی پرابلمز بھی آپ کو سالو کر کے دکھائی تھیں ۔
پہلی چیز تو یہ کہ سب سے اعلیٰ آپریٹر جو سٹرنگز کے بارے میں ہے وہ کنٹیکٹ ریلیشن کا ہے بڑا سادہ سا ہے اس کے ذریعے آپ دو سٹرنگز کو آپس میں جوڑ سکتے ہیں۔ پھر اس کے علاوہ بھی بعض زیادہ سے زیادہ چیزیں ہیں جو ان کے ذریعے کی جاتی ہیں اور وہ ساری کی ساری چیزیں سٹرنگ آبجیکٹ کی مدد سے کی جاتی ہیں یعنی جاوا سکرپٹ کا ایک بلٹ ان آبجیکٹ ہے جسے ہم سٹرنگ آبجکٹ کہتے ہیں اس کا مقصد صرف یہ ہے کہ ہمیں کچھ میتھڈز مہیا کرے جن کے ذریعے ہم ان سٹرنگزکو مینوپلیٹ کر سکیں اور اس آبجیکٹ کی بڑی دلچسپ پراپرٹی لینتھ کی پراپرٹی ہے جس کے ذریعے آپ کسی بھی آبجیکٹ کی لینتھ معلوم کر سکتے ہیں یعنی اس آبجیکٹ میں کتنے کیریکٹرز موجود ہیں ۔
سٹرنگ میتھڈز کا جہاں تک تعلق ہے ہم نے کئی طرح کے سٹرنگ میتھڈز دیکھے لیکن ان کو ہم دو کیٹگریز میں رکھ سکتے ہیں ایک وہ میتھڈز جنہیں ہم ایچ ٹی ایم ایل کے شارٹ کٹس کہہ سکتے ہیں یعنی ان میتھڈز کی ہمیں کوئی خاص ضرورت نہیں ہے اور ان کے بغیر بھی ہم یہ کام ایچ ٹی ایم ایل کے ذریعے یہ کام کر سکتے ہیں لیکن اس کا ایک خاص فائدہ جو ہمیں ہو گا وہ یہ ہو گا کہ ہم وہ کام ذرا کم چیزیں ٹائپ کر کے کر سکتے ہیں ۔ یعنی ہمیں شارٹ کٹس مہیا کیا گئے ہیں ۔
دوسری کیٹگری جو ہے وہ باقی تمام میتھڈز شامل ہیں اور وہ تمام میتھڈز جن کا ایکیولنٹ یا جن کا ثانی یا آلٹرنیٹ ایچ ٹی ایم ایل میں موجود نہیں ہے ۔ یہ برانڈ نیو میتھڈز ہیں ۔
جہاں تک ایچ ٹی ایم ایل شارٹ کٹس کا تعلق ہے اس میں ہم نے بگ سمال یا پھر فوٹ سائز کےمیتھڈز دیکھے جن کے ذریعے فونٹ یا کریکٹر کا سائز چھوٹا یا بڑا کر سکتے ہیںَ اس کے علاوہ سب سکرپٹ یا سپر سکڑپٹ کا بھی دیکھا بولڈ ، اٹالیک کا سٹرائیک تھرو اور اس کے علاوہ ہم نے ایک اور طریقہ بھی دیکھا کہ اب آپ فکسٖ فونٹ یوز کریں اور یہ بھی کہ اب فونٹ کا کلر کیا ہونا چاہئے اس کے لئے بھی جاوا سکرپٹ میں میتھڈ موجود ہے ۔
آخری جو ہم نے ایچ ٹی ایم ایل شارٹ کٹس میں دیکھا تھا وہ تھا لنک کا میتھڈ ، یہ بہت دلچسپ میتھڈ ہے اس کے ذریعے آپ کوئی بھی سٹرنگ لیں اس کے بارے میں بتا دیں کہ اس کے پیچھے فلاں لنک ہونا چاہئے تو اس کے لئے بھی جاوا سکرپٹ میں ایک میتھڈ موجود ہے ۔
دوسری کیٹگری جو تھی اس میں دو میتھڈز تو اس لئے تھے کہ اگر کسی سٹرنگ کے سارے کے سارے کیریکٹرز کو اپر کیس میں لانا یا سب کے سب کو لوئیر کیس میں لے کر جانا ہو اس کے لئے دو میتھڈز موجود ہیں اس کے علاوہ چار ایٹ کا ایک بڑا دلچسپ میتھڈ موجود ہے ہوتا یہ ہے کہ آپ چار ایٹ اور آگے ایک نمبر دیتے ہیں تو اس نمبر یا اس پوزیشن پر جو کیریکٹر ہوتا ہے وہ آپ کو مل جاتا ہے تو چار ایٹ کے ذریعے آپ پوزیشن بتاتے ہیں اور پوزیشن کے ذریعے جو کیریکٹر ہوتا ہے وہ اس سٹرنگ کا کیریکٹر آپ کو مل جاتا ہے
، سب سٹرنگ جو ہے وہ چار ایٹ کی ذرا جنرلائز سی فارم ہے یعنی ویسا ہی کام لیکن ذرا بہتر طریقے سے کام کرتے ہیں ۔ اس کے علاوہ ہم نے انڈیکس آف کا میتھڈ بھی دیکھا یعنی آپ اس میتھڈ کے ذریعے ایک کیوری کرتے ہیں کہ یہ ایک سب سٹرنگ ہے اس میں یہ کسی سٹرنگ میں پایا جاتا ہے تو انڈیکس آف میتھڈ جو ہے وہ آپ کو پوزیشن دیتا ہے اس کے علاوہ جو ہے ایک لاسٹ انڈیکس آف کی میتھڈ ہے وہ ذرا الٹا کام کرتا ہے انڈیکس آف میں آپ جو کیریکٹر تلاش کرتے ہیں وہ ایسے ہوتا کہ سٹارٹ سے شروع کر کے سکین کرتا ہے اور جہاں پر پہلی دفعہ آپ کو سٹرنگ نظر آتا ہے آپ وہ پوزیشن ریٹرن کر دیتے ہیں لاسٹ انڈیکس آف میں آپ یہاں سے شروع کرتے ہیں بجائے لیفٹ سے شروع کرنے کے آپ رائٹ سے شروع کرتے ہیں یعنی آپ الٹا سکین کرتے ہیں ۔ آخری میتھڈ جو ہم نے دیکھا تھا وہ سپلٹ کا ۔ یعنی ایسا میتھڈ جس کے ذریعے آپ سٹرنگ کو حصوں میں بانٹ سکیں ۔ آپ ایک ڈیلیمٹر دیتے ہیں جہاں جہاں اس سٹرنگ میں وہ ڈیلیمٹر ہوتا ہے وہ سٹرنگ کے ٹکرے ہو جاتے ہیں یہ بڑا دلچسپ میتھڈ ہے جس کے ذریعے کسی سنٹیکس کو اس کے ورڈز میں بانٹا جا سکتا ہے ۔
نیکسٹ چیز جو ہم نے دیکھی تھی وہ تھی آٹو میٹک کنورژن آف دی سٹرنگز ، یعنی بعض دفعہ ایسا ہوتا ہے کہ آپ کوئی ٹرانسکرپٹ پر کام کر رہے ہوتے ہیں اور وہاں پر کسی خاص جگہ پر ایک سٹرنگ کی ضرورت ہوتی ہیں لیکن وہاں پر کچھ اور لکھا ہوتا ہے کوئی نمبر لکھا ہوتا یا بولین لکھا ہوتا ہے تو جاوا سکرپٹ خود کار طریقے سے اس کریکٹر یا بولین کو سٹرنگ میں تبدیل کر لیتی ہے ۔
اگر آپ دو سٹرنگ کو کمپیٹنیٹ کریں جواب آپ کا سٹرنگ آئے گا لیکن کبھی ایسا ہوتا ہے کہ آپ ایک سٹرنگ کو کسی اور چیز کے ساتھ یعنی ایک بولین کے ساتھ یا ایک نمبر کے ساتھ کمپیٹنیٹ کرتے ہیں تو جاوا سکرپٹ سب سے پہلے اس نمبر یا بولین کو سٹرنگ میں کنورٹ کرتی اور پھر اسے کمپیٹینٹ کرتی ہے۔ سٹرنگ اگر میتھیمیٹک ایکسپریشن میں لکھے جائیں تو جاوا سکرپٹ کوشش یہ کرتی ہے کہ اس سٹرنگ کو پہلے ایک نمبر میں تدیل کے اس کے بعد پھر اس کو میتھیمیٹکل آُپریشن کو پورا کرے لیکن بعض اوقات نمبر میں کنورژن ممکن نہیں ہوتا تو اس صورت میں آپ کو این اے این کا ایرر ملتا یعنی ناٹ آ نمبر ۔
اس کے علاوہ ہم نے یہ بھی دیکھکا تھا کہ ایک ٹو سٹرنگ کا میتھڈ ہے جس کے لئے آپ کسی نمبر یا بولین کو سٹرنگ میں کنورٹ کر سکتے ہیں ہم نے دو پرانے میتھڈ پارس ہنٹ اور پارس فلوٹ کو بھی ریویو کیا تھا یہ وہ میتھڈز ہیں جن کے ذریعے آپ کسی سٹرنگ کو نمبرز میں کنورٹ کرتے ہیں ۔ پارس ان کے ذریعے انٹر میں اور پارس فلوٹ کے ذریعے ایک فلوٹنگ پوائنٹ نمبر میں اور یہ میتھڈز بہت فائدہ مند ہیں جب آپ کسی فارم سے کوئی نمبر اٹھا رہے ہوتے ہیں تو فارم میں جو نمبرز ہوتے ہیں وہ ٹیکسٹ کی صورت میں ہوتے ہیں ان دونوں میں سے کسی ایک ذریعئے پہلے آپ اسے ایک نمبر میں کنورٹ کرتے ہیں اور پھر آپ اس کو مینو پلیٹ کرنے کی کوشش کرتے ہیں ۔ تو جناب یہ تھی سٹرنگز اور پچھلے لیکچر کی بات ۔
آج ہم بات کریں گے کہ ایک ویب پیج پر امیجز کیسے ایڈ کیے جاتے ہیں اور اس پر ایک سادی سی اینی میشن کیسے ایڈ کی جاتی ہے امیجز کو تھوڑا سا ہم مینوپلیٹگ کس طرح سے کر سکتے ہیں جاوا سکرپٹ کی مدد سے ۔
تو آج کا ہمارا ٹاپک ہے امیجز اینڈ اینی میشن
ایک ایچ ٹی ایم ایل پیج پر امیج کو ایڈ کرنا خاصا آسان ہے ۔ آپ جو دو فارمیٹ استعمال کرتے ہیں اس مقصد کے لئے وہ دو فارمیٹ ہیں ایک جو ہے وہ جیف(gif) فارمیٹ یے اور دوسرا جے پی جی فارمیٹ ہے ان کا ہم پہلے بھی تذکرہ کر چکے ہیں اگر آپ کے پاس ان فارمیٹس میں کوئی تصویر موجود ہے تو اس کے لیے آپ امیج ٹیگ استعمال کرتے ہیں ایچ ٹی ایم ایل میں امیج آئی ایم جی ایک ٹیگ ہے جس کی مدد سے آپ اس امیج کو ایک ایچ ٹی ایم ایل پیج پر ڈسپلے کر سکتے ہیں۔
یہ جو امیج ٹیگ ہے اس کے اندر کئی اٹریبیوٹس ہیں جس میں سب سے دلچسپ ایس آر سی ہے ، یہاں پر آپ یہ بتاتے ہیں کہ جو امیج آپ نے استعمال کرنا ہے وہ پڑا کدھر ہوا ہے اور اس کی فائل کہاں موجود ہے ، یعنی وہ سورس بتاتے ہیں یہ سورس ایک سادہ سا فائل کا نام بھی ہو سکتا ہے یعنی وہ جگہ یا فولڈر جہاں وہ فائل موجود ہے یا پھر یہ بھی ہو سکتا ہے کہ وہ امیج کی فائل کسی اورویب سرور پر پڑی ہوئی ہے تو یہ بھی فائن ہے آپ پورے کا پورا یو آر ایل سورس کی صورت میں ڈال دیں اور تھوڑی دیر میں وہ ڈسپلے پہنچا دے گا ۔
اس کے علاوہ ہائیٹ اور وڈتھ کے جو امیج کی ہے وہ بھی آپ اس ٹیب کے اندر ڈال سکتے ہیں۔ ہائیٹ اور وڈتھ امیج کی جو بھی ہو آپ اپنی مرضی کی اس میں لکھ سکتے ہیں چاہے اس کے ذریعے امیج کے سائز کنٹرول کرنا بہت آسان ہے ، آپ امیج کو چھوٹا بڑا ، کر سکتے ہیں میگنیفائی کر سکتے ہیں ۔

اس کے علاوہ ایک اور انٹرسٹنگ اٹریبیوٹ الائن کا ہے اس کے تین ویلیوز ہو سکتی ہیں باٹم مڈل یا ٹاپ یعنی جہاں پر آپ کا امیج ڈسپلے ہو رہا ہے اس رو یا لائن یا مقام پر اس کی الائنمنٹ کیسی ہونی چاہئے یعنی اس مقام پر موجود رو کی باٹم میں ہونا چاہئے اس کی ٹاپ پر ہونا چاہئے یا اس کے مڈل میں ہونا چاہئے ہم یہ آپ کو یوز کر کے دکھائیں گے ۔

لیکن اس سے پہلے آپ سے ایک درخواست ہے جو پہلے بھی ہم نے کی تھی کہ امیجز صرف اس صورت میں استعمال کریں جہاں اس کے علاوہ کوئی چارہ نہ ہو ۔ آج کل کے لوگوں کے انٹرنیٹ کنکشن اتنے زبردست نہیں ہیں اس لئے اگر کسی ویب پیج پر امیج بہت زیادہ ہوں تو اس کی وجہ سے اس ویب پیج کو ڈاؤن لوڈ کرنا عام آدمی کے لئے خاصی مشکل ہوتا ہے۔ لہذا امیجز کو صرف تب استعمال کریں جب اس کے علاوہ کوئی چارہ نہ ہو۔
آئیے آپ کو تین مثالیں دکھاتے ہیں جس میں تین امیجز دکھائے جا رہے ہیں ۔ تو دیکھتے ہیں کہ ان امیجز کا کوڈ کیا ہے جو میں نے ایچ ٹی ایم ایل میں لکھا تھاجو یہ امیجز مجھے اس طرح سے نظر آ رہے ہیں

تو جناب کوڈ بڑا سادہ سا ہے سب سے پہلے آپ دیکھتے ہیں جیسے شروع میں آپ ایچ ٹی ایم ایل کے پیج شروع کرتے ہیں ہیڈ پورشن میں ٹائٹل لکھتے ہیں ۔پھر باڈی کا پورشن شروع ہوتا ہے پھر اس کے بعد امیج کا پورشن شروع ہوتا ہے پھر ہم نے ایک ہیڈنگ لکھی ہے لیکن اس کے بعد امیج کے بارے میں چیزیں آنا شروع ہوتی ہیں ، تو سب سے پہلے جو آپ نے امیج دیکھا تھا جو تین ڈاٹس بنے ہوئے تھے اس امیج ایک نام ہے یعنی جس فائل میں وہ امیج سیو ہے اس کا نام ہے ڈائی فائی ڈاٹ جیف۔

تو ہم نے اس میج میں صرف اور صرف ایک اٹریبیوٹ لکھا ہے اس امیج کو استعمال کرنے کے لئے ہم نے امیج کا ٹیگ لکھا ہے اس کے بعد اس کو ایک اٹریبیوٹ دے دیا ،
src=”die5.gif”
تو یہاں پر جو امیج ہے وہ جس کانام ڈائی فائیو ہے وہ ڈسپلے ہو جائے گا۔ اس کی چوڑائی یا وڈتھ کتنی ہو گی جتنی ایکچوئل وڈتھ ہے ۔ اس کی ہائیٹ کتنی ہو گی جتنی ایکچوئیل ہائیٹ ہے اس کے بعد ہم نے اس امیج کو دوبارہ ڈسپلے کیا ہے لیکن ہم نے تھوڑی سی چینج کی ہے ہم نے اس کی ہائیٹ اور وڈتھ تھوڑی سی چینج کر دی ہے وڈتھ جو ہے ہم نے 126 کر دی ہے اور اصل میں اس امیج کی وڈتھ واقعی 126 ہے تو اس کی وڈتھ تو ویسی ہی ہے لیکن اس کی ہائیٹ کو ہم نے آدھا کر دیا ہے تو آپ دیکھ رہے کہ یہ تھوڑا سا سکواشڈ یا دبا ہوا نظر آ رہا ہے

تو امیج اٹریبیوٹ کی مدد سے ہم بہت سی دلچسپ کام کر سکتے ہیں امیج کو موڈی فائی کر سکتے ہیں میگنی فائی یا پریس کر سکتے ہیں اس کے بعد جو ہم نے امیج استعمال کیا ہے اس میں ہم نے دو دلچسپ چیزیں استعمال کی ہیں اس میں سب سے پہلے ہم نے الائن کا اٹریبیوٹ استعمال کیا ہے اس سے پہلے جو تھے وہ جو بھی ڈیفالٹ الائنمنٹ تھی اس پر نظر آئے لیکن یہاں پر ہم نے کہا کہ الائن از ایکوئل ٹو مڈل یعنی یہ امیج آپ نے اس طرح ڈسپلے کرنا ہے کہ جس لائن میں یہ امیج ڈسپلے ہو رہا ہواس کے ساتھ مڈل جسٹیفیائیڈ ہو تو آپ نے جس طرح ویب پیج کو دیکھا تھا کہ یہ ذرا مختلف طریقے سے ڈسپلے ہو رہا تھا اس کی وجہ یہی تھی کہ الائن از ایکوئل ٹو مڈل۔
اس کا سورس جو ہے وہ انٹرسٹنگ ہے کیوں کہ اس کا سورس جو ہے وہ ہم نے سمپل فای؛ نیم نہیں لکھا ہوا کسی لوکل فائل کا نام نہیں لکھا ہوا جیسا ہم نے پچھلے امیج میں لکھا تھا یہاں پر ہم نے ایک پورے کا پورا یو آر ایل دیا ہے یہ جو یو آر ایل ہے یہ میرے کمپیوٹر پر نہیں پڑا ہوا یہ کسی اور ویب سرور پر پڑا ہوا ہے تو امیج ٹیگ کی ایک خوبی یہ بھی ہے کہ امیج اگر آپ کے پاس نہ بھہ ہو کہیں اور کسی ریموٹ لوکیشن پر پڑا ہو اس کو بھی اس ٹیگ کے ذریعے آپ اپنے ویب پیج پر دکھا سکتے ہیں

تو جناب یہ تو تھی بات ایچ ٹی ایم ایل کی۔ یعنی ایچ ٹی ایم ایل میں تو ہم بڑے سادے طریقے سے ہم نے آپ کو بتایا کہ امیجز کو کیسے ڈسپلے کیا جاتا ہے اب بات کرتے ہیں جاوا سکرپٹ کی
جاوا سکرپٹ میں امیج کو مینیوپلیٹ کرنے اور ڈسپلے کرنے کے لئے جاوا سکرپٹ کا ایک بلٹ ان آبجیکٹ ہے جس کا نام ہے امیج اس کو یوز کیا جاتا ہے اس کی کئی پراپرٹیز ہیں ، اس میں بارڈر نیم ، کملیٹ الائنمنٹ ہائیٹ وڈتھ ، ایچ سپیس ط سپیس لو ایس آر سی کی پراپرٹی ہے ۔ اور یہ جو ایس آر سی کی پراپرٹی ہے یہ بہت دلچسپ ہے اور یہ وہ ہے جو ابھی ہم استعمال کرنے جا رہے ہیں۔
نیم کی پراپرٹی بھی ہم استعمال کریں گے لیکن ایس آر سی کی پراپرٹی بھی ہم استعمال کریں گے یعنی سورس کی پراپرٹی ہم ایک دو مثالوں میں آپ کو استعمال کر کے دکھائیں گے ۔
اس کے میتھڈز شاید ہوں مجھے نہیں معلوم لیکن اس کے ساتھ کچھ سپیشل ایونٹ ہینڈلر بھی ہیں ۔ مثلاً آن ابارٹ ، آن ایرر ، آن لوڈ وغیرہ ۔ آن آبارڈ والا کافی دلچسپ ہے فرض کریں آپ ایک ویب پیج ڈاؤن لوڈ کر رہے ہیں اس میں ایک امیج ڈاؤن لوڈ ہو رہا ہے بیج میں ابھی امیج پورا ڈاؤن لوڈ نہیں ہوا آپ جا کر سٹاپ کہہ دیتے ہیں یعنی آپ ابارڈ کردیتے ہیں ڈاؤن لوڈنگ کو تو یہ والا ایونٹ ہیںڈلر جو ہے یہ فائر ہو جاتا ہے آن ایرر جو ہے وہ بھی تقریباً اسی طرح کام کرتا ہے کہ جب آپ کوئی ویب پیج ڈاؤن لوڈ کر رہے اس میں کوئی امیج ہے اور اس میں کوئی ایرر آتا ہے تو وہ فائر ہو جائے گا ۔

آن لوڈ جو ہے یہ بھی ایک ایونٹ ہینڈلر ہے اس میں یہ ہوتا ہے کہ جب وہ امیج جو آپ ویب پیج پر لانا چاہ رہے ہیں جب وہ پورے کا پورا آجاتا ہے یا لوڈ ہو جاتا ہے تو یہ والا ایونٹ ہینڈلر فائر کر جاتا ہے۔
جاوا سکرپٹ میں یہ جو امیج کا آبجیکٹ ہے اس کا مین مقصد میرے خیال میں صرف ایک ہی ہے وہ ہے امیج پری لوڈنگ ۔ اس سے ہماری کیا مراد ہے ؟ اس سے ہماری مرادیہ ہے کہ کچھ امیجز ہیں انہیں آپ اپنے پیج پر ڈسپلےکرنا چاہتے ہیں ظاہر ہیں امیج ہیں ان کا اپنا سائز ہے تو ان کو آنے میں تھوڑا سا ٹائم لگے گا لیکن جاوا سکرپٹ کی یہ فیسلٹی استعمال کر کے آپ ان امیجز کو پہلے سے لوڈ کر سکتے ہیں یعنی ان کو دکھانے سے پہلے ہی ڈاؤن لوڈ کر کے کیش میں لا کر سکتے ہیں کہ جونہی اس کی ضرورت پڑے فٹ کر کے آ جائیں ۔تو پری لوڈنگ سے مراد بڑی سادہ سی ہے کہ امیجز کو پہلے سے اپنے کیش میں لا کر رکھ دیا جائے تاکہ ضرورت پڑنے پر ان کو ڈاؤن لوڈ کرنے کے انتظار کی کوفت سے یوزر بچ سکے۔
اس کے کئی فائدے ہیں مثلاً اس کے ذریعے ہم جو اینی میشن بنائیں گے وہ بہت سمودھ ہو گی ، اس میں یہ نہیں ہو گا کہ ایک امیج نظر آیا اور اس کے بعد دوسرے کے ڈاؤن لوڈ ہونے کا ویٹ کیا جائے اور اس کے علاوہ اور بھی بہت سی امیج مینیوپلیشن کی چیزیں جن میں اس امیج پری لوڈنگ میتھڈ سے فائدہ اٹھایا جا سکتا ہے ۔ ان میں سے ایک آدھ اور بھی ڈسکس کریں گے۔
آئیے دیکھتے ہیں کہ امیج پری لوڈنگ کیسے کی جاتی ہے اس کا طریقہ اور پراسیس کیا ہے ۔ سب سے پہلے تو آپ یہ کرتے ہیں کہ امیج آبجیکٹ کا ایک انسٹنس جنریٹ کرتے ہیں یعنی آپ نیو والا کی ورڈ لگاتے ہیں اور امیج آبجکیٹ کا ایک انسٹنس کری ایٹ کرتے ہیں ۔ آپ کو یاد ہو گا کہ اریز کے ساتھ ہم یہی کیا کرتے تھے ، جس طرح اریز کے ساتھ ہم ایک نیا انسٹنس بناتے تھے اسی طرح اس امیج آبجیکٹ کا بھی ہم ایک نیا انسٹنس بنائیں گے یوزنگ دا نیو کی ورڈ۔ اس کے بعد ہم یہ کرتے ہیں کہ یہ جو نیا امیج ہے اس کی جو ایس آرسی پراپرٹی ہے اس کو ہم سیٹ کر دیتے ہیں اس فائل نیم کے برابر کردیتے ہیں جو فائل ہم ڈاؤن لوڈ کرنا چاہتے ہیں ۔

تو پہلے ہم نے انسٹنس کری ایٹ کیا اور پھر ہم اس فائل نیم کی پراپرٹی سے ایکیوٹ کر دیا نیکسٹ یہ ہوتا ہے کہ وہ امیج ڈاؤن ہونا شروع ہو جاتا ہے لیکن وہ سامنے ڈاؤن لوڈ نہیں ہوتا بلکہ وہ بیک گراؤنڈ میں ڈاؤن لوڈ ہونا شروع ہو جاتا ہے۔ وہ پیج پر نظر نہیں آتابلکہ وہ کیش میں آنا شروع ہو جاتا ہے ۔ اس کے جونہی آپ کو اس امیج کی ضرورت پڑتی ہے تو آپ کے ویب پیج پہ مختلف امیجز جو آپ ڈسپلے کر رہے ہیں اس کی سورس پراپرٹی کو جو امیج آپ نے پہلے سے رکھا ہوا ہے اس کے برابر کر دیتے ہیں۔ تو اس طرح وہ امیج فوراً آپ کے پیج پر نظر آنا شروع ہو جاتا ہے ۔ یہ ابھی آپ کو ایک سے مثال کے طور پر کر کے دکھاتے یہ مثال جناب جو ہم نے اپنے پینتیسویں لیکچر میں کی تھی اس کو ہم دوبارہ کریں گے ۔
وہاں ہم نے کیریکٹرز کی مدد سے کی تھی اور یہاں ہم امیجز کی مدد سے کرنے کی کوشش کریں آپ کو یاد ہو گا یہ ایک ہم نے چھوٹا سا ایک رول دا ڈائے ٹیب بنایا تھا ،جس میں بٹن کے اوپر ہم ماؤس لے کر آتے ہیں ، فوراً فورن ایک سے لے کر 6 تک کوئی نمبر یہ اسٹارز کی صورت میں ڈسپلے ہو جاتا ہے یہ ٹھیک ہے مضائقہ نہیں ہے لیکن مومن جب آپ اس الیکٹرونک ڈائی کو رن کر رہے ہیں تو آپ سوچ رہے ہوتے ہیں کہ وہ جو فزیکل ڈائے ہوتی ہے جس میں آپ لڈو کھیلتے ہیں وہ اب کسی طرح نظر آئے تو اس کا طریقہ کشھ ایسے ہے ۔ کہ جونہی یہ جو رول دا ڈائے اس کے بٹن پہ آ کے میں ماؤس کو کلک کرتا ہوں تو کوئی نمبر مجھے ایک سے چھ تک نظر آنا شروع ہو جاتا ہے۔

رینڈملی جینیرٹڈ ، رینڈملی سلیکٹڈ آپ کو ڈائس کا ایک فیس جو ہے وہ نظر آنا شروع ہو جاتا ہے ۔ تو یہ ہم نے نئی چیز کی ہے پہلے ہم نے
پہلے ہم نے کیریکٹرز کی مدد سےیہ کام کیا تھااب ہم امیجز کی مدد سے یہ کام کریں گے۔ تو آئیے دیکھتے ہیں اس کو ہم کیسے کریں سب سے پہلے تو ہم نے تجھے ایمیجز کری ایٹ کی یعنی ایک ڈاٹ والا دو ڈاٹ والا تین ڈاٹ اور اسی طرح 1 سے 6 تک ڈاٹس ہم بنا لیں گے امیجز کی فارم میں۔ ان کے نام ہم نے رکھے ڈائے ون ڈاٹ جیف ڈائے ٹو ڈاٹ جیف اور اسی طرح ڈائے سکس ڈاٹ جیف تک ہم نے ان کے نام ان کے ڈاٹس کے مطابق رکھ لئے۔

جب ہم نے یہ کرلیا اس کے بعد ہم نے اپنا پیج بنانا شروع کردیا اس ویب پیج میں اس کا سٹرکچر آپ کو کا نظر آ رہا ہے۔ تو جاوا سکرپٹ کا تھوڑا سا کوڈ لکھا اور تھوڑا سا ایچ ٹی ایم ایل کا کوڈ لکھا سب سے پہلے ہم ایچ ٹی ایم ایل کوڈ کو دیکھیں گے سب سے پہلے تو ایچ ٹی ایم ایل کے کوڈ میں ہم نے اس امیج کو ڈسکرائب کیا تھا۔ ہم نے یہ کہا کہ امیج ٹیگ ہے اور اس میں ہم نے امیج کا ایک نام رکھا جو کہ ہے ڈائے اور دوسرا اس کا سورس لکھا کہ جناب یہ جو امیج آپ نے ڈسپلے کرنی ہے اس کا نام ہے ڈائے سکس۔آپ نے دیکھا ہو گا کہ جو ڈائے سکس آپ نے دیکھا ہوگا کہ جو ڈھائی جب پہلی دفعہ ڈسپلے ہوئی تھی چھ لکھا ہوا تھا تو ایک لحاظ سے یہ ایک ڈیفالٹ امیج ہے۔

جب بھی اس پروگرام کو آپ شروع کریں گے ہمیشہ آپ کو چھ ہی نظر آئے گا اس کے بعد جب آپ بٹن دبائیں گے تو رینڈم لی امیجز نظر آئینگے۔ تو جناب یہ تو امیجز کا ٹیک ہوگیا اس کے بعد ہم نے بٹن بنانا ہے جس کے لیے ہم ایک فارم شروع کردیتے ہیں فارم کے اندر ہم ایک بٹن ڈال دیتے ہیں اس کا نام ہم نے رول دا ڈائے رکھا اور اس کے ساتھ جو نے ایونٹ ہینڈلر جو لگا ہوا ہے اس کا نام ہے کلک ان ٹو رول دا ڈائے یعنی جب یہ اس بٹن کو کلک کریں گے تو یہ والا ہینڈلر جو ہے وہ فائر کر جائے۔ یہ تھا ہمارا ایچ ٹی ایم ایل کا پورشن۔
اس کے بعد ہم جاوا سکرپٹ کا ذکر کریں گے اس کے دو ٹکڑے ہیں پہلے ٹکڑے کو ہم دیکھتے ہیں اس میں سب سے پہلے تو ہم ڈائی ایم ایچ ایکول نیو سیون یعنی ہم یہاں پہ کیا کہہ رہے ہیں ہم یہاں پہ ایک نیا ارے کا انس ٹینس جنریٹ کر رہے ہیں اس کا نام ہم رکھ رہے ہیں امیج۔ تو یہ ایک ایسا ہی ہے جس میں 7 ایلیمنٹس ہونگے۔ پہلا الیمنٹ زیرو ہوگا اس کے بعد ون ٹو تھری ۔ جوا زیرو الیمنٹ ہوگا اس کو ہم استعمال نہیں کریں گے ہم صرف آخری چھالی مجھ کو یوز کریں گے یعنی 1 2 3 4 5 اور 6 ان کو ہم استعمال کریں گے اس کے بعد ہم لوپ شروع کردیتے ہیں اس کو ہم شروع کرتے ہیں ون سے اور جاتا ہے سکس تک اور درمیان میں ایک ایک کرکے یہ انکریمنٹ ہوتا جاتا ہے

یہ لوپ کس لئے ہے یہ لوپ ہم بار بار دیکھیں گے آج اس لوپ کا مقصد جو ہے وہ ان امیجز کو فری فیچ ہے پری لوڈ کرنا ہے یعنی پہلے سے اپنے پاس لا کے رکھنا ہے یعنی اس اس لوپ کے ذریعے ہم ان امیجز کو لے آئیں گے اور اور ابھی ڈسپلے نہیں کریں گے ڈسپلے یہ ہم بعد میں کریں گے تو میں نے اس میں ہم ان میچ اوبجیکٹ کا انسٹینس ڈیفائن کرتے ہیں تو بنی ڈائی امیج کے یعنی یہ جو اررے ہم نے بنایا اس کا کےتھ ایلیمنٹ ہے وہ کیا ہو جاتا ہے وہ ایک امیج کا انسٹس ہوجاتا ہے۔ جو ہیں وہ امیج کا انس ٹینس بنا لیتے ہیں پھر ہم کہتے ہیں کہ یہ جو انس ٹینس ہم نے بنا لیا ہے امیج کا اس کی جاسوس والی پراپرٹی ہے وہ برابر ہے ڈائے پلس کے پلس آبجیکٹ ۔ کے کی ویلیو ون ہوگی تو یہاں پہ کیا آئے گا یہاں پہ آئے گا ڈائون ڈاٹ جیف ۔ ٹو پر ڈائے ٹو ڈاٹ جیف آئے گا تو یہاں پہ ہم ہم نے آرے کے ذریعے جو لوپ بنایا تھا اس کے آخری چھ الیمنٹس ہیں ان میں ہم چھ امیجز ڈال رہے ہیں ان کو پری لوڈ کر رہے ہیں۔

تو یہ جب سارے کا سارا لوپ چل پڑے گا ۔ تو کیا ہوگا ہمارا جو ایرے ہے اس کے آخری چھ ایلیمنٹس ہیں وہ ان کی جگہ پے امیجز آجائیں گے اس کے بعد ہم فنکشن ڈیفائن کرتے ہیں ڈائے کا ۔ یہ وہ فنکشن ہے کہ جب بٹن دبایا جائے گا تو یہ والا فنکشن کال ہوگا۔ یہ فنکشن آپ پہلے بھی دیکھ چکے ہیں۔ اس میں ہم سب سے پہلے تو یہ دیکھتے ہیں کہ نمبر کونسا ہونا چاہیے اور اس کے بعد ہم اس نمبر کو ڈسپلے کرتے ہیں امیج کی مدد سے یہ نمبر جو ہے اس کو اپنے پہلے دیکھا ہوگا پچھلی دفعہ ہم نے میتھ ڈاٹ راؤنڈ کا میتھڈ یوز کیا تھا ۔ آج ہم وہ نہیں کر رہے آج ہم میتھ ڈاٹ سیلنگ کام میتھڈ یوز کر رہے ہیں۔

تو یہ جو سکس ٹائمز میتھ رینڈم ہے اس ہمیں جو جواب ملے گا وہ زیرو اور سکس کے درمیان کوئی نمبر ہو گا اور یہ میتھ ڈاٹ سیلنگ جو ہے وہ اس کو انٹیجز میں کنورٹ کرے گا یعنی ایک دو تین چار پانچ یا چھ ان میں سے کوئی امیج ہمیں دے دے گا ۔ اس کے بعد یعنی اس سٹیٹمنٹ کے بعد جب ہمیں ایک رینڈم نمبر مل گیا اب ہم نے اس رینڈم نمبر کا جو امیج جو ہے اس کو ڈسپلے کرنا ہے اس کے لئے ہم کرتے یہ ہیں کہ یہ جو ڈاکیومنٹ ڈاٹ ڈائے ہے یعنی ڈاکیومنٹ کے اندر جو امیج ہے جس کا نام ہے ڈائے اس کی جو ایس آر سی والی پراپڑتی ہے یعنی اس کا جو سورس ہے اس کو ہم تبدیل کر دیتے ہیں

آپ کو یاد ہو گا کہ جو پہلے اس کی پراپرٹی تھی ڈائے سکس ڈاٹ جیف اس کو ہم کچھ اور دکھانا چاہتے ہیں ، ہم دکھانا چاہتے ہیں ڈائے امیج آف ڈائے این ڈاٹ سورس۔ یعنی ہم ڈائے این سے ریلٹڈ امیج کو اس کا سورس کر دیتے ہیں یعنی جو ڈائے امیج ڈاٹ سورس ہے ، ڈاکیومنٹ ڈاٹ ڈائے ڈاٹ سورس ہے اس کو ایکیوٹ کر دیتے ہیں ایک امیج کے سورس سے تو ہوتا یہ ہے جونہی یہ امیج ایگزیکیوٹ ہوتا ہے وہاں پر یہ امیج تبدیل ہو جاتا ہے فرض کریں کہ ڈائے این کی ویلیو آتی ہے تھری تو یہ ہو گا کہ ڈاکیومنٹ ڈاٹ ڈائے ڈاٹ سورس جو یے وہ ڈائے امیج ڈاٹ تھری داٹ سورس ، تو وہاں پر جو امیج شو ہو گا وہ ہو گا تھری، یعنی یہ جو آپ کا تھری والا امیج ہے وہ ڈسپلے ہونا شروع ہو جائے گا ۔

تو جناب یہ تھی ایک مثال اس کے بعد ہم ایک اور مثال کرنا شروع کرتے ہیں جس میں ہم انہی امیجز کو ذرا مینیوپلیٹ کرنے کی کوشش کریں گےان سے ذرا کچھ انٹرسٹنگ کام لینے کی کوشش کرتے ہیں ۔

اس میں ہم ایک تھمب نیل ویویر دکھانا چاہتے ہیں ہم یہ دکھانا چاہتے ہیں کہ بعض چھوٹے چھوٹۓ امیجز جن کو ہم تھمب نیلز کہتے ہیں وہ دکھانا چاہتے ہیں اور ہم یہ بھی چاہتے ہیں کہ اس چھوٹے امیج پر جونہی میرا پوائنٹر جائے اس امیج کی بڑی سی ورژن ہمیں نظر آنی شروع ہو جائے۔ تو ہم کریں گے یہ کہ یہاں پہ ہم چھ چھوٹے چھوٹے امیجز لیں گے ہمارا جو ماؤس ہے وہ ان میں سے کسی ایک کے امیج کے اوپر جاتا ہے یعنی ہوور کرتا ہے تو فوراً وہ جو بڑے والا امیج ہے وہ تبدیل ہو کے اس کی جگہ پر آجاتا ہے تو اس کا پہلے آپ کو ایک چھوٹا سا ڈیمو دکھاتے ہیں۔ یہاں پر آپ دیکھ رہے ہیں کہ ایک بڑا سا امیج نظر آ رہا ہے اور نیچے چھہ چھوٹے چھوٹے امیجز ہیں اور یہ جو چھوٹے امیجز ہیں ان میں ایک امیچ پر جس پر پانچ ڈاٹس نظر آ رہے ہیں اس پہ اس وقت ہمارا ماؤس ہیں تو اس لئے جو بڑا امیج ہے اس پے بھی ہمیں پانچ ڈاٹس والا امیج نظر آ رہا ہے جو نہی ہمارا ماؤس اس پانچ ڈاٹ والے امیج سے فرض کریں چار ڈاٹس والے امیج پر جاتا ہے تو جو بڑا امیج ہے اس کی جگہ پہ ڈاٹ والا امیج نظر آنا شروع ہو جائے گا۔

تو اس میں ہم کیا کر رہے ہیں اس میں چھوٹے چھوٹے تھمب نیلز ہیں جونہی ماؤس ہوور ہوتا ہے کسی ایک تھمب نیل پہ اس سے ریلیٹڈ بڑا امیج جو ہے وہ نظر آنا شروع ہو جاتا ہے۔ آئیے اس کا یہ جو کوڈ ہے اس کو ہم ایک نظر دیکھتے ہیں یہ کوڈ بڑا سادہ سا ہمارا ایچ ٹی ایم ایل پیج کا ہوتا ہے۔ اور اس کے جو دو حصے ہیں وہ میں نے ابھی آپ کو نہیں دکھائے ۔ وہ میں بھی آپ کو دکھاتا ہوں تو سب سے پہلے میں آپ کو اس کا جاواسکرپٹ والا حصہ دکھانا چاہوں گا

اس کا جو جاوا سکرپٹ کوڈ ہے یہ وہی کوڈ ہے جو ہم نے تھوڑی دیر پہلے بھی دیکھا تھا یہاں پر ہم امیجز کو پری لوڈ کر رہے ہیں بالکل وہی کو جو ہم نے پچھلے مثال میں بھی دیکھا تھا اس کے بعد میں آپ کو اس کا ایچ ٹی ایم ایل کا کوڈ بھی دکھاتا ہوں یہاں پہ اب دیکھتے ہیں کہ یہ ایک نسبتا پیچیدہ کوڈ ہے ایچ ٹی ایم ایل کی نسبت اب تک عموماً جو ہم یہ کرتے رہے ہیں کہ ہماری زیادہ تر پروسیسنگ ہے وہ جاوا سکرپٹ والے پارٹ میں ہوتی رہی ہے لیکن اس مثال میں ہم اپنی پروسیسنگ جو ہے وہ ایچ ٹی ایم ایل والے پارٹ میں کر رہے ہیں اس کا پہلا حصہ دیکھیں اس میں سب سے پہلے تو ہمیں کا میچ والا ٹیگ یوز کرتے ہیں اور ایک امیج ڈیفائن کرتے ہیں۔ اس کا نام رکھتے ہیں بے اور اس کا یعنی یہ اس کا ڈیفالٹ ویلیو ہوگا۔سورس ہم رکھتے ہیں ڈائے سکس ڈاٹ جیف۔
اس کا سائز جو ہم نے پتا ہے وہ 252 بائے 252 ر کھا ہے جو آپ یاد ہو گا کہ ڈائے کا جو سائز اوریجنل سائنز تھا ڈآئی کا وہ تھا ون ٹونٹی سکس بائی ون ٹونٹی سکس۔ یعنی ہم نے حج کے سائز کو یعنی اس کی دونوں اور لمبائی اور چوڑائی کو دوگنا یعنی کے امیجز اس حدیث کو چار گنا کر دیا اس کے بعد ہم 6 امیج والے ٹیگ جو ہے وہ دکھائیں گے اس میں کیا ہے اس میں میں نے آپ کو پہلا اور آخری دکھایا ہے بیچ والے جو ہیں ان کا بھی فارمیٹ جو ہے وہ بالکل ایسے ہی ہوگا ۔ یہ ابھی میں نے آپ کو دکھایا ہے تو یہ جو پہلے والا ٹیگ ہے اس کو دیکھتے ہیں۔ اس میں میں کہہ رہا ہوں کہ جناب امیج کا ٹیگ شروع کریں سورس از ایکیویل ٹو ڈائے ون ڈاٹ جیف۔
اور اس کے بعد اس کی لمبائی اور چوڑائی جو ہے وہ ہم نے تھوڑی سی کم کر دی تھوڑی سی کم کر دیں آپ کو یاد ہو گا کہ اس کی لمبائی اور چوڑائی تھی وہ ایک سو اٹھائیس ضرب ایک سو اٹھائیس تھی اب یہاں پہ ایک دلچسپ چیز جو میسر ایمیجز کے ساتھ کیا ہے وہ یہ کہ ہم نے ایک ایونٹ ہینڈلر اس کے ساتھ ایڈ کیا ہے یہاں پہ ہم نے ماوس اور کا ایونٹ ہینڈلر ڈال دیا ہے اردو ہی وہ ایونٹ ہوتا ہے جاوا سکرپٹ کی ایک سٹیٹمنٹ جو ہم نے لکھی ہوئی ہے وہ فائر ہو جانی چاہیے ۔

اسٹیٹ میں کیا ہے اسٹیٹمنٹ یہ ہے کہ ڈاکیومنٹ ڈاٹ بگ ڈاٹ سورس یعنی یہ جو اوپر بڑا امیج ہے نا اس کا سورس جو ہے اس کو آپ نے تبدیل کر دینا ہے جوڑی ماوس اور ہوتا ہے تو یہ جو بہی مجہے اس کا سورس اس کو چینج کر دے گا اس کو ہم نے بنا دینا ہے ڈائے امیج ڈاٹ ون سورس تو اس کو میں دوبارہ آپ کو بتاتا ہوں کیا ہے اس میں ہم ڈائے ون ڈاٹ یعنی ایک ڈاٹ والی تصویر دکھا رہے ہیں اور جو ہیں اس پر ماؤس اور ہوتا ہے تو ہم کیا کرتے ہیں ڈاکیومنٹ ڈاٹ بگ ڈاٹ سورس جو ہے اس کا سورس تبدیل کر دیتے ہیں۔ وہی جو ہم نے پر ی لوڈ کیا ہوا ہے امیج اس میں جو پہلا امیج ہے جو ایک ڈاٹ والا ہے اس کو ہم اس کی جگہ پر شو کروا دیں گے ۔

تو جونہی اس امیج پر ماؤس اوور کا ایونٹ جو ہے وہ ٹریگر ہو جاتا ہے اور صرف ایک سٹیٹمنٹ ایگزیکیوٹ ہوتی ہے اور اسی طرح باقی تمام امیجز کے ساتھ بھی ہوتا ہے۔ دیکھئے عموماً جب بھی ہم ایونٹ ہینڈلنگ کرتے رہے ہیں ایچ ٹی ایم ایل پارٹ میں ہم کوشش کرتے رہے ہیں کہ اس میں فنکشن استعمال کرتے تھے یہاں ہم ایسا نہیں کر رہے اس کی وجہ یہ ہے کہ ایک لائن کے لئے فنکشن لکھنا کوئی اچھی بات نہیں ہے تو اس لئے اس مثال میں جب بھی وہ ایونٹ فائر ہوتا ہے اور اس کے بعد جب بھی وہ فائل ایگزیکیوٹ ہونا ہوتا ہے وہ ہم نے ایچ ٹی ایم ایل فائل کے اندر ہی ڈال دیا ہے ۔ ہم نے اس کو الگ فنکشن کے طور پر ڈیفائن نہیں کیا۔

تو جناب یہ تھی ایک مثال جس میں ہم نے ایک تھمب نیل ویور بنایا تھا اب یہ والی چیز جو ہے یہ آپ کو کئی ویب سائٹس پر خاص طور پر اگر آپ آٹوموبائل کسی پر پر چلے جائیں یعنی کہ اگر ایک نئی گاڑی آئی ہے اس کے چھوٹے چھوٹے امیجز رکھے ہوتے ہییں ان کے مختلف اینگلز سے اس کی تصویریں لے کر وہ دکھائی ہوگی کہ آگے سے کیسی ہے پیچھے سے کیسی ہے اوپر نیچے سائڈ سے کیسی ہے اور پھر ان امیجز پر جب آپ ہوور کرتے ہیں تو بڑا امیج آپ کو نظر آنا شروع ہو جاتا ہے۔

تو یہ ایک اچھا طریقہ ہے جس کے ذریعہ ہم مختلف امیجز کو ان کے تفصیل سے دکھا سکتے ہیں اور آپ کو زیادہ سورس پیج بھی استعمال کرنے نہیں پڑتے ۔ اگر آپ نے مٹھائی کی ایک دوکان بنانی ہے تو اس کے لیے بھی آپ اسے استعمال کر سکتے ہیں ۔ چھوٹی چھوٹی کتابیں ہوں جو اس کی پر جائیں وہ پوری کی پوری کتاب یا اس کا بڑا امیج صحیح نظر آنا شروع ہو جائے اور بھی جو ای کامرس کی ویب سائٹس ہیں ان پر بھی آپ کو یہ چیز نظر آئے گی۔
تو ابھی تک جو ہم نے باتیں یا مثالیں ہیں جو وہی ساری سٹیٹک امیج کے بارے میں یعنی جاوا اسکرپٹ کے ذریعے اسٹیٹ امیجز کو کیسے تبدیل یا مینو پلیٹ کیا جاتا ہے ۔ خاص اس طور پر کہ بعض کنڈیشنز کو دیکھتے ہوئے جو امیج ڈسپلے ہو رہا ہوتا ہے اس کو ہم چینج کس طرح کرتے ہیں ابھی تک کی مثالوں میں ہم نے یہی دیکھا ہے اب ہم تھوڑی سی بات کریں گے اینیمیشن کی

انیمیشن جو ہے وہ بھی ہے تو اسٹیٹک امیجز کے بارے میں ہی بس یہ ہے کہ اس میں ہم ان سٹیٹس امیجز کو بس تھوڑا سا جلدی جلدی تبدیل کرتے جاتے ہیں تو ایفیکٹ ہمیں ایسا ملتا ہے جیزے وہ چیزیں حرکت کر رہی ہیں تو اس تو اس مثال میں ہم یہی چیز کریں گے ہم 16 امیجز دیں گے اور ہم ان امیجز کو سائیکل تھرو کریں گے یعنی ایک کے بعد دوسرا دوسرے کے بعد تیسرا اور اس سے آپ دیکھیں گے کہ اینمیشن کا ایک افیکٹ کری ایٹ ہو جائے گا اور ایسا لگتا ہے کہ یہ ایک موونگ امیج ہے لیکن ایسا ہوتا نہیں ہے اصل میں یہ ایک صرف کمبینیشن ہوتا ہے مختلف سٹیٹگ امیجز کا لیکن ان کو تبدیل کیا جا رہا ہے اس لیے موومنٹ کا افیکٹ ملتا ہے۔

اس مثال میں ہم نے سولہ ایمیجز استعمال کئے ہیں وہ اس وقت آپ کو نظر آ رہے ہیں اس میں ہوا کیا ہے اس میں چار ڈاٹس ہیں وائٹ بیک گراؤنڈ ہے چار ڈاٹس جن کے مختلف کلر ہیں اور پھر ان چار ڈاٹس کو میں نے تھوڑا تھوڑا گما کے ان کے سولہ امیجز بنائے ہیں تو جب میں جاواسکرپٹ کے ذریعے ان کو استعمال کرتا ہوں آپ کو کچھ ایسی چیز نظر آتی ہے یعنی آپ کو لگتا ہے کہ یہ چارڈاٹس چوہے یہ موو کر رہے ہیں اب ہم دیکھتے ہیں کہ یہ موومنٹ ہم نے کیسے کی ۔ ہم اب اس کو سمجھنے کی کوشش کریں ۔

یعنی یہ جو ایک سٹیٹک امیج کے بعد دوسرا تیسرا اور پھر اسی طرح سارے امیجز یہ ہم نے کیسے کیا اس کا طریقہ بڑا سادہ ہے سب سے پہلے ایک ویب پیج کا جو سٹرکچر ہے بڑا سادہ ہوتا ہے سب سے پہلے اس سب سے پہلے ٹیگ سے شروع کرتے ہیں اس میں دو حصے ہوتے ہیں ایک جاوا سکرپٹ کا پورشن ہوتا ہے اور دوسرا ایچ ٹی ایم ایل کا پورشن ہوتا ہے ۔ سب سے پہلے ہم ایچ ٹی ایم ایل کے کوڈ کو دیکھیں گے ایچ ٹی ایم ایل کا کوڈ بہت ہی سادہ سا ہے ۔

سب سے پہلے سنٹر کے دو ٹیگ ہیں۔ یعنی یہ جو امیج ہم دکھانا چاہتے ہیں اسے ہم سکرین کے سنٹر میں دکھانا چاہتے ہیں تو اس کے لئے ہم سنٹر کے ٹیگ سے شروع کرتے ہیں اور سنٹر ٹیگ سے کلوز کر سکتے ہیں اس کا نام ہم نے جو رکھا ہوا ہے اس کو ہم سرکل کا نام دیا ہے یعنی بعد میں ہم اس میں کوئی تبدیلی کرنا چاہیں گے تو ہم یہ سرکل والا جو نام ہے جو آئی ڈنٹی فائر ہے اس کو اس کو استعمال کریں گے اور اس کے بعد ہم نے اس کا جو سورس دیا ہوا ہے اس کا نام ہے سرکل ون ڈاٹ جیف۔ یعنی جب یہ اینی میشن سٹارٹ ہوگی تو سب سے پہلے جو تصویر نظر آئے گی وہ سرکل ون ہو گی۔ اس کے بعد ہم نے ایک بڑا دلچسپ ایونٹ ہینڈلر رکھا ہوا ہے یہ ایونٹ ہینڈلر جو ہے وہ آن لوڈ پر لانچ ہوتا ہے جیسے میں پہلے بھی تذکرہ کیا تھا کہ امیج ٹیگ کے کئی ایونٹ ہیںڈلرز ہیں ان میں سے ایک آن لوڈ بھی ہے یعنی جونہی ایونٹ لوڈ ہو تو وہ ایونٹ فائر ہو جاتا ہے اس ایونٹ ہینڈلر میں ہم کمانڈ دے رہے ہیں کہ سیٹ ٹائم آؤٹ۔ یہ سیٹ ٹائم آؤٹ کا میتھڈ شاید ہم نے پہلے کبھی ڈسکس نہیں کیا لیکن یہ بھی جاوا سکرپٹ کا بلٹ ان میتھڈ ہے

یہ میتھڈ کرتا کیا ہے ؟ اس کے دو آرگیومنٹ ہوتے ہیں ، دوسرا آرگیومنٹ ایک نمبر ہوتا ہے یہاں جو دوسرا آرگیومنٹ آپ کو نظر آرہا ہے یہ ایک نمبر ہے یہ ملی سیکینڈز ہیں کہ یہاں جتنے بھی ملی سیکینڈز لکھے ہوئے ہیں اس کے بعد جو پہلے آرگیومنٹ میں جو بھی فنکشن لکھا ہوا ہے وہ ٹرگر ہو جائے گا ۔ تو سیٹ ٹائم آؤٹ کا میتھڈ تھوڑا سا انتظار کر کے ایک فنکشن کو لانچ کر دیتا ہے ۔
یعنی سیٹ ٹائم آؤٹ کا میتھڈ ایک ڈیلے سا ڈال دیتا ہے تھوڑے سے ڈیلے کے بعد اس فنکشن کو لانچ کر دیتا ہے یعنی گیپ ایک ویری ایبل کا نام ہے یہاں پر اس ڈیلے بھی ایک ویری ایبل اور اس کے بعد ایک فنکشن جس کو ہم لانچ کرنا چاہتے ہیں وہ ہے سرکولیٹ ۔ تو آئیے دیکھتے ہیں کہ ہم نے اس کو ڈیفائن کیسے کیا ہوا ہے

سرکولیٹ فنکشن کو لیکن اس سے پہلے جاوا سکرپٹ تھوڑا سا اور جو اس فنکشن کو ڈیفائن کرنے سےپہلے جو حصہ ہے اس کو ہم یہاں پر ڈسکس کریں گے ۔ سب سے پہلے تو ہم یہ جو گیپ ابھی میں ے جس ویری ایبل کا تذکرہ کیا تھا یہ میں نے ڈیفائن کیا ہے کہ گیپ از ایکوئیل ٹو ہنڈرڈ اور یہ گیپ جیسا کہ میں نے بتایا کہ اٹ از ان دا یونٹس آف ملی سیکنڈز یعنی وی آر ٹاکنگ اباؤٹ زیرو پوائنٹ ون سیکنڈ۔ دونوں امیجز کے بیچ میں گیپ ہو گا وہ ہو گا ون ٹینتھ آف اے سیکنڈ۔،
اس کے علاوہ ہم ایک نیا ویری ایبل جو ہے اس کو لانچ کر رہے ہیں امیج این یعنی امیج نمبر از ایکول ٹو ون یہ تھوڑی دیر میں جاکے یوز ہوگا پھر آپ کو شاید اندازہ ہو کہ ہم نے یہاں پہ اسے کیوں انیشیلائز کیا ہے اس کے بعد وہ جو چار پانچ لائنوں کا کوڈ ہے اس کا مقصد وہی ہے جو ہم پہلے کرتے ہیں یعنی ہم تو جو 16 امیجیز ہیں ان کو پری لوڈ کرنا چاہ رہے ہیں اس سے پہلے جو دو مثالیں ہم نے کی تھی میں ہم نے چھ چھ امیجز کو استعمال کیا تھا لیکن اب ہم سولہ امیجز کو استعمال کرنے جا رہے ہیں اور جس طریقے سے کر رہے ہیں یہ بالکل اسی طرح ہے جیسے ہم نے پہلی مثالوں میں کیا تھا ۔ اس کے بعد یہ جو ہم نے سرکولیٹ کا فنکشن ہے اس کو ڈیفائن کریں گے یاد رکھئے یہ سرکولیٹ کا فنکشن کب لانچ ہوتا ہے یا کب کال ہوتا ہے جب وہ گیپ سیکنڈز ہو جاتے ہیں یعنی جب ہم نے کیپکو ایز ہنڈریڈ ملی سیکنڈز ڈیفائن کیا ہے تو جاؤ اس کے پہلے جاوا سکرپٹ ہنڈریڈ ملی سیکنڈز ویٹ کریں گا اس کے بعد اس سرکولیٹ کے فنکشن کو لانچ کر دے گا۔

اس فنکشن کو دیکھتے ہیں اس میں ہوتا کیا ہے۔ اسمینٹ ڈاکیومنٹ ڈاٹ سرکل ڈاٹ یعنی وہ جوان میچ تھا ایچ ٹی ایم ایل پورشن میں جو ہم نے امیج سرکل کیا تھا تو اس کے سورس کو ہم یہاں پر تبدیل کر رہے ہیں اس کے سورس کو ہم سرکل امیج امیج نمبر ڈانٹ ایس آر سی یعنی ہم یہاں کر یہ رہے ہیں آپ دیکھیں کہ امیج این کی ویلیو ابھی ہم نے ڈیفائن کی تھی اس کی ویلیو ہم نے کیا ڈیفائن کی تھی ایز ون تو کیا ہو گا سب سے پہلے سے جب یہ سرکولیٹ کا فنکشن کال ہو گا تو سرکولیٹ کا جو فنکشن ہے اس میں کیا چلا جائے گا اس میں پہلا امیج چلا جائے۔ اس کے بعد امیج این یعنی امیج نمبر کو امپلمنٹ کرتے ہیں اور چیک کرتے ہیں کہ امیج نمبر ہے جو سولہ امیج ہیں انہیں چیک کرتے ہیں کہ کہیں یہ سولہ سے بڑھ تو نہیں گیا ہمارے ٹوٹل امیج تھے وہ سولہ ہیں اور ہم نے یہی کرنا ہے کہ پہلا دوسرا تیسرا چوتھا پانچواں چھٹا ساتواں آٹھواں اور اسی ترتیب سے سولہواں اور اس کے بعد دوبارہ پہلا تو اس طرح جونہی یہ امیج یعنی امیج کا نمبر جو ہے وہ سول سے بڑھ جاتا ہے تو سترہواں امیج تو ہمارے پاس ہے نہیں اس لئے ہم یہ چاہتے ہیں کہ ہمارا پہلا امیج ہی نظر آئے تو سرکولیٹ والا فنکشن یہی کرتا ہے یہ فنکشن یہ کرتا ہے کہ سب سے پہلے یہ جو ہم امیج جو ایچ ٹی ایم ایل پورشن میں ڈیفائن کیا تھا سرکل اس کا سورس چینج کرتا ہے اور اس کے بعد یہ جو امیج نمبر ہے اس کو امپلمنٹ کر دیتا ہے اور اگلی دفعہ یہ جب کال ہو گا تو یہ نئے والا امیج نمبر یوز ہو گا۔ یعنی پہلی دفعہ تو جو امیج یوز ہو گا وہ ہوگا ون پھر اگلی دفعہ کیوںکہ ہم نے یہ امپلمنٹ کر دیا ہے تو پھر اس سے اگلے والا نمبر یعنی ٹو امپلمںٹ ہو گا یہ امپلنٹ کرتے رہیں گے اور پھر جب سترہ پر پہنچیں گے تو یہ دوبارا ون ہو جائے گی ۔

تو اس کو ایک نظر دوبارہ دیکھ لیں ۔ ون سے سسٹین تک اور پھر ون اور ہمیں اس طرح لگتا ہے کہ یہ ڈاٹس جو ہیں یہ سرکل میں موو کر رہے ہیں۔ یہ طریقہ تھا ان کو انیمیٹ کرنے کا

تو جناب ایک اور طریقہ بھی ہے جس کے ذریعے سے ہم یہ کام کر سکتے ہیں۔ وہ ہے اینیمیٹڈ جیف ، جیف ایک طریقہ ہے جس کے ذریعے آپ سٹیٹک امیج دکھا سکتے ہیں یعنی ایک سٹوریج یا فائل فارمیٹ ہے اس کی ایک ایکسٹنشن بھی ہے اور وہ یہ کام کرتی ہے کہ اس کے ذریعے آپ ایک دو اس سے زیادہ امیج سٹور کر لیں اور جب آپ اس کو دکھائیں گے اپنے ویب پیج پر تو وہ اسی ترتیب سے آپ کو نظر آنا شروع ہو جائیں گے جس سے آپ نے انہیں سیو کیا تھا ۔ تو یہ کام جو ہم نے بھی کیا اس کو ہم اینیمیٹڈ جیف کے ذریعے بھی کر سکتے ہیں یعنی سولہ کے سولہ امیجز کو ہم ایک اینیمیٹڈ جس کے اندر اسٹور کر دیتے ہیں اور پھر امیج ٹیگ کے ذریعے اس اینیمیٹڈ جیف کو سورس کر دیتی ہے تو یہی جو بھی آپ کو چیز نظر آئی تھیں وہ آپ کو نظر آنی شروع ہو جاتی ہے یعنی یہ جو چیز ہم نے ابھی کی اس قوم جاوا سکرپٹ کے بغیر بھی کر سکتے ہیں لیکن جناب جاوا سکرپٹ جو ہے وہ ذرا بہتر کنٹرول آپ کو دیتی ہے مثال کے طور پر یہ جو امیجیز کے درمیان میں یہ ڈیلے ہے اس پہ آپ کو بہتر کنٹرول دیتی ہے اس کا جو سیکیوئنس یعنی پہلے کے بعد دوسرا تیسرا چوتھا پانچواں یہ تو ہم نے بھی یوز کی لیکن اس کا ہم کوئی اور مزید کوئی اور سیکیوئنس بھی استعمال کر سکتے تھے جاوا سکرپٹ میں اس کا پورا کنٹرول دیتی ہے ۔ چوہدری مثال ہے اس میں ہم آپ کو دکھاتے ہیں ایک ایسی چیز جو شاید آپ کا انیمیٹیڈ جیف کے ذریعے آپ نہیں کر سکتے ہم کریں گے وہی ہم انھیں سولہ امیجز کو روٹیٹ کریں گے ان کو ہم سائیکل تھرو کریں گے واقعہ میں ایک اینیمیشن کا ایفیکٹ ملے لیکن ہم دودھ میں بٹن ایڈ کر دیں گے ایک سلوڈاؤں کا بٹن اور ایک سپیڈ اپ کا بٹن ہم جب سلو ڈاؤن کے بٹن کو دبائیں گے تو یہ جو سرکل چل رہا ہے جس کی سپیڈ کم یا آہستہ آہستہ ہو جائے اور اگر اس کی سپیڈ آپ رہیں گے تو یہ تھوڑا تیز ہو جائے گا ۔

یہ ایسی چیز ہے جس کو آپ شاید اینیمیٹڈ جیف کے ذریعے نہ کر سکے وہ جو اس وقت آپ کو نظر ارہی ہے وہ ہے اینی میشن اور اس کے ساتھ وہ دو بٹن جن کا ابھی ہم نے تذکرہ کیا ہے۔ ان میں سے اگر آپ بائی والا بٹن دبائیں تو یہ جو روٹیشن ہے یہ آہستہ ہو جائے گی اور جو دائیں والا بٹن ہے اسے دبائیں تو یہ روٹیشن تیز ہو جائے گی۔ اور اگر اس پہ اگر آپ کلک پر کلک کرتے جائیں تو وہ تیز اور تیز سے تیز ہوتی چلی جائے گی اور اس کی ایک لیمیٹ ہے لیکن کئی دفعہ آپ اس کو دبا سکتے ہیں۔

اور یہ تیزی سے سرکل میں ڈاٹس روٹیٹ کرتے جائیں گے ۔ اب دیکھتے ہیں کہ یہ ہم نے کیا کیسے ہے تو اگین اس کوڈ کے دو سیگمنٹس ہونگے ۔ ایک جاوا سکرپٹ والا ہوگا ایک ایچ ٹی ایم ایل والا ہوگا سب سے پہلے ہم ایچ ٹی ایم این والے کوڈ کو دیکھ لیتے ہیں ایچ ٹی ایم ایل والا کوڈ جو ہے اس کا یہ جو اوپر والا حصہ ہے جو سینٹر اور سلیکشن سنٹر والی ٹیگ میں ہے یہ وہی ہے جو ہمیں پچھلی میں دیکھا تھا لیکن اس کے نیچے ہم نے ایک فارم ایڈ کر دیا ہے جس کے ذریعے یہ دو نئے بٹن آگئے ہیں ایک سلو ڈاؤن کا بٹن اور دوسرا سپیڈ آف کا بٹن جوہی سلو ڈاؤن کا بٹن دبایا جاتا ہے تو سلو ڈاؤن والا فنکشن جو ہے وہ کال ہو جاتا ہے اسی طرح جب سپیڈ اپ والا بٹن دبایا جاتا ہے تو سپیڈ اپ والا فنکشن کال ہو جاتا ہے ۔

تو آئیے اب دیکھتے ہیں جاوا سکرپٹ والا پورشن ابھی تک تو ہم جو ایچ ٹی ایم ایل والا پورشن دیکھ رہے تھے اب جوا سکرپٹ پورشن دیکھیں گے اس میں بھی تین سے آپ کو دکھائے جائیں گے ۔ پہلا حصہ جو ہے بالکل وہی ہے جو ہم پہلے کر چکے ہیں پچھلے مثال میں یہاں پر ہم امیجز کو پری لوڈ کر رہے ہیں دوسرا حصہ جو ہے وہ بھی بالکل ویسا ہی ہے جیسا کچھ دیر پہلے والی مثال میں تھا یعنی وہی سرکولیٹ کمیشن جو پہلے دیکھا تھا ہم یہاں پہ ری یوز کر رہے ہیں تیسرا حصہ جو ہے۔ اس میں ہم دو نئے فنکشن ایڈ کر رہے ہیں وہ ہیں سلو ڈاؤن والا فنکشن اور سپیڈ اپ والا فیشن ان دونوں فنکشنز کو اصل میں آپ دیکھ رہے ہیں کہ ہو کیا رہا ہے صرف ایک ویری ایبل ہے جس کو میں مینیو پولیٹ کیا جا رہا ہے سلو ڈاؤن میں ہم یہ کرتے ہیں گیپ کو بڑھادیتے ہیں جونہی بٹن دبایا جاتا ہے یہ فنکشن کال ہوتا ہے اس گیپ کو ہم بڑھا دیتے ہیں اور اس کو ہم 20 ، 20 ملی سیکنڈز اس کے حساب سے بڑھا دیتے ہیں اور جتنی دفعہ اس بٹن پر کلک کیا جائے گا اتنی ہی دفعہ بھی بیس بیس ملی سیکنڈ کے حساب سے گیپ مزید بڑھتا جائے گا اور سپیڈ اپ میں جو گیپ ہے ہم اسے کم کرتے چلے جاتے ہیں گیپ کے کم کرنے سے کیا ہوتا ہے اس سے یہ امیجز جو ہے وہ زیادہ جلدی جلدی لوڈ ہونا شروع ہو جاتے ہیں اور روٹیٹ کرنا شروع کر دیتے ہیں۔
تو اس کو آپ ایک نظر پھر سے دیکھ لیں جوانی میشن کری یاٹ کیا ہے وہ اس وقت آپ کے سامنے اور یہاں پہ ہم اس اینیمیشن کو بہتر کنٹرول حاصل ہے کچھ عرصہ پہلے ہم نے فلیش اینیمیشن کی بات کی تھی فلیش اینیمیشن ویب پیجز سے کافی زیادہ پاپولر ہے سے ایک طریقہ ہے جس کے ذریعے ٹو ڈی اینیمیشن جو ہے اس کو کسی ویب پیج پرڈسپلے کیا جا سکتا ہے یہ اینیمیشن کے لیے فارمیٹ بنا ہوا ہے لیکن بعض اس کے ذریعے آپ سٹیٹک امیجز کو بھی ڈسپلے کر سکتے ہیں ۔ پمپلیٹ امیج جس کو آپ کسی بھی براؤزر میں ڈسپلے کرنا چاہتے ہیں تو ضروری ہے کہ اس براؤزر میں ایک خاص پروگرام موجود ہو یعنی ایک ہیلپر اپلیکیشن موجود ہو جس کو پلگ ان کہا جاتا ہے اور وہ پلگ ان آج کل زیادہ تر براؤزرز میں پایا جاتا ہے تو یہ کوئی بڑا مسئلہ نہیں ہے۔

یہ جو فلیش ہے اس کے ذریعہ آپ ایک پوری کی پوری ویب سائٹ بنا سکتے ہیں۔ یعنی ایچ ٹی ایم ایل آپ مشکل سے یوز کریں گے ان کے بہت تھوڑا یوز کریں آپ سینکڑوں پی جس کی ویب سائٹ بنا سکتے ہیں جو پوری کی پوری فلیش کے اندر بنی ہوتی ہے لیکن مجھے فلیش اے بنی ہوئی ویب سائٹ بالکل پسند نہیں ہے اس کی وجہ یہ ہے کے فلیش کی جو ویب سائٹس ہوتی ہیں ان کو انڈیکس نہیں کیا جا سکتا اگر گوگل پر جا کے ایک فلیش کی مدد سے بنی ہوئی ہے ویب سائٹ ہے اس میں کوئی کی ْورڈ وغیرہ موجود ہیں مختلف جگہ پر تو ان کو سرچ کرنا ناممکن ہے دوسری بات یہ کہ فلیش کی جو فائلیں ہیں جس طرح انہیں اسٹور کیا جاتا ہے انہیں بائنری فارم سٹور کیا جاتا ہے اور یہ بائنری فارمیٹ میں تو نہیں پڑھ سکتا تو اس کا انٹرنیٹ پر جو میں نے چند ہفتے پہلے بھی آپ سے تذکرہ کیا تھا وہ میرے خیال میں پاس خاصا پاپولر ہو جائے گا وقت کے ساتھ ساتھ وہ ہے دا سٹرکچرڈ ویکٹر گرافکس فارمیٹ ایس وی جی۔ سواٹس اے ر پلیسمنٹ یا اس کو ایسا کہنا چاہیے کہ یہ کمپیٹیٹر ہے اور دا فلیش فارمیٹ یہ بھی لاگ ان کی ضرورت ہے فلیٹ میں بھی پلگ ان کی ضرورت ہے اور اس کے لیے بھی پلگ ان کی ضرورت ہے لیکن اس کی جو سٹوریج ہوتی ہے یا اس کی جو فائلز ہوتیں ہیں وہ ٹیکسٹ فارمیٹ میں ہوتی ہیں ۔ اور میں اتفاق سے ٹیکسٹ فارمز پڑھ سکتا ہوں اور دوسرا یہ کہ کیونکہ وہ ٹیکسٹ فارم میں ہیں اس لئے سرچ انجنز جو ہیں وہ اس کو بڑی آسانی سے سرچ کر سکتے ہیں ۔
اور اس طرح وہ کی ورڈز وغیرہ تلاش کر کے اس کی مدد سے انٹیکس کر سکتے ہیں۔ تو جناب آج ہم نے بات کی اینی میشن کی اور گرافکس اور ہم نے دیکھا کہ سادی سی اگر ہم نے گرافکس کسی ویب میں ڈالنی ہے اور تو اس کا کیا طریقہ ہے اس کا طریقہ بڑا سادہ سا ہے آپ امیج کا ٹیگ یوز کریں۔

میں جو چیزیں دلچسپ ان میں میرا خیال میں ہائیٹ اور وڈتھ یعنی لمبائی اور چوڑائی والی جو چیزیں ہیں وہ بڑی دلچسپ ہیں ان کے ذریعہ آپ امیجز کی لمبائی اور چوڑائی کو کم یا زیادہ کر سکتے ہیں اس کے علاوہ آپ امیج میں الائمنٹ کا اٹریبیوٹ جو ہے جس کے ذریعے سے آپ کسی امیج کو الائن کر سکتے ہیں اور سورس کا اٹریبیوٹ تو ہے ہی جس کے ذریعہ بتاتے ہیں کہ یہاں پر جو امیج اپنے ڈسپلے کرنا ہے اس کا فائل نیم اور سورس کیا ہے وہ پڑا کہاں پے ہے اور وہ کہاں سے اٹھانا ہے میں اس کا قائل نیم کیا ہے ۔ اور یہ کہ وہ فائل جو امیج فائل ہیں وہ لوکل بھی ہو سکتی ہے اور کسی اور ویب سرور پر بھی پڑی ہو سکتی ہے۔ جب تک وہ پیپر اویلیبل ہو گی اور آپ کو اس کے یو آر ایل کا پتہ ہوگا آپ اسے استعمال کرسکتے ہیں کوئی مسئلہ نہیں۔

اس کے بعد ہم نے دیکھا تھا کہ جاؤ جاوا سکرپٹ امیجز کے ساتھ کس طریقے سے ڈیل کرتی ہے اس کے لیے ہم نے یہ بتایا تھا کہ جاوا سکرپٹ میں ایک خاص بلٹ ان آبجیکٹ ہے جس کا نام امیج آبجیکٹ یہ امیج آبجیکٹ جو ہے اس کی مختلف پراپرٹیز ہیں۔ جو بہت فائدہ مند ہیں لیکن اس میں سے ہم نے آج صرف سورس پراپرٹی ہی دیکھی ۔ لیکن آپ اس کی باقی پراپرٹیز جو ہیں ان کو بھی دیکھیں گے۔

اس کے علاوہ اس میں کچھ ایونٹ ہینڈلرز بھی ہیں جن میں آن ابارٹ کا تذکرہ کیا تھا آنلوڈ کا تذکرہ کیا تھا اور آن ایرر کا تذکرہ کیا تھا ہم نے اس کے بعد یہ جو جاوا اسکرپٹ کا امیج آبجیکٹ ہے اس کے ذریعے تھوڑی سی امیج مینوپلیشن کرکے آپ کو دکھائی تھی ہم نے دکھایا کہ سب سے بڑا فائدہ جو آپ کے اس کے ذریعے آپ امیجز کو پری لوڈ کر سکتے ہیں پہلے سے نہیں منگوا کے اپنی کیش میں رکھ سکتے ہیں جوہی ویب پیج پر ضرورت ہو ان کو فورا ہی دکھایا جا سکے یہ بہت دلچسپ افیکٹ ہے کہ اس کی مدد سے آپ بڑی اچھی اور سموتھ اینیمیشنز کر کے دکھا سکتے ہیں اور بڑی دلچسپ میں امیج مینیوپولیشن کر سکتے ہیں ۔

اس کے بعد ہم نے یہی دیکھا کہ زکام بڑا آسان ہے پری فیچ کریں اور اس کے بعد جہاں پر آپ نے ایک اپنے پیج پر یہ امیج دکھانا ہے اس کی سورس پراپرٹی کو چینج کردے اس سورس سے جو آپ نے جو اپنے پری لوڈ کردیا ہے تو فوراً وہ امیج آپ کو تم پہ نظر آنا شروع ہو جائے گا ہم نے آپ کو کچھ اینیمیشن بھی کر کے دیکھ آئے تھے اور اس اینیمیشن میں کوئی جادو نہیں ہے اپنے کرنا یہی ہے کہ کچھ امیجیز لینے ہیں اور ان کے جوس سائیکل کرنا ہے آپ نے پلے پہلا پھر دوسرا پھر تیسرا اور اسی طرح سپیڈ کو صحیح طرح مینیج کر لیں تو ایسا لگے گا کہ جیسے کوئی مووی آپ کے سامنے چل رہی ہے تو یہ طریقہ جس کے ذریعے آپ اینیمیشن اس کو چلا کر دکھا سکتے ہیں لیکن اس کے علاوہ اور بھی کئی طریقے ہیں اس کے علاوہ بے انٹرسٹنگ فارمیٹس بنے ہوئے ہیں مثلا ایک فلیش کا فارمیٹ ہے ایک ایس وی جی کا فارمیٹ ہے جس کے ذریعہ ذرا بہتر انیمیشن دکھائے جا سکتے ہیں یہ جو ابھی میں نے آپ کو دکھایا یہ تو بہت کروڈ سا طریقہ تھا اینی میشن بنانے کا لیکن اور ایس وی جی فارمیٹ جو ہیں آپریشن جو ہے وہ ذرا خاصی بہتر کوالٹی کی دکھائی جا سکتی ہے

یہ تھی جناب بات آج کی نیکسٹ ٹائم جو ہمارا بیک ٹیبلٹ منٹ کا آخری لیکچر ہوگا شاید اس میں ہم بات کریں گے پروگرامنگ لینگویجز کی اور اس میں یہ کہ ہم یہ بات انڈرسٹینڈ کرنا چاہتے ہیں کہ ہم نے ایفیکٹیو پروگرام لکھنے ہیں لیکن ہم نے لکھنے اس طرح ہیں کے زیادہ نہ لگے ہمارے پروگرام جیسے ہو کہ جو صحیح ہوں اور وہ کرتے وہی ہوں جو ہم ان سے کروانا چاہتے ہوں لیکن انہیں کم سے کم وقت میں بنانا چاہتے ہیں ۔اس کا طریقہ بڑا سادہ سا ہے کہ ہمیں ایسی ٹیکنیک سوچنا پڑے گی جس سے ہمارا جو ٹائم ضائع ہوتا ہے وہ کم سے کم ہو تو جناب ایک تو ہم یہ دیکھیں گے دوسرا ہم یہ دیکھیں گے کہ ایک پروگرام جو آپ بنا رہے ہیں اس میں ظاہر ہے بعض اوقات بگز وغیرہ تو آجاتے ہیں تو اس کے لیے ہمیں کوئی ایسی ڈی بگنگ ٹیکنیکس سوچنی ہیں ان میں سے کچھ سادی سی ٹی بیگ ٹیکنیکس آپ کو بتائیں گے تو جناب اگلے الیکشن تک اپنا خیال رکھیے گا خدا حافظ

Leave a Comment