Как продлить время выделения активного кода в блестящем приложении?

Question

Я работаю над проектом Shiny, в котором приложение Shiny содержит большой объем кода.Я хочу отладить код приложения в интерактивном режиме, используя:

runApp("ShinyApp.R", launch.browser = TRUE, display.mode = "showcase")

Аргумент display.mode = "showcase" отображает активный код рядом с приложением в моем браузере и выделяет область, где пользователь взаимодействовал с приложением.Вот хороший пример того, как это работает: https://shiny.rstudio.com/articles/action-buttons.html

Другой пример того, как его можно использовать, упоминается в этом ответе: Как выделить активный код в блестящем приложении?

Что мне показалось сложным, так это то, что, поскольку скрипт моего приложения содержит более 800 строк кода, я не могу видеть выделение, когда оно происходит (оно исчезает слишком быстро).Как уже упоминалось: https://shiny.rstudio.com/articles/display-modes.html, выделение исчезает через несколько секунд.

Мои вопросы:

Можно ли увеличить время до исчезновения выделенной области?

Есть ли способ заставить боковую панель прокручиваться до области, где происходит выделение?

Спасибо за любые предложения или ответы!

Answer 1

Да и да, но вы должны отредактировать исходный код, и это Javascript.Код, нуждающийся в модификации, живет в inst/www/shared/shiny-showcase.js.Я уже внес изменения в код на моем форке Shiny , если вы хотите начать там.

Для вашего первого вопроса о продолжительности подсветки, он обрабатывается подсветкой JQuery эффект в строке 112:

// End any previous highlight before starting this one
jQuery(el)
  .stop(true, true)
  .effect("highlight", null, 5000);

Оригинал - 1600 или 1,6 секунды, поэтому я увеличил его до 5 секунд.Вы можете изменить его так, как считаете нужным.

Ваш второй вопрос о прокрутке к активному / выделенному коду не включен в исходный скрипт, но возможность сделать это встроена в веб-элементы и называется element.scrollIntoView().Я только что вставил этот бит кода сразу после блока подсветки:

// Scroll to highlighted element
el.scrollIntoView({behavior: 'smooth'});

el - это имя переменной, которая в данный момент указывает на активную область кода для выделения.

Здесь размещено рабочая демоверсия твиков в действии.