html + css + js в поле HTML документа 1С на примере решения задачи ханойских башен

Публикация № 1151684

Разработка - Практика программирования

javascript css html 1c полеHTMLдокумента рекурсия

Рассматривается пример использования html + css + js в полеHTMLдокумента 1с. Вызов функций javascript со стороны 1С с передачей параметров. Решение головоломки "Ханойская башня" с визуализацией в среде 1С.

Задача ханойских башен

Одна из популярных головоломок XIX века. Даны три стержня, на один из которых нанизаны несколько колец, причём кольца отличаются размером и лежат меньшее на большем. Задача состоит в том, чтобы перенести пирамиду из колец за наименьшее число ходов на другой стержень. За один раз разрешается переносить только одно кольцо, причём нельзя класть большее кольцо на меньшее.

Существует несколько подходов к решению. В данной публикации приведено решение с использованием рекурсивного метода.

Суть метода. Пусть есть 3 стержня (Стержень1, Стержень2, Стержень3). Переложим n-1 дисков с Стержень1 на Стержень3. Затем перенесём оставшийся (самый большой) диск с Стержень1 на Стержень2. Наконец, снова, переложим n-1 дисков с Стержень3 на Стержень2 (поверх того, самого большого диска). Таким образом, задача по переносу n дисков с Стержень1 на Стержень2 решена, а её код на 1С будет иметь вид:

Процедура ПеренестиДиски (НомерДиска,Стержень1,Стержень2,Стержень3)         // переложить n-й диск с Стержень1 на Стержень2, используя Стержень3
	Если НомерДиска <= 0 Тогда             		   							// (0) дисков нет - конец
		Возврат;
	КонецЕсли;
	ПеренестиДиски(НомерДиска-1,Стержень1,Стержень3,Стержень2);             //     перекладываем n-1 диск с Стержень1 на Стержень3	
	Сообщить(Стержень1+"->"+Стержень2);              	   					// (1) переносим     1 диск   c Стержень1 на Стержень2	
	ПеренестиДиски(НомерДиска-1,Стержень3,Стержень2,Стержень1);             //     перекладываем n-1 диск с Стержень3 на Стержень2
	Возврат;                               									// (2) конец
КонецПроцедуры

 

Реализация

Для начала "нарисуем" внешний вид ханойских башен используя HTML и CSS, и создадим метод который будет передвигать указанный диск на заданный стержень:

Далее сгенерируем получившийся код в форме 1С, используя Поле HTML Документа.

Для работы с HTML документами в 1С формах существует элемент управления Поле HTML Документа. HTML документ может быть сформирован в элементе управления программно, загружен из ресурса, указываемого через URL, или же загружен из макета типа HTML-документ.

В нашем случае HTML форма будет генерироваться при открытии формы:

 
Показать/Скрыть

 

В секции <script></script> описана функция MoveDisk(disk, st), которая принимает значение параметров из 1с, и двигает диски согласно этим параметрам. 

Теперь перепишем процедуру "Переставить", таким образом, чтобы:

  • каждый следующий шаг происходил по нажатию на кнопку формы;
  • в алгоритме происходил вызов js функции MoveDisk. 

Процедура примет вид:

&НаКлиенте
Процедура Переставить(ОбъектWindow,НомерДиска,Стержень1,Стержень2,Стержень3,ТекущийШаг)
	Если НомерДиска <= 0 Тогда 
		Возврат;
	КонецЕсли;
	Переставить(ОбъектWindow,НомерДиска-1,Стержень1,Стержень3,Стержень2,ТекущийШаг);
	Если ТекущийШаг = СледующийШаг Тогда 
		ОбъектWindow.MoveDisk("disk" + НомерДиска,Стержень2);
		ТекущийШаг = ТекущийШаг +1;
		Возврат;
	КонецЕсли;	
	ТекущийШаг = ТекущийШаг +1;
	Переставить(ОбъектWindow,НомерДиска-1,Стержень3,Стержень2,Стержень1,ТекущийШаг);
	Возврат;
КонецПроцедуры

Вызов функции "Переставить" происходит по нажатию на кнопку:

