উইন্ডো ম্যানেজমেন্ট এপিআই এর সাথে বেশ কয়েকটি ডিসপ্লে পরিচালনা করা, উইন্ডো ম্যানেজমেন্ট এপিআই দিয়ে বেশ কয়েকটি ডিসপ্লে পরিচালনা করা

সেই ডিসপ্লেগুলির সাপেক্ষে সংযুক্ত ডিসপ্লে এবং অবস্থান উইন্ডো সম্পর্কে তথ্য পান।

Thomas Steiner

উইন্ডো ম্যানেজমেন্ট API

উইন্ডো ম্যানেজমেন্ট API আপনাকে আপনার মেশিনের সাথে সংযুক্ত ডিসপ্লেগুলি গণনা করতে এবং নির্দিষ্ট স্ক্রিনে উইন্ডো স্থাপন করতে দেয়।

প্রস্তাবিত ব্যবহারের ক্ষেত্রে

এই API ব্যবহার করতে পারে এমন সাইটগুলির উদাহরণগুলির মধ্যে রয়েছে:

• মাল্টি-উইন্ডো গ্রাফিক্স এডিটর à la Gimp সঠিকভাবে অবস্থান করা উইন্ডোতে বিভিন্ন সম্পাদনা সরঞ্জাম রাখতে পারে।
• ভার্চুয়াল ট্রেডিং ডেস্ক একাধিক উইন্ডোতে বাজারের প্রবণতা দেখাতে পারে যার যেকোনো একটি ফুলস্ক্রিন মোডে দেখা যেতে পারে।
• স্লাইডশো অ্যাপগুলি অভ্যন্তরীণ প্রাথমিক স্ক্রিনে স্পিকার নোট এবং একটি বহিরাগত প্রজেক্টরে উপস্থাপনা দেখাতে পারে।

কিভাবে উইন্ডো ম্যানেজমেন্ট API ব্যবহার করবেন

সমস্যা

উইন্ডোজ নিয়ন্ত্রণ করার সময়-পরীক্ষিত পদ্ধতি, Window.open() , দুর্ভাগ্যবশত অতিরিক্ত স্ক্রীন সম্পর্কে অজানা। যদিও এই API-এর কিছু দিক একটু প্রাচীন বলে মনে হচ্ছে, যেমন এর windowFeatures DOMString প্যারামিটার, তবুও এটি বছরের পর বছর ধরে আমাদের ভালোভাবে পরিবেশন করেছে। একটি উইন্ডোর অবস্থান নির্দিষ্ট করতে, আপনি স্থানাঙ্কগুলিকে left এবং top (বা যথাক্রমে screenX এবং screenY ) হিসাবে পাস করতে পারেন এবং width এবং height (বা যথাক্রমে innerWidth এবং innerHeight ) হিসাবে পছন্দসই আকার পাস করতে পারেন। উদাহরণস্বরূপ, বাম দিক থেকে 50 পিক্সেল এবং উপরে থেকে 50 পিক্সেলে একটি 400×300 উইন্ডো খুলতে, এই কোডটি আপনি ব্যবহার করতে পারেন:

const popup = window.open(
  'https://example.com/',
  'My Popup',
  'left=50,top=50,width=400,height=300',
);

আপনি window.screen প্রপার্টি দেখে বর্তমান স্ক্রীন সম্পর্কে তথ্য পেতে পারেন, যা একটি Screen অবজেক্ট রিটার্ন করে। এটি আমার MacBook Pro 13″ এর আউটপুট:

window.screen;
/* Output from my MacBook Pro 13″:
  availHeight: 969
  availLeft: 0
  availTop: 25
  availWidth: 1680
  colorDepth: 30
  height: 1050
  isExtended: true
  onchange: null
  orientation: ScreenOrientation {angle: 0, type: "landscape-primary", onchange: null}
  pixelDepth: 30
  width: 1680
*/

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

আমি যদি বড় পর্দার সুবিধা নিতে চাই, আমি উপরের কোড নমুনা থেকে পপআপটি দ্বিতীয় স্ক্রিনে রাখতে পারি। আমি এটি এই মত করি:

popup.moveTo(2500, 50);

