]> git.sur5r.net Git - i3/i3.github.io/blobdiff - docs/tree-migrating.html
add docs (with custom stylesheet)
[i3/i3.github.io] / docs / tree-migrating.html
diff --git a/docs/tree-migrating.html b/docs/tree-migrating.html
new file mode 100644 (file)
index 0000000..5ba6188
--- /dev/null
@@ -0,0 +1,270 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"\r
+    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">\r
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">\r
+<head>\r
+<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />\r
+<meta name="generator" content="AsciiDoc 8.6.4" />\r
+<title>i3: Tree branch: Migrating</title>\r
+<link rel="stylesheet" href="/css/style.css" type="text/css" />\r
+<link rel="stylesheet" href="/css/xhtml11.css" type="text/css" />\r
+<script type="text/javascript">\r
+/*<![CDATA[*/\r
+window.onload = function(){asciidoc.footnotes(); asciidoc.toc(2);}\r
+/*]]>*/\r
+</script>\r
+<script type="text/javascript" src="/js/asciidoc-xhtml11.js"></script>\r
+</head>\r
+<body class="article">\r
+\r
+        <div id="main">\r
+            <h1 id="title">i3 - improved tiling WM</h1>\r
+                        <ul id="nav">\r
+                                <li><a style="border-bottom: 2px solid #fff" href="/docs">Docs</a></li>\r
+                                <li><a href="/screenshots">Screens</a></li>\r
+                                <li><a href="/contact">Contact</a></li>\r
+                                <li><a href="http://bugs.i3wm.org/">Bugs</a></li>\r
+                        </ul>\r
+        <br style="clear: both">\r
+<div id="content">\r
+<div id="header">\r
+<h1>Tree branch: Migrating</h1>\r
+<span id="author">Michael Stapelberg</span><br />\r
+<span id="email"><tt>&lt;<a href="mailto:michael+i3@stapelberg.de">michael+i3@stapelberg.de</a>&gt;</tt></span><br />\r
+<span id="revdate">November 2010</span>\r
+<div id="toc">
+  <div id="toctitle">Table of Contents</div>
+  <noscript><p><b>JavaScript must be enabled in your browser to display the table of contents.</b></p></noscript>
+</div>\r
+</div>\r
+<div class="sect1">\r
+<h2 id="_introduction">1. Introduction</h2>\r
+<div class="sectionbody">\r
+<div class="paragraph"><p>The tree branch (referring to a branch of i3 in the git repository) is the new\r
+version of i3. Due to the very deep changes and heavy refactoring of the source\r
+source, we decided to develop it in a seperate branch (instead of using the\r
+next/master-branch system like before).</p></div>\r
+</div>\r
+</div>\r
+<div class="sect1">\r
+<h2 id="_current_status">2. Current status</h2>\r
+<div class="sectionbody">\r
+<div class="paragraph"><p>Currently, the code is mostly working. Some of the i3 core developers have been\r
+using the tree branch version for a few weeks now. So, if you are eager to try\r
+out the new features and help us find bugs, give it a try!</p></div>\r
+<div class="paragraph"><p>At the same time, a word of warning is appropriate: This version of i3 might\r
+crash unexpectedly, so please be careful with important data (do not work for\r
+two days without saving…).</p></div>\r
+</div>\r
+</div>\r
+<div class="sect1">\r
+<h2 id="_getting_the_latest_tree_branch_version">3. Getting the latest tree branch version</h2>\r
+<div class="sectionbody">\r
+<div class="paragraph"><p>Check out the latest version:</p></div>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>$ git clone -b tree git://code.stapelberg.de/i3</tt></pre>\r
+</div></div>\r
+<div class="paragraph"><p>Then build and install it (has the same dependencies as the latest stable i3\r
+version):</p></div>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>$ cd i3\r
+$ make\r
+$ sudo cp i3 /usr/bin/i3-tree</tt></pre>\r
+</div></div>\r
+<div class="paragraph"><p>…and execute <tt>i3-tree</tt> instead of <tt>i3</tt> in your Xsession.</p></div>\r
+<div class="paragraph"><p><strong>IMPORTANT:</strong> Please note that configuration file compatibility is not yet done.\r
+So, make sure you use/customize the provided <tt>i3.config</tt> file.</p></div>\r
+</div>\r
+</div>\r
+<div class="sect1">\r
+<h2 id="_tree">4. Tree</h2>\r
+<div class="sectionbody">\r
+<div class="paragraph"><p>The most important change and reason for the name is that i3 stores all\r
+information about the X11 outputs, workspaces and layout of the windows on them\r
+in a tree. The root node is the X11 root window, followed by the X11 outputs,\r
+then workspaces and finally the windows themselve. In previous versions of i3\r
+we had multiple lists (of outputs, workspaces) and a table for each workspace.\r
+That approach turned out to be complicated to use (snapping), understand and\r
+implement.</p></div>\r
+<div class="sect2">\r
+<h3 id="_the_tree_consists_of_containers">4.1. The tree consists of Containers</h3>\r
+<div class="paragraph"><p>The building blocks of our tree are so called <tt>Containers</tt>. A <tt>Container</tt> can\r
+host a window (meaning an X11 window, one that you can actually see and use,\r
+like a browser). Alternatively, it could contain one or more <tt>Containers</tt>. A\r
+simple example is the workspace: When you start i3 with a single monitor, a\r
+single workspace and you open two terminal windows, you will end up with a tree\r
+like this:</p></div>\r
+<div class="imageblock" style="float:right;">\r
+<div class="content">\r
+<img src="tree-layout2.png" alt="layout2" />\r
+</div>\r
+</div>\r
+<div class="imageblock">\r
+<div class="content">\r
+<img src="tree-shot4.png" alt="shot4" />\r
+</div>\r
+<div class="title">Figure 1. Two terminals on standard workspace</div>\r
+</div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_orientation_and_split_containers">4.2. Orientation and Split Containers</h3>\r
+<div class="paragraph" id="OrientationSplit"><p>It is only natural to use so-called <tt>Split Containers</tt> in order to build a\r
+layout when using a tree as data structure. In i3, every <tt>Container</tt> has an\r
+orientation (horizontal, vertical or unspecified). So, in our example with the\r
+workspace, the default orientation of the workspace <tt>Container</tt> is horizontal\r
+(most monitors are widescreen nowadays). If you change the orientation to\r
+vertical (<tt>Alt+v</tt> in the default config) and <strong>then</strong> open two terminals, i3 will\r
+configure your windows like this:</p></div>\r
+<div class="imageblock">\r
+<div class="content">\r
+<img src="tree-shot2.png" alt="shot2" />\r
+</div>\r
+<div class="title">Figure 2. Vertical Workspace Orientation</div>\r
+</div>\r
+<div class="paragraph"><p>An interesting new feature of the tree branch is the ability to split anything:\r
+Let’s assume you have two terminals on a workspace (with horizontal\r
+orientation), focus is on the right terminal. Now you want to open another\r
+terminal window below the current one. If you would just open a new terminal\r
+window, it would show up to the right due to the horizontal workspace\r
+orientation. Instead, press <tt>Alt+v</tt> to create a <tt>Vertical Split Container</tt> (to\r
+open a <tt>Horizontal Split Container</tt>, use <tt>Alt+h</tt>). Now you can open a new\r
+terminal and it will open below the current one:</p></div>\r
+<div class="imageblock" style="float:right;">\r
+<div class="content">\r
+<img src="tree-layout1.png" alt="Layout" />\r
+</div>\r
+</div>\r
+<div class="imageblock">\r
+<div class="content">\r
+<img src="tree-shot1.png" alt="shot" />\r
+</div>\r
+<div class="title">Figure 3. Vertical Split Container</div>\r
+</div>\r
+<div style="clear:both;"></div>\r
+<div class="paragraph"><p>You probably guessed it already: There is no limit on how deep your hierarchy\r
+of splits can be.</p></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_level_up">4.3. Level up</h3>\r
+<div class="paragraph"><p>Let’s stay with our example from above. We have a terminal on the left and two\r
+vertically split terminals on the right, focus is on the bottom right one. When\r
+you open a new terminal, it will open below the current one.</p></div>\r
+<div class="paragraph"><p>So, how can you open a new terminal window to the <strong>right</strong> of the current one?\r
+The solution is to use <tt>level up</tt>, which will focus the <tt>Parent Container</tt> of\r
+the current <tt>Container</tt>. In this case, you would focus the <tt>Vertical Split\r
+Container</tt> which is <strong>inside</strong> the horizontally oriented workspace. Thus, now new\r
+windows will be opened to the right of the <tt>Vertical Split Container</tt>:</p></div>\r
+<div class="imageblock">\r
+<div class="content">\r
+<img src="tree-shot3.png" alt="shot3" />\r
+</div>\r
+<div class="title">Figure 4. Level Up, then open new terminal</div>\r
+</div>\r
+</div>\r
+</div>\r
+</div>\r
+<div class="sect1">\r
+<h2 id="_commands">5. Commands</h2>\r
+<div class="sectionbody">\r
+<div class="paragraph"><p>The authoritive reference for commands is <tt>src/cmdparse.y</tt>. You can also find\r
+most commands in <tt>i3.config</tt>. Here comes a short overview over the important\r
+commands:</p></div>\r
+<div class="sect2">\r
+<h3 id="_manipulating_layout">5.1. Manipulating layout</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>layout &lt;default|stacked|tabbed&gt;</tt></pre>\r
+</div></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_changing_focus">5.2. Changing Focus</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>next &lt;horizontal|vertical&gt;\r
+prev &lt;horizontal|vertical&gt;</tt></pre>\r
+</div></div>\r
+<div class="listingblock">\r
+<div class="title">Examples:</div>\r
+<div class="content">\r
+<pre><tt>bindsym Mod1+Left prev h\r
+bindsym Mod1+Right next h\r
+bindsym Mod1+Down next v\r
+bindsym Mod1+Up prev v</tt></pre>\r
+</div></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_moving">5.3. Moving</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>move &lt;before|after&gt; &lt;horizontal|vertical&gt;</tt></pre>\r
+</div></div>\r
+<div class="listingblock">\r
+<div class="title">Examples:</div>\r
+<div class="content">\r
+<pre><tt>bindsym Mod1+Shift+Left move before h\r
+bindsym Mod1+Shift+Right move after h\r
+bindsym Mod1+Shift+Down move before v\r
+bindsym Mod1+Shift+Up move after v</tt></pre>\r
+</div></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_changing_workspace">5.4. Changing workspace</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>workspace &lt;name&gt;</tt></pre>\r
+</div></div>\r
+<div class="listingblock">\r
+<div class="title">Examples:</div>\r
+<div class="content">\r
+<pre><tt>bindsym Mod1+1 workspace 1\r
+bindsym Mod1+2 workspace 2\r
+…</tt></pre>\r
+</div></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_moving_containers_to_workspaces">5.5. Moving Containers to workspaces</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>move workspace &lt;name&gt;</tt></pre>\r
+</div></div>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>bindsym Mod1+Shift+1 move workspace 1\r
+bindsym Mod1+Shift+2 move workspace 2\r
+…</tt></pre>\r
+</div></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_changing_border_style">5.6. Changing border style</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>border &lt;normal|none|1pixel&gt;</tt></pre>\r
+</div></div>\r
+</div>\r
+<div class="sect2">\r
+<h3 id="_changing_container_mode">5.7. Changing container mode</h3>\r
+<div class="listingblock">\r
+<div class="content">\r
+<pre><tt>mode &lt;tiling|floating|toggle&gt;</tt></pre>\r
+</div></div>\r
+</div>\r
+</div>\r
+</div>\r
+<div class="sect1">\r
+<h2 id="_the_rest">6. The rest</h2>\r
+<div class="sectionbody">\r
+<div class="paragraph"><p>What is not mentioned here explicitly is either unchanged and can be read in\r
+the <a href="http://i3.zekjur.net/docs/userguide.html">i3 User’s Guide</a> or it is not yet\r
+implemented.</p></div>\r
+</div>\r
+</div>\r
+</div>\r
+<div id="footnotes"><hr /></div>\r
+<div id="footer">\r
+<div id="footer-text">\r
+Last updated 2011-07-22 20:29:30 CEST\r
+</div>\r
+</div>\r
+</body>\r
+</html>\r