Развернуть код на полный экран на сайте StackExchange

Переключить полноэкранный режим для блоков кода при наведении

Автор
138 Aspen
Установок в день
0
Всего установок
10
Оценки
0 0 0
Версия
0.1.4
Создано
15.02.2024
Обновлено
18.09.2025
Размер
17,3 КБ
Лицензия
MIT
Работает на

Полноэкранный просмотр кода StackExchange

Комплексный пользовательский скрипт, который улучшает опыт просмотра кода на сайтах StackExchange, добавляя полноэкранную и копирующую функцию в блоки кода.

## Особенности

🔍 ** Просмотр кода на полном экране**

  • Открывает блоки кода в специальной новой вкладке для просмотра без отвлечения внимания
  • Сохраняет оригинальное подчеркивание синтаксиса с улучшенной цветовой схемой
  • Отзывчивый дизайн, который использует полный экран недвижимости
  • Чистый, минималистический интерфейс, оптимизированный для чтения кода

📋 ** Копирование кода одним кликом**

  • Копировать любой блок кода в буфер обмена одним кликом
  • Визуальная обратная связь подтверждает успешную операцию копирования
  • Работает беспрепятственно как с оригинальной страницой, так и с полным экраном

🎨 ** Подчеркивание синтаксиса**

  • Поддерживает оригинальное выделение синтаксиса StackExchange
  • Улучшенное выделение в полноэкранном режиме с помощью Highlight.js
  • Автоматическое обнаружение и сохранение языка
  • Цветовая схема в стиле GitHub для оптимальной читаемости

⌨️ ** Скоротки клавиатуры**

  • Escape: Закрыть вкладку полного экрана
  • Интуитивное управление для эффективной навигации

## Установка

  1. Установите менеджер пользовательских скриптов (Tampermonkey, Greasemonkey и т.д.)
  2. Установите этот скрипт из userscript
  3. Посетите любой сайт StackExchange с блоками кода
  4. Переведите миг над блоками кода, чтобы увидеть новые кнопки

## Использование

### Основные операции

  1. Переведите курсор над любым блоком кода, чтобы раскрыть кнопки управления
  2. Нажмите "Полный экран" для открытия кода в новой специальной вкладке
  3. Нажмите "Копировать" для копирования кода в буфер обмена
  4. Нажмите Escape в вкладке полного экрана, чтобы закрыть

### Функции полноэкранного просмотра

  • Панель инструментов: Фиксированное положение с кнопками Копировать и Закрыть
  • Подчеркивание синтаксиса: автоматически применяется на основе обнаруженного языка
  • Реагирующий макет: Код заполняет свободное пространство экрана
  • Навигация клавиатуры: поддержка клавиши Escape для быстрого выхода

## Поддерживаемые сайты

Скрипт работает по всей сети StackExchange:

### Основные сайты

  • Stack Overflow - Все вопросы программирования и примеры кода
  • Суперпользователь - Администрация системы и код пользователя
  • Server Fault - Скрипты управления сервером и сетью
  • Спросите Ubuntu - Командная строка и конфигурация Ubuntu/Linux
  • Math Overflow - Математический код и алгоритмы

### Дополнительное покрытие

  • Все подсайты StackExchange (200+ сообществ)
  • Мета-сайты для всех поддерживаемых платформ
  • Очередки обзора и результаты поиска
  • StackApps для примеров кода, связанного с API

## Технические детали

### Реализация

  • Чистый JavaScript - Нет внешних зависимостей на главной странице
  • Интеграция CDN - Highlight.js загружен в полноэкранные вкладки
  • Ненавязчивый - Сохраняет оригинальный стиль и функциональность страницы
  • Оптимизированная производительность - Минимальное влияние на время загрузки страницы

### Совместимость браузера

  • Chrome/Chromium - Полная поддержка
  • Firefox - Полная поддержка
  • Safari - Полная поддержка
  • Edge - Полная поддержка
  • Мобильные браузеры - Основные функции

