আপনার পছন্দের ভাষায় কন্টেন্ট অনুবাদ করতে Google তার AI প্রযুক্তি ব্যবহার করে। AI-এর মাধ্যমে করা অনুবাদে ভুল থাকতে পারে।

Gamepad API-এর মাধ্যমে বাধা অতিক্রম করা

Marcin Wichary

ভূমিকা

যারা নতুন, তারা অ্যাডভেঞ্চার গেমের জন্য কীবোর্ড, ফল কাটার জন্য তাদের মূল্যবান মাল্টি-টাচি-ফিলি আঙুলের ডগা এবং মাইকেল জ্যাকসনের মতো নাচতে পারে এমন ভান করার জন্য তাদের অভিনব নতুন মোশন সেন্সর ব্যবহার করতে দিন। (নিউজফ্ল্যাশ: তারা পারবে না।) কিন্তু আপনি আলাদা। আপনি আরও ভালো। আপনি একজন পেশাদার। আপনার জন্য, গেমপ্যাড হাতে নিয়ে গেম শুরু ও শেষ হয়।

কিন্তু দাঁড়ান। আপনার ওয়েব অ্যাপে গেমপ্যাড সাপোর্ট করতে চাইলে, আপনি কি দুর্ভাগ্যজনক পরিস্থিতিতে পড়বেন না? আর নয়। একদম নতুন Gamepad API আপনাকে সাহায্য করবে, এটি আপনাকে কম্পিউটারের সাথে অ্যাটাচ করা যেকোনও গেমপ্যাড কন্ট্রোলারের স্ট্যাটাস পড়তে JavaScript ব্যবহার করার অনুমতি দেয়। এটি এতটাই নতুন যে গত সপ্তাহে Chrome 21-এ এটি প্রথমবার ব্যবহার করা হয়েছে – এবং Firefox-এও এটি শীঘ্রই কাজ করবে (বর্তমানে বিশেষ বিল্ডে উপলভ্য)।

এটি খুব ভালো সময়ে করা হয়েছিল, কারণ আমরা সম্প্রতি Hurdles 2012 Google ডুডল-এ এটি ব্যবহার করার সুযোগ পেয়েছি। এই নিবন্ধে আমরা সংক্ষেপে ব্যাখ্যা করব যে কীভাবে আমরা ডুডলে গেমপ্যাড API যোগ করেছি এবং এই প্রসেস চলাকালীন আমরা কী শিখেছি।

হার্ডেলস ২০১২ Google ডুডল — Hurdles 2012 Google ডুডল

গেমপ্যাড টেস্টার

ইন্টার‍্যাক্টিভ ডুডলগুলি ক্ষণস্থায়ী হলেও, ব্যাকগ্রাউন্ডে সেগুলি বেশ জটিল হয়। আমরা কী নিয়ে কথা বলছি তা যাতে আরও সহজে দেখানো যায়, তার জন্য আমরা ডুডল থেকে গেমপ্যাড কোড নিয়েছি এবং একটি সাধারণ গেমপ্যাড টেস্টার তৈরি করেছি। আপনার USB গেমপ্যাড সঠিকভাবে কাজ করছে কিনা তা দেখতে আপনি এটি ব্যবহার করতে পারেন – এবং এটি কীভাবে করা হয়েছে তা পরীক্ষা করার জন্য হুডের নিচেও দেখতে পারেন।

বর্তমানে কোন কোন ব্রাউজারে এটি কাজ করে?

Browser Support

Source

কোন কোন গেমপ্যাড ব্যবহার করা যাবে?

সাধারণত, আপনার সিস্টেমে নেটিভভাবে কাজ করে এমন যেকোনও আধুনিক গেমপ্যাড কাজ করবে। আমরা বিভিন্ন গেমপ্যাড পরীক্ষা করেছি, যেমন পিসি (PC)-তে অফ-ব্র্যান্ড USB কন্ট্রোলার, ডঙ্গলের মাধ্যমে Mac-এ কানেক্ট করা PlayStation 2 গেমপ্যাড এবং Chrome OS নোটবুকের সাথে পেয়ার করা ব্লুটুথ কন্ট্রোলার।

