Frictional Game Wiki

<h1>Level Editor</h1> <div class="level1"> <p> The Level Editor is our own application to build maps for HPL2-based games. It is comprised of a set of basic object creation and edition modes which make the building task a lot easier. </p> </div> <h2>Overview</h2> <div class="level2"> <p> When run, the first screen we get to see is like this: </p> <p> <img src="/lib/exe/fetch.php?media=hpl2:tools:editors:leveleditoroverview-small.jpg" class="media" title="leveleditoroverview-small.jpg" alt="leveleditoroverview-small.jpg" /> </p> <p> Each part of the screen has a specific function, as follows: </p> <ol> <li class="level1"> <a href="#main_menu" title="hpl2:tools:editors:level_editor ↵" class="wikilink1">Main menu bar</a>: this is where every non-editor command lies, as well as some edition ones.</li> <li class="level2"> <a href="#editmode_selection_bar" title="hpl2:tools:editors:level_editor ↵" class="wikilink1">EditMode sidebar</a>: here you will find a set of buttons used to switch the current behaviour of the editor. More on this later.</li> <li class="level2"> EditMode window area: any helper input the current EditMode needs will appear here.</li> <li class="level2"> <a href="#viewport_area" title="hpl2:tools:editors:level_editor ↵" class="wikilink1">Viewport area</a>: this area of the screen is reserved for the viewports, which are used to actually see what you are doing to the map. Every viewport has its own menu bar, to control some parameters of the visualization.</li> <li class="level2"> <a href="#lower_toolbar" title="hpl2:tools:editors:level_editor ↵" class="wikilink1">Lower toolbar</a>: some tools that are either viewport-dependent or global are located here.</li> </ol> <p> Not listed above are some special windows, used pretty often here: </p> <ul> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:save_dialog" class="wikilink1" title="hpl2:tools:editors:save_dialog">Save file dialog</a> </li> <li class="level2"> <a href="/doku.php?id=hpl2:tools:editors:load_dialog" class="wikilink1" title="hpl2:tools:editors:load_dialog">Load file dialog</a> </li> <li class="level2"> <a href="/doku.php?id=hpl2:tools:editors:color_picker" class="wikilink1" title="hpl2:tools:editors:color_picker">Color Picker</a> </li> <li class="level2"> <a href="/doku.php?id=hpl2:tools:editors:texture_browser" class="wikilink1" title="hpl2:tools:editors:texture_browser">Texture Browser</a> </li> <li class="level2"> <a href="/doku.php?id=hpl2:tools:editors:sound_browser" class="wikilink1" title="hpl2:tools:editors:sound_browser">Sound Browser</a></li> </ul> </div> <h2>Main Menu</h2> <div class="level2"> <p> This is a menu bar, just like in any other windowed application. Available options for this particular editor are as follows: </p> <ul> <li class="level1 node"> <b>File</b> <ul> <li class="level3"> <b>New</b>: This command will reset the map to an empty one, and the editor to a default state as well.</li> <li class="level3"> <b>Open</b>: This will load a map file picked in a dialog in the editor.</li> <li class="level3"> <b>Save</b>: Use this to save your work to a file in disk. Will ask for a file name when no file has been created.</li> <li class="level3"> <b>Save As</b>: This will also save your work, but will ask for a file name everytime it is called.</li> <li class="level3"> <b>Open Recent</b>: This will show a list of up to 10 files that have been recently loaded or saved.</li> <li class="level3"> <b>Import Objects</b>: This will show a file dialog with exported object (.expobj) files. When picked, the objects in the file will be added to the map.</li> <li class="level3"> <b>Export Selection</b>: This will save the current selection to a .expobj file.</li> <li class="level3"> <b>Quit</b>: This will exit the program.</li> </ul> </li> </ul> <ul> <li class="level1 node"> <b>Edit</b> <ul> <li class="level3"> <b>Undo</b>: Use this to undo the last action. Note that not everything you can do in the editor is undo-able.</li> <li class="level3"> <b>Redo</b>: Use this to redo the last undone action.</li> <li class="level3"> <b>Duplicate</b>: This will clone the current selected objects. More details on selection later.</li> <li class="level3"> <b>Delete</b>: This will delete the current selected objects.</li> <li class="level3"> <b>Create</b> /<b>Destroy compound object</b>: Use this to create a compound object with the current selected objects, or to destroy the currently selected compound object. More on compound objects <a href="/doku.php?id=hpl2:tools:editors:level_editor:compound_objects" class="wikilink1" title="hpl2:tools:editors:level_editor:compound_objects">here</a>. * <b>Search for object</b>: This will open the <a href="/doku.php?id=hpl2:tools:editors:level_editor:find_objects" class="wikilink1" title="hpl2:tools:editors:level_editor:find_objects">Find Objects window</a> window. It is useful when you want to find a particular object and don't want to actually look for it. * <b>Browse groups</b>: This will open the <a href="/doku.php?id=hpl2:tools:editors:level_editor:group_window" class="wikilink1" title="hpl2:tools:editors:level_editor:group_window">Group window</a>. This one is used to manage groups of objects. * <b>Level Settings</b>: This will open the <a href="/doku.php?id=hpl2:tools:editors:level_editor:level_settings" class="wikilink1" title="hpl2:tools:editors:level_editor:level_settings">Level Settings window</a> window. This is used to add global fog and skybox to a level, also has other tools. * <b>Options</b>: This will open the <a href="/doku.php?id=hpl2:tools:editors:level_editor:options_window" class="wikilink1" title="hpl2:tools:editors:level_editor:options_window">Options Window</a>. You will find general settings for the editor here.</li> </ul> </li> </ul> </div> <h2>EditMode selection bar</h2> <div class="level2"> <p> Here you will be able to switch between the different EditModes available in this editor. An EditMode describes the state the editor is going to work in when selected. These five EditModes can be found in this editor and the Model Editor. </p> <ul> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:select_editmode" class="wikilink1" title="hpl2:tools:editors:select_editmode">Select EditMode</a>: this mode is used to select and edit objects.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:light_editmode" class="wikilink1" title="hpl2:tools:editors:light_editmode">Light EditMode</a>: with this mode you will be able to place lights around.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:billboard_editmode" class="wikilink1" title="hpl2:tools:editors:billboard_editmode">Billboard EditMode</a>: use this to create Billboards. Light halos, light shafts, and some other </li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:particle_system_editmode" class="wikilink1" title="hpl2:tools:editors:particle_system_editmode">Particle Systems EditMode</a>: one can add Particle systems to the map with this mode. </li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:sound_editmode" class="wikilink1" title="hpl2:tools:editors:sound_editmode">Sound EditMode</a>: used to place sound entities in the map.</li> </ul> <p> The following EditModes are exclusive to the Level Editor </p> <ul> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:staticobject_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:staticobject_editmode">StaticObject EditMode</a>: this, and the Primitive EditMode, are the actual building tools. StaticObjects (aka level pieces) are placed using this.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:entity_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:entity_editmode">Entity EditMode</a>: objects that are interactive, such as doors, boxes and NPCs are created here.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:area_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:area_editmode">Area EditMode</a>: Areas are places that can be used for several ends, like linking to scripts, setting up where the player starts the map, and so on.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:primitive_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:primitive_editmode">Primitive EditMode</a>: creates static geometry to be part of the map. Only Planes are currently supported.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:decal_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:decal_editmode">Decal EditMode</a>: give detail to objects by placing decals on them.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:fog_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:fog_editmode">FogArea EditMode</a>: similar to the Area EditMode, but will place volumes containing a fog effect.</li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:combine_editmode" class="wikilink1" title="hpl2:tools:editors:level_editor:combine_editmode">Combine EditMode</a>: useful for optimizing, creates groups of static geometry that will be loaded by the engine as a whole.</li> </ul> </div> <h2>Viewport area</h2> <div class="level2"> <p> This area is meant to actually show what the map contains. There are four viewports in this editor, and their initial setup is shown in this picture: </p> <p> <a href="/lib/exe/detail.php?id=hpl2%3Atools%3Aeditors%3Alevel_editor&media=hpl2:tools:editors:viewports.jpg" class="media" title="hpl2:tools:editors:viewports.jpg"><img src="/lib/exe/fetch.php?media=hpl2:tools:editors:viewports.jpg" class="media" alt="" /></a> </p> </div> <h3>Viewport in focus</h3> <div class="level3"> <p> When working on a map, only one viewport will be focused at a time. This is shown by a red highlight around the currently focused viewport (in the picture above, focus is on the lower right viewport). To set the focus on a viewport, just move the mouse into it. </p> <p> In the Level Editor, some controls for the currently focused viewport is shown in the Lower Toolbar. </p> </div> <h3>View Menu</h3> <div class="level3"> <p> Each viewport has a "View" menu bar, which includes the following options: </p> <ul> <li class="level1 node"> <b>Render Mode</b>: the mode that will be used by the viewport to draw objects<ul> <li class="level2"> <b>Shaded</b>: drawing will be fully done, using lighting just like ingame. Ortho presets cannot use this mode.</li> <li class="level2"> <b>Wireframe</b>: only edge lines for polygons will be drawn in this mode.</li> </ul> </li> <li class="level1 node"> <b>Presets</b>: choosing an item from this submenu will reset the viewport to a preset. An ortho preset means that it will use orthographic mode, so no perspective distortion will be seen. All presets reset the camera target to a (0,0,0) position. One out of the following presets can be picked:<ul> <li class="level2"> <b>Front</b>: ortho preset, scene will be seen from the front.</li> <li class="level2"> <b>Right</b>: ortho preset, scene will be seen from the right side of the objects, pointing to the left.</li> <li class="level2"> <b>Top</b>: ortho preset, scene will be seen top-bottom.</li> <li class="level2"> <b>Perspective</b>: this is the only perspective mode, will reset the camera position to (10,10,10).</li> </ul> </li> <li class="level1"> <b>Show Grid</b>: toggles showing of the helper grid.</li> <li class="level1"> <b>Show Axes</b>: toggles showing of the XYZ axes.</li> </ul> </div> <h3>Moving and looking around</h3> <div class="level3"> <p> All movement and looking will be done using the mouse. In a nutshell, there are three basic movements that can be done, all need the 'view' key to be pressed (default left Alt). When this key is held, the red focus frame will turn yellow. These movements are listed next: </p> <p> <b>Linux Note:</b> Left Super (aka "Windows" or Apple key) and the Z key are also the view key as the Alt key is usually bound by the Window Manager.<br/> <b>Mac &lt;nowiki>OS&lt;/nowiki> X Note:</b> A three button mouse is required to use the editor. </p> <ul> <li class="level1"> <b>Tumble</b>: pressing the 'view' key and the left mouse button at the same time will activate the Tumble mode. This means the camera target will stay in place while the camera will orbit around it.</li> <li class="level2 node"> <b>Track</b>: pressing the 'view' key and the middle mouse button at the same time will activate the Track mode. According to the track mode that is set, this will behave in two different ways: <ul> <li class="level3"> Tracking lock to grid is disabled: the camera target will move along the current screen plane, meaning it will move left-right or up-down along with the mouse. The camera position will stay the same with respect to the target.</li> <li class="level3"> Tracking lock to grid is enabled: this allows the user to click on the grid, hold and drag to get a camera displacement. Pretty useful when one wants to cover large distances. This mode is forced in ortho views.</li> </ul> </li> <li class="level2"> <b>Zoom</b>: pressing the 'view' key and the right mouse button at the same time will activate the Zoom mode. Moving the mouse forward/backward will then zoom in/out respectively. Note there are limits for zooming in and out. You can also zoom in/out by rolling the mouse wheel up/down.</li> </ul> </div> <h3>Enlarging a viewport</h3> <div class="level3"> <p> When working in a viewport, the common thing to do is enlarging it. This can be done by clicking on the 'enlarge button' in the lower toolbar, or pressing the shortcut for it (spacebar). </p> <p> More on key shortcuts in <a href="/doku.php?id=hpl2:tools:editors:level_editor:shortcut_keys" class="wikilink1" title="hpl2:tools:editors:level_editor:shortcut_keys">here</a>. </p> </div> <h2>Lower Toolbar</h2> <div class="level2"> <p> You can find some useful controls in this bar located at all times at the lower part of the screen. <a href="/lib/exe/detail.php?id=hpl2%3Atools%3Aeditors%3Alevel_editor&media=hpl2:tools:editors:lowertoolbar.jpg" class="media" title="hpl2:tools:editors:lowertoolbar.jpg"><img src="/lib/exe/fetch.php?media=hpl2:tools:editors:lowertoolbar.jpg" class="media" alt="" /></a> </p> <ol> <li class="level1 node"> Grid Controls: <ul> <li class="level2"> <b>Grid Plane</b>: cycles through the available grid planes (XZ, XY, YZ).</li> <li class="level2"> <b>Toggle Snap</b> (magnet button): enables/disables snapping for translation (over grid), rotation and scale.</li> <li class="level2"> <b>Grid Height</b>: height of the plane, measured on the plane normal.</li> <li class="level2"> <b>Snap Separation</b>: separation of snapping points.</li> </ul> </li> <li class="level1"> <b>Enlarge Viewport button</b>: will toggle enlargement of the focused viewport.</li> <li class="level1 node"> Misc controls:<ul> <li class="level2"> <b>A</b>: toggles global ambient lighting</li> <li class="level2"> <b>P</b>: togles global point light</li> <li class="level2"> <b>LT</b>: toggles Lock to grid for tracking in focused viewport</li> <li class="level2"> <b>F</b>: focus on current selection</li> </ul> </li> <li class="level1 node"> Clip Plane controls<ul> <li class="level2"> <b>Selected clip plane</b>: used to select a clip plane among the available ones.</li> <li class="level2"> <b>Add</b>/<b>Remove clip plane</b> (+/- buttons): adds a new clip plane / removes the selected one.</li> <li class="level2"> <b>Actual Plane</b>: cycles through the available planes (XZ, XY, YZ).</li> <li class="level2"> <b>Plane height</b>: height of the plane, measured on the plane normal.</li> <li class="level2"> <b>Pos</b>/<b>Neg Button</b>: sets the culling side of the plane.</li> <li class="level2"> <b>Active</b>: sets whether the plane should cull objects.</li> </ul> </li> </ol> </div> <h2>Types of Objects</h2> <div class="level2"> <p> These are the kinds of objects that you can create and place in this editor. Details on each one and parameter listing in the following links: </p> <ul> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:lights" class="wikilink1" title="hpl2:tools:editors:lights">Lights</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:billboards" class="wikilink1" title="hpl2:tools:editors:billboards">Billboards</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:particle_systems" class="wikilink1" title="hpl2:tools:editors:particle_systems">Particle Systems</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:sounds" class="wikilink1" title="hpl2:tools:editors:sounds">Sounds</a></li> </ul> <p> The following types are exclusive to the Level Editor </p> <ul> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:static_objects" class="wikilink1" title="hpl2:tools:editors:level_editor:static_objects">Static Objects</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:entities" class="wikilink1" title="hpl2:tools:editors:level_editor:entities">Entities</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:areas" class="wikilink1" title="hpl2:tools:editors:level_editor:areas">Areas</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:primitives" class="wikilink1" title="hpl2:tools:editors:level_editor:primitives">Primitives</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:decals" class="wikilink1" title="hpl2:tools:editors:level_editor:decals">Decals</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:fogareas" class="wikilink1" title="hpl2:tools:editors:level_editor:fogareas">FogAreas</a></li> <li class="level1"> <a href="/doku.php?id=hpl2:tools:editors:level_editor:compound_objects" class="wikilink1" title="hpl2:tools:editors:level_editor:compound_objects">Compound Objects</a></li> </ul> </div>