Editor ऐड-ऑन के लिए डायलॉग और साइडबार

ज़्यादातर Editor ऐड-ऑन के लिए, डायलॉग विंडो और साइडबार पैनल, ऐड-ऑन के मुख्य यूज़र इंटरफ़ेस होते हैं. दोनों को स्टैंडर्ड एचटीएमएल और सीएसएस का इस्तेमाल करके पूरी तरह से पसंद के मुताबिक बनाया जा सकता है. साथ ही, Google Apps Script के क्लाइंट-सर्वर कम्यूनिकेशन मॉडल का इस्तेमाल करके, Apps Script फ़ंक्शन चलाए जा सकते हैं. ऐसा तब होता है, जब उपयोगकर्ता साइडबार या डायलॉग से इंटरैक्ट करता है. आपका ऐड-ऑन, कई साइडबार और डायलॉग तय कर सकता है. हालांकि, ऐड-ऑन एक बार में सिर्फ़ एक ही साइडबार या डायलॉग दिखा सकता है.

अगर आपको उपयोगकर्ता को एडिटर के साथ इंटरैक्ट करने से तब तक रोकना है, जब तक वह ऐड-ऑन इंटरफ़ेस में कोई विकल्प नहीं चुन लेता, तो डायलॉग का इस्तेमाल करें. ऐसा न होने पर, साइडबार का इस्तेमाल करें.

डायलॉग

डायलॉग, विंडो पैनल होते हैं. ये मुख्य एडिटर के कॉन्टेंट पर ओवरले होते हैं. Apps Script के डायलॉग, मॉडल होते हैं. जब ये खुले होते हैं, तब उपयोगकर्ता एडिटर इंटरफ़ेस के अन्य एलिमेंट से इंटरैक्ट नहीं कर सकता. डायलॉग बॉक्स के कॉन्टेंट और साइज़ को अपनी पसंद के मुताबिक बनाया जा सकता है.

ऐड-ऑन के डायलॉग, Apps Script के कस्टम डायलॉग की तरह ही बनाए जाते हैं. सामान्य तरीका यह है:

1. एक स्क्रिप्ट प्रोजेक्ट फ़ाइल बनाएं. इसमें आपके डायलॉग का एचटीएमएल स्ट्रक्चर, सीएसएस, और क्लाइंट-साइड JavaScript के व्यवहार के बारे में बताया गया हो. एडिटर ऐड-ऑन के स्टाइल से जुड़े दिशा-निर्देश देखें.
2. अपने सर्वर-साइड कोड में, जहां आपको डायलॉग बॉक्स खोलना है वहां HtmlService.createHtmlOutputFromFile को कॉल करें. इससे डायलॉग बॉक्स को दिखाने वाला HtmlOutput ऑब्जेक्ट बन जाएगा. इसके अलावा, अगर टेंप्लेट वाला एचटीएमएल इस्तेमाल किया जा रहा है, तो टेंप्लेट जनरेट करने के लिए HtmlService.createTemplateFromFile को कॉल किया जा सकता है. इसके बाद, इसे HtmlOutput ऑब्जेक्ट में बदलने के लिए HtmlTemplate.evaluate को कॉल किया जा सकता है.
3. उस HtmlOutput का इस्तेमाल करके डायलॉग दिखाने के लिए, Ui.showModalDialog को कॉल करें.

डायलॉग खुले होने पर, सर्वर-साइड स्क्रिप्ट को निलंबित नहीं करते हैं. क्लाइंट-साइड JavaScript, google.script.run और उससे जुड़े हैंडलर फ़ंक्शन का इस्तेमाल करके, सर्वर-साइड पर एसिंक्रोनस कॉल कर सकता है. ज़्यादा जानकारी के लिए, क्लाइंट से सर्वर तक कम्यूनिकेशन लेख पढ़ें.

फ़ाइल खोलने के डायलॉग

फ़ाइल खोलने के डायलॉग पहले से बने हुए डायलॉग होते हैं. इनकी मदद से, आपके उपयोगकर्ता Google Drive से फ़ाइलें चुन सकते हैं. आपको अपने ऐड-ऑन में फ़ाइल खोलने का डायलॉग जोड़ने के लिए, उसे डिज़ाइन करने की ज़रूरत नहीं है. हालांकि, इसके लिए कुछ और कॉन्फ़िगरेशन की ज़रूरत होती है. Google Picker API चालू करने के लिए, आपको ऐड-ऑन के Cloud Platform प्रोजेक्ट का ऐक्सेस भी चाहिए.

ज़्यादा जानकारी के लिए, फ़ाइल खोलने के डायलॉग बॉक्स देखें.

साइडबार

साइडबार ऐसे पैनल होते हैं जो एडिटर इंटरफ़ेस की दाईं ओर दिखते हैं. ये ऐड-ऑन इंटरफ़ेस का सबसे सामान्य टाइप होता है. डायलॉग के उलट, साइडबार खुला होने पर एडिटर इंटरफ़ेस के अन्य एलिमेंट के साथ इंटरैक्ट किया जा सकता है. साइडबार की चौड़ाई तय होती है. हालांकि, इनके कॉन्टेंट को अपनी पसंद के मुताबिक बनाया जा सकता है.

ऐड-ऑन साइडबार, Apps Script के कस्टम साइडबार की तरह ही बनाए जाते हैं. सामान्य तरीका यह है:

1. एक स्क्रिप्ट प्रोजेक्ट फ़ाइल बनाएं. इसमें साइडबार के एचटीएमएल स्ट्रक्चर, सीएसएस, और क्लाइंट-साइड JavaScript के व्यवहार के बारे में बताया गया हो. साइडबार तय करते समय, एडिटर ऐड-ऑन के स्टाइल से जुड़े दिशा-निर्देश देखें.

2. अपने सर्वर-साइड कोड में, जहां आपको साइडबार खोलना है वहां HtmlService.createHtmlOutputFromFile को कॉल करें. इससे साइडबार को दिखाने वाला HtmlOutput ऑब्जेक्ट बन जाएगा. इसके अलावा, अगर टेंप्लेट वाले एचटीएमएल का इस्तेमाल किया जा रहा है, तो टेंप्लेट जनरेट करने के लिए HtmlService.createTemplateFromFile को कॉल किया जा सकता है. इसके बाद, इसे HtmlOutput ऑब्जेक्ट में बदलने के लिए HtmlTemplate.evaluate को कॉल किया जा सकता है.

   ऐड-ऑन साइडबार की चौड़ाई 300 पिक्सल होती है. इसे HtmlOutput.setWidth को कॉल करके बदला नहीं जा सकता.

3. उस HtmlOutput का इस्तेमाल करके साइडबार दिखाने के लिए, Ui.showSidebar को कॉल करें.

खुले होने पर साइडबार, सर्वर-साइड स्क्रिप्ट को निलंबित नहीं करते हैं. क्लाइंट-साइड JavaScript, google.script.run और उससे जुड़े हैंडलर फ़ंक्शन का इस्तेमाल करके, सर्वर-साइड पर एसिंक्रोनस कॉल कर सकता है. ज़्यादा जानकारी के लिए, क्लाइंट से सर्वर तक कम्यूनिकेशन लेख पढ़ें.