আমাদের ডুডল পরীক্ষা করার জন্য আমরা যে কন্ট্রোলার ব্যবহার করেছি, এটি তারই একটি ফটো – "হ্যাঁ, মা, আমি সত্যিই অফিসে এই কাজই করি।" আপনার কন্ট্রোলার কাজ না করলে বা কন্ট্রোল ভুলভাবে ম্যাপ করা হলে, Chrome বা Firefox-এর বিরুদ্ধে বাগ ফাইল করুন। (এটি আগে থেকেই ঠিক করা আছে কিনা তা নিশ্চিত করতে প্রতিটি ব্রাউজারের একেবারে নতুন ভার্সনে পরীক্ষা করুন।)

Gamepad API শনাক্ত করার ফিচার<

Chrome-এ:

var gamepadSupportAvailable = !!navigator.webkitGetGamepads || !!navigator.webkitGamepads;

Firefox-এ এটি শনাক্ত করা এখনও সম্ভব বলে মনে হচ্ছে না – সবকিছুই ইভেন্ট-ভিত্তিক এবং সমস্ত ইভেন্ট হ্যান্ডলারকে উইন্ডোর সাথে অ্যাটাচ করতে হবে, যা ইভেন্ট হ্যান্ডলার শনাক্ত করার একটি সাধারণ কৌশলকে কাজ করা থেকে বিরত রাখে।

তবে আমরা নিশ্চিত যে এটি সাময়িক। অসাধারণ Modernizr আপনাকে আগে থেকেই Gamepad API সম্পর্কে জানায়, তাই আপনার বর্তমান ও ভবিষ্যতের শনাক্তকরণ সংক্রান্ত সব প্রয়োজনের জন্য আমরা এটি সাজেস্ট করি:

var gamepadSupportAvailable = Modernizr.gamepads;

কানেক্ট করা গেমপ্যাড সম্পর্কে জানা

আপনি গেমপ্যাড কানেক্ট করলেও, ব্যবহারকারী প্রথমে এর কোনও বোতাম না প্রেস করা পর্যন্ত এটি কোনওভাবেই নিজেকে প্রকাশ করবে না। এটি ফিঙ্গারপ্রিন্টিং প্রতিরোধ করার জন্য করা হয়, যদিও ব্যবহারকারীর অভিজ্ঞতার ক্ষেত্রে এটি কিছুটা চ্যালেঞ্জিং বলে প্রমাণিত হয়: আপনি ব্যবহারকারীকে বোতাম টিপতে বা গেমপ্যাড-নির্দিষ্ট নির্দেশাবলী প্রদান করতে বলতে পারবেন না কারণ আপনি জানেন না যে তারা তাদের কন্ট্রোলার কানেক্ট করেছেন কিনা।

তবে, আপনি একবার সেই বাধা অতিক্রম করলে (দুঃখিত…), আরও অপেক্ষা করতে হবে।

ভোটগ্রহণ

API-এর Chrome ইমপ্লিমেন্টেশন একটি ফাংশন – navigator.webkitGetGamepads() – প্রকাশ করে যা আপনি বর্তমানে সিস্টেমে প্লাগ-ইন করা সমস্ত গেমপ্যাডের তালিকা এবং তাদের বর্তমান অবস্থা (বোতাম + স্টিক) পেতে ব্যবহার করতে পারেন। প্রথম কানেক্ট করা গেমপ্যাড অ্যারের প্রথম এন্ট্রি হিসেবে ফেরত দেওয়া হবে এবং এইভাবে চলতে থাকবে।

