FrameEdit - A Frame Editor Composer Plug-in
version 1.0b1
by Jack Palevich
Introduction
HTML frames allow you to divide your web page up into separate sections.
Each section is called a "frame". Frames are arranged into a hierarchy
using FRAME and FRAMESET tags. A page with n frames is actually
composed of n+1 separate html pages. There is one page for each
frame, plus a master frameset page to hold the FRAME and FRAMESET tags.
FrameEdit is a Composer Plug-in for creating and editing frameset pages.
It allows you to:
-
turn an ordinary page into a frameset page.
-
add and remove frames.
-
inspect and change the properties of frames and a framesets.
-
rearrange frames by using drag-and-drop.
-
remove the frames from a page, turning it back into a plain page.
Installing FrameEdit
Install FrameEdit by copying the cpFramEd.jar file to your Netscape Communicator
Plugin directory. You will have to restart Communicator in order to use
the plug-in. (If you are reading this using the on-line help, then cpFramEd.jar
has probably already been installed. ;-) )
Invoking FrameEdit
Invoke FrameEdit by choosing the "Tools:Edit HTML:Frame Editor" menu item
from Composer. If that menu item is missing, check if you have installed
the cpFrameEd.jar file.
The User Interface
The FrameEdit user interface consists of a large window that contains a
menu bar, a Frameset window, and a Frameset Property window.
The menu bar allows you to perform various operations on the frameset.
The Frameset window shows you a mock-up of the frameset document. If the
document has no frames, you will just see a blank gray rectangle with the
message "No frames in this document".
The Frameset properties window shows you the properties of the currently
selected frame (or frameset.)
Adding Frames to a page
To add a frames to a page, invoke the FrameEdit plug-in, and then chose
either the "Edit:Split |" or "Edit:Split -" menu items.
Removing Frames from a page
To remove a frame from the page, select it, and then delete it. You can
delete the frame by pressing the Delete key, or by using the "Edit:Delete"
menu item.
Using the Mouse
You can use the mouse to:
-
Select frames and framesets by clicking on them. To select a frame,
click on it. To select a frameset, click on the narrow gray area around
a frame. The selected item will be outlined in dark blue.
-
Rearrange frames and framesets by dragging. To drag an item, click
on it as if you were selecting it. Keep the mouse button down, and drag
the mouse. When the mouse pointer is over another frame or frameset, the
destination frame or frameset will light up. Releasing the mouse at this
point will swap the source and the destination items. This makes it fairly
easy to rearrange the frameset hierarchy.
-
Resize the frames by dragging the borders between frames. To resize
a frame, click on the border between two frames and drag. Note: It is not
possible to delete a frame by dragging. (All you can do is set it's size
to be zero.) In order to delete a frame you have to select it and then
and delete it using the "Edit|Delete" menu item or the Delete key.
-
Test the frameset by resizing the Frameset window. As you change the
size of the Frameset window, you can see how the changing amount of space
is allocated to the different frames.
Using the Keyboard
You can use the keyboard to perform some of the editing tasks:
-
Enter numeric and textual information into the Frame Properties window.
-
Use the arrow keys to navigate around the different items in the frameset.
-
up - acts like the "Select:Parent" menu item.
-
left- acts like the "Select:Previous Sibling" menu item.
-
right- acts like the "Select:Next Sibling" menu item.
-
down - acts like the "Select:First Child" menu item.
-
Delete - acts like the "Edit:Delete" menu item.
Menus
File menu
Cancel
Cancel cancels the current frame editing session. Use it when you want
to cancel the changes you've made to the document. This operation is not
undoable.
OK
OK finished the current frame editing session. Use it when you are done
editing the frames, and you want to keep your changes. (The changes won't
actually be saved until you save the document using Composer.)
Edit menu
Undo
Choosing "Undo" will undo the most recent change you've made to the frame
set. Undo is a toggle: Choosing Undo twice in a row will "Redo" the change.
Delete
Delete will delete the currently selected Frame or Frameset. If you delete
the top-most frameset, you will have removed all the frames from a document,
turning it back into a normal document.
Split |
"Split |" will split the currently selected frame or frameset in half vertically,
which adds another frame.
Split -
"Split -" will split the currently selected frame or frameset in half horizontally,
which adds another frame.
Select menu
Top
Top selects the top frameset. (That is, the frameset that's at the top
of the hierarchy.) If there are no frames, or if you've already selected
the top frameset, this menu item has no effect.
Parent
Parent selects the frameset that's the parent of the currently selected
item. If there are no frames, or if you've already selected the top frameset,
this menu item has no effect.
Previous Sibling
Previous Sibling selects the item that's the previous sibling of the currently
selected item. Previous means to the left, or towards the top, depending
upon whether this is a horizontal or a vertical frameset. If the currently
selected item is the first item in a frameset, this command has no effect.
Next Sibling
Next Sibling selects the item that's the next sibling of the currently
selected item. Next means to the right, or towards the bottom, depending
upon whether this is a horizontal or a vertical frameset. If the currently
selected item is the last item in a frameset, this command has no effect.
First Child
First Child selects the item that's the first child of the currently selected
item. The first child is the leftmost, or the topmost child, depending
upon whether this is a horizontal or a vertical frameset. If the currently
selected item is a frame (and so it has no children), this command has
no effect.
Help menu
About FrameEdit...
About FrameEdit... brings up the help for FrameEdit. (i.e. it brings up
this display.)
Properties
The "Frameset Properties" window displays the properties for the currently
selected item. When there are no frames in the document, this window is
blank.
Properties common to both Frames and Framesets
Many properties are common to both Frames and Framesets. Some properties
are inherited by children.
Frame Size
Frame Size controls how the parent frame's space is allocated to each child.
For items in a horizontal frameset, the size is the width. For items in
a vertical frameset, the size is the height. (The opposite dimension is
inherited from the parent frameset.) You can specify the frame size using
three different techniques:
-
Pixels. This is an absolute number of pixels to allocate to the item.
This is specified as a plain number, like 150.
-
Percent. This is a percentage of the 100% of the space available. This
is specified as a number followed by a percent sign, like 15%.
-
Ratio. This is a portion of the space available. This is specified
as a number followed by a asterisk, like 15*. If the number is 1, then
the number can be omitted. Ratio is like percent, except that the space
allocated is the free space, after all the children with pixel or percent
sizes get their share. If there is more than one child with a ratio, then
the space allocated to each child is proportional to the total of all the
ratio values in the same frameset. (An example: If there is a frameset
with two children, and one child has a size of 2* while the other has a
size of 3*, then the first child will get 2 / (2 + 3) = 2/5 = 40% of the
space, while the second child will get 3 / (2 + 3) = 60% of the space.
When a frameset page is laid out the total space is given to the topmost
frame, which divides it up among its children. Each child frameset, in
turn, divides its allocated space among its own children. When there isn't
enough space to go around, a compromise is made.
Margin Width
The horizontal margin, in pixels, between the edge of the frame and the
content. The default is browser dependent.
Margin Height
The vertical margin, in pixels, between the edge of the frame and the content.
The default is browser dependent.
Visible Border
If this is checked, then the border between this frame and the neighboring
frame is drawn. If this is not checked, and the neighboring frame's Visible
border property is not checked either, then no frame is drawn. So, to make
sure that a particular border is not drawn, you must select the items on
both sides of the border and uncheck the "Visible Border" checkbox.
Border Size
The thickness of the border, in pixels. The default is browser dependent.
The border size of a Frame affects the size of the border to the right
(or bottom) of the frame. The border size of a Frameset sets the default
border size of all that frameset's children.
Border Color
The color of the border. The default is browser dependent. To set the border
color, check the check-box and click on the color well. This will bring
up a color picker. Choose the color, and then drag-and-drop the color from
the color picker's color well into the Border Color color well. A frame's
border color affects the color of the borders to the right and below that
frame.
Extra HTML
This is a text field. You can enter any extra HTML properties that you
want to associate with this item. This allows you to create and edit html
properties that are unknown to the Frame Editor.
For implemetation reasons, you must use the "Enter" key to finish editing
the "Extra HTML" text field.
Properties specific to Frames
Name
This is the name of the frame. The name is primarily useful as the value
of some link's TARGET property. For example, it is common to set up a two-frame
frameset, with one frame named "Index", and the other named "Content".
And all the links in the Index page have TARGET=Content properties. When
the index links are activated, the content frame changes to display the
linked document.
Source URL
This is the URL of the page who's contents are displayed in the frame when
the frameset page is first opened. It is typical to use a relative URL
rather than an absolute URL, so that the frameset page and its associated
frame pages can be moved around as a group.
Scrolling
This pop-up menu controls whether or not scroll bars appear on the frame.
There are three possible states:
-
Yes - Scroll bars always appear.
-
No - Scroll bars never appear.
-
Auto - Scroll bars appear only if they are needed in order to display
the entire contents of the frame.
Resizable
If this is checked, the end-user can resize the frame using use the mouse.
(A border must be visible in order to be resizable.)
Frequently Asked Questions
Why are Frames so complicated?
Frames were originally designed very quickly, without very much experimentation.
Then, they were extended by competing browser vendors, without planning
or cooperation. Finally, they have not been well documented. Despite this,
they are a valuable tool for organizing the presentation of information.
Hopefully, editors like FrameEdit will make frames easier to use.
Why can't I see my Frameset in the Composer window?
Composer is a page editor, so it cannot display more than one HTML page
at a time. This is a limitation of Composer that may be addressed in a
future release. For now, Composer shows you the NOFRAMES HTML for the page.
The NOFRAMES HTML is what is seen by browsers (such as Lynx or Netscape
Navigator 1.0) that do not understand the FRAMESET and FRAME tags.
Why can't I see my changes when I browse my page in the Navigator?
In order to get the Communicator's Navigator window to update to the latest
version of an edited frameset, you have to hold the Shift key down and
press the reload button.
What should I put into the NOFRAMES text?
Traditionally, people put in messages that encourage the user to obtain
a frames capable browser. Although this may have been appropriate several
years ago, it is no longer the right thing to do. Anyone visiting your
site without a frames capable browser probably has a good reason for doing
so. A good reason might be that they are blind, and are using a text-based
browser. Or they may be using a TV-based or hand-held web browser that
does not have the screen resolution to properly display a frame set. In
any case, it is better to give the user some useful information than to
tell them to switch to a frames capable browser.
If one of your frames is an index, then the best thing to put in the noframes
text is a link to the index frame. That way, the frameless user can click
on the link, go to the index page, and click again to go to one of your
content pages.
An alternative would be to have the NOFRAMES text contain a copy of the
index page. While this is better for the user, it is more difficult to
keep the two copies of the index page synchronized.
I think some of my frames' sizes are really messed up - how can I fix
them?
If you accidentally set the frame size of an item to be really small (say
0 pixels) or really large (10000 pixels), it can lead to hard-to-understand
results. If this happens, you can use the "Select" menu items to navigate
through your frames, and manually reset all the sizes to something reasonable.
Start by selecting the Top, then work your way around your tree, resetting
the sizes to reasonable values as you go.
How long did it take you to write FrameEdit?
It took me about a month (25 days) of nights and weekends. I started it
on my winter holiday, and finished the first beta just before taxes were
due in April. I used Symantec Cafe 1.5.1 and Symantec Visual Cafe 1.0 develop
it. The dialogs were laid out in Netscape IFC Constructor. This HTML help
was (of course) written in Composer. The Netscape Internet Foundation Classes
made some parts (the drag & drop, the HTML help, and the property dialog
boxes) pretty easy to do.
How do I localize FrameEdit?
FrameEdit is completely localizable. When the plug-in is run, it searches
for the most specific set of UI information for the current country. In
order to support a new local, you must provide two files: FrameEditResourceBundle_XX.class
and frameDialogs_XX.plana. (Where XX is the SO country code for the new
country.) Use a Java IDE to create FrameEditResourceBundle_XX.class. Use
Netscape IFC Constructor to create frameDialogs_XX.plana. Then place these
two files intot he jar file in the directory netscape/plugin/composer/frameEdit,
and you're done.
How can I get the source code?
It's included in the cpFramEd.jar file. Make a copy of cpFramEd.jar, rename
the copy to source.zip, unzip it (being careful to preserve the directory
hierarchy), and there you go.
Known Bugs
-
If the frame size is specified using the ratio ('*') syntax, then resizing
the frames with the mouse will produce unpredictable effects.