www/src/editor_tut.html

Editor Tutorial

<div class="tutorial">
<h2>Deliantra map making and server installation tutorial for Linux</h2>

<p>
So, you don't know much about deliantra and or programming, but
you want to make maps? This Tutorial will explain how to
install the Deliantra server (from CVS) on your linux system
and making your first maps. If you are stuck somewhere, please
<a href="contact.html">contact</a> us (the developers).
</p>

<p> <em>
   Note: I am assuming here that you are using a <tt>bash</tt>-like shell. And that you are logged in as root.
   If you want to install and setup everything from a regular user account you have to take care of all permission
   handling yourself.
</em> </p>

<h3>Step 1: Getting the map editor and setting it up</h3>

<p>
Now download the editor! You can either install all the Perl modules and stuff by yourself
or just choose the binary: <a href="editor.html">editor download page</a>.
I'm not going to discuss the installation procedure for the CVS here, as it requires much
knowledge about your system and how to install (perl) software from source. If you only want to
make maps, the binary will do very fine (on x86 systems).
</p>

<p> So, the next thing is to download the editor. </p>

<pre>
root@localhost: ~/deliantra# wget http://dist.schmorp.de/gde/gce-gnu-linux-x86.bin
</pre>

<p>There it is, now we make it an executable and run it:</p>

<pre>
root@localhost: ~/deliantra# chmod a+x gce-gnu-linux-x86.bin
</pre>

<p>
Now we make a start script like for the server and run it
<em>Note: the first startup may take some while, the editor has to read all the archetypes and graphics.</em>:
</p>

<pre>
root@localhost: ~/deliantra# echo "CROSSFIRE_LIBDIR=/opt/deliantra/share/deliantra/ ./gce-gnu-linux-x86.bin" &gt; startgce
root@localhost: ~/deliantra# chmod a+x startgce
root@localhost: ~/deliantra# ./startgce
</pre>

<p><em>
   Note: If you run into problems when starting the editor make sure you have gtk2, glib2 and pango and cairo libraries
   correctly installed. As i don't know your linux system you would have to figure out that yourself.
</em></p> 

<p><em>
   Note 2: If you are familiar with your system i recommend to set the CROSSFIRE_LIBDIR variable in your shells startup configuration.
</em></p> 

<p>
Now i could let you run around for yourself, if you are planning to figure out stuff
yourself now, do it, but make sure you find the <b>manual of the editor in the toolbox window in the HELP menu!</b>
</p>

<p>But i guess the best thing is to explain now what to do, and how to do. The first things you will see is this:</p>

<a href="tutscrs/mainview1.png"><img src="tutscrs/mainview1_tb.jpg" alt="main view" /></a>

<p>Now open up 2 pickers, the stack view dialog and rearrange all the windows like this:</p>

<a href="tutscrs/mainview2.png"><img src="tutscrs/mainview2_tb.jpg" alt="main view with layout" /></a>

<p>
You notice that the pickers are still empty, go to the drop-down box on the top of the pickers
and select 'wall' and 'floor' from there:
</p>

<a href="tutscrs/mainview3.png"><img src="tutscrs/mainview3_tb.jpg" alt="main view with finished layout" /></a>

<p>
Now it's time to click the <em>Save Layout</em> entry in the <em>File</em> menu. It will save all the
window sizes and positions. So you don't have to make all the layout work next time again.
As you go on with map editing you maybe find other layouts more useful, try around, and of course: use more
pickers. I mostly have 3-4 pickers open to do all the stuff i want.
</p>

<a href="tutscrs/mainview4.png"><img src="tutscrs/mainview4_tb.jpg" alt="main view with finished and saved layout" /></a>

<p>Finished! You have now a layout we can work with. Go on to the next step:</p>

<h3>Step 2: Making your first map</h3>

<p>
This step will introduce some tools and shortcuts you may use on a regular basis when making maps.
</p>

<p>
First make a new map. Go to the <em>File-&gt;New</em> menu for that an click on it.
Next a dialog will open up, that will ask you for a map size. The default is 20x20. You
can adjust that like you want. But we recommend not to make maps much larger than 50x50 or 60x60.
It reduces the server load somewhat. Better use tiled maps or linked maps (with exits between them).
</p>

