monochromatic

monochromatic blog: http://blog.z3bra.org
git clone git://z3bra.org/monochromatic
Log | Files | Refs

commit fc4c9e9667bce24d3631f6cec8e24a54d05a41aa
parent 9860f60130a4a32ca5474094ab68bd03ccca6b52
Author: z3bra <willy@mailoo.org>
Date:   Mon,  3 Feb 2014 19:41:22 +0100

Cleaned the whole HTML code. It is now W3C validated

Diffstat:
2013/08/test-your-css.html | 53+++++++++++++++++++++++++++--------------------------
2013/08/the-hard-way.html | 76++++++++++++++++++++++++++++++++++++++++++++++------------------------------
2013/09/java-without-eclipse.html | 80+++++++++++++++++++++++++++++++++++++++++++++----------------------------------
2013/10/home-sweet-home.html | 316++++++++++++++++++++++++++++++++++++++++++++-----------------------------------
2013/11/plain-old-mails.html | 121+++++++++++++++++++++++++++++++++++++++----------------------------------------
2013/12/love-me-some-latex.html | 128++++++++++++++++++++++++++++++++++++++++++++-----------------------------------
2014/01/images-in-terminal.html | 106+++++++++++++++++++++++++++++++++++++++++++++----------------------------------
about.html | 31+++++++++++++++++--------------
css/monochrome.css | 4++++
9 files changed, 508 insertions(+), 407 deletions(-)