### Безопасность

  • MIT Licensed - открытый исходный код и аудитируемый
  • Нет сбора данных - Работает полностью на стороне клиента
  • Управление всплывающими окнами - Элегантная обработка всплывающих блокеров
  • Безопасное выполнение - Нет внешнего введения скрипта на главные страницы

## Структура кода

### Основные компоненты

" JavaScript " // Основные функции addStyles() // Включает CSS для кнопок и макетов addButtons() // Создает кнопки наведения для блоков кода openCodeInNewTab() // Создает полный экран просмотра copyToClipboard() // Управляет функцией копирования кода


 ### Архитектура CSS
 - **Прозрачные упаковки** - Не мешайте оригинальному стилю
 - **Отзывчивый дизайн** - адаптируется к различным размерам экрана
 - **Взаимодействие с навигацией** - Чистый, интуитивно понятный пользовательский опыт
 - **Полноэкранная оптимизация** - Максимальная читаемость в выделенном виде

 ### Обработка событий
 - **События загрузки** - Инициализируется после загрузки контента страницы
 - **Государства перемещения** - Показывает/скрывает кнопки управления
 - **Управление кликами** - Управляет полноэкранными операциями и копированием
 - **События клавиатуры** - Поддержка клавиши Escape на полном экране

 ## Настройка

 ### Опции стиля
Скрипт можно настроить, изменив переменные CSS:

CSS
 /* Внешний вид кнопки */
 .кнопка {
цвет фона: #eee;  /* Фон кнопки */
размер шрифта: 12px;  /* Размер текста кнопки */
оболочка: 4px 8px;  /* Разстояние между кнопками */
}

 /* Полноэкранный стиль */
 .toolbar кнопка {
фон: #007acc;  /* Цвет кнопки панели инструментов */
цвет: белый;  /* Цвет текста панели инструментов */
}

### Поддержка языка Подкрепление синтаксиса поддерживает более 190 языков программирования, включая:

  • Веб: JavaScript, TypeScript, HTML, CSS, SCSS
  • Backend: Python, Java, C#, PHP, Ruby, Go, Rust
  • Системы: C, C++, Ассамблея, Shell/Bash
  • Данные: SQL, JSON, XML, YAML, CSV
  • Функциональные: Haskell, Lisp, Erlang, F#
  • Мобильный: Swift, Kotlin, Dart
  • ** И многое другое. ..**

## Устранение неисправностей

### Общие проблемы

** Кнопки не появляются **

  • Убедитесь, что менеджер userscript включен
  • Проверьте, находится ли сайт в поддерживаемых шаблонах матча
  • Обновление страницы после установки

Выплывающее окно заблокировано на полном экране

  • Разрешить всплывающие окна для доменов StackExchange
  • Проверьте настройки блокатора всплывающих окон браузера
  • Попробуйте нажать непосредственно на кнопку (не во время перехода навигации)

** Подчеркивание синтаксиса не работает **

  • Проверьте подключение к Интернету (зависимость CDN в полном экране)
  • Проверьте, что блок кода имеет правильный языковый класс
  • Попробуйте обновить вкладку полного экрана

** Копирование не работает **

  • Обеспечение подключения HTTPS (требование API буферы обмена)
  • Проверьте разрешения буфера обмена браузера
  • Попробуйте использовать Ctrl + C в качестве резервного

### Оптимизация производительности

  • Скрипт загружается асинхронно, чтобы избежать блокировки рендеринга страницы
  • Минимальные модификации DOM сохраняют оригинальную функциональность
  • Делегация событий уменьшает память
  • Переходы CSS, оптимизированные для плавного взаимодействия

## Лицензия

Лицензия MIT - бесплатная для личного и коммерческого использования.

## Поддержка

Для вопросов, запросов о функциях или вкладов:

  • Проблемы GitHub: Сообщение об ошибках и запросы функций
  • StackExchange Meta: Обсуждайте улучшения с сообществом
  • Комментарии UserScript: Поделитесь отзывами и советами