(এই ফাংশন কলটি সম্প্রতি একটি অ্যারে প্রতিস্থাপন করেছে যা আপনি সরাসরি অ্যাক্সেস করতে পারবেন – navigator.webkitGamepads[]। আগস্ট ২০১২-এর শুরু থেকে, Chrome 21-এ এই অ্যারে অ্যাক্সেস করা এখনও প্রয়োজন, যখন ফাংশন কল Chrome 22 এবং নতুন ভার্সনে কাজ করে। ভবিষ্যতে, API ব্যবহার করার জন্য ফাংশন কল হল সাজেস্ট করা পদ্ধতি এবং এটি ধীরে ধীরে সব ইনস্টল করা Chrome ব্রাউজারে চালু করা হবে।)

স্পেসিফিকেশনের এখনও পর্যন্ত প্রয়োগ করা অংশ অনুযায়ী, কোনও কিছু পরিবর্তন হলে ইভেন্ট ট্রিগার করার পরিবর্তে আপনাকে কানেক্ট করা গেমপ্যাডের স্ট্যাটাস ক্রমাগত চেক করতে হবে (এবং প্রয়োজন হলে আগের স্ট্যাটাসের সাথে তুলনা করতে হবে)। সবচেয়ে দক্ষ ও ব্যাটারি-বান্ধব উপায়ে পোলিং সেট-আপ করতে আমরা requestAnimationFrame()-এর উপর নির্ভর করেছি। আমাদের ডুডলের জন্য, যদিও অ্যানিমেশন সাপোর্ট করার জন্য আমাদের কাছে আগে থেকেই একটি requestAnimationFrame() লুপ আছে, আমরা সম্পূর্ণ আলাদা একটি দ্বিতীয় লুপ তৈরি করেছি – এটি কোড করা সহজ ছিল এবং কোনওভাবেই পারফর্ম্যান্সকে প্রভাবিত করবে না।

টেস্টারের থেকে পাওয়া কোড এখানে দেওয়া হল:

/**
 * Starts a polling loop to check for gamepad state.
 */
startPolling: function() {
    // Don't accidentally start a second loop, man.
    if (!gamepadSupport.ticking) {
    gamepadSupport.ticking = true;
    gamepadSupport.tick();
    }
},

/**
 * Stops a polling loop by setting a flag which will prevent the next
 * requestAnimationFrame() from being scheduled.
 */
stopPolling: function() {
    gamepadSupport.ticking = false;
},

/**
 * A function called with each requestAnimationFrame(). Polls the gamepad
 * status and schedules another poll.
 */
tick: function() {
    gamepadSupport.pollStatus();
    gamepadSupport.scheduleNextTick();
},

scheduleNextTick: function() {
    // Only schedule the next frame if we haven't decided to stop via
    // stopPolling() before.
    if (gamepadSupport.ticking) {
    if (window.requestAnimationFrame) {
        window.requestAnimationFrame(gamepadSupport.tick);
    } else if (window.mozRequestAnimationFrame) {
        window.mozRequestAnimationFrame(gamepadSupport.tick);
    } else if (window.webkitRequestAnimationFrame) {
        window.webkitRequestAnimationFrame(gamepadSupport.tick);
    }
    // Note lack of setTimeout since all the browsers that support
    // Gamepad API are already supporting requestAnimationFrame().
    }
},

/**
 * Checks for the gamepad status. Monitors the necessary data and notices
 * the differences from previous state (buttons for Chrome/Firefox,
 * new connects/disconnects for Chrome). If differences are noticed, asks
 * to update the display accordingly. Should run as close to 60 frames per
 * second as possible.
 */
pollStatus: function() {
    // (Code goes here.)
},

আপনি যদি শুধুমাত্র একটি গেমপ্যাড নিয়ে চিন্তিত হন, তাহলে তার ডেটা পাওয়া হয়ত এতটাই সহজ হতে পারে:

var gamepad = navigator.webkitGetGamepads && navigator.webkitGetGamepads()[0];