diff --git a/2013/08/test-your-css.html b/2013/08/test-your-css.html @@ -27,14 +27,17 @@ We are, of course, in a paragraph. And it contains an inline quotation :<br /> <cite>Richard M. Stallman</cite> said <q>La cuisine indienne favorise les plats curryeux.</q><br /> But... What about blockquotes ?! Let's test : + </p> + + <blockquote> + <p> + There are some people who live in a dream world, and there are some who face reality; + and then there are those who turn one into the other. + </p> + &mdash; <cite>Douglas Everett</cite> + </blockquote> - <blockquote> - <p> - There are some people who live in a dream world, and there are some who face reality; - and then there are those who turn one into the other. - </p> - &mdash; <cite>Douglas Everett</cite> - </blockquote> + <p> That was a fine quote. Now, go on ! </p> @@ -52,7 +55,6 @@ </p> <h3>Tables and code</h3> - <p> <table> <thead> <tr> @@ -71,13 +73,17 @@ <tr> <td>cell #4-0</td> <td>cell #4-1</td> <td>cell #4-2</td> <td>cell #4-3</td> <td>cell #4-4</td> </tr> </tbody> </table> - Pretty nice isn't it ?<br /> - <br /> - Here is some code, using the &lt;pre&gt; tag (remember to escape special chars !)<br /> - <code> -<pre> -index.html -<hr/> + + <p> + Pretty nice isn't it ? + </p> + + <p> + Here is some code, using the &lt;pre&gt; tag (remember to escape special chars !) + </p> + + <pre><code>index.html + <span class="Comment">&lt;!DOCTYPE html&gt;</span> <span class="Function">&lt;</span><span class="Statement">html</span><span class="Function">&gt;</span> <span class="Function">&lt;</span><span class="Statement">head</span><span class="Function">&gt;</span> @@ -88,13 +94,10 @@ index.html Hello, World! <span class="Identifier">&lt;/</span><span class="Statement">p</span><span class="Identifier">&gt;</span> <span class="Identifier">&lt;/</span><span class="Statement">body</span><span class="Identifier">&gt;</span> -<span class="Identifier">&lt;/</span><span class="Statement">html</span><span class="Identifier">&gt;</span> -</pre> - </code> - <code> -<pre> -main.c -<hr/> +<span class="Identifier">&lt;/</span><span class="Statement">html</span><span class="Identifier">&gt;</span></code></pre> + +<pre><code>main.c + <span class="PreProc">#include </span><span class="String">&lt;stdio.h&gt;</span> <span class="PreProc">#define TEXT </span><span class="String">&quot;Hello, World!&quot;</span> @@ -106,10 +109,8 @@ main (<span class="Type">int</span> argc, <span class="Type">char</span> **argv) printf(<span class="String">&quot;</span><span class="Special">%s</span><span class="Special">\n</span><span class="String">&quot;</span>, TEXT); <span class="Statement">return</span> <span class="Constant">EXIT_SUCCESS</span>; -} -</pre> - </code> - </p> +}</code></pre> + </article> </section> </div> diff --git a/2013/08/the-hard-way.html b/2013/08/the-hard-way.html @@ -24,22 +24,30 @@ <p> As you will notice, I am fond of learning things "The Hard Way".<br /> I'm going to tell you why, but before that, here is my background, so that you'll understand - how I came to that opinion:<br /> - <ul> - <li><strong>2011, september</strong> &mdash; First attempt at linux, dual-booting Ubuntu 10.10</li> - <li><strong>2012, february</strong> &mdash; Upgrading to Archlinux, single booting</li> - <li><strong>2012, june</strong> &mdash; Obtaining an old computer, and setting it up as a home server</li> - <li><strong>2012, december</strong> &mdash; Switching to Archlinux at work, single booting</li> - <li><strong>2013, july</strong> &mdash; Installing CRUX on my notebook</li> - </ul> + how I came to that opinion: + </p> + + <ul> + <li><strong>2011, september</strong> &mdash; First attempt at linux, dual-booting Ubuntu 10.10</li> + <li><strong>2012, february</strong> &mdash; Upgrading to Archlinux, single booting</li> + <li><strong>2012, june</strong> &mdash; Obtaining an old computer, and setting it up as a home server</li> + <li><strong>2012, december</strong> &mdash; Switching to Archlinux at work, single booting</li> + <li><strong>2013, july</strong> &mdash; Installing CRUX on my notebook</li> + </ul> + + <p> I have alway tried to put myself in difficulties, to challenge myself and learn new things.<br /> During this period, I have searched plenty of tools matching the Unix Philosophy, by <cite>Ken Thompson</cite>: - <blockquote> - <p> - Write programs that do one thing and do it well. Write programs to work together. - Write programs to handle text streams, because that is a universal interface. - </p> - </blockquote> + </p> + + <blockquote> + <p> + Write programs that do one thing and do it well. Write programs to work together. + Write programs to handle text streams, because that is a universal interface. + </p> + </blockquote> + + <p> This is the reason why I prefer using CLI based tools rather than GUI based ones. I've come to the point where grabbing the mouse to click on a button is a <em>real</em> pain.<br /> But let's go back to <strong>the hard way</strong>. @@ -60,13 +68,17 @@ (I'm looking at you notepad...).<br /> Vim is hard to approach, and difficult to master, because of your good ol' reflexes. So it is an excellent tool to learn how to learn the hard way!<br /> - Here are the basic steps:<br /> - <ol> - <li>Use it as your <em>main editor</em>, stop using every other alternatives</li> - <li>Use it <em>before</em> starting to configure it</li> - <li>Do not use any plugin <em>at all</em></li> - <li>Don't give up !</li> - </ol> + Here are the basic steps: + </p> + + <ol> + <li>Use it as your <em>main editor</em>, stop using every other alternatives</li> + <li>Use it <em>before</em> starting to configure it</li> + <li>Do not use any plugin <em>at all</em></li> + <li>Don't give up !</li> + </ol> + + <p> Using Vim this way (at least, at the beginning), will help you mastering the tool faster than learning progressively. Of course, you could still use the mouse, until you are ready to stop using it, use the arrow keys to move within the buffer, delete by selecting your text in visual mode, and pressing &lt;SUPPR&gt;.<br /> @@ -98,15 +110,19 @@ <h3 id='homeworks'>Homeworks</h3> <p> There are a lot of place in the UNIX domain where the hard way can be applied, here are a few examples: - <ul> - <li>Write shell script that uses multiple tools to reproduce the behavior of another tool (eg, - <a href='http://tools.suckless.org/ii'>irc it</a>)</li> - <li>Switch from a desktop environnement to a standalone window manager, like <a href='http://www.6809.org.uk/evilwm/'>evilwm</a></li> - <li>When you master a tool, search for another one, less featured</li> - <li>Put yourself in difficulties. Don't be affraid to break things</li> - <li><strong>Break things!</strong></li> - <li>...</li> - </ul> + </p> + + <ul> + <li>Write shell script that uses multiple tools to reproduce the behavior of another tool (eg, + <a href='http://tools.suckless.org/ii'>irc it</a>)</li> + <li>Switch from a desktop environnement to a standalone window manager, like <a href='http://www.6809.org.uk/evilwm/'>evilwm</a></li> + <li>When you master a tool, search for another one, less featured</li> + <li>Put yourself in difficulties. Don't be affraid to break things</li> + <li><strong>Break things!</strong></li> + <li>...</li> + </ul> + + <p> I hope I conviced you, at least, to try it. It might be hard at first, But that's the point. </p> diff --git a/2013/09/java-without-eclipse.html b/2013/09/java-without-eclipse.html @@ -27,13 +27,17 @@ When one codes in C, using plain gcc + Makefile and a good text editor is adviced. This is the same for C++, bash, ruby, haskell, perl, python, bla bla bla...<br /> Why would java escape the rules ?!<br /> - <ul> - <li>It is hard to play with classpath.</li> - <li>It is boring to compile java by hand</li> - <li>Eclipse is SOOOOOOO good at it !</li> - <li>Eclipse has plenty of plugin to manage a project</li> - <li>bla bla bla...</li> - </ul> + </p> + + <ul> + <li>It is hard to play with classpath.</li> + <li>It is boring to compile java by hand</li> + <li>Eclipse is SOOOOOOO good at it !</li> + <li>Eclipse has plenty of plugin to manage a project</li> + <li>bla bla bla...</li> + </ul> + + <p> Of course, there are advantages ! And if these are good enough for you. Go with eclipse And have some fun !<br /> <br /> @@ -48,12 +52,16 @@ eclipse-setup.exe. but it follows my ideas, and I'm happy with it !<br /> <br /> It needs the following: - <ul> - <li>Your editor of choice</li> - <li>JRE (O RLY?)</li> - <li>JDK (U DON'T SAY)</li> - <li>Know your shit !</li> - </ul> + </p> + + <ul> + <li>Your editor of choice</li> + <li>JRE (O RLY?)</li> + <li>JDK (U DON'T SAY)</li> + <li>Know your shit !</li> + </ul> + + <p> You just have to know how to compile/run a java project. Here is what I learnt:<br /> <strong>javac</strong> is used for compiling, @@ -67,9 +75,9 @@ And you just activated my trap card...<br /> For sure, real project are a lot more complicated ! For example:<br /> <br /> - <code> -<pre> -~/src/java/eg + </p> + + <pre><code>~/src/java/eg ├── bin ├── build │ └── build.xml @@ -96,9 +104,9 @@ │ ├── Communication.java │ ├── Communication_TEST.java │ └── Log.java -└── tags -</pre> - </code> +└── tags</code></pre> + + <p> This is what my project looks like. sources are in src/, classes compiled in bin/. Each source has it's own package.<br /> <br /> @@ -109,17 +117,21 @@ It probably is the hardest part. Java is hard to compile properly, so tools like Ant are used in IDEs.<br /> <br /> - Basicaly, compilation goes like this:<br /> - <code><pre>javac -d bin/ -sourcepath src/ -classpath bin/ src/com/irc/utils/Command.java</pre></code> + Basicaly, compilation goes like this: + <p> + + <pre><code>javac -d bin/ -sourcepath src/ -classpath bin/ src/com/irc/utils/Command.java</code></pre> + + <p> -d specifies the directory where your classes will go.<br /> -sourcepath tells javac where to search for source files.<br /> -classpath is the same as the abode, but for class files.<br /> <br /> Do you see it coming ? <strong>YES</strong>, we will use a Makefile.<br /> - Here is mine:<br /> - <code> -<pre> -<span class="Comment"># Locate directories</span> + Here is mine: + </p> + + <pre><code><span class="Comment"># Locate directories</span> <span class="Identifier">class_d</span>=bin <span class="Identifier">lib_d</span>=lib <span class="Identifier">source_d</span>=src @@ -178,9 +190,9 @@ <span class="Constant"> mkdir </span><span class="Identifier">$(class_d)</span> <span class="Function">clean:</span> -<span class="Constant"> rm -rf </span><span class="Identifier">$(class_d)</span><span class="Constant">/*</span> -</pre> - </code> +<span class="Constant"> rm -rf </span><span class="Identifier">$(class_d)</span><span class="Constant">/*</span></code></pre> + + <p> It will search the appropriate sources in your sourcepath, and compile them in the associated classpath.<br /> Building the tests appart is done with <code>make TEST=[server|client|utils|all]</code> @@ -201,16 +213,16 @@ <br /> So you will have no problems building the correct script that will run your application. It will probably (in its simplest form) look like this:<br /> - <code> -<pre> -<span class="Comment">#!/bin/sh</span> + </p> + + <pre><code><span class="Comment">#!/bin/sh</span> <span class="Identifier">classpath</span>=bin:lib/log4j-1.2.12.jar <span class="Identifier">package</span>=com.irc.server -java <span class="Special">-cp</span> <span class="PreProc">$classpath</span> <span class="PreProc">$package.Server</span> -</pre> - </code> +java <span class="Special">-cp</span> <span class="PreProc">$classpath</span> <span class="PreProc">$package.Server</span></code></pre> + + <p> Isn't that easy ? </p> <h3>Conclusion</h3> diff --git a/2013/10/home-sweet-home.html b/2013/10/home-sweet-home.html @@ -23,6 +23,7 @@ <h3>Summary</h3> <p> Yes, a summary, because that's gonna be a LONG article. + </p> <ul> <li><a href="#intro">Introduction</a></li> <li><a href="#wm">Window manager</a></li> @@ -32,7 +33,6 @@ <li><a href="#bar">Status bar</a></li> <li><a href="#setup">Integration</a></li> </ul> - </p> <hr/> <h3 id="intro">Introduction</h3> @@ -72,14 +72,16 @@ </p> <p> There are three types of window managers: - <ul> - <li><strong>Floating</strong> &mdash; windows overlaps</li> - <li><strong>Tilling</strong> &mdash; windows are arranged in tiles - (kinda like a grid)</li> - <li><strong>Dynamics</strong> &mdash; both floating and tilling - are possible</li> - <li><strong>Aliens</strong> &mdash; Go home WM, you're drunk.</li> - </ul> + </p> + <ul> + <li><strong>Floating</strong> &mdash; windows overlaps</li> + <li><strong>Tilling</strong> &mdash; windows are arranged in tiles + (kinda like a grid)</li> + <li><strong>Dynamics</strong> &mdash; both floating and tilling + are possible</li> + <li><strong>Aliens</strong> &mdash; Go home WM, you're drunk.</li> + </ul> + <p> Floating management is the management style we're all used to, windows are independent and you can resize/move them freely around your desktop.<br /> @@ -100,6 +102,7 @@ <p> FYI, here is a non-exhaustive list of window managers I like (F = floating, T = tilling, D = dynamic... U DON'T SAY!) + </p> <ul> <li>cwm &mdash; Calm Window Manager (F)</li> <li>Ratpoison (A)</li> @@ -110,6 +113,7 @@ <li>spectrwm (T)</li> <li>...</li> </ul> + <p> Note that I <em>DIDN'T</em> mentioned AwesomeWM or openbox. beuâh. </p> @@ -119,9 +123,7 @@ href="http://gnome-look.org/content/show.php/Another+Gtk+RGBA+module+?content=100968">librgba</a>, <a href="https://github.com/chjj/compton">compton</a> to make it even prettier!<br /> - </p> - <br /> <a class='a_img' href='/img/2013-10-28-cwm.jpg'> <img class='a_img' src='/img/thumb/2013-10-28-cwm.jpg' alt='cwm screenshot'/> </a> @@ -151,55 +153,60 @@ &rarr; [0-7] for normal text<br /> &rarr; [8-15] for bold text<br /> Here is the color chart: + </p> - <table> - <tr> - <th></th> - <th>black</th> - <th>red</th> - <th>green</th> - <th>yellow</th> - <th>blue</th> - <th>magenta</th> - <th>cyan</th> - <th>white</th> - </tr> - <tr> - <th>dark</th> - <td>00</td> - <td>01</td> - <td>02</td> - <td>03</td> - <td>04</td> - <td>05</td> - <td>06</td> - <td>07</td> - </tr> - <tr> - <th>light</th> - <td>08</td> - <td>09</td> - <td>10</td> - <td>11</td> - <td>12</td> - <td>13</td> - <td>14</td> - <td>15</td> - </tr> - </table> + <table> + <tr> + <th></th> + <th>black</th> + <th>red</th> + <th>green</th> + <th>yellow</th> + <th>blue</th> + <th>magenta</th> + <th>cyan</th> + <th>white</th> + </tr> + <tr> + <th>dark</th> + <td>00</td> + <td>01</td> + <td>02</td> + <td>03</td> + <td>04</td> + <td>05</td> + <td>06</td> + <td>07</td> + </tr> + <tr> + <th>light</th> + <td>08</td> + <td>09</td> + <td>10</td> + <td>11</td> + <td>12</td> + <td>13</td> + <td>14</td> + <td>15</td> + </tr> + </table> + <p> Now, just tweak each color to fit your perfect theme!<br /> To do so, refer to the manual of your terminal. </p> <p> If you don't have one, here is a list of terminal you can use: - <ul> - <li><a href="http://software.schmorp.de/pkg/rxvt-unicode.html">rxvt-unicode</a></li> - <li><a href="https://github.com/thestinger/termite/">termite</a></li> - <li><a href="http://www.calno.com/evilvte/">evilvte</a> - <li><a href="http://www.afterstep.org/aterm.php">aterm</a> - <li><a href="http://freecode.com/projects/mterm">mterm</a> - </ul> + </p> + <ul> + <li><a href="http://software.schmorp.de/pkg/rxvt-unicode.html">rxvt-unicode</a></li> + <li><a href="https://github.com/thestinger/termite/">termite</a></li> + <li><a href="http://www.calno.com/evilvte/">evilvte</a> + <li><a href="http://www.afterstep.org/aterm.php">aterm</a> + <li><a href="http://freecode.com/projects/mterm">mterm</a> + </ul> + + <p> I have stick with rxvt-unicode (urxvt) personnally. I find it pretty powerfull, light and fast. Also, it can be extended in perl, which is great (muh URL selection). @@ -211,12 +218,16 @@ urxvt).<br /> All you have to do, is configure your colors in a file called <code>~/.Xresources</code>, and source it with the command: - <code><pre>xrdb -load ~/.Xresources</pre></code> + </p> + + <pre><code>xrdb -load ~/.Xresources</code></pre> + + <p> For example, here is mine (screenshot at the end of the section): - <code> - <pre> -Xresources -<hr /> + </p> + + <pre><code>Xresources + *background:#222222 *foreground:#e8e9ca @@ -236,10 +247,8 @@ Xresources *color12: #9ac0cd *color13: #9f79ee *color14: #79cdcd -*color15: #e8e9ca - </pre> - </code> - </p> +*color15: #e8e9ca</code></pre> + <p> For the font, it's quite the same, but I suggest that you search for the terms <em>xft font</em>, <em>bitmap fonts</em> and <em>X @@ -253,23 +262,28 @@ Xresources fixed pixeled font that can look odd, but draw fastly.<br /> Just make a choice.<br /> To declare a XFT font: - <code><pre>xft:&lt;font name&gt;:size=&lt;size&gt;</pre></code> + </p> + + <pre><code>xft:&lt;font name&gt;:size=&lt;size&gt;</code></pre> + + <p> Bitmap font are declared like this (taken from <code>xfontsel -print</code>, thanks to <a href="http://www.reddit.com/r/unixporn/comments/1pf6p4/howto_build_your_graphical_environment_piece_by/cd200mg">Gnu42</a> for the package). You can then use the <code>xfontsel</code> package, or look for a file named <code>fonts.dir</code> in your font directory. - <code><pre>-fndry-fmly-wght-slant-sWdth-astyl-pxlsz-ptSz-resx-resy-spc-avgWdth-rgstry-encdng</pre></code> + </p> - Here is a small example: - <code> - <pre> -Xresources -<hr /> -*font: xft:monospace:size=10 -*font: -misc-tamsyn-medium-*-*--14-101-*-*-*-*-* - </pre> - </code> + <pre><code>-fndry-fmly-wght-slant-sWdth-astyl-pxlsz-ptSz-resx-resy-spc-avgWdth-rgstry-encdng</code></pre> + + <p> + Here is a small example: </p> + + <pre><code>Xresources + +*font: xft:monospace:size=10 +*font: -misc-tamsyn-medium-*-*--14-101-*-*-*-*-*</code></pre> + <p> So, we have seen how to tweak the terminal, let's see what it looks like! @@ -290,17 +304,20 @@ Xresources user and the programs. It's a program you will communicate with to manipulate your system. An important program tough.<br /> Choose it carefully then. Here is the main shell list: - <ul> - <li>sh &mdash; The historical shell</li> - <li>bash &mdash; Improved shell, based on sh</li> - <li>zsh &mdash; An extremly powerfull shell with a great - completion system</li> - <li>fish &mdash; A user friendly shell, really different from the - above</li> - <li>csh &mdash; The Berkeley UNIX shell</li> - <li>tcsh &mdash; An improvement of csh</li> - </ul> + </p> + <ul> + <li>sh &mdash; The historical shell</li> + <li>bash &mdash; Improved shell, based on sh</li> + <li>zsh &mdash; An extremly powerfull shell with a great + completion system</li> + <li>fish &mdash; A user friendly shell, really different from the + above</li> + <li>csh &mdash; The Berkeley UNIX shell</li> + <li>tcsh &mdash; An improvement of csh</li> + </ul> + + <p> I personnaly used zsh a lot because it has a feature I like, the right prompt. also, it's completion system is really great (argument completion is a good thing to have, trust me..). But I now @@ -313,25 +330,29 @@ Xresources The first thing you will see from the shell is its prompt. The prompt is a set of characters that gives info to the user, and invite him to input commands. Basically, it looks like this: - <code><pre>$ </pre></code> + </p> + + <pre><code>$ </code></pre> + + <p> Fancy huh ? The prompt chars are contained in the variable <code>PS1</code> for sh/bash, and <code>PROMPT</code>/<code>RPROMPT</code> for zsh. - <code> - <pre> -$ PS1='z3bra-$ ' -z3bra-$ - </pre> - </code> + </p> + + <pre><code>$ PS1='z3bra-$ ' +z3bra-$</code></pre> + + <p> (You don't have to issue the two command to make it works.) Take a look at the bash manpage, section "Prompting" for more info on how to tweak it. Here is my personnal prompt: - <code> - <pre> -bashrc -<hr/> -<spak class="Comment"># Fancy prompt</span> + </p> + + <pre><code>bashrc + +<span class="Comment"># Fancy prompt</span> <span class="Statement">fg</span><span class="Statement">=</span><span class="PreProc">(</span><span class="Statement">'</span><span class="String">\[\e[0;30m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;31m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;32m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;33m\]</span><span class="Statement">'</span> <span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;34m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;35m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;36m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[0;37m\]</span><span class="Statement">'</span> <span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[1;30m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[1;31m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[1;32m\]</span><span class="Statement">'</span><span class="Special"> </span><span class="Statement">'</span><span class="String">\[\e[1;33m\]</span><span class="Statement">'</span> @@ -339,20 +360,18 @@ bashrc <span class="Identifier">nofg</span>=<span class="Statement">'</span><span class="String">\[\e[0m\]</span><span class="Statement">'</span> <span class="Identifier">PS1</span>=<span class="Statement">''</span>;<span class="Statement">[</span> <span class="Statement">-n</span> <span class="Statement">&quot;</span><span class="PreProc">$SSH_CLIENT</span><span class="Statement">&quot;</span> <span class="Statement">]</span> &amp;&amp; <span class="Identifier">PS1</span>=<span class="Statement">&quot;</span><span class="PreProc">${</span><span class="PreProc">fg</span><span class="PreProc">[</span><span class="Constant">8</span><span class="PreProc">]</span><span class="PreProc">}</span><span class="PreProc">$(</span><span class="Special">hostname|cut </span><span class="Special">-b-2</span><span class="PreProc">)</span><span class="String"> </span><span class="Statement">&quot;</span> -<span class="Statement">export</span><span class="Identifier"> PS1=</span><span class="Statement">&quot;</span><span class="String"> </span><span class="PreProc">${</span><span class="PreProc">PS1</span><span class="PreProc">}${</span><span class="PreProc">fg</span><span class="PreProc">[</span><span class="Constant">11</span><span class="PreProc">]</span><span class="PreProc">}</span><span class="String">──── </span><span class="PreProc">${</span><span class="PreProc">nofg</span><span class="PreProc">}</span><span class="Statement">&quot;</span> - </pre> - </code> +<span class="Statement">export</span><span class="Identifier"> PS1=</span><span class="Statement">&quot;</span><span class="String"> </span><span class="PreProc">${</span><span class="PreProc">PS1</span><span class="PreProc">}${</span><span class="PreProc">fg</span><span class="PreProc">[</span><span class="Constant">11</span><span class="PreProc">]</span><span class="PreProc">}</span><span class="String">──── </span><span class="PreProc">${</span><span class="PreProc">nofg</span><span class="PreProc">}</span><span class="Statement">&quot;</span></code></pre> + <p> And my old zsh prompt: + </p> + + <pre><code>zshrc - <code> - <pre> -zshrc -<hr /> <span class="Identifier">PROMPT</span>=<span class="Statement">&quot;</span> <span class="String">%{</span><span class="PreProc">$fg_bold</span><span class="String">[yellow]%} » </span><span class="Statement">&quot;</span> -<span class="Identifier">RPROMPT</span>=<span class="Statement">&quot;</span><span class="String">%{</span><span class="PreProc">$fg</span><span class="String">[black]%}%M:%{</span><span class="PreProc">$fg_bold</span><span class="String">[yellow]%}%~%{</span><span class="PreProc">$reset_color</span><span class="String">%} </span><span class="Statement">&quot;</span> - </pre> - </code> +<span class="Identifier">RPROMPT</span>=<span class="Statement">&quot;</span><span class="String">%{</span><span class="PreProc">$fg</span><span class="String">[black]%}%M:%{</span><span class="PreProc">$fg_bold</span><span class="String">[yellow]%}%~%{</span><span class="PreProc">$reset_color</span><span class="String">%} </span><span class="Statement">&quot;</span></code></pre> + + <p> <a class='a_img' href='/img/2013-10-28-shell.jpg'> <img class='a_img' src='/img/thumb/2013-10-28-shell.jpg' alt='shell screenshot'/> </a> @@ -375,15 +394,19 @@ zshrc But when you don't need images, <strong>unleash your shell!</strong><br /> Use CLI based app for text-based task. It has many advantages: - <ul> - <li>ALWAYS fit your colorscheme (see <a - href="#terminal">Terminal</a>)</li> - <li>Focus on usability</li> - <li>Integrate well with your whole setup</li> - <li>This is fast as hell</li> - <li>This is powerfull as hell</li> - <li><strike>You look like a hacker</strike></li> - </ul> + </p> + + <ul> + <li>ALWAYS fit your colorscheme (see <a + href="#terminal">Terminal</a>)</li> + <li>Focus on usability</li> + <li>Integrate well with your whole setup</li> + <li>This is fast as hell</li> + <li>This is powerfull as hell</li> + <li><span class='strike'>You look like a hacker</span></li> + </ul> + + <p> I personnaly use <a href="http://vim.org">vim</a>, <a href="http://irssi.org">irssi</a> and <a href="http://mutt.org">mutt</a> on a daily basis.<br /> @@ -411,7 +434,11 @@ zshrc <p> All of this is great, but I think that if you want to check the time, you're not willing to open a terminal, and type: - <code><pre>date +%H:%M</pre></code> + </p> + + <pre><code>date +%H:%M</code></pre> + + <p> It's not really practical most of the time. The same can apply to the amount of free space, to current volume level or the number of unread mails you have.<br /> @@ -422,15 +449,22 @@ zshrc href="https://github.com/LemonBoy/bar">bar ain't recursive</a>, by Lemon Boy.<br /> It is light, fast and simple. Exactly how I like it! - the purpose is simple:<br /> - <ol> - <li>Write a script that output a bunch of informations</li> - <li>Pipe that script into the bar</li> - <li>Run them within an infinite loop!</li> - </ol> + the purpose is simple: + </p> + + <ol> + <li>Write a script that output a bunch of informations</li> + <li>Pipe that script into the bar</li> + <li>Run them within an infinite loop!</li> + </ol> + <p> That is all you need. For example, if you only need the date in the bar: - <code><pre>while :; do date; done | bar &</pre></code> + </p> + + <pre><code>while :; do date; done | bar &amp;</code></pre> + + <p> And there you go! You can achieve really great looking stuff with that simple process:<br /> @@ -453,7 +487,11 @@ zshrc That magical file is simply a shell script that is called by default with <code>startx</code>. In fact, when you proceed this command, it does the following: - <code><pre>$ startx ~/.xinitrc -- :0</pre></code> + </p> + + <pre><code>$ startx ~/.xinitrc -- :0</code></pre> + + <p> It source your ~/.xinitrc, and launch it on the Xorg server number 0. To launch your wm of choice from the xinitrc, just add the command @@ -464,18 +502,21 @@ zshrc <p> Okay, now you have the theory. Before starting to pratice, I'll give you a few hints for a "good" xinitrc (yeah, I love making lists): - <ul> - <li>Launch ONLY session related commands</li> - <li>Make it evolutive, so that you can spawn multiple X sessions - at the same time</li> - <li>Fork every command, except those that are dependent, to speed - up the desktop spawning</li> - </ul> + </p> + <ul> + <li>Launch ONLY session related commands</li> + <li>Make it evolutive, so that you can spawn multiple X sessions + at the same time</li> + <li>Fork every command, except those that are dependent, to speed + up the desktop spawning</li> + </ul> + + <p> Finally, here is my own xinitrc - <code> - <pre> -xinitrc -<hr /> + </p> + + <pre><code>xinitrc + <span class="Comment">#!/bin/bash</span> <span class="Comment">#</span> <span class="Comment"># ~/.xinitrc</span> @@ -516,10 +557,9 @@ xsetroot <span class="Special">-cursor_name</span> left_ptr &amp; <span class="Special">[[</span> <span class="Statement">-z</span> <span class="PreProc">$1</span> <span class="Special">]]</span> &amp;&amp; wm cwm -wm <span class="PreProc">$1</span> - </pre> - </code> - <br /> +wm <span class="PreProc">$1</span></code></pre> + + <p> <a class='a_img' href='/img/2013-10-28-final.jpg'> <img class='a_img' src='/img/thumb/2013-10-28-final.jpg' alt='final screenshot'/> </a> diff --git a/2013/11/plain-old-mails.html b/2013/11/plain-old-mails.html @@ -61,39 +61,36 @@ more infos, you can check the mail(1) manpage). <br /> So here we go. Make sure those two variables are exported: - <code> - <pre> -$ export MAIL=$HOME/var/mail/INBOX + + <pre><code>$ export MAIL=$HOME/var/mail/INBOX $ export EDITOR=ed -$ export VISUAL=vim - </pre> - </code> +$ export VISUAL=vim</code></pre> + Now, we will create the most basic directory tree needed by the setup (We will improve it later) - <code> - <pre> -$ tree $HOME/var/mail + + <pre><code>$ tree $HOME/var/mail /home/z3bra/var/mail/ └── INBOX ├── cur ├── new └── tmp -4 directories, 0 files - </pre> - </code> +4 directories, 0 files</code></pre> + + <p> Ok, now the mail environment is set up. You can try the <code>mail</code> command at this point, but an empty mail tree will only result in the following message: - <code> - <pre> -No mail for z3bra - </pre> - </code> + </p> + + <pre><code>No mail for z3bra</code></pre> + + <p> For future convenience, copy your <code>/etc/mail.rc</code> to <code>~/.mailrc</code>, so we will be able to edit it later. </p> - + <p> Before continuing with <code>mail</code>, we will take a look at two mail related programs, <a href="http://fdm.sourceforge.net/">fdm</a> @@ -111,9 +108,9 @@ No mail for z3bra If you want a great tutorial for fdm, check out the <a href="http://fdm.sourceforge.net">FDM Quick start guide</a>. I'll just give you my own(simplified) config file: - <code> - <pre> -action "INBOX" maildir "%h/var/mail/INBOX" + </p> + + <pre><code>action "INBOX" maildir "%h/var/mail/INBOX" account &quot;&lt;account-name&gt;&quot; pop3s @@ -122,23 +119,24 @@ account &quot;&lt;account-name&gt;&quot; cache &quot;~/var/mail/.cache&quot; keep # Keeps mails on the server -match all action "INBOX" - </pre> - </code> +match all action "INBOX"</code></pre> + + <p> <code>FDM</code> can get infos from your <code>~/.netrc</code> file, which looks like this: - <code> - <pre> -machine &lt;pop3-server&gt; + </p> + + <pre><code>machine &lt;pop3-server&gt; login &lt;email@domain.tld&gt; -password &lt;password&gt; - </pre> - </code> +password &lt;password&gt;</code></pre> + + <p> check that mail fetching works with <code>fdm -kv fetch</code>. If it works, you could place <code>fdm fetch</code> in your cron entries. </p> </article> + <article> <h3>Sending mails</h3> <p> @@ -146,9 +144,9 @@ password &lt;password&gt; its <a href="http://msmtp.sourceforge.net/documentation.html"> documentation</a> Here is a simplified config file: - <code> - <pre> -defaults + </p> + + <pre><code>defaults auth on account &lt;account-name&gt; @@ -157,26 +155,24 @@ from &lt;email@domain.tld&gt; host &lt;stmp-server&gt; port 25 -account default : &lt;account-name&gt; - </pre> - </code> +account default : &lt;account-name&gt;</code></pre> + + <p> <code>msmtp</code> will also read your <code>~/.netrc</code> file to get your password. </p> + <p> by default, <code>mail</code> uses <code>sendmail</code> (guess what it does...). Add the following at the end of your <code>~/.mailrc</code>: - <code> - <pre> -~/.mailrc -<hr /> + </p> + + <pre><code>~/.mailrc ... # use msmtp instead of sendmail -set sendmail=&quot;/usr/bin/msmtp&quot; - </pre > - </code> - </p> +set sendmail=&quot;/usr/bin/msmtp&quot;</code></pre > + </article> <article> <h3>Writing a new mail</h3> @@ -185,18 +181,18 @@ set sendmail=&quot;/usr/bin/msmtp&quot; Now that tools we are going to interact with are set up, let's write and send out first mail. We will send this mail to ourselves, so let's go like this: - <code> - <pre> -$ mail email@domain.tld + </p> + + <pre><code>$ mail email@domain.tld Subject: Testing a new MUA Here is the top of the mail. You are actually typing like in ed's insert mode. To stop typing, just type a dot on its own line . -EOT - </pre> - </code> +EOT</code></pre> + + <p> This will send a mail to the given address. Nothing more. Nothing less.<br /> You can give multiple address to send the mail to multiple contacts. @@ -204,13 +200,13 @@ EOT If you need more flexibility (e.g. using your own editor, or input the text dynamically within a script, keep in mind that you can do the following: - <code> - <pre> -$ echo &quot;&lt;E-mail body goes here&gt;&quot; | mail -s &quot;&lt;subject&gt;&quot; &lt;email@domain.tld&gt; + </p> + + <pre><code>$ echo &quot;&lt;E-mail body goes here&gt;&quot; | mail -s &quot;&lt;subject&gt;&quot; &lt;email@domain.tld&gt; $ vim /tmp/body.txt -$ mail -s &quot;&lt;subject&gt;&quot; &lt;email@domain.tld&gt; &lt; /tmp/body.txt - </pre> - </code> +$ mail -s &quot;&lt;subject&gt;&quot; &lt;email@domain.tld&gt; &lt; /tmp/body.txt</code></pre> + + <p> As you might guess, the <code>-s</code> can be used to specify the subject. There are also <code>-c &lt;CC-field&gt;</code>, <code>-b &lt;BCC-field&gt;</code> for copy/carbin copy, and so on. Just @@ -221,18 +217,18 @@ $ mail -s &quot;&lt;subject&gt;&quot; &lt;email@domain.tld&gt; &lt; /tmp/body.tx <p> To read your mail, it's quite simple. Just type <code>mail</code> to get an output like: - <code> - <pre> -$ mail + </p> + + <pre><code>$ mail mail version v14.4.4. Type ? for help. &quot;/home/z3bra/var/mail/INBOX&quot;: 4 messages 1 unread O 1 contact@domain.tld Thu Jan 1 01:00 140/5273 Blah blah, subject A 2 me@mail.domain.tld Thu Jan 1 01:00 95/5869 RE: Previous subject A 3 NEWS GROUPS Thu Jan 1 01:00 222/15606 TR: Check this ous! &gt;U 4 willy@mailoo.org Thu Jan 1 01:00 104/4146 &gt;Testing a new MUA -? - </pre> - </code> +? </code></pre> + + <p> The <code>?</code> at the end is a prompt. You can input commands like <code>print &lt;num&gt;</code> to display the content of the mail number "num".<br /> @@ -246,6 +242,7 @@ A 3 NEWS GROUPS Thu Jan 1 01:00 222/15606 TR: Check this ous! aliases, mark as read, copy to another folder and delete the current mail. </p> + <p> Today, I discovered <code>mail</code> which does anything I need to manage my e-mails. I'll probably make the switch from mutt on all my diff --git a/2013/12/love-me-some-latex.html b/2013/12/love-me-some-latex.html @@ -24,7 +24,7 @@ I am now in my last year of engineering school, and this imply that I will have to write a report for the last 3 years I spent in my company, as an apprentice. As a fellow Linux user, I don't want to - use that <strike>fucking</strike> text processor. I love my vim + use that <span class='strike'>fucking</span> text processor. I love my vim setup, and I want to use it to write that report. </p> <h3>Introduction</h3> @@ -43,10 +43,10 @@ Seems interresting huh? So basically, what does it look like? Here's a simple document (download/view it <a href="http://raw.z3bra.org/null/la.pdf">HERE</a>) - <code> - <pre> -la.tex -<hr/> + </p> + + <pre><code>la.tex + <span class="Statement">\documentclass</span><span class="Special">[</span><span class="Constant">9pt</span><span class="Special">]{</span><span class="PreProc">report</span><span class="Special">}</span> <span class="Comment">% Start of document</span> <span class="Statement">\usepackage</span><span class="Special">[</span><span class="Constant">utf8</span><span class="Special">]</span><span class="Special">{</span><span class="Special">inputenc</span><span class="Special">}</span> <span class="Comment">% Write text unsing UTF-8 encoding</span> @@ -124,9 +124,9 @@ kids. They called me Mr Glass. <span class="Statement">\end</span><span class="Special">{</span><span class="PreProc">table</span><span class="Special">}</span> <span class="PreProc">\end{document}</span> -<span class="Comment">% vim&#0058; ft=tex tw=80 cc=81 nowrap fdm=marker :</span> - </pre> - </code> +<span class="Comment">% vim&#0058; ft=tex tw=80 cc=81 nowrap fdm=marker :</span></code></pre> + + <p> Wooow ! That's so many tags for such a simple thing!<br/> In fact, once you get used to those tags, they are no more a problem. Also, The more text you have, the less you'll see the tags. @@ -149,18 +149,24 @@ kids. They called me Mr Glass. an argument, that argument is given within {}. If that command needs an option, that option is given within []. Seems hard ? It is not. Take a look at this: - <code><pre><span class="Statement">\command</span><span + </p> + + + <pre><code><span class="Statement">\command</span><span class="Special">[</span><span class="Constant">option</span><span class="Special">]{</span><span class="PreProc">argument</span><span class="Special">}</span> <span - class="Comment">% comments are from % 'til EOL</span></pre></code> + class="Comment">% comments are from % 'til EOL</span></code></pre> + + <p> Do you get it now ? Then, move on. </p> <p> The simplest header would be: - <code> - <pre><span class="Statement">\documentclass</span><span class="Special">{</span><span class="PreProc">report</span><span class="Special">}</span> </pre> - </code> + </p> + <pre><code><span class="Statement">\documentclass</span><span class="Special">{</span><span class="PreProc">report</span><span class="Special">}</span></code></pre> + + <p> This will tell to latex that you want to write a report. Latex knows what a report is, so it will apply a set of rules (margin, font size, numerotation of chapters/section, and so on). So you will ONLY @@ -174,9 +180,10 @@ kids. They called me Mr Glass. Now, the body. Here to, I will give you the most basic body (eg, not covering figures, or table. The wiki is better than me to that). So, the most simple body is the following: - <code> - <pre> -<span class="PreProc">\begin{document}</span> + </p> + + + <pre><code><span class="PreProc">\begin{document}</span> <span class="PreProc">\chapter</span><span class="Special">{</span>First chapter<span class="Special">}</span> @@ -205,9 +212,8 @@ He's the exact opposite of the hero. And most times they're friends, like you and me! I should've known way back when... You know why, David? Because of the kids. They called me Mr Glass. -<span class="PreProc">\end{document}</span></pre> - </code> - </p> +<span class="PreProc">\end{document}</span></code></pre> + <p> You're still there ? Fine. Now, what should we do with that file ? </p> @@ -225,16 +231,20 @@ kids. They called me Mr Glass. So, how does it works ? Taht's easy, just call <code>latex</code> on your file to have it compiled. - <code><pre>latex file.tex</pre></code> + </p> + <pre><code>latex file.tex</code></pre> + + <p> This command will create a <strong>dvi</strong> file. If you want another format, you you be able to use any other tool to convert it to the fomat you want: - <code> - <pre> -dvips file.dvi -dvipdf file.dvi</pre> - </code> + </p> + + <pre><code>dvips file.dvi +dvipdf file.dvi</code></pre> + + <p> This will create two files: <code>file.ps</code>, and <code>file.pdf</code> (U DONT SAY?!), that you will be able to view in your prefered PDF viewer. (I suggest @@ -251,9 +261,9 @@ dvipdf file.dvi</pre> has saved me a lot of time!<br/> I could leave it to you as an exercise, but I know that some of you are just lazy. So here is the makefile I came with: - <code> - <pre> -<span class="Comment"># File name</span> + </p> + + <pre><code><span class="Comment"># File name</span> <span class="Identifier">BASE </span>= la <span class="Comment"># How to view output files</span> @@ -325,14 +335,16 @@ dvipdf file.dvi</pre> <span class="Function">mrproper:</span> clean <span class="Constant"> rm -f fig/*.eps</span> <span class="Constant"> rm -f *.pdf</span> -<span class="Constant"> rm -f *.ps</span> </pre> - </code> +<span class="Constant"> rm -f *.ps</span></code></pre> + + <p> Easy to use! - <code> - <pre> -make [dvi|ps|pdf|eps] # build either the dvi/ps/pdf files, or the eps files -make [view-ps|view-pdf] # calls ${VIEWER} on either the ps or pdf file </pre> - </code> + </p> + + <pre><code>make [dvi|ps|pdf|eps] # build either the dvi/ps/pdf files, or the eps files +make [view-ps|view-pdf] # calls ${VIEWER} on either the ps or pdf file</code></pre> + + <p> Maybe... To get the "eps" part, see the <a href="#tips">tips section</a> </p> @@ -346,29 +358,31 @@ make [view-ps|view-pdf] # calls ${VIEWER} on either the ps or pdf file </pre> <p> Before to unleash you, here are just a few tips, from my experience with latex (particularly images). - <ul id='tips'> - <li> - Read other documents, there are goldmine out there, and that - will help you a lot - </li> - <li> - Write the skeleton of your file BEFORE the text itself, so you - can focus on what you type. - </li> - <li> - DVI format only support EPS files to render figures, now you're - warned.. - </li> - <li> - <a href="http://umlet.com/">UMLet</a> is a great tool to create - diagrams and such. It also include a cli routine to export files - to format like pdf/jpg/eps (see the Makefile above) - </li> - <li> - Latex can also write letter! That's cool isn't it? - </li> - </ul> </p> + + <ul id='tips'> + <li> + Read other documents, there are goldmine out there, and that + will help you a lot + </li> + <li> + Write the skeleton of your file BEFORE the text itself, so you + can focus on what you type. + </li> + <li> + DVI format only support EPS files to render figures, now you're + warned.. + </li> + <li> + <a href="http://umlet.com/">UMLet</a> is a great tool to create + diagrams and such. It also include a cli routine to export files + to format like pdf/jpg/eps (see the Makefile above) + </li> + <li> + Latex can also write letter! That's cool isn't it? + </li> + </ul> + </article> </section> </div> diff --git a/2014/01/images-in-terminal.html b/2014/01/images-in-terminal.html @@ -37,12 +37,17 @@ taken from <a href='http://www.nongnu.org/ranger/'>this website</a>. Ranger. It's a text-based file manager (that's cool bro'), but the interesting point sits in the "dependencies" section: - <blockquote> - <cite><li>w3m for previewing images in "true color".</li></cite> - </blockquote> + </p> + + <blockquote> + <cite>&bull; w3m for previewing images in "true color".</cite> + </blockquote> + + <p> <a href='http://w3m.sourceforge.net'>w3m</a>. That was my answer. </p> + <h3>the package</h3> <p> w3m is a text-based web browser. It means that you can use it to @@ -51,6 +56,7 @@ different, as it acts more like a point'n'click software than a CLI app. </p> + <p> w3m uses gpm, a tool that let you use your terminal cursor like a mouse, moving it character by character.<br /> @@ -62,19 +68,21 @@ my f**cking image rendering, damn software!</q>. Every usefull keyword I could find. <strong>Nothing</strong>. </p> + <h3>the pursuit</h3> <p> A few minutes (when all the buckets were fullfilled with my tears), I finally tough: <q>Use the source, z3bra</q>.<br /> That's how I installed ranger. </p> + <p> Ranger is written in python. And if it uses w3m to render images, I would find the tool it uses to do so. Here is how I managed to find it: - <code> - <pre> -$ pacman -Ql ranger | grep -E 'image|img|w3m|picture|preview' + </p> + + <pre><code>$ pacman -Ql ranger | grep -E 'image|img|w3m|picture|preview' ranger /usr/lib/python3.3/site-packages/ranger/ext/__pycache__/img_display.cpython-33.pyc ranger /usr/lib/python3.3/site-packages/ranger/ext/__pycache__/img_display.cpython-33.pyo ranger /usr/lib/python3.3/site-packages/ranger/ext/img_display.py @@ -82,9 +90,9 @@ ranger /usr/lib/python3.3/site-packages/ranger/ext/img_display.py $ grep 'w3m' /usr/lib/python3.3/site-packages/ranger/ext/img_display.py ... W3MIMGDISPLAY_PATH = '/usr/lib/w3m/w3mimgdisplay' - ... - </pre> - </code> + ...</code></pre> + + <p> <strong>HOORAY!</strong> A binary ! Next step will be to understand how to make it render images in the terminal.. </p> @@ -101,10 +109,10 @@ W3MIMGDISPLAY_PATH = '/usr/lib/w3m/w3mimgdisplay' w3mimgdisplay commands are numbers from 0 to 6, and some commands take additionnal parameters.<br /> In the w3m tarball, you can find this: - <code> - <pre> -w3mimgdisplay.c -<hr> + </p> + + <pre><code>w3mimgdisplay.c + /* * w3mimg protocol * 0 1 2 .... @@ -121,7 +129,7 @@ w3mimgdisplay.c * 4; -none- nop, sync communication * response '\n' * 5; path get size of image, - * response "<width> <height>\n" + * response &quot;&lt;width&gt; &lt;height&gt;\n&quot; * 6; params(6) clear image * * params @@ -129,13 +137,13 @@ w3mimgdisplay.c * params(6) * &lt;x&gt;;&lt;y&gt;;&lt;w&gt;;&lt;h&gt; * - */ - </pre> - </code> + */</code></pre> + + <p> Here is the <em>params</em> interpreted on the mutt mail list: - <code> - <pre> -&gt; n - This is used when displaying multiple images + </p> + + <pre><code>&gt; n - This is used when displaying multiple images &gt; x - x coordinate to draw the image at (top left corner) &gt; y - y coordinate to draw the image at (top left corner) &gt; w - width to draw the image @@ -143,37 +151,40 @@ w3mimgdisplay.c &gt; sx - x offset to draw the image &gt; xy - y offset to draw the image &gt; sw - width of the original (source) image -&gt; sh - height of the original (source) image - </pre> - </code> - </p> - <p> +&gt; sh - height of the original (source) image</code></pre> + + <p> I now have a better idea on how the protocol works.<br /> Now, by crossing it with the ranger source, I ended up with this line: - <code><pre> echo -e '0;1;0;0;200;160;;;;;ant.jpg\n4;\n3;' | /usr/lib/w3m/w3mimgdisplay </pre></code> - <strong>BOOM !</strong> - <a href='http://chezmoicamarche.com'>It works!</a><br /> - <a class='a_img' href='/img/w3mimgdisplay-crap.jpg'> - <img class='a_img' src='/img/thumb/w3mimgdisplay-crap.jpg' - alt='Fucked up w3mimgdisplay trial'/> - </a> - <span class='caption'> - The result of the previous command. Our - picture drawn in 200x100px, at offset +0+0 in the terminal. - <br />I'm sure you're already trying it - <span class='smiley'>;)</span> - </span> </p> + + <pre><code>echo -e '0;1;0;0;200;160;;;;;ant.jpg\n4;\n3;' | /usr/lib/w3m/w3mimgdisplay </code></pre> + + <p> + <strong>BOOM !</strong> + <a href='http://chezmoicamarche.com'>It works!</a><br /> + <a class='a_img' href='/img/w3mimgdisplay-crap.jpg'> + <img class='a_img' src='/img/thumb/w3mimgdisplay-crap.jpg' + alt='Fucked up w3mimgdisplay trial'/> + </a> + <span class='caption'> + The result of the previous command. Our + picture drawn in 200x100px, at offset +0+0 in the terminal. + <br />I'm sure you're already trying it + <span class='smiley'>;)</span> + </span> + </p> + <h3>the wrapping</h3> <p> Okay, we can now display an image in the terminal, at the offset and size we want. Let's wrap it up in a script, to be more adaptive! We will need some tools to help us here. Feel free to search by yourself, as an exercise. Here is the script I came with: - <code> - <pre> -<span class="Comment">#!/bin/bash</span> + </p> + + <pre><code><span class="Comment">#!/bin/bash</span> <span class="Comment">#</span> <span class="Comment"># z3bra -- 2014-01-21</span> @@ -203,9 +214,9 @@ w3mimgdisplay.c <span class="Identifier">w3m_command</span>=<span class="Statement">&quot;</span><span class="String">0;1;0;0;</span><span class="PreProc">$width</span><span class="String">;</span><span class="PreProc">$height</span><span class="String">;;;;;</span><span class="PreProc">$FILENAME</span><span class="Special">\n</span><span class="String">4;</span><span class="Special">\n</span><span class="String">3;</span><span class="Statement">&quot;</span> tput cup <span class="PreProc">$((</span><span class="PreProc">$height</span><span class="Special">/</span><span class="PreProc">$FONTH</span><span class="PreProc">))</span> <span class="Constant">0</span> -<span class="Statement">echo</span><span class="String"> -e </span><span class="PreProc">$w3m_command</span>|<span class="PreProc">$W3MIMGDISPLAY</span> - </pre> - </code> +<span class="Statement">echo</span><span class="String"> -e </span><span class="PreProc">$w3m_command</span>|<span class="PreProc">$W3MIMGDISPLAY</span></code></pre> + + <p> Let's see the rendering...<br /> <a class='a_img' href='/img/w3mimgdisplay-good.jpg'> <img class='a_img' src='/img/thumb/w3mimgdisplay-good.jpg' @@ -228,6 +239,7 @@ tput cup <span class="PreProc">$((</span><span class="PreProc">$height</span><sp in an easy way. The dependency is not huge, and you can script it the way you want.<br /> </p> + <p> I hope you learnt a few things here, like tips to grok softwares, understand libs/protocols, or at least, the w3mimg protocol.<br /> @@ -235,12 +247,14 @@ tput cup <span class="PreProc">$((</span><span class="PreProc">$height</span><sp current cursor line and such. so if you have any improvement or idea, I'll be glad to modify my script and add your name :) </p> + <p> <em>Side note:</em> w3m can't render images in urxvt, if the depth is 32. That means that you can't render images on a transparent - background. Be sure that you comment the line </code>URxvt*depth: - 32</code> in your </code>~/.Xresources</code>. + background. Be sure that you comment the line <code>URxvt*depth: + 32</code> in your <code>~/.Xresources</code>. </p> + <h3>That's all, folks!</h3> </article> </section> diff --git a/about.html b/about.html @@ -30,13 +30,16 @@ <p> The technology behind this blog is very simple : + </p> + + <ul> + <li>Home server &mdash; <strong>archlinux</strong></li> + <li>Web server &mdash; <strong>thttpd</strong></li> + <li>Content &mdash; <strong>static html</strong></li> + <li>Site generator &mdash; <strong>/dev/null</strong></li> + </ul> - <ul> - <li>Home server &mdash; <strong>archlinux</strong></li> - <li>Web server &mdash; <strong>thttpd</strong></li> - <li>Content &mdash; <strong>static html</strong></li> - <li>Site generator &mdash; <strong>/dev/null</strong></li> - </ul> + <p> So yes, it is written entirely by hand in pure HTML. Why ?<br /> Because I can. Because I have the time. Because I like to do stuff from scratch. Because it's.. cool ? </p> @@ -45,16 +48,16 @@ <p> I am on a few other places online. You want me ? Here I am : - - <ul> - <li><a href='http://gitorious.org/~z3bra/'>gitorious.org</a> &mdash; a few project I own (no more updated)</li> - <li><a href='https://webchat.freenode.net/'>irc.freenode.net</a> &mdash; mostly on #vim-fr and #archlinux-fr</li> - <li><a href='http://forum.unixhub.net/'>unixhub.net</a> &mdash; Both on the forum and IRC</li> - <li><strike><a href='http://quakelive.com'>quakelive.com</a></strike> &mdash; Come on ID, bring linux suppot back..</li> - <li><a href='http://reddit.com/u/z-brah/'>reddit.com</a> &mdash; Well.. Does it count ?</li> - </ul> </p> + <ul> + <li><a href='http://gitorious.org/~z3bra/'>gitorious.org</a> &mdash; a few project I own (no more updated)</li> + <li><a href='https://webchat.freenode.net/'>irc.freenode.net</a> &mdash; mostly on #vim-fr and #archlinux-fr</li> + <li><a href='http://forum.unixhub.net/'>unixhub.net</a> &mdash; Both on the forum and IRC</li> + <li><span class='strike'><a href='http://quakelive.com'>quakelive.com</a></span> &mdash; Come on ID, bring linux support back..</li> + <li><a href='http://reddit.com/u/z-brah/'>reddit.com</a> &mdash; Well.. Does it count ?</li> + </ul> + <p> I wish you will enjoy browsing this blog as much as I like to write it.<br /> So, ladies and gentlemen, have a nice day ! diff --git a/css/monochrome.css b/css/monochrome.css @@ -224,6 +224,10 @@ blockquote { padding-left: 8px; } +.strike { + text-decoration: line-through; +} + .smiley { font-style: normal; font-family: sans-serif;