Google Editor इंटरफ़ेस बनाना

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

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

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

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

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

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

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

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 ऑब्जेक्ट का एक कलेक्शन बनाता है और उसे दिखाता है.

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

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

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

एडिटर में अपने ऐड-ऑन का सामान्य होम पेज दिखाने के लिए, ऐड-ऑन के मेनिफ़ेस्ट में सही एडिटर फ़ील्ड शामिल करें. जैसे, 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 के लिए खास होम पेज दिखाना

किसी एडिटर के लिए खास होम पेज दिखाने के लिए, ऐड-ऑन के मेनिफ़ेस्ट में 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 इंटरफ़ेस

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

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

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

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

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

यहां दिए गए उदाहरण में, Google Workspace ऐड-ऑन मेनिफ़ेस्ट का addons हिस्सा दिखाया गया है. यह ऐड-ऑन, REST API का इस्तेमाल करता है. इसलिए, onFileScopeGrantedTrigger को Google Sheets के लिए शामिल किया गया है. जब कोई उपयोगकर्ता 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 फ़ील्ड शामिल होता है. अगर ऐड-ऑन के पास अनुमति है, तो इवेंट ऑब्जेक्ट में Editor के इवेंट ऑब्जेक्ट के सभी फ़ील्ड शामिल होते हैं.

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

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