আপনি যদি আরও একটু স্মার্ট হতে চান বা একসাথে একাধিক প্লেয়ারকে সাপোর্ট করতে চান, তাহলে আপনাকে আরও জটিল পরিস্থিতিতে (দুটি বা তার বেশি গেমপ্যাড কানেক্ট করা, তাদের মধ্যে কিছু মাঝপথে ডিসকানেক্ট হয়ে যাওয়া ইত্যাদি) প্রতিক্রিয়া জানাতে আরও কয়েকটি লাইন কোড যোগ করতে হবে। এটি কীভাবে সমাধান করা যায় তার একটি উপায় হিসেবে, আপনি আমাদের টেস্টার, ফাংশন pollGamepads()-এর সোর্স কোড দেখতে পারেন।

ইভেন্ট

Firefox একটি বিকল্প, আরও ভালো পদ্ধতি ব্যবহার করে যা Gamepad API স্পেসিফিকেশনে বর্ণনা করা হয়েছে। আপনাকে পোল করতে বলার পরিবর্তে, এটি দুটি ইভেন্ট দেখায় – MozGamepadConnected এবং MozGamepadDisconnected – যা গেমপ্যাড প্লাগ-ইন (বা, আরও নির্দিষ্টভাবে, প্লাগ-ইন করা এবং এর যেকোনও বোতাম টিপে "ঘোষণা" করা) বা আনপ্লাগ করা হলে ট্রিগার হয়। গেমপ্যাড অবজেক্ট যা তার ভবিষ্যতের অবস্থা প্রতিফলিত করা চালিয়ে যাবে তা ইভেন্ট অবজেক্টের .gamepad প্যারামিটার হিসাবে পাস করা হয়।

টেস্টার সোর্স কোড থেকে:

/**
 * React to the gamepad being connected. Today, this will only be executed
 * on Firefox.
 */
onGamepadConnect: function(event) {
    // Add the new gamepad on the list of gamepads to look after.
    gamepadSupport.gamepads.push(event.gamepad);

    // Start the polling loop to monitor button changes.
    gamepadSupport.startPolling();

    // Ask the tester to update the screen to show more gamepads.
    tester.updateGamepads(gamepadSupport.gamepads);
},

সারাংশ

শেষে, টেস্টারে আমাদের ইনিশিয়ালাইজেশন ফাংশন, যা দুটি পদ্ধতিকেই সমর্থন করে, তা দেখতে এইরকম:

/**
 * Initialize support for Gamepad API.
 */
init: function() {
    // As of writing, it seems impossible to detect Gamepad API support
    // in Firefox, hence we need to hardcode it in the third clause.
    // (The preceding two clauses are for Chrome.)
    var gamepadSupportAvailable = !!navigator.webkitGetGamepads ||
        !!navigator.webkitGamepads ||
        (navigator.userAgent.indexOf('Firefox/') != -1);

    if (!gamepadSupportAvailable) {
    // It doesn't seem Gamepad API is available – show a message telling
    // the visitor about it.
    tester.showNotSupported();
    } else {
    // Firefox supports the connect/disconnect event, so we attach event
    // handlers to those.
    window.addEventListener('MozGamepadConnected',
                            gamepadSupport.onGamepadConnect, false);
    window.addEventListener('MozGamepadDisconnected',
                            gamepadSupport.onGamepadDisconnect, false);

    // Since Chrome only supports polling, we initiate polling loop straight
    // away. For Firefox, we will only do it if we get a connect event.
    if (!!navigator.webkitGamepads || !!navigator.webkitGetGamepads) {
        gamepadSupport.startPolling();
    }
    }
},

গেমপ্যাড সংক্রান্ত তথ্য

সিস্টেমের সাথে কানেক্ট করা প্রতিটি গেমপ্যাডকে এমন একটি অবজেক্টের মাধ্যমে দেখানো হবে যা দেখতে অনেকটা এইরকম:

id: "PLAYSTATION(R)3 Controller (STANDARD GAMEPAD Vendor: 054c Product: 0268)"
index: 1
timestamp: 18395424738498
buttons: Array[8]
    0: 0
    1: 0
    2: 1
    3: 0
    4: 0
    5: 0
    6: 0.03291
    7: 0
