The FLP Image Viewer1

The FLP image viewer is a Javascript-based application for viewing deep-zoom image collections, called "folders." Currently it is used for viewing Feynman's FLP Notes, the FLP lecture Photos, and the FLP Original Course Handouts.2 The image viewer provides two modes for viewing images. In "multi-image viewing mode" one can select any subset of images from the folder, which can be auto-arranged in a view-optimized grid, or arranged arbitrarily by the user. In "single image viewing mode" one image in the folder is viewed at a time, and the user can quickly sequence through the images in forward or reverse order.

Muti-image viewing mode

When the image viewer application opens it is in multi-image viewing mode. The window is divided into two areas separated by a vertical slider control and underscored by a horizontal slider control.

The area on the left, called "folderview," displays the entire contents of a folder. The pages can be scrolled up and down by dragging them with the pointer, turning the mouse wheel, or pressing up/down arrow keys. The vertical slider control can be used for rapidly scrolling to any image in the folder, while the horizontal slider can be used to make folderview wider or narrower.

The area on the right is called "imageview." Clicking on an image in folderview selects it for viewing in imageview. A green frame is drawn around the selected images. [Note: Clicking on a selected image in folderview de-selects it and removes it from imageview.]

Images in imageview can be deep-zoomed for detailed examination. Zooming is effected by clicking (for zoom-in, shift-click for zoom-out), or mouse wheel movements. (There are also buttons for zooming. The imageview buttons are described below.) Panning is effected by dragging with the mouse, or by using arrow keys.

At the top of folderview there is a set of four buttons (that fade when not in use). Left-to-right the folderview buttons are 'fullscreen', 'clear', 'imageids', and 'multi/single'. The multi/single button switches between multi-image viewing mode and single-image viewing mode, which is described below.

Clicking on the imageids button puts image identifiers in the upper-right corners of the images in folderview. Image identifiers are composed of two parts, a folder ID and an image number, separated by a colon.

Clicking the fullscreen button provides a "big picture" of the entire folder, with selected images framed in green.

In fullscreen folderview images can be deep-zoomed for close examination.

They can be selected/deselected by clicking on them.

After exiting fullscreen mode the selected images are displayed in imageview.

In multi-image mode imageview includes the following buttons. From left to right: 'zoom-in' and 'zoom-out,' 'go-home', 'fullscreen', 'rotate-left', 'rotate-right', 'originals/enhanced' [FLP notes only], 'imageids', and 'free/constrain'.3

Clicking on the imageids button puts image identifiers in the upper-right corners of the images in imageview. [The originals/enhanced button, present only when viewing Feynman's FLP Notes, toggles between readability-enhanced versions of the notes images and the originals.]

The folderview clear button clears all selections, emptying imageview.

When the application opens and the user selects multiple images, they are automatically arranged edge-to-edge in a grid in imageview. The images will rearrange themselves to fit the dimensions of imageview as best they can. This mode of operation is called "constrained." Below, seven images are selected while the size/shape of the window is changed several times:

The user can also choose to control the arrangement of the images. Images in imageview can be moved by shift-dragging them. After doing so, imageview operates in "free" mode and images are no longer automatically arranged. Clicking the free/constrain button toggles between the two modes.

Single image viewing mode

Single image viewing mode is activated by clicking on the multi/single button in folderview. In this mode one image at a time is shown in pageview. Clicking on an image in folderview selects the image displayed in pageview.

In single image viewing mode the free/constrain button in pageview is replaced by 'previous' and 'next' buttons.

The user can rapidly switch from the currently displayed image to the next or previous one in the folder by using the mouse wheel or up/down arrow keys in folderview, or by using the next and previous buttons or PgUp/PgDown keys in pageview.

  1. The image viewer application can make high bandwidth, processing and memory demands. It is intended for use on desktop and notebook computers. We can not guarantee it will work on mobile platforms.
  2. When viewing Feynman's FLP Notes the folders correspond to folders in the Caltech Archives Feynman Papers collection. FLP Lecture photos use original lecture sequence numbers for their folder identifiers, which correspond to sets of 35 mm slides kept in the Caltech Archives photo collection.
  3. Additionally, a 'help' button that links to this page appears in the top right corner of imageview. It looks like '?'.