এটি একটি মোটামুটি অনুমান, যেহেতু দ্বিতীয় পর্দার মাত্রা জানার কোন উপায় নেই। window.screen থেকে পাওয়া তথ্য শুধুমাত্র অন্তর্নির্মিত স্ক্রীনকে কভার করে, কিন্তু iPad স্ক্রীন নয়। বিল্ট-ইন স্ক্রিনের রিপোর্ট করা width ছিল 1680 পিক্সেল, তাই 2500 পিক্সেলে চলে যাওয়া উইন্ডোটিকে আইপ্যাডে স্থানান্তর করতে কাজ করতে পারে , যেহেতু আমি জানি যে এটি আমার ম্যাকবুকের ডানদিকে অবস্থিত। সাধারণ ক্ষেত্রে আমি কীভাবে এটি করতে পারি? দেখা যাচ্ছে, অনুমান করার চেয়ে ভালো উপায় আছে। এই উপায় হল উইন্ডো ম্যানেজমেন্ট API।

বৈশিষ্ট্য সনাক্তকরণ

উইন্ডো ম্যানেজমেন্ট API সমর্থিত কিনা তা পরীক্ষা করতে, ব্যবহার করুন:

if ('getScreenDetails' in window) {
  // The Window Management API is supported.
}

window-management অনুমতি

আমি উইন্ডো ম্যানেজমেন্ট এপিআই ব্যবহার করার আগে, আমাকে অবশ্যই ব্যবহারকারীর কাছে এটি করার অনুমতি চাইতে হবে। window-management অনুমতিটি অনুমতি API এর সাথে জিজ্ঞাসা করা যেতে পারে:

let granted = false;
try {
  const { state } = await navigator.permissions.query({ name: 'window-management' });
  granted = state === 'granted';
} catch {
  // Nothing.
}

পুরানো এবং নতুন অনুমতি নাম সহ ব্রাউজারগুলি ব্যবহার করার সময়, নীচের উদাহরণের মতো অনুমতির অনুরোধ করার সময় প্রতিরক্ষামূলক কোড ব্যবহার করতে ভুলবেন না।

async function getWindowManagementPermissionState() {
  let state;
  // The new permission name.
  try {
    ({ state } = await navigator.permissions.query({
      name: "window-management",
    }));
  } catch (err) {
    return `${err.name}: ${err.message}`;
  }
  return state;
}

document.querySelector("button").addEventListener("click", async () => {
  const state = await getWindowManagementPermissionState();
  document.querySelector("pre").textContent = state;
});

ব্রাউজারটি নতুন API-এর যেকোনো পদ্ধতি ব্যবহার করার প্রথম প্রচেষ্টায় গতিশীলভাবে অনুমতি প্রম্পট দেখানোর জন্য বেছে নিতে পারে । আরও জানতে পড়ুন।

window.screen.isExtended এক্সটেন্ডেড প্রপার্টি

আমার ডিভাইসের সাথে একাধিক স্ক্রীন সংযুক্ত আছে কিনা তা জানতে, আমি window.screen.isExtended প্রপার্টি অ্যাক্সেস করি। এটি true বা false ফেরত দেয়। আমার সেটআপের জন্য, এটি true ফিরে আসে।

window.screen.isExtended;
// Returns `true` or `false`.

getScreenDetails() পদ্ধতি

এখন যেহেতু আমি জানি যে বর্তমান সেটআপটি মাল্টি-স্ক্রিন, আমি Window.getScreenDetails() ব্যবহার করে দ্বিতীয় স্ক্রীন সম্পর্কে আরও তথ্য পেতে পারি। এই ফাংশনটি কল করলে একটি অনুমতি প্রম্পট দেখাবে যা আমাকে জিজ্ঞাসা করবে যে সাইটটি খুলতে এবং আমার স্ক্রিনে উইন্ডো রাখতে পারে কিনা। ফাংশনটি একটি প্রতিশ্রুতি প্রদান করে যা একটি ScreenDetailed বস্তুর সাথে সমাধান করে। আমার ম্যাকবুক প্রো 13-এ একটি সংযুক্ত আইপ্যাড সহ, এতে দুটি ScreenDetailed অবজেক্ট সহ একটি screens ক্ষেত্র রয়েছে:

