Google एडिटर इंटरफ़ेस बनाना

Google Workspace ऐड-ऑन की मदद से, Google Docs, Google Sheets, और Google Slides जैसे एडिटर में अपनी पसंद के मुताबिक इंटरफ़ेस उपलब्ध कराए जा सकते हैं. इससे आपको उपयोगकर्ता को काम की जानकारी देने, टास्क अपने-आप पूरे होने की सुविधा देने, और तीसरे पक्ष के सिस्टम को एडिटर से कनेक्ट करने में मदद मिलती है.

ऐड-ऑन के यूज़र इंटरफ़ेस (यूआई) को ऐक्सेस करना

अगर Google Workspace ऐड-ऑन का आइकॉन, Docs, Sheets, और Slides के यूज़र इंटरफ़ेस में Google Workspace के क्विक ऐक्सेस साइड पैनल में दिखता है, तो उसे एडिटर में खोला जा सकता है.

Google Workspace ऐड-ऑन, ये इंटरफ़ेस दिखा सकता है:

  • होम पेज इंटरफ़ेस: अगर ऐड-ऑन के मेनिफ़ेस्ट में, उस एडिटर के लिए ट्रिगर EDITOR_NAME.homepageTrigger शामिल है जिसमें उपयोगकर्ता ने ऐड-ऑन खोला है, तो ऐड-ऑन उस एडिटर के लिए खास तौर पर होम पेज कार्ड बनाता है और उसे दिखाता है. अगर ऐड-ऑन के मेनिफ़ेस्ट में, उपयोगकर्ता जिस एडिटर में उसे खोलता है उसके लिए EDITOR_NAME.homepageTrigger शामिल नहीं है, तो इसके बजाय सामान्य होमपेज कार्ड दिखता है.

  • REST API इंटरफ़ेस: अगर ऐड-ऑन, REST API का इस्तेमाल करता है, तो drive.file स्कोप का इस्तेमाल करके, ऐसे ट्रिगर शामिल किए जा सकते हैं जो किसी दस्तावेज़ के लिए फ़ाइल के हिसाब से ऐक्सेस का अनुरोध करते हैं. अनुमति मिलने के बाद, EDITOR_NAME.onFileScopeGrantedTrigger नाम का एक और ट्रिगर चालू होता है. साथ ही, यह फ़ाइल के हिसाब से इंटरफ़ेस दिखाता है.

  • लिंक की झलक दिखाने वाले इंटरफ़ेस: अगर आपका ऐड-ऑन, तीसरे पक्ष की सेवा के साथ इंटिग्रेट होता है, तो ऐसे कार्ड बनाए जा सकते हैं जो आपकी सेवा के यूआरएल से कॉन्टेंट की झलक दिखाते हैं.

एडिटर ऐड-ऑन के लिए इंटरफ़ेस बनाना

