Update

damianavila · Sep 26, 2018 · ee587ef · ee587ef
1 parent 271bff3
commit ee587ef
Show file tree

Hide file tree

Showing 387 changed files with 12,013 additions and 3,030 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/.doit.db.bak b/.doit.db.bak
diff --git a/.doit.db.dat b/.doit.db.dat
diff --git a/.doit.db.dir b/.doit.db.dir
diff --git a/__pycache__/conf.cpython-36.pyc b/__pycache__/conf.cpython-36.pyc
diff --git a/cache/posts/48-themes-for-your-ipython-notebook.es.html b/cache/posts/48-themes-for-your-ipython-notebook.es.html
diff --git a/cache/posts/48-themes-for-your-ipython-notebook.es.html.dep b/cache/posts/48-themes-for-your-ipython-notebook.es.html.dep
diff --git a/cache/posts/a-little-hack-to-get-a-pdf-from-your-ipython-slides.es.html b/cache/posts/a-little-hack-to-get-a-pdf-from-your-ipython-slides.es.html
@@ -0,0 +1,27 @@
+
+<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
+</div>
+<div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<p>A lot of users of the <code>slides</code> option in <code>IPython.nbconvert</code> asked me about how to get a pdf from the generated Reveal.js-based slideshow.</p>
+<p>To make the story short, here you have the detailed steps:
+<!-- TEASER_END --></p>
+<ul>
+<li><code>cd</code> in the directory where your slideshow lives</li>
+<li>add this <code>custom.css</code> file: <a href="https://gist.github.com/damianavila/6211198">https://gist.github.com/damianavila/6211198</a></li>
+<li>run this little snippet: <a href="https://gist.github.com/damianavila/6211211">https://gist.github.com/damianavila/6211211</a></li>
+<li>run <code>python -m SimpleHTTPServer 8001</code></li>
+<li>open Mozilla Firefox browser and point to <code>localhost:8001</code></li>
+<li>add <code>?print.pdf</code> to the end of the url (ie, <code>http://127.0.0.1:8001/your-ipynb.slides.html?print-pdf</code>)</li>
+<li>print to pdf (use <em>Landscape</em> orientation)</li>
+</ul>
+<p>Do you want to get this little hack integrated to IPython? @fperez, the IPython BDFL does:</p>
+<p><blockquote class="twitter-tweet" data-conversation="none" data-cards="hidden" data-partner="tweetdeck"><p><a href="https://twitter.com/damian_avila">@damian_avila</a> <a href="https://twitter.com/profjsb">@profjsb</a> ultimately we should fold that into master though...</p>&mdash; Fernando Perez (@fperez_org) <a href="https://twitter.com/fperez_org/statuses/373190058326519808">August 29, 2013</a></blockquote></p>
+<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script><p>So, time to write some code and do a PR... in the meantime use this hack ;-)</p>
+<p>Damián.</p>
+
+</div>
+</div>
+</div>
+
+
diff --git a/cache/posts/a-little-hack-to-get-a-pdf-from-your-ipython-slides.es.html.dep b/cache/posts/a-little-hack-to-get-a-pdf-from-your-ipython-slides.es.html.dep
diff --git a/cache/posts/a-new-nikolas-theme-for-my-site-zen.es.html b/cache/posts/a-new-nikolas-theme-for-my-site-zen.es.html
@@ -0,0 +1,20 @@
+
+<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
+</div>
+<div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<p>Some days ago, <a href="https://plus.google.com/106780152352450272697/about">Aru Sahni</a> wrote to <a href="https://groups.google.com/forum/#!forum/nikola-discuss">Nikola's</a> forum and posted a link to his site... I really like the theme he was using so I though to take it as a starting point to develop my own theme.
+<!-- TEASER_END --></p>
+<p>I had to re-wrote some things to accommodate the templates to the last Nikola v6.0.0 release (in fact, I usually use master from Github, but I recommend you to use the released code for production), and to make the theme more generic one and easy to re-use by others.</p>
+<p>I got a clean and (I think) <em>easy to read</em> theme, with awesome icons (Font-awesome's if you didn't recognize yet), supporting both desktops/laptops and mobile devices and... I like it very much ;-)</p>
+<p>It was a great exercise to learn more about html, js, css and less (a very interesting approach to deal with css).</p>
+<p>I will publish the generic <strong>zen</strong> theme and the <strong>zen-ipython</strong> theme (which I'm using and you are seeing... right now) at the <a href="https://github.com/ralsina/nikola-themes">Nikola theme</a> repository in a few days, after some more testing and customization.</p>
+<p>Thanks again Aru Sahni, you are in some way the trigger for this theme... and very fun hours I experienced developing and learning by doing.</p>
+<p>Damián.</p>
+<p>PS: If you have any to say about the overall design, ideas for improvements, things you hate about this theme, just let me know in the comments. Thanks.</p>
+
+</div>
+</div>
+</div>
+
+
diff --git a/cache/posts/a-new-nikolas-theme-for-my-site-zen.es.html.dep b/cache/posts/a-new-nikolas-theme-for-my-site-zen.es.html.dep
diff --git a/cache/posts/a-poor-man-spell-checker-for-the-ipython-notebook.es.html b/cache/posts/a-poor-man-spell-checker-for-the-ipython-notebook.es.html
@@ -0,0 +1,190 @@
+
+<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
+</div>
+<div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<p>OK, today I will release another <strong>IPython</strong> <em>js</em> extension: <strong>Spellchecker</strong>, which obviously do what you are thinking... spell check the content of your <strong>IPython</strong> notebook cells.</p>
+<p>And why it is a <em>poor man</em> extension? Because it is a simple workaround to get the spell checker functionality and not a broad solution... but it works, and solve my spelling problems!
+<!-- TEASER_END --></p>
+<p>The main idea here is to use the spell checker functionality provided by your browser [yes, let to the others the complex things ;-)]. But, as you know, the spell checking functionality is disable inside the <strong>IPython</strong> notebook... and this is because each cell you actually see is a <em>codemirror</em> instance... and <em>codemirror</em> does not support spell checking by design... in fact, the <em>codemirror</em> text area (editor) is not a common html text area, hence the browser can not actually run the spell checker in this new text area.</p>
+<p>So, are we prohibited to apply a spell checker functionality over a <em>codemirror</em> instance? In fact, no... there is a way to do it applying something called <em>codemirror layouts</em> and using <em>js</em> spell checker libraries...</p>
+<p>But, I don't want to do this job yet (because of several causes which I do not describe here now), so I thought workaround and use the <strong>IPython</strong> <em>js</em> machinery to get a simple, narrow but useful solution.</p>
+<p>The workaround is simple:</p>
+<ul>
+<li>The spell checker will do its job at the cell level.</li>
+</ul>
+<p><img src="http://www.damian.oquanta.info/galleries/spellchecker/1.png" alt=""></p>
+<ul>
+<li><p>We need a way to get the content of the selected <strong>IPython</strong> notebook cell:</p>
+<div class="highlight"><pre><span></span><span class="mi">24</span>      <span class="kd">var</span> <span class="nx">input</span> <span class="o">=</span> <span class="nx">IPython</span><span class="p">.</span><span class="nx">notebook</span><span class="p">.</span><span class="nx">get_selected_cell</span><span class="p">().</span><span class="nx">get_text</span><span class="p">()</span>
+</pre></div>
+</li>
+<li><p>Put the content in a common html text area, and use the spell checker capabilities from the browser:</p>
+<div class="highlight"><pre><span></span><span class="mi">26</span>      <span class="kd">var</span> <span class="nx">textarea</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;textarea/&gt;&#39;</span><span class="p">)</span>
+  <span class="mi">27</span>          <span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;rows&#39;</span><span class="p">,</span><span class="s1">&#39;15&#39;</span><span class="p">)</span>
+  <span class="mi">28</span>          <span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;cols&#39;</span><span class="p">,</span><span class="s1">&#39;80&#39;</span><span class="p">)</span>
+  <span class="mi">29</span>          <span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;name&#39;</span><span class="p">,</span><span class="s1">&#39;source&#39;</span><span class="p">)</span>
+  <span class="mi">30</span>          <span class="p">.</span><span class="nx">text</span><span class="p">(</span><span class="nx">input</span><span class="p">);</span>
+</pre></div>
+</li>
+<li><p>Make the corrections.</p>
+</li>
+</ul>
+<p><img src="http://www.damian.oquanta.info/galleries/spellchecker/2.png" alt=""></p>
+<ul>
+<li><p>Get back the corrected content into the selected <strong>IPython</strong> notebook cell.</p>
+<div class="highlight"><pre><span></span><span class="mi">60</span>      <span class="kd">var</span> <span class="nx">corr_input</span> <span class="o">=</span> <span class="sb">`$`</span><span class="p">.</span><span class="nx">trim</span><span class="p">(</span><span class="sb">`$`</span><span class="p">(</span><span class="nx">textarea</span><span class="p">).</span><span class="nx">val</span><span class="p">());</span> <span class="c1">// note: backticks to avoid mathjax rendering, sorry.</span>
+  <span class="mi">61</span>      <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">corr_input</span><span class="p">);</span>
+  <span class="mi">62</span>      <span class="nx">IPython</span><span class="p">.</span><span class="nx">notebook</span><span class="p">.</span><span class="nx">get_selected_cell</span><span class="p">().</span><span class="nx">set_text</span><span class="p">(</span><span class="nx">corr_input</span><span class="p">);</span>
+</pre></div>
+</li>
+</ul>
+<p>And that's all... the complete code below:</p>
+
+</div>
+</div>
+</div>
+<div class="cell border-box-sizing code_cell rendered">
+<div class="input">
+<div class="prompt input_prompt">In&nbsp;[1]:</div>
+<div class="inner_cell">
+  <div class="input_area">
+    <div class=" highlight hl-ipython3"><pre><span></span><span class="n">cat</span> <span class="o">-</span><span class="n">n</span> <span class="o">/</span><span class="n">media</span><span class="o">/</span><span class="n">datos</span><span class="o">/</span><span class="n">Desarrollos</span><span class="o">/</span><span class="n">mIPyex</span><span class="o">/</span><span class="n">custom</span><span class="o">/</span><span class="n">spellchecker</span><span class="o">/</span><span class="n">main</span><span class="o">.</span><span class="n">js</span>
+</pre></div>
+
+    <i class="icon-hand-up icon-large" style="float:right; margin-bottom:8px; margin-right:10px">
+    &nbsp;&nbsp;Click me to hide the output</i>
+  </div>
+</div>
+</div>
+
+<div class="output_wrapper output_hidden">
+  <div class="output">
+
+<div class="output_wrapper">
+<div class="output">
+
+
+<div class="output_area">
+
+<div class="prompt"></div>
+
+
+<div class="output_subarea output_stream output_stdout output_text">
+<pre>     1	/*
+     2	* ----------------------------------------------------------------------------
+     3	* Copyright (c) 2013 - Damián Avila
+     4	*
+     5	* Distributed under the terms of the Modified BSD License.
+     6	*
+     7	* A little extension to spell check the selected cell from the IPython notebook.
+     8	* ----------------------------------------------------------------------------
+     9	*/
+    10	
+    11	function spellCheckerCSS() {
+    12	    var link = document.createElement(&#34;link&#34;);
+    13	    link.type = &#34;text/css&#34;;
+    14	    link.rel = &#34;stylesheet&#34;;
+    15	    link.href = require.toUrl(&#34;./custom/spellchecker/main.css&#34;);
+    16	    document.getElementsByTagName(&#34;head&#34;)[0].appendChild(link);
+    17	}
+    18	
+    19	function spellChecker(dummy) {
+    20	    console.log(dummy);
+    21	
+    22	    spellCheckerCSS();
+    23	
+    24	    var input = IPython.notebook.get_selected_cell().get_text()
+    25	
+    26	    var textarea = $(&#39;&lt;textarea/&gt;&#39;)
+    27	        .attr(&#39;rows&#39;,&#39;15&#39;)
+    28	        .attr(&#39;cols&#39;,&#39;80&#39;)
+    29	        .attr(&#39;name&#39;,&#39;source&#39;)
+    30	        .text(input);
+    31	
+    32	    var dialogform = $(&#39;&lt;div/&gt;&#39;)
+    33	        .append(
+    34	            $(&#39;&lt;form/&gt;&#39;).append(
+    35	                $(&#39;&lt;fieldset/&gt;&#39;).append(
+    36	                    $(&#39;&lt;label/&gt;&#39;)
+    37	                    .attr(&#39;for&#39;,&#39;source&#39;)
+    38	                    .text(&#34;Now you can edit the cell content and use &#34; +
+    39	                    &#34;the spellchecker support of your browser over it. &#34; +
+    40	                    &#34;In Chromium, just focus in the text area and &#34; +
+    41	                    &#34;select the text you want to spell check. Then you will &#34; +
+    42	                    &#34;be able to use the contextual menu (right click) to get &#34; +
+    43	                    &#34;words suggestion and other configuration options (lang). &#34; +
+    44	                    &#34;Finally press OK to get the corrected cell content into &#34; +
+    45	                    &#34;your selected IPython notebook cell.&#34;)
+    46	                    )
+    47	                    .append($(&#39;&lt;br/&gt;&#39;))
+    48	                    .append(
+    49	                        textarea
+    50	                    )
+    51	                )
+    52	        );
+    53	
+    54	    IPython.dialog.modal({
+    55	        title: &#34;Edit and spell check your cell content&#34;,
+    56	        body: dialogform,
+    57	            buttons: {
+    58	                &#34;OK&#34;: { class : &#34;btn-primary&#34;,
+    59	                    click: function() {
+    60	                       var corr_input = $.trim($(textarea).val());
+    61	                       console.log(corr_input);
+    62	                       IPython.notebook.get_selected_cell().set_text(corr_input);
+    63	                }},
+    64	                Cancel: {}
+    65	            }
+    66	    });
+    67	
+    68	}
+    69	
+    70	define(function() {
+    71	  return {
+    72	    parameters: function setup(param1) {
+    73	      IPython.toolbar.add_buttons_group([
+    74	        {
+    75	        &#39;label&#39;   : &#39;Spell check your selected cell content&#39;,
+    76	        &#39;icon&#39;    : &#39;icon-check-sign&#39;,
+    77	        &#39;callback&#39;: function(){spellChecker(param1)},
+    78	        &#39;id&#39;      : &#39;start_spellcheck&#39;
+    79	        },
+    80	      ]);
+    81	      var document_keydown = function(event) {
+    82	        if (event.which == 83 &amp;&amp; event.altKey) {
+    83	          spellChecker(param1);
+    84	          return false;
+    85	        };
+    86	        return true;
+    87	      };
+    88	      $(document).keydown(document_keydown);
+    89	    }
+    90	  }
+    91	});
+</pre>
+</div>
+</div>
+
+</div>
+</div>
+
+  </div>
+</div>
+
+</div>
+<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
+</div>
+<div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<p>As you can see at the end of the code... you have not only a button but also a keyboard shortcut to activate the spell checker extension: <strong>ALT + S</strong> (remember that the same goes for the <strong>Tweet me</strong> extension, but with <strong>ALT + T</strong>).</p>
+<p>Again, the extension lives in this new repo: <a href="https://github.com/damianavila/mIPyex">mIPyex</a>, where I will upload the development versions of my own extensions. When I get them enough stable, I will make a copy of them in the <a href="https://github.com/ipython-contrib/IPython-notebook-extensions">IPython notebook extensions</a> repo where you can get a lot of and useful interesting extensions.</p>
+<p>OK, I hope you enjoy and use this extension... because the <strong>IPython</strong> notebook is not only for write code... it is also powered to write other things, such as this blog post, and we have to keep spelling mistakes as low as possible to make the read of our content <em>pleasant</em>...</p>
+<p>See you...</p>
+<p>Damián</p>
+
+</div>
+</div>
+</div>
+
+
diff --git a/cache/posts/a-poor-man-spell-checker-for-the-ipython-notebook.es.html.dep b/cache/posts/a-poor-man-spell-checker-for-the-ipython-notebook.es.html.dep
diff --git a/cache/posts/a-simple-minimap-for-your-nbconverted-ipynb.es.html b/cache/posts/a-simple-minimap-for-your-nbconverted-ipynb.es.html
@@ -0,0 +1,95 @@
+
+<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
+</div>
+<div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<p>Some days ago, I presented a way to mimic the execution of <em>nbconverted</em> <strong>IPython</strong> notebooks (<em>ipynb</em>). Today, I will show you how to add a simple <em>minimap</em> to these static html documents.</p>
+<p>But, what is a <em>minimap</em>? Do you know <strong>SublimeText</strong> or <strong>Ninja-IDE</strong>? They are IDEs with a thin column to the right (of the main window) which provides an overview of the code we are working on... OK, you don't have an idea what am I talking about? Just go ahead and you will see...
+<!-- TEASER_END --></p>
+<p><strong>Addendum note</strong>: There are some <em>performance issues</em> with <strong>Firefox</strong>, but in <strong>Chromium</strong> it is working OK! Simplicity comes with some hidden costs ;-)</p>
+<p><strong>NOTE</strong>: if you are impatient, just go the beginning of this post and press the <code>Minimap</code> link next to the <code>Source</code> link... and surprise!</p>
+<p>Well, my first thought to develop this feature was to look if anybody had this same idea (a <em>minimap</em> for html-based documents) before, and obviously, there was somebody ;-)</p>
+<p>Mr. <strong>Google</strong> pointed me to a <a href="http://dropthebit.com/481/mini-page-navigation/">blog</a> where I found a nice js-based (working) solution.</p>
+<p>The implementation was very simple and we used the same strategy from the last blog posts: pass a template in the <code>IPython.nbconvert</code> call from the command line (but please, do not forget that you can also use a config file to pass the template name -and other things - to the <code>IPython.nbconvert</code> infrastructure).</p>
+<p>OK, but we needed to write the template before passing it, so we did it:</p>
+
+</div>
+</div>
+</div>
+<div class="cell border-box-sizing code_cell rendered">
+<div class="input">
+<div class="prompt input_prompt">In&nbsp;[1]:</div>
+<div class="inner_cell">
+  <div class="input_area">
+    <div class=" highlight hl-ipython3"><pre><span></span><span class="o">!</span>cat /media/datos/Ejemplos/minimap.tpl
+</pre></div>
+
+    <i class="icon-hand-up icon-large" style="float:right; margin-bottom:8px; margin-right:10px">
+    &nbsp;&nbsp;Click me to hide the output</i>
+  </div>
+</div>
+</div>
+
+<div class="output_wrapper output_hidden">
+  <div class="output">
+
+<div class="output_wrapper">
+<div class="output">
+
+
+<div class="output_area">
+
+<div class="prompt"></div>
+
+
+<div class="output_subarea output_stream output_stdout output_text">
+<pre>{%- extends &#39;html_full.tpl&#39; -%}
+
+{%- block header -%}
+{{ super() }}
+
+&lt;script src=&#34;http://dropthebit.com/demos/mini_page_nav/miniPageNav.js&#34;&gt;&lt;/script&gt;
+
+&lt;style type=&#34;text/css&#34;&gt;
+body{
+position: static;
+}
+&lt;/style&gt;
+
+{%- endblock header -%}
+</pre>
+</div>
+</div>
+
+</div>
+</div>
+
+  </div>
+</div>
+
+</div>
+<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
+</div>
+<div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<p>We extended the <code>html_full</code> template adding two things to the <code>block header</code>:</p>
+<ul>
+<li>the url of the script which makes all of this happens</li>
+<li>a simple css overwrite over <code>body.position</code> attribute to prevent the malfunction of the script.</li>
+</ul>
+<p>And as a the final step, we just wrote:</p>
+<p><code>ipython nbconvert 3_NumPy.ipynb --to html --template minimap.tpl --post serve</code></p>
+<p>in our console, and we saw something like <a href="http://damianavila.github.io/Python-Cientifico-HCC/3_NumPy.html">THIS</a></p>
+<p><strong>Do not forget!</strong>: There are some <em>performance issues</em> with <strong>Firefox</strong>, but in <strong>Chromium</strong> it is working OK! Simplicity comes with some hidden costs ;-)</p>
+<p>Nice, don't you think?</p>
+<p>We also did the same (with minor modifications) with our <strong>Nikola</strong> <em>Zen</em> theme (probably you had already tested it because I assume you are impatient!).</p>
+<p>Now, with this simple feature, you not only can quickly get an idea of the length of your documents (blog post, article, lecture, whatever...) but also they are easier to scroll and navigate!</p>
+<p>NOTE: If you are thinking "I want this minimap with in my <strong>IPython</strong> notebooks", you will have to hack the source code of the <code>js</code> library I used because it was designed for simple windows and not for more complex structures such as the notebook itself.</p>
+<p>Enjoy your <em>minimaps</em>!</p>
+<p>Damián.</p>
+
+</div>
+</div>
+</div>
+
+
diff --git a/cache/posts/a-simple-minimap-for-your-nbconverted-ipynb.es.html.dep b/cache/posts/a-simple-minimap-for-your-nbconverted-ipynb.es.html.dep