<p>
Click on the <em>new</em> button and the map editor will open up:
</p>

<a href="tutscrs/mapedit1.png"><img src="tutscrs/mapedit1_tb.jpg" alt="clean map editor" /></a>

<p>
You recognize the ugly color on the backgrounds of the pickers and the map editor window.
It's not configurable, and it's there to give a clear contrast to stuff on the map.
</p>

<p><b>
   Note: You can scroll in the map editor window and the pickers by holding down the middle mouse button
   and drag it. (This is similar to GIMP).
</b></p>

<p>
Now resize the map editor window a little bit and select the <em>Select</em> tool from the
left and draw a rectangle over the map with it. Next select a floor from the picker. The floor will appear in the
attribute editor.
</p>

<a href="tutscrs/mapedit2.png"><img src="tutscrs/mapedit2_tb.jpg" alt="map editor with selection" /></a>

<p>
Now look in the toolbox window on the bottom, where the tool-controls are. There are radio buttons: 
<em>place</em>, <em>erase</em> and <em>perl</em>. Place executes the place tool on every cell in the selection
and erase executes the erase tool on every cell in the selection. The perl thing is something advanced,
it runs a small perl script on every cell in the selection, it's likely to go away some day (maybe).
</p>

<p>
Select the <em>place</em> radio button, and press the <em>invoke</em> button. The selection will be filled
with the selected floor:
</p>

<a href="tutscrs/mapedit3.png"><img src="tutscrs/mapedit3_tb.jpg" alt="map editor with floor" /></a>

<p>
Next we are using the autojoining placement of walls, pick the "awall_0" tile from the picker with the walls.
Make sure the place tool is in <em>auto</em> mode.
</p>

<p>
   <em>
      Note: In future when you want to use the autojoining placement you have to take care that the
      wall tile you are using to draw ends in "_0". But some walls, like the cave walls, are just not autojoinable.
      You will have to place them yourself.
   </em>
</p>

<p>
When you picked the wall, just draw some walls like you would draw in a graphics program (like GIMP).
Draw something similiar like you see in the screenshot. With some holes in the walls.
</p>

<p>
If you make a mistake while drawing the wall just hold the <i>CTRL</i> key to temporarily switch to the
erase mode and erase all the bad walls and redraw the area. Or just <em>Edit->Undo</em> it. (Shortcut key
combination for undo is <i>CTRL+z<i> and redo is <i>CTRL+y</i>).
</p>

<a href="tutscrs/mapedit4.png"><img src="tutscrs/mapedit4_tb.jpg" alt="map editor with floor and walls" /></a>

<p> <b>to be continued...</b> </p>

<hr>

<h2>Installing the server for testing the maps</h2>


<h3>Step A: Downloading the maps and the server from CVS</h3>

<p>
I assume here you have <tt>cvs</tt> installed. (the debian shortcut would
be: <tt>apt-get install cvs</tt>).
</p>

<p>
Create a directory in your home where all your Deliantra (map) development
should take place:
</p>

<pre>
root@localhost: ~# mkdir ~/deliantra/
</pre>

<p> <em>
   NOTE: the 'root@localhost: ~#' stands for your shellprompt, where '~' is the
   current working directory. And the ~ stands for your root homedirectory, if you are working
   as user 'root' your homedirectory should be something like /root.
</em> </p>

<p> Go into that directory: </p>

<pre>
root@localhost: ~# cd ~/deliantra/
</pre>


<p>Now, we are going to get the files, first the maps:</p>

<pre>
root@localhost: ~/deliantra# cvs -z3 -d :pserver:anonymous@cvs.schmorp.de/schmorpforge co -d maps deliantra/maps
</pre>

<p>And then the archetypes (needed for building the server, and could take a while):</p>

<pre>
root@localhost: ~/deliantra# cvs -z3 -d :pserver:anonymous@cvs.schmorp.de/schmorpforge co -d arch deliantra/arch
</pre>