axes: Array[4]
    0: -0.01176
    1: 0.01961
    2: -0.00392
    3: -0.01176

প্রাথমিক তথ্য

উপরের কয়েকটি ফিল্ড হল সাধারণ মেটাডেটা:

id: গেমপ্যাডের টেক্সট বিবরণ
index: একটি কম্পিউটারের সাথে অ্যাটাচ করা বিভিন্ন গেমপ্যাড আলাদা করে বোঝানোর জন্য একটি পূর্ণসংখ্যা
timestamp: বোতাম/অ্যাক্সেস স্ট্যাটাসের শেষ আপডেটের টাইমস্ট্যাম্প (বর্তমানে শুধুমাত্র Chrome-এ কাজ করে)

বোতাম ও স্টিক

আজকের গেমপ্যাডগুলি ঠিক তেমন নয় যা আপনার ঠাকুরদা ভুল দুর্গে রাজকন্যাকে বাঁচানোর জন্য ব্যবহার করেছিলেন – সাধারণত এগুলিতে দুটি অ্যানালগ স্টিক ছাড়াও কমপক্ষে ষোলটি আলাদা বোতাম (কিছু ডিসক্রিট, কিছু অ্যানালগ) থাকে। অপারেটিং সিস্টেমের মাধ্যমে রিপোর্ট করা সব বোতাম ও অ্যানালগ স্টিক সম্পর্কে Gamepad API আপনাকে জানাবে।

গেমপ্যাড অবজেক্টে বর্তমান স্ট্যাটাস পেয়ে গেলে, আপনি .buttons[]-এর মাধ্যমে বোতাম এবং .axes[] অ্যারের মাধ্যমে স্টিক অ্যাক্সেস করতে পারবেন। এগুলি কীসের সাথে সম্পর্কিত তার একটি ভিজ্যুয়াল সারাংশ এখানে দেওয়া হল:

স্পেক ব্রাউজারকে প্রথম ষোলটি বোতাম এবং চারটি অক্ষকে ম্যাপ করতে বলে:

gamepad.BUTTONS = {
    FACE_1: 0, // Face (main) buttons
    FACE_2: 1,
    FACE_3: 2,
    FACE_4: 3,
    LEFT_SHOULDER: 4, // Top shoulder buttons
    RIGHT_SHOULDER: 5,
    LEFT_SHOULDER_BOTTOM: 6, // Bottom shoulder buttons
    RIGHT_SHOULDER_BOTTOM: 7,
    SELECT: 8,
    START: 9,
    LEFT_ANALOGUE_STICK: 10, // Analogue sticks (if depressible)
    RIGHT_ANALOGUE_STICK: 11,
    PAD_TOP: 12, // Directional (discrete) pad
    PAD_BOTTOM: 13,
    PAD_LEFT: 14,
    PAD_RIGHT: 15
};

gamepad.AXES = {
    LEFT_ANALOGUE_HOR: 0,
    LEFT_ANALOGUE_VERT: 1,
    RIGHT_ANALOGUE_HOR: 2,
    RIGHT_ANALOGUE_VERT: 3
};

অতিরিক্ত বোতাম ও অক্ষ উপরেরগুলির সাথে যোগ করা হবে। মনে রাখবেন, ১৬টি বোতাম বা ৪টি অ্যাক্সিস থাকবেই এমন কোনও গ্যারেন্টি নেই – এর মধ্যে কিছু সংজ্ঞায়িত নাও থাকতে পারে।

বোতামের ভ্যালু ০.০ (প্রেস করা হয়নি) থেকে ১.০ (সম্পূর্ণ প্রেস করা হয়েছে) পর্যন্ত হতে পারে। অ্যাক্সিস -১.০ (সম্পূর্ণ বাঁদিকে বা উপরে) থেকে ০.০ (মাঝখানে) হয়ে ১.০ (সম্পূর্ণ ডানদিকে বা নিচে) পর্যন্ত যায়।

অ্যানালগ নাকি ডিসক্রিট?

