ওয়েব অ্যাপ্লিকেশানগুলি বিকশিত হওয়ার সাথে সাথে, আপনি ব্যবহারকারীদের ডেস্কটপ থেকে ফাইলগুলিকে সম্পাদনা, আপলোড, ভাগ করা ইত্যাদির জন্য ব্রাউজারে টেনে আনতে এবং ফেলে দিতে পারেন৷ ভাগ্যক্রমে, Chrome 21 দিয়ে শুরু করে, এই সমস্যাটির সমাধান করা হবে (ইতিমধ্যেই Chrome dev চ্যানেলে উপলব্ধ)।
ড্র্যাগ এবং ড্রপ সহ একাধিক ফাইল পাস করা
চলুন বিদ্যমান ড্র্যাগ এবং ড্রপের একটি কোড নমুনা দেখি।
<div id="dropzone"></div>
var dropzone = document.getElementById('dropzone');
dropzone.ondrop = function(e) {
var length = e.dataTransfer.files.length;
for (var i = 0; i < length; i++) {
var file = e.dataTransfer.files[i];
... // do whatever you want
}
};
এই উদাহরণে, আপনি আসলে ডেস্কটপ থেকে আপনার ব্রাউজারে একটি ফাইল বা ফাইল টেনে আনতে পারেন, কিন্তু আপনি যখন একটি ফোল্ডার পাস করার চেষ্টা করেন, লক্ষ্য করুন যে এটি প্রত্যাখ্যান করা হবে বা একটি File অবজেক্ট হিসাবে বিবেচিত হবে যার ফলে একটি ব্যর্থতা হবে৷
বাদ দেওয়া ফোল্ডারগুলি কীভাবে পরিচালনা করবেন
Chrome 21 আপনাকে ব্রাউজার উইন্ডোতে একটি ফোল্ডার বা একাধিক ফোল্ডার ড্রপ করার অনুমতি দেয়। এগুলি পরিচালনা করার জন্য, আপনাকে ড্রপ করা বস্তুগুলি পরিচালনা করার উপায় পরিবর্তন করতে হবে।
<div id="dropzone"></div>
var dropzone = document.getElementById('dropzone');
dropzone.ondrop = function(e) {
var length = e.dataTransfer.items.length;
for (var i = 0; i < length; i++) {
var entry = e.dataTransfer.items[i].webkitGetAsEntry();
if (entry.isFile) {
... // do whatever you want
} else if (entry.isDirectory) {
... // do whatever you want
}
}
};
লক্ষ্য করুন যে এখানে একটি বড় পার্থক্য হল যে আপনি getAsEntry ( webkitGetAsEntry ) নামক নতুন ফাংশন ব্যবহার করে একটি বাদ দেওয়া বস্তুকে Entry ( FileEntry বা DirectoryEntry ) হিসাবে বিবেচনা করতে পারেন। Entry অবজেক্টে অ্যাক্সেস পাওয়ার পরে, আপনি স্ট্যান্ডার্ড ফাইল হ্যান্ডলিং পদ্ধতিগুলি ব্যবহার করতে পারেন যা ফাইলসিস্টেম এপিআই স্পেসিফিকেশনে প্রবর্তিত হয়েছিল। উদাহরণস্বরূপ, এই উদাহরণটি দেখায় কিভাবে আপনি .isFile (বা .isDirectory ) ক্ষেত্র পরীক্ষা করে একটি ড্রপ করা বস্তু একটি ফাইল বা একটি ডিরেক্টরি কিনা তা সনাক্ত করতে পারেন।
ফাইলসিস্টেম এপিআই সম্পর্কিত আরও তথ্যের জন্য, নতুন ড্র্যাগ এবং ড্রপ ক্ষমতা সম্পর্কিত ফাইলসিস্টেম এপিআই এক্সপ্লোরিং পড়ুন, এই ডকুমেন্টটি পড়ুন। অবশ্যই, এই বৈশিষ্ট্যগুলি উন্মুক্ত মান বা শীঘ্রই একটি হয়ে যাওয়ার জন্য অপেক্ষা করছে৷