<p>Finnally the server source itself:</p>

<pre>
root@localhost: ~/deliantra# cvs -z3 -d :pserver:anonymous@cvs.schmorp.de/schmorpforge co -d server deliantra/server
</pre>

<p>
Now a <tt>ls -l</tt> should show something like this:
</p>

<pre>
root@localhost: ~/deliantra# ls -l
   1 drwxr-xr-x 39 root users    1192 2006-06-01 21:29 maps
   1 drwxr-xr-x 39 root users    4096 2006-05-26 12:38 arch
   1 drwxr-xr-x 17 root users    1072 2006-05-26 11:34 server
</pre>

<h3>Step B: Compiling and installing the server</h3>

<p>
Start by going into the server CVS checkout directory and just call configure (the script that
will find all the neccessary tools to compile the server). Please make sure you have
development tools like gcc (gnu c compiler) and headers installed:
</p>

<pre>
root@localhost: ~/deliantra# cd server
root@localhost: ~/deliantra/server# ln -s /root/deliantra/arch lib/arch
root@localhost: ~/deliantra/server# ./configure --prefix=/opt/deliantra/
</pre>

<p>
The prefix argument tells the configure script to choose /opt/deliantra/ as installation
destination. This is done to prevent the server installation from polluting your
system and to keep all files together.
</p>

<p> Next step is the compilation and installation of the server: </p>

<pre>
root@localhost: ~/deliantra/server# make install
</pre>

<p>
That should build the sources and install them. If you encounter problems here you could try to contact us.
If everythin went fine, there should be a <tt>/opt/deliantra/</tt> directory now with files in it.
</p>

<p>
Next step is to link the maps into the installed server directory. First go back into the parent
directory and then link the maps dir to the right location:
</p>

<pre>
root@localhost: ~/deliantra/server# cd ..
root@localhost: ~/deliantra# ln -s ~/deliantra/maps /opt/deliantra/share/deliantra/maps
</pre>

<p>
Now everything is in place and all thats left is to write a 
startup script for the server:
</p>

<pre>
root@localhost: ~/deliantra# echo "CROSSFIRE_LIBDIR=/opt/deliantra/share/deliantra/ /opt/deliantra/bin/deliantra" > startcf
root@localhost: ~/deliantra# chmod a+x startcf
</pre>

<p><em>
   Note: The CROSSFIRE_LIBDIR thing is setting an environment variable which 
   tells the server where to look for the configuration variables and the maps
</em></p>

<p>Now try to shoot it up:</p>

<pre>
root@localhost: ~/deliantra# ./startcf
</pre>

<p>
You should see lots of output running accross your screen. 
Congratulations, you just setup a Deliantra server.
You maybe want to dive into the server tree and look around in the <tt>doc/</tt>
directory to find more about the server.
</p>


</div>

