Skip to content

Commit

Permalink
Fixed up add-ons, and added documentation back.
Browse files Browse the repository at this point in the history
  • Loading branch information
PeteCA committed Mar 31, 2017
1 parent d5bdeba commit f3c418e
Show file tree
Hide file tree
Showing 133 changed files with 2,037 additions and 30 deletions.
72 changes: 72 additions & 0 deletions Documentation/add_ons.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
<HTML>
<HEAD>
<TITLE>
ArtPaint: Add-ons
</TITLE>
</HEAD>
<BODY bgcolor="ffffff">
<DIV ALIGN=CENTER>
<IMG SRC="./images/top_bar.gif"><BR>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=500>
<TR>
<TD>
<IMG SRC="./images/transparent_dot.gif" WIDTH=100 HEIGHT=50>
</TD>
<TD COLSPAN=2>
<IMG SRC="./images/transparent_dot.gif" WIDTH=400 HEIGHT=50>
</TD>
</TR>
<TR>
<TD>
<TD>
<H2>Add-ons</H2>
Much of ArtPaint's functionality comes through add-ons. Add-ons are small programs that ArtPaint can load to do some specific job. Everyone can make their own add-ons with the help of ArtPaint Add-on Developer Kit (to be released soon), and some knowledge of programming the BeOS. The add-ons can be accessed through <A HREF="./paint_window.html">paint-window</A>'s Add-Ons-menu. Currently all add-ons affect only one <A HREF="./layers.html">layer</A> at a time.
<!--H3>Installing new add-ons</H3>
When new add-ons come available they can be installed by copying the add-on-file to either of following locations:
<UL>
<LI>To ArtPaint's folder's subfolder named add-ons
<LI>or to /boot/home/config/add-ons/ArtPaint/
</UL>
<P-->
<H3>Descriptions of the included add-ons</H3>
This part briefly describes the add-ons that were included with the BeOS version.
<b>Currently it doesn't quite match the ones available as yet in Haiku.</b>
<DL>
<DT>Blur
<DD>Opens a window that allows you to adjust the blurriness of the image with a slider. The blur is reflected on the image when you let go of the slider.
<DT>Brightness
<DD>Opens a window that allows you to adjust the brightness of the image with a slider. The change in brightness is reflected on the image right when you move the slider.
<DT>Color Balance
<DD>Opens a window that has three sliders for controlling the amount of red, green and blue color in the image. The change in color-balance is reflected in the image at the moment you move the sliders.
<DT>Contrast
<DD>Opens a window that has a slider for adjusting the contrast of the image. The change in contrst is reflected in the image right away.
<DT>Stretch Histogram
<DD>Improves the contrast of the image by stretcing its histogram to maximum possible length. If the image contains pure black and pure white this operation will do nothing.
<DT>Dispersion
<DD>Changes the pixels positions in the image randomly a little bit to create a "dispersed" look.
<DT>Emboss
<DD>Creates an emboss effect on the image.
<DT>Greyscale
<DD>Converts the image into greyscale.
<DT>Halftone
<DD>Creates a halftone-pattern on the image. The foreground-color is used to color the dark parts and the background-color is used to color the light parts.
<DT>Negative
<DD>Creates a negative image of the picture by inverting every color. The inversion is done in RGB-color-space
<DT>Oil
<DD>Creates a pattern on the image that tries to simulate the effect of painting the image with brush strokes.
<DT>Saturation
<DD>Opens a window that contains a slider for controlling the saturation of the image. The effect is reflected on the image right when the slider is moved.
<DT>Twirl
<DD>Makes a twirl-effect on the image. Opens a window with two sliders for controlling the size and the direction of the twirl. The center for the twirl can be set by clicking on the image and dragging around.
<DT>Wave
<DD>Creates a circular wave effect on the image. Opens a window that controls sliders for controlling the length and the strength of the wave. The wave center can be adjusted by clicking on the image with the mouse and dragging around.
<DT>PerlinWood
<DD>Creates a wood-like texture over the image.
</DL>

</TABLE>
<IMG SRC="./images/bottom_bar.gif"><BR>
</DIV>