एडिटर के लिए, Build Editor ऐड-ऑन इंटरफ़ेस बनाने के लिए, यह तरीका अपनाएं:

  1. ऐड-ऑन स्क्रिप्ट प्रोजेक्ट के मेनिफ़ेस्ट में, सही addOns.common, addOns.docs, addOns.sheets, और addOns.slides फ़ील्ड जोड़ें.
  2. अपने स्क्रिप्ट प्रोजेक्ट के मेनिफ़ेस्ट में, ज़रूरी एडिटर स्कोप जोड़ें.
  3. अगर आपको एडिटर के हिसाब से होम पेज उपलब्ध कराना है, तो इंटरफ़ेस बनाने के लिए EDITOR_NAME.homepageTrigger फ़ंक्शन लागू करें. अगर ऐसा नहीं है, तो common.homepageTrigger इंटरफ़ेस का इस्तेमाल करके, अपने होस्ट ऐप्लिकेशन के लिए एक सामान्य होम पेज बनाएं.
  4. अगर REST API का इस्तेमाल किया जाता है, तो drive.file स्कोप के लिए अनुमति देने की प्रोसेस और EDITOR_NAME.onFileScopeGrantedTrigger ट्रिगर फ़ंक्शन लागू करें, ताकि खुली हुई फ़ाइल के हिसाब से इंटरफ़ेस दिखाया जा सके. ज़्यादा जानकारी के लिए, REST API इंटरफ़ेस लेख पढ़ें.
  5. अगर आपको तीसरे पक्ष की सेवा से लिंक की झलक देखने की सुविधा कॉन्फ़िगर करनी है, तो https://www.googleapis.com/auth/workspace.linkpreview स्कोप के लिए अनुमति देने की प्रोसेस और linkPreviewTriggers फ़ंक्शन लागू करें. ज़्यादा जानकारी के लिए, लिंक की झलक दिखाने वाले इंटरफ़ेस लेख पढ़ें.
  6. उपयोगकर्ता के यूज़र इंटरफ़ेस (यूआई) इंटरैक्शन, जैसे कि बटन पर क्लिक करने का जवाब देने के लिए, उससे जुड़े ज़रूरी कॉलबैक फ़ंक्शन लागू करें.

एडिटर के होम पेज

आपको अपने ऐड-ऑन के स्क्रिप्ट प्रोजेक्ट में होम पेज ट्रिगर फ़ंक्शन देना होगा. यह फ़ंक्शन, ऐड-ऑन के होम पेज को बनाने और उसे दिखाने के लिए, एक Card या Card ऑब्जेक्ट का एक कलेक्शन बनाता है.

होम पेज ट्रिगर फ़ंक्शन को event object पैरामीटर के तौर पर पास किया जाता है. इसमें क्लाइंट के प्लैटफ़ॉर्म जैसी जानकारी शामिल होती है. इवेंट ऑब्जेक्ट डेटा का इस्तेमाल करके, होम पेज को अपनी ज़रूरत के हिसाब से बनाया जा सकता है.

आपके पास, एक सामान्य होम पेज या ऐसा होम पेज दिखाने का विकल्प होता है जो उस एडिटर के हिसाब से हो जिसमें उपयोगकर्ता ने आपका ऐड-ऑन खोला है.

सामान्य होम पेज दिखाना

एडिटर में अपने ऐड-ऑन का सामान्य होम पेज दिखाने के लिए, ऐड-ऑन के मेनिफ़ेस्ट में एडिटर के सही फ़ील्ड शामिल करें. जैसे, addOns.docs, addOns.sheets या addOns.slides.

यहां दिए गए उदाहरण में, Google Workspace ऐड-ऑन के मेनिफ़ेस्ट का addons हिस्सा दिखाया गया है. यह ऐड-ऑन, Docs, Sheets, और Slides के साथ काम करता है. साथ ही, हर होस्ट ऐप्लिकेशन में सामान्य होम पेज दिखाता है.

{
 "addOns": {
    "common": {
      "name": "Translate",
      "logoUrl": "https://www.gstatic.com/images/branding/product/1x/translate_24dp.png",
      "layoutProperties": {
        "primaryColor": "#2772ed"
      },
      "homepageTrigger": {
        "runFunction": "onHomepage"
      }
    },
    "docs": {},
    "sheets": {},
    "slides": {}
  }
}

एडिटर के लिए होम पेज दिखाना

किसी एडिटर के लिए होम पेज दिखाने के लिए, ऐड-ऑन मेनिफ़ेस्ट में EDITOR_NAME.homepageTrigger जोड़ें.