await window.getScreenDetails();
/* Output from my MacBook Pro 13″ with the iPad attached:
{
  currentScreen: ScreenDetailed {left: 0, top: 0, isPrimary: true, isInternal: true, devicePixelRatio: 2, …}
  oncurrentscreenchange: null
  onscreenschange: null
  screens: [{
    // The MacBook Pro
    availHeight: 969
    availLeft: 0
    availTop: 25
    availWidth: 1680
    colorDepth: 30
    devicePixelRatio: 2
    height: 1050
    isExtended: true
    isInternal: true
    isPrimary: true
    label: "Built-in Retina Display"
    left: 0
    onchange: null
    orientation: ScreenOrientation {angle: 0, type: "landscape-primary", onchange: null}
    pixelDepth: 30
    top: 0
    width: 1680
  },
  {
    // The iPad
    availHeight: 999
    availLeft: 1680
    availTop: 25
    availWidth: 1366
    colorDepth: 24
    devicePixelRatio: 2
    height: 1024
    isExtended: true
    isInternal: false
    isPrimary: false
    label: "Sidecar Display (AirPlay)"
    left: 1680
    onchange: null
    orientation: ScreenOrientation {angle: 0, type: "landscape-primary", onchange: null}
    pixelDepth: 24
    top: 0
    width: 1366
  }]
}
*/

সংযুক্ত স্ক্রীন সম্পর্কে তথ্য screens অ্যারেতে পাওয়া যায়। লক্ষ্য করুন কিভাবে আইপ্যাডের জন্য left মান 1680 থেকে শুরু হয়, যা বিল্ট-ইন ডিসপ্লের width ঠিক। এটি আমাকে ঠিক কীভাবে স্ক্রিনগুলি যৌক্তিকভাবে সাজানো হয়েছে তা নির্ধারণ করতে দেয় (একে অপরের পাশে, একে অপরের উপরে, ইত্যাদি)। এটি একটি isInternal একটি কিনা এবং এটি একটি isPrimary কিনা তা দেখানোর জন্য প্রতিটি স্ক্রিনের জন্য এখন ডেটা রয়েছে৷ মনে রাখবেন যে অন্তর্নির্মিত স্ক্রিনটি অগত্যা প্রাথমিক পর্দা নয় ।

currentScreen ক্ষেত্রটি বর্তমান window.screen এর সাথে সম্পর্কিত একটি লাইভ অবজেক্ট। বস্তুটি ক্রস-স্ক্রিন উইন্ডো প্লেসমেন্ট বা ডিভাইস পরিবর্তনের উপর আপডেট করা হয়।

screenschange ইভেন্ট

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

মনে রাখবেন যে আপনাকে অ্যাসিঙ্ক্রোনাসভাবে নতুন স্ক্রীনের বিবরণ দেখতে হবে, screenschange ইভেন্ট নিজেই এই ডেটা প্রদান করে না। স্ক্রীনের বিশদ বিবরণ দেখতে, একটি ক্যাশে Screens ইন্টারফেস থেকে লাইভ অবজেক্ট ব্যবহার করুন।

const screenDetails = await window.getScreenDetails();
let cachedScreensLength = screenDetails.screens.length;
screenDetails.addEventListener('screenschange', (event) => {
  if (screenDetails.screens.length !== cachedScreensLength) {
    console.log(
      `The screen count changed from ${cachedScreensLength} to ${screenDetails.screens.length}`,
    );
    cachedScreensLength = screenDetails.screens.length;
  }
});

currentscreenchange ইভেন্ট

যদি আমি শুধুমাত্র বর্তমান স্ক্রিনে পরিবর্তন করতে আগ্রহী হই (অর্থাৎ, লাইভ অবজেক্ট currentScreen মান), আমি currentscreenchange ইভেন্টের জন্য শুনতে পারি।

const screenDetails = await window.getScreenDetails();
screenDetails.addEventListener('currentscreenchange', async (event) => {
  const details = screenDetails.currentScreen;
  console.log('The current screen has changed.', event, details);
});

change ঘটনা

অবশেষে, যদি আমি শুধুমাত্র একটি কংক্রিট স্ক্রিনে পরিবর্তন করতে আগ্রহী, আমি সেই পর্দার change ইভেন্ট শুনতে পারি।

const firstScreen = (await window.getScreenDetails())[0];
firstScreen.addEventListener('change', async (event) => {
  console.log('The first screen has changed.', event, firstScreen);
});

নতুন ফুলস্ক্রিন বিকল্প

এখন অবধি, আপনি অনুরোধ করতে পারেন যে উপাদানগুলি যথাযথভাবে নামযুক্ত requestFullScreen() পদ্ধতির মাধ্যমে ফুলস্ক্রিন মোডে প্রদর্শিত হবে। পদ্ধতিটি একটি options প্যারামিটার নেয় যেখানে আপনি FullscreenOptions পাস করতে পারেন। এখন পর্যন্ত, এর একমাত্র সম্পত্তি navigationUI । উইন্ডো ম্যানেজমেন্ট এপিআই একটি নতুন screen প্রপার্টি যোগ করে যা আপনাকে কোন স্ক্রীনটি ফুলস্ক্রিন ভিউ শুরু করতে হবে তা নির্ধারণ করতে দেয়। উদাহরণস্বরূপ, আপনি যদি প্রাথমিক স্ক্রিনটিকে পূর্ণস্ক্রীন করতে চান:

try {
  const primaryScreen = (await getScreenDetails()).screens.filter((screen) => screen.isPrimary)[0];
  await document.body.requestFullscreen({ screen: primaryScreen });
} catch (err) {
  console.error(err.name, err.message);
}

পলিফিল

উইন্ডো ম্যানেজমেন্ট এপিআই পলিফিল করা সম্ভব নয়, তবে আপনি এটির আকৃতিকে শিম করতে পারেন যাতে আপনি নতুন API এর বিরুদ্ধে একচেটিয়াভাবে কোড করতে পারেন:

if (!('getScreenDetails' in window)) {
  // Returning a one-element array with the current screen,
  // noting that there might be more.
  window.getScreenDetails = async () => [window.screen];
  // Set to `false`, noting that this might be a lie.
  window.screen.isExtended = false;
}

API-এর অন্যান্য দিক, অর্থাৎ, বিভিন্ন স্ক্রীন পরিবর্তন ইভেন্ট এবং FullscreenOptions এর screen প্রপার্টি, অ-সমর্থক ব্রাউজার দ্বারা যথাক্রমে কখনই ফায়ার বা নীরবভাবে উপেক্ষা করা হবে না।

ডেমো

আপনি যদি আমার মতো কিছু হন, আপনি বিভিন্ন ক্রিপ্টোকারেন্সির বিকাশের উপর ঘনিষ্ঠ নজর রাখেন। (বাস্তবে আমি এই গ্রহটিকে ভালবাসি বলে আমি খুব বেশি করি না, তবে, এই নিবন্ধটির জন্য, অনুমান করুন আমি করেছি।) আমার মালিকানাধীন ক্রিপ্টোকারেন্সিগুলির ট্র্যাক রাখতে, আমি একটি ওয়েব অ্যাপ তৈরি করেছি যা আমাকে দেখতে দেয় জীবনের সমস্ত পরিস্থিতিতে বাজার, যেমন আমার বিছানার আরাম থেকে, যেখানে আমার একটি শালীন একক-স্ক্রিন সেটআপ রয়েছে।

এটি ক্রিপ্টো সম্পর্কে, বাজারগুলি যে কোনও সময় ব্যস্ত হতে পারে। এটি ঘটলে, আমি দ্রুত আমার ডেস্কে চলে যেতে পারি যেখানে আমার একটি মাল্টি-স্ক্রিন সেটআপ আছে। আমি যেকোনো মুদ্রার উইন্ডোতে ক্লিক করতে পারি এবং বিপরীত স্ক্রিনে একটি পূর্ণস্ক্রীন ভিউতে দ্রুত সম্পূর্ণ বিবরণ দেখতে পারি। নিচে আমার সাম্প্রতিক YCY রক্তস্নানের সময় তোলা একটি সাম্প্রতিক ছবি দেওয়া হল। এটা আমাকে সম্পূর্ণভাবে আঁকড়ে ধরল এবং আমার মুখে হাত রেখে আমাকে ছেড়ে দিল।

আপনি নীচে এমবেড করা ডেমোর সাথে খেলতে পারেন, বা ত্রুটিতে এর উত্স কোডটি দেখতে পারেন৷

নিরাপত্তা এবং অনুমতি

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

ব্যবহারকারী নিয়ন্ত্রণ

ব্যবহারকারী তাদের সেটআপের এক্সপোজারের সম্পূর্ণ নিয়ন্ত্রণে থাকে। তারা অনুমতি প্রম্পট গ্রহণ বা প্রত্যাখ্যান করতে পারে এবং ব্রাউজারে সাইট তথ্য বৈশিষ্ট্যের মাধ্যমে পূর্বে দেওয়া অনুমতি প্রত্যাহার করতে পারে।

এন্টারপ্রাইজ নিয়ন্ত্রণ

Chrome এন্টারপ্রাইজ ব্যবহারকারীরা পারমাণবিক নীতি গ্রুপ সেটিংসের প্রাসঙ্গিক বিভাগে বর্ণিত উইন্ডো ম্যানেজমেন্ট API-এর বিভিন্ন দিক নিয়ন্ত্রণ করতে পারেন।

স্বচ্ছতা