</BODY>
</HTML>
51 changes: 51 additions & 0 deletions Documentation/airbrush.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
<HTML>
<HEAD>
<TITLE>
ArtPaint: Airbrush-tool
</TITLE>
</HEAD>
<BODY bgcolor="ffffff">
<DIV ALIGN=CENTER>
<IMG SRC="./images/top_bar.gif"><BR>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=500>
<TR>
<TD>
<IMG SRC="./images/transparent_dot.gif" WIDTH=100 HEIGHT=50>
</TD>
<TD COLSPAN=2>
<IMG SRC="./images/transparent_dot.gif" WIDTH=400 HEIGHT=50>
</TD>
</TR>
<TR>
<TD>
<TD>
<H2>Airbrush-tool</H2>
The airbrush-tool simulates an airbrush. The tool is used by pressing the mouse-button over the image and moving the mouse to locations where the airbrush should be applied.
<H3>Settings</H3>
Figure 1 shows the contents of the tool-setup-window when it is displaying the setup for airbrush-tool.
<DIV ALIGN=CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>
Figure 1: Setup view for the free line -tool.
</CAPTION>
<TR>
<TD><IMG SRC="./images/airbrush.gif">
</TABLE>
</DIV>
<P>
<DL>
<DT><STRONG>Size</STRONG>
<DD>This controls how big area the spray from the airbrush will cover. The area is circular and this controls its width.
<DT><STRONG>Flow</STRONG>
<DD>This controls how much paint will come from the airbrush. The bigger this value is, the faster the paint comes out of the airbrush.
<DT><STRONG>Airbrush</STRONG>
<DD>When this option is selected the airbrush will cover the surface evenly.
<DT><STRONG>Spray</STRONG>
<DD>When this option is selected the airbrush will form of individual dots that cover the surface.
</DL>
</TABLE>
<IMG SRC="./images/bottom_bar.gif"><BR>
</DIV>

</BODY>
</HTML>
47 changes: 47 additions & 0 deletions Documentation/blur_tool.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<HTML>
<HEAD>
<TITLE>
ArtPaint: Blur-tool
</TITLE>
</HEAD>
<BODY bgcolor="ffffff">
<DIV ALIGN=CENTER>
<IMG SRC="./images/top_bar.gif"><BR>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=500>
<TR>
<TD>
<IMG SRC="./images/transparent_dot.gif" WIDTH=100 HEIGHT=50>
</TD>
<TD COLSPAN=2>
<IMG SRC="./images/transparent_dot.gif" WIDTH=400 HEIGHT=50>
</TD>
</TR>
<TR>
<TD>
<TD>
<H2>Blur-tool</H2>
The blur-tool is used to blur parts of the image. The tool is used by pressing the mouse-button over the image and moving the mouse around to the parts that need to be blurred.
<H3>Settings</H3>
Figure 1 shows the contents of the tool-setup-window when it is displaying the setup for the blur-tool.
<DIV ALIGN=CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>
Figure 1: Setup view for the blur-tool.
</CAPTION>
<TR>
<TD><IMG SRC="./images/blur_tool.gif">
</TABLE>
</DIV>
<P>
<DL>
<DT><STRONG>Size</STRONG>
<DD>This controls the size of the area that is blurred at once. The area is circular and this controls its diameter in pixels.
<DT><STRONG>Continuous</STRONG>
<DD>When this option is selected the image will be blurred all the time the mouse-button is held down. Otherwise the image will be blurred only when the mouse is moved (with the mouse-button down).
</DL>
</TABLE>
<IMG SRC="./images/bottom_bar.gif"><BR>
</DIV>