আপাতদৃষ্টিতে, প্রতিটি বোতাম অ্যানালগ হতে পারে – এটি শোল্ডার বোতামের ক্ষেত্রে কিছুটা সাধারণ, উদাহরণস্বরূপ। তাই, ১.০০-এর সাথে সরাসরি তুলনা করার পরিবর্তে থ্রেশহোল্ড সেট করা সবচেয়ে ভাল (অ্যানালগ বোতামটি সামান্য নোংরা হলে কী হবে? এটি কখনও ১.০০-এ নাও পৌঁছাতে পারে)। আমাদের ডুডলে আমরা এটি এইভাবে করি:

gamepad.ANALOGUE_BUTTON_THRESHOLD = .5;

gamepad.buttonPressed_ = function(pad, buttonId) {
    return pad.buttons[buttonId] &&
            (pad.buttons[buttonId] > gamepad.ANALOGUE_BUTTON_THRESHOLD);
};

অ্যানালগ স্টিককে ডিজিটাল জয়স্টিকে পরিবর্তন করতেও আপনি একই কাজ করতে পারেন। অবশ্যই, ডিজিটাল প্যাড (ডি-প্যাড) সবসময়ই থাকে, তবে আপনার গেমপ্যাডে নাও থাকতে পারে। এটি ম্যানেজ করার জন্য আমাদের কোড এখানে দেওয়া হল:

gamepad.AXIS_THRESHOLD = .75;

gamepad.stickMoved_ = function(pad, axisId, negativeDirection) {
    if (typeof pad.axes[axisId] == 'undefined') {
    return false;
    } else if (negativeDirection) {
    return pad.axes[axisId] < -gamepad.AXIS_THRESHOLD;
    } else {
    return pad.axes[axisId] > gamepad.AXIS_THRESHOLD;
    }
};

বোতাম প্রেস করা ও স্টিক মুভমেন্ট

ইভেন্ট

কিছু ক্ষেত্রে, যেমন ফ্লাইট সিমুলেটর গেম, ক্রমাগত চেক করা এবং স্টিক পজিশন বা বোতাম প্রেসের প্রতিক্রিয়া জানানো আরও বেশি অর্থপূর্ণ… কিন্তু Hurdles 2012 ডুডলের মতো জিনিসের জন্য? আপনি ভাবতে পারেন: প্রতিটি ফ্রেমে বোতাম আছে কিনা তা আমাকে কেন চেক করতে হবে? কীবোর্ড বা মাউস আপ/ডাউনের মতো ইভেন্ট আমি কেন পাচ্ছি না?

সুখবর হল, আপনি তা করতে পারবেন। খারাপ খবর হল – ভবিষ্যতে। এটি স্পেসিফিকেশনে আছে, কিন্তু এখনও কোনও ব্রাউজারে প্রয়োগ করা হয়নি।

ভোটগ্রহণ

এর মধ্যে, আপনার কাছে একমাত্র উপায় হল বর্তমান ও আগের অবস্থা তুলনা করা এবং কোনও পার্থক্য দেখতে পেলে ফাংশন কল করা। যেমন:

if (buttonPressed(pad, 0) != buttonPressed(oldPad, 0)) {
    buttonEvent(0, buttonPressed(pad, 0) ? 'down' : 'up');
}

মনে রাখবেন: বর্তমান এবং আগে পোল করা গেমপ্যাড ডেটার টাইমস্ট্যাম্প (টাইমস্ট্যাম্প ফিল্ড) তুলনা করুন। যদি সেগুলি সংজ্ঞায়িত করা হয় (Firefox এখনও এটি সমর্থন করে না) এবং অভিন্ন হয়, তাহলে এর অর্থ হল আপনি শেষবার যখন এটি দেখেছিলেন তখন থেকে স্ট্যাটাস পরিবর্তন হয়নি এবং আর কোনও কাজ করার প্রয়োজন নেই। টেস্টার সোর্স কোড থেকে:

for (var i in gamepadSupport.gamepads) {
    var gamepad = gamepadSupport.gamepads[i];

    // Don't do anything if the current timestamp is the same as previous
    // one, which means that the state of the gamepad hasn't changed.
    // This is only supported by Chrome right now, so the first check
    // makes sure we're not doing anything if the timestamps are empty
    // or undefined.
    if (gamepadSupport.prevTimestamps[i] &&
        (gamepad.timestamp == gamepadSupport.prevTimestamps[i])) {
    continue;
    }
    gamepadSupport.prevTimestamps[i] = gamepad.timestamp;

    gamepadSupport.updateDisplay(i);
}

Hurdles 2012 ডুডলে কীবোর্ড-ফার্স্ট অ্যাপ্রোচ

গেমপ্যাড ছাড়া, আজকের ডুডলের জন্য পছন্দের ইনপুট পদ্ধতি হল কীবোর্ড, তাই আমরা গেমপ্যাডের জন্য এটিকে আরও কাছাকাছি অনুকরণ করার সিদ্ধান্ত নিয়েছি। এর অর্থ হল তিনটি সিদ্ধান্ত:

ডুডলটির জন্য মাত্র তিনটি বোতাম প্রয়োজন – দুটি দৌড়ানোর জন্য এবং একটি লাফ দেওয়ার জন্য – তবে গেমপ্যাডে আরও অনেক বোতাম থাকতে পারে। তাই আমরা ষোলটি পরিচিত বোতাম এবং দুটি পরিচিত স্টিককে সেই তিনটি লজিক্যাল ফাংশনে এমনভাবে ম্যাপ করেছি যা আমাদের মতে সবচেয়ে বেশি অর্থপূর্ণ, যাতে লোকজন এগুলি ব্যবহার করে চালাতে পারে: অল্টারনেটিং A/B বোতাম, অল্টারনেটিং শোল্ডার বোতাম, ডি-প্যাডে বাঁদিকে/ডানদিকে প্রেস করা বা যেকোনও স্টিক বাঁদিকে এবং ডানদিকে জোরে ঘোরানো (অবশ্যই, এর মধ্যে কিছু অন্যদের চেয়ে বেশি কার্যকর হবে)। যেমন:
```
newState[gamepad.STATES.LEFT] =
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.PAD_LEFT) ||
    gamepad.stickMoved_(pad, gamepad.AXES.LEFT_ANALOGUE_HOR, true) ||
    gamepad.stickMoved_(pad, gamepad.AXES.RIGHT_ANALOGUE_HOR, true),

newState[gamepad.STATES.PRIMARY_BUTTON] =
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.FACE_1) ||
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.LEFT_SHOULDER) ||
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.LEFT_SHOULDER_BOTTOM) ||
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.SELECT) ||
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.START) ||
    gamepad.buttonPressed_(pad, gamepad.BUTTONS.LEFT_ANALOGUE_STICK),
```
আমরা প্রতিটি অ্যানালগ ইনপুটকে একটি বিচ্ছিন্ন ইনপুট হিসেবে বিবেচনা করেছি, যা আগে বর্ণিত থ্রেশহোল্ড ফাংশন ব্যবহার করে।
আমরা ডুডলে গেমপ্যাড ইনপুট বোল্ট করার মতো অনেক কিছু করেছি, এটিকে বেক করার পরিবর্তে – আমাদের পোলিং লুপ আসলে প্রয়োজনীয় কীডাউন এবং কীআপ ইভেন্টগুলিকে (একটি সঠিক keyCode সহ) সিন্থেসাইজ করে এবং সেগুলিকে DOM-এ ফেরত পাঠায়:

    // Create and dispatch a corresponding key event.
    var event = document.createEvent('Event');
    var eventName = down ? 'keydown' : 'keyup';
    event.initEvent(eventName, true, true);
    event.keyCode = gamepad.stateToKeyCodeMap_[state];
    gamepad.containerElement_.dispatchEvent(event);

আর এটাই হল সব!

