راه اندازی سریع افزونه Google Slides Editor، راه اندازی سریع افزونه Google Slides Editor، راه اندازی سریع افزونه Google Slides Editor

این شروع سریع یک افزونه Google Slides Editor ایجاد می کند که متن انتخاب شده را در یک ارائه ترجمه می کند.

اهداف

• اسکریپت را تنظیم کنید
• اسکریپت را اجرا کنید.

پیش نیازها

برای استفاده از این نمونه به پیش نیازهای زیر نیاز دارید:

• یک حساب Google (حساب‌های Google Workspace ممکن است به تأیید سرپرست نیاز داشته باشند).
• یک مرورگر وب با دسترسی به اینترنت.

اسکریپت را تنظیم کنید

1. یک ارائه اسلاید در slides.new ایجاد کنید.
2. روی برنامه‌های افزودنی > اسکریپت برنامه‌ها کلیک کنید.
3. پروژه Untitled را کلیک کنید.
4. نام پروژه Apps Script را به Translate Slides تغییر دهید و روی Rename کلیک کنید.
5. در کنار فایل Code.gs ، روی More more_vert > تغییر نام کلیک کنید. نام فایل را translate .
6. روی Add a file add > HTML کلیک کنید. sidebar فایل را نامگذاری کنید.

7. محتویات هر فایل را با کد مربوطه زیر جایگزین کنید، سپس روی ذخیره کلیک کنید .

   translate.gs

   اسلاید/translate/translate.gs

   در GitHub مشاهده کنید

   /**
    * @OnlyCurrentDoc Limits the script to only accessing the current presentation.
    */
   
   /**
    * Create a open translate menu item.
    * @param {Event} event The open event.
    */
   function onOpen(event) {
     SlidesApp.getUi().createAddonMenu()
         .addItem('Open Translate', 'showSidebar')
         .addToUi();
   }
   
   /**
    * Open the Add-on upon install.
    * @param {Event} event The install event.
    */
   function onInstall(event) {
     onOpen(event);
   }
   
   /**
    * Opens a sidebar in the document containing the add-on's user interface.
    */
   function showSidebar() {
     const ui = HtmlService
         .createHtmlOutputFromFile('sidebar')
         .setTitle('Translate');
     SlidesApp.getUi().showSidebar(ui);
   }
   
   /**
    * Recursively gets child text elements a list of elements.
    * @param {PageElement[]} elements The elements to get text from.
    * @return {Text[]} An array of text elements.
    */
   function getElementTexts(elements) {
     let texts = [];
     elements.forEach((element)=> {
       switch (element.getPageElementType()) {
         case SlidesApp.PageElementType.GROUP:
           element.asGroup().getChildren().forEach((child)=> {
             texts = texts.concat(getElementTexts(child));
           });
           break;
         case SlidesApp.PageElementType.TABLE:
           const table = element.asTable();
           for (let y = 0; y < table.getNumColumns(); ++y) {
             for (let x = 0; x < table.getNumRows(); ++x) {
               texts.push(table.getCell(x, y).getText());
             }
           }
           break;
         case SlidesApp.PageElementType.SHAPE:
           texts.push(element.asShape().getText());
           break;
       }
     });
     return texts;
   }
   
   /**
    * Translates selected slide elements to the target language using Apps Script's Language service.
    *
    * @param {string} targetLanguage The two-letter short form for the target language. (ISO 639-1)
    * @return {number} The number of elements translated.
    */
   function translateSelectedElements(targetLanguage) {
     // Get selected elements.
     const selection = SlidesApp.getActivePresentation().getSelection();
     const selectionType = selection.getSelectionType();
     let texts = [];
     switch (selectionType) {
       case SlidesApp.SelectionType.PAGE:
         selection.getPageRange().getPages().forEach((page)=> {
           texts = texts.concat(getElementTexts(page.getPageElements()));
         });
         break;
       case SlidesApp.SelectionType.PAGE_ELEMENT:
         const pageElements = selection.getPageElementRange().getPageElements();
         texts = texts.concat(getElementTexts(pageElements));
         break;
       case SlidesApp.SelectionType.TABLE_CELL:
         selection.getTableCellRange().getTableCells().forEach((cell)=> {
           texts.push(cell.getText());
         });
         break;
       case SlidesApp.SelectionType.TEXT:
         selection.getPageElementRange().getPageElements().forEach((element) =>{
           texts.push(element.asShape().getText());
         });
         break;
     }
   
     // Translate all elements in-place.
     texts.forEach((text)=> {
       text.setText(LanguageApp.translate(text.asRenderedString(), '', targetLanguage));
     });
   
     return texts.length;
   }

   نوار کناری.html

   slides/translate/sidebar.html

   در GitHub مشاهده کنید

   <html>
   <head>
     <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
     <style>
       .logo { vertical-align: middle; }
       ul { list-style-type: none; padding: 0; }
       h4 { margin: 0; }
     </style>
   </head>
   <body>
   <form class="sidebar branding-below">
     <h4>Translate selected slides into:</h4>
     <ul id="languages"></ul>
     <div class="block" id="button-bar">
       <button class="blue" id="run-translation">Translate</button>
     </div>
     <h5 class="error" id="error"></h5>
   </form>
   <div class="sidebar bottom">
     <img alt="Add-on logo" class="logo"
          src="https://www.gstatic.com/images/branding/product/1x/translate_48dp.png" width="27" height="27">
     <span class="gray branding-text">Translate sample by Google</span>
   </div>
   
   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
   <script>
     $(function() {
       // Add an input radio button for every language.
       const languages = {
         ar: 'Arabic',
         zh: 'Chinese',
         en: 'English',
         fr: 'French',
         de: 'German',
         hi: 'Hindi',
         ja: 'Japanese',
         pt: 'Portuguese',
         es: 'Spanish'
       };
       const languageList = Object.keys(languages).map((id)=> {
         return $('<li>').html([
           $('<input>')
                   .attr('type', 'radio')
                   .attr('name', 'dest')
                   .attr('id', 'radio-dest-' + id)
                   .attr('value', id),
           $('<label>')
                   .attr('for', 'radio-dest-' + id)
                   .html(languages[id])
         ]);
       });
   
       $('#run-translation').click(runTranslation);
       $('#languages').html(languageList);
     });
   
     /**
      * Runs a server-side function to translate the text on all slides.
      */
     function runTranslation() {
       this.disabled = true;
       $('#error').text('');
       google.script.run
               .withSuccessHandler((numTranslatedElements, element) =>{
                 element.disabled = false;
                 if (numTranslatedElements === 0) {
                   $('#error').empty()
                           .append('Did you select elements to translate?')
                           .append('<br/>')
                           .append('Please select slides or individual elements.');
                 }
                 return false;
               })
               .withFailureHandler((msg, element)=> {
                 element.disabled = false;
                 $('#error').text('Something went wrong. Please check the add-on logs.');
                 return false;
               })
               .withUserObject(this)
               .translateSelectedElements($('input[name=dest]:checked').val());
     }
   </script>
   </body>
   </html>

اسکریپت را اجرا کنید

1. در ارائه اسلایدها، صفحه را دوباره بارگیری کنید.
2. روی برنامه‌های افزودنی > ترجمه اسلایدها > شروع کلیک کنید. ممکن است چند ثانیه طول بکشد تا آیتم منوی افزودنی ظاهر شود.
3. وقتی از شما خواسته شد، افزونه را مجاز کنید.
4. دوباره روی Extensions > Translate Slides > Start کلیک کنید.
5. متنی را به ارائه خود اضافه کنید و آن را انتخاب کنید.
6. در افزونه، روی Translate کلیک کنید تا متن انتخاب شده جایگزین شود.

مراحل بعدی

• گسترش اسلایدهای Google با Apps Script
• مرجع خدمات اسلاید