</BODY>
</HTML>
68 changes: 68 additions & 0 deletions Documentation/brush_tool.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
<HTML>
<HEAD>
<TITLE>
ArtPaint: Brush-tool
</TITLE>
</HEAD>
<BODY bgcolor="ffffff">
<DIV ALIGN=CENTER>
<IMG SRC="./images/top_bar.gif"><BR>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=500>
<TR>
<TD>
<IMG SRC="./images/transparent_dot.gif" WIDTH=100 HEIGHT=50>
</TD>
<TD COLSPAN=2>
<IMG SRC="./images/transparent_dot.gif" WIDTH=400 HEIGHT=50>
</TD>
</TR>
<TR>
<TD>
<TD>
<H2>Brush-tool</H2>
The brush-tool uses user-defined brushes to paint on the image. The tool is used by clicking on the image and moving the mouse to produce a free-hand line.
<H3>Settings</H3>
Figure 1 shows the contents of the tool-setup-window when it is displaying the setup for brush-tool.
<DIV ALIGN=CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>
Figure 1: Setup view for the brush-tool.
</CAPTION>
<TR>
<TD><IMG SRC="./images/brush_tool.gif">
</TABLE>
</DIV>
<P>
The image at left top is preview of the brush. The red line beneath the brush shows the scale of the preview. If the line is full width, the brush is in actual size. If the line is half width, the preview is only half of the brush's actual size. The brush can be rotated to different orientations by clicking on its image and moving the mouse.
<P>
<DL>
<DT><STRONG>Rectangle</STRONG>
<DD>When this option is selected, the brush will be rectangle shaped.
<DT><STRONG>Ellipse</STRONG>
<DD>When this option is selected, the brush will be ellipse shaped.
<DT><STRONG>Store Brush</STRONG>
<DD>This button does not change the settings for the brush, but it instead stores the brush to brush-window. Brush-window is explained at the end of this page.
<DT><STRONG>Width</STRONG>
<DD>This option adjusts the width of the brush. The width is measured in pixels
<DT><STRONG>Height</STRONG>
<DD>This option adjusts the height of the brush. The height is measured in pixels.
<DT><STRONG>Fade</STRONG>
<DD>This option adjusts how much the edges of the brush will be faded. The bigger this value is the more the edges will be faded. The fade is not relative to brush size, so fade will affect more a little brush than a big brush.
</DL>
<H3>Brush-window</H3>
The brush window is used as a storage for brushes. You can select brush to be used by clicking on it in the brush window. You can also delete the currently selected brush from the brush-window with the menu-item or by pressing delete-key when the brush-window is active. Figure 2 shows the brush-window.
<DIV ALIGN=CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>
Figure 2: The brush-window.
</CAPTION>
<TR>
<TD><IMG SRC="./images/brush_window.gif">
</TABLE>
</DIV>
</TABLE>
<IMG SRC="./images/bottom_bar.gif"><BR>
</DIV>

</BODY>
</HTML>
45 changes: 45 additions & 0 deletions Documentation/color_selector.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<HTML>
<HEAD>
<TITLE>
ArtPaint: Color Selector -tool
</TITLE>
</HEAD>
<BODY bgcolor="ffffff">
<DIV ALIGN=CENTER>
<IMG SRC="./images/top_bar.gif"><BR>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=500>
<TR>
<TD>
<IMG SRC="./images/transparent_dot.gif" WIDTH=100 HEIGHT=50>
</TD>
<TD COLSPAN=2>
<IMG SRC="./images/transparent_dot.gif" WIDTH=400 HEIGHT=50>
</TD>
</TR>
<TR>
<TD>
<TD>
<H2>Color Selector -tool</H2>
Color selector -tool selects colors from the image. It is used by clicking on the image over the color that needs to be selected. The selected color will then become the new foreground-color. If the mouse is moved over the image while the button is held down, a window will pop up showing in RGB-coordinates the color that is under the cursor.
<H3>Settings</H3>
Figure 1 shows the contents of the tool-setup-window when it is displaying the setup for the color selector -tool.
<DIV ALIGN=CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>
Figure 1: Setup view for the color selector -tool.
</CAPTION>
<TR>
<TD><IMG SRC="./images/color_selector.gif">
</TABLE>
</DIV>
<P>
<DL>
<DT><STRONG>Size</STRONG>
<DD>If this option is 1, the selected color will be the one under the cursor. If this is bigger than 1, the selected color will be taken as an average from the rectangular area that has the width indicated by size and whose centerpoint is under the cursor.
</DL>
</TABLE>
<IMG SRC="./images/bottom_bar.gif"><BR>
</DIV>

</BODY>
</HTML>
80 changes: 80 additions & 0 deletions Documentation/colors.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
<HTML>
<HEAD>
<TITLE>
ArtPaint: Colors
</TITLE>
</HEAD>
<BODY bgcolor="ffffff">
<DIV ALIGN=CENTER>
<IMG SRC="./images/top_bar.gif"><BR>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=500>
<TR>
<TD>
<IMG SRC="./images/transparent_dot.gif" WIDTH=100 HEIGHT=50>
</TD>
<TD COLSPAN=2>
<IMG SRC="./images/transparent_dot.gif" WIDTH=400 HEIGHT=50>
</TD>
</TR>