পরামর্শ ও উপায়

মনে রাখবেন, কোনও বোতাম প্রেস করার আগে আপনার ব্রাউজারে গেমপ্যাড একেবারেই দেখা যাবে না।
আপনি যদি একই সাথে বিভিন্ন ব্রাউজারে গেমপ্যাড পরীক্ষা করেন, তাহলে মনে রাখবেন যে তাদের মধ্যে শুধুমাত্র একটি কন্ট্রোলারকে বুঝতে পারবে। আপনি কোনও ইভেন্ট না পেলে, অন্য যেসব পৃষ্ঠা এটি ব্যবহার করতে পারে সেগুলি বন্ধ করতে ভুলবেন না। এছাড়াও, আমাদের অভিজ্ঞতা থেকে আমরা জানি যে, আপনি ট্যাব বন্ধ করে দিলেও বা ব্রাউজার থেকে বেরিয়ে গেলেও, কখনও কখনও ব্রাউজার গেমপ্যাড "ধরে রাখতে" পারে। কিছু ক্ষেত্রে সিস্টেম রিস্টার্ট করাই হল সমস্যা সমাধানের একমাত্র উপায়।
সবসময়ের মতো, আপনি যাতে সেরা সহায়তা পান তা নিশ্চিত করতে Chrome Canary এবং অন্যান্য ব্রাউজারের সমতুল্য ভার্সন ব্যবহার করুন – এবং তারপরে পুরনো ভার্সন অন্যভাবে কাজ করলে সেই অনুযায়ী ব্যবস্থা নিন।

ভবিষ্যত

আমরা আশা করি যে এটি এই নতুন API সম্পর্কে কিছু আলোকপাত করতে সাহায্য করবে – এখনও কিছুটা অনিশ্চিত, তবে ইতিমধ্যেই অনেক মজার।

API-এর অনুপস্থিত অংশ (যেমন, ইভেন্ট) এবং আরও ব্রাউজার সাপোর্ট ছাড়াও, আমরা আশা করছি যে শেষ পর্যন্ত রাম্বল কন্ট্রোল, বিল্ট-ইন জাইরোস্কোপে অ্যাক্সেস ইত্যাদির মতো জিনিসগুলি দেখতে পাব। এবং, বিভিন্ন ধরনের গেমপ্যাডের জন্য আরও সাপোর্ট – আপনি যদি এমন কোনও গেমপ্যাড খুঁজে পান যা ভুলভাবে কাজ করে বা একেবারেই কাজ করে না, তাহলে Chrome-এর বিরুদ্ধে একটি বাগ ফাইল করুন এবং/অথবা Firefox-এর বিরুদ্ধে একটি বাগ ফাইল করুন।

তবে তার আগে, আমাদের Hurdles 2012 ডুডল খেলুন এবং গেমপ্যাডে এটি কতটা মজাদার তা দেখুন। ওহ, তুমি কি এইমাত্র বললে যে তুমি ১০.৭ সেকেন্ডের চেয়ে কম সময়ে দৌড়াতে পারবে? নিয়ে এসো।

ভূমিকা

গেমপ্যাড টেস্টার

বর্তমানে কোন কোন ব্রাউজারে এটি কাজ করে?

কোন কোন গেমপ্যাড ব্যবহার করা যাবে?

Gamepad API শনাক্ত করার ফিচার<

কানেক্ট করা গেমপ্যাড সম্পর্কে জানা

ভোটগ্রহণ

ইভেন্ট

সারাংশ

গেমপ্যাড সংক্রান্ত তথ্য

প্রাথমিক তথ্য

বোতাম ও স্টিক

অ্যানালগ নাকি ডিসক্রিট?

বোতাম প্রেস করা ও স্টিক মুভমেন্ট

ইভেন্ট

ভোটগ্রহণ

Hurdles 2012 ডুডলে কীবোর্ড-ফার্স্ট অ্যাপ্রোচ

পরামর্শ ও উপায়

ভবিষ্যত

আরও পড়ুন