यहां दिए गए उदाहरण में, Google Workspace ऐड-ऑन के मेनिफ़ेस्ट का addons हिस्सा दिखाया गया है. यह ऐड-ऑन, Docs, Sheets, और Slides के लिए चालू है. यह Docs और Slides में एक जैसा होम पेज दिखाता है. साथ ही, Sheets में अलग होम पेज दिखाता है. कॉलबैक फ़ंक्शन onSheetsHomepage, Sheets के लिए होम पेज कार्ड बनाता है.

 "addOns": {
    "common": {
      "name": "Translate",
      "logoUrl": "https://www.gstatic.com/images/branding/product/1x/translate_24dp.png",
      "layoutProperties": {
        "primaryColor": "#2772ed"
      },
      "homepageTrigger": {
        "runFunction": "onHomepage"
      }
    },
    "docs": {},
    "slides": {},
    "sheets": {
     "homepageTrigger": {
       "runFunction": "onSheetsHomepage"
     },
  }
}

REST API इंटरफ़ेस

अगर आपका ऐड-ऑन, REST API का इस्तेमाल करता है, जैसे कि Google Sheets API, तो onFileScopeGrantedTrigger फ़ंक्शन का इस्तेमाल किया जा सकता है. इससे, एडिटर होस्ट ऐप्लिकेशन में खुली हुई फ़ाइल के लिए, एक नया इंटरफ़ेस दिखाया जा सकता है.

onFileScopeGrantedTrigger फ़ंक्शन का इस्तेमाल करने के लिए, आपको drive.file स्कोप ऑथराइज़ेशन फ़्लो को शामिल करना होगा. drive.file स्कोप का अनुरोध करने का तरीका जानने के लिए, मौजूदा दस्तावेज़ के लिए फ़ाइल ऐक्सेस करने का अनुरोध करना लेख पढ़ें.

जब कोई उपयोगकर्ता drive.file स्कोप की अनुमति देता है, तब EDITOR_NAME.onFileScopeGrantedTrigger.runFunction ट्रिगर होता है. ट्रिगर फ़ायर होने पर, यह ऐड-ऑन के मेनिफ़ेस्ट में मौजूद EDITOR_NAME.onFileScopeGrantedTrigger.runFunction फ़ील्ड में तय किए गए कॉन्टेक्स्ट के हिसाब से ट्रिगर फ़ंक्शन को लागू करता है.

किसी एक एडिटर के लिए REST API इंटरफ़ेस बनाने के लिए, यह तरीका अपनाएं. EDITOR_NAME को उस एडिटर होस्ट ऐप्लिकेशन से बदलें जिसका आपको इस्तेमाल करना है. उदाहरण के लिए, sheets.onFileScopeGrantedTrigger:

  1. अपने मेनिफ़ेस्ट के Editor सेक्शन में, सही जगह पर EDITOR_NAME.onFileScopeGrantedTrigger शामिल करें. उदाहरण के लिए, अगर आपको Google Sheets में यह इंटरफ़ेस बनाना है, तो ट्रिगर को "sheets" सेक्शन में जोड़ें.
  2. EDITOR_NAME.onFileScopeGrantedTrigger सेक्शन में दिए गए नाम वाले फ़ंक्शन को लागू करें. यह फ़ंक्शन, इवेंट ऑब्जेक्ट को आर्ग्युमेंट के तौर पर स्वीकार करता है. साथ ही, इसे एक Card ऑब्जेक्ट या Card ऑब्जेक्ट का कलेक्शन दिखाना होता है.
  3. किसी भी कार्ड की तरह, आपको इंटरफ़ेस के लिए विजेट इंटरैक्टिविटी उपलब्ध कराने के लिए इस्तेमाल किए गए कॉलबैक फ़ंक्शन लागू करने होंगे. उदाहरण के लिए, अगर आपने इंटरफ़ेस में कोई बटन शामिल किया है, तो उसमें कार्रवाई अटैच होनी चाहिए. साथ ही, एक ऐसा कॉलबैक फ़ंक्शन लागू होना चाहिए जो बटन पर क्लिक करने पर काम करे.

यहां Google Workspace ऐड-ऑन के मेनिफ़ेस्ट का addons हिस्सा दिखाया गया है. यह ऐड-ऑन REST API का इस्तेमाल करता है. इसलिए, Google Sheets के लिए onFileScopeGrantedTrigger शामिल किया गया है. जब कोई उपयोगकर्ता drive.file स्कोप का ऐक्सेस देता है, तो कॉलबैक फ़ंक्शन onFileScopeGrantedSheets, फ़ाइल के हिसाब से इंटरफ़ेस बनाता है.