<TR>
<TD>
<TD>
<H2>Colors</H2>
ArtPaint offers many possibilities for selecting colors. Colors can be picked from a user-defined color set, or they can be mixed with sliders using one of the various supplied color-models or the color can be picked straight from the image using the <A HREF="./color_selector.html">color selector</A> -tool.
<H3>Foreground- and Background-color</H3>
Foreground-color is the color that is used by the tools to do the drawing. The background color is used by the <A HREF="./eraser.html">eraser</A>-tool and is used as the color to clear the image to. Also some <A HREF="./add_ons.html">add-ons</A> might use the background color.
If the color is selected with the primary mouse button it will become the foreground-color. If it is selected with some other mouse button it will become the background-color.
<P>
<H3>Color sets</H3>
Color sets are collections of colors that can be edited. This way the most frequently needed colors can be stored. Each color set can have between 8 to 64 colors. Color sets can be also saved to disk for later use.
<P>
<H3>Color-window</H3>
Color-window is the place where new colors can be created with sliders and color-sets can be modified or new sets created. Figure 1 shows what the color-window looks like.

<DIV ALIGN=CENTER>
<TABLE>
<CAPTION ALIGN=BOTTOM>
Figure 1: Color-window.
</CAPTION>
<TR>
<TD>
<IMG SRC="./images/color_window.gif">
</TABLE>
</DIV>

<P>
The left side of the color-window contains a grid which contains some colors. The colors in this grid are called a color-set. The long bars in the middle are color-sliders that are used to adjust the color. On the right is a box that reflects the currently adjusted color.
<P>
On the left side of the color-sliders are four letters indicating what color-model is being used. The lowest letter is always 'A', which stands for alpha. Alpha is rather technical term, but it actually means just transparency of the color. If the slider is on the left, then the color is fully transparent, if the slider is on the right, the color is fully visible. A transparent color will have a black-and-white checkerboard pattern that shows underneath the color.
<P>
The top three sliders control how the color looks like. What these sliders do depend on the selected color-model. The color-model can be changed from color-window's Mode-menu. The different color-models are summarized below:
<DL>
<DT>RGB
<DD>Red, Green and Blue. This model allows the color to be composed of these three basic colors. These components are the same as are the primitive components on a typical monitor's display. Sometimes this model is referred to as being an additive model.
<DT>CMY
<DD>Cyan, Magenta and Yellow. This model allows the color to be composed of three basic colors. This is exactly the opposite as the RGB-model. This model is often used in printing devices (with the additional component K for black) and is also called a subtractive model.
<DT>HSV
<DD>Hue, Saturation, Value. This model composes the image using three basic properties of color. Hue controls what is the basic hue for the color. Saturation controls how saturated the color is, and value controls the brightness of the color. This is often used in painting applications as it is found to be more intuitive than many other color-spaces.
<DT>YIQ
<DD>This model is the same as is used in North American TV transmissions (NTSC). Y component controls the luminance of the color while I and Q components control the hue of the color.
<DT>YUV
<DD>This model is the same as is used in European TV transmissions (PAL). Y component controls the luminance of the color while U and V components control the hue of the color.
<DT>BeOS Controller
<DD>This model is the standard BeOS color controller. If you are using a 32-bit screen depth it is similar to RGB-control, but if you are using an 8-bit depth, it will display the 256 BeOS system colors.
</DL>
<P>
You can adjust all of the color sliders (but not alpha) at once to the same value by pressing down left shift before sliding. To adjust the values relative to each other, press down left control instead. This is especially useful with the RGB- and CMY-models.
<P>
The color sets can be adjusted by clicking on one of the colors and then adjusting the color with a slider. The color can also be copied from color set to another location by clicking on the color and dragging it there.
<P>
The Set-menu in the color-window allows you to create new color-sets and to delete existing ones. It also allows you to save the sets to disk. The current state of the sets is always saved also automatically when the program is quit.
<P>
The two arrows below the color set allow for changing between different color sets. The active color set along with the arrows is duplicated in the status-bar of every <A HREF="./paint_window.html">paint-window</A> to allow quicker selection of colors.

</TABLE>
<IMG SRC="./images/bottom_bar.gif"><BR>
</DIV>

</BODY>
</HTML>
Loading

0 comments on commit f3c418e

Please sign in to comment.