&НаКлиенте
Процедура ВыполнитьПерестановку(Команда)
	ОбъектWindow = Элементы.ПолеHTMLДокумента.Документ.parentWindow;    // IE-only 
	Если ОбъектWindow = Неопределено Тогда
        ОбъектWindow = Элементы.ПолеHTMLДокумента.Документ.defaultView; // Другие браузеры
	КонецЕсли;
	ТекущийШаг = 1;
	Переставить(ОбъектWindow,КоличествоБашен,"st1","st2","st3",ТекущийШаг);
	СледующийШаг = СледующийШаг +1;
КонецПроцедуры

ОбъектWindow является корневым объектом JavaScript. Все объекты JavaScript, а также переменные и функции определяемые пользователем хранятся в объекте window.

В контексте данного объекта и хранится javascript функция MoveDisk(disk, st).

Таким образом, используя связку html css javascript, реализовано решение головоломки в элементе формы 1с Поле HTML Документа.

Ссылки:

1с + js:

//soft.crimea.com/public/398366/

Ханойские башни:

http://synset.com/ai/ru/search/Towers_of_Hanoi.html

https://ru.wikipedia.org/wiki/%D0%A5%D0%B0%D0%BD%D0%BE%D0%B9%D1%81%D0%BA%D0%B0%D1%8F_%D0%B1%D0%B0%D1%88%D0%BD%D1%8F

 

Тестировалось на платформе 8.3.12.

Обработка с реализацией прикреплена.

Скачать файлы

Наименование Файл Версия Размер
html + css + js в полеHTMLдокумента 1c на примере решения задачи ханойских башен:

.epf 8,19Kb
10.11.19
9
.epf 8,19Kb 9 Скачать

Специальные предложения

Оставьте свое сообщение

См. также

Расширение возможностей печати: Вывод произвольного нижнего и верхнего колонтитула Промо

Печатные формы документов Практика программирования Универсальные функции v8 1cv8.cf Абонемент ($m)

Расширяем функционал вывода нижнего / верхнего колонтитула. Стандартно 1С имеет достаточно ограничений по выводу и наполнению колонтитулов содержимым, взять хотя бы такие, как вывод только текста и отсутствие ограничения на номер конечной страницы. А при разработке кода сталкиваешься с тем, что свой блок с нижним колонтитулом нужно прижимать к низу страницы. Казалось бы быстро решаемый вопрос, но и в нем есть нюансы. Сейчас я расскажу о том, как решалась эта задача. UPD 15.02.2018. Добавлен вывод верхнего колонтитула; Вывод колонтитулов на первой и последней странице управляется параметрами; Научился считать страницы: Добавлено заполнение переменных аналогичных стандартным из колонтитулов; Задаются форматы даты и времени. Ограничения прежние: 1. Повторно сформировать табличный документ после смены параметров страницы интерактивно.; 2. Передавать данные для более плотной печати как можно более мелко нарезанными кусками.

1 стартмани

29.12.2017    40337    28    agent00mouse    0    

Самый простой парсинг и обработка веб-страниц в 1С

WEB Универсальные функции v8 1cv8.cf Бесплатно (free)

Рассмотрим самый простой парсинг веб-страниц средствами платформы 1С и еще некоторые полезные приемы работы с веб-страницами.

07.08.2020    4243    YPermitin    18    

Два способа реализации ABC-анализа контрагентов для БП 3.0

Практика программирования Оптовая торговля v8 БП3.0 Россия УУ Абонемент ($m)

В данной статье рассматриваются 2 способа реализации ABC анализа контрагентов для конфигурации Бухгалтерия предприятия 3.0 (версия  3.0.75.109).

1 стартмани

17.03.2020    1917    8    Астиг    8    

Подборка иконок для подсистем 1С:8.2, 8.3 (740 шт.) PNG 48х48 Промо

Практика программирования Работа с интерфейсом v8 1cv8.cf Россия Абонемент ($m)

Подборка иконок для подсистем 1С: Предприятие 8.2, 8.3 (УП) в формате PNG 48*48 с сохранением прозрачности.

3 стартмани

19.12.2011    103768    192    Lesha1C    74    

Задачка: Список всех документов за заданный период, используя СКД

Практика программирования v8 v8::СКД 1cv8.cf Абонемент ($m)

Вывести все документы за заданный период, используя СКД.

1 стартмани

11.03.2020    2038    2    MaxxiMiliSan    7    

СКД: красивые надписи в заголовках колонок

Практика программирования Работа с интерфейсом v8 v8::СКД УПП1 Россия Абонемент ($m)

