Interactive UI for XML Editing

Project Overview

Client needed a straightforward and intuitive user interface (UI) developed primarily in HTML, JavaScript, and CSS to modify an XML document. The XML contained data representing weekly activities and their associated parameters. The UI was geared towards facilitating the editing of daily activities, with features such as choosing a day of the week, adjusting starting hours, and selecting appropriate media options. Moreover, depending on the chosen media type, certain input options like URL text boxes or specific configurations would dynamically appear.

Project Highlights

Objective

Develop a web-based interface that integrates seamlessly with the provided XML structure, offering users an intuitive platform to easily modify and save their daily activity data.

Key Features

  • Day Selection: Users can pick any day from Sunday to Saturday and modify the activities associated with that day.
  • Activity Settings: Each activity offers sound parameters that users can toggle between "off" and "on".
  • Dynamic Media Options: A dropdown menu allows users to select the type of media associated with an activity.
  • Contextual Input Fields: Depending on the chosen media, specific input fields or options dynamically appear. For instance, selecting "Amdocs_Youtube" triggers a text box for users to input a link, while "Power_Point" unveils other relevant configurations.

Technologies Used