<p></p>
Revision:	1.8
Committed:	Fri Jun 20 08:34:52 2008 UTC (16 years ago) by elmex
Content type:	text/html
Branch:	MAIN
Changes since 1.7:	+2 -3 lines
Log Message:	minor correction
#	User	Rev	Content
1	pippijn	1.1	Editor Tutorial
2
3			<div class="tutorial">
4	root	1.5	<h2>Deliantra map making and server installation tutorial for Linux</h2>
5	pippijn	1.1
6			<p>
7	elmex	1.7	So, you don't know much about deliantra and or programming, but
8	pippijn	1.1	you want to make maps? This Tutorial will explain how to
9	root	1.5	install the Deliantra server (from CVS) on your linux system
10	pippijn	1.1	and making your first maps. If you are stuck somewhere, please
11			<a href="contact.html">contact</a> us (the developers).
12			</p>
13
14			<p> <em>
15			Note: I am assuming here that you are using a <tt>bash</tt>-like shell. And that you are logged in as root.
16			If you want to install and setup everything from a regular user account you have to take care of all permission
17			handling yourself.
18			</em> </p>
19
20	elmex	1.7	<h3>Step 1: Getting the map editor and setting it up</h3>
21	pippijn	1.1
22			<p>
23			Now download the editor! You can either install all the Perl modules and stuff by yourself
24	elmex	1.7	or just choose the binary: <a href="editor.html">editor download page</a>.
25	pippijn	1.1	I'm not going to discuss the installation procedure for the CVS here, as it requires much
26			knowledge about your system and how to install (perl) software from source. If you only want to
27			make maps, the binary will do very fine (on x86 systems).
28			</p>
29
30	elmex	1.8	<p> So, the next thing is to download the editor. </p>
31	pippijn	1.1
32			<pre>
33	elmex	1.8	root@localhost: ~/deliantra# wget http://dist.schmorp.de/gde/gce-gnu-linux-x86.bin
34	pippijn	1.1	</pre>
35
36			<p>There it is, now we make it an executable and run it:</p>
37
38			<pre>
39	elmex	1.7	root@localhost: ~/deliantra# chmod a+x gce-gnu-linux-x86.bin
40	pippijn	1.1	</pre>
41
42			<p>
43			Now we make a start script like for the server and run it
44			<em>Note: the first startup may take some while, the editor has to read all the archetypes and graphics.</em>:
45			</p>
46
47			<pre>
48	elmex	1.7	root@localhost: ~/deliantra# echo "CROSSFIRE_LIBDIR=/opt/deliantra/share/deliantra/ ./gce-gnu-linux-x86.bin" > startgce
49			root@localhost: ~/deliantra# chmod a+x startgce
50			root@localhost: ~/deliantra# ./startgce
51	pippijn	1.1	</pre>
52
53			<p><em>
54			Note: If you run into problems when starting the editor make sure you have gtk2, glib2 and pango and cairo libraries
55			correctly installed. As i don't know your linux system you would have to figure out that yourself.
56			</em></p>
57
58			<p><em>
59			Note 2: If you are familiar with your system i recommend to set the CROSSFIRE_LIBDIR variable in your shells startup configuration.
60			</em></p>
61
62			<p>
63			Now i could let you run around for yourself, if you are planning to figure out stuff
64			yourself now, do it, but make sure you find the <b>manual of the editor in the toolbox window in the HELP menu!</b>
65			</p>
66
67			<p>But i guess the best thing is to explain now what to do, and how to do. The first things you will see is this:</p>
68
69	root	1.3	<a href="tutscrs/mainview1.png"><img src="tutscrs/mainview1_tb.jpg" alt="main view" /></a>
70	pippijn	1.1
71			<p>Now open up 2 pickers, the stack view dialog and rearrange all the windows like this:</p>
72
73	root	1.3	<a href="tutscrs/mainview2.png"><img src="tutscrs/mainview2_tb.jpg" alt="main view with layout" /></a>
74	pippijn	1.1
75			<p>
76			You notice that the pickers are still empty, go to the drop-down box on the top of the pickers
77			and select 'wall' and 'floor' from there:
78			</p>
79
80	root	1.3	<a href="tutscrs/mainview3.png"><img src="tutscrs/mainview3_tb.jpg" alt="main view with finished layout" /></a>
81	pippijn	1.1
82			<p>
83			Now it's time to click the <em>Save Layout</em> entry in the <em>File</em> menu. It will save all the
84			window sizes and positions. So you don't have to make all the layout work next time again.
85			As you go on with map editing you maybe find other layouts more useful, try around, and of course: use more
86			pickers. I mostly have 3-4 pickers open to do all the stuff i want.
87			</p>
88
89	root	1.3	<a href="tutscrs/mainview4.png"><img src="tutscrs/mainview4_tb.jpg" alt="main view with finished and saved layout" /></a>
90	pippijn	1.1
91			<p>Finished! You have now a layout we can work with. Go on to the next step:</p>
92
93	elmex	1.7	<h3>Step 2: Making your first map</h3>
94	pippijn	1.1
95			<p>
96			This step will introduce some tools and shortcuts you may use on a regular basis when making maps.
97			</p>
98
99			<p>
100			First make a new map. Go to the <em>File->New</em> menu for that an click on it.
101			Next a dialog will open up, that will ask you for a map size. The default is 20x20. You
102			can adjust that like you want. But we recommend not to make maps much larger than 50x50 or 60x60.
103			It reduces the server load somewhat. Better use tiled maps or linked maps (with exits between them).
104			</p>
105
106			<p>
107			Click on the <em>new</em> button and the map editor will open up:
108			</p>
109
110	root	1.3	<a href="tutscrs/mapedit1.png"><img src="tutscrs/mapedit1_tb.jpg" alt="clean map editor" /></a>
111	pippijn	1.1
112			<p>
113			You recognize the ugly color on the backgrounds of the pickers and the map editor window.
114			It's not configurable, and it's there to give a clear contrast to stuff on the map.
115			</p>
116
117			<p><b>
118			Note: You can scroll in the map editor window and the pickers by holding down the middle mouse button
119			and drag it. (This is similar to GIMP).
120			</b></p>
121
122			<p>
123			Now resize the map editor window a little bit and select the <em>Select</em> tool from the
124			left and draw a rectangle over the map with it. Next select a floor from the picker. The floor will appear in the
125			attribute editor.
126			</p>
127
128	root	1.3	<a href="tutscrs/mapedit2.png"><img src="tutscrs/mapedit2_tb.jpg" alt="map editor with selection" /></a>
129	pippijn	1.1
130			<p>
131			Now look in the toolbox window on the bottom, where the tool-controls are. There are radio buttons:
132			<em>place</em>, <em>erase</em> and <em>perl</em>. Place executes the place tool on every cell in the selection
133			and erase executes the erase tool on every cell in the selection. The perl thing is something advanced,
134			it runs a small perl script on every cell in the selection, it's likely to go away some day (maybe).
135			</p>
136
137			<p>
138			Select the <em>place</em> radio button, and press the <em>invoke</em> button. The selection will be filled
139			with the selected floor:
140			</p>
141
142	root	1.3	<a href="tutscrs/mapedit3.png"><img src="tutscrs/mapedit3_tb.jpg" alt="map editor with floor" /></a>
143	pippijn	1.1
144			<p>
145			Next we are using the autojoining placement of walls, pick the "awall_0" tile from the picker with the walls.
146			Make sure the place tool is in <em>auto</em> mode.
147			</p>
148
149			<p>
150			<em>
151			Note: In future when you want to use the autojoining placement you have to take care that the
152			wall tile you are using to draw ends in "_0". But some walls, like the cave walls, are just not autojoinable.
153			You will have to place them yourself.
154			</em>
155			</p>
156
157			<p>
158			When you picked the wall, just draw some walls like you would draw in a graphics program (like GIMP).
159			Draw something similiar like you see in the screenshot. With some holes in the walls.
160			</p>
161
162			<p>
163			If you make a mistake while drawing the wall just hold the <i>CTRL</i> key to temporarily switch to the
164			erase mode and erase all the bad walls and redraw the area. Or just <em>Edit->Undo</em> it. (Shortcut key
165			combination for undo is <i>CTRL+z<i> and redo is <i>CTRL+y</i>).
166			</p>
167
168	root	1.3	<a href="tutscrs/mapedit4.png"><img src="tutscrs/mapedit4_tb.jpg" alt="map editor with floor and walls" /></a>
169	pippijn	1.1
170	elmex	1.4	<p> <b>to be continued...</b> </p>
171	pippijn	1.1
172	elmex	1.7	<hr>
173
174			<h2>Installing the server for testing the maps</h2>
175
176
177			<h3>Step A: Downloading the maps and the server from CVS</h3>
178
179			<p>
180			I assume here you have <tt>cvs</tt> installed. (the debian shortcut would
181			be: <tt>apt-get install cvs</tt>).
182			</p>
183
184			<p>
185			Create a directory in your home where all your Deliantra (map) development
186			should take place:
187			</p>
188
189			<pre>
190			root@localhost: ~# mkdir ~/deliantra/
191			</pre>
192
193			<p> <em>
194			NOTE: the 'root@localhost: ~#' stands for your shellprompt, where '~' is the
195			current working directory. And the ~ stands for your root homedirectory, if you are working
196			as user 'root' your homedirectory should be something like /root.
197			</em> </p>
198
199			<p> Go into that directory: </p>
200
201			<pre>
202			root@localhost: ~# cd ~/deliantra/
203			</pre>
204
205
206			<p>Now, we are going to get the files, first the maps:</p>
207
208			<pre>
209			root@localhost: ~/deliantra# cvs -z3 -d :pserver:anonymous@cvs.schmorp.de/schmorpforge co -d maps deliantra/maps
210			</pre>
211
212			<p>And then the archetypes (needed for building the server, and could take a while):</p>
213
214			<pre>
215			root@localhost: ~/deliantra# cvs -z3 -d :pserver:anonymous@cvs.schmorp.de/schmorpforge co -d arch deliantra/arch
216			</pre>
217
218			<p>Finnally the server source itself:</p>
219
220			<pre>
221			root@localhost: ~/deliantra# cvs -z3 -d :pserver:anonymous@cvs.schmorp.de/schmorpforge co -d server deliantra/server
222			</pre>
223
224			<p>
225			Now a <tt>ls -l</tt> should show something like this:
226			</p>
227
228			<pre>
229			root@localhost: ~/deliantra# ls -l
230			1 drwxr-xr-x 39 root users 1192 2006-06-01 21:29 maps
231			1 drwxr-xr-x 39 root users 4096 2006-05-26 12:38 arch
232			1 drwxr-xr-x 17 root users 1072 2006-05-26 11:34 server
233			</pre>
234
235			<h3>Step B: Compiling and installing the server</h3>
236
237			<p>
238			Start by going into the server CVS checkout directory and just call configure (the script that
239			will find all the neccessary tools to compile the server). Please make sure you have
240			development tools like gcc (gnu c compiler) and headers installed:
241			</p>
242
243			<pre>
244			root@localhost: ~/deliantra# cd server
245			root@localhost: ~/deliantra/server# ln -s /root/deliantra/arch lib/arch
246			root@localhost: ~/deliantra/server# ./configure --prefix=/opt/deliantra/
247			</pre>
248
249			<p>
250			The prefix argument tells the configure script to choose /opt/deliantra/ as installation
251			destination. This is done to prevent the server installation from polluting your
252			system and to keep all files together.
253			</p>
254
255			<p> Next step is the compilation and installation of the server: </p>
256
257			<pre>
258			root@localhost: ~/deliantra/server# make install
259			</pre>
260
261			<p>
262			That should build the sources and install them. If you encounter problems here you could try to contact us.
263			If everythin went fine, there should be a <tt>/opt/deliantra/</tt> directory now with files in it.
264			</p>
265
266			<p>
267			Next step is to link the maps into the installed server directory. First go back into the parent
268			directory and then link the maps dir to the right location:
269			</p>
270
271			<pre>
272			root@localhost: ~/deliantra/server# cd ..
273			root@localhost: ~/deliantra# ln -s ~/deliantra/maps /opt/deliantra/share/deliantra/maps
274			</pre>
275
276			<p>
277			Now everything is in place and all thats left is to write a
278			startup script for the server:
279			</p>
280
281			<pre>
282			root@localhost: ~/deliantra# echo "CROSSFIRE_LIBDIR=/opt/deliantra/share/deliantra/ /opt/deliantra/bin/deliantra" > startcf
283			root@localhost: ~/deliantra# chmod a+x startcf
284			</pre>
285
286			<p><em>
287			Note: The CROSSFIRE_LIBDIR thing is setting an environment variable which
288			tells the server where to look for the configuration variables and the maps
289			</em></p>
290
291			<p>Now try to shoot it up:</p>
292
293			<pre>
294			root@localhost: ~/deliantra# ./startcf
295			</pre>
296
297			<p>
298			You should see lots of output running accross your screen.
299			Congratulations, you just setup a Deliantra server.
300			You maybe want to dive into the server tree and look around in the <tt>doc/</tt>
301			directory to find more about the server.
302			</p>
303
304
305
306	pippijn	1.1	</div>
307	pippijn	1.2
308			<p></p>