উইন্ডো ম্যানেজমেন্ট এপিআই ব্যবহার করার অনুমতি দেওয়া হয়েছে কিনা তা ব্রাউজারের সাইটের তথ্যে প্রকাশ করা হয়েছে এবং অনুমতি API-এর মাধ্যমেও জিজ্ঞাসাযোগ্য।

অনুমতি অধ্যবসায়

ব্রাউজার অনুমতি অনুদান অব্যাহত. ব্রাউজারের সাইটের তথ্যের মাধ্যমে অনুমতি প্রত্যাহার করা যেতে পারে।

প্রতিক্রিয়া

Chrome টিম উইন্ডো ম্যানেজমেন্ট API এর সাথে আপনার অভিজ্ঞতার কথা শুনতে চায়৷

API ডিজাইন সম্পর্কে আমাদের বলুন

API সম্পর্কে এমন কিছু আছে যা আপনার প্রত্যাশিত মত কাজ করে না? অথবা আপনার ধারণা বাস্তবায়নের জন্য আপনার প্রয়োজনীয় পদ্ধতি বা বৈশিষ্ট্যগুলি অনুপস্থিত আছে? নিরাপত্তা মডেল সম্পর্কে একটি প্রশ্ন বা মন্তব্য আছে?

• সংশ্লিষ্ট গিটহাব রেপোতে একটি বিশেষ সমস্যা ফাইল করুন, বা বিদ্যমান সমস্যাটিতে আপনার চিন্তা যোগ করুন।

বাস্তবায়নের সাথে একটি সমস্যা রিপোর্ট করুন

আপনি কি Chrome এর বাস্তবায়নের সাথে একটি বাগ খুঁজে পেয়েছেন? অথবা বাস্তবায়ন বৈশিষ্ট থেকে ভিন্ন?

• new.crbug.com এ একটি বাগ ফাইল করুন। আপনি যতটা পারেন বিশদ অন্তর্ভুক্ত করতে ভুলবেন না, পুনরুত্পাদনের জন্য সহজ নির্দেশাবলী, এবং উপাদান বাক্সে Blink>Screen>MultiScreen লিখুন। দ্রুত এবং সহজ রিপ্রো শেয়ার করার জন্য গ্লিচ দুর্দান্ত কাজ করে।

API এর জন্য সমর্থন দেখান

আপনি কি উইন্ডো ম্যানেজমেন্ট API ব্যবহার করার পরিকল্পনা করছেন? আপনার সর্বজনীন সমর্থন Chrome টিমকে বৈশিষ্ট্যগুলিকে অগ্রাধিকার দিতে সাহায্য করে এবং অন্যান্য ব্রাউজার বিক্রেতাদের দেখায় যে তাদের সমর্থন করা কতটা গুরুত্বপূর্ণ৷

• WICG ডিসকোর্স থ্রেডে আপনি কীভাবে এটি ব্যবহার করার পরিকল্পনা করছেন তা শেয়ার করুন।
• হ্যাশট্যাগ #WindowManagement ব্যবহার করে @ChromiumDev- এ একটি টুইট পাঠান এবং আপনি কোথায় এবং কীভাবে এটি ব্যবহার করছেন তা আমাদের জানান।
• অন্যান্য ব্রাউজার বিক্রেতাদের API বাস্তবায়ন করতে বলুন।

সহায়ক লিঙ্ক

• বিশেষ খসড়া
• পাবলিক ব্যাখ্যাকারী
• উইন্ডো ম্যানেজমেন্ট API ডেমো | উইন্ডো ম্যানেজমেন্ট API ডেমো উৎস
• ক্রোমিয়াম ট্র্যাকিং বাগ
• ChromeStatus.com এন্ট্রি
• ব্লিঙ্ক কম্পোনেন্ট: Blink>Screen>MultiScreen
• TAG পর্যালোচনা
• পরীক্ষা করার অভিপ্রায়

স্বীকৃতি

উইন্ডো ম্যানেজমেন্ট API স্পেকটি ভিক্টর কস্টান , জোশুয়া বেল এবং মাইক ওয়াসারম্যান দ্বারা সম্পাদনা করা হয়েছিল। এপিআইটি মাইক ওয়াসারম্যান এবং অ্যাড্রিয়েন ওয়াকার দ্বারা প্রয়োগ করা হয়েছিল। এই নিবন্ধটি Joe Medley , François Beaufort , এবং Kayce Basques দ্বারা পর্যালোচনা করা হয়েছে। ফটোগুলির জন্য লরা টরেন্ট পুইগকে ধন্যবাদ।