Object Adaptation of Drag and Drop Technology for Web-System Interface Components
No Thumbnail Available
Date
2021
Authors
Journal Title
Journal ISSN
Volume Title
Publisher
СНУ ім. В. Даля
Abstract
Today, in the development of information systems, cloud technologies are often used for remote computing and data processing. There are web technologies, and on their basis, libraries and frameworks have been developed for creating web applications and user interfaces designed for the operation of information systems in browsers. Ready-made JavaScript libraries have been developed to add drag and drop functionality to a web application. However, in some situations, the library may not be available, or there may be overhead or dependencies that the project does not need to use it. In such situations, an alternative solution provides the functionality of APIs available in modern browsers. The article discusses the current state of the methods of the Drag and Drop mechanism and proposes a programmatic way to improve the interface by creating a class for dragging and dropping elements when organizing work in multi-user information web systems. Drag and Drop is a convenient way to improve the interface. Grabbing an element with the mouse and moving it visually simplifies many operations: from copying and moving documents, as in file managers, to placing orders in online store services. The HTML drag and drop API uses the DOM event model to retrieve information about a dragged element and update that element after the drag. Using JavaScript event handlers, it is possible to turn any element of the web system into a drag-and-drop element or drop target. To solve this problem, a JavaScript object was developed with methods that allow you to create a copy of any object and handle all events of this object aimed at organizing the Drag and Drop mechanism. Basic algorithm of Drag and Drop technology based on processing mouse events. The software implementation is considered and the results of the practical use of object adaptation of the Drag and Drop technology for the interface components of the web system - the medical information system MedSystem, in which the application modules have the implementation of the dispatcher and the interactive window interface are presented. In the "Outpatient clinic" module, the Drag and Drop mechanism is used when working with the "Appointment sheet". In the "Hospital" module of the MedSystem medical information system, the Drag and Drop mechanism is used in the "List of doctor's appointments". The results of using object adaptation of Drag and Drop technology have shown that this mechanism organically fits into existing technologies for building web applications and has sufficient potential to facilitate and automate work in multi-user information systems and web services.
Сьогодні при розробці інформаційних систем хмарні технології часто використовуються для віддалених обчислень та обробки даних. Існують веб-технології, а на їх основі розроблені бібліотеки та фреймворки для створення веб-додатків та користувальницьких інтерфейсів, призначених для роботи інформаційних систем у браузерах. У статті розглядається сучасний стан методів для реалізації механізму перетягування компонент та пропонується програмний спосіб вдосконалення інтерфейсу шляхом створення класу для елементів перетягування при організації роботи багатокористувацьких інформаційних веб-системах. ag'n'Drop - це зручний спосіб покращити інтерфейс. Захоплення елемента мишкою та його візуальне переміщення спрощує багато операцій: від копіювання та переміщення документів (як у файлових менеджерах) до розміщення замовлень в послугах Інтернет-магазину. API перетягування HTML використовує модельї DOM для отримання інформації про перетягнутий елемент та оновлення цього елемента після перетягування. За допомогою обробників подій JavaScript можна перетворити будь-який елемент веб-системи в елемент Drag'n'Drop. Для вирішення цієї проблеми були розроблені об'єктні методи JavaScript, які дозволяють створювати копію об'єкта та обробляти всі події, спрямовані на організацію механізму Drag'n'Drop. Розглянуто програмну реалізацію та представлено результати практичного використання об'єктної адаптації технології Drag and Drop для компонентів інтерфейсу веб-системи - медичної інформаційної системи MedSystem. Результати використання об’єктної адаптації технології Drag and Drop показали, що цей механізм органічно вписується в існуючі технології побудови веб-додатків і має достатній потенціал для полегшення та автоматизації роботи в багатокористувацьких інформаційних системах та веб-сервісах.
Сьогодні при розробці інформаційних систем хмарні технології часто використовуються для віддалених обчислень та обробки даних. Існують веб-технології, а на їх основі розроблені бібліотеки та фреймворки для створення веб-додатків та користувальницьких інтерфейсів, призначених для роботи інформаційних систем у браузерах. У статті розглядається сучасний стан методів для реалізації механізму перетягування компонент та пропонується програмний спосіб вдосконалення інтерфейсу шляхом створення класу для елементів перетягування при організації роботи багатокористувацьких інформаційних веб-системах. ag'n'Drop - це зручний спосіб покращити інтерфейс. Захоплення елемента мишкою та його візуальне переміщення спрощує багато операцій: від копіювання та переміщення документів (як у файлових менеджерах) до розміщення замовлень в послугах Інтернет-магазину. API перетягування HTML використовує модельї DOM для отримання інформації про перетягнутий елемент та оновлення цього елемента після перетягування. За допомогою обробників подій JavaScript можна перетворити будь-який елемент веб-системи в елемент Drag'n'Drop. Для вирішення цієї проблеми були розроблені об'єктні методи JavaScript, які дозволяють створювати копію об'єкта та обробляти всі події, спрямовані на організацію механізму Drag'n'Drop. Розглянуто програмну реалізацію та представлено результати практичного використання об'єктної адаптації технології Drag and Drop для компонентів інтерфейсу веб-системи - медичної інформаційної системи MedSystem. Результати використання об’єктної адаптації технології Drag and Drop показали, що цей механізм органічно вписується в існуючі технології побудови веб-додатків і має достатній потенціал для полегшення та автоматизації роботи в багатокористувацьких інформаційних системах та веб-сервісах.
Description
Keywords
object adaptation, Drag and Drop, information system, адаптація об’єкта, інформаційна система
Citation
Ratov D. V. Object Adaptation of Drag and Drop Technology for Web-System Interface Components. Вісник Східноукраїнського національного університету імені Володимира Даля. 2021. № 4 (268). С. 7-12.