© 2011, Martin Rinehart
Save the output JSON (on left) to a text file for future use.
To reuse your saved JSON, copy it over the input area (on right) and press tab.
Frame It! was designed and coded 20 April, 2011, by Martin Rinehart (MartinRinehart at gmail dot com). Version 2 was designed and programmed later that week after the author saw what he really wanted.
Frame It! is hereby licensed to single users to generate nicely framed displays of their graphics. Use screenshots of your framed graphics (not Frame It!) to display the framed graphics on the web. Backlinks are certainly welcome. Email MartinRinehart at gmail dot com for multi-user licenses.
Please install (view Source and File/Save As...) Frame It! on your local machine. It incorporates all dependent script so a single file is all you need. Designers: any competent frontend engineer can show you how. It's really no trouble. Installing it where you keep your images will save you lots of trouble.
Colors: All colors are specified by six hex digits. These are HTML color specs, without the "#" prefix. Ask a good frontend engineer to explain them. (Absent professional help, research "HTML colors" on the web.)
Widths: Four different "width" specifications are used. All are specified by decimal numbers of pixels.
<img>tag. Zero is almost always correct.
Image Addresses: Setting a path and file name to your images can be tricky. For graphics already on your site(s), use an absolute path (one starting with "http://"). For graphics on a local machine, install Frame It! in the same folder as the graphics. Second best is to install on the same disk in a folder which can easily reach the graphics using relative addresses. For other graphics on a local machine use your browser to File/Open ... the image file. Then copy the address from your browser's addresss bar, including funny stuff like "file://localhost/". Leave the file name blank if it is included in the path. Remember, addresses in HTML use forward slashes even running on Windows.
The Validate Page checks all inputs for valid formats. This check is automatically performed prior to showing the View, JSON or Code pages, so clicking this button is normally redundant.
The View Page lets you examine the image in its frame. Enjoy!
The top-left corner of the visible frame is location 0, 0 in the generated code.
If you store your JSON objects in a file maintained with a text editor the sophistication of your specifications database is limited only by your imagination.
(Ask a competent frontend engineer for help here.)
Note: The Your Code output, may be cut/pasted into your pages as needed. You may frame a whole gallery full of images if you like. (See the JSON Page to create a database of framed images.)
MartinRinehart at gmail dot com. "Brevity is the sole of wit." (Shakespeare's Polonius, Hamlet, Act 2, scene 2.)