Я пытаюсь добавить скрипт на свои листы гугл отображения различных картинок на боковой панели - PullRequest
1 голос
/ 16 мая 2019

Я хочу отобразить другую HTML-страницу с другим GIF (всего 7) в зависимости от значения ячейки на листе. Когда мои студенты сканируют свой qr-код (чтобы записать свое посещение), определенная ячейка находится в диапазоне 1-15, и я хочу, чтобы этот номер вызывал другой gif на боковой панели. Мне удалось отобразить боковую панель с GIF, но я не знаю, как изменить HTML-страницы в зависимости от значения в ячейке. До сих пор у меня было 2 html-страницы с разными изображениями, но я планировал иметь семь и использовать вложенные операторы if для вызова разных страниц. Я включил приведенный ниже сценарий в качестве javascript, потому что не мог видеть параметр сценария приложений Google. Любая помощь будет принята с благодарностью. Спасибо.

function onOpen() {
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .createMenu('Custom Menu')
      .addItem('Show sidebar', 'showSidebar')
      .addToUi();
}

function showSidebar () {
 var htmlA = HtmlService.createHtmlOutputFromFile('tomato')
 var htmlB = HtmlService.createHtmlOutputFromFile('cucumber')
      .setTitle('My custom sidebar')
      .setWidth(200);
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
var cellValueRange = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Sheet1').getRange("H2"); 
var cellValue = cellValueRange.getValue();
if(cellValue = 1){
.showSidebar(htmlA);}
else if(cellValue = 2){
.showSidebar(htmlB);}
     
}
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
 <img src="https://media.giphy.com/media/kDwLZpqtiTObyo4qc8/giphy.gif"> <input type="button" value="Close" onclick="google.script.host.close()" />

<style> 

body{
background-image:url("https://drive.google.com/file/d/1v0uW1hxmCwGhjnInIiXwempyorFHFo07/view?usp=sharing")
}
</style>   
  </body>
</html>

1 Ответ

0 голосов
/ 17 мая 2019
  • У вас есть 7 URL-адресов изображений GIF.
  • Вы хотите расширить свой скрипт с 2 до 7 страниц.
  • Вы хотите изменить URL-адрес gif-изображений на значение от "H2" до "Sheet1" в электронной таблице.
  • Вы хотите использовать тот же стиль HTML.
    • В вашем скрипте htmlA и htmlB различны. Но вы хотите использовать тот же HTML.

Если мое понимание верно, как насчет этой модификации? В этой модификации я использовал Templated HTML. Пожалуйста, подумайте об этом как об одном из нескольких ответов.

HTML & Javascript сторона:

От:
<img src="https://media.giphy.com/media/kDwLZpqtiTObyo4qc8/giphy.gif">
Для того, чтобы:
<img src="<?= url ?>">

Сторона скрипта Google Apps:

Пожалуйста, измените showSidebarss() следующим образом. Перед запуском скрипта выполните следующие настройки.

  • Установить URL-адреса изображений на gifImages.
  • Установить имя файла HTML равным var html = HtmlService.createTemplateFromFile('index');.
Модифицированный скрипт:
function showSidebarss() {
  // Please set URLs of gif images.
  var gifImages = {
    "1": "https://media.giphy.com/media/kDwLZpqtiTObyo4qc8/giphy.gif",
    "2": "### URL for value 2 ###",
    "3": "### URL for value 3 ###",
    ,
    ,
    ,
  };

  // Retrieve value as a key.
  var cellValueRange = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Sheet1').getRange("H2"); 
  var cellValue = cellValueRange.getValue();

  // Show sidebar.
  var html = HtmlService.createTemplateFromFile('index'); // Please set this.
  html.url = gifImages[cellValue.toString()]; // Set url for <?= url ?>.
  SpreadsheetApp.getUi().showSidebar(html.evaluate());
}
  • Сценарий может работать, даже если toString() из cellValue.toString() удалено.

Примечание:

  • Это простая модификация. Поэтому, пожалуйста, измените его для вашей ситуации.

Справка:

Edit:

Если вы хотите запустить showSidebarss() при редактировании ячейки "H2" в "Sheet1", измените ее следующим образом.

Прежде чем использовать этот скрипт. Пожалуйста, установите триггер OnEdit на showSidebarss() следующим образом.

Как установить триггер OnEdit:

  • Откройте редактор скриптов.
    • Редактировать -> Триггеры текущего проекта.
    • Нажмите «Добавить триггер».
    • Установите "showSidebarss" для "Выберите, какую функцию запускать".
    • Установите «Из электронной таблицы» для «Выберите источник события».
    • Установите «При редактировании» для «Выберите тип события».

После установки триггера, когда вы редактируете ячейку "H2" или "Лист1", автоматически запускается showSidebarss().

Модифицированный скрипт:

function showSidebarss(e) {
  if (e && e.source.getSheetName() == "Sheet1" && e.range.getA1Notation() == "H2") {
    // Please set URLs of gif images.
    var gifImages = {
      "1": "https://media.giphy.com/media/kDwLZpqtiTObyo4qc8/giphy.gif",
      "2": "### URL for value 2 ###",
      "3": "### URL for value 3 ###",
      ,
      ,
      ,
    };

    // Retrieve value as a key.
    var cellValueRange = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Sheet1').getRange("H2"); 
    var cellValue = cellValueRange.getValue();

    // Show sidebar.
    var html = HtmlService.createTemplateFromFile('index'); // Please set this.
    html.url = gifImages[cellValue.toString()]; // Set url for <?= url ?>.
    SpreadsheetApp.getUi().showSidebar(html.evaluate());
  }
}

Примечание

  • На текущем этапе нет методов для изменения HTML боковой панели, которая уже открыта, с использованием Google Apps Script. В качестве обходного пути я использовал метод изменения HTML, переписав боковую панель.

Справка:

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...