Необходимо немного исправить вывод надписей в заголовках колонок, сделать более читаемый вариант. Как это сделать?

2 стартмани

27.02.2020    9728    7    wowik    36    

Примерная схема проведения документов (Механизм проведения) в ERP 2.5.x.x

Практика программирования v8 ERP2 Абонемент ($m)

Некий шаблон "общей" картины связи процедур выполняемых типовым механизмом проведения в ERP 2.5.

1 стартмани

27.01.2020    5927    11    s14adow    7    

Отчет на СКД с выводом остатков по всем датам периода для УТ 10.3 (обычные формы)

Практика программирования v8::СКД УТ10 Россия УУ Абонемент ($m)

Требовалось получить остатки на каждую дату периода с целью дальнейшего вывода в любых целях. В обработке используется вспомогательный макет СКД, из которого и получается таблица остатков. Далее ее просто вывожу через другое СКД, так как это просто пример. Вы можете встроить это себе в любую обработку.

1 стартмани

23.12.2019    3325    3    jump0    0    

Решение задач по мотивам статьи "30 задач. Странных и не очень"

Практика программирования v8 v8::УФ 1cv8.cf Абонемент ($m)

Обработка по мотивам статьи: https://infostart.ru/public/1161686/

1 стартмани

04.12.2019    3011    2    batsy66    9    

Программное добавление параметров редактирования СКД

Практика программирования v8 v8::СКД 1cv8.cf Абонемент ($m)

В данной публикации приводится пример программного добавления параметров редактирования для поля выборки в СКД.

1 стартмани

25.11.2019    5602    1    Isonic    8    

Инициалы имени иностранного сотрудника в ЗУП 3.1

Практика программирования Печатные формы документов v8 v8::СПР ЗУП3.x Россия Абонемент ($m)

Решение проблемы лишнего дефиса в двойном имени иностранного сотрудника с помощью простого расширения.

1 стартмани

10.10.2019    4339    0    accounting_cons    0    

Индикатор выполнения (прогресс-бар) с таймером остаточного времени выполнения (обычное приложение + УФ)

Практика программирования Работа с интерфейсом v8 v8::УФ 1cv8.cf Абонемент ($m)

Индикатор (прогресс-бар) - элемент формы, отображающий ход выполнения операций по счетчику. В данном решении разработана возможность отслеживания остаточного времени выполнения.

1 стартмани

08.10.2019    5001    12    slayer-ekb    5    

Формирование внешнего отчета в фоне

Практика программирования Разработка v8 1cv8.cf Абонемент ($m)

Принципы формирования внешнего отчета в фоновом режиме. Используя стандартную форму отчета БСП или свою. Вопросы передачи параметров от команды внешнего отчета в фоновом процессе к ожидающей завершения процедуре формы.

1 стартмани

07.08.2019    8393    4    partizand    14    

Расчет сложных итогов СКД

Практика программирования v8 v8::СКД 1cv8.cf Абонемент ($m)

Малоизвестный прием для расчета итогов в отчетах на СКД.

1 стартмани

05.08.2019    18622    14    masterkio    16    

Иерархическая нумерация в отчете СКД с помощью макета поля

Практика программирования Разработка v8 v8::СКД 1cv8.cf Абонемент ($m)

Представляю Вашему вниманию вариант решения задачи нумерации строк иерархического отчета на СКД.

1 стартмани

28.06.2019    7609    5    Isonic    14    

Пример печатной формы в Word для УТ 11.4, ERP. КА 2.4, подложка и колонтитулы

Печатные формы документов Практика программирования Разработка v8 ERP2 УТ11 КА2 Россия Абонемент ($m)

Пример внешней печатной формы с выводом в MS Word для УТ 11.4, КА 2, ERP 2.4, печатная форма печатается из документа "Заказ клиента". Для примера разобрано програмнное заполнение верхнего и нижнего колонтитулов, а также печать в качестве подложки - логотипа организации (печать картинки на заднем фоне, при этом у логотипа уменьшена яркость и он повернут на 45 градусов).

1 стартмани

30.05.2019    3471    13    DarkPinch222    5    

Поле "Отбор" в управляемой форме используя СКД

Работа с интерфейсом Практика программирования Разработка v8::УФ v8::СКД 1cv8.cf Абонемент ($m)

Пример, который осуществляет отбор ссылок при помощи СКД, макет компоновки создается программно.