{
  "addOns": {
    "common": {
      "name": "Productivity add-on",
      "logoUrl": "https://www.gstatic.com/images/icons/material/system_gm/1x/work_outline_black_18dp.png",
      "layoutProperties": {
        "primaryColor": "#669df6",
        "secondaryColor": "#ee675c"
      }
    },
    "sheets": {
      "homepageTrigger": {
        "runFunction": "onEditorsHomepage"
      },
      "onFileScopeGrantedTrigger": {
        "runFunction": "onFileScopeGrantedSheets"
      }
    }
  }
}

तीसरे पक्ष की सेवा के लिए लिंक की झलक दिखाने की सुविधा चालू करने के लिए, आपको अपने ऐड-ऑन के मेनिफ़ेस्ट में लिंक की झलक दिखाने की सुविधा कॉन्फ़िगर करनी होगी. साथ ही, एक ऐसा फ़ंक्शन बनाना होगा जो झलक दिखाने वाला कार्ड दिखाता हो. जिन सेवाओं के लिए उपयोगकर्ता की अनुमति ज़रूरी है उनके लिए, आपके फ़ंक्शन को अनुमति पाने की प्रोसेस भी शुरू करनी होगी.

लिंक की झलक दिखाने की सुविधा चालू करने के लिए, स्मार्ट चिप की मदद से लिंक की झलक देखना लेख पढ़ें.

इवेंट ऑब्जेक्ट

एक इवेंट ऑब्जेक्ट बनाया जाता है और इसे ट्रिगर फ़ंक्शन में पास किया जाता है. जैसे, EDITOR_NAME.homepageTrigger या EDITOR_NAME.onFileScopeGrantedTrigger. ट्रिगर फ़ंक्शन, इवेंट ऑब्जेक्ट में मौजूद जानकारी का इस्तेमाल करके यह तय करता है कि ऐड-ऑन कार्ड कैसे बनाए जाएं या ऐड-ऑन के व्यवहार को कैसे कंट्रोल किया जाए.

इवेंट ऑब्जेक्ट के पूरे स्ट्रक्चर के बारे में जानकारी, इवेंट ऑब्जेक्ट में दी गई है.

जब एडिटर, ऐड-ऑन का होस्ट ऐप्लिकेशन होता है, तो इवेंट ऑब्जेक्ट में Docs, Sheets या Slides इवेंट ऑब्जेक्ट फ़ील्ड शामिल होते हैं. इनमें क्लाइंट की जानकारी होती है.

अगर ऐड-ऑन के पास मौजूदा उपयोगकर्ता या दस्तावेज़ के लिए drive.file स्कोप के लिए अनुमति नहीं है, तो इवेंट ऑब्जेक्ट में सिर्फ़ docs.addonHasFileScopePermission, sheets.addonHasFileScopePermission या slides.addonHasFileScopePermission फ़ील्ड शामिल होता है. अगर ऐड-ऑन के पास अनुमति है, तो इवेंट ऑब्जेक्ट में एडिटर इवेंट ऑब्जेक्ट के सभी फ़ील्ड शामिल होते हैं.

यहां दिए गए उदाहरण में, एडिटर इवेंट ऑब्जेक्ट दिखाया गया है. इसे sheets.onFileScopeGrantedTrigger फ़ंक्शन को पास किया जाता है. यहां, ऐड-ऑन के पास मौजूदा दस्तावेज़ के लिए, drive.file स्कोप के लिए अनुमति है:

{
  "commonEventObject": { ... },
  "sheets": {
    "addonHasFileScopePermission": true,
    "id":"A_24Q3CDA23112312ED52",
    "title":"How to get started with Sheets"
  },
  ...
}