Object adaptation of Drag and Drop technology for web-system interface components

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.