1 стартмани

17.05.2019    9080    10    artms    0    

Отладка сложных отчетов на СКД

Практика программирования v8 v8::СКД 1cv8.cf Россия Абонемент ($m)

Расширение для отладки сложных отчетов на СКД (в т.ч. для собираемых программно "на лету") и быстрого перехода к отладке таких отчетов в консоли запросов и отчетов на СКД.

1 стартмани

28.12.2018    27609    93    maxx    58    

Шаблон кросс-таблицы с иерархией на СКД

Инструментарий разработчика Практика программирования v8::БУ v8::СКД БП3.0 Россия Абонемент ($m)

Шаблон для быстрой реализации отчета кросс-таблицы с иерархией и жестко заданной структурой вывода с использованием СКД.

1 стартмани

22.12.2018    9716    8    wizard.ilmir02    3    

Чат на управляемых формах

Практика программирования WEB v8 v8::УФ Абонемент ($m)

Чат для 1С на управляемых формах, для работы в браузере. Возможности: Есть общая комната Можно создавать открытые и закрытые комнаты Переписка между двумя пользователями (беседа) Протестировано на платформе 8.3.12.1714.

2 стартмани

14.12.2018    6075    10    panihinnv    13    

Печать QR кода

Практика программирования v8 1cv8.cf Россия Абонемент ($m)

Простой пример печати QR кода.

1 стартмани

18.11.2018    8707    13    ah7777777    4    

Объединение нескольких печатных форм в один табличный документ

Практика программирования v8 v8::СКД 1cv8.cf Абонемент ($m)

Простое решение, как объединить табличные документы с различной шириной колонок в один и чтобы ничего не разъехалось.

1 стартмани

17.11.2018    13252    7    echo77    6    

Отчет для демонстрации работы с программной расшифровкой СКД

Практика программирования v8::СКД 1cv8.cf Россия Абонемент ($m)

Программное добавление дополнительных пунктов меню в расшифровке и программное формирование отчета-детализации для отчета СКД.

1 стартмани

08.11.2018    7018    6    budidich    1    

Диаграмма Ганта и графическая схема сторонними средствами

Практика программирования v8 v8::УФ 1cv8.cf Абонемент ($m)

Примеры формирования диаграммы Ганта и графической схемы в 1С сторонними средствами.

1 стартмани

01.11.2018    7085    5    no_betrayal    6    

И снова группировка столбцов в СКД

Практика программирования v8 v8::СКД УТ11 Россия Абонемент ($m)

В публикации описано создание отчета "Остатки по складам" с группировкой по строкам и столбцам.

1 стартмани

23.10.2018    11417    1    vasilievil    9    

Параметризованные заголовки полей СКД

Практика программирования v8 v8::СКД 1cv8.cf Абонемент ($m)

Доработанный шаблон типового отчета, который это позволяет менять заголовки полей в зависимости от значений параметров.

2 стартмани

21.09.2018    8320    3    echo77    3    

Преобразование отбора компоновки данных к линейному условию для запроса

Практика программирования v8::БУ БП3.0 Россия БУ Абонемент ($m)

Описание механизма преобразования интерактивного отбора компоновки данных в условие для использования в запросе, данный механизм можно использовать в конфигурации Бухгалтерия предприятия 3.0 и везде в управляемых приложениях, где используется регистр бухгалтерии "Хозрасчетный", также можно адаптировать к любому источнику данных

10 стартмани

10.09.2018    4533    2    scarabey2006    4    

Табель учета рабочего времени или как создать календарик в табличной части документа

Практика программирования Учет рабочего времени Учет рабочего времени v8 УНФ ERP2 УУ Абонемент ($m)

Мой велосипед по созданию документа учета рабочего времени. Обработка предназначена для Управляемых форм, тестировалась на Управление нашей фирмой, редакция 1.6 (1.6.10.44),1С:ERP Управление предприятием 2 (2.4.4.124) платформы (8.3.12.1412),(8.3.11.2867)

1 стартмани

24.08.2018    4252    2    Doreng    2    

Вывод результата отчета СКД в разные табличные документы

Практика программирования Работа с интерфейсом v8::СКД 1cv8.cf Россия Абонемент ($m)

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

1 стартмани

21.08.2018    13175    11    Dipod    4    

[Механизм интерфейса] Интерактивный выбор даты

