Add kimagemapeditor help handbook.

5 files changed, 156 insertions, 0 deletions

diff --git a/doc/kimagemapeditor/Makefile.am b/doc/kimagemapeditor/Makefile.am
new file mode 100644
index 00000000..e97402c7
--- /dev/null
+++ b/doc/kimagemapeditor/Makefile.am
@@ -0,0 +1,2 @@
+KDE_DOCS = AUTO
+KDE_LANG = en
diff --git a/doc/kimagemapeditor/configure.png b/doc/kimagemapeditor/configure.png
new file mode 100644
index 00000000..a90a70e7
--- /dev/null
+++ b/doc/kimagemapeditor/configure.png
diff --git a/doc/kimagemapeditor/index.docbook b/doc/kimagemapeditor/index.docbook
new file mode 100644
index 00000000..e9d320d7
--- /dev/null
+++ b/doc/kimagemapeditor/index.docbook
@@ -0,0 +1,153 @@
+<?xml version="1.0" ?>
+  <!DOCTYPE article PUBLIC "-//KDE//DTD DocBook XML V4.2-Based Variant V1.1//EN" "dtd/kdex.dtd" [
+  <!ENTITY kimagemapeditor "<application>KImageMapEditor</application>">
+  <!ENTITY kappname "&kimagemapeditor;">
+  <!ENTITY package "tdewebdev">
+  <!ENTITY % addindex "IGNORE">
+  <!ENTITY % English "INCLUDE">
+]>
+
+<article id="kimagemapeditor" lang="&language;">
+
+<articleinfo>
+<title>The &kimagemapeditor; Handbook</title>
+
+<authorgroup>
+<author>
+<firstname>Jan</firstname>
+<surname>Sch&auml;fer</surname>
+</author>
+<author>&tde-authors;</author>
+<!-- TRANS:ROLES_OF_TRANSLATORS -->
+</authorgroup>
+
+<copyright>
+<year>2007</year>
+<holder>Jan Sch&auml;fer</holder>
+</copyright>
+<copyright>
+<year>&tde-copyright-date;</year>
+<holder>&tde-team;</holder>
+</copyright>
+
+<date>&tde-release-date;</date>
+<releaseinfo>&tde-release-version;</releaseinfo>
+
+<abstract>
+<para>
+&kimagemapeditor; is an &HTML; image map editor for &tde;.
+</para>
+</abstract>
+
+<keywordset>
+<keyword>TDE</keyword>
+<keyword>image map editor</keyword>
+<keyword>image map</keyword>
+<keyword>usemap</keyword>
+<keyword>tdewebdev</keyword>
+<keyword>html</keyword>
+</keywordset>
+
+<legalnotice>&underFDL;</legalnotice>
+
+</articleinfo>
+
+<!-- <chapter id="using"> -->
+<!-- <title>Using &kimagemapeditor;</title> -->
+
+<para>
+&kimagemapeditor; is an &HTML; image map editor for &tde; that helps create and modify &HTML; <ulink url="http://en.wikipedia.org/wiki/Imagemap">image maps.</ulink>
+</para>
+
+<screenshot>
+<screeninfo>Here's a screenshot of &kimagemapeditor;</screeninfo>
+  <mediaobject>
+    <imageobject>
+      <imagedata fileref="mainwindow.png" format="PNG"/>
+    </imageobject>
+    <textobject>
+      <phrase>Screenshot</phrase>
+    </textobject>
+    <caption>
+      <para>
+        &kimagemapeditor; main window.
+      </para>
+    </caption>
+  </mediaobject>
+</screenshot>
+
+<para>A common use case is a world map where each country is an image map.
+By clicking on a country in the map you can open a link to the selected
+country.</para>
+
+<para>Creating an image map requires the following steps:</para>
+
+<para>Load an image file (<filename class="extension">png</filename>, 
+<filename class="extension">jpg</filename>, <filename class="extension">gif</filename>) 
+or a &HTML; file from your disk or drag into the image area. When multiple images are loaded,
+then select the desired image from the <guilabel>Images</guilabel> list tab in the docker.</para>
+
+<para>Add a image map using <menuchoice><guimenu>Map</guimenu><guimenuitem>New 
+Map</guimenuitem></menuchoice> from the menu and enter a map name.</para>
+
+<para>Now the <guimenu>Tools</guimenu> menu is enabled. Select the appropriate geometric
+shape like <guimenuitem>Circle</guimenuitem>,
+<guimenuitem>Rectangle</guimenuitem>, <guimenuitem>Polygon</guimenuitem> or
+<guimenuitem>Freehand Polygon</guimenuitem> and define a clickable area in
+the image.</para>
+
+<para>The <guilabel>Area Tag Editor</guilabel> dialog is displayed. On the <guilabel>General</guilabel> 
+tab enter the attributes <guilabel>HREF</guilabel> (a link's target &URL;), <guilabel>Alt.Text</guilabel>, 
+<guilabel>Target</guilabel> and <guilabel>Title</guilabel>.</para> 
+
+<para>The <guilabel>Coordinates</guilabel> tab shows the geometric data of the shape. 
+Editing the value allows you to adjust size and position on the image as your changes 
+are immediately visible in the image. Size and position can be altered using the mouse 
+as well.</para>
+
+<!--para>JavaScript tab Enter name of funtions defined where? for actions</para-->
+
+<para>To open the <guilabel>Area Tag Editor</guilabel> dialog for an already defined 
+image map use <guimenuitem>Properties</guimenuitem> from the <guimenu>Edit</guimenu> 
+menu or the context menu of the region.</para>
+
+<para>Use <menuchoice><guimenu>Map</guimenu><guimenuitem>Show HTML</guimenuitem></menuchoice> 
+to view the generated &HTML; code of the map.</para>
+
+<para>Next open <menuchoice><guimenu>Image</guimenu><guimenuitem>Edit Usemap...</guimenuitem></menuchoice> 
+and enter the map name as usemap value. Save your work with <menuchoice><guimenu>File</guimenu>
+<guimenuitem>Save</guimenuitem></menuchoice>. Open the &HTML; file in &konqueror; to verify that 
+the image map is working as expected.</para>
+
+<!-- 
+Map-Preview is empty?
+
+  Draft of Howto create an image map
+  1) Load Image (png/jpg/gif) or html file
+  2) Tools Circle Rectangle Polygon to define an area
+  3) Area Tag Editor (Property from context menu) Link+AltTag+..., Coordinates, JavaScript
+  4) Map->Show HTMl to view the html code of the map
+--> 
+<para>
+    Configuration options of &kimagemapeditor; can be accessed by opening the configuration dialog with selecting <menuchoice> <guimenu>Settings</guimenu> <guimenuitem>Configure &kimagemapeditor;...</guimenuitem> </menuchoice> from the menu.
+</para>
+<screenshot>
+<screeninfo>Configuration dialog of &kimagemapeditor;</screeninfo>
+  <mediaobject>
+    <imageobject>
+      <imagedata fileref="configure.png" format="PNG"/>
+    </imageobject>
+    <textobject>
+      <phrase>Configuration dialog of &kimagemapeditor;</phrase>
+    </textobject>
+    <caption>
+      <para>
+        Configuration dialog of &kimagemapeditor;.
+      </para>
+    </caption>
+  </mediaobject>
+</screenshot>
+
+<!-- </chapter> -->
+
+</article>
diff --git a/doc/kimagemapeditor/mainwindow.png b/doc/kimagemapeditor/mainwindow.png
new file mode 100644
index 00000000..e32f7726
--- /dev/null
+++ b/doc/kimagemapeditor/mainwindow.png
diff --git a/kimagemapeditor/kimagemapeditor.desktop b/kimagemapeditor/kimagemapeditor.desktop
index 77bda30e..13ac0084 100644
--- a/kimagemapeditor/kimagemapeditor.desktop
+++ b/kimagemapeditor/kimagemapeditor.desktop
@@ -4,6 +4,7 @@ MimeType=text/html;
 Exec=kimagemapeditor -caption "%c" %i %m
 Icon=kimagemapeditor
 Terminal=false
+DocPath=kimagemapeditor/index.html
 Name=KImageMapEditor
 Name[ne]=केडीई छवि मानचित्र सम्पादक
 Name[pt_BR]=KEditor de Mapeamento de Imagem