• Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Alexander Ivanov, Я просто ещё мало знаю чтобы задать такой вопрос. Да вопрос было бы лучше задать такой. Как уменьшить время загрузки сайдбара? Но умные мысли приходят позже чем надо. Хотя лучше поздно чем никогда. Можно задать такой вопрос?
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Alexander Ivanov, Нашёл ссылки на рабочий пример. Спасибо.
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Я@oshliaer, Я не вижу ссылки на рабочий пример. Спасибо за помощь. Вы сильно помогли. И с помощью добрых людей я запустил ваши предложения по коду. Но вид сайдбара изменился в худшую сторону. А скорость загрузки осталась прежней.

    За предложение о консультации и частном обучении спасибо. Но пока нет денег.
    Ваши услуги наверное же дорогие. Хотя поучиться у вас было бы большой удачей для меня.
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Сделал так. Создал три html для
    bs.html
    <style>
      Тут код вашего BS
    </style>
    
    
    jq.html
    <script>
      Тут код вашей JQ и 
    </script>
    
    
    Для клиента создаете
    
    client.html
    <!DOCTYPE html>
    <html>
      <head>
        <base target="_top">
        <?!= include('bs'); ?>
      </head>
      <body>
        <h1>Welcome</h1>
        <p>Please enjoy this helpful script.</p>
        <?!= include('jq'); ?>
      </body>
    </html>

    Записал BS и JQ по ссылкам из предыдущей программы
    Написал скрипт
    tools.gs
    function include(filename) {
      return HtmlService.createHtmlOutputFromFile(filename)
          .getContent();
    }

    Переписал
    function showSidebar() { 
      var htmlTemplate = HtmlService
        .createTemplateFromFile('client');
      SpreadsheetApp.getUi().showSidebar(htmlTemplate.evaluate()
        .setTitle('Цвет текста в ячейке поменялся'));
    }

    Закоментировал строки
    // Подключаем Bootstrap
        
        //var sidebarHTML = '<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">';
        // Подключаем jQuery
        
        //sidebarHTML += '<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>';

    Выполнил программу
    function onOpen()
    Выскакивает программа на имени первой программы
    function showSidebar() { 
      var htmlTemplate = HtmlService
        .createTemplateFromFile('client');
      SpreadsheetApp.getUi().showSidebar(htmlTemplate.evaluate()
        .setTitle('Цвет текста в ячейке поменялся'));
    }

    Чего я опять не понимаю? Как сделать правильно?
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Alexander Ivanov, Всё таки где нужно разместить вот это
    tools.gs
    function include(filename) {
      return HtmlService.createHtmlOutputFromFile(filename)
          .getContent();
    }
    
    bs.html
    <style>
      Тут код вашего BS
    </style>
    
    jq.html
    <script>
      Тут код вашей JQ
    </script>

    И где нужно разместить вот это
    <!DOCTYPE html>
    <html>
      <head>
        <base target="_top">
        <?!= include('bs'); ?>
      </head>
      <body>
        <h1>Welcome</h1>
        <p>Please enjoy this helpful script.</p>
        <?!= include('jq'); ?>
      </body>
    </html>


    И в коде
    function showSidebar() { 
      var htmlTemplate = HtmlService
        .createTemplateFromFile('client');
      SpreadsheetApp.getUi().showSidebar(htmlTemplate.evaluate()
        .setTitle('Цвет текста в ячейке поменялся'));
    }

    Что надо писать вместо 'client'
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    В коде
    function include(filename) {
      return HtmlService.createHtmlOutputFromFile(filename)
          .getContent();
    }

    filename какое имя надо вставлять?
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    А где это сторона сервера и клиента? Мне подробнее можно.
    Код вашего BS- откуда его брать?
    Тут код вашей JQ а это код откуда брать?
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Alexander Ivanov, Вопрос Как использовать Bootstrap и jQuery не используя внешний источник? Пожалуйста поподробнее я только начинающий.
  • Как использовать Bootstrap и jQuery, не используя внешний источник?

    @Ruders82 Автор вопроса
    Григорий Боев, Как это правильно сделать. Я только начинающий. Код я использую такой
    // Открытие сайдбара
    function showSidebar() { 
      var htmlOutput = HtmlService
        .createHtmlOutput('<p>A change of speed, a change of style...</p>')
        .setTitle('Цвет текста в ячейке поменялся');
      SpreadsheetApp.getUi().showSidebar(htmlOutput);
     
    }
    //*****************************************************************************************************************
    
    function showSidebar() {
     
        // Подключаем Bootstrap
        var sidebarHTML = '<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">';
        // Подключаем jQuery
        sidebarHTML += '<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>';
        
        
        sidebarHTML += '<form style="padding: 20px;text-align:center;">\
            <div class="form-group">\
                <label for="profit_ratio">Коэффициет прибыли</label>\
                <input type="text" class="form-control" id="profit_ratio" name="profit_ratio" value="">\
            </div>\
            <div class="form-group">\
                <label for="manager_ratio">Коэффициет менеджера</label>\
                <input type="text" class="form-control" id="manager_ratio" name="manager_ratio" value="">\
            </div>\
            <div class="form-group">\
                <label for="ad_ratio">Коэффициет рекламы</label>\
                <input type="text" class="form-control" id="ad_ratio" name="ad_ratio" value="">\
            </div>\
            <button type="submit" class="btn btn-primary">Записать данные в таблицу</button>\
            <br><br><br>\
            <button type="button" id="sidebarClose" class="btn btn-danger">Закрыть сайдбар</button>\
        </form>';
     
        // Создаём форму
    
        // Добавляем скрипты
        // При сабмите формы вызываем функцию writeStrInTable() и передаём ей введённые данные
        // https://developers.google.com/apps-script/guides/html/reference/run
        // При клике на кнопку 'Закрыть сайдбар' закрываем его
        // https://developers.google.com/apps-script/guides/html/reference/host#close()
        //**********************************************************************************************************************************************
         sidebarHTML += "<script>\
         $(document).on('submit', 'form', function () { \
            google.script.run \
         .withSuccessHandler(function (resultMsg) { \
                      alert(resultMsg);\
             })\
         .writeStrInTable(\
                    { profit_ratio: $('#profit_ratio').val(), manager_ratio: $('#manager_ratio').val() }\
         );\
            return false;\
         });\
    \
         $('#sidebarClose').on('click', function() {\
            google.script.host.close();\
         });\
         </script>";
        var htmlOutput = HtmlService
            .createHtmlOutput(sidebarHTML)
            .setTitle('Цвет текста в ячейке поменялся');
        SpreadsheetApp.getUi().showSidebar(htmlOutput);
     
    }

    Меня интересует вынесите скрипты и стили в отдельные файлы и подключайте уже их. Хотелось бы так. А Bootstrap и jQuery это скрипты, стили или библиотеки. Как правильно?