Практика программирования Работа с интерфейсом v8 v8::УФ 1cv8.cf Абонемент ($m)

Вариант механизма выбора даты для разработки интерфейса под сенсорный монитор. Особенно актуально для разработки терминалов или других подобных систем.

1 стартмани

16.08.2018    11034    8    rpgshnik    18    

Примеры программной работы с СКД, а также программного создания управляемой формы

Практика программирования v8 v8::УФ v8::СКД Абонемент ($m)

Примеры работы с СКД (четыре отчета с использованием сложных выражений), программного создания управляемой формы, а также программное формирование СКД в обработке и другие интересные механизмы на конфигурации "с нуля".

1 стартмани

12.08.2018    6228    27    MaxCreator    0    

Линия тренда в диаграмме на графике "Биржевая свеча"

Практика программирования WEB v8 v8::УФ 1cv8.cf Абонемент ($m)

Отчет демонстрирует, как можно отразить линию тренда на биржевом графике типа "свеча" средствами 1С.

1 стартмани

11.08.2018    6480    19    Scop    3    

Горячая клавиша для открытия ячеек таблиц, отчетов

Практика программирования Работа с интерфейсом v8 1cv8.cf Абонемент ($m)

Задача: Открывать отчет Анализ движений номенклатуры по горячей клавише из документов, где в табличной части есть номенклатура, из списка номенклатуры и из любого отчета или в рмк в поиске товаров.

1 стартмани

10.08.2018    6129    2    leobrn    0    

Часы в 1С

Практика программирования v8 1cv8.cf Абонемент ($m)

Часы в 1с с использованием продвинутого рисования

1 стартмани

25.07.2018    5564    3    Plash    7    

Множество Мандельброта на 1С

Практика программирования v8 v8::УФ 1cv8.cf Абонемент ($m)

Реализация фрактала Множество Мандельброта на платформе 1С 8.3. Работает как в обычных, так и на управляемых формах в любой конфигурации. Прикладного смысла в обработке мало, может использоваться в качестве демонстрации динамической отрисовки в поле табличного документа.

1 стартмани

20.03.2018    4055    3    kylix90    3    

Таблица значений в параметрах СКД

Практика программирования Инструментарий разработчика v8 v8::СКД 1cv8.cf Абонемент ($m)

Шаблон отчета на СКД, где в качестве параметра передаётся таблица значений.

1 стартмани

31.01.2018    9239    22    skydivespb    4    

Пример реализации технологии Блокчейн в 1С 8.3

Практика программирования Блокчейн v8 Абонемент ($m)

Конфигурация предназначена для простого и понятного описания технологии блокчейн. Имеется 2 вида документов: Приходная накладная и Расходная накладная. Их постоянно кто-то создает и пробует изменить. В документе Блокчейн хранится контрольная сумма каждого документа, и их тоже какое-то чужое лицо может изменить и поправить. Так в базе 1С хранится информация с нулевым уровнем доверия.

10 стартмани

26.01.2018    10311    1    astracrypt    2    

Пример решения расчетной задачи с табелем (для 1С:Специалист)

Практика программирования Решение задач на 1С:Специалист Учет рабочего времени Учет рабочего времени v8 v8::СПР УУ Абонемент ($m)

Условие задачи собрано из нескольких экзаменационных задач и служит общим примером решения.

1 стартмани

25.01.2018    16591    7    perepetulichka    3    

Подпись в мобильном приложении

Практика программирования Мобильная разработка v8::Mobile 1cv8.cf Абонемент ($m)

Подпись клиента в вашем мобильном приложении.

1 стартмани

04.01.2018    14744    45    onec.developer    7    

Справочная библиотека программ и подпрограмм 1С

Практика программирования v8 1cv8.cf Россия Абонемент ($m)

Данная небольшая статья (и обработка для использования в практике своей работы) предлагается вниманию начинающим и опытным программистам 1С в качестве небольшого пособия по освоению программирования на платформе 1С. Есть такая книжка «1С: Предприятие Опыты программирования», написал ее небезысвестный в узких одинэсовских кругах О. В. Бартеньев (издательство «Диалог-МИФИ», 2004 г.), так вот, при внимательном ее изучении у пытливого пользователя возникает множество вопросов. Предлагаемая обработка позволяет решить некоторые из них.

1 стартмани

06.10.2017    9802    8    vik2006    12