Mike Judd
Scott Cuddeback
Our LiveHTML editor is an environment we created to allow for the editing and viewing of html files. It uses a split pane frame to allow for viewing and editing of both simulaneously. It also allows the user to, while viewing the HTML, select any text that they would like and find within the source and have selected.
You begin by viewing the file chooser, which opens up when you first start the program. This allows the user to open an HTML file as well as start new.
When selecting new, the user is given a template for which they can begin editing.
When selecting open, the user is shown a standard open dialog box.
This adds to the file chooser the directory from which the file originates. The files are then displayed in a tree, using the directories as their parents.
If the user wishes, they may edit mutlipe HTML files at one time. This allows for the copying and pasting of information within all the files.
Users are able to save their work as they progress using the save option, located in the file menu.
The next part of the program gives the user the ability to select text while viewing simultaneously viewing both versions of the view and instantly move back to that point in the source, with the text highlighted. This is very useful for beginning programmers especially as they may not know where to begin as far as editing source to solve their problems. This grants a very simple interface to help facilitate that.
And when the user releases the mouse button...
If a piece of text appears more than once within an HTML file, the program will find the correct instance of it. This is done through multiple pass parsing. An example is this, where the word "Paste" appears twice in the document.
And the source
Also, if the selected word appears inside a tag, such as "body" or "head" it will not select the tag but instead move on to the correct occurrance of the word within the source.
To exit, the user only has to select "Exit" from the file menu. This closes all open files as well.
Three issues that we solved were creating the split pane, creating the tree view of the file structure and creating the selection implementation.
Selection:
The code used for the selection utilizes methods such as getSelection, getSelectionStart and getSelectionEnd. It searches twice through the source, once to find the area that the text resides in and then again to find the exact position. It is then selected using the beginning, end and length of the selection in the Html. I learned that even things that seem difficult at first can be accomplished with enough time. In the beginning I had little idea of how to solve this problem, but through testing and failed attempts I learned ways to do it.
Split Pane:
The problem we wanted to address was the processes a user has to endure to see how changes on a webpage look.
A user has to save the html file in the editor, open an internet browser, and load the webpage in order to see any changes they have made.
What we did was integrate the processes, giving the user a 'live' html editor, that is, you see changes as you make them, in realtime.
We accomplished this by using a document model, and a document listener. By listening to the document model, we caught whenever a change was made, 'refresh' the viewer pane, and the changes are seen.
This project shows the importance and usefulness of models and listeners.
File Tree Structure:
The problem we wanted to address was providing an easy interface in which the user can select which files they wish to view/edit.
We originally tried just using a JFileChooser to open up one file at a time. This did not work if you wanted to work on another document. So we came up with a JTree implementation.
The code we used involved a JFileChooser, JTree, and addNode() method. When a user selects what file they want to use, it checks the JTree if the file is there. If not, it adds it into the proper directory in the JTree. Once you select an html file, it opens a new LiveHTML application.
This part of the project showed how JTree's can be used, how to determine what OS you are using, and how the functionality of how JTree's work.