support raw HTML and merged old blog
This commit is contained in:
Yann Esposito (Yogsototh)
parent
e9f98fa5dc
commit
7f5758cd6e
GPG Key ID:
7B19A4C650D59646
|
|
@ -144,7 +144,11 @@ buildRules = do
|
|||
".html" -> do
|
||||
if out == siteDir </> "index.html"
|
||||
then buildArchive getPosts getTemplate out
|
||||
else genHtmlAction getPost getTemplate out
|
||||
else do
|
||||
htmlExists <- doesFileExist (srcDir </> asset)
|
||||
if htmlExists
|
||||
then copyFileChanged (srcDir </> asset) out
|
||||
else genHtmlAction getPost getTemplate out
|
||||
".pdf" -> do
|
||||
txtExists <- doesFileExist (srcDir </> asset)
|
||||
if txtExists
|
||||
|
|
@ -183,7 +187,8 @@ buildArchive getPosts getTemplate out = do
|
|||
title = "#+title: Yann Esposito's blog"
|
||||
menu = "@@html:<a href=\"/index.html\">Home</a> | <a href=\"/slides.html\">Slides</a> | <a href=\"/about-me.html\">About</a>@@"
|
||||
articleList = toS $ T.intercalate "\n" $ map postInfo posts
|
||||
fileContent = title <> "\n\n" <> menu <> "\n\n" <> welcomeTxt <> "\n\n" <> articleList
|
||||
olderArchives = "---\n\n@@html:<a href=\"/Scratch/en/blog/index.html\">Older Archives from my previous blog</a>@@"
|
||||
fileContent = title <> "\n\n" <> menu <> "\n\n" <> welcomeTxt <> "\n\n" <> articleList <> olderArchives
|
||||
eitherResult <- liftIO $ Pandoc.runIO $ Readers.readOrg (def { readerStandalone = True }) (toS fileContent)
|
||||
bp <- case eitherResult of
|
||||
Left _ -> fail "BAD"
|
||||
|
|
|
|||
|
|
@ -0,0 +1,90 @@
|
|||
#!/usr/bin/env stack
|
||||
{- stack
|
||||
--resolver lts-6.12
|
||||
--install-ghc
|
||||
runghc
|
||||
--package turtle
|
||||
--package ansi-terminal
|
||||
--verbosity s
|
||||
-}
|
||||
|
||||
{-# LANGUAGE OverloadedStrings #-}
|
||||
import Turtle
|
||||
|
||||
import Prelude hiding (FilePath)
|
||||
import qualified Control.Foldl as Fold
|
||||
import Data.Maybe (fromMaybe)
|
||||
import System.Console.ANSI
|
||||
import Control.Exception (catches,Handler(..))
|
||||
|
||||
main = mainProc `catches` [ Handler handleShellFailed
|
||||
, Handler handleProcFailed
|
||||
]
|
||||
|
||||
handleShellFailed :: ShellFailed -> IO ()
|
||||
handleShellFailed (ShellFailed cmdLine _) = do
|
||||
setSGR [SetColor Foreground Dull Red]
|
||||
echo $ ("[FAILED]: " <> cmdLine)
|
||||
setSGR [Reset]
|
||||
handleProcFailed :: ProcFailed -> IO ()
|
||||
handleProcFailed (ProcFailed procCommand procArgs _) = do
|
||||
setSGR [SetColor Foreground Dull Red]
|
||||
echo $ ("[FAILED]: " <> procCommand <> (mconcat procArgs))
|
||||
setSGR [Reset]
|
||||
|
||||
|
||||
mainProc :: IO ()
|
||||
mainProc = do
|
||||
-- So we can't have access to $0 in Haskell via stack.
|
||||
-- Too bad.
|
||||
-- So instead, I'll check I'm in the right directory.
|
||||
debug "Checking directory"
|
||||
(hakylldir,pubdir) <- checkDir
|
||||
debug "Retrieving revision number"
|
||||
rev <- fold (inshell "git rev-parse --short HEAD" empty) Fold.head
|
||||
debug ("Revision number retrieved: " <> fromMaybe "unknow" rev)
|
||||
debug $ "cd " <> (format fp pubdir)
|
||||
cd pubdir
|
||||
pwd >>= echo . format fp
|
||||
dshells "git init ."
|
||||
dshell ("git remote add upstream " <> mainRepository)
|
||||
dshells "git fetch upstream"
|
||||
dshells "git reset upstream/gh-pages"
|
||||
dshells "git add -A ."
|
||||
echo "Commit and publish"
|
||||
dshells ("git commit -m \"publishing at rev " <> (fromMaybe "unknow" rev) <> "\"")
|
||||
echo "Don't `git push` this time"
|
||||
dshells "git push -q upstream HEAD:gh-pages"
|
||||
|
||||
debug txt = do
|
||||
setSGR [SetColor Foreground Dull Yellow]
|
||||
echo txt
|
||||
setSGR [Reset]
|
||||
|
||||
dshells x = do
|
||||
debug x
|
||||
shells x empty
|
||||
|
||||
dshell x = do
|
||||
debug x
|
||||
shell x empty
|
||||
|
||||
checkDir :: IO (FilePath,FilePath)
|
||||
checkDir = do
|
||||
toolsExists <- testdir "tools"
|
||||
if (not toolsExists)
|
||||
then exit (ExitFailure 1)
|
||||
else return (".","content/_site")
|
||||
|
||||
mainRepository = "git@github.com:yogsototh/yannesposito.com.git"
|
||||
|
||||
cloneIfNeeded :: FilePath -> IO ()
|
||||
cloneIfNeeded pubdir = do
|
||||
contentExists <- testdir pubdir
|
||||
when (not contentExists) $
|
||||
procs "git"
|
||||
[ "clone"
|
||||
, "-b", "gh-pages"
|
||||
, mainRepository
|
||||
, format fp pubdir]
|
||||
empty
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1 @@
|
|||
pre code{color:#073642}code span.kw,code span a.kw{color:#859900;font-weight:normal;font-style:normal}code span.dt,code span a.dt{color:#B58900;font-weight:normal;font-style:normal}code span.dv,code span.bn,code span.fl,code span.ch,code span.st,code span a.dv,code span a.bn,code span a.fl,code span a.ch,code span a.st{color:#2AA198;font-weight:normal;font-style:normal}code span.co,code span a.co{color:#93A1A1;font-weight:normal;font-style:italic}code span.ot,code span a.ot{color:#268BD2;font-weight:normal;font-style:normal}code span.al,code span a.al{color:#DC322F;font-weight:normal;font-style:normal}code span.fu,code span a.fu{color:#268BD2;font-weight:normal;font-style:normal}code span.er,code span a.er{color:#DC322F;font-weight:normal;font-style:normal}code span.wa,code span a.wa{color:#CB4B16;font-weight:normal;font-style:italic}code span.cn,code span a.cn{color:#2AA198;font-weight:normal;font-style:normal}code span.sc,code span a.sc{color:#DC322F;font-weight:normal;font-style:normal}code span.vs,code span a.vs{color:#657B83;font-weight:normal;font-style:normal}code span.ss,code span a.ss{color:#DC322F;font-weight:normal;font-style:normal}code span.im,code span a.im{color:#657B83;font-weight:normal;font-style:normal}code span.va,code span a.va{color:#268BD2;font-weight:normal;font-style:normal}code span.cf,code span.op,code span a.cf,code span a.op{color:#859900;font-weight:normal;font-style:normal}code span.bu,code span.ex,code span a.bu,code span a.ex{color:#657B83;font-weight:normal;font-style:normal}code span.pp,code span a.pp{color:#CB4B16;font-weight:normal;font-style:normal}code span.at,code span a.at{color:#657B83;font-weight:normal;font-style:normal}code span.do,code span.an,code span.cv,code span.in,code span a.do,code span a.an,code span a.cv,code span a.in{color:#93A1A1;font-weight:normal;font-style:italic}a.sourceLine::before{text-decoration:none}
|
||||
|
|
@ -0,0 +1 @@
|
|||
.hljs{background:#f3f4f5}pre{padding:.8em;background:#f3f4f5;color:#657b83;color:#839496;display:block}pre .high0{color:#586e75}pre .high,pre .high1{color:#073642}pre .high2{color:#002b36}pre .DiffInserted,pre .DiffChanged,pre .DiffHeader,pre .DiffDeleted,pre .EmbeddedSource,pre .EmbeddedSourceBright{color:#839496}pre .DiffHeader{font-style:italic}pre .EmbeddedSource,pre .EmbeddedSourceBright{background-color:#073642}pre .low,pre .line-numbers,pre .DoctypeXmlProcessing{color:#586e75}pre .Comment{color:#586e75;font-style:italic}pre .yellow,pre .CssClass,pre .CssPropertyName,pre .Entity,pre .MarkupList{color:#b58900}pre .EntityInheritedClass{color:#b58900;font-style:italic}pre .orange,pre .String,pre .StringRegexp,pre .StringEmbeddedSource,pre .StringConstant,pre .MetaTagAll{color:#cb4b16}pre .red{color:#dc322f}pre .InvalidIllegal,pre .CssAtRule,pre .InvalidDeprecated{color:#dc322f;font-style:italic}pre .magenta,pre .CCCPreprocessorLine,pre .CCCPreprocessorDirective{color:#d33682}pre .violet,pre .Constant{color:#6c71c4}pre .blue,pre .Storage,pre .Variable,pre .CssId,pre .SupportFunction,pre .MetaTagInline,pre .StringRegexpSpecial,pre .CssTagName,pre .StringVariable,pre .Support{color:#268bd2}pre .cyan,pre .MarkupHeading,pre .CssAdditionalConstants,pre .CssPropertyValue,pre .SupportConstant{color:#2aa198}pre .green,pre .CssPseudoClass,pre .Keyword,pre .CssConstructorArgument{color:#859900}pre code{color:#657b83;background-color:#f3f4f5}pre .comment,pre .template_comment,pre .diff .header,pre .doctype,pre .lisp .string,pre .javadoc{color:#93a1a1;font-style:italic}pre .keyword,pre .css .rule .keyword,pre .winutils,pre .javascript .title,pre .method,pre .addition,pre .css .tag,pre .lisp .title{color:#859900}pre .number,pre .command,pre .string,pre .tag .value,pre .phpdoc,pre .tex .formula,pre .regexp,pre .hexcolor{color:#2aa198}pre .title,pre .localvars,pre .function .title,pre .chunk,pre .decorator,pre .builtin,pre .built_in,pre .lisp .title,pre .identifier,pre .title .keymethods,pre .id{color:#268bd2}pre .attribute,pre .variable,pre .instancevar,pre .lisp .body,pre .smalltalk .number,pre .constant,pre .class .title,pre .parent,pre .haskell .label{color:#b58900}pre .preprocessor,pre .pi,pre .shebang,pre .symbol,pre .diff .change,pre .special,pre .keymethods,pre .attr_selector,pre .important,pre .subst,pre .cdata{color:#cb4b16}pre .deletion{color:#dc322f}pre .tex .formula{background:#eee8d5}
|
||||
|
|
@ -0,0 +1,142 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - About</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="default">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<div id="choixlang">
|
||||
<a href="../../../Scratch/fr/about/">French</a>
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>About</h1>
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="default">
|
||||
<div class="corps">
|
||||
<p><img src="../../../Scratch/img/about/FlatAvatar.png" alt="Avatar" class="clean left" /></p>
|
||||
<p><strong>@</strong> <a href="mailto:yann.esposito@gmail.com">yann.esposito@gmail.com</a><br />
|
||||
<a href="http://twitter.com/yogsototh"><span class="social">t</span> <span class="citation" data-cites="yogsototh">@yogsototh</span></a><br />
|
||||
<a href="https://keybase.io/yogsototh"><img src="../../../Scratch/img/keybase.svg" style="height:16px" /> yogsototh</a><br />
|
||||
<a href="http://pinboard.in/u:yogsototh"><img src="../../../Scratch/img/pinboard.png" class="simple" style="height: 16px" /> yogsototh</a><br />
|
||||
<a href="http://github.com/yogsototh"><img src="../../../Scratch/img/GitHub-Mark-32px.png" class="simple" style="height: 16px" /> yogsototh</a><br />
|
||||
<a href="http://stackoverflow.com/users/40569/yogsototh"><img src="../../../Scratch/img/stackoverflow-logo.png" class="simple" style="height: 16px" /> yogsototh</a></p>
|
||||
<hr style="clear:both" />
|
||||
<p><a href="https://cardanohub.org"><img src="../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px; border-radius: 50%;" /> ADA:</a> <code style="display:inline-block; word-wrap:break-word; text-align: left; vertical-align: top; max-width: 85%;"> DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp </code></p>
|
||||
<h2 id="one-photo">One photo</h2>
|
||||
<figure>
|
||||
<img src="../../../Scratch/img/about/yann1.jpg" alt="I look like this" /><figcaption>I look like this</figcaption>
|
||||
</figure>
|
||||
<h2 id="shortly">Shortly</h2>
|
||||
<p>I am a Senior Software Engineer (Clojurist) for <a href="http://cisco.com">Cisco</a>, Threatgrid team.</p>
|
||||
<p>I was a Machine Learning expert and Software Engineer for Vigiglobe.</p>
|
||||
<p>I tend to use functional programming a lot. Mostly <a href="http://haskell.org">Haskell</a> and <a href="http://clojure.org">Clo<i>j</i>ure</a>.</p>
|
||||
<p>I am generally passionate about:</p>
|
||||
<ul>
|
||||
<li>Computer Science: <a href="http://yann.esposito.free.fr/recherche.php">I’ve got a post Ph. D. degree in Computer Science</a>.</li>
|
||||
<li>Programming: <a href="http://yann.esposito.free.fr/logiciels.php">I developed two scientific apps</a>, <a href="../../../Scratch/en/softwares">two Mac screen savers</a>, an <a href="http://ypassword.espozito.com">iOS app</a> and many other things; <a href="http://github.com/yogsototh">see my github</a></li>
|
||||
<li>Computer Security: <a href="http://yann.esposito.free.fr/enseignement/rez0.php#projet">I designed a secure web protocol (similar to TOR)</a>, a method to securely remember strong passwords, (<a href="../../../Scratch/en/softwares/ypassword/">programmed a dashboard widget</a> and a shell script to use this method).</li>
|
||||
</ul>
|
||||
<p>But before all, I love to learn. For example, I learned many programming languages:</p>
|
||||
<p>Functional:</p>
|
||||
<ul>
|
||||
<li><a href="http://haskell.org">Haskell</a>, <a href="http://purescript.org">Purescript</a>, <a href="http://elm-lang.org">Elm</a>,</li>
|
||||
<li><a href="http://clojure.org">Clo<i>j</i>ure</a>, <a href="https://mitpress.mit.edu/sites/default/files/sicp/index.html">Scheme</a>,</li>
|
||||
<li><a href="http://caml.inria.fr">camL</a></li>
|
||||
</ul>
|
||||
<p>Object Oriented:</p>
|
||||
<ul>
|
||||
<li>javascript, C, C++, Objective-C,</li>
|
||||
<li>Java,</li>
|
||||
<li><a href="http://python.org">Python</a>,</li>
|
||||
<li><a href="http://ruby-lang.org">Ruby</a>,</li>
|
||||
</ul>
|
||||
<p>Also:</p>
|
||||
<ul>
|
||||
<li><a href="http://perl.org">Perl</a>,</li>
|
||||
<li>awk,</li>
|
||||
<li>bash,</li>
|
||||
<li><a href="http://www.zsh.org">zsh</a>,</li>
|
||||
<li><a href="http://www.latex-project.org"><span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span></a>,</li>
|
||||
<li><a href="http://www.tug.org/metapost.html">metapost</a>,</li>
|
||||
</ul>
|
||||
<p><a href="../../../Scratch/files/resume/resume.html">My full resume»</a></p>
|
||||
<h2 id="old-stuff">Old stuff</h2>
|
||||
<ul>
|
||||
<li><a href="http://ypassword.espozito.com">Official YPassword website ✞</a></li>
|
||||
<li><a href="http://yann.esposito.free.fr/recherche.php?css=blue&lang=en">Research activities ✞</a></li>
|
||||
<li><a href="http://yann.esposito.free.fr/">My student website ✞ 2007</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="afterarticle">
|
||||
<div id="bottom">
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
Yann Esposito©
|
||||
</div>
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><span class="strike">Vim</span></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><span class="strike">nanoc</span></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,109 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Nanoc</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/01_nanoc/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Nanoc</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="what-is-nanoc">What is nanoc?</h1>
|
||||
<p>It is not exactly a <abbr title="Content Management System">CMS</abbr>. But a Framework to generate static web pages.</p>
|
||||
<p>You have to program yourself webpages, the code to generate the menu…</p>
|
||||
<p>I added feature to make my website multilingual for example</p>
|
||||
<p>You’ll can find many informations on the <a href="http://nanoc.stoneship.org">official nanoc website</a>.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/01_nanoc/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/01_nanoc/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2008-10-10
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
#!/usr/bin/env zsh
|
||||
(($#<1)) && { print 'usage: ack "regexp"' >&2; exit 1 }
|
||||
|
||||
listeFic=( **/*(.) )
|
||||
autoload zargs
|
||||
zargs -- $listeFic -- grep $1 | perl -ne 'use Term::ANSIColor;
|
||||
if (m/([^:]*)(:.*)('$1')(.*)/) {
|
||||
print color("green").$1;
|
||||
print color("reset").$2;
|
||||
print color("black","on_yellow").$3;
|
||||
print color("reset").$4."\n";
|
||||
} '
|
||||
|
||||
|
|
@ -0,0 +1,126 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Better than Grep</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/02_ackgrep/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Better than Grep</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="update">update</h1>
|
||||
<p>As <a href="http://www.theworkinggeek.com">Andy Lester</a> told me <a href="http://betterthangrep.com"><code>ack</code></a> is a simple file you only have to copy in your <code>~/bin</code> folder. Now I’ve got <code>ack</code> on my professional server.</p>
|
||||
<p>Go on <a href="http://betterthangrep.com">http://betterthangrep.com</a> to download it.</p>
|
||||
<p>Sincerely, I don’t understand <code>ack</code> don’t become a common command on all UNIX systems. I can no more live without. For me it is as essential as <code>which</code> or <code>find</code>.</p>
|
||||
<hr />
|
||||
<h1 id="better-than-grep">Better than grep</h1>
|
||||
<p>One of the my main usage of <code>grep</code> is</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="kw">grep</span> <span class="st">'pattern'</span> **/*<span class="kw">(.)</span></a></code></pre></div>
|
||||
<p>Most of time it is enough. But it is far better with colored output. <code>ack-grep</code> in Ubuntu does that. As I couldn’t install it on my ‘Evil Company Server’, I had done one myself in very few lines:</p>
|
||||
<pre><code>#!/usr/bin/env zsh
|
||||
(($#<1)) && { print 'usage: ack "regexp"' >&2; exit 1 }
|
||||
|
||||
listeFic=( **/*(.) )
|
||||
autoload zargs
|
||||
zargs -- $listeFic -- grep $1 | perl -ne 'use Term::ANSIColor;
|
||||
if (m/([^:]*)(:.*)('$1')(.*)/) {
|
||||
print color("green").$1;
|
||||
print color("reset").$2;
|
||||
print color("black","on_yellow").$3;
|
||||
print color("reset").$4."\n";
|
||||
} '</code></pre>
|
||||
<p>For my team and I it is usable enough. I hope it could help.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/02_ackgrep/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/02_ackgrep/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-07-22
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,189 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - A try to demystify 'Lost Highway'</title>
|
||||
<meta name="keywords" content="movie, David Lynch, Lost Highway, alternate reality" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/03_losthighway/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>A try to demystify 'Lost Highway'</h1>
|
||||
<h2>introduction</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/03_losthighway/intro.jpg" alt="Lost Highway" />
|
||||
</div>
|
||||
<div class="small">
|
||||
<p>…this movie must be watched knowing you’ll cannot resolve the solution. At his best you’ll can suggest an interpretation close to the one of David Lynch.<br />I believe I had found a coherent interpretation which allow to follow the movie without being totally lost. I believed it can give the keys necessary to make its own idea of the movie…</p>
|
||||
</div>
|
||||
<p>Lost Higway is a really good movie. You keep watching it event it seem totally obscure. This is one of the strength of David Lynch.</p>
|
||||
<p>The first time I watched Lost Highway, I was a bit lost. Here some of explanations of Lost Highway I found on the Internet:</p>
|
||||
<ul>
|
||||
<li>Fred make a pact with the devil incarnated by the <em>Mysterious Man</em>,</li>
|
||||
<li><em>Mysterious Man</em> is a video camera,</li>
|
||||
<li>Just the first part of the story is real. The rest is in the Fred’s imagination,</li>
|
||||
</ul>
|
||||
<p>and I don’t speak about many point of view found in forums.</p>
|
||||
<p>I finished to find two good site talking about this movie. But none of them still totally convinced me:</p>
|
||||
<ul>
|
||||
<li>the first is <a href="http://www.mediacircus.net/lh.html">mediacircus</a>,</li>
|
||||
<li>the second which state almost the same interpretation about the movie and explain with even more details is on <a href="http://www.jasonsweb.com/LostHighway/main.htm">jasonweb</a></li>
|
||||
</ul>
|
||||
<p>Nonetheless, this movie must be watched knowing you’ll cannot resolve the solution. At his best you’ll can suggest an interpretation close to the one of David Lynch.</p>
|
||||
<p>I believe I had found a coherent interpretation which allow to follow the movie <strong>without being totally lost</strong>. I believed it can give the keys necessary to make its own idea of the movie.</p>
|
||||
<h2 id="the-rorschach-test">The Rorschach test</h2>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/03_losthighway/rorschach.gif" alt="test de Rorschach" class="left" />
|
||||
</div>
|
||||
<p>Like the protagonist, everybody see what he want to see in this movie. It is an invitation to think. Watch this movie is a little like watch a Rorschach’s test. What do we see in it? Everybody put its own personnality in the interpretation of the movie.</p>
|
||||
<ul>
|
||||
<li>If you are mystic, you’ll see in the mysterious man a devil,</li>
|
||||
<li>If you are more psychanalytics, you’ll see an inconscient part of the protagonist…</li>
|
||||
</ul>
|
||||
<p>Generally, we stay in this movie and we fail explaining everything. There is almost always a point that don’t fit within the interpretation of the movie. This is why trying to find a unique good interpretation of this movie is a mistake.</p>
|
||||
<h2 id="interprétation-explanation">Interprétation ≠ Explanation</h2>
|
||||
<p>I give an <strong>interpretation</strong> and not an <strong>explanation</strong>. Just to tell my vision of the movie should be very different from yours. There is certainly many coherent explanations.</p>
|
||||
<p>I write this post because I believe I had found an interpretation which seems coherent for most of the movie.</p>
|
||||
<h1 id="movies-keys">Movie’s keys</h1>
|
||||
<div class="encadre" style="text-align: center">
|
||||
<p><strong>All is in Fred’s memory</strong></p>
|
||||
</div>
|
||||
<p>In a first, it is clear for me, it is not a fantastic movie. If you follow this line, you’ll face many problem explaining some scenes.</p>
|
||||
<p>My hypothesis is the movie describe the Fred’s representation of reality. Each of his tries to escape reality will fail.</p>
|
||||
<p>Fred had commited an horrible act, a murder, and try to <em>repair</em> his memory to accepts it. He’ll then create alternative realities.</p>
|
||||
<ul>
|
||||
<li>In a first time he kills his wife (Renee) because he believes she cheated at him.</li>
|
||||
<li>In the second part, he’s weaker and will be manipulated by the blond equivalent of Renee to kill Dick Laurent.</li>
|
||||
<li>In a third part, he kills Dick Laurent</li>
|
||||
</ul>
|
||||
<h2 id="why-this-interpretation-can-be-valid">Why this interpretation can be valid?</h2>
|
||||
<p>Because of the dialog at the begining of the movie. Cops ask Fred if he’s own a video camera:</p>
|
||||
<blockquote>
|
||||
<p>“Do you own a video camera?”<br />
|
||||
“No, Fred hates them.”<br />
|
||||
“I like to remember things my own way.”<br />
|
||||
“What do you mean by that?”<br />
|
||||
“How I remember them, not necessarily the way they happened.”</p>
|
||||
</blockquote>
|
||||
<p>Then, what we see is not reality but the Fred’s perception. Fred is the God of the reality we see. This is why some God/Devil interpretation of the movie works not so bad.</p>
|
||||
<h2 id="who-is-the-mysterious-man">Who is the mysterious man?</h2>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/03_losthighway/mysteryman.jpg" alt=" " class="left" />
|
||||
</div>
|
||||
<p>Who’s this mysterious man? He tells Fred it’s him who invited him in his house. He’s present at the party and in the house of Fred in the same time. Eyes wide open, looking everything Fred’s doing?</p>
|
||||
<p>It’s a key of the movie. In my humble opinion, I believe it represents the bad part of Fred. Certainly jalousy. If I was catholic, I’ll said he’s Satan. He observe, film but don’t act. He helps Fred to kill Dick Laurent. Fred had let him enter and cannot let him go. As <em>Iago</em> of Shakespeare is imprisonned by its own jalousy. The Mysterious Man help Fred doing the acts of violence. It also force Fred to remember the reality.</p>
|
||||
<p>When he makes love to his wife (Renee), he sees the face of the Mysterious Man instead of his wife’s face. In reality, it’s the same person for Fred. It should be her who’s the origin of his interior badness.</p>
|
||||
<h2 id="whos-at-the-origin-of-the-video-tapes">Who’s at the origin of the video tapes?</h2>
|
||||
<p>Certainly it’s the mysterious man (Fred himself) who makes them. Their reason should be:</p>
|
||||
<ul>
|
||||
<li>Remember the reality to Fred. From Fred point-of-view, video tapes are the reality. He tries to forget reality. But, finally, the video tapes go to the end: the murder of his wife.</li>
|
||||
<li>It may also be a reference to pornographic video tapes, made by Renee.</li>
|
||||
</ul>
|
||||
<h2 id="what-really-happened">What really happened?</h2>
|
||||
<p>There is many possibilities here. But we have many indices. Here is a supposition.</p>
|
||||
<h3 id="hypothesis">#1 Hypothesis</h3>
|
||||
<p>The protagonist is a garagist fallen in love with a porno actress. He believe the producer is the bad guy who go again his will. Then he kills Dick Laurent.</p>
|
||||
<h3 id="hypothesis-1">#2 Hypothesis</h3>
|
||||
<p>He was really married, he had killed his wife. The the remorse let him create an alternate self, which live in a kind of perfect world. But after the time pass, his obsession about the murder came again. And nobody could know if he had killed Andy or not.</p>
|
||||
<h2 id="which-one-then">which one then?</h2>
|
||||
<p>The second hypothesis seems better. We can make much more interpretation with it. It explain in most part the strange phone call from Dick Laurent to Pete. But the first hypothesis remain coherent. And, we should probably make an in depth explanantion using the first hypothesis. And I’m not sure it would be better.</p>
|
||||
<p>One of the strength of this movie is to understand there is many other coherent hypothesis. It is an expression of the <a href="http://en.wikipedia.org/wiki/Rashomon_effect">Rashomon effect</a>. Many different persons could describe in a coherent manner what they saw. But each description contradicts the others.</p>
|
||||
<hr />
|
||||
<h2 id="conclusion">Conclusion</h2>
|
||||
<p>There is much to tell about this movie. But I believe I put all essential keys here. It is a proof this movie is not a random one.</p>
|
||||
<p>I believe it is essential to remember the “test of Rorschach effet” when watching this movie.</p>
|
||||
<p>I’d like to know or opinion ; is my interpration wrong?</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/03_losthighway/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/03_losthighway/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-08-04
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - DRM are EVIL</title>
|
||||
<meta name="keywords" content="drm, protection, iTunes, Apple" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/04_drm/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>DRM are EVIL</h1>
|
||||
<h2>DRM are bad (+1)</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="drm-are-evil-1">DRM are EVIL (+1)</h1>
|
||||
<p>My wife bought about 500€ (at least) of TV Shows on iTunes. She bought the first season of Battlestar Gallactica in english (she notified the language after the dowload). DRM make it impossible to play it with french sub-titles.</p>
|
||||
<div class="encadre">
|
||||
<p style="text-align: center; font-size: 5em">
|
||||
<strong>WTF?</strong>
|
||||
</p>
|
||||
</div>
|
||||
<p>Result, my wife would never buy any TV show on iTunes. She don’t like DVD because it is not as easy to buy and to use than to simply download episodes.</p>
|
||||
<div class="encadre">
|
||||
<p>Therefore far less money for you EVIL Copyrighter!!!!!</p>
|
||||
</div>
|
||||
<p>My wife won’t see these episodes.<br /> This is a <strong>‘LOSE-LOSE’</strong> cooperation.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/04_drm/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/04_drm/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-08-15
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
if (($#<1)); then
|
||||
print -- "usage: $0:t branch_name" >&2
|
||||
exit 1
|
||||
fi
|
||||
|
||||
branch=$1
|
||||
git br ${branch}
|
||||
git co ${branch}
|
||||
git config branch.${branch}.remote origin
|
||||
git config branch.${branch}.merge refs/heads/${branch}
|
||||
|
||||
|
|
@ -0,0 +1,122 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Git remote branch creation</title>
|
||||
<meta name="keywords" content="git, branch, local, remote" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/05_git_create_remote_branch/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Git remote branch creation</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h2 id="easiest-remote-git-branch-creation">easiest remote Git branch creation</h2>
|
||||
<p>I use git simply to synchronize stuff for personnal projects. Therefore, when I create a local branch I want most of time this branch to be created remotely.</p>
|
||||
<p>Here is the script I use to achieve that:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="co">#!/usr/bin/env zsh</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="kw">if</span> <span class="kw">((</span><span class="ot">$#</span><1<span class="kw">))</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="kw">print</span> -- <span class="st">"usage: </span><span class="ot">$0</span><span class="st">:t branch_name"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="kw">exit</span> 1</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"><span class="ot">branch=$1</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9">git br <span class="ot">${branch}</span></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10">git <span class="kw">co</span> <span class="ot">${branch}</span></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11">git config branch.<span class="ot">${branch}</span>.remote origin</a>
|
||||
<a class="sourceLine" id="cb1-12" title="12">git config branch.<span class="ot">${branch}</span>.merge refs/heads/<span class="ot">${branch}</span></a></code></pre></div>
|
||||
<p>Of course, I suppose <code>origin</code> is already configured.</p>
|
||||
<p><em>Edit: Now I use <code>git push -u</code></em></p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/05_git_create_remote_branch/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/05_git_create_remote_branch/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-08-17
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
if (($#<1)); then
|
||||
print -- "usage: $0:t branch_name" >&2
|
||||
exit 1
|
||||
fi
|
||||
|
||||
branch=$1
|
||||
git br ${branch}
|
||||
git co ${branch}
|
||||
git config branch.${branch}.remote origin
|
||||
git config branch.${branch}.merge refs/heads/${branch}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
# recup branches not on local
|
||||
localbranches=( $(git br | sed 's/\*/ /') )
|
||||
remoteMissingBranches=( $(git br -r | \
|
||||
egrep -v "origin/HEAD|(${(j:|:)localbranches})" ) )
|
||||
for br in $remoteMissingBranches; do
|
||||
branch=${br#origin/}
|
||||
print "get remote branch $branch"
|
||||
git br ${branch}
|
||||
git config branch.${branch}.remote origin
|
||||
git config branch.${branch}.merge refs/heads/${branch}
|
||||
done
|
||||
|
|
@ -0,0 +1,213 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Git for self</title>
|
||||
<meta name="keywords" content="git, svn, workflow" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/06_How_I_use_git/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Git for self</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/06_How_I_use_git/central_architecture.png" alt="central architecture" />
|
||||
</div>
|
||||
<p>I use <a href="http://www.git-scm.org/">Git</a> to manage my personnal projects. I have a centralized repository which all my computer should synchronize with. Unfortunately I didn’t find clearly what I needed on the official Git documentation.</p>
|
||||
<p>In two words, if you want to use an SVN workflow with Git (and all its advantages) here is how to proceed.</p>
|
||||
<hr />
|
||||
<h2 id="initialisation">Initialisation</h2>
|
||||
<p>Suppose I’ve got a directory on my local computer containing a project I want to manage via Git. Here what to do:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="kw">cd</span> to/project/directory/</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">git init</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3">git add</a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">git commit</a></code></pre></div>
|
||||
</div>
|
||||
<p>Now all files in the <code>to/project/directory/</code> are versionned. If you want not to follow some just edit the file <code>.gitignore</code></p>
|
||||
<p>for example mine is:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb2-1" title="1">*.swp</a>
|
||||
<a class="sourceLine" id="cb2-2" title="2">.DS_Store</a>
|
||||
<a class="sourceLine" id="cb2-3" title="3">ikog.py.bak</a>
|
||||
<a class="sourceLine" id="cb2-4" title="4">output/Scratch/assets</a>
|
||||
<a class="sourceLine" id="cb2-5" title="5">output/Scratch/en</a>
|
||||
<a class="sourceLine" id="cb2-6" title="6">output/Scratch/fr</a>
|
||||
<a class="sourceLine" id="cb2-7" title="7">output/Scratch/multi</a></code></pre></div>
|
||||
</div>
|
||||
<p>Next, you want to put your project on a directory accessible from the web:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb3-1" title="1">git <span class="kw">clone</span> --bare <span class="kw">.</span> /path/to/repository</a></code></pre></div>
|
||||
</div>
|
||||
<p>Now on any computer you can do:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb4-1" title="1">git <span class="kw">clone</span> protocol://path/to/repository local_directory</a></code></pre></div>
|
||||
</div>
|
||||
<p>and <code>local_directory</code> will contain an up-to-date project.</p>
|
||||
<div class="encadre">
|
||||
<p><em> You should make this operation also on the computer used to create the repository. Just to verify all will be okay.</p>
|
||||
<p></em></p>
|
||||
</div>
|
||||
<hr />
|
||||
<h2 id="the-workflow">The workflow</h2>
|
||||
<p>To resume you now have one repository on the Internet, and one or many computer associated with it. Now, what you want is to synchronize everything.</p>
|
||||
<p>Before begining your work, the first thing to do is to get all modification from the Internet to your local host:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb5-1" title="1">git pull</a></code></pre></div>
|
||||
</div>
|
||||
<p>After that you can do (many times):</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb6-1" title="1">hack, hack, hack...</a>
|
||||
<a class="sourceLine" id="cb6-2" title="2">git add some files</a>
|
||||
<a class="sourceLine" id="cb6-3" title="3">git commit</a></code></pre></div>
|
||||
</div>
|
||||
<p>When you want your local modification to be on the Internet just do a simple:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb7"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb7-1" title="1">git push</a></code></pre></div>
|
||||
</div>
|
||||
<p>All should be ok.</p>
|
||||
<p>If you have some trouble with the <code>push</code> and <code>pull</code> verify your <code>.git/config</code> file ; it should contain the following lines:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb8"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb8-1" title="1">...</a>
|
||||
<a class="sourceLine" id="cb8-2" title="2">[remote <span class="st">"origin"</span>]</a>
|
||||
<a class="sourceLine" id="cb8-3" title="3"> url = protocol://url/of/the/repository</a>
|
||||
<a class="sourceLine" id="cb8-4" title="4"> fetch = +refs/heads/*:refs/remotes/origin/*</a>
|
||||
<a class="sourceLine" id="cb8-5" title="5">[branch <span class="st">"master"</span>]</a>
|
||||
<a class="sourceLine" id="cb8-6" title="6"> remote = origin</a>
|
||||
<a class="sourceLine" id="cb8-7" title="7"> merge = refs/heads/master</a>
|
||||
<a class="sourceLine" id="cb8-8" title="8">...</a></code></pre></div>
|
||||
</div>
|
||||
<h2 id="branches-synchronisation">Branches Synchronisation</h2>
|
||||
<p>Well, now, all seems ok, but you have to worry about two little things. Git is all about decentralisation and branches. It is very easy to manage one branch, or many branches on the same host. But synchronize branches on many hosts is not a natural operation.</p>
|
||||
<p>This is why I created two simple scripts to automate this. One for creating a branch locally and remotely. And one to get remotely created branched on your local host.</p>
|
||||
<p>Then when you want to create a new branch (locally and remotely) ; you simply have to do a:</p>
|
||||
<div>
|
||||
<code class="zsh">git-create-new-branch branch_name</code>
|
||||
</div>
|
||||
<p>and when you are on another computer and want to get locally all the remote branches you execute:</p>
|
||||
<div>
|
||||
<code class="zsh">git-get-remote-branches</code>
|
||||
</div>
|
||||
<p>Here are the code of theese two scripts:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb9"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb9-1" title="1"><span class="co">#!/usr/bin/env zsh</span></a>
|
||||
<a class="sourceLine" id="cb9-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb9-3" title="3"><span class="kw">if</span> <span class="kw">((</span><span class="ot">$#</span><1<span class="kw">))</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb9-4" title="4"> <span class="kw">print</span> -- <span class="st">"usage: </span><span class="ot">$0</span><span class="st">:t branch_name"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb9-5" title="5"> <span class="kw">exit</span> 1</a>
|
||||
<a class="sourceLine" id="cb9-6" title="6"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb9-7" title="7"></a>
|
||||
<a class="sourceLine" id="cb9-8" title="8"><span class="ot">branch=$1</span></a>
|
||||
<a class="sourceLine" id="cb9-9" title="9">git br <span class="ot">${branch}</span></a>
|
||||
<a class="sourceLine" id="cb9-10" title="10">git <span class="kw">co</span> <span class="ot">${branch}</span></a>
|
||||
<a class="sourceLine" id="cb9-11" title="11">git config branch.<span class="ot">${branch}</span>.remote origin</a>
|
||||
<a class="sourceLine" id="cb9-12" title="12">git config branch.<span class="ot">${branch}</span>.merge refs/heads/<span class="ot">${branch}</span></a></code></pre></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb10"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb10-1" title="1"><span class="co">#!/usr/bin/env zsh</span></a>
|
||||
<a class="sourceLine" id="cb10-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb10-3" title="3"><span class="co"># recup branches not on local</span></a>
|
||||
<a class="sourceLine" id="cb10-4" title="4"><span class="ot">localbranches=(</span> <span class="ot">$(</span>git br <span class="kw">|</span> <span class="kw">sed</span> <span class="st">'s/\*/ /'</span><span class="ot">)</span> <span class="ot">)</span></a>
|
||||
<a class="sourceLine" id="cb10-5" title="5"><span class="ot">remoteMissingBranches=(</span> <span class="ot">$(</span>git br -r <span class="kw">|</span> <span class="kw">\</span></a>
|
||||
<a class="sourceLine" id="cb10-6" title="6"> <span class="kw">egrep</span> -v <span class="st">"origin/HEAD|(${(j:|:)localbranches})"</span> <span class="ot">)</span> <span class="ot">)</span></a>
|
||||
<a class="sourceLine" id="cb10-7" title="7"><span class="kw">for</span> br <span class="kw">in</span> <span class="ot">$remoteMissingBranches</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb10-8" title="8"> <span class="ot">branch=${br#</span>origin/<span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb10-9" title="9"> <span class="kw">print</span> <span class="st">"get remote branch </span><span class="ot">$branch</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb10-10" title="10"> git br <span class="ot">${branch}</span></a>
|
||||
<a class="sourceLine" id="cb10-11" title="11"> git config branch.<span class="ot">${branch}</span>.remote origin</a>
|
||||
<a class="sourceLine" id="cb10-12" title="12"> git config branch.<span class="ot">${branch}</span>.merge refs/heads/<span class="ot">${branch}</span></a>
|
||||
<a class="sourceLine" id="cb10-13" title="13"><span class="kw">done</span></a></code></pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/06_How_I_use_git/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/06_How_I_use_git/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-08-18
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,113 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Screensaver compilation option for Snow Leopard<sub>©</sub></title>
|
||||
<meta name="keywords" content="screensaver, Apple, mac, Xcode" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/07_Screensaver_compilation_option_for_Snow_Leopard/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Screensaver compilation option for Snow Leopard<sub>©</sub></h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="how-to-recompile-your-screensaver-to-be-snow-leopardc-compatible">How to recompile your screensaver to be Snow Leopard(c) compatible</h1>
|
||||
<p>I upgraded to Mac OS X 10.6 Snow Leopard(c), and my <a href="../../../../Scratch/en/softwares/yclock/">YClock</a> screensaver didn’t work on it. After searching on google, the problem seems to be just a recompilation away. Unfortunately, even recompiling it in 64 bit it didn’t work either. After a bit more research (thanks to <a href="http://community.electricsheep.org/node/236">ElectricSheep</a> ).</p>
|
||||
<p>I discovered the good parameters for compilation.</p>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/07_Screensaver_compilation_option_for_Snow_Leopard/xcodeConfig.png" alt="XCode configuration" />
|
||||
</div>
|
||||
<p>For now I didn’t compiled it to work also on Tiger and Leopard. I don’t know XCode enought to know how to make the Garbage collector to be disabled on 32 bits version and enabled on 64 bits version.</p>
|
||||
<p>It was a bit difficult to discover these informations. Hope this post helped someone.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/07_Screensaver_compilation_option_for_Snow_Leopard/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/07_Screensaver_compilation_option_for_Snow_Leopard/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-06
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
|
||||
<plist version="1.0">
|
||||
<dict>
|
||||
<key>Disabled</key>
|
||||
<false/>
|
||||
<key>Label</key>
|
||||
<string>local.sshd</string>
|
||||
<key>Program</key>
|
||||
<string>/usr/libexec/sshd-keygen-wrapper</string>
|
||||
<key>ProgramArguments</key>
|
||||
<array>
|
||||
<string>/usr/sbin/sshd</string>
|
||||
<string>-i</string>
|
||||
</array>
|
||||
<key>Sockets</key>
|
||||
<dict>
|
||||
<key>Listeners</key>
|
||||
<dict>
|
||||
<key>SockServiceName</key>
|
||||
<string>https</string>
|
||||
</dict>
|
||||
</dict>
|
||||
<key>inetdCompatibility</key>
|
||||
<dict>
|
||||
<key>Wait</key>
|
||||
<false/>
|
||||
</dict>
|
||||
<key>StandardErrorPath</key>
|
||||
<string>/dev/null</string>
|
||||
<key>SHAuthorizationRight</key>
|
||||
<string>system.preferences</string>
|
||||
</dict>
|
||||
</plist>
|
||||
|
|
@ -0,0 +1,160 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - ssh to Listen 443 on Snow Leopard</title>
|
||||
<meta name="keywords" content="Apple, mac, ssh, security" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/08_Configure_ssh_to_listen_the_port_443_on_Snow_Leopard/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>ssh to Listen 443 on Snow Leopard</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="surf-everywhere-as-if-you-were-at-home">Surf everywhere as if you were at home</h1>
|
||||
<p>In order to bypass <em>evil</em> company firewall and to surf safely on unsafe <sc>wifi</sc>. I keep an ssh server listening on the port 443.</p>
|
||||
<p>Then from my laptop or my local computer I just have to launch the marvelous</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="kw">ssh</span> -f -p 443 -ND 9050 username@host</a></code></pre></div>
|
||||
</div>
|
||||
<p>and a local <sc>socks</sc> proxy listening on port 9050 is launched. The <sc>socks</sc> proxy will transfer local requests via the ssh tunnel. Therefore I can surf locally as if I was on my own computer. I can put password and card number without fear the local <sc>wifi</sc> network to be <em>sniffed</em>. I simply need to configure my web browser to user the <sc>socks</sc> proxy on localhost and port 9050.</p>
|
||||
<p>I get this information from <a href="http://dltj.org/article/ssh-as-socks-proxy/">this post</a>.</p>
|
||||
<h1 id="ssh-and-snow-leopardc">Ssh and Snow Leopard(c)</h1>
|
||||
<p>Here I don’t want to talk about how great <sc>socks</sc> proxy via ssh tunneling is but how to configure my local server.</p>
|
||||
<p>I have Mac with Snow Leopard(c) at home and it is far from enough to modify the <code>/etc/sshd.config</code> file. The system use <code>launchd</code> to launch starting daemons.</p>
|
||||
<p>I posted the question on <a href="http://discussions.apple.com">Apple Discussions</a> in this <a href="http://discussions.apple.com/thread.jspa?messageID=10141032">discussion thread</a>. Thanks to all guys who helped me. And the solution is:</p>
|
||||
<p>Create the file <tt>/Library/LaunchDaemons/ssh-443.plist</tt> containing:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode xml"><code class="sourceCode xml"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><?xml</span> version="1.0" encoding="UTF-8"<span class="kw">?></span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="dt"><!DOCTYPE </span>plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"<span class="dt">></span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="kw"><plist</span><span class="ot"> version=</span><span class="st">"1.0"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"><span class="kw"><dict></span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw"><key></span>Disabled<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw"><false/></span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="kw"><key></span>Label<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="kw"><string></span>local.sshd<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw"><key></span>Program<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> <span class="kw"><string></span>/usr/libexec/sshd-keygen-wrapper<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> <span class="kw"><key></span>ProgramArguments<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="kw"><array></span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="kw"><string></span>/usr/sbin/sshd<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> <span class="kw"><string></span>-i<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> <span class="kw"></array></span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> <span class="kw"><key></span>Sockets<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> <span class="kw"><dict></span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> <span class="kw"><key></span>Listeners<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> <span class="kw"><dict></span></a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"> <span class="kw"><key></span>SockServiceName<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"> <span class="kw"><string></span>https<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-22" title="22"> <span class="kw"></dict></span></a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"> <span class="kw"></dict></span></a>
|
||||
<a class="sourceLine" id="cb2-24" title="24"> <span class="kw"><key></span>inetdCompatibility<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-25" title="25"> <span class="kw"><dict></span></a>
|
||||
<a class="sourceLine" id="cb2-26" title="26"> <span class="kw"><key></span>Wait<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-27" title="27"> <span class="kw"><false/></span></a>
|
||||
<a class="sourceLine" id="cb2-28" title="28"> <span class="kw"></dict></span></a>
|
||||
<a class="sourceLine" id="cb2-29" title="29"> <span class="kw"><key></span>StandardErrorPath<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-30" title="30"> <span class="kw"><string></span>/dev/null<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-31" title="31"> <span class="kw"><key></span>SHAuthorizationRight<span class="kw"></key></span></a>
|
||||
<a class="sourceLine" id="cb2-32" title="32"> <span class="kw"><string></span>system.preferences<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb2-33" title="33"><span class="kw"></dict></span></a>
|
||||
<a class="sourceLine" id="cb2-34" title="34"><span class="kw"></plist></span></a></code></pre></div>
|
||||
</div>
|
||||
<p>It is a copy of <code>/System/Library/LaunchDaemons/ssh.plist</code> with some modifications:</p>
|
||||
<ul>
|
||||
<li>the <code>SockServiceName</code> from <code>ssh</code> to <code>https</code>.</li>
|
||||
<li>the <code>Label</code> from <code>com.openssh.sshd</code> to something not existing as <code>local.sshd</code></li>
|
||||
</ul>
|
||||
<p>Tell me if it was helpfull or if you have any question.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/08_Configure_ssh_to_listen_the_port_443_on_Snow_Leopard/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/08_Configure_ssh_to_listen_the_port_443_on_Snow_Leopard/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-07
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Why I didn't keep whos.amung.us</title>
|
||||
<meta name="keywords" content="analytics, web" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/09_Why_I_didn-t_keep_whosamung-us/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Why I didn't keep whos.amung.us</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I changed from <a href="http://whos.amung.us">whos.amung.us</a> to <a href="http://www.google.com/analytics">Google Analytics</a>.</p>
|
||||
<p>Most of time I prefer not to use the same product as everybody and try some new. But this time I believe whosamung.us had too much ads on the page. I had to put their image on my website and they only give then number of user currently on the website, not the number of visits.</p>
|
||||
<p>This is why I now use google analytics. The only problem, remains for pages with no javascript support.</p>
|
||||
<p>Then for now:</p>
|
||||
<div class="encadre">
|
||||
Theorem:<br />
|
||||
<center>
|
||||
Google Analytics <big><strong>></strong></big> Who’s Amung Us
|
||||
<center>
|
||||
</div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/09_Why_I_didn-t_keep_whosamung-us/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/09_Why_I_didn-t_keep_whosamung-us/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-11
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,101 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
# Author: Yann Esposito
|
||||
# Mail: yann.esposito@gmail.com
|
||||
# Synchronize with "mobileMe" iDisk account.
|
||||
|
||||
mobileMeUser="firstname.lastname"
|
||||
siteName="siteName"
|
||||
|
||||
# Depending of my hostname the
|
||||
if [[ $(hostname) == 'ubuntu' ]]; then
|
||||
iDisk='/mnt/iDisk'
|
||||
else
|
||||
iDisk="/Volumes/$mobileMeUser"
|
||||
fi
|
||||
|
||||
root=$HOME/Sites/$siteName
|
||||
destRep=$iDisk/Web/Sites/$siteName
|
||||
|
||||
[[ ! -d $root ]] && {
|
||||
print -- "$root does not exist ; please verify the configuration ($0)" >&2;
|
||||
exit 1
|
||||
}
|
||||
|
||||
[[ ! -d $destRep ]] && {
|
||||
print -- "$destRep does not exist, please mount the filesystem" >&2;
|
||||
exit 1
|
||||
}
|
||||
|
||||
if [[ $1 == '-h' ]]; then
|
||||
print -- "usage: $0:h [-h|-a|-s]"
|
||||
print -- " -a sychronize primary index"
|
||||
print -- " -h show this help"
|
||||
print -- " -s only swap directories"
|
||||
fi
|
||||
|
||||
if [[ $1 == '-a' ]]; then
|
||||
print -- "Index synchronisation (${destRep:h})"
|
||||
rsync -av $root/index.html ${destRep:h}/index.html
|
||||
fi
|
||||
|
||||
print -- "Root = $root"
|
||||
print -- "Dest = $destRep"
|
||||
|
||||
if [[ ! $1 = '-s' ]]; then
|
||||
[[ ! -d $destRep.tmp ]] && mkdir $destRep.tmp
|
||||
print -P -- "%B[Sync => tmp]%b"
|
||||
result=1
|
||||
essai=1
|
||||
while (( $result > 0 )); do
|
||||
rsync -arv $root/Scratch/ $destRep.tmp
|
||||
result=$?
|
||||
if (( $result > 0 )); then
|
||||
print -P -- "%Brsync failed%b (try n°$essai)" >&2
|
||||
fi
|
||||
((essai++))
|
||||
done
|
||||
fi
|
||||
|
||||
# SWAP
|
||||
print -P -- "%B[Directory Swap (tmp <=> target)]%b"
|
||||
essai=1
|
||||
while [[ -e $destRep.old ]]; do
|
||||
print -n -- "remove $destRep.old"
|
||||
if ((essai>1)); then
|
||||
print " (try n°$essai)"
|
||||
else
|
||||
print
|
||||
fi
|
||||
((essai++))
|
||||
\rm -rf $destRep.old
|
||||
done
|
||||
|
||||
print -- " renommage du repertoire sandard vers le .old"
|
||||
essai=1
|
||||
while [[ -e $destRep ]]; do
|
||||
mv $destRep $destRep.old
|
||||
(($?)) && print -- "Failed to rename (try n°$essai)" >&2
|
||||
((essai++))
|
||||
done
|
||||
|
||||
print -- " renaming folder tmp (new) to the standard one"
|
||||
print -P -- " %BThe WebSite isn't working%b $(date)"
|
||||
essai=1
|
||||
while [[ ! -e $destRep ]]; do
|
||||
mv $destRep.tmp $destRep
|
||||
(($?)) && print -P -- "%B[WebSite not working]%b(try n°$essai) Failed to rename (mv $destRep.tmp $destRep)" >&2
|
||||
((essai++))
|
||||
done
|
||||
|
||||
print -P -- "\t===\t%BWEBSITE SHOULD WORK NOW%b\t==="
|
||||
|
||||
print -- " rename old folder to tmp folder"
|
||||
essai=1
|
||||
while [[ ! -e $destRep ]]; do
|
||||
mv $destRep.old $destRep.tmp
|
||||
(($?)) && print -P -- "Failed to rename n°$essai" >&2
|
||||
((essai++))
|
||||
done
|
||||
|
||||
print -P -- " Publish terminated"
|
||||
|
|
@ -0,0 +1,331 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Synchronize Custom WebSite with mobileMe</title>
|
||||
<meta name="keywords" content="Apple, mobileme, WebDav, synchronisation, zsh, script" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/10_Synchronize_Custom_WebSite_with_mobileMe/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Synchronize Custom WebSite with mobileMe</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="update-20120111">Update <small>(2012/01/11)</small></h1>
|
||||
<p>iDisk should soon disapear. This entry is mainly obsolescent now.</p>
|
||||
<h1 id="update-20091028">Update <small>(2009/10/28)</small></h1>
|
||||
<p>I <a href="../../../../Scratch/en/blog/2009-10-28-custom-website-synchronisation-with-mobileme--2-">updated my script</a> which is now incremental. Since the writing of this article, Apple(c) had made many efforts about the bandwith of its European servers.</p>
|
||||
<hr />
|
||||
<h1 id="webdav-terror">WebDav terror</h1>
|
||||
<p>I live in France and iDisk upload is just terrible. Upload speed remind me the old 56k modem. Most operations such as list the content of a directory take at least 30 seconds (for 15 elements). Renaming a directory fail most of time.</p>
|
||||
<p>Apple(c) use a WebDav server to host files. It works on port 80 (like http). I realized WebDav via https work better (2 to 3 times faster with far less errors). But even https is too slow.</p>
|
||||
<p>I upload from my Mac and sometimes from an Ubuntu PC (iDisk mounted with webdavfs).</p>
|
||||
<h1 id="synchronize-safely-the-website">Synchronize safely the website</h1>
|
||||
<p>Here is the script I use in order to synchronize my website with maximum safety. It try each operations until it works.</p>
|
||||
<p>The idea are:</p>
|
||||
<ul>
|
||||
<li>synchronize to a temporary folder then swap the name therefore the website isn’t accessible only during the swap time. It takes only the time of two rename.</li>
|
||||
<li>reiterate all operations until they work (for example, renaming).</li>
|
||||
</ul>
|
||||
<p>For now I use <code>rsync</code> which in fact is no more efficient than a simple <code>cp</code> with WebDav. And I should use a method to keep track of elements who have changed. before the publication.</p>
|
||||
<p>In fact when I’m on a Mac, I use <a href="http://www.panic.com/transmit">Transmit</a> which is very cool and far more efficient than the Finder to synchronize files. After the synchronization, I swap the directories.</p>
|
||||
<p>My script take a <code>-s</code> option in order to make only the swap option. It also take a <code>-a</code> in order to put the new <code>index.html</code> which should point to the new homepage (not the iWeb one).</p>
|
||||
<p>In order to keep this script working for you, just modify the username by yours (the value of the <code>mobileMeUser</code>).</p>
|
||||
<div class="fr">
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="co">#!/usr/bin/env zsh</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="co"># Script synchronisant le site sur me.com</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"><span class="co"># normalement, le site est indisponible le moins de temps possible</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"><span class="co"># le temps de deux renommages de répertoire</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"><span class="ot">mobileMeUser=</span><span class="st">"yann.esposito"</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"><span class="ot">siteName=</span><span class="st">"siteName"</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"><span class="co"># Depending of my hostname the </span></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"><span class="kw">if [[</span> <span class="ot">$(</span><span class="kw">hostname</span><span class="ot">)</span> <span class="ot">==</span> <span class="st">'ubuntu'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"> <span class="ot">iDisk=</span><span class="st">'/mnt/iDisk'</span></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"><span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"> <span class="ot">iDisk=</span><span class="st">"/Volumes/</span><span class="ot">$mobileMeUser</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"></a>
|
||||
<a class="sourceLine" id="cb1-17" title="17"><span class="ot">root=$HOME</span>/Sites/<span class="ot">$siteName</span></a>
|
||||
<a class="sourceLine" id="cb1-18" title="18"><span class="ot">destRep=$iDisk</span>/Web/Sites/<span class="ot">$siteName</span></a>
|
||||
<a class="sourceLine" id="cb1-19" title="19"></a>
|
||||
<a class="sourceLine" id="cb1-20" title="20"><span class="kw">[[</span> <span class="ot">!</span> <span class="ot">-d</span> <span class="ot">$root</span><span class="kw"> ]]</span> <span class="kw">&&</span> <span class="kw">{</span> </a>
|
||||
<a class="sourceLine" id="cb1-21" title="21"> <span class="kw">print</span> -- <span class="st">"</span><span class="ot">$root</span><span class="st"> n'existe pas ; vérifiez la conf"</span> <span class="kw">>&2</span>; </a>
|
||||
<a class="sourceLine" id="cb1-22" title="22"> <span class="kw">exit</span> 1 </a>
|
||||
<a class="sourceLine" id="cb1-23" title="23"><span class="kw">}</span></a>
|
||||
<a class="sourceLine" id="cb1-24" title="24"></a>
|
||||
<a class="sourceLine" id="cb1-25" title="25"><span class="kw">[[</span> <span class="ot">!</span> <span class="ot">-d</span> <span class="ot">$destRep</span><span class="kw"> ]]</span> <span class="kw">&&</span> <span class="kw">{</span> </a>
|
||||
<a class="sourceLine" id="cb1-26" title="26"> <span class="kw">print</span> -- <span class="st">"</span><span class="ot">$destRep</span><span class="st"> n'existe pas, veuillez remonter le FS"</span> <span class="kw">>&2</span>; </a>
|
||||
<a class="sourceLine" id="cb1-27" title="27"> <span class="kw">exit</span> 1 </a>
|
||||
<a class="sourceLine" id="cb1-28" title="28"><span class="kw">}</span></a>
|
||||
<a class="sourceLine" id="cb1-29" title="29"></a>
|
||||
<a class="sourceLine" id="cb1-30" title="30"><span class="kw">if [[</span> <span class="ot">$1</span> <span class="ot">==</span> <span class="st">'-h'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-31" title="31"> <span class="kw">print</span> -- <span class="st">"usage: </span><span class="ot">$0</span><span class="st">:h [-h|-a|-s]"</span></a>
|
||||
<a class="sourceLine" id="cb1-32" title="32"> <span class="kw">print</span> -- <span class="st">" -a sychronise aussi l'index"</span></a>
|
||||
<a class="sourceLine" id="cb1-33" title="33"> <span class="kw">print</span> -- <span class="st">" -h affiche l'aide"</span></a>
|
||||
<a class="sourceLine" id="cb1-34" title="34"> <span class="kw">print</span> -- <span class="st">" -s swappe simplement les répertoires"</span></a>
|
||||
<a class="sourceLine" id="cb1-35" title="35"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-36" title="36"></a>
|
||||
<a class="sourceLine" id="cb1-37" title="37"><span class="kw">if [[</span> <span class="ot">$1</span> <span class="ot">==</span> <span class="st">'-a'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-38" title="38"> <span class="kw">print</span> -- <span class="st">"Synchronisation de l'index (</span><span class="ot">${destRep:h}</span><span class="st">)"</span></a>
|
||||
<a class="sourceLine" id="cb1-39" title="39"> rsync -av <span class="ot">$root</span>/index.html <span class="ot">${destRep:h}</span>/index.html</a>
|
||||
<a class="sourceLine" id="cb1-40" title="40"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-41" title="41"></a>
|
||||
<a class="sourceLine" id="cb1-42" title="42"><span class="kw">print</span> -- <span class="st">"Root = </span><span class="ot">$root</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb1-43" title="43"><span class="kw">print</span> -- <span class="st">"Dest = </span><span class="ot">$destRep</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb1-44" title="44"></a>
|
||||
<a class="sourceLine" id="cb1-45" title="45"><span class="kw">if [[</span> <span class="ot">!</span> <span class="ot">$1</span> <span class="ot">=</span> <span class="st">'-s'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-46" title="46"> [[ ! -d <span class="ot">$destRep</span>.tmp ]] <span class="kw">&&</span> <span class="kw">mkdir</span> <span class="ot">$destRep</span>.tmp</a>
|
||||
<a class="sourceLine" id="cb1-47" title="47"> <span class="kw">print</span> -P -- <span class="st">"%B[Sync => tmp]%b"</span></a>
|
||||
<a class="sourceLine" id="cb1-48" title="48"> <span class="ot">result=</span>1</a>
|
||||
<a class="sourceLine" id="cb1-49" title="49"> <span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb1-50" title="50"> <span class="kw">while</span> <span class="kw">((</span> <span class="ot">$result</span> > 0 <span class="kw">))</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb1-51" title="51"> rsync -arv <span class="ot">$root</span>/Scratch/ <span class="ot">$destRep</span>.tmp</a>
|
||||
<a class="sourceLine" id="cb1-52" title="52"> <span class="ot">result=$?</span></a>
|
||||
<a class="sourceLine" id="cb1-53" title="53"> <span class="kw">if</span> <span class="kw">((</span> <span class="ot">$result</span> > 0 <span class="kw">))</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-54" title="54"> <span class="kw">print</span> -P -- <span class="st">"%BEchec du rsync%b (essai n°</span><span class="ot">$essai</span><span class="st">)"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb1-55" title="55"> <span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-56" title="56"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb1-57" title="57"> <span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb1-58" title="58"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-59" title="59"></a>
|
||||
<a class="sourceLine" id="cb1-60" title="60"><span class="co"># SWAP</span></a>
|
||||
<a class="sourceLine" id="cb1-61" title="61"><span class="kw">print</span> -P -- <span class="st">"%B[Swap des Répertoires (tmp <=> target)]%b"</span></a>
|
||||
<a class="sourceLine" id="cb1-62" title="62"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb1-63" title="63"><span class="kw">while [[</span> <span class="ot">-e</span> <span class="ot">$destRep</span>.old<span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb1-64" title="64"> <span class="kw">print</span> -n -- <span class="st">"suppression de </span><span class="ot">$destRep</span><span class="st">.old"</span></a>
|
||||
<a class="sourceLine" id="cb1-65" title="65"> <span class="kw">if</span> <span class="kw">((</span>essai>1<span class="kw">))</span>; <span class="kw">then</span> </a>
|
||||
<a class="sourceLine" id="cb1-66" title="66"> <span class="kw">print</span> <span class="st">" (essai n°</span><span class="ot">$essai</span><span class="st">)"</span></a>
|
||||
<a class="sourceLine" id="cb1-67" title="67"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb1-68" title="68"> <span class="kw">print</span></a>
|
||||
<a class="sourceLine" id="cb1-69" title="69"> <span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb1-70" title="70"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb1-71" title="71"> \<span class="kw">rm</span> -rf <span class="ot">$destRep</span>.old</a>
|
||||
<a class="sourceLine" id="cb1-72" title="72"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb1-73" title="73"></a>
|
||||
<a class="sourceLine" id="cb1-74" title="74"><span class="kw">print</span> -- <span class="st">" renommage du repertoire sandard vers le .old"</span></a>
|
||||
<a class="sourceLine" id="cb1-75" title="75"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb1-76" title="76"><span class="kw">while [[</span> <span class="ot">-e</span> <span class="ot">$destRep</span><span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb1-77" title="77"> <span class="kw">mv</span> <span class="ot">$destRep</span> <span class="ot">$destRep</span>.old </a>
|
||||
<a class="sourceLine" id="cb1-78" title="78"> <span class="kw">((</span><span class="ot">$?</span><span class="kw">))</span> <span class="kw">&&</span> <span class="kw">print</span> -- <span class="st">"Echec du renommage (essai n°</span><span class="ot">$essai</span><span class="st">)"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb1-79" title="79"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb1-80" title="80"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb1-81" title="81"></a>
|
||||
<a class="sourceLine" id="cb1-82" title="82"><span class="kw">print</span> -- <span class="st">" renommage du repertoire tmp (nouveau) vers le standard"</span></a>
|
||||
<a class="sourceLine" id="cb1-83" title="83"><span class="kw">print</span> -P -- <span class="st">" %BSite Indisponible%b </span><span class="ot">$(</span><span class="kw">date</span><span class="ot">)</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb1-84" title="84"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb1-85" title="85"><span class="kw">while [[</span> <span class="ot">!</span> <span class="ot">-e</span> <span class="ot">$destRep</span><span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb1-86" title="86"> <span class="kw">mv</span> <span class="ot">$destRep</span>.tmp <span class="ot">$destRep</span></a>
|
||||
<a class="sourceLine" id="cb1-87" title="87"> <span class="kw">((</span><span class="ot">$?</span><span class="kw">))</span> <span class="kw">&&</span> <span class="kw">print</span> -P -- <span class="st">"%B[Site Indisponible]%b(essai n°</span><span class="ot">$essai</span><span class="st">) Echec du renommage (mv </span><span class="ot">$destRep</span><span class="st">.tmp </span><span class="ot">$destRep</span><span class="st">)"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb1-88" title="88"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb1-89" title="89"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb1-90" title="90"></a>
|
||||
<a class="sourceLine" id="cb1-91" title="91"><span class="kw">print</span> -P -- <span class="st">"\t===\t%BSITE DISPONIBLE%b\t==="</span></a>
|
||||
<a class="sourceLine" id="cb1-92" title="92"></a>
|
||||
<a class="sourceLine" id="cb1-93" title="93"><span class="kw">print</span> -- <span class="st">" renommage du repertoire old vers le tmp"</span></a>
|
||||
<a class="sourceLine" id="cb1-94" title="94"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb1-95" title="95"><span class="kw">while [[</span> <span class="ot">!</span> <span class="ot">-e</span> <span class="ot">$destRep</span><span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb1-96" title="96"> <span class="kw">mv</span> <span class="ot">$destRep</span>.old <span class="ot">$destRep</span>.tmp</a>
|
||||
<a class="sourceLine" id="cb1-97" title="97"> <span class="kw">((</span><span class="ot">$?</span><span class="kw">))</span> <span class="kw">&&</span> <span class="kw">print</span> -P -- <span class="st">"Echec du renommage n°</span><span class="ot">$essai</span><span class="st">"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb1-98" title="98"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb1-99" title="99"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb1-100" title="100"></a>
|
||||
<a class="sourceLine" id="cb1-101" title="101"><span class="kw">print</span> -P -- <span class="st">" publication terminée"</span></a></code></pre></div>
|
||||
</div>
|
||||
<div class="en">
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb2-1" title="1"><span class="co">#!/usr/bin/env zsh</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="co"># Author: Yann Esposito</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"><span class="co"># Mail: yann.esposito@gmail.com</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"><span class="co"># Synchronize with "mobileMe" iDisk account.</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"><span class="ot">mobileMeUser=</span><span class="st">"firstname.lastname"</span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"><span class="ot">siteName=</span><span class="st">"siteName"</span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"><span class="co"># Depending of my hostname the </span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"><span class="kw">if [[</span> <span class="ot">$(</span><span class="kw">hostname</span><span class="ot">)</span> <span class="ot">==</span> <span class="st">'ubuntu'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="ot">iDisk=</span><span class="st">'/mnt/iDisk'</span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"><span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> <span class="ot">iDisk=</span><span class="st">"/Volumes/</span><span class="ot">$mobileMeUser</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"><span class="ot">root=$HOME</span>/Sites/<span class="ot">$siteName</span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"><span class="ot">destRep=$iDisk</span>/Web/Sites/<span class="ot">$siteName</span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"></a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"><span class="kw">[[</span> <span class="ot">!</span> <span class="ot">-d</span> <span class="ot">$root</span><span class="kw"> ]]</span> <span class="kw">&&</span> <span class="kw">{</span> </a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"> <span class="kw">print</span> -- <span class="st">"</span><span class="ot">$root</span><span class="st"> does not exist ; please verify the configuration (</span><span class="ot">$0</span><span class="st">)"</span> <span class="kw">>&2</span>; </a>
|
||||
<a class="sourceLine" id="cb2-22" title="22"> <span class="kw">exit</span> 1 </a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"><span class="kw">}</span></a>
|
||||
<a class="sourceLine" id="cb2-24" title="24"></a>
|
||||
<a class="sourceLine" id="cb2-25" title="25"><span class="kw">[[</span> <span class="ot">!</span> <span class="ot">-d</span> <span class="ot">$destRep</span><span class="kw"> ]]</span> <span class="kw">&&</span> <span class="kw">{</span> </a>
|
||||
<a class="sourceLine" id="cb2-26" title="26"> <span class="kw">print</span> -- <span class="st">"</span><span class="ot">$destRep</span><span class="st"> does not exist, please mount the filesystem"</span> <span class="kw">>&2</span>; </a>
|
||||
<a class="sourceLine" id="cb2-27" title="27"> <span class="kw">exit</span> 1 </a>
|
||||
<a class="sourceLine" id="cb2-28" title="28"><span class="kw">}</span></a>
|
||||
<a class="sourceLine" id="cb2-29" title="29"></a>
|
||||
<a class="sourceLine" id="cb2-30" title="30"><span class="kw">if [[</span> <span class="ot">$1</span> <span class="ot">==</span> <span class="st">'-h'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb2-31" title="31"> <span class="kw">print</span> -- <span class="st">"usage: </span><span class="ot">$0</span><span class="st">:h [-h|-a|-s]"</span></a>
|
||||
<a class="sourceLine" id="cb2-32" title="32"> <span class="kw">print</span> -- <span class="st">" -a sychronize primary index"</span></a>
|
||||
<a class="sourceLine" id="cb2-33" title="33"> <span class="kw">print</span> -- <span class="st">" -h show this help"</span></a>
|
||||
<a class="sourceLine" id="cb2-34" title="34"> <span class="kw">print</span> -- <span class="st">" -s only swap directories"</span></a>
|
||||
<a class="sourceLine" id="cb2-35" title="35"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb2-36" title="36"></a>
|
||||
<a class="sourceLine" id="cb2-37" title="37"><span class="kw">if [[</span> <span class="ot">$1</span> <span class="ot">==</span> <span class="st">'-a'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb2-38" title="38"> <span class="kw">print</span> -- <span class="st">"Index synchronisation (</span><span class="ot">${destRep:h}</span><span class="st">)"</span></a>
|
||||
<a class="sourceLine" id="cb2-39" title="39"> rsync -av <span class="ot">$root</span>/index.html <span class="ot">${destRep:h}</span>/index.html</a>
|
||||
<a class="sourceLine" id="cb2-40" title="40"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb2-41" title="41"></a>
|
||||
<a class="sourceLine" id="cb2-42" title="42"><span class="kw">print</span> -- <span class="st">"Root = </span><span class="ot">$root</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb2-43" title="43"><span class="kw">print</span> -- <span class="st">"Dest = </span><span class="ot">$destRep</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb2-44" title="44"></a>
|
||||
<a class="sourceLine" id="cb2-45" title="45"><span class="kw">if [[</span> <span class="ot">!</span> <span class="ot">$1</span> <span class="ot">=</span> <span class="st">'-s'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb2-46" title="46"> [[ ! -d <span class="ot">$destRep</span>.tmp ]] <span class="kw">&&</span> <span class="kw">mkdir</span> <span class="ot">$destRep</span>.tmp</a>
|
||||
<a class="sourceLine" id="cb2-47" title="47"> <span class="kw">print</span> -P -- <span class="st">"%B[Sync => tmp]%b"</span></a>
|
||||
<a class="sourceLine" id="cb2-48" title="48"> <span class="ot">result=</span>1</a>
|
||||
<a class="sourceLine" id="cb2-49" title="49"> <span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb2-50" title="50"> <span class="kw">while</span> <span class="kw">((</span> <span class="ot">$result</span> > 0 <span class="kw">))</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-51" title="51"> rsync -arv <span class="ot">$root</span>/Scratch/ <span class="ot">$destRep</span>.tmp</a>
|
||||
<a class="sourceLine" id="cb2-52" title="52"> <span class="ot">result=$?</span></a>
|
||||
<a class="sourceLine" id="cb2-53" title="53"> <span class="kw">if</span> <span class="kw">((</span> <span class="ot">$result</span> > 0 <span class="kw">))</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb2-54" title="54"> <span class="kw">print</span> -P -- <span class="st">"%Brsync failed%b (try n°</span><span class="ot">$essai</span><span class="st">)"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb2-55" title="55"> <span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb2-56" title="56"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb2-57" title="57"> <span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb2-58" title="58"><span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb2-59" title="59"></a>
|
||||
<a class="sourceLine" id="cb2-60" title="60"><span class="co"># SWAP</span></a>
|
||||
<a class="sourceLine" id="cb2-61" title="61"><span class="kw">print</span> -P -- <span class="st">"%B[Directory Swap (tmp <=> target)]%b"</span></a>
|
||||
<a class="sourceLine" id="cb2-62" title="62"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb2-63" title="63"><span class="kw">while [[</span> <span class="ot">-e</span> <span class="ot">$destRep</span>.old<span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-64" title="64"> <span class="kw">print</span> -n -- <span class="st">"remove </span><span class="ot">$destRep</span><span class="st">.old"</span></a>
|
||||
<a class="sourceLine" id="cb2-65" title="65"> <span class="kw">if</span> <span class="kw">((</span>essai>1<span class="kw">))</span>; <span class="kw">then</span> </a>
|
||||
<a class="sourceLine" id="cb2-66" title="66"> <span class="kw">print</span> <span class="st">" (try n°</span><span class="ot">$essai</span><span class="st">)"</span></a>
|
||||
<a class="sourceLine" id="cb2-67" title="67"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb2-68" title="68"> <span class="kw">print</span></a>
|
||||
<a class="sourceLine" id="cb2-69" title="69"> <span class="kw">fi</span></a>
|
||||
<a class="sourceLine" id="cb2-70" title="70"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb2-71" title="71"> \<span class="kw">rm</span> -rf <span class="ot">$destRep</span>.old</a>
|
||||
<a class="sourceLine" id="cb2-72" title="72"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb2-73" title="73"></a>
|
||||
<a class="sourceLine" id="cb2-74" title="74"><span class="kw">print</span> -- <span class="st">" renommage du repertoire sandard vers le .old"</span></a>
|
||||
<a class="sourceLine" id="cb2-75" title="75"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb2-76" title="76"><span class="kw">while [[</span> <span class="ot">-e</span> <span class="ot">$destRep</span><span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-77" title="77"> <span class="kw">mv</span> <span class="ot">$destRep</span> <span class="ot">$destRep</span>.old </a>
|
||||
<a class="sourceLine" id="cb2-78" title="78"> <span class="kw">((</span><span class="ot">$?</span><span class="kw">))</span> <span class="kw">&&</span> <span class="kw">print</span> -- <span class="st">"Failed to rename (try n°</span><span class="ot">$essai</span><span class="st">)"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb2-79" title="79"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb2-80" title="80"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb2-81" title="81"></a>
|
||||
<a class="sourceLine" id="cb2-82" title="82"><span class="kw">print</span> -- <span class="st">" renaming folder tmp (new) to the standard one"</span></a>
|
||||
<a class="sourceLine" id="cb2-83" title="83"><span class="kw">print</span> -P -- <span class="st">" %BThe WebSite isn't working%b </span><span class="ot">$(</span><span class="kw">date</span><span class="ot">)</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb2-84" title="84"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb2-85" title="85"><span class="kw">while [[</span> <span class="ot">!</span> <span class="ot">-e</span> <span class="ot">$destRep</span><span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-86" title="86"> <span class="kw">mv</span> <span class="ot">$destRep</span>.tmp <span class="ot">$destRep</span></a>
|
||||
<a class="sourceLine" id="cb2-87" title="87"> <span class="kw">((</span><span class="ot">$?</span><span class="kw">))</span> <span class="kw">&&</span> <span class="kw">print</span> -P -- <span class="st">"%B[WebSite not working]%b(try n°</span><span class="ot">$essai</span><span class="st">) Failed to rename (mv </span><span class="ot">$destRep</span><span class="st">.tmp </span><span class="ot">$destRep</span><span class="st">)"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb2-88" title="88"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb2-89" title="89"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb2-90" title="90"></a>
|
||||
<a class="sourceLine" id="cb2-91" title="91"><span class="kw">print</span> -P -- <span class="st">"\t===\t%BWEBSITE SHOULD WORK NOW%b\t==="</span></a>
|
||||
<a class="sourceLine" id="cb2-92" title="92"></a>
|
||||
<a class="sourceLine" id="cb2-93" title="93"><span class="kw">print</span> -- <span class="st">" rename old folder to tmp folder"</span></a>
|
||||
<a class="sourceLine" id="cb2-94" title="94"><span class="ot">essai=</span>1</a>
|
||||
<a class="sourceLine" id="cb2-95" title="95"><span class="kw">while [[</span> <span class="ot">!</span> <span class="ot">-e</span> <span class="ot">$destRep</span><span class="kw"> ]]</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-96" title="96"> <span class="kw">mv</span> <span class="ot">$destRep</span>.old <span class="ot">$destRep</span>.tmp</a>
|
||||
<a class="sourceLine" id="cb2-97" title="97"> <span class="kw">((</span><span class="ot">$?</span><span class="kw">))</span> <span class="kw">&&</span> <span class="kw">print</span> -P -- <span class="st">"Failed to rename n°</span><span class="ot">$essai</span><span class="st">"</span> <span class="kw">>&2</span></a>
|
||||
<a class="sourceLine" id="cb2-98" title="98"> <span class="kw">((</span>essai++<span class="kw">))</span></a>
|
||||
<a class="sourceLine" id="cb2-99" title="99"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb2-100" title="100"></a>
|
||||
<a class="sourceLine" id="cb2-101" title="101"><span class="kw">print</span> -P -- <span class="st">" Publish terminated"</span></a></code></pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/10_Synchronize_Custom_WebSite_with_mobileMe/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/10_Synchronize_Custom_WebSite_with_mobileMe/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-11
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Load Disqus Asynchronously</title>
|
||||
<meta name="keywords" content="disqus, web, javascript, intense debate, comments" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/11_Load_Disqus_Asynchronously/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Load Disqus Asynchronously</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="update">Update</h1>
|
||||
<p>In fact this method works for old threads. But it fails to create new post threads. This is why I tried and be conquered by <a href="http://intensedebate.com">intensedebate</a>, as you can see in the bottom of this page.</p>
|
||||
<p>Remark I didn’t have any comment on my blog when I switched. Therefore my lack of influence was a good thing :-).</p>
|
||||
<hr />
|
||||
<p>Before begining, I must state that I <strong>love</strong> Disqus.</p>
|
||||
<p>I know there is a similar blog entry at <a href="http://trephine.org/t/index.php?title=Site_improvements_-_fighting_with_Disqus">Trephine.org</a>. Here I just add a straight and easy way to load disqus asynchronously using jQuery.</p>
|
||||
<p>I also know there is a jQuery plugin to make just that. Unfortunately I had some issue with CSS.</p>
|
||||
<p><em>Now let’s begin.</em></p>
|
||||
<hr />
|
||||
<h1 id="why">Why?</h1>
|
||||
<p>Why should I want to load the disqus javascript asynchronously?</p>
|
||||
<ul>
|
||||
<li>Efficiency: I don’t want my page to wait the complete execution of disqus script to load.</li>
|
||||
<li>More independance: when disqus is down, my page is blocked!</li>
|
||||
</ul>
|
||||
<hr />
|
||||
<h1 id="how">How?</h1>
|
||||
<p>I give a solution with jQuery, but I’m certain it will work with many other js library.</p>
|
||||
<h3 id="javascript">Javascript</h3>
|
||||
<p>replace:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb1-1" title="1"><span class="op"><</span>script type<span class="op">=</span><span class="st">"text/javascript"</span> src<span class="op">=</span><span class="st">"http://disqus.com/forums/YOUR_DISQUS_ID/embed.js"</span><span class="op">></span></script<span class="op">></span></a></code></pre></div>
|
||||
</div>
|
||||
<p>by</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb2-1" title="1"><span class="va">window</span>.<span class="at">disqus_no_style</span><span class="op">=</span><span class="kw">true</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="at">$</span>(document).<span class="at">ready</span>(<span class="kw">function</span>()<span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="va">$</span>.<span class="at">getScript</span>(<span class="st">"http://disqus.com/forums/YOUR_DISQUS_ID/embed.js"</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"><span class="op">}</span>)<span class="op">;</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>If you forget the <code>window.disqus_no_style=true;</code> then your page will be blank. Simply because without this option, the javascript use a <code>document.write</code> action after the document was closed, which cause a complete erasing of it.</p>
|
||||
<h3 id="css">CSS</h3>
|
||||
<p>But with this option you still need to provide a CSS. This is why you have to copy the css code from the <code>embed.js</code> file and rewrite it in a CSS file. You can <a href="../../../../Scratch/en/blog/11_Load_Disqus_Asynchronously/code/original_disqus.css">download the CSS</a> I obtained.</p>
|
||||
<hr />
|
||||
<p>Now it’s done. I believe all should be fine but I just finished the manip for my own site only 1 hour ago. Therefore there should be some error, tell me if it is the case.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/11_Load_Disqus_Asynchronously/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/11_Load_Disqus_Asynchronously/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-17
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,127 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Disqus versus Intense Debate (Why I switched)</title>
|
||||
<meta name="keywords" content="disqus, intense debate, web, blog" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-09-Disqus-versus-Intense-Debate--Why-I-switched-/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Disqus versus Intense Debate (Why I switched)</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="disqus-vs.-intense-debate"><a href="http://disqus.com/">Disqus</a> <em>vs.</em> <a href="http://intensedebate.com/">Intense Debate</a></h1>
|
||||
<p>I made a blog entry about how I tried to integrate <a href="http://disqus.com">Disqus</a>. I had to wait Disqus comment to be displayed before loading correctly my page. This is why I tried to include it in a “non-blocking” way. Unfortunately, I had <a href="../../../../Scratch/en/blog/11_Load_Disqus_Asynchronously/">difficulties to make it works correctly</a>.</p>
|
||||
<p>Furthermore, it was not trivial to make comment to be shared between multiple version of the same page (each page has three differents representations, one for each language and one more for the multi-language version).</p>
|
||||
<p>I am a bit sad to quit <a href="http://disqus.com">Disqus</a> because I must confess <a href="http://giannii.com">giannii</a> had helped me has efficiently as he could. But the problem I had with disqus are inherent to some design choice not simply technical ones.</p>
|
||||
<p>During the time I tried to integrate <a href="http://disqus.com/">Disqus</a> I never tried <a href="http://intensedebate.com">Intense Debate</a>. Now that I have tried, i must confess it does exactly what I needed.</p>
|
||||
<p>In order to make it fully asynchronous, you’ve just to download their common js and replace the following line:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb1-1" title="1"><span class="va">document</span>.<span class="at">getElementsByTagName</span>(<span class="st">"head"</span>)[<span class="dv">0</span>].<span class="at">appendChild</span>(commentScript)<span class="op">;</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>by:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb2-1" title="1"><span class="at">$</span>(document).<span class="at">ready</span>( <span class="kw">function</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="va">document</span>.<span class="at">getElementsByTagName</span>(<span class="st">"head"</span>)[<span class="dv">0</span>].<span class="at">appendChild</span>(commentScript)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="op">}</span>)<span class="op">;</span></a></code></pre></div>
|
||||
</div>
|
||||
<h2 id="and-the-winner-is-intense-debate">And the Winner is: <a href="http://intensedebate.com/">Intense Debate</a></h2>
|
||||
<p>To conclude, main advantages (for me) of <a href="http://intensedebate.com/">Intense Debate</a> over <a href="http://disqus.com/">Disqus</a>:</p>
|
||||
<ul>
|
||||
<li>Load Asynchronously ; don’t block my website</li>
|
||||
<li>Add for free buttons like “share to any” and load them <strong>asynchronously</strong>.</li>
|
||||
</ul>
|
||||
<p>Voilà.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-Disqus-versus-Intense-Debate--Why-I-switched-/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-Disqus-versus-Intense-Debate--Why-I-switched-/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-28
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,288 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - jQuery Tag Cloud</title>
|
||||
<meta name="keywords" content="jQuery, javascript, web, ruby" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-09-jQuery-Tag-Cloud/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>jQuery Tag Cloud</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Here is how I done the tag cloud of my blog. It is done mostly in jQuery. All my site is static and pages are generated with <a href="http://nanoc.stoneship.org">nanoc</a>. It is (in my humble opinion) the modern geek way to make a website. The tagcloud should work for machine with and without javascript.</p>
|
||||
<p>This is why I’ll give only a Ruby Generator, not a full javascript generator. But you can easily translate from Ruby to Javascript.</p>
|
||||
<p>Here is what you should obtain:</p>
|
||||
<hr />
|
||||
<div>
|
||||
<p><%= tagCloud %></p>
|
||||
</div>
|
||||
<hr />
|
||||
<h1 id="jquery">jQuery</h1>
|
||||
<p>Here is the simple jQuery code:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb1-1" title="1"> <span class="at">$</span>(document).<span class="at">ready</span>( <span class="kw">function</span>()<span class="op">{</span><span class="at">$</span>(<span class="st">'.list'</span>).<span class="at">hide</span>()<span class="op">;}</span> )<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="kw">function</span> <span class="at">tagSelected</span>(id) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="at">$</span>(<span class="st">'.list'</span>).<span class="at">hide</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="at">$</span>(<span class="st">'#'</span><span class="op">+</span>id).<span class="at">fadeIn</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="at">$</span>(<span class="st">'.tag.selected'</span>).<span class="at">removeClass</span>(<span class="st">'selected'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="at">$</span>(<span class="st">'#tag_'</span><span class="op">+</span>id).<span class="at">addClass</span>(<span class="st">'selected'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="op">}</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>This code will hide all the div containing links to articles containing the tag. And create a function do show the div containing the tag.</p>
|
||||
<p>For each tag I create a span element:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb2-1" title="1"> <span class="kw"><span</span><span class="ot"> style=</span><span class="st">"font-size: 1.0em;"</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="ot"> class=</span><span class="st">"tag"</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="ot"> onClick=</span><span class="st">"tagSelected('[TAG]')"</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"><span class="ot"> id=</span><span class="st">"tag_[TAG]"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> [TAG]</a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw"></span></span></a></code></pre></div>
|
||||
</div>
|
||||
<p>and a div containing links associtated to this tag:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb3-1" title="1"> <span class="kw"><div</span><span class="ot"> id=</span><span class="st">"[TAG]"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"> <span class="kw"><h4></span>[TAG]<span class="kw"></h4></span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"> <span class="kw"><ul></span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4"> <span class="kw"><li></span> LINK 1 <span class="kw"></li></span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"> <span class="kw"><li></span> LINK 2 <span class="kw"></li></span></a>
|
||||
<a class="sourceLine" id="cb3-6" title="6"> <span class="kw"></ul></span></a>
|
||||
<a class="sourceLine" id="cb3-7" title="7"> <span class="kw"></div></span></a></code></pre></div>
|
||||
</div>
|
||||
<hr />
|
||||
<h1 id="nanoc">nanoc</h1>
|
||||
<p>Here is how I generate this using nanoc 2.</p>
|
||||
<p>If you want to make it fully jQuery one, it shouldn’t be too difficult, to use my ruby code and translate it into javascript.</p>
|
||||
<p>In a first time <code>tags</code> correpond of the list of all tags.</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb4-1" title="1"><span class="kw">def</span> tags</a>
|
||||
<a class="sourceLine" id="cb4-2" title="2"> <span class="kw">return</span> <span class="ot">@items</span>.tags.join(<span class="st">', '</span>)</a>
|
||||
<a class="sourceLine" id="cb4-3" title="3"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>A function to create a data structure associating to each tag its occurence.</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb5-1" title="1"><span class="co"># generate an hash tag => number of occurence of tag</span></a>
|
||||
<a class="sourceLine" id="cb5-2" title="2"><span class="kw">def</span> tagNumber</a>
|
||||
<a class="sourceLine" id="cb5-3" title="3"> tags={}</a>
|
||||
<a class="sourceLine" id="cb5-4" title="4"> <span class="ot">@items</span>.each <span class="kw">do</span> |p|</a>
|
||||
<a class="sourceLine" id="cb5-5" title="5"> <span class="kw">if</span> p.tags.nil?</a>
|
||||
<a class="sourceLine" id="cb5-6" title="6"> <span class="kw">next</span></a>
|
||||
<a class="sourceLine" id="cb5-7" title="7"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb5-8" title="8"> p.tags.each <span class="kw">do</span> |t|</a>
|
||||
<a class="sourceLine" id="cb5-9" title="9"> <span class="kw">if</span> tags[t]</a>
|
||||
<a class="sourceLine" id="cb5-10" title="10"> tags[t]+=<span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb5-11" title="11"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb5-12" title="12"> tags[t]=<span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb5-13" title="13"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb5-14" title="14"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb5-15" title="15"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb5-16" title="16"> <span class="kw">return</span> tags</a>
|
||||
<a class="sourceLine" id="cb5-17" title="17"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>I also need a data structure who associate to each tag a list of pages (at least url and title).</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb6-1" title="1"><span class="co"># generate an hash tag => [ page1, page2 ... ]</span></a>
|
||||
<a class="sourceLine" id="cb6-2" title="2"><span class="kw">def</span> tagRefs</a>
|
||||
<a class="sourceLine" id="cb6-3" title="3"> tagLinks={}</a>
|
||||
<a class="sourceLine" id="cb6-4" title="4"> <span class="ot">@items</span>.each <span class="kw">do</span> |p|</a>
|
||||
<a class="sourceLine" id="cb6-5" title="5"> <span class="kw">if</span> p.tags.nil?</a>
|
||||
<a class="sourceLine" id="cb6-6" title="6"> <span class="kw">next</span></a>
|
||||
<a class="sourceLine" id="cb6-7" title="7"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb6-8" title="8"> p.tags.each <span class="kw">do</span> |t|</a>
|
||||
<a class="sourceLine" id="cb6-9" title="9"> <span class="kw">if</span> tagLinks[t].nil?</a>
|
||||
<a class="sourceLine" id="cb6-10" title="10"> tagLinks[t]=[ p ]</a>
|
||||
<a class="sourceLine" id="cb6-11" title="11"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb6-12" title="12"> tagLinks[t] <<= p</a>
|
||||
<a class="sourceLine" id="cb6-13" title="13"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb6-14" title="14"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb6-15" title="15"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb6-16" title="16"> <span class="kw">return</span> tagLinks</a>
|
||||
<a class="sourceLine" id="cb6-17" title="17"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>Calculate the real size of each tag to be displayed.</p>
|
||||
<p>I choosen not to use the full range of size for all the tag. Because if no tag has more than <code>n</code> (here 10) occurences, then it doesn’t deserve to be of the maximal size.</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb7"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb7-1" title="1"><span class="kw">def</span> tagRealSize</a>
|
||||
<a class="sourceLine" id="cb7-2" title="2"> tags=tagNumber</a>
|
||||
<a class="sourceLine" id="cb7-3" title="3"> max=tags.values.max</a>
|
||||
<a class="sourceLine" id="cb7-4" title="4"> min=tags.values.min</a>
|
||||
<a class="sourceLine" id="cb7-5" title="5"> <span class="co"># size in CSS em.</span></a>
|
||||
<a class="sourceLine" id="cb7-6" title="6"> minSize=<span class="fl">1.0</span></a>
|
||||
<a class="sourceLine" id="cb7-7" title="7"> maxSize=<span class="fl">2.5</span></a>
|
||||
<a class="sourceLine" id="cb7-8" title="8"> tagSize={}</a>
|
||||
<a class="sourceLine" id="cb7-9" title="9"> tags.each <span class="kw">do</span> |t,n|</a>
|
||||
<a class="sourceLine" id="cb7-10" title="10"> <span class="kw">if</span> ( max == min )</a>
|
||||
<a class="sourceLine" id="cb7-11" title="11"> tagSize[t]=minSize</a>
|
||||
<a class="sourceLine" id="cb7-12" title="12"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb7-13" title="13"> <span class="co"># normalized value between 0 and 1</span></a>
|
||||
<a class="sourceLine" id="cb7-14" title="14"> <span class="co"># if not tag appear more than 10 times,</span></a>
|
||||
<a class="sourceLine" id="cb7-15" title="15"> <span class="co"># then it cannot have the maximal size</span></a>
|
||||
<a class="sourceLine" id="cb7-16" title="16"> tagSize[t]=[ ( n - min + <span class="fl">0.0</span> ) / ( max - min ) ,</a>
|
||||
<a class="sourceLine" id="cb7-17" title="17"> (n - min) / <span class="fl">10.0</span> ].min</a>
|
||||
<a class="sourceLine" id="cb7-18" title="18"> <span class="co"># from normalized size to real size</span></a>
|
||||
<a class="sourceLine" id="cb7-19" title="19"> tagSize[t]=( tagSize[t] ) * (maxSize - minSize) + minSize</a>
|
||||
<a class="sourceLine" id="cb7-20" title="20"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb7-21" title="21"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb7-22" title="22"> <span class="kw">return</span> tagSize</a>
|
||||
<a class="sourceLine" id="cb7-23" title="23"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>Finaly a function to generate the XHTML/jQuery code</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb8"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb8-1" title="1"><span class="co"># generate an XHTML/jQuery code for tag cloud</span></a>
|
||||
<a class="sourceLine" id="cb8-2" title="2"><span class="kw">def</span> tagCloud</a>
|
||||
<a class="sourceLine" id="cb8-3" title="3"> tagLinks=tagRefs</a>
|
||||
<a class="sourceLine" id="cb8-4" title="4"> tagSize=tagRealSize</a>
|
||||
<a class="sourceLine" id="cb8-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb8-6" title="6"> <span class="co"># begin to write the code</span></a>
|
||||
<a class="sourceLine" id="cb8-7" title="7"> tagCloud=<span class="ot">%{</span><span class="st"><script type="text/javascript"></span></a>
|
||||
<a class="sourceLine" id="cb8-8" title="8"><span class="st"> $(document).ready( function(){$('.list').hide();} );</span></a>
|
||||
<a class="sourceLine" id="cb8-9" title="9"><span class="st"> function tagSelected(id) {</span></a>
|
||||
<a class="sourceLine" id="cb8-10" title="10"><span class="st"> $('.list').hide();</span></a>
|
||||
<a class="sourceLine" id="cb8-11" title="11"><span class="st"> $('#'+id).fadeIn();</span></a>
|
||||
<a class="sourceLine" id="cb8-12" title="12"><span class="st"> $('.tag.selected').removeClass('selected');</span></a>
|
||||
<a class="sourceLine" id="cb8-13" title="13"><span class="st"> $('#tag_'+id).addClass('selected');</span></a>
|
||||
<a class="sourceLine" id="cb8-14" title="14"><span class="st"> }</span></a>
|
||||
<a class="sourceLine" id="cb8-15" title="15"><span class="st"> </script><div id="tagcloud"></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-16" title="16"> <span class="co"># Creation of the tags <span></span></a>
|
||||
<a class="sourceLine" id="cb8-17" title="17"> tagSize.sort{|a,b| a[<span class="dv">0</span>].downcase <=> b[<span class="dv">0</span>].downcase}.each <span class="kw">do</span> |t,s|</a>
|
||||
<a class="sourceLine" id="cb8-18" title="18"> tag_in_id=t.gsub(<span class="ot">/\W/</span>,<span class="ch">'_'</span>)</a>
|
||||
<a class="sourceLine" id="cb8-19" title="19"> <span class="co"># HTML protected version of the tag</span></a>
|
||||
<a class="sourceLine" id="cb8-20" title="20"> <span class="co"># for example, replace ' ' by '&nbsp;'</span></a>
|
||||
<a class="sourceLine" id="cb8-21" title="21"> <span class="kw">protected</span>=t.gsub(<span class="ot">/&/</span>,<span class="st">'&amp;'</span>).gsub(<span class="ot">/ /</span>,<span class="st">'&nbsp;'</span>).gsub(<span class="ot">/</</span>,<span class="st">'&lt;'</span>).gsub(<span class="ot">/>/</span>,<span class="st">'&gt;'</span>)</a>
|
||||
<a class="sourceLine" id="cb8-22" title="22"> tagCloud <<=<span class="ot"> %{</span></a>
|
||||
<a class="sourceLine" id="cb8-23" title="23"><span class="st"> <span style="font-size: </span><span class="ot">#{</span>s<span class="ot">}</span><span class="st">em;"</span></a>
|
||||
<a class="sourceLine" id="cb8-24" title="24"><span class="st"> class="tag"</span></a>
|
||||
<a class="sourceLine" id="cb8-25" title="25"><span class="st"> onClick="tagSelected('</span><span class="ot">#{</span>tag_in_id<span class="ot">}</span><span class="st">')"</span></a>
|
||||
<a class="sourceLine" id="cb8-26" title="26"><span class="st"> id="tag_</span><span class="ot">#{</span>tag_in_id<span class="ot">}</span><span class="st">"></span></a>
|
||||
<a class="sourceLine" id="cb8-27" title="27"><span class="st"> </span><span class="ot">#{</span><span class="kw">protected</span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-28" title="28"><span class="st"> </span> </span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-29" title="29"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb8-30" title="30"> tagCloud <<=<span class="ot"> %{</span><span class="st"></div><div id="hiddenDivs" ></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-31" title="31"> <span class="co"># Creation of the divs containing links associated to a tag.</span></a>
|
||||
<a class="sourceLine" id="cb8-32" title="32"> tagLinks.each <span class="kw">do</span> |t,l|</a>
|
||||
<a class="sourceLine" id="cb8-33" title="33"> tag_in_id=t.gsub(<span class="ot">/\W/</span>,<span class="ch">'_'</span>)</a>
|
||||
<a class="sourceLine" id="cb8-34" title="34"> tagCloud <<=<span class="ot"> %{</span></a>
|
||||
<a class="sourceLine" id="cb8-35" title="35"><span class="st"> <div id="</span><span class="ot">#{</span>tag_in_id<span class="ot">}</span><span class="st">" class="list"></span></a>
|
||||
<a class="sourceLine" id="cb8-36" title="36"><span class="st"> <h4></span><span class="ot">#{</span>t<span class="ot">}</span><span class="st"></h4><ul></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-37" title="37"> <span class="co"># generate the link list</span></a>
|
||||
<a class="sourceLine" id="cb8-38" title="38"> l.each <span class="kw">do</span> |p|</a>
|
||||
<a class="sourceLine" id="cb8-39" title="39"> tagCloud <<=<span class="ot"> %{</span><span class="st"><li><a href="</span><span class="ot">#{</span>p.path<span class="ot">}</span><span class="st">"></span><span class="ot">#{</span>p.title<span class="ot">}</span><span class="st"></a></li></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-40" title="40"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb8-41" title="41"> tagCloud <<=<span class="ot"> %{</span><span class="st"></ul></div></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-42" title="42"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb8-43" title="43"> tagCloud <<=<span class="ot"> %{</span><span class="st"></div></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb8-44" title="44"> <span class="kw">return</span> tagCloud <span class="co"># yeah I know it is not necessary</span></a>
|
||||
<a class="sourceLine" id="cb8-45" title="45"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>You can <a href="../../../../Scratch/en/blog/2009-09-jQuery-Tag-Cloud/code/tag.rb">download the complete file</a> to put in your ‘lib’ directory.</p>
|
||||
<p>Of course to be nice you need the associated CSS</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb9"><pre class="sourceCode css"><code class="sourceCode css"><a class="sourceLine" id="cb9-1" title="1"></a>
|
||||
<a class="sourceLine" id="cb9-2" title="2"><span class="er">// Change the color when mouse over</span></a>
|
||||
<a class="sourceLine" id="cb9-3" title="3"><span class="fu">.tag</span><span class="in">:hover</span> {</a>
|
||||
<a class="sourceLine" id="cb9-4" title="4"> <span class="kw">color</span>: <span class="cn">#cc0000</span><span class="op">;</span> }</a>
|
||||
<a class="sourceLine" id="cb9-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb9-6" title="6"><span class="er">// Change the color when tag selected</span></a>
|
||||
<a class="sourceLine" id="cb9-7" title="7"><span class="fu">.tag.selected</span> {</a>
|
||||
<a class="sourceLine" id="cb9-8" title="8"> <span class="kw">color</span>: <span class="cn">#6c0000</span><span class="op">;</span> }</a>
|
||||
<a class="sourceLine" id="cb9-9" title="9"></a>
|
||||
<a class="sourceLine" id="cb9-10" title="10"><span class="er">// a bit of space and pointer cursor</span></a>
|
||||
<a class="sourceLine" id="cb9-11" title="11"><span class="fu">.tag</span> {</a>
|
||||
<a class="sourceLine" id="cb9-12" title="12"> <span class="kw">cursor</span>: <span class="dv">pointer</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb9-13" title="13"> <span class="kw">margin-left</span>: <span class="dv">.5</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb9-14" title="14"> <span class="kw">margin-right</span>: <span class="dv">.5</span><span class="dt">em</span><span class="op">;</span> }</a></code></pre></div>
|
||||
</div>
|
||||
<p>That’s all folks.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-jQuery-Tag-Cloud/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-jQuery-Tag-Cloud/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-23
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,169 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - replace all except some part</title>
|
||||
<meta name="keywords" content="ruby, regexp, regular expression" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-09-replace-all-except-some-part/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>replace all except some part</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>My problem is simple:</p>
|
||||
<p>I want to filter a text except some part of it. I can match easily the part I don’t want to be filtered. For example</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1">...</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">text</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3">...</a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">BEGIN not to filter</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5">...</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6">text</a>
|
||||
<a class="sourceLine" id="cb1-7" title="7">...</a>
|
||||
<a class="sourceLine" id="cb1-8" title="8">END not to filter</a>
|
||||
<a class="sourceLine" id="cb1-9" title="9">...</a>
|
||||
<a class="sourceLine" id="cb1-10" title="10">text</a>
|
||||
<a class="sourceLine" id="cb1-11" title="11">...</a></code></pre></div>
|
||||
</div>
|
||||
<p>I searched a better way to do that, but the best I can do is using <code>split</code> and <code>scan</code>.</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb2-1" title="1"><span class="kw">def</span> allExceptCode( f, content )</a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="co"># Beware the behaviour will change if you add</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="co"># parenthesis (groups) to the regexp!</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> regexp=<span class="ot">/<code[^>]*>.*?<\/code>|<pre[^>]*>.*?<\/pre>/m</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> tmp=<span class="st">""</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> mem=[]</a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> content.scan(regexp).each <span class="kw">do</span> |c|</a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> mem <<= c</a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> i=<span class="dv">0</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> content.split(regexp).each <span class="kw">do</span> |x|</a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> tmp <<= send(f,x) </a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="kw">if</span> <span class="kw">not</span> mem[i].nil? </a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> tmp <<= mem[i]</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> i+=<span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> tmp</a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>An usage is:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb3-1" title="1"><span class="kw">def</span> filter(content)</a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"> content.gsub(<span class="ot">/e/</span>,<span class="ch">'X'</span>)</a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"><span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4">...</a>
|
||||
<a class="sourceLine" id="cb3-5" title="5">allExceptCode(<span class="st">:filter</span>, content)</a>
|
||||
<a class="sourceLine" id="cb3-6" title="6">...</a></code></pre></div>
|
||||
</div>
|
||||
<p>A better syntax would be:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb4-1" title="1"><span class="co"># !!!!!!!!!! THIS SYNTAX DOES NOT WORK !!!!!!! #</span></a>
|
||||
<a class="sourceLine" id="cb4-2" title="2"><span class="kw">def</span> allExceptCode( f, content )</a>
|
||||
<a class="sourceLine" id="cb4-3" title="3"> regexp=<span class="ot">/<code[^>]*>.*?<\/code>/m</span></a>
|
||||
<a class="sourceLine" id="cb4-4" title="4"> tmp=<span class="st">""</span></a>
|
||||
<a class="sourceLine" id="cb4-5" title="5"> content.split(regexp).each <span class="kw">do</span> |x|</a>
|
||||
<a class="sourceLine" id="cb4-6" title="6"> separator=<span class="dt">$&</span></a>
|
||||
<a class="sourceLine" id="cb4-7" title="7"> tmp <<= send(f,x) </a>
|
||||
<a class="sourceLine" id="cb4-8" title="8"> <span class="kw">if</span> <span class="kw">not</span> separator.nil?</a>
|
||||
<a class="sourceLine" id="cb4-9" title="9"> tmp <<= separator</a>
|
||||
<a class="sourceLine" id="cb4-10" title="10"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb4-11" title="11"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb4-12" title="12"> tmp</a>
|
||||
<a class="sourceLine" id="cb4-13" title="13"><span class="kw">end</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>I would expect the split make a search on a regular expression and then give the matched expression into the <code>$&</code> variable. But it is not the case.</p>
|
||||
<p>If someone know a nicer way to do that I will be happy to know how.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-replace-all-except-some-part/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-replace-all-except-some-part/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-09-22
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
# Script synchronisant le site sur me.com
|
||||
# normalement, le site est indisponible le moins de temps possible
|
||||
# le temps de deux renommages de répertoire
|
||||
|
||||
# get configuration
|
||||
# mostly directories
|
||||
source $0:h/config
|
||||
|
||||
# get trycp function (copy until success)
|
||||
source $0:h/webdav-framework
|
||||
|
||||
if [[ $1 == '-h' ]]; then
|
||||
print -- "usage : $0:h [-h|-s|-d]"
|
||||
print -- " -a sychronise aussi l'index"
|
||||
print -- " -h affiche l'aide"
|
||||
print -- " -d modification directe (pas de swap)"
|
||||
print -- " -s swappe simplement les répertoires"
|
||||
fi
|
||||
|
||||
# publication incrementale
|
||||
function incrementalPublish {
|
||||
local ydestRep=$destRep$suffix
|
||||
localRef="$srcRep/map.yrf"
|
||||
print -- "Creation du fichier de references"
|
||||
create-reference-file.sh > $localRef
|
||||
remoteRef="/tmp/remoteSiteMapRef.$$.yrf"
|
||||
if [[ ! -e "$ydestRep/map.yrf" ]]; then
|
||||
# pas de fichier de reference sur la cible
|
||||
print -- "pas de fichier de reference sur la cible, passage en mode rsync"
|
||||
rsyncPublish
|
||||
swap
|
||||
else
|
||||
trycp "$ydestRep/map.yrf" "$remoteRef"
|
||||
typeset -U filesToUpdate
|
||||
filesToUpdate=( $(diff $localRef $remoteRef | awk '/^[<>]/ {print $2}' ) )
|
||||
if ((${#filesToUpdate} == 1)); then
|
||||
print -- "Seul le fichier ${filesToUpdate} sera téléversé"
|
||||
elif ((${#filesToUpdate}<10)); then
|
||||
print -- "${#filesToUpdate} fichiers seront téléversés :"
|
||||
print -- "${filesToUpdate}"
|
||||
else
|
||||
print -- "${#filesToUpdate} fichiers seront téléversés"
|
||||
fi
|
||||
# copy all file with some differences
|
||||
# except the map in case of error
|
||||
for element in $filesToUpdate; do
|
||||
if [[ $element == "/map.yrf" ]]; then
|
||||
continue
|
||||
fi
|
||||
if [[ -e $srcRep$element ]]; then
|
||||
trycp $srcRep$element $ydestRep$element
|
||||
else
|
||||
tryrm $ydestRep$element
|
||||
fi
|
||||
done
|
||||
# if all went fine, copy the map file
|
||||
trycp $srcRep/map.yrf $ydestRep/map.yrf
|
||||
# remove the temporary file
|
||||
\rm $remoteRef
|
||||
# if we have used the tmp directory we swap
|
||||
if [[ "$suffix" != "" ]]; then
|
||||
swap
|
||||
fi
|
||||
fi
|
||||
}
|
||||
|
||||
# publication via rsync
|
||||
function rsyncPublish {
|
||||
result=1
|
||||
essai=1
|
||||
while (( $result > 0 )); do
|
||||
print -- rsync -arv $srcRep/ $destRep.tmp
|
||||
if ((!testmode)); then
|
||||
rsync -arv $srcRep/ $destRep.tmp
|
||||
fi
|
||||
result=$?
|
||||
if (( $result > 0 )); then
|
||||
print -P -- "%BEchec du rsync%b (essai n°$essai)" >&2
|
||||
fi
|
||||
((essai++))
|
||||
done
|
||||
}
|
||||
|
||||
# swap
|
||||
function swap {
|
||||
print -P -- "%B[Directory Swap (tmp <=> target)]%b"
|
||||
[[ -e $destRep.old ]] && tryrm $destRep.old
|
||||
|
||||
print -- " renommage du repertoire sandard vers le .old"
|
||||
tryrename $destRep $destRep.old
|
||||
|
||||
print -- " renommage du repertoire tmp (nouveau) vers le standard"
|
||||
print -P -- "%B[Site Indisponible]%b $(date)"
|
||||
tryrename $destRep.tmp $destRep
|
||||
print -P -- "%B[Site Disponible]%b $(date)"
|
||||
|
||||
print -- " renommage du repertoire old vers le tmp"
|
||||
tryrename $destRep.old $destRep.tmp
|
||||
|
||||
print -P -- " publication terminée"
|
||||
}
|
||||
|
||||
print -- "Root = $webroot"
|
||||
print -- "Dest = $destRep"
|
||||
|
||||
if [[ "$1" = "-s" ]]; then
|
||||
swap
|
||||
else
|
||||
if [[ "$1" = "-d" ]]; then
|
||||
suffix=""
|
||||
else
|
||||
suffix=".tmp"
|
||||
fi
|
||||
print -P -- "%BSync%b[${Root:t} => ${destRep:t}$suffix]"
|
||||
incrementalPublish
|
||||
fi
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
function samelineprint {
|
||||
print -n -P -- "\r$*"
|
||||
}
|
||||
|
||||
# avec 1 essai par seconde: 300 = 5 minutes
|
||||
maxessais=300
|
||||
|
||||
# try to create a directory until success
|
||||
function trymkdir {
|
||||
target="$1"
|
||||
print -- mkdir -p $target
|
||||
local essai=1
|
||||
while ! mkdir -p $target; do
|
||||
samelineprint "Echec: essai n°$essai"
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
print
|
||||
}
|
||||
|
||||
# try to copy until success
|
||||
function trycp {
|
||||
element="$1"
|
||||
target="$2"
|
||||
if [[ ! -d ${target:h} ]]; then
|
||||
trymkdir ${target:h}
|
||||
fi
|
||||
local essai=1
|
||||
print -- cp $element $target
|
||||
while ! \cp $element $target; do
|
||||
samelineprint "Echec: essai n°$essai"
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
print
|
||||
}
|
||||
|
||||
# try to remove until success
|
||||
function tryrm {
|
||||
target="$1"
|
||||
local essai=1
|
||||
local options=''
|
||||
[[ -d $target ]] && options='-rf'
|
||||
print -- rm $options $target
|
||||
while ! rm $options $target; do
|
||||
samelineprint "Echec: essai n°$essai"
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
essai=1
|
||||
while [[ -e $element ]]; do
|
||||
samelineprint "rm reussi mais fichier source non disparu n°$essai"
|
||||
sleep 1
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
print
|
||||
}
|
||||
|
||||
# try to rename until success
|
||||
function tryrename {
|
||||
element="$1"
|
||||
target="$2"
|
||||
local essai=1
|
||||
while [[ -e $target ]]; do
|
||||
samelineprint "Echec n°$essai le fichier $target existe déjà"
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
sleep 1
|
||||
done
|
||||
print -- mv $element $target
|
||||
while ! mv $element $target; do
|
||||
samelineprint "Echec: essai n°$essai"
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 4
|
||||
done
|
||||
essai=1
|
||||
while [[ -e $element ]]; do
|
||||
samelineprint "mv reussi mais fichier source non disparu n°$essai"
|
||||
sleep 1
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
print
|
||||
}
|
||||
|
||||
# try to move until success
|
||||
function trymv {
|
||||
element="$1"
|
||||
target="$2"
|
||||
local essai=1
|
||||
print -- mv $element $target
|
||||
while ! mv $element $target; do
|
||||
samelineprint "Echec: essai n°$essai"
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
essai=1
|
||||
while [[ -e $element ]]; do
|
||||
samelineprint "mv reussi mais fichier source non disparu n°$essai"
|
||||
sleep 1
|
||||
((essai++))
|
||||
((essai>maxessais)) && exit 5
|
||||
done
|
||||
print
|
||||
}
|
||||
|
|
@ -0,0 +1,174 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - custom website synchronisation with mobileme (2)</title>
|
||||
<meta name="keywords" content="Apple, mobileme, WebDav, synchronisation, zsh, script" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-28-custom-website-synchronisation-with-mobileme--2-/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>custom website synchronisation with mobileme (2)</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I already talked about how <a href="../../../../Scratch/en/blog/10_Synchronize_Custom_WebSite_with_mobileMe">I synchronized my website with mobileme</a>. I ameliorated this script in order to make it incremental.</p>
|
||||
<p>Here is my new script, it first create a map which associate to each file its hash. After that it compare this file to the remote one. Then for each different file, update the content.</p>
|
||||
<p>Even with this script I also have some problem. Mostly due to ‘webdav’ issues. For example, renaming a folder work really badly (on Linux at least). I use webdavfs. For example:</p>
|
||||
<div>
|
||||
<code class="zsh"> mv folder folder2 </code>
|
||||
</div>
|
||||
<p>It returns OK and I’ve got:</p>
|
||||
<div>
|
||||
<code class="zsh"> $ ls folder folder2 </code>
|
||||
</div>
|
||||
<p>Booh….</p>
|
||||
<p>In order to handle most webdav issues I use a <em>framework</em> in zsh. It handle almost all except the correct renaming of folder. Working on it… Anyway here is the code I use.</p>
|
||||
<div>
|
||||
<p><code class="zsh" file="webdav-framework"> #!/usr/bin/env zsh</p>
|
||||
<p>function samelineprint { print -n -P – "\r$*" }</p>
|
||||
<h1 id="avec-1-essai-par-seconde-300-5-minutes">avec 1 essai par seconde: 300 = 5 minutes</h1>
|
||||
<p>maxessais=300</p>
|
||||
<h1 id="try-to-create-a-directory-until-success">try to create a directory until success</h1>
|
||||
<p>function trymkdir { target=“$1” print – mkdir -p $target local essai=1 while ! mkdir -p <span class="math inline">$target; do samelineprint "Echec: essai n°$</span>essai" ((essai++)) ((essai>maxessais)) && exit 5 done print }</p>
|
||||
<h1 id="try-to-copy-until-success">try to copy until success</h1>
|
||||
<p>function trycp { element=“$1” target=“$2” if [[ ! -d ${target:h} ]]; then trymkdir ${target:h} fi local essai=1 print – cp $element $target while ! $element <span class="math inline">$target; do samelineprint "Echec: essai n°$</span>essai" ((essai++)) ((essai>maxessais)) && exit 5 done print }</p>
|
||||
<h1 id="try-to-remove-until-success">try to remove until success</h1>
|
||||
<p>function tryrm { target=“$1” local essai=1 local options=’’ [[ -d $target ]] && options=‘-rf’ print – rm $options $target while ! rm $options <span class="math inline">$target; do samelineprint "Echec: essai n°$</span>essai" ((essai++)) ((essai>maxessais)) && exit 5 done essai=1 while [[ -e $element ]]; do samelineprint “rm reussi mais fichier source non disparu n°$essai” sleep 1 ((essai++)) ((essai>maxessais)) && exit 5 done print }</p>
|
||||
<h1 id="try-to-rename-until-success">try to rename until success</h1>
|
||||
<p>function tryrename { element=“$1” target=“$2” local essai=1 while [[ -e $target ]]; do samelineprint “Echec n°$essai le fichier $target existe déjà” ((essai++)) ((essai>maxessais)) && exit 5 sleep 1 done print – mv $element $target while ! mv $element <span class="math inline">$target; do samelineprint "Echec: essai n°$</span>essai" ((essai++)) ((essai>maxessais)) && exit 4 done essai=1 while [[ -e $element ]]; do samelineprint “mv reussi mais fichier source non disparu n°$essai” sleep 1 ((essai++)) ((essai>maxessais)) && exit 5 done print }</p>
|
||||
<h1 id="try-to-move-until-success">try to move until success</h1>
|
||||
function trymv { element=“$1” target=“$2” local essai=1 print – mv $element $target while ! mv $element <span class="math inline">$target; do samelineprint "Echec: essai n°$</span>essai" ((essai++)) ((essai>maxessais)) && exit 5 done essai=1 while [[ -e $element ]]; do samelineprint “mv reussi mais fichier source non disparu n°$essai” sleep 1 ((essai++)) ((essai>maxessais)) && exit 5 done print } </code>
|
||||
</div>
|
||||
<p>And here is the code on how I synchronize my website. There is a little cryptic code. It correspond a problem caused by the bluecloth filter which is a markdown program made in ruby. Each time my email is written it is transformed differently. This is why I remove this part from the content of each html file. Without it, all my files containing email are different at each regeneration of my website.</p>
|
||||
<div>
|
||||
<p><code class="zsh" file="publish"> #!/usr/bin/env zsh</p>
|
||||
<h1 id="script-synchronisant-le-site-sur-me.com">Script synchronisant le site sur me.com</h1>
|
||||
<h1 id="normalement-le-site-est-indisponible-le-moins-de-temps-possible">normalement, le site est indisponible le moins de temps possible</h1>
|
||||
<h1 id="le-temps-de-deux-renommages-de-répertoire">le temps de deux renommages de répertoire</h1>
|
||||
<h1 id="get-configuration">get configuration</h1>
|
||||
<h1 id="mostly-directories">mostly directories</h1>
|
||||
<p>source $0:h/config</p>
|
||||
<h1 id="get-trycp-function-copy-until-success">get trycp function (copy until success)</h1>
|
||||
<p>source $0:h/webdav-framework</p>
|
||||
<p>if [[ $1 == ‘-h’ ]]; then print – “usage : $0:h [-h|-s|-d]” print – " -a sychronise aussi l’index" print – " -h affiche l’aide" print – " -d modification directe (pas de swap)" print – " -s swappe simplement les répertoires" fi</p>
|
||||
<h1 id="publication-incrementale">publication incrementale</h1>
|
||||
<p>function incrementalPublish { local ydestRep=<span class="math inline"><em>d</em><em>e</em><em>s</em><em>t</em><em>R</em><em>e</em><em>p</em></span>suffix localRef=“$srcRep/map.yrf” print – “Creation du fichier de references” create-reference-file.sh > <span class="math inline">$localRef remoteRef="/tmp/remoteSiteMapRef.$</span><span class="math inline">$.yrf" if [[ ! -e "$</span>ydestRep/map.yrf" ]]; then # pas de fichier de reference sur la cible print – “pas de fichier de reference sur la cible, passage en mode rsync” rsyncPublish swap else trycp “<span class="math inline">$ydestRep/map.yrf" "$</span>remoteRef” typeset -U filesToUpdate filesToUpdate=( $(diff $localRef $remoteRef | awk ’/<a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a>/ {print <span class="math inline">$2}' ) ) if (($</span>{#filesToUpdate} == 1)); then print – “Seul le fichier <span class="math inline">${filesToUpdate} sera téléversé" elif (($</span>{#filesToUpdate}<10)); then print –”<span class="math inline">${#filesToUpdate} fichiers seront téléversés :" print -- "$</span>{filesToUpdate}" else print – “${#filesToUpdate} fichiers seront téléversés” fi # copy all file with some differences # except the map in case of error for element in $filesToUpdate; do if [[ $element == “/map.yrf” ]]; then continue fi if [[ -e <span class="math inline"><em>s</em><em>r</em><em>c</em><em>R</em><em>e</em><em>p</em></span>element ]]; then trycp <span class="math inline"><em>s</em><em>r</em><em>c</em><em>R</em><em>e</em><em>p</em></span>element <span class="math inline"><em>y</em><em>d</em><em>e</em><em>s</em><em>t</em><em>R</em><em>e</em><em>p</em></span>element else tryrm <span class="math inline"><em>y</em><em>d</em><em>e</em><em>s</em><em>t</em><em>R</em><em>e</em><em>p</em></span>element fi done # if all went fine, copy the map file trycp $srcRep/map.yrf $ydestRep/map.yrf # remove the temporary file }</p>
|
||||
<h1 id="publication-via-rsync">publication via rsync</h1>
|
||||
<p>function rsyncPublish { result=1 essai=1 while (( $result > 0 )); do print – rsync -arv $srcRep/ $destRep.tmp if ((!testmode)); then rsync -arv $srcRep/ <span class="math inline"><em>d</em><em>e</em><em>s</em><em>t</em><em>R</em><em>e</em><em>p</em>.<em>t</em><em>m</em><em>p</em><em>f</em><em>i</em><em>r</em><em>e</em><em>s</em><em>u</em><em>l</em><em>t</em>=</span>? if (( <span class="math inline">$result > 0 )); then print -P -- "%BEchec du rsync%b (essai n°$</span>essai)" >&2 fi ((essai++)) done }</p>
|
||||
<h1 id="swap">swap</h1>
|
||||
<p>function swap { print -P – “%B[Directory Swap (tmp <=> target)]%b” [[ -e $destRep.old ]] && tryrm $destRep.old</p>
|
||||
<pre><code>print -- " renommage du repertoire sandard vers le .old"
|
||||
tryrename $destRep $destRep.old
|
||||
|
||||
print -- " renommage du repertoire tmp (nouveau) vers le standard"
|
||||
print -P -- "%B[Site Indisponible]%b $(date)"
|
||||
tryrename $destRep.tmp $destRep
|
||||
print -P -- "%B[Site Disponible]%b $(date)"
|
||||
|
||||
print -- " renommage du repertoire old vers le tmp"
|
||||
tryrename $destRep.old $destRep.tmp
|
||||
|
||||
print -P -- " publication terminée"</code></pre>
|
||||
<p>}</p>
|
||||
<p>print – “Root = $webroot” print – “Dest = $destRep”</p>
|
||||
if [[ “$1” = “-s” ]]; then swap else if [[ “$1” = “-d” ]]; then suffix="" else suffix=“.tmp” fi print -P – “%BSync%b[${Root:t} => <span class="math inline"><em>d</em><em>e</em><em>s</em><em>t</em><em>R</em><em>e</em><em>p</em> : <em>t</em></span>suffix]” incrementalPublish fi </code>
|
||||
</div>
|
||||
<p>This is my way to replace <code>rsync</code> with filesystem not handling it. Hope it is usefull. I’ll be happy to hear a way to handle the webdav rename folder problem. This is really annoying.</p>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p><><a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-28-custom-website-synchronisation-with-mobileme--2-/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-28-custom-website-synchronisation-with-mobileme--2-/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-28
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
// Remove all CSS I don't want to use on IE
|
||||
$('link[rel=stylesheet]').each(function(i)
|
||||
{
|
||||
if (this.getAttribute('href') == '/css/layout.css')
|
||||
this.disabled = true;
|
||||
if (this.getAttribute('href') == '/css/shadows.css')
|
||||
this.disabled = true;
|
||||
if (this.getAttribute('href') == '/css/gen.css')
|
||||
this.disabled = true;
|
||||
}) ;
|
||||
|
||||
// Append the CSS for IE only
|
||||
$('head').append('<link rel="stylesheet" type="text/css" href="/css/ie.css"/>');
|
||||
|
||||
// I also add a message on top of the page
|
||||
$('body').prepend('<div id="iemessage"><p><span class="fr"><em>Avec <a href="http://www.firefox.com"> Firefox </a> et <a href="http://www.apple.com/safari">Safari</a> cette page est bien plus jolie !</em></span><span class="en"><em>This page is far nicer with <a href="http://www.firefox.com"> Firefox </a> and <a href="http://www.apple.com/safari">Safari</a>!</em></span></p>.</div>');
|
||||
|
||||
|
|
@ -0,0 +1,129 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - How to handle evil IE</title>
|
||||
<meta name="keywords" content="web, webdesign, jQuery" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-30-How-to-handle-evil-IE/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>How to handle evil IE</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>For developer IE is a nightmare. This is why, I use a method to disable my standard CSS and enable a IE only CSS. I use jQuery to accomplish that.</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode js"><code class="sourceCode javascript"><a class="sourceLine" id="cb1-1" title="1"><span class="at">$</span>(document).<span class="at">ready</span>( <span class="kw">function</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="cf">if</span> (<span class="va">$</span>.<span class="at">browser</span>[<span class="st">"msie"</span>]) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="co">// include the ie.js file</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="at">$</span>(<span class="st">'head'</span>).<span class="at">append</span>(<span class="st">'<script type="text/javascript" src="/js/ie.js"></scr'</span> <span class="op">+</span> <span class="st">'ipt>'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"><span class="op">}</span>)<span class="op">;</span></a></code></pre></div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode js"><code class="sourceCode javascript"><a class="sourceLine" id="cb2-1" title="1"><span class="co">// Remove all CSS I don't want to use on IE</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="at">$</span>(<span class="st">'link[rel=stylesheet]'</span>).<span class="at">each</span>(<span class="kw">function</span>(i)</a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> <span class="cf">if</span> (<span class="kw">this</span>.<span class="at">getAttribute</span>(<span class="st">'href'</span>) <span class="op">==</span> <span class="st">'/css/layout.css'</span>) </a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw">this</span>.<span class="at">disabled</span> <span class="op">=</span> <span class="kw">true</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="cf">if</span> (<span class="kw">this</span>.<span class="at">getAttribute</span>(<span class="st">'href'</span>) <span class="op">==</span> <span class="st">'/css/shadows.css'</span>) </a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="kw">this</span>.<span class="at">disabled</span> <span class="op">=</span> <span class="kw">true</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="cf">if</span> (<span class="kw">this</span>.<span class="at">getAttribute</span>(<span class="st">'href'</span>) <span class="op">==</span> <span class="st">'/css/gen.css'</span>) </a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw">this</span>.<span class="at">disabled</span> <span class="op">=</span> <span class="kw">true</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"><span class="op">}</span>) <span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"><span class="co">// Append the CSS for IE only</span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"><span class="at">$</span>(<span class="st">'head'</span>).<span class="at">append</span>(<span class="st">'<link rel="stylesheet" type="text/css" href="/css/ie.css"/>'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"></a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"><span class="co">// I also add a message on top of the page</span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"><span class="at">$</span>(<span class="st">'body'</span>).<span class="at">prepend</span>(<span class="st">'<div id="iemessage"><p><span class="fr"><em>Avec <a href="http://www.firefox.com"> Firefox </a> et <a href="http://www.apple.com/safari">Safari</a> cette page est bien plus jolie !</em></span><span class="en"><em>This page is far nicer with <a href="http://www.firefox.com"> Firefox </a> and <a href="http://www.apple.com/safari">Safari</a>!</em></span></p>.</div>'</span>)<span class="op">;</span></a></code></pre></div>
|
||||
<p>That’s it.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-30
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,150 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Focus > Minimalism</title>
|
||||
<meta name="keywords" content="jQuery, design, web" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-Focus-vs-Minimalism/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Focus > Minimalism</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I believe the goal researched by minimalism is <strong>Focus</strong>. But I don’t believe minimalism should be the goal. Focus should be the goal, and I believe minimalism isn’t necessary to reach it.</p>
|
||||
<p>This is why my design is not minimalist, but I decided to remove most of the navigation stuff of all pages of my website. May be I’ll prefer to hide the menu only when you are on blog article. For now, I hide the menu everywhere on the website.</p>
|
||||
<hr />
|
||||
<h2 id="technical-details">technical details</h2>
|
||||
<p>For those who want the technical details behind the show/hide menu, here is the simple jQuery code.</p>
|
||||
<p>The HTML:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1"><span class="kw"><div</span><span class="ot"> id=</span><span class="st">"menuButton"</span><span class="kw">></div></span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw"><div</span><span class="ot"> id=</span><span class="st">"entete"</span><span class="kw">></span>#content of the menu<span class="kw"></div></span></a></code></pre></div>
|
||||
<p>The CSS:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode css"><code class="sourceCode css"><a class="sourceLine" id="cb2-1" title="1"><span class="pp">#menuButton</span> {</a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="kw">font-size</span>: <span class="dv">2</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="kw">height</span>: <span class="dv">2</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> <span class="kw">line-height</span>: <span class="dv">1.8</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw">width</span>: <span class="dv">2</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw">position</span>: <span class="dv">fixed</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="kw">left</span>: <span class="dv">0</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="kw">top</span>: <span class="dv">0</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw">z-index</span>: <span class="dv">9001</span> }</a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"><span class="pp">#menuButton</span><span class="in">:hover</span> {</a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="kw">cursor</span>: <span class="dv">pointer</span><span class="op">;</span> }</a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"><span class="pp">#entete</span> {</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> <span class="kw">top</span>: <span class="dv">5</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> <span class="kw">left</span>: <span class="dv">0</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> <span class="kw">position</span>: <span class="dv">fixed</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> <span class="kw">width</span>: <span class="dv">10</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> <span class="kw">z-index</span>: <span class="dv">9000</span><span class="op">;</span> }</a></code></pre></div>
|
||||
<p>The javascript code (using jQuery)</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb3-1" title="1"><span class="kw">function</span> <span class="at">hideMenu</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"> <span class="at">$</span>(<span class="st">'#entete'</span>).<span class="at">animate</span>(<span class="op">{</span><span class="dt">left</span><span class="op">:</span><span class="st">"-10em"</span><span class="op">},</span> <span class="dv">500</span> )<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"> <span class="at">$</span>(<span class="st">'#menuButton'</span>).<span class="at">html</span>(<span class="st">'&rarr;'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"><span class="kw">function</span> <span class="at">showMenu</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-6" title="6"> <span class="at">$</span>(<span class="st">'#entete'</span>).<span class="at">animate</span>(<span class="op">{</span><span class="dt">left</span><span class="op">:</span><span class="st">"0em"</span><span class="op">},</span> <span class="dv">500</span> )<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-7" title="7"> <span class="at">$</span>(<span class="st">'#menuButton'</span>).<span class="at">html</span>(<span class="st">'&larr;'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-8" title="8"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb3-9" title="9"><span class="kw">function</span> <span class="at">toggleMenu</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-10" title="10"> <span class="cf">if</span> ( <span class="at">$</span>(<span class="st">'#entete'</span>).<span class="at">css</span>(<span class="st">'left'</span>)<span class="op">==</span><span class="st">'-10em'</span> ) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-11" title="11"> <span class="at">showMenu</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-12" title="12"> <span class="op">}</span> <span class="cf">else</span> <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-13" title="13"> <span class="at">hideMenu</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-14" title="14"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb3-15" title="15"><span class="op">}</span></a></code></pre></div>
|
||||
<p>And the result is shown in the top left corner of this website.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-Focus-vs-Minimalism/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-Focus-vs-Minimalism/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-22
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,170 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - How to preload your site with style</title>
|
||||
<meta name="keywords" content="web, jQuery, webdesign" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-How-to-preload-your-site-with-style/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>How to preload your site with style</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h2 id="example">Example</h2>
|
||||
<p>Here is a live example of what appear while loading my pages.</p>
|
||||
<script src="http://code.jquery.com/jquery-1.12.3.min.js"></script>
|
||||
<div id="demo" style="width:45%; position: relative; height: 8em; background: #333; background-position: 50% 50%; color: #fff; text-align: center; padding-top: 1em; margin-left: auto; margin-right: auto; border: solid 10px rgba(255,255,255,0.7); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; cursor: pointer; ">
|
||||
<p>
|
||||
Hello! I’ve finished loading!
|
||||
</p>
|
||||
<p>
|
||||
Click me to see me disapear again.
|
||||
</p>
|
||||
<div id="todisapear" style="color: #000; position:absolute;top:0;left:0;text-align: center; padding-top: 1em; width: 100%; background-color: #eee; height: 8em;">
|
||||
<p>Loading… <img style="border: none; background-color: none; background: none" src="../../../../Scratch/img/loading.gif" alt="loading logo" /></p>
|
||||
</div>
|
||||
<script>
|
||||
function Rabbit(){
|
||||
$('#todisapear')
|
||||
.show()
|
||||
.animate({opacity: 1.0},3000)
|
||||
.fadeOut();
|
||||
}
|
||||
$(document).ready(function(){
|
||||
$('#todisapear').animate({opacity: 1.0},3000).fadeOut();
|
||||
$('#demo').click(Rabbit);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
<p>I first tried to integrate <a href="http://www.gayadesign.com/diy/queryloader-preload-your-website-in-style/">queryLoader</a>, but it didn’t fill my needs.</p>
|
||||
<p>The plugin add a black div to hide all the content. But as the script had to be launched at the end of the source code my website show for a small time.</p>
|
||||
<p>In order to hide this small artefact, here is how I do that.</p>
|
||||
<h2 id="code">Code</h2>
|
||||
<p>In a first time, I added at the top of the body the div hiding all the content.</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1">...</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw"><body></span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="kw"><div</span><span class="ot"> id=</span><span class="st">"blackpage"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> content to display during the loading.</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"><span class="kw"></div></span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6">...</a></code></pre></div>
|
||||
</div>
|
||||
<p>and here is the associated CSS to <code>#blackpage</code>:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode css"><code class="sourceCode css"><a class="sourceLine" id="cb2-1" title="1"><span class="pp">#blackpage</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> top<span class="in">: 0 </span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> left<span class="in">: 0 </span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> width<span class="in">: 100%</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> height<span class="in">: 100%</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> margin-left<span class="in">: 0</span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> margin-right<span class="in">: 0</span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> margin-top<span class="in">: 0</span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> margin-bottom<span class="in">: 0</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> position<span class="in">: absolute</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> text-align<span class="in">: center</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> color<span class="in">: #666</span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> padding-top<span class="in">: 10em</span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> background-color<span class="in">: #eee</span></a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> z-index<span class="in">: 9000</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>and the associated jQuery code:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb3-1" title="1"><span class="at">$</span>(document).<span class="at">ready</span>(<span class="kw">function</span>()<span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"> <span class="at">$</span>(<span class="st">'#blackpage'</span>).<span class="at">fadeOut</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"><span class="op">}</span>)<span class="op">;</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>Yes, it is as simple as that. And, putting the <code>#blackpage</code> div at the top of my page, I ensure to hide anything while loading.</p>
|
||||
<p>I hope it had helped you!</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-How-to-preload-your-site-with-style/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-How-to-preload-your-site-with-style/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-03
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,170 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Menu waiting to hide himself</title>
|
||||
<meta name="keywords" content="jQuery, web, javascript, design" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-Wait-to-hide-a-menu-in-jQuery/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Menu waiting to hide himself</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I discussed <a href="../../../../Scratch/en/blog/2009-10-Focus-vs-Minimalism">earlier why I prefer to hide my navigation menu</a>. I finally decided to hide it only after a short time. Just the time needed for a user to see it. But how make it disappear only when it is not used for some time?</p>
|
||||
<p>Here is how to accomplish that easily.</p>
|
||||
<p>HTML:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1"> <span class="kw"><div</span><span class="ot"> id=</span><span class="st">"menuButton"</span><span class="kw">></div></span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="kw"><div</span><span class="ot"> id=</span><span class="st">"entete"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="kw"><ul></span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="kw"><li></span> menu item 1 <span class="kw"></li></span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> ...</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="kw"><li></span> menu item n <span class="kw"></li></span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="kw"></ul></span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> <span class="kw"></div></span></a></code></pre></div>
|
||||
<p>CSS:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode css"><code class="sourceCode css"><a class="sourceLine" id="cb2-1" title="1"> <span class="pp">#entete</span> {</a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="kw">top</span>: <span class="dv">1</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="kw">left</span>: <span class="dv">0</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> <span class="kw">position</span>: <span class="dv">fixed</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw">width</span>: <span class="dv">10</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw">z-index</span>: <span class="dv">2000</span><span class="op">;</span> }</a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="pp">#entete</span> {</a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw">top</span>: <span class="dv">1</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> <span class="kw">height</span>: <span class="dv">22</span><span class="dt">em</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> <span class="kw">left</span>: <span class="dv">0</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="kw">position</span>: <span class="dv">fixed</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="kw">width</span>: <span class="dv">10</span><span class="dt">em</span><span class="op">;</span> }</a></code></pre></div>
|
||||
<p>Javascript:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode js"><code class="sourceCode javascript"><a class="sourceLine" id="cb3-1" title="1"><span class="kw">var</span> last<span class="op">=</span><span class="dv">0</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"><span class="co">// will hide the menu in 5 seconds</span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4"><span class="co">// if the variable 'last' has not changed its value</span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"><span class="kw">function</span> <span class="at">autoHideMenu</span>(value) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-6" title="6"> <span class="at">setTimeout</span>(<span class="kw">function</span>()<span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-7" title="7"> <span class="cf">if</span> ( last <span class="op">==</span> value ) <span class="op">{</span> <span class="at">hideMenu</span>()<span class="op">;</span> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb3-8" title="8"> <span class="op">},</span><span class="dv">5000</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-9" title="9"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb3-10" title="10"></a>
|
||||
<a class="sourceLine" id="cb3-11" title="11"><span class="at">$</span>(document).<span class="at">ready</span>( <span class="kw">function</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-12" title="12"> <span class="co">// show the menu when the mouse is on</span></a>
|
||||
<a class="sourceLine" id="cb3-13" title="13"> <span class="co">// the good area</span></a>
|
||||
<a class="sourceLine" id="cb3-14" title="14"> <span class="at">$</span>(<span class="st">'#menuButton'</span>).<span class="at">hover</span>(showMenu)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb3-16" title="16"> <span class="co">// If the mouse is on the menu change the</span></a>
|
||||
<a class="sourceLine" id="cb3-17" title="17"> <span class="co">// value of 'last'</span></a>
|
||||
<a class="sourceLine" id="cb3-18" title="18"> <span class="co">// try to hide the menu when the mouse </span></a>
|
||||
<a class="sourceLine" id="cb3-19" title="19"> <span class="co">// go out off the menu.</span></a>
|
||||
<a class="sourceLine" id="cb3-20" title="20"> <span class="at">$</span>(<span class="st">'#entete'</span>).<span class="at">hover</span>(</a>
|
||||
<a class="sourceLine" id="cb3-21" title="21"> <span class="kw">function</span>()<span class="op">{</span>last<span class="op">+=</span><span class="dv">1</span><span class="op">;},</span> </a>
|
||||
<a class="sourceLine" id="cb3-22" title="22"> <span class="kw">function</span>()<span class="op">{</span><span class="at">autoHideMenu</span>(last)<span class="op">;}</span> )<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-23" title="23"> <span class="at">autoHideMenu</span>(<span class="dv">0</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-24" title="24"><span class="op">}</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-25" title="25"></a>
|
||||
<a class="sourceLine" id="cb3-26" title="26"><span class="co">// show / hide menu functions details</span></a>
|
||||
<a class="sourceLine" id="cb3-27" title="27"></a>
|
||||
<a class="sourceLine" id="cb3-28" title="28"><span class="co">// move to the left</span></a>
|
||||
<a class="sourceLine" id="cb3-29" title="29"><span class="kw">function</span> <span class="at">hideMenu</span>() <span class="op">{</span> </a>
|
||||
<a class="sourceLine" id="cb3-30" title="30"> <span class="at">$</span>(<span class="st">'#entete'</span>).<span class="at">animate</span>(<span class="op">{</span><span class="dt">left</span><span class="op">:</span><span class="st">"-10em"</span><span class="op">},</span> <span class="dv">500</span> )<span class="op">;</span> </a>
|
||||
<a class="sourceLine" id="cb3-31" title="31"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb3-32" title="32"></a>
|
||||
<a class="sourceLine" id="cb3-33" title="33"><span class="co">// move to right and will try to hide in 5 sec.</span></a>
|
||||
<a class="sourceLine" id="cb3-34" title="34"><span class="kw">function</span> <span class="at">showMenu</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-35" title="35"> <span class="at">$</span>(<span class="st">'#entete'</span>).<span class="at">animate</span>(<span class="op">{</span><span class="dt">left</span><span class="op">:</span><span class="st">"0em"</span><span class="op">},</span> <span class="dv">500</span> )<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-36" title="36"> last<span class="op">+=</span><span class="dv">1</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-37" title="37"> <span class="at">autoHideMenu</span>(last)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-38" title="38"><span class="op">}</span></a></code></pre></div>
|
||||
<p>Simple and lightweight. No timer (almost), no memory leak, no Date…</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-Wait-to-hide-a-menu-in-jQuery/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-Wait-to-hide-a-menu-in-jQuery/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-26
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,110 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - launch daemon from command line</title>
|
||||
<meta name="keywords" content="zsh, shell, script, tip" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-launch-daemon-from-command-line/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>launch daemon from command line</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Here is a tip, I don’t know why, but I almost always forgot how to do that.</p>
|
||||
<p>When you want to launch a command and this command should not be killed after you close your terminal. Here is how to accomplish that from command line:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="kw">nohup</span> cmd <span class="kw">&</span></a></code></pre></div>
|
||||
<p><small>where <code>cmd</code> is your command.</small></p>
|
||||
<p>I let this command here for me and I wish it could also help someone.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-launch-daemon-from-command-line/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-launch-daemon-from-command-line/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-23
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,229 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Untaught Git usage</title>
|
||||
<meta name="keywords" content="git, dcvs, programming" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-10-untaught-git-usage/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Untaught Git usage</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p><small> <em>I explain why I had so much difficulties to use Git. There is an “untaught rule” that make hard to work without. Until I read the good document. </em></small></p>
|
||||
<p><small> <em> “Cheap branches” aren’t designed to be totally isolated branches but rather should follow a “Master Branch”. There is a </em>Standard Workflow<em> to follow. If you don’t follow it, you prepare yourself with some hard time with Git.</em> </small></p>
|
||||
<hr />
|
||||
<h1 id="my-way-to-decentralisation">My way to decentralisation</h1>
|
||||
<h3 id="from-svn-to-bazaar">From SVN to Bazaar</h3>
|
||||
<p>I was a huge user of <a href="http://subversion.tigris.org">subversion (svn)</a>. Until the day I saw this <a href="http://www.youtube.com/watch?v=4XpnKHJAok8">video of Linus Torvald</a>. Where he explain Git and all advantages of <em>Decentralized Concurrent Versioning System</em>(<abbr title="Decentralized Concurrent Versioning System">DCVS</abbr>)</p>
|
||||
<p>I must say I was completely convinced. And the more you learn about <abbr title="Decentralized Concurrent Versioning System">DCVS</abbr> the more you see good reason to use them.</p>
|
||||
<p>I then needed a versioning system for my team. As they were not used to open source versioning system except those heavy, with a GUI and with and administrator<sup><a href="#note1">†</a></sup></p>
|
||||
<p>After some web searches, I founded three main choices:</p>
|
||||
<ul>
|
||||
<li><a href="http://git-scm.com">Git</a></li>
|
||||
<li><a href="http://bazaar-vcs.org">Bazaar</a></li>
|
||||
<li><a href="http://selenic.com/mercurial">Mercurial</a></li>
|
||||
</ul>
|
||||
<p>After trying each other I chosen Bazaar. It has the simplest User Interface<sup><a href="#note2">*</a></sup>. My choice was done.</p>
|
||||
<h3 id="from-bazaar-to-git">From Bazaar to Git</h3>
|
||||
<p>It was really natural to learn when coming from <em>subversion</em>. The <code>pull</code> command corresponding to <code>update</code>, <code>push</code> command to <code>commit</code>. Commands like <code>commit</code> and <code>update</code> are still there if you want to use an SVN <em>workflow</em>.</p>
|
||||
<p>After some times, reading on many blogs, I realize Git is far more popular and by influent people.</p>
|
||||
<p>I then decide to use Git in particular to <em>version</em> this current website. But after trying it, I found it difficult and couter intuitive (I’ll speak a work about it later).</p>
|
||||
<p>After calling for some help, when I say Bazaar is much simpler to learn, some people answer me that Git:</p>
|
||||
<blockquote>
|
||||
<p>— <em>SO-MUCH-EASY my 12 year old daughter uses it to version its school documents. She has no difficulties at all, creating branches, blah, blah, blah…</em></p>
|
||||
</blockquote>
|
||||
<p>If a 12 years old girl has no problem with Git and I (with my Computer Science Ph.D.) have difficulties to uses it like I want, it is frustrating and humiliating. But what makes Git natural for some people and confusing for me?</p>
|
||||
<p>I finally understood why reading a document I didn’t read before. It was the <em>untaught</em> part of the conception. The part every developer found so <em>natural</em> it is not necessary to say a word about it. But it was not <em>natural</em> for me.</p>
|
||||
<p><small><a name="note1">†</a> - I speak about <em>ClearCase(c)</em>. I know there exists command line tools. But it was not the way my team used it.</small></p>
|
||||
<p><small><a name="note2">*</a> - I never really given its chance to Mercurial. The terminology they chosen was too far from the svn one. And I was used to it.</small></p>
|
||||
<hr />
|
||||
<p>When you see explanation about <em>branches</em> and <abbr title="Decentralized Concurrent Versioning System">DCVS</abbr> we imagine each branch is totally uncorrelated to each other, except when <em>merging</em>. Everything is magic. This is the “<em>Parallel World</em>” explanation. This way of seeing is explained more in depth in the <a href="http://betterexplained.com/articles/a-visual-guide-to-version-control/">real good article about branches</a> on betterexplained.</p>
|
||||
<p>Git was designed to manage the Linux Kernel. Git was designed using the concept of <em>Patch</em> instead of <em>Parallel Worlds</em>.</p>
|
||||
<p>From one site <em>Parallel World</em> and <em>Patches</em> from the other. There is many equivalent notions in the two point of vue, but also some differences.</p>
|
||||
<ul>
|
||||
<li>Bazaar seems base on the <em>Parallel World</em> vision which implies <em>Patches</em></li>
|
||||
<li>While Git seem base on the <em>Patch</em> model which will implie the creation of <em>Parallel Worlds</em>.</li>
|
||||
</ul>
|
||||
<p>I will not argument about which is the best. Just tell my vision of DCVS come from the <em>Parallel World</em> vision and Git was designed the other way<sup><a href="#note3">‡</a></sup>.</p>
|
||||
<h2 id="from-theory-to-real-life-usage">From Theory to Real Life Usage</h2>
|
||||
<p>I believe I understood conceptual mechanism under Git. But I had some difficulties with real usage. The worst point, the one I didn’t get before long was because I didn’t get really well the notion of <em>Cheap Branching</em>.</p>
|
||||
<p>What is a <em>Cheap Branch</em>? If like me you come from Bazaar, it is a totally new notion. It is in fact the ability to create a branches all of them using the same directory.</p>
|
||||
<p>You just have to launch a Git command and the local directory reflect the state of the branch you selected.</p>
|
||||
<p>In theory, <em>Cheap Branches</em> are exactly like Bazaar branches. The word used is <em>Branch</em> and not <em>Cheap Branch</em>. But there is a slight difference between them. A slight difference between a <em>Cloned Branch</em> and a <em>Cheap Branch</em>.</p>
|
||||
<p>A “Standard branch” is what is theoretically a kind of new <em>Parallel World</em>. But <em>Cheap branch</em> was designed to be future <em>Patch</em> for the main branch of the directory/Cloned branch.</p>
|
||||
<p>Of course, I know anybody can state you can totally use <em>Cheap branches</em> as <em>Cloned branches</em>. But they weren’t designed for that. On daily usage, it is a bit uneasy to use it like this.</p>
|
||||
<p>Here how Git <em>cheap branches</em> should be used (for more details see <a href="http://hoth.entp.com/output/git_for_designers.html">Git for Designers</a>):</p>
|
||||
<ul>
|
||||
<li>get or creation of a main repositoy <strong><sc>The Great Repository</sc></strong></li>
|
||||
<li>creation of a <em>Cheap branch</em> containing differences which <strong>have</strong> to be patched somewhere in the future into <strong><sc>The Great Repository</sc></strong></li>
|
||||
</ul>
|
||||
<p>Here’s how you should <strong>not</strong> use Git:</p>
|
||||
<ul>
|
||||
<li>Get or creation of a repository</li>
|
||||
<li>Create a <em>cheap branch</em> which will never push it’s modification to the main repository.</li>
|
||||
</ul>
|
||||
<p>This simple minor difference of point of view confused me a lot.</p>
|
||||
<h3 id="real-life-usage">Real Life Usage</h3>
|
||||
<p>Now I have understood all that. I understand why Git has some many people claiming it is the best DCVS.</p>
|
||||
<p>Cheap branching notion is essential in Git and is a really useful feature. Particularly for this website. But, there are not exactly, completely parallel line of development. Because they are designed to path the main branch. Of course, it is not an obligation, but there are slight messages which tell you this should be used like that.</p>
|
||||
<p>If I want to separate in a better way some branches I just have to <em>Clone</em> them. And I return exactly in branches Bazaar provided me.</p>
|
||||
<h3 id="examples">Examples</h3>
|
||||
<p>For now, I prefer (from far) Bazaar terminology. They are cleaner and more understandable.</p>
|
||||
<div>
|
||||
<code class="zsh">bzr revert</code>
|
||||
</div>
|
||||
<p>Is clearer than</p>
|
||||
<div>
|
||||
<code class="zsh">git reset –hard HEAD</code>
|
||||
</div>
|
||||
<p>We can tell the same thing about</p>
|
||||
<div>
|
||||
<code class="zsh">bzr revert -r -3</code>
|
||||
</div>
|
||||
<p>which seems preferable to</p>
|
||||
<div>
|
||||
<code class="zsh">git reset –hard HEAD~3</code>
|
||||
</div>
|
||||
<p>Until now, it is not big business. But now, things will go worse. If we want to revert time on all the tree we use the keyword <code>reset</code>.</p>
|
||||
<center>
|
||||
OK
|
||||
</center>
|
||||
<p>Now, if I want to revert time on on file. We should naturally imagine the command will be:</p>
|
||||
<div>
|
||||
<code class="zsh">git reset –hard FILE</code>
|
||||
</div>
|
||||
<center>
|
||||
<strong>OF COURSE NOT!</strong>
|
||||
</center>
|
||||
<p>The solution is:</p>
|
||||
<div>
|
||||
<code class="zsh">git checkout FILE</code>
|
||||
</div>
|
||||
<p>What? <strong><code>checkout</code></strong> !? Well, ok. I accept. why not? With Bazaar it is:</p>
|
||||
<div>
|
||||
<code class="zsh">git revert FILE</code>
|
||||
</div>
|
||||
<p>What I personally found far more natural.</p>
|
||||
<p>But the command to change the current <em>cheap branch</em> is really hard to be accepted (from the User Interface point of view). With Bazaar it is:</p>
|
||||
<div>
|
||||
<code class="zsh">cd ../branch</code>
|
||||
</div>
|
||||
<p>Well yes. With Bazaar you have to change your directory to change your branch. It needs more disk resources but it is really clear. Which is my current branch, is just a <code>pwd</code> away. For Git here is the command:</p>
|
||||
<div>
|
||||
<code class="zsh">git checkout branch</code>
|
||||
</div>
|
||||
<p><strong>WTF?</strong> I believed <code>checkout</code> was the key to get a file in some state (not the entire tree).</p>
|
||||
<p>Then <code>checkout</code> is the same keyword used to get back in time on a file (BUT NOT ON ALL THE TREE where you have to use <code>reset --hard</code>) and to <strong>change current branch</strong>!</p>
|
||||
<p>It is totally unnatural. Even if it is theoretically totally justified like you can see in the really good article <a href="http://eagain.net/articles/git-for-computer-scientists/">Git for Computer Scientist</a>. From the user point of vue, it is difficult to do worse than that. It is like somebody made it on purpose to make it the hardest possible to learn and understand.</p>
|
||||
<blockquote>
|
||||
<ul>
|
||||
<li>— Try to find the good keyword for this operation</li>
|
||||
<li>— Wrong! Try again!</li>
|
||||
<li>— False, it is not yet right!</li>
|
||||
</ul>
|
||||
</blockquote>
|
||||
<p>That were the Git bad side. But It has many advantages. Once you’ve understood the <em>cheap branching</em> paradigm. All became clearer for me after. Even if there is also some difficulties with the edit of the <code>.git/config</code> files (not user friendly at all).</p>
|
||||
<p><small><a name="note3">‡</a> I must precise that I worked a lot with multi-modal logic and particularly about “Temporal Logics” (linear or not). This is why I was more inclined to see things this way. “Ah ! Just to remember my firsts love with computer science !”</small></p>
|
||||
<hr />
|
||||
<h1 id="conclusion">Conclusion</h1>
|
||||
<h3 id="dcvs-vs.-cvs">DCVS vs. CVS ?</h3>
|
||||
<p>Was it a good idea to change to a <em>decentralised</em> versionning system? Clearly yes. Decentralisation give far much great possibilities. Such as working on a fix on a totally isolated branches.</p>
|
||||
<h3 id="is-git-better-than-bazaar">Is Git better than Bazaar?</h3>
|
||||
<p>Speaking about <em>features</em> I’ll tell Git is the best. But Git was too much in my way. Is was exactly what I didn’t want for my first DCVS.</p>
|
||||
<p>I shouldn’t have had those difficulties about understanding <em>cheap branching which must be a patch</em>. In reality, Git make a difference between the Tree and the Branch. Which is obviously not the case for Bazaar. Conceptually, bazaar is simpler to understand.</p>
|
||||
<h3 id="finally">Finally</h3>
|
||||
<p>In conclusion, I use Git more often than Bazaar and I must say, that I have some preferences for Git. However, Git lack hardly clear commands name like <code>revert</code>. For now I don’t made alias to correct that. But may be one day I should do that.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-untaught-git-usage/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-10-untaught-git-usage/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-10-13
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
[color]
|
||||
branch = auto
|
||||
diff = auto
|
||||
status = auto
|
||||
[alias]
|
||||
st = status
|
||||
co = checkout
|
||||
br = branch
|
||||
lg = log --pretty=oneline --graph
|
||||
logfull = log --pretty=fuller --graph --stat -p
|
||||
unstage = reset HEAD
|
||||
# there should be an article on what this command do
|
||||
uncommit = !zsh -c '"if (($0)); then nb=$(( $0 - 1 )); else nb=0; fi; i=0; while ((i<=nb)); do git revert -n --no-edit HEAD~$i; ((i++)); done; git commit -m \"revert to $0 version(s) back\""'
|
||||
undomerge = reset --hard ORIG_HEAD
|
||||
conflict = !gitk --left-right HEAD...MERGE_HEAD
|
||||
# under Mac OS X, you should use gitx instead
|
||||
# conflict = !gitx --left-right HEAD...MERGE_HEAD
|
||||
[branch]
|
||||
autosetupmerge = true
|
||||
|
|
@ -0,0 +1,468 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Git for n00b</title>
|
||||
<meta name="keywords" content="git" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-11-12-Git-for-n00b/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Git for n00b</h1>
|
||||
<h2>introduction</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p>A detailed tutorial of <a href="http://git-scm.org">Git</a> for people knowing very few about versions systems. You’ll understand utility of such program and how we use modern version control system. I try to stay as pragmatic as possible.</p>
|
||||
</div>
|
||||
<hr />
|
||||
<h1 id="begin-with-conclusion">Begin with conclusion</h1>
|
||||
<p>Here is the list of sufficient and necessary command to use <a href="http://git-scm.org" title="Git">Git</a>. There is very few. It is normal not to understand immediately but it is to gives you an idea. Even if this article is long, 95% of <a href="http://git-scm.org" title="Git">Git</a> usage is in these 7 commands:</p>
|
||||
<p>Get a project from the web:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1">git <span class="kw">clone</span> ssh://server/path/to/project</a></code></pre></div>
|
||||
<p>Everyday <a href="http://git-scm.org" title="Git">Git</a> usage:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb2-1" title="1"><span class="co"># get modifications from other</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2">git pull</a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="co"># read what was done</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4">git <span class="kw">log</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"><span class="co"># Make local changes to files </span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7">hack, hack, hack...</a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"><span class="co"># list the modified files</span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9">git status</a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"><span class="co"># show what I've done</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11">git <span class="kw">diff</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"><span class="co"># tell git to version a new file</span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14">git add new/file</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"><span class="co"># commit its own modifications </span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"><span class="co"># to its local branch</span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18">git commit -a -m <span class="st">"Fix bug #321"</span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"></a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"><span class="co"># send local modifications to other</span></a>
|
||||
<a class="sourceLine" id="cb2-21" title="21">git push</a></code></pre></div>
|
||||
<p>This article is written for people knowing very few about versionning systems. It is also written for those who had didn’t followed progress since CVS or subversion (SVN). This is why, in a first time I’ll explain quickly which are the goal of such systems. Secondly, I’ll explain how to install and configure <a href="http://git-scm.org" title="Git">Git</a>. Then, I give the command for each feature a <abbr title="Decentralized Concurent Versions System">DCVS</abbr> must have.</p>
|
||||
<h1 id="gitgit-for-what"><a href="http://git-scm.org" title="Git">Git</a> for what?</h1>
|
||||
<div class="intro">
|
||||
<p>If you just want to use <a href="http://git-scm.org" title="Git">Git</a> <strong>immediately</strong>, just read dark part. You read this part later to understand correctly foundations of version systems and not doing strange things.</p>
|
||||
</div>
|
||||
<p><a href="http://git-scm.org" title="Git">Git</a> is a <abbr title="Decentralized Concurent Versions System">DCVS</abbr>, which means a Decentralized Concurrent Versions System. Let’s analyze each part of this long term:</p>
|
||||
<h3 id="versions-system">Versions System</h3>
|
||||
<p>Firstly, versions system manage files. When somebody work with files without a versions system, the following happens frequently:</p>
|
||||
<p>When you modify a somehow critical file you don’t want to loose. You copy naturally this file with another name. For example:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb3-1" title="1">$ <span class="kw">cp</span> fichier_important.c fichier_important.c.bak</a></code></pre></div>
|
||||
<p>In consequence of what, the new file, play the role of <em>backup</em>. If you break everything, you can always return in the last state by overwriting your modifications. Of course, this method is not very professional and is a bit limited. If you make many modifications, you’ll end with many files with strange names like:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb4-1" title="1">fichier_important.c.bak</a>
|
||||
<a class="sourceLine" id="cb4-2" title="2">fichier_important.c.old</a>
|
||||
<a class="sourceLine" id="cb4-3" title="3">fichier_important.c.Bakcup</a>
|
||||
<a class="sourceLine" id="cb4-4" title="4">fichier_important.c.BAK.2009-11-14</a>
|
||||
<a class="sourceLine" id="cb4-5" title="5">fichier_important.c.2009.11.14</a>
|
||||
<a class="sourceLine" id="cb4-6" title="6">fichier_important.c.12112009</a>
|
||||
<a class="sourceLine" id="cb4-7" title="7">old.fichier_important.c</a></code></pre></div>
|
||||
</div>
|
||||
<p>If you want to make it works correctly, you’ll have to use naming convention. Files take many place even if you modify most of time only some lines.</p>
|
||||
<p><em>Fortunately, versions system are here to help.</em></p>
|
||||
<p>You only have to signal you want a new version of a file and the versions system will do the job for you. It will record the backup where it could be easily recovered. Generally, systems version do it better than you, making the backup only of the modified lines and not the total file.</p>
|
||||
<p>Once upon a time versions were managed for each file separately. I think about CVS. Then it naturally appears projects are a coherent set of files. Recover each file separately was a tedious work. This is why versions number passed from files to the entire project.</p>
|
||||
<p>It is therefore possible to say, “I want to get back three days earlier”.</p>
|
||||
<div class="black">
|
||||
<p><em>What gives versions system?</em> (I didn’t mention everything at all)</p>
|
||||
<ul>
|
||||
<li>automatic backups: <em>back in time</em>,</li>
|
||||
<li>gives the ability to see differences between each version,</li>
|
||||
<li>put a <em>tag</em> on some version to be able to refer to them easily,</li>
|
||||
<li>gives the ability to see an historic of all modifications. Generally the user must add a comment for each new version.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h3 id="concurrent">concurrent:</h3>
|
||||
<p>Version Systems are already useful to manage its own projects. They help to organize and resolve partially backup problems. I say partially because you have to backup your repository on a decent file system. But versions system are really interesting is on projects done by many people.</p>
|
||||
<p>Let’s begin by an example, a two person project ; Alex and Beatrice. On a file containing a <em>Lovecraft</em>’s gods list:</p>
|
||||
<div style="width: 10em; margin-left: auto; margin-right: auto">
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb5-1" title="1">Cthulhu</a>
|
||||
<a class="sourceLine" id="cb5-2" title="2">Shubniggurath</a>
|
||||
<a class="sourceLine" id="cb5-3" title="3">Yogsototh</a></code></pre></div>
|
||||
</div>
|
||||
Say Alex is home and modify the file:
|
||||
<div style="width: 10em; margin-left: auto; margin-right: auto">
|
||||
<pre class="twilight">
|
||||
Cthulhu
|
||||
Shubniggurath
|
||||
<span class="StringConstant"><strong>Soggoth</strong></span>
|
||||
Yogsototh
|
||||
</pre>
|
||||
</div>
|
||||
<p>after that he send the file on the project server. Then on the server there is the Alex file:</p>
|
||||
<p>A bit later, Beatrice who had not get the Alex file on the server make the modification:</p>
|
||||
<div style="width: 10em; margin-left: auto; margin-right: auto">
|
||||
<pre class="twilight">
|
||||
Cthulhu
|
||||
<span class="Constant"><strong>Dagon</strong></span>
|
||||
Shubniggurath
|
||||
Yogsototh
|
||||
</pre>
|
||||
</div>
|
||||
<p>Beatrice send her file on the server</p>
|
||||
<p>Alex modification is <em>lost</em>. One more time, versions system are here to help.</p>
|
||||
<p>A version system would had <em>merge</em> the two files at the time Beatrice send the file on the server. And like by magic, on the server the file would be:</p>
|
||||
<div style="width: 10em; margin-left: auto; margin-right: auto">
|
||||
<pre class="twilight">
|
||||
Cthulhu
|
||||
<span class="Constant"><strong>Dagon</strong></span>
|
||||
Shubniggurath
|
||||
<span class="StringConstant"><strong>Soggoth</strong></span>
|
||||
Yogsototh
|
||||
</pre>
|
||||
</div>
|
||||
<p>In real life, at the moment Beatrice want to send her modifications, the versions system alert her a modification had occurred on the server. Then she uses a command which pull the modification from the server to her local computer. And this command update her file. After that, Beatrice send again the new file on the server.</p>
|
||||
<div class="black">
|
||||
<p><strong>In what Concurrent Versions System help?</strong></p>
|
||||
<ul>
|
||||
<li>get without any problem others modifications,</li>
|
||||
<li>send without any problem its own modifications to others,</li>
|
||||
<li>manage conflicts. I didn’t speak about it, but sometimes a conflict can occur (when two different people modify the same line on a file for example). SVC help to resolve such problem. More on that later,</li>
|
||||
<li>help to know who done what and when.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h3 id="decentralized">decentralized</h3>
|
||||
<p>This word became popular only recently about CVS. And it mainly means two things:</p>
|
||||
<p>First, until really recently (SVN), you’ll have to be connected to the distant server to get informations about a project. Like get the history. New decentralized systems work with a local <em>REPOSITORY</em> (directory containing backups and many informations linked to the versions system functionalities). Hence, one can view the history of a project without the need of being connected.</p>
|
||||
<p>All instances of a project can live <em>independently</em>.</p>
|
||||
<p>To be more precise, DCVS are base on the <em>branch</em> notion.</p>
|
||||
<p>Practically, it has great importance. It means, everybody work separately, and the system help to glue all their work.</p>
|
||||
<p>It is even more than just that. It help to code independently each feature and bug fixes. Under other system it was far more difficult.</p>
|
||||
<p>Typical example:</p>
|
||||
<blockquote>
|
||||
<p>I develop my project. I’m ameliorating something. An urgent bug is reported.</p>
|
||||
<p>With a DCVS I can easily, get back to the version with the bug. Fix it. Send the fix. Get back to my feature work. And even, use the fix for the new version with my new feature.</p>
|
||||
<p>In a not decentralized version system, doing such a thing is possible but not natural. Decentralization means it become natural to use a branch for each separable work.</p>
|
||||
</blockquote>
|
||||
<div class="black">
|
||||
<p><strong>Advantages given by DCVS:</strong></p>
|
||||
<ul>
|
||||
<li>Ability to work offline,</li>
|
||||
<li>Ability to create many <em>atomic</em> patches,</li>
|
||||
<li>Help the maintenance of many different versions of the same application.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="to-resume">To resume</h2>
|
||||
<p>Let’s resume what we can easily do with DCVS:</p>
|
||||
<p><strong>Versions Systems</strong></p>
|
||||
<ul>
|
||||
<li>back in time,</li>
|
||||
<li>list differences between versions,</li>
|
||||
<li>name some versions to refer to them easily</li>
|
||||
<li>show history of modifications</li>
|
||||
</ul>
|
||||
<p><strong>Concurrent</strong></p>
|
||||
<ul>
|
||||
<li>get others modifications,</li>
|
||||
<li>send its modifications to others,</li>
|
||||
<li>know who done what and when,</li>
|
||||
<li>conflicts management.</li>
|
||||
</ul>
|
||||
<p><strong>Decentralized</strong></p>
|
||||
<ul>
|
||||
<li>Easily manipulate branches</li>
|
||||
</ul>
|
||||
<p>Now let’s see how to obtain all these things easily with <a href="http://git-scm.org" title="Git">Git</a>.</p>
|
||||
<h1 id="before-usage-configuration">Before usage, configuration</h1>
|
||||
<h2 id="install">install</h2>
|
||||
<p>Under Linux Ubuntu or Debian:</p>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb6-1" title="1">$ <span class="kw">sudo</span> apt-get <span class="kw">install</span> git</a></code></pre></div>
|
||||
<p>Under Mac OS X:</p>
|
||||
<ul>
|
||||
<li>install <a href="http://macports.org/install.php">MacPorts</a></li>
|
||||
<li>install <a href="http://git-scm.org" title="Git">Git</a></li>
|
||||
</ul>
|
||||
<div class="sourceCode" id="cb7"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb7-1" title="1">$ <span class="kw">sudo</span> port selfupdate</a>
|
||||
<a class="sourceLine" id="cb7-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb7-3" title="3">$ <span class="kw">sudo</span> port <span class="kw">install</span> git-core</a></code></pre></div>
|
||||
<h2 id="global-configuration">Global configuration</h2>
|
||||
<p>Save the following file as your <code>~/.gitconfig</code>.</p>
|
||||
<pre><code>[color]
|
||||
branch = auto
|
||||
diff = auto
|
||||
status = auto
|
||||
[alias]
|
||||
st = status
|
||||
co = checkout
|
||||
br = branch
|
||||
lg = log --pretty=oneline --graph
|
||||
logfull = log --pretty=fuller --graph --stat -p
|
||||
unstage = reset HEAD
|
||||
# there should be an article on what this command do
|
||||
uncommit = !zsh -c '"if (($0)); then nb=$(( $0 - 1 )); else nb=0; fi; i=0; while ((i<=nb)); do git revert -n --no-edit HEAD~$i; ((i++)); done; git commit -m \"revert to $0 version(s) back\""'
|
||||
undomerge = reset --hard ORIG_HEAD
|
||||
conflict = !gitk --left-right HEAD...MERGE_HEAD
|
||||
# under Mac OS X, you should use gitx instead
|
||||
# conflict = !gitx --left-right HEAD...MERGE_HEAD
|
||||
[branch]
|
||||
autosetupmerge = true</code></pre>
|
||||
<p>You can achieve the same result using for each entry the command: <code>git config --global</code>. Next, configure your name and your email. For example, if your name is John Doe and your email is <code>john.doe@email.com</code>. Launch the following commands:</p>
|
||||
<div class="sourceCode" id="cb9"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb9-1" title="1">$ git config --global user.name John Doe</a>
|
||||
<a class="sourceLine" id="cb9-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb9-3" title="3">$ git config --global user.email john.doe@email.com</a></code></pre></div>
|
||||
<p>Here it is. Base configuration is over. The file containing alias will help to type shorter commands.</p>
|
||||
<h2 id="get-a-project">Get a project</h2>
|
||||
<p>If a project is already versionned with <a href="http://git-scm.org" title="Git">Git</a> you should have an <code>URL</code> of the sources. Then use the following command:</p>
|
||||
<div class="sourceCode" id="cb10"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb10-1" title="1">$ <span class="kw">cd</span> ~/Projets</a>
|
||||
<a class="sourceLine" id="cb10-2" title="2">$ git <span class="kw">clone</span> git://main.server/path/to/file</a></code></pre></div>
|
||||
<p>If there is no git server but you’ve got an <code>ssh</code> access. Just replace the <code>git://host</code> by <code>ssh://user@host</code>. In order not to type your password each time, use:</p>
|
||||
<div class="sourceCode" id="cb11"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb11-1" title="1">$ <span class="kw">ssh-keygen</span> -t rsa</a></code></pre></div>
|
||||
<p>Reply to question and <strong>do not enter</strong> a password. Then copy your keys to the distant server. This is not the safest way to do this. The safest being, using <code>ssh-agent</code>.</p>
|
||||
<p>The easiest way if you have <code>ssh-copy-id</code>:</p>
|
||||
<div class="sourceCode" id="cb12"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb12-1" title="1">me@locahost$ ssh-copy-id ~/.ssh/id_rsa.pub me@main.server</a></code></pre></div>
|
||||
<p>or manually</p>
|
||||
<div class="sourceCode" id="cb13"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb13-1" title="1">me@locahost$ <span class="kw">scp</span> ~/.ssh/id_rsa.pub me@main.server:</a>
|
||||
<a class="sourceLine" id="cb13-2" title="2">me@locahost$ <span class="kw">ssh</span> me@main.server</a>
|
||||
<a class="sourceLine" id="cb13-3" title="3">password:</a>
|
||||
<a class="sourceLine" id="cb13-4" title="4">me@main.server$ <span class="kw">cat</span> id_rsa.pub <span class="kw">>></span> ~/.ssh/authorized_keys</a>
|
||||
<a class="sourceLine" id="cb13-5" title="5">me@main.server$ <span class="kw">rm</span> id_rsa.pub</a>
|
||||
<a class="sourceLine" id="cb13-6" title="6">me@main.server$ <span class="kw">logout</span></a></code></pre></div>
|
||||
<p>Now you don’t need to write your password to access the <code>main.server</code>.</p>
|
||||
<h2 id="creating-a-new-project">Creating a new project</h2>
|
||||
<p>Suppose you already have a project with files. Then it is really easy to version it.</p>
|
||||
<div class="sourceCode" id="cb14"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb14-1" title="1">$ <span class="kw">cd</span> /path/to/project</a>
|
||||
<a class="sourceLine" id="cb14-2" title="2">$ git init</a>
|
||||
<a class="sourceLine" id="cb14-3" title="3">$ git add <span class="kw">.</span></a>
|
||||
<a class="sourceLine" id="cb14-4" title="4">$ git commit -m <span class="st">"Initial commit"</span></a></code></pre></div>
|
||||
<p>Let do a small remark. If you don’t want to <em>version</em> every file. Typically intermediate compilation file, swap files… Then you need to exclude them. Just before launching the <code>git add .</code> command. You need to create a <code>.gitignore</code> file in the root directory of your project. This file will contain all exclude <em>pattern</em>. For example:</p>
|
||||
<div class="sourceCode" id="cb15"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb15-1" title="1">*.o</a>
|
||||
<a class="sourceLine" id="cb15-2" title="2">*.bak</a>
|
||||
<a class="sourceLine" id="cb15-3" title="3">*.swp</a>
|
||||
<a class="sourceLine" id="cb15-4" title="4">*~</a></code></pre></div>
|
||||
<p>Now, if you want to create a repository on a distant server, it <em>must</em> not be in <code>bare</code> mode. The repository will contain only versionning informations, but not the files of the project. To achieve that:</p>
|
||||
<div class="sourceCode" id="cb16"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb16-1" title="1">$ <span class="kw">cd</span> /path/to/local/project</a>
|
||||
<a class="sourceLine" id="cb16-2" title="2">$ git <span class="kw">clone</span> --bare <span class="kw">.</span> ssh://server/path/to/project</a></code></pre></div>
|
||||
<p>Others will be able to get your modifications.</p>
|
||||
<div class="sourceCode" id="cb17"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb17-1" title="1">git <span class="kw">clone</span> ssh://server/path/to/project</a></code></pre></div>
|
||||
<h2 id="abstract-of-the-second-step">Abstract of the second step</h2>
|
||||
<p>You now have a local directory on your computer. It is versionned and you can say it is, because there is a <code>.git</code> directory at the root (and the root only) of your project. This directory contain all necessary informations for <a href="http://git-scm.org" title="Git">Git</a> to version your project.</p>
|
||||
<p>Now you only need to know how to use it.</p>
|
||||
<h1 id="here-we-go">Here we go!</h1>
|
||||
<p>Here is one from many way to use <a href="http://git-scm.org" title="Git">Git</a>. This method is sufficient to work on a project. Not there is many other <em>workflows</em>.</p>
|
||||
<h2 id="basic-usage">Basic usage</h2>
|
||||
<p>Work with <a href="http://git-scm.org" title="Git">Git</a> immediately:</p>
|
||||
<ul>
|
||||
<li>Get modification done by others <code>git pull</code>,</li>
|
||||
<li>See details of these modifications <code>git log</code>,</li>
|
||||
<li>Many times:
|
||||
<ul>
|
||||
<li><em>Make an atomic modification</em></li>
|
||||
<li>Verify details of this modification: <code>git status</code> and <code>git diff</code>,</li>
|
||||
<li>Add some file to be versionned if necessary:<br /><code>git add [file]</code>,</li>
|
||||
<li>Save you modifications <br /><code>git commit -a -m "message"</code>,</li>
|
||||
<li>Send your modifications to others: <code>git push</code> (redo a <code>git pull</code> if push return an error).</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<p>With these few commands you can use <a href="http://git-scm.org" title="Git">Git</a>. Even if it is sufficient, you need to know one more thing before really begin ; How to manage <em>conflicts</em>.</p>
|
||||
<h3 id="conflicts-management">Conflicts management</h3>
|
||||
<p>Conflicts can arise when you change the same line of code on the same file from another branch you’re merging. It can seems a bit intimidating, but with <a href="http://git-scm.org" title="Git">Git</a> this kind of thing is really simple to handle.</p>
|
||||
<h4 id="example">example</h4>
|
||||
<p>You start from the following file</p>
|
||||
<div style="width: 18em; margin-left: auto; margin-right: auto">
|
||||
<div class="sourceCode" id="cb18"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb18-1" title="1">Zoot </a></code></pre></div>
|
||||
</div>
|
||||
<p>and you modify one line</p>
|
||||
<div style="width: 18em; margin-left: auto; margin-right: auto">
|
||||
<pre class="twilight">
|
||||
Zoot <span class="Constant"><strong>the pure</strong></span>
|
||||
</pre>
|
||||
</div>
|
||||
<p>except during this time, another user had also modified the same line and had done a <code>push</code>.</p>
|
||||
<div style="width: 18em; margin-left: auto; margin-right: auto">
|
||||
<pre class="twilight">
|
||||
Zoot<span class="StringConstant"><strong>, just Zoot</strong></span>
|
||||
</pre>
|
||||
</div>
|
||||
<p>Now when you do a:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb19"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb19-1" title="1">$ git pull</a>
|
||||
<a class="sourceLine" id="cb19-2" title="2">remote: Counting objects: 5, <span class="kw">done</span>.</a>
|
||||
<a class="sourceLine" id="cb19-3" title="3">remote: Total 3 <span class="kw">(</span>delta 0<span class="kw">)</span>, reused 0 <span class="kw">(</span>delta 0<span class="kw">)</span></a>
|
||||
<a class="sourceLine" id="cb19-4" title="4">Unpacking objects: 100% <span class="kw">(</span>3/3<span class="kw">)</span>, <span class="kw">done</span>.</a>
|
||||
<a class="sourceLine" id="cb19-5" title="5">From /home/yogsototh/tmp/conflictTest</a>
|
||||
<a class="sourceLine" id="cb19-6" title="6"> d3ea395..2dc7ffb master <span class="kw">-></span> origin/master</a>
|
||||
<a class="sourceLine" id="cb19-7" title="7">Auto-merging foo</a>
|
||||
<a class="sourceLine" id="cb19-8" title="8">CONFLICT <span class="kw">(</span>content<span class="kw">):</span> Merge conflict <span class="kw">in</span> foo</a>
|
||||
<a class="sourceLine" id="cb19-9" title="9">Automatic merge failed; fix conflicts and <span class="kw">then</span> commit the result.</a></code></pre></div>
|
||||
</div>
|
||||
<p>Our file <code>foo</code> now contains:</p>
|
||||
<div>
|
||||
<pre class="twilight">
|
||||
<<<<<<< HEAD:foo
|
||||
Zoot <span class="Constant"><strong>the pure</strong></span>
|
||||
=======
|
||||
<span>Zoot<span class="StringConstant"><strong>, just Zoot</strong></span></span>
|
||||
>>>>>>> 2dc7ffb0f186a407a1814d1a62684342cd54e7d6:foo
|
||||
</pre>
|
||||
</div>
|
||||
<h4 id="conflict-resolution">Conflict resolution</h4>
|
||||
<p>To resolve the conflict you only have to edit the file for example, writing:</p>
|
||||
<div style="width: 18em; margin-left: auto; margin-right: auto">
|
||||
<pre class="twilight">
|
||||
Zoot <span class="Constant"><strong>the not so pure</strong></span>
|
||||
</pre>
|
||||
</div>
|
||||
<p>and to commit</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb20"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb20-1" title="1">git commit -a -m <span class="st">"conflict resolved"</span></a></code></pre></div>
|
||||
</div>
|
||||
<p>Now you’re ready to use <a href="http://git-scm.org" title="Git">Git</a>. <a href="http://git-scm.org" title="Git">Git</a> provide many other functionnalities. Now we’ll see some <a href="http://git-scm.org" title="Git">Git</a> usages older CVS couldn’t handle.</p>
|
||||
<h1 id="why-git-is-cool">Why Git is cool?</h1>
|
||||
<p>Because with <a href="http://git-scm.org" title="Git">Git</a> you can work on many part of some project totally independently. This is the true efficiency of decentralisation.</p>
|
||||
<p>Each branch use the same directory. Then you can easily change your branch. You can also change branch when some files are modified. You can then dispatch your work on many different branches and merge them on one master branch at will.</p>
|
||||
<p>Using the <code>git rebase</code> you can decide which modifications should be forget or merged into only one modification.</p>
|
||||
<p>What does it mean for real usage? You can focus on coding. For example, you can code, a fix for bug b01 and for bug b02 and code a feature f03. Once finished you can create a branch by bug and by feature. And finally you can merge these modifications on a main branch.</p>
|
||||
<p>All was done to code and decide how to organize your versions after. In other VCS it is not as natural as in <a href="http://git-scm.org" title="Git">Git</a>.</p>
|
||||
<p>With <a href="http://git-scm.org" title="Git">Git</a> you can depend of many different sources. Then, there is not necessarily a ‘master’ repository where everybody puts its modifications.</p>
|
||||
<p>What changes the most with <a href="http://git-scm.org" title="Git">Git</a> when you come from SVN, it’s the idea of a centralized project on one server. With <a href="http://git-scm.org" title="Git">Git</a> many people could work on the same project but not necessarily on the same <em>repository</em> as main reference. One can easily fix a bug and send a patch to many different versions of a project.</p>
|
||||
<h1 id="command-list">Command List</h1>
|
||||
<h2 id="command-for-each-functionality">Command for each functionality</h2>
|
||||
<p>In the first part, we saw the list of resolved problem by <a href="http://git-scm.org" title="Git">Git</a>. To resume <a href="http://git-scm.org" title="Git">Git</a> should do:</p>
|
||||
<ul>
|
||||
<li>get others modifications,</li>
|
||||
<li>send modifications to others,</li>
|
||||
<li>get back in time,</li>
|
||||
<li>list differences between each version,</li>
|
||||
<li>name some versions in order to refer easily to them,</li>
|
||||
<li>write an historic of modifications,</li>
|
||||
<li>know who did what and when,</li>
|
||||
<li>manage conflicts,</li>
|
||||
<li>easily manage branches.</li>
|
||||
</ul>
|
||||
<h3 id="get-others-modifications">get others modifications</h3>
|
||||
<div class="sourceCode" id="cb21"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb21-1" title="1">$ git pull</a></code></pre></div>
|
||||
<h3 id="send-modifications-to-others">send modifications to others</h3>
|
||||
<div class="sourceCode" id="cb22"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb22-1" title="1">$ git push</a></code></pre></div>
|
||||
<p>or more generally</p>
|
||||
<div class="sourceCode" id="cb23"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb23-1" title="1">$ git pull</a>
|
||||
<a class="sourceLine" id="cb23-2" title="2">$ git push</a></code></pre></div>
|
||||
<h3 id="get-back-in-time">get back in time</h3>
|
||||
<h4 id="for-all-tree">For all tree</h4>
|
||||
<div class="sourceCode" id="cb24"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb24-1" title="1">$ git checkout</a></code></pre></div>
|
||||
<div class="sourceCode" id="cb25"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb25-1" title="1">$ git revert</a></code></pre></div>
|
||||
<p>revert three version before (see my <code>.gitconfig</code> file).</p>
|
||||
<div class="sourceCode" id="cb26"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb26-1" title="1">$ git uncommit 3</a></code></pre></div>
|
||||
<p>Undo the las merge (if something goes wrong)</p>
|
||||
<div class="sourceCode" id="cb27"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb27-1" title="1">$ git revertbeforemerge</a></code></pre></div>
|
||||
<h4 id="for-one-file">For one file</h4>
|
||||
<div class="sourceCode" id="cb28"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb28-1" title="1">$ git checkout <span class="kw">file</span></a>
|
||||
<a class="sourceLine" id="cb28-2" title="2">$ git checkout VersionHash <span class="kw">file</span></a>
|
||||
<a class="sourceLine" id="cb28-3" title="3">$ git checkout HEAD~3 <span class="kw">file</span></a></code></pre></div>
|
||||
<h3 id="list-differences-between-each-version">list differences between each version</h3>
|
||||
<p>list files being modified</p>
|
||||
<div class="sourceCode" id="cb29"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb29-1" title="1">$ git status</a></code></pre></div>
|
||||
<p>differences between last version files and local files</p>
|
||||
<div class="sourceCode" id="cb30"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb30-1" title="1">$ git <span class="kw">diff</span></a></code></pre></div>
|
||||
<p>differences between some version and local files</p>
|
||||
<div class="sourceCode" id="cb31"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb31-1" title="1">$ git <span class="kw">diff</span> VersionHash fichier</a></code></pre></div>
|
||||
<h3 id="name-some-version-to-refer-to-them-in-the-future">name some version to refer to them in the future</h3>
|
||||
<div class="sourceCode" id="cb32"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb32-1" title="1">$ git tag <span class="st">'toto'</span></a></code></pre></div>
|
||||
<h3 id="show-historic-of-modifications">show historic of modifications</h3>
|
||||
<div class="sourceCode" id="cb33"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb33-1" title="1">$ git <span class="kw">log</span></a>
|
||||
<a class="sourceLine" id="cb33-2" title="2">$ git lg</a>
|
||||
<a class="sourceLine" id="cb33-3" title="3">$ git logfull</a></code></pre></div>
|
||||
<h3 id="know-who-did-what-and-when">know who did what and when</h3>
|
||||
<div class="sourceCode" id="cb34"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb34-1" title="1">$ git blame fichier</a></code></pre></div>
|
||||
<h3 id="handle-conflicts">handle conflicts</h3>
|
||||
<div class="sourceCode" id="cb35"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb35-1" title="1">$ git conflict</a></code></pre></div>
|
||||
<h3 id="manage-branches">manage branches</h3>
|
||||
<p>To create a branch:</p>
|
||||
<div class="sourceCode" id="cb36"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb36-1" title="1">$ git branch branch_name</a></code></pre></div>
|
||||
<p>To change the current branch:</p>
|
||||
<div class="sourceCode" id="cb37"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb37-1" title="1">$ git checkout branch_name</a></code></pre></div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-11-12-Git-for-n00b/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-11-12-Git-for-n00b/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-11-12
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - iphone call filter</title>
|
||||
<meta name="keywords" content="iPhone, Apple, filter, blacklist" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-12-06-iphone-call-filter/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>iphone call filter</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>It is unbelievable you cannot filter your call with an iPhone! The only reason I see for that is a negotiation with phone operator to force users to get phone advertising. It is simple unacceptable.</p>
|
||||
<p>I’m a λ iPhone’s user. The only way to filter your call and to manage blacklist is to <em>jailbreak</em> your iPhone. And I don’t want to do that. Then, if like me you find it unacceptable, just write a line to Apple: <a href="http://www.apple.com/feedback/iphone.html">http://www.apple.com/feedback/iphone.html</a></p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-12-06-iphone-call-filter/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-12-06-iphone-call-filter/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-12-06
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[alias]
|
||||
uncommit = !zsh -c '"if (($0)); then nb=$(( $0 - 1 )); else nb=0; fi; i=0; while ((i<=nb)); do git revert -n --no-edit HEAD~$i; ((i++)); done; git commit -m \"revert to $0 version(s) back\""'
|
||||
|
|
@ -0,0 +1,167 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Git vs. Bzr</title>
|
||||
<meta name="keywords" content="git, bzr, DCVS, Bazaar" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2009-12-14-Git-vs--Bzr/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Git vs. Bzr</h1>
|
||||
<h2>Why I switched from bazaar to git</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p>Why even if I believe <code>git</code> has many bad point I believe it is the best DCVS around to work with. This is why I first tell why I prefer <a href="http://bazaar-vcs.org">Bazaar</a> over <a href="http://git-scm.org">Git</a>. Secondly I’ll talk about the only advantage of git against Bazaar which lead me to prefer it.</p>
|
||||
</div>
|
||||
<h2 id="the-dcvs-discovery">The DCVS discovery</h2>
|
||||
<p>Before beginning this article, you should know I come from <em>subversion</em>. I find subversion to be a really good CVS. But I was converted to the decentralized ones.</p>
|
||||
<p>There is two way of perceive version control system. Either you think in term of branches (see the really good article on <a href="http://betterexplained.com/articles/a-visual-guide-to-version-control/">betterexplained</a>) or think in term of patches. Another way to say that, is weather you concentrate on vertices or on transitions of the graph of possible states of your project.</p>
|
||||
<p>This is the second approach who was behind <code>git</code> and this is the first behind Bazaar. <code>git</code> was created by Linus Torvald in order to close some gap in the version system used to develop the Linux kernel. And patches is a term which is more present than ‘state’ in the development community.</p>
|
||||
<p>I first was convinced by Bazaar. Why? Argument in favor of Bazaar were: user friendly, terminology close to the subversion one. And I tried a bit the two, and it was clearly more natural for me to use Bazaar. But after seeing so many people using <code>git</code> I decided to give it a serious try.</p>
|
||||
<p>And it was so fastidious! The <code>git</code> terminology was <em>horrible</em>! And it is nothing to say it.</p>
|
||||
<h2 id="where-bazaar-is-better-than-git">Where Bazaar is better than <code>git</code></h2>
|
||||
<p>The first example, <code>checkout</code> is used to make only one thing from the technical point of vue. But from the user perspective, you make many <em>different</em> things with this word. Example:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1">git checkout pipo</a></code></pre></div>
|
||||
<p>undo the current modification of the file <code>pipo</code></p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb2-1" title="1">git checkout pipo</a></code></pre></div>
|
||||
<p>change the current branch to the branch <code>pipo</code></p>
|
||||
<p>And, like me, you remark, it is exactly the same command to make two completely different things. What occur when you have a <code>pipo</code> branch and a <code>pipo</code> file? By default, it change the current branch. In order to leave the ambiguity you have to use the following syntax:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb3-1" title="1">git checkout ./pipo</a></code></pre></div>
|
||||
<p>Yes, hum…</p>
|
||||
<p>It works, but it is clearly not really user friendly. Furthermore, checkout had a complete different signification in older CSV like <code>cvs</code> et <code>svn</code>. <code>checkout</code> was used to get a distant project locally.</p>
|
||||
<p>Bazaar terminology is far more natural, because there is no command to change the current branch as there is only one branch per directory. Changing a branch in Bazaar is changing the current directory. I also believe it is the biggest problem of Bazaar, I’ll tell you why. And to undo things in Bazaar:</p>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb4-1" title="1">bzr revert pipo</a></code></pre></div>
|
||||
<p>Furthermore, most Bazaar command take a revision number in parameter. For example, to get back 3 versions earlier, it is enough to write:</p>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb5-1" title="1">bzr revert -r -3 pipo</a></code></pre></div>
|
||||
<p>The <code>git</code> equivalent is far more cryptic:</p>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb6-1" title="1">bzr checkout HEAD~3 pipo</a></code></pre></div>
|
||||
<p>One more time, Bazaar is far more readable.</p>
|
||||
<p>Back in time for all the project:</p>
|
||||
<p>with Bazaar:</p>
|
||||
<div class="sourceCode" id="cb7"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb7-1" title="1">bzr revert -r -3 pipo</a></code></pre></div>
|
||||
<p>and with <code>git</code>? <code>git checkout</code>? Of course not! It would be too simple. What we find in the documentation (<code>man</code>) and everywhere on the net:</p>
|
||||
<div class="sourceCode" id="cb8"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb8-1" title="1">git reset --hard HEAD~3</a></code></pre></div>
|
||||
<p>Except that this command is horrible. It forget revisions! Then you must use it with prudence. And you cannot tell other people working on the project you discard some changes. If someone had pulled the <em>bad</em> version, you are <em>doomed</em>. This is why you can also use:</p>
|
||||
<div class="sourceCode" id="cb9"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb9-1" title="1">git checkout HEAD~3 -- <span class="kw">.</span> <span class="kw">&&</span> git commit -m <span class="st">'back in time'</span></a></code></pre></div>
|
||||
<p>Just to keep a backup branch. Without it we can definitively loose the current version HEAD. But some error may rest when there were some addition and deletion of files. <em>The unique way to be really clean without any risk is to use the following command:</em></p>
|
||||
<div class="sourceCode" id="cb10"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb10-1" title="1"><span class="kw">for</span> i <span class="kw">in</span> <span class="ot">$(</span><span class="kw">seq</span> 0 2<span class="ot">)</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb10-2" title="2"> git revert -n --no-edit <span class="kw">head</span>~<span class="ot">$i</span>;</a>
|
||||
<a class="sourceLine" id="cb10-3" title="3"><span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb10-4" title="4">git commit -m <span class="st">"reverted 3 versions back"</span></a></code></pre></div>
|
||||
<p>And with this command this is the only good way to undo things in a project and tell other contributor you reverted something. You simply revert version in backward order.</p>
|
||||
<p>The rule is simple: <em>NEVER use the <code>git reset</code> command on a version somebody else could have <code>fetched</code></em></p>
|
||||
<p>It was said. Discover the best method took me some time. I’d made many different tries. The safer and best way of reverting back your tree is to use this method. If you want to make it automatic just had the following alias in your <code>~/.gitconfig</code>. Of course this alias will work only on environment having <code>zsh</code> installed. Which is the cas for most UNIX (Ubuntu, Mac OS X…).</p>
|
||||
<div class="sourceCode" id="cb11"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb11-1" title="1">[alias]</a>
|
||||
<a class="sourceLine" id="cb11-2" title="2"> uncommit = !<span class="kw">zsh</span> -c <span class="st">'"if (($0)); then nb=$(( $0 - 1 )); else nb=0; fi; i=0; while ((i<=nb)); do git revert -n --no-edit HEAD~$i; ((i++)); done; git commit -m \"revert to $0 version(s) back\""'</span></a></code></pre></div>
|
||||
<h1 id="what-make-git-by-far-the-best-dcvs-today">What make <code>git</code> by far the best DCVS today</h1>
|
||||
<p>After talking about the negatives points of <code>git</code>, now it’s time to speak about the very positive feature that make <code>git</code> the best DCVS in my humble opinion.</p>
|
||||
<h2 id="cheap-branching">Cheap branching</h2>
|
||||
<p>You always work into the same main directory. For example, you can work on two fix in the same time. Say <code>fix1</code> require you to work on <code>file1</code> and <code>fix2</code> to work on <code>file2</code>. You can work in any order on <code>file1</code> and <code>file2</code> in the <code>master</code> branch. And then go to branch <code>fix1</code>, commit <code>file1</code> into it. Then go to branch <code>fix2</code> and commit <code>file2</code> into it. And finally merge the two branches <code>fix1</code> and <code>fix2</code> into <code>master</code>.</p>
|
||||
<div class="sourceCode" id="cb12"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb12-1" title="1"><span class="kw">></span> vim file1</a>
|
||||
<a class="sourceLine" id="cb12-2" title="2"><span class="kw">></span> vim file2</a>
|
||||
<a class="sourceLine" id="cb12-3" title="3"><span class="kw">></span> git br fix1</a>
|
||||
<a class="sourceLine" id="cb12-4" title="4"><span class="kw">></span> git add file1</a>
|
||||
<a class="sourceLine" id="cb12-5" title="5"><span class="kw">></span> git commit -m <span class="st">'fix1'</span></a>
|
||||
<a class="sourceLine" id="cb12-6" title="6"><span class="kw">></span> git br fix2</a>
|
||||
<a class="sourceLine" id="cb12-7" title="7"><span class="kw">></span> git add file2</a>
|
||||
<a class="sourceLine" id="cb12-8" title="8"><span class="kw">></span> git commit -m <span class="st">'fix2'</span></a>
|
||||
<a class="sourceLine" id="cb12-9" title="9"><span class="kw">></span> git commit master</a>
|
||||
<a class="sourceLine" id="cb12-10" title="10"><span class="kw">></span> git merge fix1</a>
|
||||
<a class="sourceLine" id="cb12-11" title="11"><span class="kw">></span> git merge fix2</a></code></pre></div>
|
||||
<p>And this is great not to worry about working in the <em>good</em> branch and coding in the same time. You just worry about your code and then about the versionning system.</p>
|
||||
<p>And I use this possibilities <em>a lot</em>. Working with bazaar, I often made the error to begin a change in the bad branch. then I have to copy my modifications, then revert. In short it was tiedous.</p>
|
||||
<p>This is why I prefer using <code>git</code> on an every day usage. If Bazaar implement the same way of cheap branching than git. I should switch again.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-12-14-Git-vs--Bzr/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-12-14-Git-vs--Bzr/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2009-12-14
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,109 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Change default shell on Mac OS X</title>
|
||||
<meta name="keywords" content="Apple, Mac, OS X" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-01-04-Change-default-shell-on-Mac-OS-X/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Change default shell on Mac OS X</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I just found a way to change the default shell on Mac OS X. This note is mostly for me, but somebody else should find it useful. Just launch the following command:</p>
|
||||
<div>
|
||||
<code class="zsh"> > chsh </code>
|
||||
</div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-01-04-Change-default-shell-on-Mac-OS-X/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-01-04-Change-default-shell-on-Mac-OS-X/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-01-04
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
|
||||
<?xml version="1.0"?>
|
||||
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
|
||||
<fontconfig>
|
||||
|
||||
<!-- Miscellaneous settings -->
|
||||
|
||||
<include ignore_missing="yes">misc.conf</include>
|
||||
|
||||
<!-- Define alias -->
|
||||
|
||||
<include ignore_missing="yes">alias.conf</include>
|
||||
|
||||
<!-- Rules for Microsoft fonts -->
|
||||
|
||||
<include ignore_missing="yes">msfonts-rules.conf</include>
|
||||
|
||||
<match target="pattern" name="family" >
|
||||
<test name="family" qual="any" >
|
||||
<string>Tahoma</string>
|
||||
</test>
|
||||
<edit mode="assign" name="family" >
|
||||
<string>Verdana</string>
|
||||
</edit>
|
||||
</match>
|
||||
<selectfont>
|
||||
<acceptfont>
|
||||
<pattern>
|
||||
<patelt name="family">
|
||||
<string>Lucida Grande</string>
|
||||
</patelt>
|
||||
</pattern>
|
||||
</acceptfont>
|
||||
</selectfont>
|
||||
|
||||
<match target="pattern" name="family" >
|
||||
<test name="family" qual="any" >
|
||||
<string>Georgia</string>
|
||||
</test>
|
||||
<edit mode="assign" name="family" >
|
||||
<string>Georgia</string>
|
||||
</edit>
|
||||
</match>
|
||||
<selectfont>
|
||||
<acceptfont>
|
||||
<pattern>
|
||||
<patelt name="family">
|
||||
<string>Century Schoolbook L</string>
|
||||
</patelt>
|
||||
</pattern>
|
||||
</acceptfont>
|
||||
</selectfont>
|
||||
|
||||
</fontconfig>
|
||||
|
|
@ -0,0 +1,164 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - antialias font in Firefox under Ubuntu</title>
|
||||
<meta name="keywords" content="Linux, Ubuntu, Fonts" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-01-12-antialias-font-in-Firefox-under-Ubuntu/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>antialias font in Firefox under Ubuntu</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>How to stop using bad Microsoft© font under Ubuntu Linux in order to user nice anti aliased font under Firefox.</p>
|
||||
<p>Just modify the <code>/etc/fonts/local.conf</code> with the following code:</p>
|
||||
<div>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode xml"><code class="sourceCode xml"><a class="sourceLine" id="cb1-1" title="1"></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw"><?xml</span> version="1.0"<span class="kw">?></span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="dt"><!DOCTYPE </span>fontconfig SYSTEM "fonts.dtd"<span class="dt">></span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"><span class="kw"><fontconfig></span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"><span class="co"><!-- Miscellaneous settings --></span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"><span class="kw"><include</span><span class="ot"> ignore_missing=</span><span class="st">"yes"</span><span class="kw">></span>misc.conf<span class="kw"></include></span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"><span class="co"><!-- Define alias --></span></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"></a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"><span class="kw"><include</span><span class="ot"> ignore_missing=</span><span class="st">"yes"</span><span class="kw">></span>alias.conf<span class="kw"></include></span></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"><span class="co"><!-- Rules for Microsoft fonts --></span></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"><span class="kw"><include</span><span class="ot"> ignore_missing=</span><span class="st">"yes"</span><span class="kw">></span>msfonts-rules.conf<span class="kw"></include></span></a>
|
||||
<a class="sourceLine" id="cb1-17" title="17"></a>
|
||||
<a class="sourceLine" id="cb1-18" title="18"> <span class="kw"><match</span><span class="ot"> target=</span><span class="st">"pattern"</span><span class="ot"> name=</span><span class="st">"family"</span> <span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-19" title="19"> <span class="kw"><test</span><span class="ot"> name=</span><span class="st">"family"</span><span class="ot"> qual=</span><span class="st">"any"</span> <span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-20" title="20"> <span class="kw"><string></span>Tahoma<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb1-21" title="21"> <span class="kw"></test></span></a>
|
||||
<a class="sourceLine" id="cb1-22" title="22"> <span class="kw"><edit</span><span class="ot"> mode=</span><span class="st">"assign"</span><span class="ot"> name=</span><span class="st">"family"</span> <span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-23" title="23"> <span class="kw"><string></span>Verdana<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb1-24" title="24"> <span class="kw"></edit></span></a>
|
||||
<a class="sourceLine" id="cb1-25" title="25"> <span class="kw"></match></span></a>
|
||||
<a class="sourceLine" id="cb1-26" title="26"> <span class="kw"><selectfont></span></a>
|
||||
<a class="sourceLine" id="cb1-27" title="27"> <span class="kw"><acceptfont></span></a>
|
||||
<a class="sourceLine" id="cb1-28" title="28"> <span class="kw"><pattern></span></a>
|
||||
<a class="sourceLine" id="cb1-29" title="29"> <span class="kw"><patelt</span><span class="ot"> name=</span><span class="st">"family"</span><span class="kw">></span> </a>
|
||||
<a class="sourceLine" id="cb1-30" title="30"> <span class="kw"><string></span>Lucida Grande<span class="kw"></string></span> </a>
|
||||
<a class="sourceLine" id="cb1-31" title="31"> <span class="kw"></patelt></span></a>
|
||||
<a class="sourceLine" id="cb1-32" title="32"> <span class="kw"></pattern></span></a>
|
||||
<a class="sourceLine" id="cb1-33" title="33"> <span class="kw"></acceptfont></span></a>
|
||||
<a class="sourceLine" id="cb1-34" title="34"> <span class="kw"></selectfont></span></a>
|
||||
<a class="sourceLine" id="cb1-35" title="35"></a>
|
||||
<a class="sourceLine" id="cb1-36" title="36"> <span class="kw"><match</span><span class="ot"> target=</span><span class="st">"pattern"</span><span class="ot"> name=</span><span class="st">"family"</span> <span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-37" title="37"> <span class="kw"><test</span><span class="ot"> name=</span><span class="st">"family"</span><span class="ot"> qual=</span><span class="st">"any"</span> <span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-38" title="38"> <span class="kw"><string></span>Georgia<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb1-39" title="39"> <span class="kw"></test></span></a>
|
||||
<a class="sourceLine" id="cb1-40" title="40"> <span class="kw"><edit</span><span class="ot"> mode=</span><span class="st">"assign"</span><span class="ot"> name=</span><span class="st">"family"</span> <span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-41" title="41"> <span class="kw"><string></span>Georgia<span class="kw"></string></span></a>
|
||||
<a class="sourceLine" id="cb1-42" title="42"> <span class="kw"></edit></span></a>
|
||||
<a class="sourceLine" id="cb1-43" title="43"> <span class="kw"></match></span></a>
|
||||
<a class="sourceLine" id="cb1-44" title="44"> <span class="kw"><selectfont></span></a>
|
||||
<a class="sourceLine" id="cb1-45" title="45"> <span class="kw"><acceptfont></span></a>
|
||||
<a class="sourceLine" id="cb1-46" title="46"> <span class="kw"><pattern></span></a>
|
||||
<a class="sourceLine" id="cb1-47" title="47"> <span class="kw"><patelt</span><span class="ot"> name=</span><span class="st">"family"</span><span class="kw">></span> </a>
|
||||
<a class="sourceLine" id="cb1-48" title="48"> <span class="kw"><string></span>Century Schoolbook L<span class="kw"></string></span> </a>
|
||||
<a class="sourceLine" id="cb1-49" title="49"> <span class="kw"></patelt></span></a>
|
||||
<a class="sourceLine" id="cb1-50" title="50"> <span class="kw"></pattern></span></a>
|
||||
<a class="sourceLine" id="cb1-51" title="51"> <span class="kw"></acceptfont></span></a>
|
||||
<a class="sourceLine" id="cb1-52" title="52"> <span class="kw"></selectfont></span></a>
|
||||
<a class="sourceLine" id="cb1-53" title="53"></a>
|
||||
<a class="sourceLine" id="cb1-54" title="54"><span class="kw"></fontconfig></span></a></code></pre></div>
|
||||
</div>
|
||||
<p>Hope it helped someone who like me had his eyes crying in face of such ugly fonts.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-01-12-antialias-font-in-Firefox-under-Ubuntu/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-01-12-antialias-font-in-Firefox-under-Ubuntu/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-01-12
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,136 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Pragmatic Regular Expression Exclude</title>
|
||||
<meta name="keywords" content="regex, regexp, regular expression, negate" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-02-15-All-but-something-regexp/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Pragmatic Regular Expression Exclude</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Sometimes you cannot simply write:</p>
|
||||
<div>
|
||||
<code class="ruby"> if str.match(regexp) and not str.match(other_regexp) do_something </code>
|
||||
</div>
|
||||
<p>and you have to make this behaviour with only one regular expression. But, there exists a major problem: the complementary of a regular language might not be regular. Then, for some expression it is absolutely impossible to negate a regular expression.</p>
|
||||
<p>But sometimes with some simple regular expression it should be possible<sup><a href="#note1">†</a></sup>. Say you want to match everything containing the some word say <code>bull</code> but don’t want to match <code>bullshit</code>. Here is a nice way to do that:</p>
|
||||
<div>
|
||||
<p><code class="ruby"> # match all string containing ‘bull’ (bullshit comprised) /bull/</p>
|
||||
<h1 id="match-all-string-containing-bull-except-bullshit">match all string containing ‘bull’ except ‘bullshit’</h1>
|
||||
<p>/bull([^s]|<span class="math inline">)|<em>b</em><em>u</em><em>l</em><em>l</em><em>s</em>([<sup><em>h</em></sup>]|</span>)| bullsh([^i]|<span class="math inline">)|<em>b</em><em>u</em><em>l</em><em>l</em><em>s</em><em>h</em><em>i</em>([<sup><em>t</em></sup>]|</span>)/</p>
|
||||
<h1 id="another-way-to-write-it-would-be">another way to write it would be</h1>
|
||||
/bull([^s]|<span class="math inline">|<em>s</em>([<sup><em>h</em></sup>]|</span>)|sh([^i]|<span class="math inline">)|<em>s</em><em>h</em><em>i</em>([<sup><em>t</em></sup>]|</span>))/ </code>
|
||||
</div>
|
||||
<p>Let look closer. In the first line the expression is: <code>bull([^s]|$)</code>, why does the <code>$</code> is needed? Because, without it the word <code>bull</code> would be no more matched. This expression means:</p>
|
||||
<blockquote>
|
||||
<p>The string finish by <code>bull</code><br />
|
||||
or,<br />
|
||||
contains <code>bull</code> followed by a letter different from <code>s</code>.</p>
|
||||
</blockquote>
|
||||
<p>And this is it. I hope it could help you.</p>
|
||||
Notice this method is not always the best. For example try to write a regular expression equivalent to the following conditional expression:
|
||||
<div>
|
||||
<code class="ruby"> # Begin with ‘a’: ^a # End with ‘a’: c$ # Contain ‘b’: .<em>b.</em> # But isn’t ‘axbxc’ if str.match(/^a.<em>b.</em>c<span class="math inline">/)<em>a</em><em>n</em><em>d</em><em>n</em><em>o</em><em>t</em><em>s</em><em>t</em><em>r</em>.<em>m</em><em>a</em><em>t</em><em>c</em><em>h</em>(/<sup><em>a</em></sup><em>x</em><em>b</em><em>x</em><em>c</em></span>/) do_something end </code>
|
||||
</div>
|
||||
<p>A nice solution is:</p>
|
||||
<div>
|
||||
<code class="ruby"> /abc| # length 3 a.bc| # length 4 ab.c| a[^x]b[^x]c| # length 5 a…<em>b.</em>c| # length >5 a.<em>b…</em>c/ </code>
|
||||
</div>
|
||||
<p>This solution uses the maximal length of the string not to be matched. There certainly exists many other methods. But the important lesson is it is not straightforward to exclude something of a regular expression.</p>
|
||||
<hr />
|
||||
<p><small><a name="note1">†</a> It can be proved that any regular set minus a finite set is also regular. </small></p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-15-All-but-something-regexp/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-15-All-but-something-regexp/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-02-15
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,161 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Pragmatic Regular Expression Exclude (2)</title>
|
||||
<meta name="keywords" content="regexp, regular expression" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-02-16-All-but-something-regexp--2-/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Pragmatic Regular Expression Exclude (2)</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>In my <a href="../../../../Scratch/en/blog/2010-02-15-All-but-something-regexp">previous post</a> I had given some trick to match all except something. On the same idea, the trick to match the smallest possible string. Say you want to match the string between ‘a’ and ‘b’, for example, you want to match:</p>
|
||||
<pre>
|
||||
a.....<strong class="blue">a......b</strong>..b..a....<strong class="blue">a....b</strong>...
|
||||
</pre>
|
||||
<p>Here are two common errors and a solution:</p>
|
||||
<pre>
|
||||
/a.*b/
|
||||
<strong class="red">a.....a......b..b..a....a....b</strong>...
|
||||
</pre>
|
||||
<p>The first error is to use the <em>evil</em> <code>.*</code>. Because you will match from the first to the last.</p>
|
||||
<pre>
|
||||
/a.*?b/
|
||||
<strong class="red">a.....a......b</strong>..b..<strong class="red">a....a....b</strong>...
|
||||
</pre>
|
||||
<p>The next natural way, is to change the <em>greediness</em>. But it is not enough as you will match from the first <code>a</code> to the first <code>b</code>. Then a simple constatation is that our matching string shouldn’t contain any <code>a</code> nor <code>b</code>. Which lead to the last elegant solution.</p>
|
||||
<pre>
|
||||
/a[^ab]*b/
|
||||
a.....<strong class="blue">a......b</strong>..b..a....<strong class="blue">a....b</strong>...
|
||||
</pre>
|
||||
<p>Until now, that was, easy. Now, just pass at the case you need to match not between <code>a</code> and <code>b</code>, but between strings. For example:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1"><span class="kw"><li></span>...<span class="kw"><li></span></a></code></pre></div>
|
||||
<p>This is a bit difficult. You need to match</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><li></span>[anything not containing <span class="kw"><li></span>]<span class="kw"></li></span></a></code></pre></div>
|
||||
<p>The first method would be to use the same reasoning as in my <a href="../../../../Scratch/en/blog/2010-02-15-All-but-something-regexp">previous post</a>. Here is a first try:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode perl"><code class="sourceCode perl"><a class="sourceLine" id="cb3-1" title="1"><li>([^<]|<[^l]|<l[^i]|<li[^>])<span class="dt">*<</span><span class="kw">/</span><span class="ot">li></span></a></code></pre></div>
|
||||
<p>But what about the following string:</p>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb4-1" title="1"><span class="kw"><li></span>...<span class="kw"><li</span><span class="er"></li</span><span class="kw">></span></a></code></pre></div>
|
||||
<p>That string should not match. This is why if we really want to match it correctly<sup><a href="#note1">†</a></sup> we need to add:</p>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode perl"><code class="sourceCode perl"><a class="sourceLine" id="cb5-1" title="1"><li>([^<]|<[^l]|<l[^i]|<li[^>])*(|<|<l|<li)</li></a></code></pre></div>
|
||||
<p>Yes a bit complicated. But what if the string I wanted to match was even longer?</p>
|
||||
<p>Here is the algorithm way to handle this easily. You reduce the problem to the first one letter matching:</p>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode perl"><code class="sourceCode perl"><a class="sourceLine" id="cb6-1" title="1"><span class="co"># transform a simple randomly choosen character</span></a>
|
||||
<a class="sourceLine" id="cb6-2" title="2"><span class="co"># to an unique ID</span></a>
|
||||
<a class="sourceLine" id="cb6-3" title="3"><span class="co"># (you should verify the identifier is REALLY unique)</span></a>
|
||||
<a class="sourceLine" id="cb6-4" title="4"><span class="co"># beware the unique ID must not contain the</span></a>
|
||||
<a class="sourceLine" id="cb6-5" title="5"><span class="co"># choosen character</span></a>
|
||||
<a class="sourceLine" id="cb6-6" title="6"><span class="kw">s/</span><span class="ot">X</span><span class="kw">/</span><span class="st">_was_x_</span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-7" title="7"><span class="kw">s/</span><span class="ot">Y</span><span class="kw">/</span><span class="st">_was_y_</span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-8" title="8"></a>
|
||||
<a class="sourceLine" id="cb6-9" title="9"><span class="co"># transform the long string in this simple character</span></a>
|
||||
<a class="sourceLine" id="cb6-10" title="10"><span class="kw">s/</span><span class="ot"><li></span><span class="kw">/</span><span class="st">X</span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-11" title="11"><span class="kw">s/</span><span class="ot"><\/li></span><span class="kw">/</span><span class="st">Y</span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-12" title="12"></a>
|
||||
<a class="sourceLine" id="cb6-13" title="13"><span class="co"># use the first method</span></a>
|
||||
<a class="sourceLine" id="cb6-14" title="14"><span class="kw">s/</span><span class="ot">X</span><span class="ch">([^</span><span class="bn">X</span><span class="ch">]*)</span><span class="ot">Y</span><span class="kw">//g</span></a>
|
||||
<a class="sourceLine" id="cb6-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb6-16" title="16"><span class="co"># retransform choosen letter by string</span></a>
|
||||
<a class="sourceLine" id="cb6-17" title="17"><span class="kw">s/</span><span class="ot">X</span><span class="kw">/</span><span class="st"><li></span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-18" title="18"><span class="kw">s/</span><span class="ot">Y</span><span class="kw">/</span><span class="st"><\/li></span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-19" title="19"></a>
|
||||
<a class="sourceLine" id="cb6-20" title="20"><span class="co"># retransform the choosen character back</span></a>
|
||||
<a class="sourceLine" id="cb6-21" title="21"><span class="kw">s/</span><span class="ot">_was_x_</span><span class="kw">/</span><span class="st">X</span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb6-22" title="22"><span class="kw">s/</span><span class="ot">_was_y_</span><span class="kw">/</span><span class="st">Y</span><span class="kw">/g</span></a></code></pre></div>
|
||||
<p>And it works in only 9 lines for any beginning and ending string. This solution should look less <em>I AM THE GREAT REGEXP M45T3R, URAN00B</em>, but is more convenient in my humble opinion. Further more, using this last solution prove you master regexp, because you know it is difficult to manage such problems with only a regexp.</p>
|
||||
<hr />
|
||||
<p><small><a name="note1"><sup>†</sup></a> I know I used an HTML syntax example, but in my real life usage, I needed to match between <code>en:</code> and <code>::</code>. And sometimes the string could finish with <code>e::</code>.</small></p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-16-All-but-something-regexp--2-/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-16-All-but-something-regexp--2-/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-02-16
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,117 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - split a file by keyword</title>
|
||||
<meta name="keywords" content="awk, shell, script" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-02-18-split-a-file-by-keyword/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>split a file by keyword</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Strangely enough, I didn’t find any built-in tool to split a file by keyword. I made one myself in <code>awk</code>. I put it here mostly for myself. But it could also helps someone else. The following code split a file for each line containing the word <code>UTC</code>.</p>
|
||||
<div>
|
||||
<code class="perl"> #!/usr/bin/env awk BEGIN{i=0;} /UTC/ { i+=1; FIC=sprintf(“fic.%03d”,i); } {print $0>>FIC} </code>
|
||||
</div>
|
||||
<p>In my real world example, I wanted one file per day, each line containing UTC being in the following format:</p>
|
||||
<pre class="twilight">
|
||||
Mon Dec 7 10:32:30 UTC 2009
|
||||
</pre>
|
||||
<p>I then finished with the following code:</p>
|
||||
<div>
|
||||
<code class="perl"> #!/usr/bin/env awk BEGIN{i=0;} /UTC/ { date=$1$2$3; if ( date != olddate ) { olddate=date; i+=1; FIC=sprintf(“fic.%03d”,i); } } {print $0>>FIC} </code>
|
||||
</div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-18-split-a-file-by-keyword/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-18-split-a-file-by-keyword/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-02-18
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
#!/usr/bin/env ruby
|
||||
require 'benchmark'
|
||||
n=80000
|
||||
tab=[ '/accounts/user.json',
|
||||
'/accounts/user.xml',
|
||||
'/user/titi/blog/toto.json',
|
||||
'/user/titi/blog/toto.xml' ]
|
||||
|
||||
puts "Get extname"
|
||||
Benchmark.bm do |x|
|
||||
x.report("regexp:") { n.times do
|
||||
str=tab[rand(4)];
|
||||
str.match(/[^.]*$/);
|
||||
ext=$&;
|
||||
end }
|
||||
x.report(" split:") { n.times do
|
||||
str=tab[rand(4)];
|
||||
ext=str.split('.')[-1] ;
|
||||
end }
|
||||
x.report(" File:") { n.times do
|
||||
str=tab[rand(4)];
|
||||
ext=File.extname(str);
|
||||
end }
|
||||
end
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
#!/usr/bin/env ruby
|
||||
require 'benchmark'
|
||||
n=80000
|
||||
tab=[ '/accounts/user.json',
|
||||
'/accounts/user.xml',
|
||||
'/user/titi/blog/toto.json',
|
||||
'/user/titi/blog/toto.xml' ]
|
||||
|
||||
puts "remove extension"
|
||||
Benchmark.bm do |x|
|
||||
x.report(" File:") { n.times do
|
||||
str=tab[rand(4)];
|
||||
path=File.expand_path(str,File.basename(str,File.extname(str)));
|
||||
end }
|
||||
x.report("chomp:") { n.times do
|
||||
str=tab[rand(4)];
|
||||
ext=File.extname(str);
|
||||
path=str.chomp(ext);
|
||||
end }
|
||||
end
|
||||
|
|
@ -0,0 +1,142 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - When regexp is not the best solution</title>
|
||||
<meta name="keywords" content="programming, regexp, regular expression, extension, file" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-02-23-When-regexp-is-not-the-best-solution/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>When regexp is not the best solution</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Regular expression are really useful. Unfortunately, they are not always the best way of doing things. Particularly when transformations you want to make are easy.</p>
|
||||
<p>I wanted to know how to get file extension from filename the fastest way possible. There is 3 natural way of doing this:</p>
|
||||
<div>
|
||||
<p><code class="ruby"> # regexp str.match(/[^.]*<span class="math inline">/); <em>e</em><em>x</em><em>t</em>=</span>&</p>
|
||||
<h1 id="split">split</h1>
|
||||
<p>ext=str.split(‘.’)[-1]</p>
|
||||
<h1 id="file-module">File module</h1>
|
||||
ext=File.extname(str) </code>
|
||||
</div>
|
||||
<p>At first sight I believed that the regexp should be faster than the split because it could be many <code>.</code> in a filename. But in reality, most of time there is only one dot and I realized the split will be faster. But not the fastest way. There is a function dedicated to this work in the <code>File</code> module.</p>
|
||||
<p>Here is the Benchmark ruby code:</p>
|
||||
<div>
|
||||
<p><code class="ruby" file="regex_benchmark_ext.rb"> #!/usr/bin/env ruby require ‘benchmark’ n=80000 tab=[ ‘/accounts/user.json’, ‘/accounts/user.xml’, ‘/user/titi/blog/toto.json’, ‘/user/titi/blog/toto.xml’ ]</p>
|
||||
puts “Get extname” Benchmark.bm do |x| x.report(“regexp:”) { n.times do str=tab[rand(4)]; str.match(/[^.]*<span class="math inline">/); <em>e</em><em>x</em><em>t</em>=</span>&; end } x.report(" split:“) { n.times do str=tab[rand(4)]; ext=str.split(‘.’)[-1] ; end } x.report(” File:") { n.times do str=tab[rand(4)]; ext=File.extname(str); end } end </code>
|
||||
</div>
|
||||
<p>And here is the result</p>
|
||||
<pre class="twilight">
|
||||
Get extname
|
||||
user system total real
|
||||
regexp: 2.550000 0.020000 2.570000 ( 2.693407)
|
||||
split: 1.080000 0.050000 1.130000 ( 1.190408)
|
||||
File: 0.640000 0.030000 0.670000 ( 0.717748)
|
||||
</pre>
|
||||
<p>Conclusion of this benchmark, dedicated function are better than your way of doing stuff (most of time).</p>
|
||||
<h2 id="file-path-without-the-extension.">file path without the extension.</h2>
|
||||
<div>
|
||||
<p><code class="ruby" file="regex_benchmark_strip.rb"> #!/usr/bin/env ruby require ‘benchmark’ n=80000 tab=[ ‘/accounts/user.json’, ‘/accounts/user.xml’, ‘/user/titi/blog/toto.json’, ‘/user/titi/blog/toto.xml’ ]</p>
|
||||
puts “remove extension” Benchmark.bm do |x| x.report(" File:“) { n.times do str=tab[rand(4)]; path=File.expand_path(str,File.basename(str,File.extname(str))); end } x.report(”chomp:") { n.times do str=tab[rand(4)]; ext=File.extname(str); path=str.chomp(ext); end } end </code>
|
||||
</div>
|
||||
<p>and here is the result:</p>
|
||||
<pre class="twilight">
|
||||
remove extension
|
||||
user system total real
|
||||
File: 0.970000 0.060000 1.030000 ( 1.081398)
|
||||
chomp: 0.820000 0.040000 0.860000 ( 0.947432)
|
||||
</pre>
|
||||
<p>Conclusion of the second benchmark. One simple function is better than three dedicated functions. No surprise, but it is good to know.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-23-When-regexp-is-not-the-best-solution/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-02-23-When-regexp-is-not-the-best-solution/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-02-23
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Git Tips</title>
|
||||
<meta name="keywords" content="git, tip" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-03-22-Git-Tips/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Git Tips</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h2 id="clone-from-github-behind-an-evil-firewall">clone from github behind an evil firewall</h2>
|
||||
<p>Standard:</p>
|
||||
<div>
|
||||
<code class="zsh"> git clone git@github.com:yogsototh/project.git </code>
|
||||
</div>
|
||||
<p>Using HTTPS port:</p>
|
||||
<div>
|
||||
<code class="zsh"> git clone git+ssh://git@github.com:443/yogsototh/project.git </code>
|
||||
</div>
|
||||
<h2 id="clone-all-branches">clone all branches</h2>
|
||||
<p><code>git clone</code> can only fetch the master branch.</p>
|
||||
<p>If you don’t have much branches, you can simply use clone your project and then use the following command:</p>
|
||||
<div>
|
||||
<code class="zsh"> git branch –track local_branch remote_branch </code>
|
||||
</div>
|
||||
for example:
|
||||
<div>
|
||||
<code class="zsh"> $ git clone git@github:yogsototh/example.git $ git branch master <em> $ git branch -a master </em> remotes/origin/HEAD -> origin/master remotes/origin/experimental $ git branch –track experimental remotes/origin/experimental $ git branch master * experimental </code>
|
||||
</div>
|
||||
<p>If you have many branches it can be useful to use the following <em>script</em>/<em>long command line</em>.</p>
|
||||
<div>
|
||||
<p><code class="zsh"> # first clone your project $ git clone git@github.com:yogsototh/project.git</p>
|
||||
<h1 id="copy-all-branches">copy all branches</h1>
|
||||
$ zsh $ cd project $ for br in $( git br -a ); do case $br in remotes/<em>) print $br ; case ${br:t} in master|HEAD) continue ;; </em>) git branch –track ${br:t} $br ;; esac ;; esac done </code>
|
||||
</div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-03-22-Git-Tips/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-03-22-Git-Tips/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-03-22
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,102 @@
|
|||
#!/usr/bin/env ruby
|
||||
# encoding: utf-8
|
||||
|
||||
# architecture
|
||||
#
|
||||
# master <-> dev
|
||||
# master -> client
|
||||
# clien -> clientA | clientB
|
||||
#
|
||||
# merge using two of these branches should be
|
||||
# restricted to these rules
|
||||
# merge to one of these branch and an unknown one should
|
||||
# raise a warning, and may the option to add this new branch
|
||||
# to the hierarchy
|
||||
|
||||
$architecture={
|
||||
:master => [ :dev, :client ],
|
||||
:dev => [ :master ],
|
||||
:client => [ :clientA, :clientB ] }
|
||||
|
||||
def get_current_branch()
|
||||
(`git branch --no-color | awk '$1 == "*" {print $2}'`).chop.intern
|
||||
end
|
||||
|
||||
if ARGV.length == 0
|
||||
puts %{usage: $0:t [git_command or local_command]
|
||||
|
||||
local commands:
|
||||
allmerges: merge from top to down}
|
||||
exit 0
|
||||
end
|
||||
|
||||
require 'set'
|
||||
$known_branches=Set.new
|
||||
$architecture.each do |k,v|
|
||||
$known_branches.add(k)
|
||||
v.each { |b| $known_branches.add(b) }
|
||||
end
|
||||
|
||||
def rec_merge(branch)
|
||||
if $architecture[branch].nil?
|
||||
return
|
||||
end
|
||||
$architecture[branch].each do |b|
|
||||
if $flag.has_key?(b.to_s + branch.to_s)
|
||||
next
|
||||
end
|
||||
flagname=branch.to_s + b.to_s
|
||||
if $flag.has_key?(flagname)
|
||||
next
|
||||
end
|
||||
if system %{eng checkout #{b}}
|
||||
if get_current_branch != b
|
||||
puts "Can't checkout to #{b}"
|
||||
exit 2
|
||||
end
|
||||
if system %{eng merge #{branch}}
|
||||
$flag[flagname]=true
|
||||
rec_merge(b)
|
||||
else
|
||||
exit 1
|
||||
end
|
||||
else
|
||||
exit 1
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
def do_all_merges
|
||||
puts 'Will merge from father to sons'
|
||||
current_branch=get_current_branch
|
||||
$flag={}
|
||||
rec_merge(:master)
|
||||
system %{git co #{current_branch}}
|
||||
end
|
||||
|
||||
def do_merge
|
||||
current_branch=get_current_branch
|
||||
src_branch=ARGV[1].intern
|
||||
puts %{do_merge: #{src_branch} => #{current_branch}}
|
||||
if $known_branches.include?(current_branch)
|
||||
if $known_branches.include?(src_branch)
|
||||
if $architecture.has_key?(src_branch) and
|
||||
$architecture[src_branch].include?(current_branch)
|
||||
system %{git merge #{src_branch}}
|
||||
else
|
||||
puts %{Forbidden merge: #{src_branch} => #{current_branch}}
|
||||
end
|
||||
else
|
||||
puts %{Warning! #{src_branch} not mentionned in rb configuration}
|
||||
sleep 2
|
||||
system %{git merge #{src_branch}}
|
||||
puts %{Warning! #{src_branch} not mentionned in rb configuration}
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
case ARGV[0]
|
||||
when 'allmerges' then do_all_merges
|
||||
when 'merge' then do_merge
|
||||
else system %{git #{ARGV.join(' ')}}
|
||||
end
|
||||
|
|
@ -0,0 +1,158 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Encapsulate git</title>
|
||||
<meta name="keywords" content="git, protection, branches, diverged" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-03-23-Encapsulate-git/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Encapsulate git</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p>Here is a solution to maintain divergent branches in git. Because it is easy to merge by mistake. I give a script that encapsulate git in order to forbid some merge and warn you some merge should be dangerous.</p>
|
||||
</div>
|
||||
<h2 id="how-to-protect-against-your-own-dumb">how to protect against your own dumb</h2>
|
||||
<p>I work on a project in which some of my git branches should remain divergent. And divergences should grow.</p>
|
||||
<p>I also use some branch to contain what is common between projects.</p>
|
||||
<p>Say I have some branches:</p>
|
||||
<p>master: common to all branches dev: branch devoted to unstable development client: branch with features for all client but not general enough for master clientA: project adapted for client A clientB: project adapted for client B</p>
|
||||
<p>Here how I want to work:</p>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-03-23-Encapsulate-git/dynamic_branching.png" alt="Dynamic branching" />
|
||||
</div>
|
||||
<p>And more precisely the branch hierarchy:</p>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-03-23-Encapsulate-git/branch_hierarchy.png" alt="Branch hierarchy" />
|
||||
</div>
|
||||
<p>An arrow from A to B means, you can merge A in B. If there is no arrow from A to B that means it is <em>forbidden</em> to merge A in B. Here is the corresponding rubycode:</p>
|
||||
<div>
|
||||
<code class="ruby"> $architecture={ :master => [ :dev, :client ], :dev => [ :master ], :client => [ :clientA, :clientB ] } </code>
|
||||
</div>
|
||||
<p>Having a <code>:master => [ :dev, :client ]</code> means you can merge <code>master</code> branch into <code>dev</code> and <code>client</code>.</p>
|
||||
<p>If by mistake I make a <code>git checkout master && git merge clientA</code>, I made a mistake. This is why I made a script which encapsulate the git behaviour to dodge this kind of mistake.</p>
|
||||
<p>But this script do far more than that. It also merge from top to down. The action <code>allmerges</code> will do:</p>
|
||||
<div>
|
||||
<code class="zsh"> git co dev && git merge master git co client && git merge master git co clientA && git merge client git co clientB && git merge client </code>
|
||||
</div>
|
||||
<p>That means, I can update all branches. The algorithm will not make loop even if there is a cycle in the branch hierarchy.</p>
|
||||
<p>Here it is:</p>
|
||||
<div class="small">
|
||||
<p><code class="ruby" file="eng"> #!/usr/bin/env ruby # encoding: utf-8</p>
|
||||
<h1 id="architecture">architecture</h1>
|
||||
<h1 id="section"></h1>
|
||||
<h1 id="master---dev">master <-> dev</h1>
|
||||
<h1 id="master---client">master -> client</h1>
|
||||
<h1 id="clien---clienta-clientb">clien -> clientA | clientB</h1>
|
||||
<h1 id="section-1"></h1>
|
||||
<h1 id="merge-using-two-of-these-branches-should-be">merge using two of these branches should be</h1>
|
||||
<h1 id="restricted-to-these-rules">restricted to these rules</h1>
|
||||
<h1 id="merge-to-one-of-these-branch-and-an-unknown-one-should">merge to one of these branch and an unknown one should</h1>
|
||||
<h1 id="raise-a-warning-and-may-the-option-to-add-this-new-branch">raise a warning, and may the option to add this new branch</h1>
|
||||
<h1 id="to-the-hierarchy">to the hierarchy</h1>
|
||||
<p>$architecture={ :master => [ :dev, :client ], :dev => [ :master ], :client => [ :clientA, :clientB ] }</p>
|
||||
<p>def get_current_branch() (<code>git branch --no-color | awk '$1 == "*" {print $2}'</code>).chop.intern end</p>
|
||||
<p>if ARGV.length == 0 puts %{usage: $0:t [git_command or local_command]</p>
|
||||
<p>local commands: allmerges: merge from top to down} exit 0 end</p>
|
||||
<p>require ‘set’ $known_branches=Set.new $architecture.each do |k,v| $known_branches.add(k) v.each { |b| $known_branches.add(b) } end</p>
|
||||
<p>def rec_merge(branch) if $architecture[branch].nil? return end $architecture[branch].each do |b| if $flag.has_key?(b.to_s + branch.to_s) next end flagname=branch.to_s + b.to_s if $flag.has_key?(flagname) next end if system %{eng checkout #{b}} if get_current_branch != b puts “Can’t checkout to #{b}” exit 2 end if system %{eng merge #{branch}} $flag[flagname]=true rec_merge(b) else exit 1 end else exit 1 end end end</p>
|
||||
<p>def do_all_merges puts ‘Will merge from father to sons’ current_branch=get_current_branch $flag={} rec_merge(:master) system %{git co #{current_branch}} end</p>
|
||||
<p>def do_merge current_branch=get_current_branch src_branch=ARGV[1].intern puts %{do_merge: #{src_branch} => #{current_branch}} if $known_branches.include?(current_branch) if $known_branches.include?(src_branch) if $architecture.has_key?(src_branch) and $architecture[src_branch].include?(current_branch) system %{git merge #{src_branch}} else puts %{Forbidden merge: #{src_branch} => #{current_branch}} end else puts %{Warning! #{src_branch} not mentionned in rb configuration} sleep 2 system %{git merge #{src_branch}} puts %{Warning! #{src_branch} not mentionned in rb configuration} end end end</p>
|
||||
case ARGV[0] when ‘allmerges’ then do_all_merges when ‘merge’ then do_merge else system %{git #{ARGV.join(’ ’)}} end </code>
|
||||
</div>
|
||||
<p>All you need to do to make it work is simply to copy eng in a directory contained in your PATH.</p>
|
||||
<p>Of course try to use as few as possible <code>cherry-pick</code> and <code>rebase</code>. This script was intended to work with workflow using <code>pull</code> and <code>merge</code>.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-03-23-Encapsulate-git/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-03-23-Encapsulate-git/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-03-23
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,127 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - I live again!</title>
|
||||
<meta name="keywords" content="blog" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-05-17-at-least-this-blog-revive/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>I live again!</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Hi all!</p>
|
||||
<blockquote>
|
||||
<p>The more you wait to do something, the more difficult it is to start doing it. {: cite=“http://www.madore.org/~david/weblog/2010-05.html#d.2010-05-12.1752” }</p>
|
||||
</blockquote>
|
||||
<p>I had to write another post for this blog. I had added many article idea in my todolist. But, I made many other things, and I’ve always said (until now), I’ll do this later. What changed my mind is the haunt of this simple remark about how to be productive in programming. > Stop write <code>TODO</code> in your code and make it now!<br />
|
||||
> You’ll be surprised by the results.</p>
|
||||
<p>In short: > <strong>Just do it!</strong> ou <strong>Juste fait le</strong> comme auraient dit les nuls.</p>
|
||||
<p>Finally I’ll certainly write blog post more often for a short period of time.</p>
|
||||
<h3 id="what-did-i-do">What did I do?</h3>
|
||||
<p>I finished some web services/application for <a href="http://www.gridpocket.com">gridpocket(c)</a>.</p>
|
||||
<p>I also finished to update my blog engine to nanoc3. The difficult part was to handle nicely multiple languages. But I should detail why in a future post.</p>
|
||||
<p>I also have a <em>real</em> life. I enjoyed some vacancies with my family.</p>
|
||||
<p>I work with <a href="http://www.lucarea.net">Luc</a> on a simple ruby REST/JSON/API oriented framework. It works fairly well, with really few bug until now. We planify to make a simple todolist tutorial. May be in two to three blog posts. This framework is not public for now. It will certainly be after we’ll create some simple web service with it and made a nice website for it.</p>
|
||||
<p>Then what I plan to do from now:</p>
|
||||
<ul>
|
||||
<li>finish to make a public web service (I believe it can be popular)</li>
|
||||
<li>finish to write the associated iPhone application for it</li>
|
||||
<li>finish to publish our private framework to make web services</li>
|
||||
<li>publish some articles about this blog (at least 3)</li>
|
||||
<li>provide the sources of this website on <a href="http://github.com">github</a></li>
|
||||
</ul>
|
||||
<p>There is some random in some of these achivement mostly because they don’t depend totally on me.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-05-17-at-least-this-blog-revive/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-05-17-at-least-this-blog-revive/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-05-17
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
# repair cutted XML code by closing the tags
|
||||
# work even if the XML is cut into a tag.
|
||||
# example:
|
||||
# transform '<div> <span> toto </span> <p> hello <a href="http://tur'
|
||||
# into '<div> <span> toto </span> <p> hello </p></div>'
|
||||
def repair_xml( xml )
|
||||
parents=[]
|
||||
depth=0
|
||||
xml.scan( %r{<(/?)(\w*)[^>]*(/?)>} ).each do |m|
|
||||
if m[2] == "/"
|
||||
next
|
||||
end
|
||||
if m[0] == ""
|
||||
parents[depth]=m[1]
|
||||
depth+=1
|
||||
else
|
||||
depth-=1
|
||||
end
|
||||
end
|
||||
res=xml.sub(/<[^>]*$/m,'')
|
||||
depth-=1
|
||||
depth.downto(0).each { |x| res<<= %{</#{parents[x]}>} }
|
||||
res
|
||||
end
|
||||
|
|
@ -0,0 +1,172 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - How to repair a cutted XML?</title>
|
||||
<meta name="keywords" content="tree, HTML, script, ruby" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-05-19-How-to-cut-HTML-and-repair-it/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>How to repair a cutted XML?</h1>
|
||||
<h2>and how to do it without any parsor?</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>For my main page, you can see, a list of my latest blog entry. And you have the first part of each article. To accomplish that, I needed to include the begining of the entry and to cut it somewhere. But now, I had to repair this cutted HTML.</p>
|
||||
<p>Here is an example:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1"><span class="kw"><div</span><span class="ot"> class=</span><span class="st">"corps"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="kw"><div</span><span class="ot"> class=</span><span class="st">"intro"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="kw"><p></span>Introduction<span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="kw"></div></span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="kw"><p></span>The first paragraph<span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="kw"><img</span><span class="ot"> src=</span><span class="st">"/img/img.png"</span><span class="ot"> alt=</span><span class="st">"an image"</span><span class="kw">/></span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="kw"><p></span>Another long paragraph<span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"><span class="kw"></div></span></a></code></pre></div>
|
||||
<p>After the cut, I obtain:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><div</span><span class="ot"> class=</span><span class="st">"corps"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="kw"><div</span><span class="ot"> class=</span><span class="st">"intro"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="kw"><p></span>Introduction<span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> <span class="kw"></div></span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw"><p></span>The first paragraph<span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw"><img</span><span class="ot"> src=</span><span class="st">"/img/im</span></a></code></pre></div>
|
||||
<p>Argh! In the middle of an <code><img></code> tag.</p>
|
||||
<p>In fact, it is not as difficult as it should sound first. The secret is, you don’t need to keep the complete tree structure to repair it, but only the list of not closed parents.</p>
|
||||
<p>Given with our example, when we are after the first paragraph. we only have to close the <code>div</code> for class <code>corps</code> and the XML is repaired. Of course, when you cut inside a tag, you sould go back, as if you where just before it. Delete this tag and all is ok.</p>
|
||||
<p>Then, all you have to do, is not remember all the XML tree, but only the heap containing your parents. Suppose we treat the complete first example, the stack will pass through the following state, in order:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb3-1" title="1">[] </a>
|
||||
<a class="sourceLine" id="cb3-2" title="2">[div] <span class="kw"><div</span><span class="ot"> class=</span><span class="st">"corps"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3">[div, div] <span class="kw"><div</span><span class="ot"> class=</span><span class="st">"intro"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4">[div, div, p] <span class="kw"><p></span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"> Introduction</a>
|
||||
<a class="sourceLine" id="cb3-6" title="6">[div, div] <span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb3-7" title="7">[div] <span class="kw"></div></span></a>
|
||||
<a class="sourceLine" id="cb3-8" title="8">[div, p] <span class="kw"><p></span></a>
|
||||
<a class="sourceLine" id="cb3-9" title="9"> The first paragraph</a>
|
||||
<a class="sourceLine" id="cb3-10" title="10">[div] <span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb3-11" title="11">[div] <span class="kw"><img</span><span class="ot"> src=</span><span class="st">"/img/img.png"</span><span class="ot"> alt=</span><span class="st">"an image"</span><span class="kw">/></span></a>
|
||||
<a class="sourceLine" id="cb3-12" title="12">[div, p] <span class="kw"><p></span></a>
|
||||
<a class="sourceLine" id="cb3-13" title="13"> Another long paragraph</a>
|
||||
<a class="sourceLine" id="cb3-14" title="14">[div] <span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb3-15" title="15">[] <span class="kw"></div></span></a></code></pre></div>
|
||||
<p>The algorihm, is then really simple: ~~~~~~ {.html} let res be the XML as a string ; read res and each time you encouter a tag: if it is an opening one: push it to the stack else if it is a closing one: pop the stack.</p>
|
||||
<p>remove any malformed/cutted tag in the end of res for each tag in the stack, pop it, and write: res = res + closed tag</p>
|
||||
<p>return res ~~~~~~</p>
|
||||
<p>And <code>res</code> contain the repaired XML.</p>
|
||||
<p>Finally, this is the code in ruby I use. The <code>xml</code> variable contain the cutted XML.</p>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb4-1" title="1"><span class="co"># repair cutted XML code by closing the tags</span></a>
|
||||
<a class="sourceLine" id="cb4-2" title="2"><span class="co"># work even if the XML is cut into a tag.</span></a>
|
||||
<a class="sourceLine" id="cb4-3" title="3"><span class="co"># example:</span></a>
|
||||
<a class="sourceLine" id="cb4-4" title="4"><span class="co"># transform '<div> <span> toto </span> <p> hello <a href="http://tur'</span></a>
|
||||
<a class="sourceLine" id="cb4-5" title="5"><span class="co"># into '<div> <span> toto </span> <p> hello </p></div>'</span></a>
|
||||
<a class="sourceLine" id="cb4-6" title="6"><span class="kw">def</span> repair_xml( xml )</a>
|
||||
<a class="sourceLine" id="cb4-7" title="7"> parents=[]</a>
|
||||
<a class="sourceLine" id="cb4-8" title="8"> depth=<span class="dv">0</span></a>
|
||||
<a class="sourceLine" id="cb4-9" title="9"> xml.scan(<span class="ot"> %r{<(/?)(\w*)[^>]*(/?)>}</span> ).each <span class="kw">do</span> |m|</a>
|
||||
<a class="sourceLine" id="cb4-10" title="10"> <span class="kw">if</span> m[<span class="dv">2</span>] == <span class="st">"/"</span></a>
|
||||
<a class="sourceLine" id="cb4-11" title="11"> <span class="kw">next</span></a>
|
||||
<a class="sourceLine" id="cb4-12" title="12"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb4-13" title="13"> <span class="kw">if</span> m[<span class="dv">0</span>] == <span class="st">""</span> </a>
|
||||
<a class="sourceLine" id="cb4-14" title="14"> parents[depth]=m[<span class="dv">1</span>]</a>
|
||||
<a class="sourceLine" id="cb4-15" title="15"> depth+=<span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb4-16" title="16"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb4-17" title="17"> depth-=<span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb4-18" title="18"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb4-19" title="19"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb4-20" title="20"> res=xml.sub(<span class="ot">/<[^>]*$/m</span>,<span class="st">''</span>)</a>
|
||||
<a class="sourceLine" id="cb4-21" title="21"> depth-=<span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb4-22" title="22"> depth.downto(<span class="dv">0</span>).each { |x| res<<=<span class="ot"> %{</span><span class="st"></</span><span class="ot">#{</span>parents[x]<span class="ot">}</span><span class="st">></span><span class="ot">}</span> }</a>
|
||||
<a class="sourceLine" id="cb4-23" title="23"> res</a>
|
||||
<a class="sourceLine" id="cb4-24" title="24"><span class="kw">end</span></a></code></pre></div>
|
||||
<p>I don’t know if the code can help you, but the raisonning should definitively be known.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-05-19-How-to-cut-HTML-and-repair-it/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-05-19-How-to-cut-HTML-and-repair-it/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-05-19
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
|
|
@ -0,0 +1,295 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Trees; Pragmatism and Formalism</title>
|
||||
<meta name="keywords" content="XML, Perl, programming, tree, theory, mathematics, regexp, script" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-05-24-Trees--Pragmatism-and-Formalism/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Trees; Pragmatism and Formalism</h1>
|
||||
<h2>When theory is more efficient than practice</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span>:</p>
|
||||
<ul>
|
||||
<li>I tried to program a simple filter</li>
|
||||
<li>Was blocked 2 days</li>
|
||||
<li>Then stopped working like an engineer monkey</li>
|
||||
<li>Used a pen and a sheet of paper</li>
|
||||
<li>Made some math.</li>
|
||||
<li>Crushed the problem in 10 minutes</li>
|
||||
<li>Conclusion: The pragmatism shouldn’t mean “never use theory”.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="abstract-longer-than-tldr">Abstract (longer than <span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span>)</h2>
|
||||
<p>For my job, I needed to resolve a problem. It first seems not too hard. Then I started working directly on my program. I entered in the <em>infernal</em>: <em>try & repair loop</em>. Each step was like:</p>
|
||||
<blockquote>
|
||||
<p>– Just this thing to repair and that should be done.<br />
|
||||
– OK, now that should just work.<br />
|
||||
– Yeah!!!<br />
|
||||
– Oops! I forgotten that…<br />
|
||||
<code>repeat until death</code></p>
|
||||
</blockquote>
|
||||
<p>After two days of this <a href="http://fr.wikipedia.org/wiki/Sisyphe">Sisyphus</a> work, I finally just stopped to rethink the problem. I took a pen, a sheet of paper. I simplified the problem, reminded what I learned during my Ph.D. about trees. Finally, the problem was crushed in less than 20 minutes.</p>
|
||||
<p>I believe the important lesson is to remember that the most efficient methodology to resolve this <em>pragmatic</em> problem was the <em>theoretical</em> one. And therefore, argues opposing science, theory to pragmatism and efficiency are fallacies.</p>
|
||||
<hr />
|
||||
<h1 id="first-my-experience">First: my experience</h1>
|
||||
<p>Apparently 90% of programmer are unable to program a binary search without bug. The algorithm is well known and easy to understand. However it is difficult to program it without any flaw. I participated to <a href="http://reprog.wordpress.com/2010/04/19/are-you-one-of-the-10-percent/">this contest</a>. And you can see the <a href="http://reprog.wordpress.com/2010/04/21/binary-search-redux-part-1/">results here</a><a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a>. I had to face a problem of the same kind at my job. The problem was simple to the start. Simply transform an <sc>xml</sc> from one format to another.</p>
|
||||
<p>The source <sc>xml</sc> was in the following general format:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode xml"><code class="sourceCode xml"><a class="sourceLine" id="cb1-1" title="1"><span class="kw"><rubrique></span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="kw"><contenu></span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="kw"><tag1></span>value1<span class="kw"></tag1></span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="kw"><tag2></span>value2<span class="kw"></tag2></span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> ...</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="kw"></contenu></span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="kw"><enfant></span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> <span class="kw"><rubrique></span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"> ...</a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"> <span class="kw"></rubrique></span></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"> ...</a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"> <span class="kw"><rubrique></span></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"> ...</a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"> <span class="kw"></rubrique></span></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15"> <span class="kw"></enfant></span></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"><span class="kw"></menu></span></a></code></pre></div>
|
||||
<p>and the destination format was in the following general format:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode xml"><code class="sourceCode xml"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><item</span><span class="ot"> name=</span><span class="st">"Menu0"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="kw"><value></span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="kw"><item</span><span class="ot"> name=</span><span class="st">"menu"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> <span class="kw"><value></span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw"><item</span><span class="ot"> name=</span><span class="st">"tag1"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw"><value></span>value1<span class="kw"></value></span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="kw"></item></span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="kw"><item</span><span class="ot"> name=</span><span class="st">"tag2"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw"><value></span>value2<span class="kw"></value></span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> <span class="kw"></item></span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> ...</a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="kw"><item</span><span class="ot"> name=</span><span class="st">"menu"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="kw"><value></span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> ...</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> <span class="kw"></value></span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> <span class="kw"><value></span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> ...</a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> <span class="kw"></value></span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> <span class="kw"></item></span></a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"> <span class="kw"></value></span></a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"> <span class="kw"></item></span></a>
|
||||
<a class="sourceLine" id="cb2-22" title="22"> <span class="kw"></value></span></a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"><span class="kw"></item></span></a></code></pre></div>
|
||||
<p>At first sight I believed it will be easy. I was so certain it will be easy that I fixed to myself the following rules:</p>
|
||||
<ol type="1">
|
||||
<li>do not use <sc>xslt</sc></li>
|
||||
<li>avoid the use of an <sc>xml</sc> parser</li>
|
||||
<li>resolve the problem using a simple perl script[^2]</li>
|
||||
</ol>
|
||||
<p>You can try if you want. If you attack the problem directly opening an editor, I assure you, it will certainly be not so simple. I can tell that, because it’s what I’ve done. And I must say I lost almost a complete day at work trying to resolve this. There was also, many small problems around that make me lose more than two days for this problem.</p>
|
||||
<p>Why after two days did I was unable to resolve this problem which seems so simple?</p>
|
||||
<p>What was my behaviour (workflow)?</p>
|
||||
<ol type="1">
|
||||
<li>Think</li>
|
||||
<li>Write the program</li>
|
||||
<li>Try the program</li>
|
||||
<li>Verify the result</li>
|
||||
<li>Found a bug</li>
|
||||
<li>Resolve the bug</li>
|
||||
<li>Go to step 3.</li>
|
||||
</ol>
|
||||
<p>This was a <em>standard</em> workflow for computer engineer. The flaw came from the first step. I thought about how to resolve the problem but with the eyes of a <em>pragmatic engineer</em>. I was saying:</p>
|
||||
<blockquote>
|
||||
<p>That should be a simple perl search and replace program.<br />
|
||||
Let’s begin to write code</p>
|
||||
</blockquote>
|
||||
<p>This is the second sentence that was plainly wrong. I started in the wrong direction. And the workflow did not work from this entry point.</p>
|
||||
<h2 id="think">Think</h2>
|
||||
<p>After some times, I just stopped to work. Tell myself <em>“it is enough, now, I must finish it!”</em>. I took a sheet of paper, a pen and began to draw some trees.</p>
|
||||
<p>I began by make by removing most of the verbosity. I first renamed <code><item name="Menu"></code> by simpler name <code>M</code> for example. I obtained something like:</p>
|
||||
<p><img src="code/The_source_tree.png" alt="The source tree" /></p>
|
||||
<p>and</p>
|
||||
<p><img src="code/The_destination_tree.png" alt="The destination tree" /></p>
|
||||
<p>Then I made myself the following reflexion:</p>
|
||||
<p>Considering Tree Edit Distance, each unitary transformation of tree correspond to a simple search and replace on my <sc>xml</sc> source<a href="#fn2" class="footnote-ref" id="fnref2"><sup>2</sup></a>. We consider three atomic transformations on trees:</p>
|
||||
<ul>
|
||||
<li><em>substitution</em>: renaming a node</li>
|
||||
<li><em>insertion</em>: adding a node</li>
|
||||
<li><em>deletion</em>: remove a node</li>
|
||||
</ul>
|
||||
<p>One of the particularity of atomic transformations on trees, is ; if you remove a node, all children of this node, became children of its father.</p>
|
||||
<p>An example:</p>
|
||||
<pre class="twilight">
|
||||
r - x - a
|
||||
\ \
|
||||
\ b
|
||||
y - c
|
||||
</pre>
|
||||
<p>If you delete the <code>x</code> node, you obtain</p>
|
||||
<pre class="twilight">
|
||||
a
|
||||
/
|
||||
r - b
|
||||
\
|
||||
y - c
|
||||
</pre>
|
||||
<p>And look at what it implies when you write it in <sc>xml</sc>:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode xml"><code class="sourceCode xml"><a class="sourceLine" id="cb3-1" title="1"><span class="kw"><r></span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"> <span class="kw"><x></span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"> <span class="kw"><a></span>value for a<span class="kw"></a></span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4"> <span class="kw"><b></span>value for b<span class="kw"></b></span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"> <span class="kw"></x></span></a>
|
||||
<a class="sourceLine" id="cb3-6" title="6"> <span class="kw"><y></span></a>
|
||||
<a class="sourceLine" id="cb3-7" title="7"> <span class="kw"><c></span>value for c<span class="kw"></c></span></a>
|
||||
<a class="sourceLine" id="cb3-8" title="8"> <span class="kw"></y></span></a>
|
||||
<a class="sourceLine" id="cb3-9" title="9"><span class="kw"></r></span></a></code></pre></div>
|
||||
<p>Then deleting all <code>x</code> nodes is equivalent to pass the <sc>xml</sc> via the following search and replace script:</p>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode perl"><code class="sourceCode perl"><a class="sourceLine" id="cb4-1" title="1"><span class="kw">s/</span><span class="ot"><\/</span><span class="ch">?</span><span class="ot">x></span><span class="kw">//g</span></a></code></pre></div>
|
||||
<p>Therefore, if there exists a one state deterministic transducer which transform my trees ; I can transform the <sc>xml</sc> from one format to another with just a simple list of search and replace directives.</p>
|
||||
<h1 id="solution">Solution</h1>
|
||||
<p>Transform this tree:</p>
|
||||
<pre class="twilight">
|
||||
R - C - tag1
|
||||
\ \
|
||||
\ tag2
|
||||
E -- R - C - tag1
|
||||
\ \ \
|
||||
\ \ tag2
|
||||
\ E ...
|
||||
R - C - tag1
|
||||
\ \
|
||||
\ tag2
|
||||
E ...
|
||||
</pre>
|
||||
<p>to this tree:</p>
|
||||
<pre class="twilight">
|
||||
tag1
|
||||
/
|
||||
M - V - M - V - tag2 tag1
|
||||
\ /
|
||||
M --- V - tag2
|
||||
\ \
|
||||
\ M
|
||||
\ tag1
|
||||
\ /
|
||||
V - tag2
|
||||
\
|
||||
M
|
||||
</pre>
|
||||
<p>can be done using the following one state deterministic tree transducer:</p>
|
||||
<blockquote>
|
||||
<p>C -> ε<br />
|
||||
E -> M<br />
|
||||
R -> V</p>
|
||||
</blockquote>
|
||||
<p>Wich can be traduced by the following simple search and replace directives:</p>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode perl"><code class="sourceCode perl"><a class="sourceLine" id="cb5-1" title="1"><span class="kw">s/</span><span class="ot">C</span><span class="kw">//g</span></a>
|
||||
<a class="sourceLine" id="cb5-2" title="2"><span class="kw">s/</span><span class="ot">E</span><span class="kw">/</span><span class="st">M</span><span class="kw">/g</span></a>
|
||||
<a class="sourceLine" id="cb5-3" title="3"><span class="kw">s/</span><span class="ot">R</span><span class="kw">/</span><span class="st">V</span><span class="kw">/g</span></a></code></pre></div>
|
||||
<p>Once adapted to <sc>xml</sc> it becomes:</p>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode perl"><code class="sourceCode perl"><a class="sourceLine" id="cb6-1" title="1"><span class="kw">s%</span><span class="ot"></</span><span class="ch">?</span><span class="ot">contenu></span><span class="kw">%%g</span></a>
|
||||
<a class="sourceLine" id="cb6-2" title="2"><span class="kw">s%</span><span class="ot"><enfant></span><span class="kw">%</span><span class="st"><item name="menu"></span><span class="kw">%g</span></a>
|
||||
<a class="sourceLine" id="cb6-3" title="3"><span class="kw">s%</span><span class="ot"></enfant></span><span class="kw">%</span><span class="st"></item></span><span class="kw">%g</span></a>
|
||||
<a class="sourceLine" id="cb6-4" title="4"><span class="kw">s%</span><span class="ot"><rubrique></span><span class="kw">%</span><span class="st"><value></span><span class="kw">%g</span></a>
|
||||
<a class="sourceLine" id="cb6-5" title="5"><span class="kw">s%</span><span class="ot"></rubrique></span><span class="kw">%</span><span class="st"></value></span><span class="kw">%g</span></a></code></pre></div>
|
||||
<p>That is all.</p>
|
||||
<h1 id="conclusion">Conclusion</h1>
|
||||
<p>It should seems a bit paradoxal, but sometimes the most efficient approach to a pragmatic problem is to use the theoretical methodology.</p>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p>Hopefully I am in the 10% who had given a bug free implementation.<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
<li id="fn2"><p>I did a program which generate automatically the weight in a matrix of each edit distance from data.<a href="#fnref2" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-05-24-Trees--Pragmatism-and-Formalism/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-05-24-Trees--Pragmatism-and-Formalism/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-05-24
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - multi language choices</title>
|
||||
<meta name="keywords" content="multilanguage, blog" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-06-14-multi-language-choices/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>multi language choices</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I translate most of my blog entries in French and English. Most people advice me to have one file per language. Generally it ends with:</p>
|
||||
<pre class="twilight">
|
||||
Bonjour,
|
||||
|
||||
voici un exemple de texte en français.
|
||||
[image](url)
|
||||
</pre>
|
||||
<pre class="twilight">
|
||||
Hello,
|
||||
|
||||
here is an example of english text.
|
||||
[image](url)
|
||||
</pre>
|
||||
<p>This way of handling translations force you to write completely an article in one language, copy it, and translate it.</p>
|
||||
<p>However, most of time, there are common parts like images, source code, etc… When I want to correct some mistake on these parts, I have to make twice the work. With sometimes adding another mistake in only one language.</p>
|
||||
<p>This is why I preferred to handle it differently. I use <em>tags</em> on a single file. Finally my files looks like:</p>
|
||||
<pre class="twilight">
|
||||
fr: Bonjour,
|
||||
en: Hello,
|
||||
|
||||
en: here is an example of english text.
|
||||
fr: voici un exemple de texte en français.
|
||||
[image](url)
|
||||
</pre>
|
||||
<p>As I edit my files with <a href="http://vim.org">vim</a>, it is really easy to add <code>fr:</code> or <code>en:</code> at some line’s beginning using the useful <code>C-v</code>. However <a href="http://nanoc.stoneship.org">nanoc</a> was conceived to be used for one language only. Or to be used with the first method. I tried to adapt nanoc to my usage. But after a while, I found it easier to pre-filter the nanoc work by a simple script. My script transform my file into two new files. And all work like a charm.</p>
|
||||
<p>You can get my blog code source (without most of articles) at <a href="http://github.com/yogsototh/Scratch">github.com/yogsototh/Scratch</a>.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-14-multi-language-choices/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-14-multi-language-choices/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-06-14
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,166 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Get my blog engine</title>
|
||||
<meta name="keywords" content="blog, nanoc" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-06-15-Get-my-blog-engine/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Get my blog engine</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I published a <em>light</em> version of my blog engine based on <a href="http://nanoc.stoneship.org">nanoc</a> yesterday night. By <em>light</em>, I mean a lighter, more portable CSS (without round border). You can get it on <a href="http://github.com/yogsototh/nanoc3_blog">github.com</a>.</p>
|
||||
<p>What this system provide?</p>
|
||||
<ul>
|
||||
<li>All <a href="http://nanoc.stoneship.org">nanoc</a> advantages,</li>
|
||||
<li>Easy multi-language handling,</li>
|
||||
<li>Syntax Coloration for most languages,</li>
|
||||
<li><a href="http://intensedebate.org">intenseDebate</a> comments integration (asynchronous) ;</li>
|
||||
<li>Portable with and without javascript, XHTML Strict 1.0 / CSS3,</li>
|
||||
<li>Write in markdown format (no HTML editing needed),</li>
|
||||
<li>Typographic ameliorations (no ‘:’ starting a line in French for example),</li>
|
||||
<li><a href="http://graphviz.org">Graphviz</a> graph generation integration.</li>
|
||||
</ul>
|
||||
<hr />
|
||||
<h1 id="main-documentation-page">Main Documentation Page</h1>
|
||||
<h1 id="use-it-now">Use It NOW!</h1>
|
||||
<p>Once installed (follow the README.md instructions).</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1">$ <span class="kw">cd</span> /root/of/nanoc3_blog</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">$ ./task/new_blog_entry Title of the blog</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3">$ vi latest.md</a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">$ ./task/recompile</a></code></pre></div>
|
||||
<p>Now your website reside into the <code>output</code> directory.</p>
|
||||
<hr />
|
||||
<h1 id="documentation">Documentation</h1>
|
||||
<h2 id="useful-things-to-know">Useful things to know</h2>
|
||||
<h3 id="multi-language">Multi-language</h3>
|
||||
<p>All files in <code>multi</code> are processed and copied in the <code>content</code> directory. For each file in multi, each line starting by ‘<code>fr:</code>’ are copied (without the <code>fr:</code> into the <code>content/html/fr/</code> tree, but not into the <code>content/html/en</code> tree. File not starting by <code>fr:</code> or <code>en:</code> are copied in each destinations.</p>
|
||||
<p>If you want to add another language, you’ll have to modify <code>tasks/config</code>, and <code>config.yaml</code>, create a <code>content/html/xx</code> where <code>xx</code> is the language code.</p>
|
||||
<h3 id="edition-rendering">Edition & Rendering</h3>
|
||||
<h4 id="additional-keywords">additional keywords</h4>
|
||||
<p>You can separate multi content div using the: <code>n``ewcorps</code> directive (see examples).</p>
|
||||
<p>You can create div using <code>b``egindiv(classname)</code>, <code>e``nddiv</code>. (See some existing blog entries for example). Use the class <code>intro</code> for the abstract part.</p>
|
||||
<p>You can create nice description table using <code><``desc></code> (See source code for example).</p>
|
||||
<h4 id="typography">Typography</h4>
|
||||
<p>In French all ‘:’, ‘;’, ‘!’ and ‘?’ are preceded automatically by <code>&nbsp</code>. This enable not to have a line starting by a single special character.</p>
|
||||
<p>You can use small caps using <code><sc></code> tags.</p>
|
||||
<ul>
|
||||
<li><code>(c``)</code> is replaced by (c).</li>
|
||||
<li><code>(r``)</code> is replaced by (r).</li>
|
||||
<li><code><``-</code> is replaced by <-.</li>
|
||||
<li><code>-``></code> is replaced by ->.</li>
|
||||
</ul>
|
||||
<h4 id="source-code">source code</h4>
|
||||
<p>To write source code you should use the following format:</p>
|
||||
<p>~~~~~~ {.html} ~~~~~~ {.ruby} The code </cOde> ~~~~~~</p>
|
||||
<p>The <code>file</code> attribute is not required.</p>
|
||||
<h3 id="blog">blog</h3>
|
||||
<p>If you want to make really long blog post, you can separate them into many files. To accomplish that, you simply have to make your files like:</p>
|
||||
<pre class="twilight">
|
||||
multi/blog/2010-06-01-the-title.md
|
||||
multi/blog/2010-06-01-the-title/second_part.md
|
||||
multi/blog/2010-06-01-the-title/third_part.md
|
||||
</pre>
|
||||
<h3 id="mobileme">mobileme</h3>
|
||||
<p>All files are intended to be generated into the <code>output/Scratch</code> directory. This was made like that to work nicely with iWeb organisation of websites.</p>
|
||||
<h3 id="menu">menu</h3>
|
||||
<p>The order of post is done using the <code>menupriority</code> meta-data in the header of the files.</p>
|
||||
<p>You can hide some file from the menu by setting: <code>isHidden: true</code> in the header.</p>
|
||||
<h2 id="details">Details</h2>
|
||||
<p>To know more about this blog engine, you should look at <a href="http://nanoc.stoneship.org">nanoc</a> project.</p>
|
||||
<p>Then look at the files inside your project:</p>
|
||||
<p><desc> README.md : readme for the project (used by github) :: latest.md : symbolic link to the last blog entry :: multi/ : Directory containing multi-language articles :: tasks/ : scripts for website live :: config.yaml : global configuration file :: Rules : generation rules :: content/ : content files processed by nanoc :: layouts/ : erb templates :: lib/ : ruby libraries used to process files :: output/ : website :: Rakefile : not mandatory for this blog :: </desc></p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-15-Get-my-blog-engine/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-15-Get-my-blog-engine/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-06-15
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<script type="text/javascript" src="jquery.js"></script>
|
||||
<script type="text/javascript" src="jquery.cookie.js"></script>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$.cookie('admin',1);
|
||||
$('#info').html('Analytics can no more see you.')
|
||||
});
|
||||
</script>
|
||||
<title>Hide to analytics</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="info"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<script type="text/javascript" src="jquery.js"></script>
|
||||
<script type="text/javascript" src="jquery.cookie.js"></script>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$.cookie('admin',null);
|
||||
$('#info').html('Analytics can see you.')
|
||||
});
|
||||
</script>
|
||||
<title>Hide to analytics</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="info"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,157 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Hide Yourself to your Analytics</title>
|
||||
<meta name="keywords" content="analytics, statistics, hide, blog, jQuery, javascript" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-06-17-hide-yourself-to-analytics/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Hide Yourself to your Analytics</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>This is a way not to count your own visits to your blog. First you should look on how <a href="../../../../Scratch/en/blog/2010-06-17-track-events-with-google-analytics">I handle analytics</a>. All analytics are handled in one javascript file, this make things really convenient.</p>
|
||||
<p>Then you need to know my method use the <code>jquery-cookie</code>.</p>
|
||||
<p>I check if the key <code>admin</code> is not set in the cookie before adding the visit.</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb1-1" title="1"> <span class="kw">var</span> admin <span class="op">=</span> <span class="va">$</span>.<span class="at">cookie</span>(<span class="st">'admin'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="cf">if</span> (<span class="op">!</span> admin) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="co">// put your analytics code here</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="op">}</span> <span class="cf">else</span> <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="va">console</span>.<span class="at">log</span>(<span class="st">"[WARNING] you're HIDDEN to analytics"</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="op">}</span></a></code></pre></div>
|
||||
<p>then create two <sc>html</sc> files. One to hide:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb2-1" title="1"><span class="kw"><?xml</span> version="1.0" encoding="utf-8"<span class="kw">?></span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="dt"><!DOCTYPE </span>html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"</a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"<span class="dt">></span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"><span class="kw"><html</span><span class="ot"> xmlns=</span><span class="st">"http://www.w3.org/1999/xhtml"</span><span class="ot"> lang=</span><span class="st">"fr"</span><span class="ot"> xml:lang=</span><span class="st">"fr"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="kw"><head></span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw"><meta</span><span class="ot"> http-equiv=</span><span class="st">"Content-Type"</span><span class="ot"> content=</span><span class="st">"text/html; charset=UTF-8"</span> <span class="kw">/></span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="kw"><script</span><span class="ot"> type=</span><span class="st">"text/javascript"</span><span class="ot"> src=</span><span class="st">"jquery.js"</span><span class="kw">></script></span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="kw"><script</span><span class="ot"> type=</span><span class="st">"text/javascript"</span><span class="ot"> src=</span><span class="st">"jquery.cookie.js"</span><span class="kw">></script></span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="kw"><script></span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> <span class="at">$</span>(document).<span class="at">ready</span>(<span class="kw">function</span>()<span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> <span class="va">$</span>.<span class="at">cookie</span>(<span class="st">'admin'</span><span class="op">,</span><span class="dv">1</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="at">$</span>(<span class="st">'#info'</span>).<span class="at">html</span>(<span class="st">'Analytics can no more see you.'</span>)</a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="op">}</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> <span class="kw"></script></span></a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> <span class="kw"><title></span>Hide to analytics<span class="kw"></title></span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> <span class="kw"></head></span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> <span class="kw"><body></span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> <span class="kw"><div</span><span class="ot"> id=</span><span class="st">"info"</span><span class="kw">></div></span> </a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> <span class="kw"></body></span></a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"><span class="kw"></html></span></a></code></pre></div>
|
||||
<p>the other to be visible again (it can be useful):</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb3-1" title="1"><span class="kw"><?xml</span> version="1.0" encoding="utf-8"<span class="kw">?></span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"><span class="dt"><!DOCTYPE </span>html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"</a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"<span class="dt">></span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4"><span class="kw"><html</span><span class="ot"> xmlns=</span><span class="st">"http://www.w3.org/1999/xhtml"</span><span class="ot"> lang=</span><span class="st">"fr"</span><span class="ot"> xml:lang=</span><span class="st">"fr"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"> <span class="kw"><head></span></a>
|
||||
<a class="sourceLine" id="cb3-6" title="6"> <span class="kw"><meta</span><span class="ot"> http-equiv=</span><span class="st">"Content-Type"</span><span class="ot"> content=</span><span class="st">"text/html; charset=UTF-8"</span> <span class="kw">/></span></a>
|
||||
<a class="sourceLine" id="cb3-7" title="7"> <span class="kw"><script</span><span class="ot"> type=</span><span class="st">"text/javascript"</span><span class="ot"> src=</span><span class="st">"jquery.js"</span><span class="kw">></script></span></a>
|
||||
<a class="sourceLine" id="cb3-8" title="8"> <span class="kw"><script</span><span class="ot"> type=</span><span class="st">"text/javascript"</span><span class="ot"> src=</span><span class="st">"jquery.cookie.js"</span><span class="kw">></script></span></a>
|
||||
<a class="sourceLine" id="cb3-9" title="9"> <span class="kw"><script></span></a>
|
||||
<a class="sourceLine" id="cb3-10" title="10"> <span class="at">$</span>(document).<span class="at">ready</span>(<span class="kw">function</span>()<span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb3-11" title="11"> <span class="va">$</span>.<span class="at">cookie</span>(<span class="st">'admin'</span><span class="op">,</span><span class="kw">null</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-12" title="12"> <span class="at">$</span>(<span class="st">'#info'</span>).<span class="at">html</span>(<span class="st">'Analytics can see you.'</span>)</a>
|
||||
<a class="sourceLine" id="cb3-13" title="13"> <span class="op">}</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb3-14" title="14"> <span class="kw"></script></span></a>
|
||||
<a class="sourceLine" id="cb3-15" title="15"> <span class="kw"><title></span>Hide to analytics<span class="kw"></title></span></a>
|
||||
<a class="sourceLine" id="cb3-16" title="16"> <span class="kw"></head></span></a>
|
||||
<a class="sourceLine" id="cb3-17" title="17"> <span class="kw"><body></span></a>
|
||||
<a class="sourceLine" id="cb3-18" title="18"> <span class="kw"><div</span><span class="ot"> id=</span><span class="st">"info"</span><span class="kw">></div></span> </a>
|
||||
<a class="sourceLine" id="cb3-19" title="19"> <span class="kw"></body></span></a>
|
||||
<a class="sourceLine" id="cb3-20" title="20"><span class="kw"></html></span></a></code></pre></div>
|
||||
<p>Now accessing these files with you browser you can <em>hide</em> or <em>appear</em> in your statistics. You just have to think to access these file from all you browser.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-17-hide-yourself-to-analytics/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-17-hide-yourself-to-analytics/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-06-17
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
$(document).ready( function() {
|
||||
// add an event to all link for google analytics
|
||||
$('a').click(function () {
|
||||
// tell analytics to save event
|
||||
try {
|
||||
var identifier=$(this).attr('id') ;
|
||||
var href=$(this).attr('href')
|
||||
var label="";
|
||||
if ( typeof( identifier ) != 'undefined' ) {
|
||||
label=label+'[id]:'+identifier
|
||||
category='JSLink'
|
||||
}
|
||||
if ( typeof( href ) != 'undefined' ) {
|
||||
label=label+' [href]:'+href
|
||||
if ( href[0] == '#' ) {
|
||||
category='Anchor';
|
||||
} else {
|
||||
category='Link';
|
||||
}
|
||||
}
|
||||
_gaq.push(['_trackEvent', category, 'clicked', label]);
|
||||
// console.log('[tracked]: ' + category + ' ; clicked ; ' + label );
|
||||
}
|
||||
catch (err) {
|
||||
console.log(err);
|
||||
}
|
||||
|
||||
// pause to allow google script to run
|
||||
var date = new Date();
|
||||
var curDate = null;
|
||||
do {
|
||||
curDate = new Date();
|
||||
} while(curDate-date < 300);
|
||||
});
|
||||
});
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-XXXXXXXX-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
|
|
@ -0,0 +1,162 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Track Events with Google Analytics</title>
|
||||
<meta name="keywords" content="blog, javascript, jQuery, Google, analytics, analyser, User, Asynchronous" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-06-17-track-events-with-google-analytics/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Track Events with Google Analytics</h1>
|
||||
<h2>Asynchronous Complete Google Analytics with jQuery</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Here is how to track all clicks on your website using google analytics asynchronously.</p>
|
||||
<p>First in your <sc>html</sc> you need to use <a href="http://jquery.com">jQuery</a> and a javscript file I named <code>yga.js</code>:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb1-1" title="1"> <span class="kw"><script</span><span class="ot"> type=</span><span class="st">"text/javascript"</span><span class="ot"> src=</span><span class="st">"jquery.js"</span><span class="kw">></script></span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> <span class="kw"><script</span><span class="ot"> type=</span><span class="st">"text/javascript"</span><span class="ot"> src=</span><span class="st">"yga.js"</span><span class="kw">></script></span></a></code></pre></div>
|
||||
<p>And here is the <code>yga.js</code> file:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb2-1" title="1"><span class="at">$</span>(document).<span class="at">ready</span>( <span class="kw">function</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"> <span class="co">// add an event to all link for google analytics</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="at">$</span>(<span class="st">'a'</span>).<span class="at">click</span>(<span class="kw">function</span> () <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> <span class="co">// tell analytics to save event</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="cf">try</span> <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="kw">var</span> identifier<span class="op">=</span><span class="at">$</span>(<span class="kw">this</span>).<span class="at">attr</span>(<span class="st">'id'</span>) <span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="kw">var</span> href<span class="op">=</span><span class="at">$</span>(<span class="kw">this</span>).<span class="at">attr</span>(<span class="st">'href'</span>)</a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> <span class="kw">var</span> label<span class="op">=</span><span class="st">""</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> <span class="cf">if</span> ( <span class="kw">typeof</span>( identifier ) <span class="op">!=</span> <span class="st">'undefined'</span> ) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> label<span class="op">=</span>label<span class="op">+</span><span class="st">'[id]:'</span><span class="op">+</span>identifier</a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> category<span class="op">=</span><span class="st">'JSLink'</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="cf">if</span> ( <span class="kw">typeof</span>( href ) <span class="op">!=</span> <span class="st">'undefined'</span> ) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> label<span class="op">=</span>label<span class="op">+</span><span class="st">' [href]:'</span><span class="op">+</span>href</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> <span class="cf">if</span> ( href[<span class="dv">0</span>] <span class="op">==</span> <span class="st">'#'</span> ) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> category<span class="op">=</span><span class="st">'Anchor'</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> <span class="op">}</span> <span class="cf">else</span> <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> category<span class="op">=</span><span class="st">'Link'</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"> <span class="va">_gaq</span>.<span class="at">push</span>([<span class="st">'_trackEvent'</span><span class="op">,</span> category<span class="op">,</span> <span class="st">'clicked'</span><span class="op">,</span> label])<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-22" title="22"> <span class="co">// console.log('[tracked]: ' + category + ' ; clicked ; ' + label );</span></a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb2-24" title="24"> <span class="cf">catch</span> (err) <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-25" title="25"> <span class="va">console</span>.<span class="at">log</span>(err)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-26" title="26"> <span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb2-27" title="27"></a>
|
||||
<a class="sourceLine" id="cb2-28" title="28"> <span class="co">// pause to allow google script to run</span></a>
|
||||
<a class="sourceLine" id="cb2-29" title="29"> <span class="kw">var</span> date <span class="op">=</span> <span class="kw">new</span> <span class="at">Date</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-30" title="30"> <span class="kw">var</span> curDate <span class="op">=</span> <span class="kw">null</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-31" title="31"> <span class="cf">do</span> <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-32" title="32"> curDate <span class="op">=</span> <span class="kw">new</span> <span class="at">Date</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-33" title="33"> <span class="op">}</span> <span class="cf">while</span>(curDate<span class="op">-</span>date <span class="op"><</span> <span class="dv">300</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-34" title="34"> <span class="op">}</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-35" title="35"><span class="op">}</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-36" title="36"></a>
|
||||
<a class="sourceLine" id="cb2-37" title="37"><span class="kw">var</span> _gaq <span class="op">=</span> _gaq <span class="op">||</span> []<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-38" title="38"><span class="va">_gaq</span>.<span class="at">push</span>([<span class="st">'_setAccount'</span><span class="op">,</span> <span class="st">'UA-XXXXXXXX-1'</span>])<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-39" title="39"><span class="va">_gaq</span>.<span class="at">push</span>([<span class="st">'_trackPageview'</span>])<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-40" title="40"></a>
|
||||
<a class="sourceLine" id="cb2-41" title="41">(<span class="kw">function</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb2-42" title="42"> <span class="kw">var</span> ga <span class="op">=</span> <span class="va">document</span>.<span class="at">createElement</span>(<span class="st">'script'</span>)<span class="op">;</span> <span class="va">ga</span>.<span class="at">type</span> <span class="op">=</span> <span class="st">'text/javascript'</span><span class="op">;</span> <span class="va">ga</span>.<span class="at">async</span> <span class="op">=</span> <span class="kw">true</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-43" title="43"> <span class="va">ga</span>.<span class="at">src</span> <span class="op">=</span> (<span class="st">'https:'</span> <span class="op">==</span> <span class="va">document</span>.<span class="va">location</span>.<span class="at">protocol</span> <span class="op">?</span> <span class="st">'https://ssl'</span> : <span class="st">'http://www'</span>) <span class="op">+</span> <span class="st">'.google-analytics.com/ga.js'</span><span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-44" title="44"> <span class="kw">var</span> s <span class="op">=</span> <span class="va">document</span>.<span class="at">getElementsByTagName</span>(<span class="st">'script'</span>)[<span class="dv">0</span>]<span class="op">;</span> <span class="va">s</span>.<span class="va">parentNode</span>.<span class="at">insertBefore</span>(ga<span class="op">,</span> s)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb2-45" title="45"> <span class="op">}</span>)()<span class="op">;</span></a></code></pre></div>
|
||||
<p>Replace the: <code>UA-XXXXXXXX-1</code> by your google analytics code and you’re done.</p>
|
||||
<p>To see what occurs, simply go in <code>Content</code> and <code>Event Tracking</code> as shown in the following screenshot:</p>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-06-17-track-events-with-google-analytics/GA_events.png" alt />
|
||||
</div>
|
||||
<p>Happy tracking!</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-17-track-events-with-google-analytics/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-17-track-events-with-google-analytics/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-06-17
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
// --- code popup ---
|
||||
function openPopup() {
|
||||
$(this).clone(false).appendTo($("#_code"));
|
||||
$("#_code").show();
|
||||
}
|
||||
|
||||
function closePopup() {
|
||||
$("#_code").html("");
|
||||
$("#_code").hide();
|
||||
}
|
||||
|
||||
function initCode() {
|
||||
$(".code").click(openPopup);
|
||||
$(".code").css({cursor: "pointer"});
|
||||
$('body').append('<div id="_code"></div>');
|
||||
$('#_code').css( { 'text-align': "justify", position: "fixed",
|
||||
left:0, top:0, width: "100%", height: "100%",
|
||||
"background-color": "rgba(0, 0, 0, 0.8)", 'z-index':2000, 'padding':'3px'} );
|
||||
$('#_code').hide();
|
||||
$('#_code').click(closePopup);
|
||||
}
|
||||
// --- end of code popup section ---
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - jQuery popup the easy way</title>
|
||||
<meta name="keywords" content="jQuery, javascript, popup, blog, web" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-06-19-jQuery-popup-the-easy-way/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>jQuery popup the easy way</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Here is a fast and easy way to create jQuery popup.</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode javascript"><code class="sourceCode javascript"><a class="sourceLine" id="cb1-1" title="1"><span class="co">// --- code popup ---</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw">function</span> <span class="at">openPopup</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="at">$</span>(<span class="kw">this</span>).<span class="at">clone</span>(<span class="kw">false</span>).<span class="at">appendTo</span>(<span class="at">$</span>(<span class="st">"#_code"</span>))<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="at">$</span>(<span class="st">"#_code"</span>).<span class="at">show</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"><span class="kw">function</span> <span class="at">closePopup</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> <span class="at">$</span>(<span class="st">"#_code"</span>).<span class="at">html</span>(<span class="st">""</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"> <span class="at">$</span>(<span class="st">"#_code"</span>).<span class="at">hide</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"></a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"><span class="kw">function</span> <span class="at">initCode</span>() <span class="op">{</span></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"> <span class="at">$</span>(<span class="st">".code"</span>).<span class="at">click</span>(openPopup)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"> <span class="at">$</span>(<span class="st">".code"</span>).<span class="at">css</span>(<span class="op">{</span><span class="dt">cursor</span><span class="op">:</span> <span class="st">"pointer"</span><span class="op">}</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15"> <span class="at">$</span>(<span class="st">'body'</span>).<span class="at">append</span>(<span class="st">'<div id="_code"></div>'</span>)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"> <span class="at">$</span>(<span class="st">'#_code'</span>).<span class="at">css</span>( <span class="op">{</span> <span class="st">'text-align'</span><span class="op">:</span> <span class="st">"justify"</span><span class="op">,</span> <span class="dt">position</span><span class="op">:</span> <span class="st">"fixed"</span><span class="op">,</span> </a>
|
||||
<a class="sourceLine" id="cb1-17" title="17"> <span class="dt">left</span><span class="op">:</span><span class="dv">0</span><span class="op">,</span> <span class="dt">top</span><span class="op">:</span><span class="dv">0</span><span class="op">,</span> <span class="dt">width</span><span class="op">:</span> <span class="st">"100%"</span><span class="op">,</span> <span class="dt">height</span><span class="op">:</span> <span class="st">"100%"</span><span class="op">,</span> </a>
|
||||
<a class="sourceLine" id="cb1-18" title="18"> <span class="st">"background-color"</span><span class="op">:</span> <span class="st">"rgba(0, 0, 0, 0.8)"</span><span class="op">,</span> <span class="st">'z-index'</span><span class="op">:</span><span class="dv">2000</span><span class="op">,</span> <span class="st">'padding'</span><span class="op">:</span><span class="st">'3px'</span><span class="op">}</span> )<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-19" title="19"> <span class="at">$</span>(<span class="st">'#_code'</span>).<span class="at">hide</span>()<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-20" title="20"> <span class="at">$</span>(<span class="st">'#_code'</span>).<span class="at">click</span>(closePopup)<span class="op">;</span></a>
|
||||
<a class="sourceLine" id="cb1-21" title="21"><span class="op">}</span></a>
|
||||
<a class="sourceLine" id="cb1-22" title="22"><span class="co">// --- end of code popup section ---</span></a></code></pre></div>
|
||||
<p>What does this code do?</p>
|
||||
<p>At the loading of the page, I create a <code>div</code> as wide as the window. This <code>div</code> is a bit transparent. Then I hide it. I also take care to its <code>z-index</code> value to be sure it is behind all elements.</p>
|
||||
<p>Then when we click on a <code>div</code> of class <code>code</code>, I copy the content into this new wide <code>div</code>, and I show it. Really simple but really efficient. No need to use a <code>jQuery</code> plugin.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-19-jQuery-popup-the-easy-way/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-06-19-jQuery-popup-the-easy-way/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-06-19
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,190 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Cappuccino vs jQuery</title>
|
||||
<meta name="keywords" content="Cappuccino, iPhone, web, javascript, jQuery, Cocoa, programming" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-07-05-Cappuccino-and-Web-applications/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Cappuccino vs jQuery</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p><abbr class="sc" title="Too long; didn't read">tl;dr</abbr>:</p>
|
||||
<ul>
|
||||
<li>Tried to make <a href="http://yannesposito.com/softwares/ypassword">YPassword</a> in jQuery and with Cappuccino.</li>
|
||||
<li>Cappuccino nice in desktop browser but 1.4MB, not compatible with iPhone.</li>
|
||||
<li>jQuery not as nice as the Cappuccino version but 106KB. iPhone compatible.</li>
|
||||
<li>I’ll give a try to Dashcode 3.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="intro">
|
||||
<p>Before start, I must say I know Cappuccino and jQuery are no more comparable than Cocoa and the C++ standard library. One is oriented for user interface while the other is and helper for low level programming. Nonetheless I used these two to make the same web application. This is why I compare the experience I had with each of them for this specific task.</p>
|
||||
</div>
|
||||
<p>I made a web version of my dashboard widget <a href="http://yannesposito.com/softwares/ypassword">YPassword</a>. It is a simple widget to manage your online password with a <em>strong</em> security and with a totally portable way. It is not intended to replace a <em>keychain</em>. It is more a password generator.</p>
|
||||
<p>The first was made from the code of my dashboard widget and with some jQuery. You can try it <a href="http://yannesposito.com/YPassword.old">here</a>. I then made a second version with the <a href="http://cappuccino.org">Cappuccino</a>. You can try it <a href="http://yannesposito.com/YPassword">here</a>.</p>
|
||||
<h2 id="what-this-widget-do">What this widget do?</h2>
|
||||
<div class="intro">
|
||||
<p>If you don’t mind about what does my widget and just want to know how the two frameworkcompare, you should go directly to the <a href="#cappuccino">next part</a>.</p>
|
||||
</div>
|
||||
<p>I manage my password on many site with a simple method. I remember a strong master password. And my password is mainly <code class="ruby">hash(masterPassword+domainName)</code></p>
|
||||
<p>In reality I need a bit more informations to create a password:</p>
|
||||
<ul>
|
||||
<li>A master password,</li>
|
||||
<li>an URL,</li>
|
||||
<li>a maximal password length,</li>
|
||||
<li>the kind of output base64 or hexadecimal,</li>
|
||||
<li>how many times my password could have leaked.</li>
|
||||
</ul>
|
||||
<p>The result password is this:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb1-1" title="1">domainName=domaine_Name_Of_URL(url)</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">hash=sha1( masterPassword + leakedTimes + domainName )</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="kw">if</span> ( kind == <span class="st">'base64'</span> )</a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> hash=base64(hash)</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"><span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"><span class="kw">return</span> hash[<span class="dv">0</span>..maxlength]</a></code></pre></div>
|
||||
<p>In fact depending of websites, some give some strange constraint to your password:</p>
|
||||
<ul>
|
||||
<li>minimal length,</li>
|
||||
<li>maximal length,</li>
|
||||
<li>must not contain a special character,</li>
|
||||
<li>must contain a special character,</li>
|
||||
<li>etc…</li>
|
||||
</ul>
|
||||
<p>And if you want to change your password the <em>leak number</em> is here for that. All informations such as user name, maximal length can be stored in a public file. The only real secret is the master password.</p>
|
||||
<p>If you want to know even more details you can always look at some of my old blog entries:</p>
|
||||
<ul>
|
||||
<li><a href="http://yannesposito.com/YBlog/Computer/Entr%C3%A9es/2008/7/30_Easy%2C_secure_and_portable_password_management_system.html">simple portable password management</a></li>
|
||||
<li><a href="http://yannesposito.com/YBlog/Computer/Entrées/2009/3/15_Shorter_Password_with_the_same_efficiency.html">base64</a></li>
|
||||
<li><a href="http://yannesposito.com/YBlog/Computer/Entr%C3%A9es/2009/4/11_Be_able_to_change_your_password.html">change your password</a></li>
|
||||
</ul>
|
||||
<h2 id="cappuccino">Cappuccino</h2>
|
||||
<p>First, I’d like to say Cappuccino applications look simply awesome. It is like having a Cocoa application in your web browser. And this is <em>great</em>.</p>
|
||||
<p>I also must admit I enjoyed making my application with Cappuccino. It is like programming for an iPhone application. If you are a bit familiar with Cocoa, you feel at home. If you don’t know anything about Cocoa, I suggest you to look at it. This is a really <em>great</em> framework to make User Interface. I am not a specialist, but I have done some MFC, java Swing<a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a> and WXWindows User Interfaces (some years ago). And I must say, Cocoa is far better than those.</p>
|
||||
<p>Cappuccino is a great web application oriented development. But there was also some drawbacks</p>
|
||||
<p>Things I liked:</p>
|
||||
<ul>
|
||||
<li>It looks great</li>
|
||||
<li>It was fun to program</li>
|
||||
<li>It was like programming a Mac application</li>
|
||||
<li>I could have done the User Interface using <a href="http://developer.apple.com/technologies/tools/xcode.html">Interface Builder</a>.</li>
|
||||
</ul>
|
||||
<p>Some things I didn’t like:</p>
|
||||
<ul>
|
||||
<li>I made some time to understand how to handle the <code>onChange</code> on the text fields.</li>
|
||||
<li>Documentation lacked a bit of organisation.</li>
|
||||
<li>It doesn’t work on iPhone.</li>
|
||||
<li>It weighted 11MB to deploy.</li>
|
||||
<li>It weight 1.3MB to load.</li>
|
||||
</ul>
|
||||
<p>I didn’t use bindings because I believe they are not ready by now.</p>
|
||||
<h2 id="jquery">jQuery</h2>
|
||||
<p>The jQuery version of YPassword is not as finished as the Cappuccino one. Because, there is no <em>slider</em> directly with jQuery. I’d have to use jQueryUI. And I believe, using it will make the application weight far more than the today 106KB.</p>
|
||||
<p>To make this version I simply copied my widget source code and adapted it. It was straightforward. But jQuery is not an <em>application oriented framework</em>. It is more a “<em>dark side</em> javascript animation framework”<a href="#fn2" class="footnote-ref" id="fnref2"><sup>2</sup></a>.</p>
|
||||
<p>I don’t have too much to say about the jQuery version. But this was way more <em>low level</em> programming than Cappuccino.</p>
|
||||
<h2 id="my-conclusion">My conclusion</h2>
|
||||
<p>If you want to make an iPhone compatible web application just don’t use Cappuccino yet. If you want to make <em>simple</em> application like mine, I also believe, Cappuccino is a bit too much.</p>
|
||||
<p>If you want to make a complex web oriented application, Cappuccino is a great choice. But you may have some difficulties to begin programming with it.</p>
|
||||
<p>Finally, to terminate my web version of my widget, I’ll give a try to Dashcode 3. It seems to be a good alternative to create web widgets. I don’t know if Dashcode 3 is portable on non webkit browser. But if it is, it could be the end of projects like Cappuccino and Sproutcore.</p>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p>If you are interested you can take a look at <a href="http://labh-curien.univ-st-etienne.fr/informatique/SEDiL/">SEDiL</a>. I am proud of the tree drawing view made from scratch.<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
<li id="fn2"><p>I don’t want to feel like a <em>troll</em> I use jQuery to make some <em>dark side</em> animation on this blog. But the javascript on my blog is not needed except for commenting.<a href="#fnref2" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-05-Cappuccino-and-Web-applications/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-05-Cappuccino-and-Web-applications/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-07-05
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,120 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Do not use CSS gradient with Chrome</title>
|
||||
<meta name="keywords" content="CSS, web, programming, Chrome, Safari, Firefox" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-07-07-CSS-rendering-problems-by-navigator/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Do not use CSS gradient with Chrome</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Some <a href="http://reddit.com">Reddit</a> users reported my website was really long to load and to scroll. They thinks it was because of the ‘1px shadow’ I apply on all the text. I was a bit surprised, because I make some test into a really <em>slow</em> virtual machine. And all have always worked fine. In fact, what slow down so much are by order of importance:</p>
|
||||
<ol type="1">
|
||||
<li>Radial gradient on Chrome (not in Safari on Mac)</li>
|
||||
<li>Box shadows on Firefox and Chrome</li>
|
||||
</ol>
|
||||
<h2 id="gradient">Gradient</h2>
|
||||
<p>On Safari on Mac there is absolutely no rendering time problem. But when I use Chrome under Linux it is almost unusable.</p>
|
||||
<p>Safari and Chrome use webkit, when you access my website with javascript enabled, an additionnal browser specific CSS is loaded. Until now I switched only between: IE, Mozilla and Webkit. Now I added one more special case for Chrome. Now I continue to use gradient for Safari but no more on Chrome.</p>
|
||||
<p>I didn’t tried to verify the efficiency of all new CSS 3 features. But I advise you not to use <strong><code>-webkit-gradient</code></strong> on Chrome. At least when the host is a Linux.</p>
|
||||
<h2 id="box-shadows">Box Shadows</h2>
|
||||
<p>I also detected that <strong><code>-moz-box-shadow</code></strong> elements slow down the rendering on Firefox under Linux. But there was very few time rendering issue with Safari on Mac.</p>
|
||||
<h2 id="text-shadows">Text Shadows</h2>
|
||||
<p>Many tell me to use text-shadows sparingly. But I believe it was not the real reason of the slow down. This is why I’ll get them back.</p>
|
||||
<h2 id="conclusion">Conclusion</h2>
|
||||
<p>Do not use <strong><code>-webkit-gradient</code></strong> on Chrome browser yet. Try to use <strong><code>-moz-box-shadow</code></strong> sparingly.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-07-CSS-rendering-problems-by-navigator/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-07-CSS-rendering-problems-by-navigator/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-07-07
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,201 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Undecidabilities (part 1)</title>
|
||||
<meta name="keywords" content="mathematics, science, philosophy, indecidability" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-07-09-Indecidabilities/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Undecidabilities (part 1)</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p><% # toremove_ %></p>
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span> I pretend to create a world to give examples of different meanings behind the word <em>undecidability</em>:</p>
|
||||
<ul>
|
||||
<li>Undecidability due to measure errors,</li>
|
||||
<li>Big errors resulting from small initial measure error,</li>
|
||||
<li>Fractal undecidability ;</li>
|
||||
<li>Logic Undecidability.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<hr />
|
||||
<h1 id="the-undecidabilities">The Undecidabilities</h1>
|
||||
<div class="intro">
|
||||
<p>If a demiurge made our world, he certainly had a great sense of humor. After this read, you should be convinced. I’ll pretend to be him. I’ll create a simplified world. A world that obey to simple mathematical rules. And I’ll tell you about one of the curse on this world: the <em>undecidability</em>. The inability to know if we had find the <em>truth</em>. The inability to predict many things that should be natural. Here begin the story.</p>
|
||||
</div>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-07-09-Indecidabilities/genesis.png" alt class="left" />
|
||||
</div>
|
||||
<p>In the beginning there was only void. Then a blog post beginning to be written. I breath profoundly to feel the weight of the act I will accomplish. A last tense moment and… I <em>create</em> the <em>Universe</em>. An incredible <em>Universe</em> which will exists only the time of this read. I’m the <em>demiurge</em> of this universe and you are its observer.</p>
|
||||
<p>I construct this world using only simples rules. I decide that <em>real</em> rules of this world will be the one we believe are <em>true</em> for our world. Note the difference. For their world, everything we <em>believe</em> today is <em>true</em> for them. Their world is then probably <em>simpler</em> than our. Particularly, we can describe this world with axioms and mathematic rules. It is not so sure for our Universe. But we’ll talk about that later.</p>
|
||||
<p>Lets the work begin. I create an <em>Earth</em>. I populate it with intelligent people, the <em>Ys</em>. Of course they are curious. In particular they try to understand their world. They believe that if they know the rules of their world they will be able to predict the consequences of most of their acts. They are so naive. If only they knew. But I’m here to help them.</p>
|
||||
<p>I am a God who likes jokes. The first joke I make to Ys is to make their sense imperfect. Furthermore it is not possible to make perfect precise measure in my world. I let Ys ameliorate their technology but there is a theoretical limit to the best precision they can reach.</p>
|
||||
<p>I’d like to precise that these people believe their world is flat. Some believe it is possible to find the rules of their Universe. Now, let the game begins.</p>
|
||||
<p>Lets start easily, <em>errors can cause undecidability</em>.</p>
|
||||
<h2 id="undecidability-due-to-measure-errors">Undecidability due to measure errors</h2>
|
||||
<p>Here is what one of them think:</p>
|
||||
<blockquote>
|
||||
<p>All triangle I observe seems to share the same property. Each time I sum up their angles I obtain π radiants (180°). It is certainly a rule of my Universe. But how to be certain all triangle in my Universe share this property?</p>
|
||||
</blockquote>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-07-09-Indecidabilities/triangle_3_angles.png" alt="three triangles" class="left" />
|
||||
</div>
|
||||
<p>Some began to formalize the problem. They end by writing a mathematical proof. Marvelous! The proof seems correct, but, a problem remains. The proof is based on rules and axioms. How to be certain these rules and axioms are right in their world? They will try to measure again and again the sum of the angles of triangles. The measure will never fail. But they’ll never be certain the rules and axioms are right. Because then only way to verify all axioms depends of observation. And as a facetious god, I forbid perfect measure in observation.</p>
|
||||
<p>Of course, they prey, they call me to help. And as any respectful god, I don’t answer. Ah ah ah! I’ve always loved to make these kind of thing. Let’s act as if I don’t exists. What a good joke!</p>
|
||||
<p>They feel sad. But they have some hope:</p>
|
||||
<p><em>Hope</em></p>
|
||||
<blockquote>
|
||||
<p>If we make small measure error, we will make small predictive error.</p>
|
||||
</blockquote>
|
||||
<h2 id="growing-errors-undecidability">Growing errors Undecidability</h2>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-07-09-Indecidabilities/3_corps.png" alt="Three bodies" class="left" />
|
||||
</div>
|
||||
<p>Unfortunately, the three bodies problem will crush this <em>hope</em>. Using Newton’s Universal Law of gravitation with two bodies, we can predict with precision what will be their position and speed in the future. Until there all seems OK. But now, add another body. All errors will grow. Errors will grow at a point that any prediction will be unusable.</p>
|
||||
<p>Even with this bad news there is the <em>hope</em> to <em>control</em> the error.</p>
|
||||
<blockquote>
|
||||
<p>May we should know the maximal measure error we can handle to predict something. And we should at least determine what we can predict and what we cannot.</p>
|
||||
</blockquote>
|
||||
<p>Once again, this should not terminate has they hope.</p>
|
||||
<h2 id="fractal-undecidability">Fractal Undecidability</h2>
|
||||
<p>Consider the following question:</p>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-07-09-Indecidabilities/mandelbrot.png" alt="Mandelbrot set" class="left" />
|
||||
</div>
|
||||
<p>Consider some GPS coordinates on a point around the cost of the “Bretagne” in France. The coordinates are 3 feet precise. Is the point in the water or on Earth?</p>
|
||||
<p>For some coordinates it is not possible to know. Even if we are authorize to move a bit to dodge the borders. Because there are some zone in which all point could be a “border” for any size of the zone.</p>
|
||||
<p>We can even imagine some mathematical structure where <em>all</em> points are at the border<a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a>.</p>
|
||||
<h2 id="logical-undecidability">Logical Undecidability</h2>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-07-09-Indecidabilities/stackOverflow.png" alt="recursive stack overflow" class="left" />
|
||||
</div>
|
||||
<p>Until there all problem were undecidable because of measure <em>errors</em>. May be in a controlled world without any <em>error</em> we should be able to predict anything.<br />
|
||||
I’m sorry to say no. Even in a self-contained mathematical world it can be possible to create object with an unpredictable behaviour.</p>
|
||||
<p>It is the <em>halting problem</em>.</p>
|
||||
<p>Theorem: It is undecidable given a description of a program, whether the program finishes running or will run forever. The idea of the proof is simple enough to be part of this article. And this is with pleasure I give you one here.</p>
|
||||
<blockquote>
|
||||
<p>Suppose a program able to decide if any program halt exists. More precisely:</p>
|
||||
<p>Hypothesis: there exists a program <code>P</code> such that:</p>
|
||||
<ul>
|
||||
<li><code>P(x,y)</code> return “stop” in a finite amount of time if <code>x(y)</code><a href="#fn2" class="footnote-ref" id="fnref2"><sup>2</sup></a> will stop running.</li>
|
||||
<li><code>P(x,y)</code> return “loop” in a finite amount of time if <code>x(y)</code> will never stop running.</li>
|
||||
</ul>
|
||||
<p>Remark: Any program can be represented as a string. Therefore, a program can be used as the input of another program. It is authorized to write <code>P(x,x)</code>.</p>
|
||||
<p>Let <code>Q</code> be the following program using the return value of <code>P</code>.</p>
|
||||
<pre class="twilight">
|
||||
Q(x) :
|
||||
if P(x,x)="stop" then I enter in an infinite loop
|
||||
if P(x,x)="loop" then I stop
|
||||
</pre>
|
||||
<p>Now, what is the value of <code>P(Q,Q)</code>?</p>
|
||||
<ul>
|
||||
<li>if <code>P(Q,Q)</code> returns “stop” that imply by construction of <code>Q</code> that <code>P(Q,Q)</code> returns “loop”.</li>
|
||||
<li>if <code>P(Q,Q)</code> returns “loop” that means by construction of <code>Q</code> that <code>P(Q,Q)</code> return “stop”.</li>
|
||||
</ul>
|
||||
<p>Therefore there is a contradiction the only way to handle is by the non existence of the program <code>P</code>.</p>
|
||||
</blockquote>
|
||||
<p>I am the demiurge of this imaginary world. And I cannot know the future of this world. Therefore, creative power isn’t equivalent to omnipotence.</p>
|
||||
<hr />
|
||||
<p>After all this, it becomes difficult to know what we can believe. But it would be another error to throw away all our knowledge. In a future next part, I’ll explain what we can hope and what attitude we should have once we’ve realized most of truth are unaccessible.</p>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p>The set Rhas this property.<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
<li id="fn2"><p>Meaning <code>x</code> taking <code>y</code> as input.<a href="#fnref2" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-09-Indecidabilities/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-09-Indecidabilities/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-08-11
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - New style after holidays</title>
|
||||
<meta name="keywords" content="CSS, web, design" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-07-31-New-style-after-holidays/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>New style after holidays</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Before my holidays many visitors tell me my website was too long to scroll. This is why I completely changed my website design. Now all should scroll smoothly on all platforms. I was inspired by Readability and iBooks(c) (the iPhone(c) application).</p>
|
||||
<p>Tell me what you think of this new design.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-31-New-style-after-holidays/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-07-31-New-style-after-holidays/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-07-31
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
require 'rubygems'
|
||||
require 'rack'
|
||||
require 'rack/contrib'
|
||||
require 'rack-rewrite'
|
||||
require 'mime/types'
|
||||
|
||||
use Rack::ETag
|
||||
module ::Rack
|
||||
class TryStatic < Static
|
||||
|
||||
def initialize(app, options)
|
||||
super
|
||||
@try = ([''] + Array(options.delete(:try)) + [''])
|
||||
end
|
||||
|
||||
def call(env)
|
||||
@next = 0
|
||||
while @next < @try.size && 404 == (resp = super(try_next(env)))[0]
|
||||
@next += 1
|
||||
end
|
||||
404 == resp[0] ? @app.call : resp
|
||||
end
|
||||
|
||||
private
|
||||
def try_next(env)
|
||||
env.merge('PATH_INFO' => env['PATH_INFO'] + @try[@next])
|
||||
end
|
||||
|
||||
end
|
||||
end
|
||||
|
||||
use Rack::TryStatic,
|
||||
:root => "output", # static files root dir
|
||||
:urls => %w[/], # match all requests
|
||||
:try => ['.html', 'index.html', '/index.html'] # try these postfixes sequentially
|
||||
|
||||
errorFile='output/Scratch/en/error/404-not_found/index.html'
|
||||
run lambda { [404, {
|
||||
"Last-Modified" => File.mtime(errorFile).httpdate,
|
||||
"Content-Type" => "text/html",
|
||||
"Content-Length" => File.size(errorFile).to_s
|
||||
}, File.read(errorFile)] }
|
||||
|
|
@ -0,0 +1,168 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Now hosted by heroku</title>
|
||||
<meta name="keywords" content="blog" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-08-23-Now-heberged-on-heroku/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Now hosted by heroku</h1>
|
||||
<h2>Host static website on Heroku</h2>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<h1 id="now-on-heroku">Now on <a href="http://heroku.com">Heroku</a></h1>
|
||||
<p>I now changed my hosting to <a href="http://heroku.com">Heroku</a>. I believe it will be far more reliable.</p>
|
||||
<p>But as you should know my website is completely static. I use <a href="http://nanoc.stoneship.org/">nanoc</a> to generate it. But here is the conf to make it work on heroku.</p>
|
||||
<p>The root of my files is <code>/output</code>. You only need to create a <code>config.ru</code><a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a> file:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb1-1" title="1">require <span class="st">'rubygems'</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">require <span class="st">'rack'</span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3">require <span class="st">'rack/contrib'</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">require <span class="st">'rack-rewrite'</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5">require <span class="st">'mime/types'</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7">use <span class="dt">Rack</span>::<span class="dt">ETag</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"><span class="kw">module</span> ::<span class="dt">Rack</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"> <span class="kw">class</span> <span class="dt">TryStatic</span> < <span class="dt">Static</span></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"> <span class="kw">def</span> initialize(app, options)</a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"> <span class="dv">super</span></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"> <span class="ot">@try</span> = ([<span class="st">''</span>] + <span class="dt">Array</span>(options.delete(<span class="st">:try</span>)) + [<span class="st">''</span>])</a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"> <span class="kw">def</span> call(env)</a>
|
||||
<a class="sourceLine" id="cb1-17" title="17"> <span class="ot">@next</span> = <span class="dv">0</span></a>
|
||||
<a class="sourceLine" id="cb1-18" title="18"> <span class="kw">while</span> <span class="ot">@next</span> < <span class="ot">@try</span>.size && <span class="dv">404</span> == (resp = <span class="dv">super</span>(try_next(env)))[<span class="dv">0</span>] </a>
|
||||
<a class="sourceLine" id="cb1-19" title="19"> <span class="ot">@next</span> += <span class="dv">1</span></a>
|
||||
<a class="sourceLine" id="cb1-20" title="20"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-21" title="21"> <span class="dv">404</span> == resp[<span class="dv">0</span>] ? <span class="ot">@app</span>.call : resp</a>
|
||||
<a class="sourceLine" id="cb1-22" title="22"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-23" title="23"></a>
|
||||
<a class="sourceLine" id="cb1-24" title="24"> <span class="kw">private</span></a>
|
||||
<a class="sourceLine" id="cb1-25" title="25"> <span class="kw">def</span> try_next(env)</a>
|
||||
<a class="sourceLine" id="cb1-26" title="26"> env.merge(<span class="st">'PATH_INFO'</span> => env[<span class="st">'PATH_INFO'</span>] + <span class="ot">@try</span>[<span class="ot">@next</span>])</a>
|
||||
<a class="sourceLine" id="cb1-27" title="27"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-28" title="28"></a>
|
||||
<a class="sourceLine" id="cb1-29" title="29"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-30" title="30"><span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-31" title="31"></a>
|
||||
<a class="sourceLine" id="cb1-32" title="32">use <span class="dt">Rack</span>::<span class="dt">TryStatic</span>, </a>
|
||||
<a class="sourceLine" id="cb1-33" title="33"> <span class="st">:root</span> => <span class="st">"output"</span>, <span class="co"># static files root dir</span></a>
|
||||
<a class="sourceLine" id="cb1-34" title="34"> <span class="st">:urls</span> =><span class="ot"> %w[</span><span class="st">/</span><span class="ot">]</span>, <span class="co"># match all requests </span></a>
|
||||
<a class="sourceLine" id="cb1-35" title="35"> <span class="st">:try</span> => [<span class="st">'.html'</span>, <span class="st">'index.html'</span>, <span class="st">'/index.html'</span>] <span class="co"># try these postfixes sequentially</span></a>
|
||||
<a class="sourceLine" id="cb1-36" title="36"></a>
|
||||
<a class="sourceLine" id="cb1-37" title="37">errorFile=<span class="st">'output/Scratch/en/error/404-not_found/index.html'</span></a>
|
||||
<a class="sourceLine" id="cb1-38" title="38">run lambda { [<span class="dv">404</span>, {</a>
|
||||
<a class="sourceLine" id="cb1-39" title="39"> <span class="st">"Last-Modified"</span> => <span class="dt">File</span>.mtime(errorFile).httpdate,</a>
|
||||
<a class="sourceLine" id="cb1-40" title="40"> <span class="st">"Content-Type"</span> => <span class="st">"text/html"</span>,</a>
|
||||
<a class="sourceLine" id="cb1-41" title="41"> <span class="st">"Content-Length"</span> => <span class="dt">File</span>.size(errorFile).to_s</a>
|
||||
<a class="sourceLine" id="cb1-42" title="42"> }, <span class="dt">File</span>.read(errorFile)] }</a></code></pre></div>
|
||||
<p>and the <code>.gems</code> file needed to install <code>rack</code> middlewares.</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb2-1" title="1">rack</a>
|
||||
<a class="sourceLine" id="cb2-2" title="2">rack-rewrite</a>
|
||||
<a class="sourceLine" id="cb2-3" title="3">rack-contrib</a></code></pre></div>
|
||||
<p>Now, just follow the heroku tutorial to create an application :</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb3-1" title="1">git init</a>
|
||||
<a class="sourceLine" id="cb3-2" title="2">git add <span class="kw">.</span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3">heroku create</a>
|
||||
<a class="sourceLine" id="cb3-4" title="4">git push heroku master</a></code></pre></div>
|
||||
<p>Now I’ll should be able to redirect properly to my own 404 page for example. I hope it is helpful.</p>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p>I was inspired by this <a href="http://gmarik.info/blog/2010/05/10/blogging-with-jekyll-and-heroku-for-free">article</a>.<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-08-23-Now-heberged-on-heroku/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-08-23-Now-heberged-on-heroku/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-08-23
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,142 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - send mail from command line with attached file</title>
|
||||
<meta name="keywords" content="email, shell, web" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-08-31-send-mail-from-command-line-with-attached-file/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>send mail from command line with attached file</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I had to send a mail using only command line. I was surprised it isn’t straightforward at all. I didn’t had <code>pine</code> nor <code>mutt</code> or anything like that. Just <code>mail</code> and <code>mailx</code>.</p>
|
||||
<p>What Internet say (via google) is</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1">uuencode fic.jpg fic.jpg <span class="kw">|</span> mail -s <span class="st">'Subject'</span></a></code></pre></div>
|
||||
<p>I tried it. And it works almost each times. But for my file, it didn’t worked. I compressed it to <code>.gz</code>, <code>.bz2</code> and <code>.zip</code>. Using <code>.bz2</code> format it worked nicely, but not with other formats. Instead of having an attached file I saw this in my email.</p>
|
||||
<pre>
|
||||
begin 664 fic.jpg
|
||||
M(R$O=7-R+V)I;B]E;G8@>G-H"GAL<STD,0H*9F]R(&QI;F4@:6X@)"@\("1X M;',@*0H@("`@9&-R 20H96-H;R`D;&EN92!\(&%W:R`M1EP[("="[<')I;G0@" ... M93U<(FUO="-<(CX\=F%L=64^/&ET96T@;F%M93U<(F-T>%]M8UPB/BD\=F%L
|
||||
M=64O/B@\+VET96T^*2-<)#$\=F%L=64^)&ME>7=O<F1S/" ]V86QU93Y<)#(C end < pre>
|
||||
|
||||
Not really readable.
|
||||
After some research I found the solution.
|
||||
Use MIME instead of `uuencode`.
|
||||
|
||||
Finally I made it manually using `sendmail`.
|
||||
I didn" t dare to use `telnet`. The command to use is: ~~~~~~ {.zsh} sendmail -t -oi < mailcontent.txt ~~~~~~ Of course you need to create the `mailcontent.txt` file. It should contains: <pre>
|
||||
From: from@mail.com
|
||||
To: to@mail.com
|
||||
Subject: View the attached file
|
||||
Mime-Version: 1.0
|
||||
Content-Type: multipart/mixed; boundary="-"
|
||||
|
||||
This is a MIME encoded message. Decode it with "Decoder"
|
||||
or any other MIME reading software. Decoder is available
|
||||
at <http: www.etresoft.com>.
|
||||
---
|
||||
Content-Type: image/jpeg; name="fic.jpg"
|
||||
Content-Transfer-Encoding: base64
|
||||
Content-Disposition: inline; filename="fic.jpg"
|
||||
|
||||
H4sICB6Ke0wAA2Rjcl93aXRob3V0X2tleXdvcmQuY3N2ANSdW5ubOJPH7/e7
|
||||
7Brw+dmrTk8yk7yTSTaZeWd2b/TIIGy6MRAE7ng+/VaJgwF3g522SsxN2+3T
|
||||
/4eOJamqmARP+yibvI8ykUYim+x5EE2euBfIyd3byZ+fvvzr7svbu8ndTx/f
|
||||
...
|
||||
</pre>
|
||||
<p>And to obtain the “encoded” file in base64 I used:</p>
|
||||
<p><code classs="zsh"> uuencode -m fic.jpg fic.jpg ~~~~~~</p>
|
||||
<p>That is all. Sometimes technology is so easy to use. If I need it another time I should consider to make a shell script to automatize this.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-08-31-send-mail-from-command-line-with-attached-file/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-08-31-send-mail-from-command-line-with-attached-file/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-08-31
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
def gitmtime
|
||||
filepath=@item.path.sub('/Scratch/','content/html/').sub(/\/$/,'')
|
||||
ext=%{.#{@item[:extension]}}
|
||||
filepath<<=ext
|
||||
if not FileTest.exists?(filepath)
|
||||
filepath.sub!(ext,%{#{@item.raw_filename}#{ext}})
|
||||
end
|
||||
str=`git log -1 --format='%ci' -- #{filepath}`
|
||||
if str.nil? or str.empty?
|
||||
return Time.now
|
||||
else
|
||||
return DateTime.parse( str )
|
||||
end
|
||||
end
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Use git to calculate trusted mtimes</title>
|
||||
<meta name="keywords" content="nanoc, web, git" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-09-02-Use-git-to-calculate-trusted-mtimes/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Use git to calculate trusted mtimes</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>You can remark at the bottom of each page I provide a last modification date. This label was first calculated using the <code>mtime</code> of the file on the file system. But many times I modify this date just to force some recompilation. Therefore the date wasn’t a date of <em>real</em> modification.</p>
|
||||
<p>I use <a href="http://git-scm.org">git</a> to version my website. And fortunately I can know the last date of <em>real</em> change of a file. This is how I do this with <a href="http://nanoc.stoneship.org">nanoc</a>:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb1-1" title="1"><span class="kw">def</span> gitmtime</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"> filepath=<span class="ot">@item</span>.path.sub(<span class="st">'/Scratch/'</span>,<span class="st">'content/html/'</span>).sub(<span class="ot">/\/$/</span>,<span class="st">''</span>)</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> ext=<span class="ot">%{</span><span class="st">.</span><span class="ot">#{@item</span>[<span class="st">:extension</span>]<span class="ot">}}</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> filepath<<=ext</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="kw">if</span> <span class="kw">not</span> <span class="dt">FileTest</span>.exists?(filepath)</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> filepath.sub!(ext,<span class="ot">%{#{@item</span>.raw_filename<span class="ot">}#{</span>ext<span class="ot">}}</span>)</a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> str=<span class="st">`git log -1 --format='%ci' -- </span><span class="ot">#{</span>filepath<span class="ot">}</span><span class="st">`</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"> <span class="kw">if</span> str.nil? <span class="kw">or</span> str.empty?</a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"> <span class="kw">return</span> <span class="dt">Time</span>.now</a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"> <span class="kw">return</span> <span class="dt">DateTime</span>.parse( str )</a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"><span class="kw">end</span></a></code></pre></div>
|
||||
<p>Of course I know it is really slow and absolutely not optimized. But it works as expected. Now the date you see at the bottom is exactly the date I modified the <em>content</em> of the page.</p>
|
||||
<p><em>Edit</em>: Thanks to Eric Sunshine and Kris to provide me some hints at cleaning my code.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-09-02-Use-git-to-calculate-trusted-mtimes/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-09-02-Use-git-to-calculate-trusted-mtimes/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-09-02
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
|
||||
- (unsigned char *)sha1:(NSString *)baseString result:(unsigned char *)result {
|
||||
char *c_baseString=(char *)[baseString UTF8String];
|
||||
CC_SHA1(c_baseString, strlen(c_baseString), result);
|
||||
return result;
|
||||
}
|
||||
|
||||
- (NSString *)base64:(unsigned char *)result {
|
||||
NSString *password=[[NSString alloc] init];
|
||||
static const unsigned char cb64[65]="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
|
||||
for (int i=0; i<CC_SHA1_DIGEST_LENGTH; i+=3) {
|
||||
password=[password stringByAppendingFormat:@"%c%c%c%c",
|
||||
cb64[(result[i] &0xFC)>>2],
|
||||
cb64[((result[i] & 0x03) << 4)
|
||||
| ((result[i + 1] & 0xF0) >> 4)],
|
||||
cb64[((result[i + 1] & 0x0F) << 2)
|
||||
| ((result[i + 2] & 0xC0) >> 6)],
|
||||
cb64[result[i+2]&0x3F]
|
||||
];
|
||||
}
|
||||
return password;
|
||||
}
|
||||
|
||||
- (NSString *)hexadecimalRepresentation:(unsigned char *)result {
|
||||
NSString *password=[[NSString alloc] init];
|
||||
for (int i=0; i<CC_SHA1_DIGEST_LENGTH; i++) {
|
||||
password=[password stringByAppendingFormat:@"%02x", result[i]];
|
||||
}
|
||||
return password;
|
||||
}
|
||||
|
||||
- (NSString *)b64_sha1:(NSString *)inputString {
|
||||
unsigned char result[CC_SHA1_DIGEST_LENGTH+1];
|
||||
[self sha1:inputString result:result];
|
||||
return [self base64:result];
|
||||
}
|
||||
|
||||
- (NSString *)hex_sha1:(NSString *)inputString {
|
||||
unsigned char result[CC_SHA1_DIGEST_LENGTH+1];
|
||||
[self sha1:inputString result:result];
|
||||
return [self hexadecimalRepresentation:result];
|
||||
}
|
||||
|
|
@ -0,0 +1,155 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - base64 and sha1 on iPhone</title>
|
||||
<meta name="keywords" content="iPhone, ObjectiveC, programming" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-09-02-base64-and-sha1-on-iPhone/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>base64 and sha1 on iPhone</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Lets be straight: here are two functions to add to your code to have <code>base64</code> and <code>hexadecimal</code> version of the <code>sha1</code> hash of an NSString.</p>
|
||||
<p>To use it, simply copy the code in your class and use as this:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode objective-c"><code class="sourceCode objectivec"><a class="sourceLine" id="cb1-1" title="1"><span class="pp">#import </span><span class="im"><CommonCrypto/CommonDigest.h></span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">...</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3">NSString *b64_hash = [<span class="kw">self</span> b64_sha1:<span class="st">@"some NSString to be sha1'ed"</span>];</a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">...</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5">NSString *hex_hash = [<span class="kw">self</span> hex_sha1:<span class="st">@"some NSString to be sha1'ed"</span>];</a></code></pre></div>
|
||||
<p>The <code>base64</code> algorithm must be programmed by hand on iPhone!</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb2-1" title="1"></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2">- (<span class="dt">unsigned</span> <span class="dt">char</span> *)sha1:(NSString *)baseString result:(<span class="dt">unsigned</span> <span class="dt">char</span> *)result {</a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="dt">char</span> *c_baseString=(<span class="dt">char</span> *)[baseString UTF8String];</a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> CC_SHA1(c_baseString, strlen(c_baseString), result);</a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="cf">return</span> result;</a>
|
||||
<a class="sourceLine" id="cb2-6" title="6">}</a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8">- (NSString *)base64:(<span class="dt">unsigned</span> <span class="dt">char</span> *)result {</a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"> NSString *password=[[NSString alloc] init];</a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> <span class="dt">static</span> <span class="dt">const</span> <span class="dt">unsigned</span> <span class="dt">char</span> cb64[<span class="dv">65</span>]=<span class="st">"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"</span>;</a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> <span class="cf">for</span> (<span class="dt">int</span> i=<span class="dv">0</span>; i<CC_SHA1_DIGEST_LENGTH; i+=<span class="dv">3</span>) {</a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> password=[password stringByAppendingFormat:@<span class="st">"%c%c%c%c"</span>,</a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> cb64[(result[i] &<span class="bn">0xFC</span>)>><span class="dv">2</span>],</a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> cb64[((result[i] & <span class="bn">0x03</span>) << <span class="dv">4</span>)</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> | ((result[i + <span class="dv">1</span>] & <span class="bn">0xF0</span>) >> <span class="dv">4</span>)],</a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> cb64[((result[i + <span class="dv">1</span>] & <span class="bn">0x0F</span>) << <span class="dv">2</span>)</a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> | ((result[i + <span class="dv">2</span>] & <span class="bn">0xC0</span>) >> <span class="dv">6</span>)],</a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> cb64[result[i+<span class="dv">2</span>]&<span class="bn">0x3F</span>]</a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> ]; </a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"> }</a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"> <span class="cf">return</span> password;</a>
|
||||
<a class="sourceLine" id="cb2-22" title="22">}</a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"></a>
|
||||
<a class="sourceLine" id="cb2-24" title="24">- (NSString *)hexadecimalRepresentation:(<span class="dt">unsigned</span> <span class="dt">char</span> *)result {</a>
|
||||
<a class="sourceLine" id="cb2-25" title="25"> NSString *password=[[NSString alloc] init];</a>
|
||||
<a class="sourceLine" id="cb2-26" title="26"> <span class="cf">for</span> (<span class="dt">int</span> i=<span class="dv">0</span>; i<CC_SHA1_DIGEST_LENGTH; i++) {</a>
|
||||
<a class="sourceLine" id="cb2-27" title="27"> password=[password stringByAppendingFormat:@<span class="st">"%02x"</span>, result[i]];</a>
|
||||
<a class="sourceLine" id="cb2-28" title="28"> }</a>
|
||||
<a class="sourceLine" id="cb2-29" title="29"> <span class="cf">return</span> password;</a>
|
||||
<a class="sourceLine" id="cb2-30" title="30">}</a>
|
||||
<a class="sourceLine" id="cb2-31" title="31"></a>
|
||||
<a class="sourceLine" id="cb2-32" title="32">- (NSString *)b64_sha1:(NSString *)inputString {</a>
|
||||
<a class="sourceLine" id="cb2-33" title="33"> <span class="dt">unsigned</span> <span class="dt">char</span> result[CC_SHA1_DIGEST_LENGTH+<span class="dv">1</span>];</a>
|
||||
<a class="sourceLine" id="cb2-34" title="34"> [self sha1:inputString result:result];</a>
|
||||
<a class="sourceLine" id="cb2-35" title="35"> <span class="cf">return</span> [self base64:result];</a>
|
||||
<a class="sourceLine" id="cb2-36" title="36">}</a>
|
||||
<a class="sourceLine" id="cb2-37" title="37"></a>
|
||||
<a class="sourceLine" id="cb2-38" title="38">- (NSString *)hex_sha1:(NSString *)inputString {</a>
|
||||
<a class="sourceLine" id="cb2-39" title="39"> <span class="dt">unsigned</span> <span class="dt">char</span> result[CC_SHA1_DIGEST_LENGTH+<span class="dv">1</span>];</a>
|
||||
<a class="sourceLine" id="cb2-40" title="40"> [self sha1:inputString result:result];</a>
|
||||
<a class="sourceLine" id="cb2-41" title="41"> <span class="cf">return</span> [self hexadecimalRepresentation:result];</a>
|
||||
<a class="sourceLine" id="cb2-42" title="42">}</a></code></pre></div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-09-02-base64-and-sha1-on-iPhone/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-09-02-base64-and-sha1-on-iPhone/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-09-02
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - New Blog Design Constraints</title>
|
||||
<meta name="keywords" content="programming, blog" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-10-06-New-Blog-Design-Constraints/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>New Blog Design Constraints</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>I changed the design of my blog. Now it should be far cleaner. I believe I use no CSS3 feature and far less javascript. Of course before my website was perfectly browsable without javascript. Unfortunately some CSS3 feature are not mature enough on some browser. For more details you can read my older <a href="../../../../Scratch/en/blog/2010-07-07-CSS-rendering-problems-by-navigator">blog entry</a>. But the major problem came from, <code>font-shadow</code> and gradients. Then my new design obey to the following rules:</p>
|
||||
<ul>
|
||||
<li>no CSS element begining by ‘-moz’ or ‘-webkit’, etc…,</li>
|
||||
<li>no text shadow,</li>
|
||||
<li>clean (I mean delete) most javascript.</li>
|
||||
</ul>
|
||||
<p>I hope the new design please you.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-06-New-Blog-Design-Constraints/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-06-New-Blog-Design-Constraints/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-10-06
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,134 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Secure eMail on Mac in few steps</title>
|
||||
<meta name="keywords" content="security, S/MIME, email, mac" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-10-10-Secure-eMail-on-Mac-in-few-steps/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Secure eMail on Mac in few steps</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-10-10-Secure-eMail-on-Mac-in-few-steps/main.png" alt="Title image" />
|
||||
</div>
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span> <em>on Mac</em></p>
|
||||
<ul>
|
||||
<li>Get a certificate signed by a CA: <a href="http://www.instantssl.com/ssl-certificate-products/free-email-certificate.html">click here for a free one</a>,</li>
|
||||
<li>open the file,</li>
|
||||
<li>delete securely the file,</li>
|
||||
<li>use Mail instead of online gmail.</li>
|
||||
<li>???</li>
|
||||
<li>Profit</li>
|
||||
</ul>
|
||||
</div>
|
||||
<p>I’ve (re)discovered how to become S/MIME compliant. I am now suprised how easy it was. Some years ago it was far more difficult. Now I’m able to sign and encrypt my emails.</p>
|
||||
<h2 id="why-is-it-important">Why is it important?</h2>
|
||||
<p>Signing: it tell the other with an aboslute certitude the writer of the mail is <em>you</em> or at least used your computer.</p>
|
||||
<p>Encrypt: because sometimes you need to be 100% sure a conversation remains private.</p>
|
||||
<h2 id="how-to-proceed">How to proceed?</h2>
|
||||
<ul>
|
||||
<li>Get a certificate signed by a CA: <a href="http://www.instantssl.com/ssl-certificate-products/free-email-certificate.html">click here to get a free one</a>,</li>
|
||||
<li>open the file,</li>
|
||||
<li>empty your trash, put the file in the trash, secure empty trash,</li>
|
||||
<li>use Mail instead of online gmail. Now you should see these icons:
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2010-10-10-Secure-eMail-on-Mac-in-few-steps/sign_icon.png" alt="Sign icon" />
|
||||
</div></li>
|
||||
</ul>
|
||||
<p><em>n.b.</em>: if you use gmail, you and work not alway with a Mac, you should consider to try the <a href="https://addons.mozilla.org/firefox/addon/592">gmail S/MIME firefox addon</a>.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-10-Secure-eMail-on-Mac-in-few-steps/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-10-Secure-eMail-on-Mac-in-few-steps/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-10-10
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
#include <stdio.h>
|
||||
#include <stdlib.h>
|
||||
#include <stdint.h>
|
||||
|
||||
struct wavfile
|
||||
{
|
||||
char id[4]; // should always contain "RIFF"
|
||||
int totallength; // total file length minus 8
|
||||
char wavefmt[8]; // should be "WAVEfmt "
|
||||
int format; // 16 for PCM format
|
||||
short pcm; // 1 for PCM format
|
||||
short channels; // channels
|
||||
int frequency; // sampling frequency
|
||||
int bytes_per_second;
|
||||
short bytes_by_capture;
|
||||
short bits_per_sample;
|
||||
char data[4]; // should always contain "data"
|
||||
int bytes_in_data;
|
||||
};
|
||||
|
||||
int main(int argc, char *argv[]) {
|
||||
char *filename=argv[1];
|
||||
FILE *wav = fopen(filename,"rb");
|
||||
struct wavfile header;
|
||||
|
||||
if ( wav == NULL ) {
|
||||
fprintf(stderr,"Can't open input file %s", filename);
|
||||
exit(1);
|
||||
}
|
||||
|
||||
|
||||
// read header
|
||||
if ( fread(&header,sizeof(header),1,wav) < 1 )
|
||||
{
|
||||
fprintf(stderr,"Can't read file header\n");
|
||||
exit(1);
|
||||
}
|
||||
if ( header.id[0] != 'R'
|
||||
|| header.id[1] != 'I'
|
||||
|| header.id[2] != 'F'
|
||||
|| header.id[3] != 'F' ) {
|
||||
fprintf(stderr,"ERROR: Not wav format\n");
|
||||
exit(1);
|
||||
}
|
||||
|
||||
fprintf(stderr,"wav format\n");
|
||||
|
||||
// read data
|
||||
long sum=0;
|
||||
short value=0;
|
||||
while( fread(&value,sizeof(value),1,wav) ) {
|
||||
// fprintf(stderr,"%d\n", value);
|
||||
if (value<0) { value=-value; }
|
||||
sum += value;
|
||||
}
|
||||
printf("%ld\n",sum);
|
||||
exit(0);
|
||||
}
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
#!/usr/bin/env python
|
||||
from struct import calcsize, unpack
|
||||
from sys import argv, exit
|
||||
|
||||
def word_iter(f):
|
||||
while True:
|
||||
_bytes = f.read(2)
|
||||
|
||||
if len(_bytes) != 2:
|
||||
raise StopIteration
|
||||
|
||||
yield unpack("=h", _bytes)[0]
|
||||
|
||||
try:
|
||||
with open(argv[1], "rb") as f:
|
||||
wav = "=4ci8cihhiihh4ci"
|
||||
wav_size = calcsize(wav)
|
||||
metadata = unpack(wav, f.read(wav_size))
|
||||
|
||||
if "".join(metadata[:4]) != "RIFF":
|
||||
print "error: not wav file."
|
||||
exit(1)
|
||||
|
||||
print sum(abs(word) for word in word_iter(f))
|
||||
except IOError:
|
||||
print "error: can't open input file '%s'." % argv[1]
|
||||
exit(1)
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
data = ARGF.read
|
||||
keys = %w[id totallength wavefmt format
|
||||
pcm channels frequency bytes_per_second
|
||||
bytes_by_capture bits_per_sample
|
||||
data bytes_in_data sum
|
||||
]
|
||||
values = data.unpack 'Z4 i Z8 i s s i i s s Z4 i s*'
|
||||
sum = values.drop(12).map(&:abs).inject(:+)
|
||||
keys.zip(values.take(12) << sum) {|k, v|
|
||||
puts "#{k.ljust 17}: #{v}"
|
||||
}
|
||||
|
|
@ -0,0 +1,106 @@
|
|||
#include <stdio.h>
|
||||
#include <stdlib.h>
|
||||
#include <string.h> // for memcmp
|
||||
#include <stdint.h> // for int16_t and int32_t
|
||||
|
||||
struct wavfile
|
||||
{
|
||||
char id[4]; // should always contain "RIFF"
|
||||
int32_t totallength; // total file length minus 8
|
||||
char wavefmt[8]; // should be "WAVEfmt "
|
||||
int32_t format; // 16 for PCM format
|
||||
int16_t pcm; // 1 for PCM format
|
||||
int16_t channels; // channels
|
||||
int32_t frequency; // sampling frequency
|
||||
int32_t bytes_per_second;
|
||||
int16_t bytes_by_capture;
|
||||
int16_t bits_per_sample;
|
||||
char data[4]; // should always contain "data"
|
||||
int32_t bytes_in_data;
|
||||
} __attribute__((__packed__));
|
||||
|
||||
int is_big_endian(void) {
|
||||
union {
|
||||
uint32_t i;
|
||||
char c[4];
|
||||
} bint = {0x01000000};
|
||||
return bint.c[0]==1;
|
||||
}
|
||||
|
||||
int main(int argc, char *argv[]) {
|
||||
char *filename=argv[1];
|
||||
FILE *wav = fopen(filename,"rb");
|
||||
struct wavfile header;
|
||||
|
||||
if ( wav == NULL ) {
|
||||
fprintf(stderr,"Can't open input file %s\n", filename);
|
||||
exit(1);
|
||||
}
|
||||
|
||||
|
||||
// read header
|
||||
if ( fread(&header,sizeof(header),1,wav) < 1 ) {
|
||||
fprintf(stderr,"Can't read input file header %s\n", filename);
|
||||
exit(1);
|
||||
}
|
||||
|
||||
// if wav file isn't the same endianness than the current environment
|
||||
// we quit
|
||||
if ( is_big_endian() ) {
|
||||
if ( memcmp( header.id,"RIFX", 4) != 0 ) {
|
||||
fprintf(stderr,"ERROR: %s is not a big endian wav file\n", filename);
|
||||
exit(1);
|
||||
}
|
||||
} else {
|
||||
if ( memcmp( header.id,"RIFF", 4) != 0 ) {
|
||||
fprintf(stderr,"ERROR: %s is not a little endian wav file\n", filename);
|
||||
exit(1);
|
||||
}
|
||||
}
|
||||
|
||||
if ( memcmp( header.wavefmt, "WAVEfmt ", 8) != 0
|
||||
|| memcmp( header.data, "data", 4) != 0
|
||||
) {
|
||||
fprintf(stderr,"ERROR: Not wav format\n");
|
||||
exit(1);
|
||||
}
|
||||
if (header.format != 16) {
|
||||
fprintf(stderr,"\nERROR: not 16 bit wav format.");
|
||||
exit(1);
|
||||
}
|
||||
fprintf(stderr,"format: %d bits", header.format);
|
||||
if (header.format == 16) {
|
||||
fprintf(stderr,", PCM");
|
||||
} else {
|
||||
fprintf(stderr,", not PCM (%d)", header.format);
|
||||
}
|
||||
if (header.pcm == 1) {
|
||||
fprintf(stderr, " uncompressed" );
|
||||
} else {
|
||||
fprintf(stderr, " compressed" );
|
||||
}
|
||||
fprintf(stderr,", channel %d", header.pcm);
|
||||
fprintf(stderr,", freq %d", header.frequency );
|
||||
fprintf(stderr,", %d bytes per sec", header.bytes_per_second );
|
||||
fprintf(stderr,", %d bytes by capture", header.bytes_by_capture );
|
||||
fprintf(stderr,", %d bits per sample", header.bytes_by_capture );
|
||||
fprintf(stderr,"\n" );
|
||||
|
||||
if ( memcmp( header.data, "data", 4) != 0 ) {
|
||||
fprintf(stderr,"ERROR: Prrroblem?\n");
|
||||
exit(1);
|
||||
}
|
||||
fprintf(stderr,"wav format\n");
|
||||
|
||||
// read data
|
||||
long long sum=0;
|
||||
int16_t value;
|
||||
int i=0;
|
||||
fprintf(stderr,"---\n", value);
|
||||
while( fread(&value,sizeof(value),1,wav) ) {
|
||||
if (value<0) { value=-value; }
|
||||
sum += value;
|
||||
}
|
||||
printf("%lld\n",sum);
|
||||
exit(0);
|
||||
}
|
||||
|
|
@ -0,0 +1,351 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Fun with wav</title>
|
||||
<meta name="keywords" content="wav, C, format, programming" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-10-14-Fun-with-wav/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Fun with wav</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span> Played to process a <code>wav</code> file. <code>C</code> was easier and cleaner than Ruby.</p>
|
||||
<p>edit: I wanted this program to work only on one specific machine (a x86 on a 32 bit Ubuntu). Therefore I didn’t had any portability consideration. This is only a <em>hack</em>.</p>
|
||||
</div>
|
||||
<p>I had to compute the sum of the absolute values of data of a <code>.wav</code> file. For efficiency (and fun) reasons, I had chosen <code>C</code> language.</p>
|
||||
<p>I didn’t programmed in <code>C</code> for a long time. From my memory it was a pain to read and write to files. But in the end I was really impressed by the code I get. It was really clean. This is even more impressive knowing I used mostly low level functions.</p>
|
||||
<p>A <code>wav</code> file has an header containing many metadata. This header was optimized to take as few space as possible. The header is then a block of packed bytes.</p>
|
||||
<ul>
|
||||
<li>The 4th first bytes must contains <code>RIFF</code> in ASCII,</li>
|
||||
<li>the following 4th Bytes is an 32 bits integer giving the size of the file minus 8, etc…</li>
|
||||
</ul>
|
||||
<p>Surprisingly, I believe that reading this kind of file is easier in <code>C</code> than in most higher level language. Proof: I only have to search on the web the complete header format and write it in a struct.</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb1-1" title="1"><span class="kw">struct</span> wavfile</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">{</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="dt">char</span> id[<span class="dv">4</span>]; <span class="co">// should always contain "RIFF"</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> <span class="dt">int</span> totallength; <span class="co">// total file length minus 8</span></a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"> <span class="dt">char</span> wavefmt[<span class="dv">8</span>]; <span class="co">// should be "WAVEfmt "</span></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="dt">int</span> format; <span class="co">// 16 for PCM format</span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="dt">short</span> pcm; <span class="co">// 1 for PCM format</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> <span class="dt">short</span> channels; <span class="co">// channels</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"> <span class="dt">int</span> frequency; <span class="co">// sampling frequency</span></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"> <span class="dt">int</span> bytes_per_second;</a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"> <span class="dt">short</span> bytes_by_capture;</a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"> <span class="dt">short</span> bits_per_sample;</a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"> <span class="dt">char</span> data[<span class="dv">4</span>]; <span class="co">// should always contain "data"</span></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"> <span class="dt">int</span> bytes_in_data;</a>
|
||||
<a class="sourceLine" id="cb1-15" title="15">};</a></code></pre></div>
|
||||
<p>To read this kind of data in Ruby, I certainly had to write a block of code for each element in the struct. But in <code>C</code> I simply written:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb2-1" title="1">fread(&header,<span class="kw">sizeof</span>(header),<span class="dv">1</span>,wav)</a></code></pre></div>
|
||||
<p>Only one step to fill my data structure. Magic!</p>
|
||||
<p>Then, get an int value coded on two Bytes is also not a natural operation for high level language. In <code>C</code>, to read a sequence of 2 Bytes numbers I only had to write:</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb3-1" title="1"><span class="dt">short</span> value=<span class="dv">0</span>;</a>
|
||||
<a class="sourceLine" id="cb3-2" title="2"><span class="cf">while</span>( fread(&value,<span class="kw">sizeof</span>(value),<span class="dv">1</span>,wav) ) {</a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"> <span class="co">// do something with value</span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4">}</a></code></pre></div>
|
||||
<p>Finally I ended with the following code. Remark I know the wav format (16 bit / 48000Hz):</p>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb4-1" title="1"><span class="pp">#include </span><span class="im"><stdio.h></span></a>
|
||||
<a class="sourceLine" id="cb4-2" title="2"><span class="pp">#include </span><span class="im"><stdlib.h></span></a>
|
||||
<a class="sourceLine" id="cb4-3" title="3"><span class="pp">#include </span><span class="im"><stdint.h></span></a>
|
||||
<a class="sourceLine" id="cb4-4" title="4"></a>
|
||||
<a class="sourceLine" id="cb4-5" title="5"><span class="kw">struct</span> wavfile</a>
|
||||
<a class="sourceLine" id="cb4-6" title="6">{</a>
|
||||
<a class="sourceLine" id="cb4-7" title="7"> <span class="dt">char</span> id[<span class="dv">4</span>]; <span class="co">// should always contain "RIFF"</span></a>
|
||||
<a class="sourceLine" id="cb4-8" title="8"> <span class="dt">int</span> totallength; <span class="co">// total file length minus 8</span></a>
|
||||
<a class="sourceLine" id="cb4-9" title="9"> <span class="dt">char</span> wavefmt[<span class="dv">8</span>]; <span class="co">// should be "WAVEfmt "</span></a>
|
||||
<a class="sourceLine" id="cb4-10" title="10"> <span class="dt">int</span> format; <span class="co">// 16 for PCM format</span></a>
|
||||
<a class="sourceLine" id="cb4-11" title="11"> <span class="dt">short</span> pcm; <span class="co">// 1 for PCM format</span></a>
|
||||
<a class="sourceLine" id="cb4-12" title="12"> <span class="dt">short</span> channels; <span class="co">// channels</span></a>
|
||||
<a class="sourceLine" id="cb4-13" title="13"> <span class="dt">int</span> frequency; <span class="co">// sampling frequency</span></a>
|
||||
<a class="sourceLine" id="cb4-14" title="14"> <span class="dt">int</span> bytes_per_second;</a>
|
||||
<a class="sourceLine" id="cb4-15" title="15"> <span class="dt">short</span> bytes_by_capture;</a>
|
||||
<a class="sourceLine" id="cb4-16" title="16"> <span class="dt">short</span> bits_per_sample;</a>
|
||||
<a class="sourceLine" id="cb4-17" title="17"> <span class="dt">char</span> data[<span class="dv">4</span>]; <span class="co">// should always contain "data"</span></a>
|
||||
<a class="sourceLine" id="cb4-18" title="18"> <span class="dt">int</span> bytes_in_data;</a>
|
||||
<a class="sourceLine" id="cb4-19" title="19">};</a>
|
||||
<a class="sourceLine" id="cb4-20" title="20"></a>
|
||||
<a class="sourceLine" id="cb4-21" title="21"><span class="dt">int</span> main(<span class="dt">int</span> argc, <span class="dt">char</span> *argv[]) {</a>
|
||||
<a class="sourceLine" id="cb4-22" title="22"> <span class="dt">char</span> *filename=argv[<span class="dv">1</span>];</a>
|
||||
<a class="sourceLine" id="cb4-23" title="23"> <span class="dt">FILE</span> *wav = fopen(filename,<span class="st">"rb"</span>);</a>
|
||||
<a class="sourceLine" id="cb4-24" title="24"> <span class="kw">struct</span> wavfile header;</a>
|
||||
<a class="sourceLine" id="cb4-25" title="25"></a>
|
||||
<a class="sourceLine" id="cb4-26" title="26"> <span class="cf">if</span> ( wav == NULL ) {</a>
|
||||
<a class="sourceLine" id="cb4-27" title="27"> fprintf(stderr,<span class="st">"Can't open input file %s"</span>, filename);</a>
|
||||
<a class="sourceLine" id="cb4-28" title="28"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb4-29" title="29"> }</a>
|
||||
<a class="sourceLine" id="cb4-30" title="30"></a>
|
||||
<a class="sourceLine" id="cb4-31" title="31"> <span class="co">// read header</span></a>
|
||||
<a class="sourceLine" id="cb4-32" title="32"> <span class="cf">if</span> ( fread(&header,<span class="kw">sizeof</span>(header),<span class="dv">1</span>,wav) < <span class="dv">1</span> )</a>
|
||||
<a class="sourceLine" id="cb4-33" title="33"> {</a>
|
||||
<a class="sourceLine" id="cb4-34" title="34"> fprintf(stderr,<span class="st">"Can't read file header</span><span class="sc">\n</span><span class="st">"</span>);</a>
|
||||
<a class="sourceLine" id="cb4-35" title="35"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb4-36" title="36"> }</a>
|
||||
<a class="sourceLine" id="cb4-37" title="37"> <span class="cf">if</span> ( header.id[<span class="dv">0</span>] != <span class="ch">'R'</span></a>
|
||||
<a class="sourceLine" id="cb4-38" title="38"> || header.id[<span class="dv">1</span>] != <span class="ch">'I'</span> </a>
|
||||
<a class="sourceLine" id="cb4-39" title="39"> || header.id[<span class="dv">2</span>] != <span class="ch">'F'</span> </a>
|
||||
<a class="sourceLine" id="cb4-40" title="40"> || header.id[<span class="dv">3</span>] != <span class="ch">'F'</span> ) { </a>
|
||||
<a class="sourceLine" id="cb4-41" title="41"> fprintf(stderr,<span class="st">"ERROR: Not wav format</span><span class="sc">\n</span><span class="st">"</span>); </a>
|
||||
<a class="sourceLine" id="cb4-42" title="42"> exit(<span class="dv">1</span>); </a>
|
||||
<a class="sourceLine" id="cb4-43" title="43"> }</a>
|
||||
<a class="sourceLine" id="cb4-44" title="44"></a>
|
||||
<a class="sourceLine" id="cb4-45" title="45"> fprintf(stderr,<span class="st">"wav format</span><span class="sc">\n</span><span class="st">"</span>);</a>
|
||||
<a class="sourceLine" id="cb4-46" title="46"></a>
|
||||
<a class="sourceLine" id="cb4-47" title="47"> <span class="co">// read data</span></a>
|
||||
<a class="sourceLine" id="cb4-48" title="48"> <span class="dt">long</span> sum=<span class="dv">0</span>;</a>
|
||||
<a class="sourceLine" id="cb4-49" title="49"> <span class="dt">short</span> value=<span class="dv">0</span>;</a>
|
||||
<a class="sourceLine" id="cb4-50" title="50"> <span class="cf">while</span>( fread(&value,<span class="kw">sizeof</span>(value),<span class="dv">1</span>,wav) ) {</a>
|
||||
<a class="sourceLine" id="cb4-51" title="51"> <span class="co">// fprintf(stderr,"%d\n", value);</span></a>
|
||||
<a class="sourceLine" id="cb4-52" title="52"> <span class="cf">if</span> (value<<span class="dv">0</span>) { value=-value; }</a>
|
||||
<a class="sourceLine" id="cb4-53" title="53"> sum += value;</a>
|
||||
<a class="sourceLine" id="cb4-54" title="54"> }</a>
|
||||
<a class="sourceLine" id="cb4-55" title="55"> printf(<span class="st">"%ld</span><span class="sc">\n</span><span class="st">"</span>,sum);</a>
|
||||
<a class="sourceLine" id="cb4-56" title="56"> exit(<span class="dv">0</span>);</a>
|
||||
<a class="sourceLine" id="cb4-57" title="57">}</a></code></pre></div>
|
||||
<p>Of course it is only a hack. But we can see how easy and clean it should be to improve. As I say often: the right tool for your need instead of the same tool for all your needs. Because here <code>C</code> is clearly far superior than Ruby to handle this simple tasks.</p>
|
||||
<p>I am curious to know if somebody know a nice way to do this with Ruby or Python.</p>
|
||||
<p><em>edit: for compatibility reasons (64bit machines) used <code>int16_t</code> instead of <code>short</code> and <code>int</code> instead of <code>int</code>.</em></p>
|
||||
<div class="intro">
|
||||
<p>Edit (2): after most consideration about portability I made an <em>hopefully</em> more portable version. But I must confess this task was a bit tedious. The code remain as readable as before. But I had to use some compiler specific declaration to force the structure to be packed:</p>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb5-1" title="1">__attribute__((__packed__))</a></code></pre></div>
|
||||
<p>Therefore this implementation should for big and little endian architecture. However, it must be compiled with <code>gcc</code>. The new code make more tests but still don’t use <code>mmap</code>. Here it is:</p>
|
||||
</div>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode c"><code class="sourceCode c"><a class="sourceLine" id="cb6-1" title="1"><span class="pp">#include </span><span class="im"><stdio.h></span></a>
|
||||
<a class="sourceLine" id="cb6-2" title="2"><span class="pp">#include </span><span class="im"><stdlib.h></span></a>
|
||||
<a class="sourceLine" id="cb6-3" title="3"><span class="pp">#include </span><span class="im"><string.h></span><span class="pp"> </span><span class="co">// for memcmp</span></a>
|
||||
<a class="sourceLine" id="cb6-4" title="4"><span class="pp">#include </span><span class="im"><stdint.h></span><span class="pp"> </span><span class="co">// for int16_t and int32_t</span></a>
|
||||
<a class="sourceLine" id="cb6-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb6-6" title="6"><span class="kw">struct</span> wavfile</a>
|
||||
<a class="sourceLine" id="cb6-7" title="7">{</a>
|
||||
<a class="sourceLine" id="cb6-8" title="8"> <span class="dt">char</span> id[<span class="dv">4</span>]; <span class="co">// should always contain "RIFF"</span></a>
|
||||
<a class="sourceLine" id="cb6-9" title="9"> <span class="dt">int32_t</span> totallength; <span class="co">// total file length minus 8</span></a>
|
||||
<a class="sourceLine" id="cb6-10" title="10"> <span class="dt">char</span> wavefmt[<span class="dv">8</span>]; <span class="co">// should be "WAVEfmt "</span></a>
|
||||
<a class="sourceLine" id="cb6-11" title="11"> <span class="dt">int32_t</span> format; <span class="co">// 16 for PCM format</span></a>
|
||||
<a class="sourceLine" id="cb6-12" title="12"> <span class="dt">int16_t</span> pcm; <span class="co">// 1 for PCM format</span></a>
|
||||
<a class="sourceLine" id="cb6-13" title="13"> <span class="dt">int16_t</span> channels; <span class="co">// channels</span></a>
|
||||
<a class="sourceLine" id="cb6-14" title="14"> <span class="dt">int32_t</span> frequency; <span class="co">// sampling frequency</span></a>
|
||||
<a class="sourceLine" id="cb6-15" title="15"> <span class="dt">int32_t</span> bytes_per_second;</a>
|
||||
<a class="sourceLine" id="cb6-16" title="16"> <span class="dt">int16_t</span> bytes_by_capture;</a>
|
||||
<a class="sourceLine" id="cb6-17" title="17"> <span class="dt">int16_t</span> bits_per_sample;</a>
|
||||
<a class="sourceLine" id="cb6-18" title="18"> <span class="dt">char</span> data[<span class="dv">4</span>]; <span class="co">// should always contain "data"</span></a>
|
||||
<a class="sourceLine" id="cb6-19" title="19"> <span class="dt">int32_t</span> bytes_in_data;</a>
|
||||
<a class="sourceLine" id="cb6-20" title="20">} __attribute__((__packed__));</a>
|
||||
<a class="sourceLine" id="cb6-21" title="21"></a>
|
||||
<a class="sourceLine" id="cb6-22" title="22"><span class="dt">int</span> is_big_endian(<span class="dt">void</span>) {</a>
|
||||
<a class="sourceLine" id="cb6-23" title="23"> <span class="kw">union</span> {</a>
|
||||
<a class="sourceLine" id="cb6-24" title="24"> <span class="dt">uint32_t</span> i;</a>
|
||||
<a class="sourceLine" id="cb6-25" title="25"> <span class="dt">char</span> c[<span class="dv">4</span>];</a>
|
||||
<a class="sourceLine" id="cb6-26" title="26"> } bint = {<span class="bn">0x01000000</span>};</a>
|
||||
<a class="sourceLine" id="cb6-27" title="27"> <span class="cf">return</span> bint.c[<span class="dv">0</span>]==<span class="dv">1</span>;</a>
|
||||
<a class="sourceLine" id="cb6-28" title="28">}</a>
|
||||
<a class="sourceLine" id="cb6-29" title="29"></a>
|
||||
<a class="sourceLine" id="cb6-30" title="30"><span class="dt">int</span> main(<span class="dt">int</span> argc, <span class="dt">char</span> *argv[]) {</a>
|
||||
<a class="sourceLine" id="cb6-31" title="31"> <span class="dt">char</span> *filename=argv[<span class="dv">1</span>];</a>
|
||||
<a class="sourceLine" id="cb6-32" title="32"> <span class="dt">FILE</span> *wav = fopen(filename,<span class="st">"rb"</span>);</a>
|
||||
<a class="sourceLine" id="cb6-33" title="33"> <span class="kw">struct</span> wavfile header;</a>
|
||||
<a class="sourceLine" id="cb6-34" title="34"></a>
|
||||
<a class="sourceLine" id="cb6-35" title="35"> <span class="cf">if</span> ( wav == NULL ) {</a>
|
||||
<a class="sourceLine" id="cb6-36" title="36"> fprintf(stderr,<span class="st">"Can't open input file %s</span><span class="sc">\n</span><span class="st">"</span>, filename);</a>
|
||||
<a class="sourceLine" id="cb6-37" title="37"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb6-38" title="38"> }</a>
|
||||
<a class="sourceLine" id="cb6-39" title="39"></a>
|
||||
<a class="sourceLine" id="cb6-40" title="40"> <span class="co">// read header</span></a>
|
||||
<a class="sourceLine" id="cb6-41" title="41"> <span class="cf">if</span> ( fread(&header,<span class="kw">sizeof</span>(header),<span class="dv">1</span>,wav) < <span class="dv">1</span> ) {</a>
|
||||
<a class="sourceLine" id="cb6-42" title="42"> fprintf(stderr,<span class="st">"Can't read input file header %s</span><span class="sc">\n</span><span class="st">"</span>, filename);</a>
|
||||
<a class="sourceLine" id="cb6-43" title="43"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb6-44" title="44"> }</a>
|
||||
<a class="sourceLine" id="cb6-45" title="45"></a>
|
||||
<a class="sourceLine" id="cb6-46" title="46"> <span class="co">// if wav file isn't the same endianness than the current environment</span></a>
|
||||
<a class="sourceLine" id="cb6-47" title="47"> <span class="co">// we quit</span></a>
|
||||
<a class="sourceLine" id="cb6-48" title="48"> <span class="cf">if</span> ( is_big_endian() ) {</a>
|
||||
<a class="sourceLine" id="cb6-49" title="49"> <span class="cf">if</span> ( memcmp( header.id,<span class="st">"RIFX"</span>, <span class="dv">4</span>) != <span class="dv">0</span> ) {</a>
|
||||
<a class="sourceLine" id="cb6-50" title="50"> fprintf(stderr,<span class="st">"ERROR: %s is not a big endian wav file</span><span class="sc">\n</span><span class="st">"</span>, filename); </a>
|
||||
<a class="sourceLine" id="cb6-51" title="51"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb6-52" title="52"> }</a>
|
||||
<a class="sourceLine" id="cb6-53" title="53"> } <span class="cf">else</span> {</a>
|
||||
<a class="sourceLine" id="cb6-54" title="54"> <span class="cf">if</span> ( memcmp( header.id,<span class="st">"RIFF"</span>, <span class="dv">4</span>) != <span class="dv">0</span> ) {</a>
|
||||
<a class="sourceLine" id="cb6-55" title="55"> fprintf(stderr,<span class="st">"ERROR: %s is not a little endian wav file</span><span class="sc">\n</span><span class="st">"</span>, filename); </a>
|
||||
<a class="sourceLine" id="cb6-56" title="56"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb6-57" title="57"> }</a>
|
||||
<a class="sourceLine" id="cb6-58" title="58"> }</a>
|
||||
<a class="sourceLine" id="cb6-59" title="59"></a>
|
||||
<a class="sourceLine" id="cb6-60" title="60"> <span class="cf">if</span> ( memcmp( header.wavefmt, <span class="st">"WAVEfmt "</span>, <span class="dv">8</span>) != <span class="dv">0</span> </a>
|
||||
<a class="sourceLine" id="cb6-61" title="61"> || memcmp( header.data, <span class="st">"data"</span>, <span class="dv">4</span>) != <span class="dv">0</span> </a>
|
||||
<a class="sourceLine" id="cb6-62" title="62"> ) {</a>
|
||||
<a class="sourceLine" id="cb6-63" title="63"> fprintf(stderr,<span class="st">"ERROR: Not wav format</span><span class="sc">\n</span><span class="st">"</span>); </a>
|
||||
<a class="sourceLine" id="cb6-64" title="64"> exit(<span class="dv">1</span>); </a>
|
||||
<a class="sourceLine" id="cb6-65" title="65"> }</a>
|
||||
<a class="sourceLine" id="cb6-66" title="66"> <span class="cf">if</span> (header.format != <span class="dv">16</span>) {</a>
|
||||
<a class="sourceLine" id="cb6-67" title="67"> fprintf(stderr,<span class="st">"</span><span class="sc">\n</span><span class="st">ERROR: not 16 bit wav format."</span>);</a>
|
||||
<a class="sourceLine" id="cb6-68" title="68"> exit(<span class="dv">1</span>);</a>
|
||||
<a class="sourceLine" id="cb6-69" title="69"> }</a>
|
||||
<a class="sourceLine" id="cb6-70" title="70"> fprintf(stderr,<span class="st">"format: %d bits"</span>, header.format);</a>
|
||||
<a class="sourceLine" id="cb6-71" title="71"> <span class="cf">if</span> (header.format == <span class="dv">16</span>) {</a>
|
||||
<a class="sourceLine" id="cb6-72" title="72"> fprintf(stderr,<span class="st">", PCM"</span>);</a>
|
||||
<a class="sourceLine" id="cb6-73" title="73"> } <span class="cf">else</span> {</a>
|
||||
<a class="sourceLine" id="cb6-74" title="74"> fprintf(stderr,<span class="st">", not PCM (%d)"</span>, header.format);</a>
|
||||
<a class="sourceLine" id="cb6-75" title="75"> }</a>
|
||||
<a class="sourceLine" id="cb6-76" title="76"> <span class="cf">if</span> (header.pcm == <span class="dv">1</span>) {</a>
|
||||
<a class="sourceLine" id="cb6-77" title="77"> fprintf(stderr, <span class="st">" uncompressed"</span> );</a>
|
||||
<a class="sourceLine" id="cb6-78" title="78"> } <span class="cf">else</span> {</a>
|
||||
<a class="sourceLine" id="cb6-79" title="79"> fprintf(stderr, <span class="st">" compressed"</span> );</a>
|
||||
<a class="sourceLine" id="cb6-80" title="80"> }</a>
|
||||
<a class="sourceLine" id="cb6-81" title="81"> fprintf(stderr,<span class="st">", channel %d"</span>, header.pcm);</a>
|
||||
<a class="sourceLine" id="cb6-82" title="82"> fprintf(stderr,<span class="st">", freq %d"</span>, header.frequency );</a>
|
||||
<a class="sourceLine" id="cb6-83" title="83"> fprintf(stderr,<span class="st">", %d bytes per sec"</span>, header.bytes_per_second );</a>
|
||||
<a class="sourceLine" id="cb6-84" title="84"> fprintf(stderr,<span class="st">", %d bytes by capture"</span>, header.bytes_by_capture );</a>
|
||||
<a class="sourceLine" id="cb6-85" title="85"> fprintf(stderr,<span class="st">", %d bits per sample"</span>, header.bytes_by_capture );</a>
|
||||
<a class="sourceLine" id="cb6-86" title="86"> fprintf(stderr,<span class="st">"</span><span class="sc">\n</span><span class="st">"</span> );</a>
|
||||
<a class="sourceLine" id="cb6-87" title="87"></a>
|
||||
<a class="sourceLine" id="cb6-88" title="88"> <span class="cf">if</span> ( memcmp( header.data, <span class="st">"data"</span>, <span class="dv">4</span>) != <span class="dv">0</span> ) { </a>
|
||||
<a class="sourceLine" id="cb6-89" title="89"> fprintf(stderr,<span class="st">"ERROR: Prrroblem?</span><span class="sc">\n</span><span class="st">"</span>); </a>
|
||||
<a class="sourceLine" id="cb6-90" title="90"> exit(<span class="dv">1</span>); </a>
|
||||
<a class="sourceLine" id="cb6-91" title="91"> }</a>
|
||||
<a class="sourceLine" id="cb6-92" title="92"> fprintf(stderr,<span class="st">"wav format</span><span class="sc">\n</span><span class="st">"</span>);</a>
|
||||
<a class="sourceLine" id="cb6-93" title="93"></a>
|
||||
<a class="sourceLine" id="cb6-94" title="94"> <span class="co">// read data</span></a>
|
||||
<a class="sourceLine" id="cb6-95" title="95"> <span class="dt">long</span> <span class="dt">long</span> sum=<span class="dv">0</span>;</a>
|
||||
<a class="sourceLine" id="cb6-96" title="96"> <span class="dt">int16_t</span> value;</a>
|
||||
<a class="sourceLine" id="cb6-97" title="97"> <span class="dt">int</span> i=<span class="dv">0</span>;</a>
|
||||
<a class="sourceLine" id="cb6-98" title="98"> fprintf(stderr,<span class="st">"---</span><span class="sc">\n</span><span class="st">"</span>, value);</a>
|
||||
<a class="sourceLine" id="cb6-99" title="99"> <span class="cf">while</span>( fread(&value,<span class="kw">sizeof</span>(value),<span class="dv">1</span>,wav) ) {</a>
|
||||
<a class="sourceLine" id="cb6-100" title="100"> <span class="cf">if</span> (value<<span class="dv">0</span>) { value=-value; }</a>
|
||||
<a class="sourceLine" id="cb6-101" title="101"> sum += value;</a>
|
||||
<a class="sourceLine" id="cb6-102" title="102"> }</a>
|
||||
<a class="sourceLine" id="cb6-103" title="103"> printf(<span class="st">"%lld</span><span class="sc">\n</span><span class="st">"</span>,sum);</a>
|
||||
<a class="sourceLine" id="cb6-104" title="104"> exit(<span class="dv">0</span>);</a>
|
||||
<a class="sourceLine" id="cb6-105" title="105">}</a></code></pre></div>
|
||||
<p><em>Edit(3)</em>: On <a href="http://reddit.com">reddit</a> <a href="http://www.reddit.com/user/Bogdanp">Bogdanp</a> proposed a Python version:</p>
|
||||
<div class="sourceCode" id="cb7"><pre class="sourceCode python"><code class="sourceCode python"><a class="sourceLine" id="cb7-1" title="1"><span class="co">#!/usr/bin/env python</span></a>
|
||||
<a class="sourceLine" id="cb7-2" title="2"><span class="im">from</span> struct <span class="im">import</span> calcsize, unpack</a>
|
||||
<a class="sourceLine" id="cb7-3" title="3"><span class="im">from</span> sys <span class="im">import</span> argv, exit</a>
|
||||
<a class="sourceLine" id="cb7-4" title="4"></a>
|
||||
<a class="sourceLine" id="cb7-5" title="5"><span class="kw">def</span> word_iter(f):</a>
|
||||
<a class="sourceLine" id="cb7-6" title="6"> <span class="cf">while</span> <span class="va">True</span>:</a>
|
||||
<a class="sourceLine" id="cb7-7" title="7"> _bytes <span class="op">=</span> f.read(<span class="dv">2</span>)</a>
|
||||
<a class="sourceLine" id="cb7-8" title="8"></a>
|
||||
<a class="sourceLine" id="cb7-9" title="9"> <span class="cf">if</span> <span class="bu">len</span>(_bytes) <span class="op">!=</span> <span class="dv">2</span>:</a>
|
||||
<a class="sourceLine" id="cb7-10" title="10"> <span class="cf">raise</span> <span class="pp">StopIteration</span></a>
|
||||
<a class="sourceLine" id="cb7-11" title="11"></a>
|
||||
<a class="sourceLine" id="cb7-12" title="12"> <span class="cf">yield</span> unpack(<span class="st">"=h"</span>, _bytes)[<span class="dv">0</span>]</a>
|
||||
<a class="sourceLine" id="cb7-13" title="13"></a>
|
||||
<a class="sourceLine" id="cb7-14" title="14"><span class="cf">try</span>:</a>
|
||||
<a class="sourceLine" id="cb7-15" title="15"> <span class="cf">with</span> <span class="bu">open</span>(argv[<span class="dv">1</span>], <span class="st">"rb"</span>) <span class="im">as</span> f:</a>
|
||||
<a class="sourceLine" id="cb7-16" title="16"> wav <span class="op">=</span> <span class="st">"=4ci8cihhiihh4ci"</span></a>
|
||||
<a class="sourceLine" id="cb7-17" title="17"> wav_size <span class="op">=</span> calcsize(wav)</a>
|
||||
<a class="sourceLine" id="cb7-18" title="18"> metadata <span class="op">=</span> unpack(wav, f.read(wav_size))</a>
|
||||
<a class="sourceLine" id="cb7-19" title="19"></a>
|
||||
<a class="sourceLine" id="cb7-20" title="20"> <span class="cf">if</span> <span class="st">""</span>.join(metadata[:<span class="dv">4</span>]) <span class="op">!=</span> <span class="st">"RIFF"</span>:</a>
|
||||
<a class="sourceLine" id="cb7-21" title="21"> <span class="bu">print</span> <span class="st">"error: not wav file."</span></a>
|
||||
<a class="sourceLine" id="cb7-22" title="22"> exit(<span class="dv">1</span>)</a>
|
||||
<a class="sourceLine" id="cb7-23" title="23"></a>
|
||||
<a class="sourceLine" id="cb7-24" title="24"> <span class="bu">print</span> <span class="bu">sum</span>(<span class="bu">abs</span>(word) <span class="cf">for</span> word <span class="kw">in</span> word_iter(f))</a>
|
||||
<a class="sourceLine" id="cb7-25" title="25"><span class="cf">except</span> <span class="pp">IOError</span>:</a>
|
||||
<a class="sourceLine" id="cb7-26" title="26"> <span class="bu">print</span> <span class="st">"error: can't open input file '</span><span class="sc">%s</span><span class="st">'."</span> <span class="op">%</span> argv[<span class="dv">1</span>]</a>
|
||||
<a class="sourceLine" id="cb7-27" title="27"> exit(<span class="dv">1</span>)</a></code></pre></div>
|
||||
<p>and <a href="http://www.reddit.com/user/luikore">luikore</a> proposed an impressive Ruby version:</p>
|
||||
<div class="sourceCode" id="cb8"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb8-1" title="1">data = <span class="dt">ARGF</span>.read</a>
|
||||
<a class="sourceLine" id="cb8-2" title="2"> keys =<span class="ot"> %w[</span><span class="st">id totallength wavefmt format</span></a>
|
||||
<a class="sourceLine" id="cb8-3" title="3"><span class="st"> pcm channels frequency bytes_per_second</span></a>
|
||||
<a class="sourceLine" id="cb8-4" title="4"><span class="st"> bytes_by_capture bits_per_sample</span></a>
|
||||
<a class="sourceLine" id="cb8-5" title="5"><span class="st"> data bytes_in_data sum</span></a>
|
||||
<a class="sourceLine" id="cb8-6" title="6"><span class="st"> </span><span class="ot">]</span></a>
|
||||
<a class="sourceLine" id="cb8-7" title="7"> values = data.unpack <span class="st">'Z4 i Z8 i s s i i s s Z4 i s*'</span></a>
|
||||
<a class="sourceLine" id="cb8-8" title="8"> sum = values.drop(<span class="dv">12</span>).map(&<span class="st">:abs</span>).inject(:+)</a>
|
||||
<a class="sourceLine" id="cb8-9" title="9"> keys.zip(values.take(<span class="dv">12</span>) << sum) {|k, v|</a>
|
||||
<a class="sourceLine" id="cb8-10" title="10"> puts <span class="st">"</span><span class="ot">#{</span>k.ljust <span class="dv">17</span><span class="ot">}</span><span class="st">: </span><span class="ot">#{</span>v<span class="ot">}</span><span class="st">"</span></a>
|
||||
<a class="sourceLine" id="cb8-11" title="11"> }</a></code></pre></div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-14-Fun-with-wav/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-14-Fun-with-wav/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-10-14
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
# usage:
|
||||
# ---
|
||||
# ...
|
||||
# macros:
|
||||
# test: "passed test"
|
||||
# ---
|
||||
# ...
|
||||
# Here is a %test.
|
||||
#
|
||||
class Macros < Nanoc3::Filter
|
||||
identifier :falacy
|
||||
attr_accessor :macro
|
||||
def initialize(arg)
|
||||
super
|
||||
@macro={}
|
||||
@macro[:tlal] = %{<span class="sc"><abbr title="Trop long à lire">tlàl</abbr> : </span>}
|
||||
@macro[:tldr] = %{<span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span>}
|
||||
if @item.nil?
|
||||
if not arg.nil?
|
||||
@macro.merge!( arg )
|
||||
end
|
||||
else
|
||||
if not @item[:macros].nil?
|
||||
@macro.merge!( @item[:macros] )
|
||||
end
|
||||
end
|
||||
end
|
||||
def macro_value_for(macro_name)
|
||||
if macro_name.nil? or macro_name=="" or @macro[macro_name.intern].nil?
|
||||
return %{%#{macro_name}}
|
||||
end
|
||||
return @macro[macro_name.intern]
|
||||
end
|
||||
def run(content, params={})
|
||||
content.gsub(/%(\w*)/) do |m|
|
||||
if m != '%'
|
||||
macro_value_for($1)
|
||||
else
|
||||
m
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
@ -0,0 +1,160 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - LaTeX like macro for markdown</title>
|
||||
<meta name="keywords" content="LaTeX, macros, markdown, nanoc, ruby" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2010-10-26-LaTeX-like-macro-and-markdown/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>LaTeX like macro for markdown</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span> I made a simple macro system for my blog. Now I juste have to write %<span></span>latex and it show as <span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span>.</p>
|
||||
</div>
|
||||
<p>I added a macro system for my blog system. When we are used to <span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span> this lack can be hard to handle. Particularly when using mathematical notations. In the header of my files I simply write:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode yaml"><code class="sourceCode yaml"></code></pre></div>
|
||||
<p>In the body it will replace every occurrence of:</p>
|
||||
<ul>
|
||||
<li>%<span></span>test by <em>Just a test</em>,</li>
|
||||
<li>and %<span></span>latex by <em><span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span></em>.</li>
|
||||
</ul>
|
||||
<p>The source code is really simple. For <code>nanoc</code> user, simply put this file in your <code>lib</code> directory.</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb2-1" title="1"><span class="co"># usage:</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="co"># ---</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"><span class="co"># ...</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"><span class="co"># macros:</span></a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"><span class="co"># test: "passed test"</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"><span class="co"># ---</span></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"><span class="co"># ...</span></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"><span class="co"># Here is a Just a test.</span></a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"><span class="co">#</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"><span class="kw">class</span> <span class="dt">Macros</span> < <span class="dt">Nanoc3</span>::<span class="dt">Filter</span></a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> identifier <span class="st">:falacy</span></a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="ot">attr_accessor</span> <span class="st">:macro</span></a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="kw">def</span> initialize(arg)</a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> <span class="dv">super</span></a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"> <span class="ot">@macro</span>={}</a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"> <span class="ot">@macro</span>[<span class="st">:tlal</span>] =<span class="ot"> %{</span><span class="st"><span class="sc"><abbr title="Trop long à lire">tlàl</abbr> : </span></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17"> <span class="ot">@macro</span>[<span class="st">:tldr</span>] =<span class="ot"> %{</span><span class="st"><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span></span><span class="ot">}</span></a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"> <span class="kw">if</span> <span class="ot">@item</span>.nil?</a>
|
||||
<a class="sourceLine" id="cb2-19" title="19"> <span class="kw">if</span> <span class="kw">not</span> arg.nil?</a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"> <span class="ot">@macro</span>.merge!( arg )</a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-22" title="22"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"> <span class="kw">if</span> <span class="kw">not</span> <span class="ot">@item</span>[<span class="st">:macros</span>].nil?</a>
|
||||
<a class="sourceLine" id="cb2-24" title="24"> <span class="ot">@macro</span>.merge!( <span class="ot">@item</span>[<span class="st">:macros</span>] )</a>
|
||||
<a class="sourceLine" id="cb2-25" title="25"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-26" title="26"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-27" title="27"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-28" title="28"> <span class="kw">def</span> macro_value_for(macro_name)</a>
|
||||
<a class="sourceLine" id="cb2-29" title="29"> <span class="kw">if</span> macro_name.nil? <span class="kw">or</span> macro_name==<span class="st">""</span> <span class="kw">or</span> <span class="ot">@macro</span>[macro_name.intern].nil?</a>
|
||||
<a class="sourceLine" id="cb2-30" title="30"> <span class="kw">return</span><span class="ot"> %{</span><span class="st">%</span><span class="ot">#{</span>macro_name<span class="ot">}}</span> </a>
|
||||
<a class="sourceLine" id="cb2-31" title="31"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-32" title="32"> <span class="kw">return</span> <span class="ot">@macro</span>[macro_name.intern]</a>
|
||||
<a class="sourceLine" id="cb2-33" title="33"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-34" title="34"> <span class="kw">def</span> run(content, params={})</a>
|
||||
<a class="sourceLine" id="cb2-35" title="35"> content.gsub(<span class="ot">/%(\w*)/</span>) <span class="kw">do</span> |m| </a>
|
||||
<a class="sourceLine" id="cb2-36" title="36"> <span class="kw">if</span> m != <span class="ch">'%'</span></a>
|
||||
<a class="sourceLine" id="cb2-37" title="37"> macro_value_for(<span class="dt">$1</span>)</a>
|
||||
<a class="sourceLine" id="cb2-38" title="38"> <span class="kw">else</span></a>
|
||||
<a class="sourceLine" id="cb2-39" title="39"> m</a>
|
||||
<a class="sourceLine" id="cb2-40" title="40"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-41" title="41"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-42" title="42"> <span class="kw">end</span></a>
|
||||
<a class="sourceLine" id="cb2-43" title="43"><span class="kw">end</span></a></code></pre></div>
|
||||
<p>Macros could be very useful, read <a href="http://adam.gomaa.us/blog/2007/oct/22/markdown-doesnt-scale/index.html">this article</a> for example.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-26-LaTeX-like-macro-and-markdown/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2010-10-26-LaTeX-like-macro-and-markdown/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2010-10-26
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,109 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Happy New Year</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2011-01-03-Happy-New-Year/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Happy New Year</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Happy New Year!</p>
|
||||
<p>I was busy during the last months. But I will revive a bit this blog.</p>
|
||||
<p>I made a project to write book in markdown syntax and generating HTML and high quality PDF. I am not finished with this.</p>
|
||||
<p>I had written an efficient <em>&</em> simplistic MVC javascript framework.</p>
|
||||
<p>Best wishes for <em>2011</em>!</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2011-01-03-Happy-New-Year/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2011-01-03-Happy-New-Year/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2011-01-01
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,179 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Why I won't use CoffeeScript (sadly)</title>
|
||||
<meta name="keywords" content="Coffeescript" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Why I won't use CoffeeScript (sadly)</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/main.png" alt="Title image" />
|
||||
</div>
|
||||
<div class="encadre">
|
||||
<p><em>Update</em>: I might change my mind now. Why? I just discovered a <a href="https://github.com/rstacruz/js2coffee">js2coffee converter</a>. Furthermore Denis Knauf told me about a <code>CoffeeScript.eval</code> function. And as Denis said: “it is time to use Coffeescript as a javascript with Ruby-like syntax not a Ruby-like programming language”.</p>
|
||||
</div>
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span> I would have loved to program client side using a Ruby-like syntax. But in the end, CoffeScript raised more disavantages than advantages.</p>
|
||||
</div>
|
||||
<p>Recently I read <a href="http://news.ycombinator.com/item?id=2053956">this entry</a> on HackerNews. The most upvoted comment praised (within other) <a href="http://coffeescript.org">CoffeeScript</a>. Recently I used <em>a lot</em> of javascript. After trying <a href="http://sproutcore.com">Sproutcore</a>, <a href="http://cappuccino.org">Cappuccino</a>, looking at <a href="http://wiht.link/backbonejs-intro">backbone.js</a> <em>&</em> <a href="http://javascriptmvc.com">javascriptMVC</a>, I’ve finally decided to make my own minimal javascript MVC framework.<a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a></p>
|
||||
<p>I had to fight the horrible syntax of javascript. It was like experiencing a back-in-time travel:</p>
|
||||
<ul>
|
||||
<li>Verbose Java-like syntax,</li>
|
||||
<li>Strange and insanely Verbose Object Oriented Programming,</li>
|
||||
<li>No easy way to refer to current instance of a class (<code>this</code> doesn’t work really well),</li>
|
||||
<li>etc…</li>
|
||||
</ul>
|
||||
<p>It was so annoying at a point, I had thinked about creating my <em>own</em> CoffeeScript.</p>
|
||||
<p>I’d finished a first draft of my MVC javascript framework. Just after I learned about the existence of CoffeeScript, I immediately created a new git branch to try it.</p>
|
||||
<p>Here is my experience:</p>
|
||||
<ol type="1">
|
||||
<li>I had to install <code>node.js</code> and use <code>npm</code> just to use CoffeeScript. It wasn’t a big deal but it wasn’t as straightfoward as I expected either.</li>
|
||||
<li>Existing javascript file are not coffee compatible. I <em>had</em> to translate them by hand. There were no script to help me in this process. Thanks to <a href="http://vim.org">vim</a>, it wasn’t too hard to translate 90% of the javascript using some regexp. The <code>--watch</code> option of coffee was also really helpful to help in the translation. But I had to write my own shell script in order to follow an entire directory tree.</li>
|
||||
<li>An unexpected event. I made some meta-programming in javascript using <code>eval</code>. But in order to work, the string in the eval must be written in pure javascript not in coffee. It was like writing in two different languages. Really not so good.</li>
|
||||
</ol>
|
||||
<h2 id="conclusion">Conclusion</h2>
|
||||
<p>Advantages:</p>
|
||||
<ul>
|
||||
<li>Readability: clearly it resolved most of javascript syntax problems</li>
|
||||
<li>Verbosity: I gained 14% line, 22% words, 14% characters</li>
|
||||
</ul>
|
||||
<p>Disadvantages:</p>
|
||||
<ul>
|
||||
<li>Added another compilation step to see how my code behave on the website.</li>
|
||||
<li>I had to launch some script to generate on change every of my javascript file</li>
|
||||
<li>I have to learn another Ruby-like language,</li>
|
||||
<li>meta-programming become a poor experience,</li>
|
||||
<li>I must convince people working with me to:
|
||||
<ul>
|
||||
<li>install <code>node.js</code>, <code>npm</code> and CoffeeScript,</li>
|
||||
<li>remember to launch a script at each code session,</li>
|
||||
<li>learn and use another ruby-like language</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<p>The last two point were definitively really problematic for me.</p>
|
||||
<p>But even if I’ll have to work alone, I certainly won’t use CoffeeScript either. CoffeeScript is a third party and any of their update can break my code. I experienced this kind of situation many times, and it is very annoying. Far more than coding with a bad syntax.</p>
|
||||
<h2 id="digression">Digression</h2>
|
||||
<p>I am sad. I wanted so much to program on Web Client with a Ruby-like syntax. But in the end I think it is not for me. I have to use the <em>horrible</em> javascript syntax for now. At least I would have preferred a complete <code>ruby2js</code> script for example<a href="#fn2" class="footnote-ref" id="fnref2"><sup>2</sup></a>. But I believe it would be a really hard task just to simulate the access of current class for example.</p>
|
||||
<p>Typically <code>@x</code> translate into <code>this.x</code>. But the following code will not do what I should expect. Call the foo function of the current class.</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb1-1" title="1">-> </a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw">class</span> <span class="dt">MyClass</span></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"> <span class="st">foo: </span>-></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"> alert(<span class="st">'ok'</span>)</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"> <span class="st">bar: </span>-></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> $(<span class="st">'#content'</span>).load( <span class="st">'/content.html'</span>, ( -> <span class="ot">@foo</span>(x) ) )</a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> <span class="co"># That won't call MyClass.foo</span></a></code></pre></div>
|
||||
<p>The only way to handle this is to make the following code:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb2-1" title="1">-> </a>
|
||||
<a class="sourceLine" id="cb2-2" title="2"><span class="kw">class</span> <span class="dt">MyClass</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="st">foo: </span>-></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> alert(<span class="st">'ok'</span>)</a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> <span class="st">bar: </span>-></a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"> <span class="dv">self</span>=this</a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"> $(<span class="st">'#content'</span>).load( <span class="st">'/content.html'</span>, ( -> <span class="dv">self</span>.foo(x) ) )</a></code></pre></div>
|
||||
<p>Knowing this, <code>@</code> notation lose most of its interrest for me.</p>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p>I know it may not be the best nor productive decision, but I’d like to start from scratch and understand how things works under the hood.<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
<li id="fn2"><p>I know there is <code>rb2js</code>, but it doesn’t handle the problem I talk about.<a href="#fnref2" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2011-01-03
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Now hosted on github</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/2011-04-20-Now-hosted-on-github/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Now hosted on github</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/2011-04-20-Now-hosted-on-github/main.png" alt="Title image" />
|
||||
</div>
|
||||
<p>I am now hosted on github.</p>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2011-04-20-Now-hosted-on-github/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2011-04-20-Now-hosted-on-github/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2011-04-20
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
#!/usr/bin/env zsh
|
||||
|
||||
# Load colors helpers
|
||||
autoload -U colors && colors
|
||||
|
||||
function colorize_diff {
|
||||
while read line; do
|
||||
case ${line[0]} in
|
||||
+) print -n $fg[green];;
|
||||
-) print -n $fg[red];;
|
||||
@) # Display in cyan the @@ positions @@
|
||||
if [[ ${line[1]} = '@' ]]; then
|
||||
line=$(print $line | perl -pe 's#(\@\@[^\@]*\@\@)(.*)$#'$fg[cyan]'$1'$reset_color'$2#')
|
||||
fi;;
|
||||
|
||||
esac
|
||||
print -- $line
|
||||
print -n $reset_color
|
||||
done
|
||||
}
|
||||
|
||||
diff -u $* | colorize_diff
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - A more convenient diff</title>
|
||||
<meta name="keywords" content="diff, git, colors" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/A-more-convenient-diff/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>A more convenient diff</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Diff is a very useful tool. But it is not so easy to read for us, simple mortal.</p>
|
||||
<p>This is why, when you use <code>git</code> it will use a better formatting and colorize it.</p>
|
||||
<p>Here is the script I use when I want to use human readable <code>diff</code> à la git.</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode zsh"><code class="sourceCode zsh"><a class="sourceLine" id="cb1-1" title="1"><span class="co">#!/usr/bin/env zsh</span></a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="co"># Load colors helpers</span></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4"><span class="kw">autoload</span> -U colors <span class="kw">&&</span> colors</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"><span class="kw">function</span><span class="fu"> colorize_diff</span> <span class="kw">{</span></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7"> <span class="kw">while</span> <span class="kw">read</span> <span class="ot">line</span>; <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8"> <span class="kw">case</span> <span class="ot">${line[0]}</span><span class="kw"> in</span></a>
|
||||
<a class="sourceLine" id="cb1-9" title="9"> +<span class="kw">)</span> <span class="kw">print</span> -n <span class="ot">$fg[green]</span><span class="kw">;;</span></a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"> -<span class="kw">)</span> <span class="kw">print</span> -n <span class="ot">$fg[red]</span><span class="kw">;;</span></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11"> @<span class="kw">)</span> <span class="co"># Display in cyan the @@ positions @@</span></a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"> <span class="kw">if [[</span> <span class="ot">${line[1]}</span> <span class="ot">=</span> <span class="st">'@'</span><span class="kw"> ]]</span>; <span class="kw">then</span></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"> <span class="ot">line=$(</span><span class="kw">print</span> <span class="ot">$line</span> <span class="kw">|</span> <span class="kw">perl</span> -pe <span class="st">'s#(\@\@[^\@]*\@\@)(.*)$#'</span><span class="ot">$fg[cyan]</span><span class="st">'$1'</span><span class="ot">$reset_color</span><span class="st">'$2#'</span><span class="ot">)</span></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"> <span class="kw">fi;;</span></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"> <span class="kw">esac</span></a>
|
||||
<a class="sourceLine" id="cb1-17" title="17"> <span class="kw">print</span> -- <span class="ot">$line</span></a>
|
||||
<a class="sourceLine" id="cb1-18" title="18"> <span class="kw">print</span> -n <span class="ot">$reset_color</span></a>
|
||||
<a class="sourceLine" id="cb1-19" title="19"> <span class="kw">done</span></a>
|
||||
<a class="sourceLine" id="cb1-20" title="20"><span class="kw">}</span></a>
|
||||
<a class="sourceLine" id="cb1-21" title="21"></a>
|
||||
<a class="sourceLine" id="cb1-22" title="22"><span class="kw">diff</span> -u <span class="ot">$*</span> <span class="kw">|</span> colorize_diff</a></code></pre></div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/A-more-convenient-diff/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/A-more-convenient-diff/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2011-08-17
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,520 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - Hakyll setup</title>
|
||||
<meta name="keywords" content="programming, hakyll, Haskell, nanoc" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/Hakyll-setup/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>Hakyll setup</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/Hakyll-setup/main.png" alt="Main image" />
|
||||
</div>
|
||||
<div class="intro">
|
||||
<p><span class="sc"><abbr title="Too long; didn't read">tl;dr</abbr>: </span> How I use <a href="http://jaspervdj.be/hakyll">hakyll</a>. Abbreviations, typography corrections, multi-language, use <code>index.html</code>, etc…</p>
|
||||
</div>
|
||||
<p>This website is done with <a href="http://jaspervdj.be/hakyll">Hakyll</a>.</p>
|
||||
<p><a href="http://jaspervdj.be/hakyll">Hakyll</a> can be considered as a minimal <span class="sc"><abbr title="Content Management System">cms</abbr></span>. But more generally it is a library helping file generation. We can view it as an advanced build system (like <code>make</code>).</p>
|
||||
<p>From the user perspective I blog this way:</p>
|
||||
<ol type="1">
|
||||
<li>I open an editor (vim in my case) and edit a markdown file. It looks like this</li>
|
||||
</ol>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode markdown"><code class="sourceCode markdown"><a class="sourceLine" id="cb1-1" title="1">A First Level Header</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2">====================</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"></a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">A Second Level Header</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5">---------------------</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6"></a>
|
||||
<a class="sourceLine" id="cb1-7" title="7">Who would cross the Bridge of Death must answer me</a>
|
||||
<a class="sourceLine" id="cb1-8" title="8">these questions three, ere the other side he see.</a>
|
||||
<a class="sourceLine" id="cb1-9" title="9">This is just a regular paragraph.</a>
|
||||
<a class="sourceLine" id="cb1-10" title="10"></a>
|
||||
<a class="sourceLine" id="cb1-11" title="11">Ask me the questions, bridgekeeper. I am not afraid.</a>
|
||||
<a class="sourceLine" id="cb1-12" title="12"></a>
|
||||
<a class="sourceLine" id="cb1-13" title="13"><span class="fu">### Header 3</span></a>
|
||||
<a class="sourceLine" id="cb1-14" title="14"></a>
|
||||
<a class="sourceLine" id="cb1-15" title="15">><span class="dt"> This is a blockquote.</span></a>
|
||||
<a class="sourceLine" id="cb1-16" title="16"><span class="dt">></span></a>
|
||||
<a class="sourceLine" id="cb1-17" title="17"><span class="dt">> This is the second paragraph in the blockquote.</span></a>
|
||||
<a class="sourceLine" id="cb1-18" title="18"><span class="dt">></span></a>
|
||||
<a class="sourceLine" id="cb1-19" title="19"><span class="dt">> ## This is an H2 in a blockquote</span></a></code></pre></div>
|
||||
<ol start="2" type="1">
|
||||
<li>I open a browser and reload time to time to see the change.</li>
|
||||
<li>Once I finished I’ve written a very minimal script which mainly do a <code>git push</code>. My blog is hosted on <a href="http://github.com">github</a>.</li>
|
||||
</ol>
|
||||
<p>Being short sighted one could reduce the role of Hakyll to:</p>
|
||||
<blockquote>
|
||||
<p>create (resp. update) <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> file when I create (resp. change) a markdown file.</p>
|
||||
</blockquote>
|
||||
<p>While it sounds easy, there are a lot of hidden details:</p>
|
||||
<ul>
|
||||
<li>Add metadatas like keywords.</li>
|
||||
<li>Create an archive page containing a list of all the posts.</li>
|
||||
<li>Deal with static files.</li>
|
||||
<li>Creating an <span class="sc"><abbr title="Rich Site Summary">rss</abbr></span> feed.</li>
|
||||
<li>Filter the content with some function.</li>
|
||||
<li>Dealing with dependencies.</li>
|
||||
</ul>
|
||||
<p>The work of Hakyll is to help you with these. But let’s start with the basic concepts.</p>
|
||||
<h2 id="the-concepts-and-syntax">The concepts and syntax</h2>
|
||||
<div>
|
||||
<img src="../../../../Scratch/img/blog/Hakyll-setup/overview.png" alt="Overview" />
|
||||
</div>
|
||||
<p>For each file you create, you have to provide:</p>
|
||||
<ul>
|
||||
<li>a destination path</li>
|
||||
<li>a list of content filters.</li>
|
||||
</ul>
|
||||
<p>First, let’s start with the simplest case: static files (images, fonts, etc…). Generally, you have a source directory (here is the current directory) and a destination directory <code>_site</code>.</p>
|
||||
<p>The Hakyll code is:</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb2-1" title="1"><span class="co">-- for each file in the static directory</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2">match <span class="st">"static/*"</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3"> <span class="co">-- don't change its name nor directory</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4"> route idRoute</a>
|
||||
<a class="sourceLine" id="cb2-5" title="5"> <span class="co">-- don't change its content</span></a>
|
||||
<a class="sourceLine" id="cb2-6" title="6"> compile copyFileCompiler</a></code></pre></div>
|
||||
<p>This program will copy <code>static/foo.jpg</code> to <code>_site/static/foo.jpg</code>. I concede this is a bit overkill for a simple <code>cp</code>. Now how to write a markdown file and generate an <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> one?</p>
|
||||
<div class="sourceCode" id="cb3"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb3-1" title="1"><span class="co">-- for each file with md extension in the "posts/" directory</span></a>
|
||||
<a class="sourceLine" id="cb3-2" title="2">match <span class="st">"posts/*.md"</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb3-3" title="3"> <span class="co">-- change its extension to html</span></a>
|
||||
<a class="sourceLine" id="cb3-4" title="4"> route <span class="op">$</span> setExtension <span class="st">"html"</span></a>
|
||||
<a class="sourceLine" id="cb3-5" title="5"> <span class="co">-- use pandoc library to compile the markdown content into html</span></a>
|
||||
<a class="sourceLine" id="cb3-6" title="6"> compile <span class="op">$</span> pandocCompiler</a></code></pre></div>
|
||||
<p>If you create a file <code>posts/foo.md</code>, it will create a file <code>_site/posts/foo.html</code>.</p>
|
||||
<p>If the file <code>posts/foo.md</code> contains</p>
|
||||
<div class="sourceCode" id="cb4"><pre class="sourceCode markdown"><code class="sourceCode markdown"><a class="sourceLine" id="cb4-1" title="1"><span class="fu"># Cthulhu</span></a>
|
||||
<a class="sourceLine" id="cb4-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb4-3" title="3">ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn</a></code></pre></div>
|
||||
<p>the file <code>_site/posts/foo.html</code>, will contain</p>
|
||||
<div class="sourceCode" id="cb5"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb5-1" title="1"><span class="kw"><h1></span>Cthulhu<span class="kw"></h1></span></a>
|
||||
<a class="sourceLine" id="cb5-2" title="2"><span class="kw"><p></span>ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn<span class="kw"></p></span></a></code></pre></div>
|
||||
<p>But horror! <code>_site/posts/cthulhu.html</code> is not a complete <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> file. It doesn’t have any header nor footer, etc… This is where you use templates. I simply add a new directive in the compile block.</p>
|
||||
<div class="sourceCode" id="cb6"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb6-1" title="1">match <span class="st">"posts/*.md"</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb6-2" title="2"> route <span class="op">$</span> setExtension <span class="st">"html"</span></a>
|
||||
<a class="sourceLine" id="cb6-3" title="3"> compile <span class="op">$</span> pandocCompiler</a>
|
||||
<a class="sourceLine" id="cb6-4" title="4"> <span class="co">-- use the template with the current content</span></a>
|
||||
<a class="sourceLine" id="cb6-5" title="5"> <span class="highlight"><span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/post.html"</span> defaultContext</span></a></code></pre></div>
|
||||
<p>Now if <code>templates/posts.html</code> contains:</p>
|
||||
<div class="sourceCode" id="cb7"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb7-1" title="1"><span class="kw"><html></span></a>
|
||||
<a class="sourceLine" id="cb7-2" title="2"> <span class="kw"><head></span></a>
|
||||
<a class="sourceLine" id="cb7-3" title="3"> <span class="kw"><title></span>How could I get the title?<span class="kw"></title></span></a>
|
||||
<a class="sourceLine" id="cb7-4" title="4"> <span class="kw"></head></span></a>
|
||||
<a class="sourceLine" id="cb7-5" title="5"> <span class="kw"><body></span></a>
|
||||
<a class="sourceLine" id="cb7-6" title="6"> <span class="highlight">$body$</span></a>
|
||||
<a class="sourceLine" id="cb7-7" title="7"> <span class="kw"></body></span></a>
|
||||
<a class="sourceLine" id="cb7-8" title="8"><span class="kw"></html></span></a></code></pre></div>
|
||||
<p>our <code>cthulhu.html</code> contains (indentation added for readability):</p>
|
||||
<div class="sourceCode" id="cb8"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb8-1" title="1"><span class="kw"><html></span></a>
|
||||
<a class="sourceLine" id="cb8-2" title="2"> <span class="kw"><head></span></a>
|
||||
<a class="sourceLine" id="cb8-3" title="3"> <span class="kw"><title></span>How could I get the title?<span class="kw"></title></span></a>
|
||||
<a class="sourceLine" id="cb8-4" title="4"> <span class="kw"></head></span></a>
|
||||
<a class="sourceLine" id="cb8-5" title="5"> <span class="kw"><body></span></a>
|
||||
<a class="sourceLine" id="cb8-6" title="6"> <span class="highlight"><span class="kw"><h1></span>Cthulhu<span class="kw"></h1></span></span></a>
|
||||
<a class="sourceLine" id="cb8-7" title="7"> <span class="highlight"><span class="kw"><p></span>ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn<span class="kw"></p></span></span></a>
|
||||
<a class="sourceLine" id="cb8-8" title="8"> <span class="kw"></body></span></a>
|
||||
<a class="sourceLine" id="cb8-9" title="9"><span class="kw"></html></span></a></code></pre></div>
|
||||
<p>See, it’s easy But we have a problem. How could we change the title or add keywords?</p>
|
||||
<p>The solution is to use <code>Context</code>s. For this, we first need to add some <em>metadatas</em> to our markdown<a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a>.</p>
|
||||
<div class="sourceCode" id="cb9"><pre class="sourceCode markdown"><code class="sourceCode markdown"><a class="sourceLine" id="cb9-1" title="1"><span class="highlight">--- </span></a>
|
||||
<a class="sourceLine" id="cb9-2" title="2"><span class="highlight">title: Cthulhu</span></a>
|
||||
<a class="sourceLine" id="cb9-3" title="3"><span class="highlight">--- </span></a>
|
||||
<a class="sourceLine" id="cb9-4" title="4"><span class="fu"># Cthulhu</span></a>
|
||||
<a class="sourceLine" id="cb9-5" title="5"></a>
|
||||
<a class="sourceLine" id="cb9-6" title="6">ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn</a></code></pre></div>
|
||||
<p>And modify slightly our template:</p>
|
||||
<div class="sourceCode" id="cb10"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb10-1" title="1"><span class="kw"><html></span></a>
|
||||
<a class="sourceLine" id="cb10-2" title="2"> <span class="kw"><head></span></a>
|
||||
<a class="sourceLine" id="cb10-3" title="3"> <span class="kw"><title></span><span class="highlight">$title$</span><span class="kw"></title></span></a>
|
||||
<a class="sourceLine" id="cb10-4" title="4"> <span class="kw"></head></span></a>
|
||||
<a class="sourceLine" id="cb10-5" title="5"> <span class="kw"><body></span></a>
|
||||
<a class="sourceLine" id="cb10-6" title="6"> $body$</a>
|
||||
<a class="sourceLine" id="cb10-7" title="7"> <span class="kw"></body></span></a>
|
||||
<a class="sourceLine" id="cb10-8" title="8"><span class="kw"></html></span></a></code></pre></div>
|
||||
<p>As Sir Robin said just before dying before the Bridge of Death:</p>
|
||||
<blockquote>
|
||||
<p><strong>“That’s EASY!”</strong></p>
|
||||
<p>– <cite>Sir Robin, the Not-Quite-So-Brave-As-Sir-Lancelot</cite></p>
|
||||
</blockquote>
|
||||
<h2 id="real-customization">Real customization</h2>
|
||||
<p>Now that we understand the basic functionality. How to:</p>
|
||||
<ul>
|
||||
<li>use SASS?</li>
|
||||
<li>add keywords?</li>
|
||||
<li>simplify <span class="sc"><abbr title="Uniform Ressource Locator">url</abbr></span>?</li>
|
||||
<li>create an archive page?</li>
|
||||
<li>create an <span class="sc"><abbr title="Rich Site Summary">rss</abbr></span> feed?</li>
|
||||
<li>filter the content?</li>
|
||||
<li>add abbreviations support?</li>
|
||||
<li>manage two languages?</li>
|
||||
</ul>
|
||||
<h3 id="use-sass">Use SASS</h3>
|
||||
<p>That’s easy. Simply call the executable using <code>unixFilter</code>. Of course you’ll have to install SASS (<code>gem install sass</code>). And we also use compressCss to gain some space.</p>
|
||||
<div class="sourceCode" id="cb11"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb11-1" title="1">match <span class="st">"css/*"</span> <span class="op">$</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb11-2" title="2"> route <span class="op">$</span> setExtension <span class="st">"css"</span></a>
|
||||
<a class="sourceLine" id="cb11-3" title="3"> compile <span class="op">$</span> getResourceString <span class="op">>>=</span></a>
|
||||
<a class="sourceLine" id="cb11-4" title="4"> withItemBody (unixFilter <span class="st">"sass"</span> [<span class="st">"--trace"</span>]) <span class="op">>>=</span></a>
|
||||
<a class="sourceLine" id="cb11-5" title="5"> <span class="fu">return</span> <span class="op">.</span> <span class="fu">fmap</span> compressCss</a></code></pre></div>
|
||||
<h3 id="add-keywords">Add keywords</h3>
|
||||
<p>In order to help to reference your website on the web, it is nice to add some keywords as meta datas to your <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> page.</p>
|
||||
<div class="sourceCode" id="cb12"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb12-1" title="1"><span class="kw"><meta</span><span class="ot"> name=</span><span class="st">"keywords"</span></a>
|
||||
<a class="sourceLine" id="cb12-2" title="2"><span class="ot"> content=</span><span class="st">"Cthulhu, Yog-Sothoth, Shub-Niggurath"</span><span class="kw">></span></a></code></pre></div>
|
||||
<p>In order to add keywords, we could not directly use the markdown metadatas. Because, without any, there should be any meta tag in the <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span>.</p>
|
||||
<p>An easy answer is to create a <code>Context</code> that will contains the meta tag.</p>
|
||||
<div class="sourceCode" id="cb13"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb13-1" title="1"><span class="co">-- metaKeywordContext will return a Context containing a String</span></a>
|
||||
<a class="sourceLine" id="cb13-2" title="2"><span class="ot">metaKeywordContext ::</span> <span class="dt">Context</span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb13-3" title="3"><span class="co">-- can be reached using $metaKeywords$ in the templates</span></a>
|
||||
<a class="sourceLine" id="cb13-4" title="4"><span class="co">-- Use the current item (markdown file)</span></a>
|
||||
<a class="sourceLine" id="cb13-5" title="5">metaKeywordContext <span class="ot">=</span> field <span class="st">"metaKeywords"</span> <span class="op">$</span> \item <span class="ot">-></span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb13-6" title="6"> <span class="co">-- tags contains the content of the "tags" metadata</span></a>
|
||||
<a class="sourceLine" id="cb13-7" title="7"> <span class="co">-- inside the item (understand the source)</span></a>
|
||||
<a class="sourceLine" id="cb13-8" title="8"> tags <span class="ot"><-</span> getMetadataField (itemIdentifier item) <span class="st">"tags"</span></a>
|
||||
<a class="sourceLine" id="cb13-9" title="9"> <span class="co">-- if tags is empty return an empty string</span></a>
|
||||
<a class="sourceLine" id="cb13-10" title="10"> <span class="co">-- in the other case return</span></a>
|
||||
<a class="sourceLine" id="cb13-11" title="11"> <span class="co">-- <meta name="keywords" content="$tags$"></span></a>
|
||||
<a class="sourceLine" id="cb13-12" title="12"> <span class="fu">return</span> <span class="op">$</span> <span class="fu">maybe</span> <span class="st">""</span> showMetaTags tags</a>
|
||||
<a class="sourceLine" id="cb13-13" title="13"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb13-14" title="14"> showMetaTags t <span class="ot">=</span> <span class="st">"<meta name=\"keywords\" content=\""</span></a>
|
||||
<a class="sourceLine" id="cb13-15" title="15"> <span class="op">++</span> t <span class="op">++</span> <span class="st">"\">\n"</span></a></code></pre></div>
|
||||
<p>Then we pass this <code>Context</code> to the <code>loadAndApplyTemplate</code> function:</p>
|
||||
<div class="sourceCode" id="cb14"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb14-1" title="1">match <span class="st">"posts/*.md"</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb14-2" title="2"> route <span class="op">$</span> setExtension <span class="st">"html"</span></a>
|
||||
<a class="sourceLine" id="cb14-3" title="3"> compile <span class="op">$</span> pandocCompiler</a>
|
||||
<a class="sourceLine" id="cb14-4" title="4"> <span class="co">-- use the template with the current content</span></a>
|
||||
<a class="sourceLine" id="cb14-5" title="5"> <span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/post.html"</span></a>
|
||||
<a class="sourceLine" id="cb14-6" title="6"> (defaultContext <span class="highlight"><span class="op"><></span> metaKeywordContext</span>)</a></code></pre></div>
|
||||
<blockquote>
|
||||
<p>☞ Here are the imports I use for this tutorial.</p>
|
||||
<div class="sourceCode" id="cb15"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb15-1" title="1"><span class="ot">{-# LANGUAGE OverloadedStrings #-}</span></a>
|
||||
<a class="sourceLine" id="cb15-2" title="2"><span class="kw">import</span> <span class="dt">Control.Monad</span> (forM,forM_)</a>
|
||||
<a class="sourceLine" id="cb15-3" title="3"><span class="kw">import</span> <span class="dt">Data.List</span> (sortBy,isInfixOf)</a>
|
||||
<a class="sourceLine" id="cb15-4" title="4"><span class="kw">import</span> <span class="dt">Data.Monoid</span> ((<>),mconcat)</a>
|
||||
<a class="sourceLine" id="cb15-5" title="5"><span class="kw">import</span> <span class="dt">Data.Ord</span> (comparing)</a>
|
||||
<a class="sourceLine" id="cb15-6" title="6"><span class="kw">import</span> <span class="dt">Hakyll</span></a>
|
||||
<a class="sourceLine" id="cb15-7" title="7"><span class="kw">import</span> <span class="dt">System.Locale</span> (defaultTimeLocale)</a>
|
||||
<a class="sourceLine" id="cb15-8" title="8"><span class="kw">import</span> <span class="dt">System.FilePath.Posix</span> (takeBaseName,takeDirectory</a>
|
||||
<a class="sourceLine" id="cb15-9" title="9"> ,(<span class="op"></></span>),splitFileName)</a></code></pre></div>
|
||||
</blockquote>
|
||||
<h3 id="simplify-url">Simplify <span class="sc"><abbr title="Uniform Ressource Locator">url</abbr></span></h3>
|
||||
<p>What I mean is to use url of the form:</p>
|
||||
<pre><code>http://domain.name/post/title-of-the-post/</code></pre>
|
||||
<p>I prefer this than having to add file with <code>.html</code> extension. We have to change the default Hakyll route behavior. We create another function <code>niceRoute</code>.</p>
|
||||
<div class="sourceCode" id="cb17"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb17-1" title="1"><span class="co">-- replace a foo/bar.md by foo/bar/index.html</span></a>
|
||||
<a class="sourceLine" id="cb17-2" title="2"><span class="co">-- this way the url looks like: foo/bar in most browsers</span></a>
|
||||
<a class="sourceLine" id="cb17-3" title="3"><span class="ot">niceRoute ::</span> <span class="dt">Routes</span></a>
|
||||
<a class="sourceLine" id="cb17-4" title="4">niceRoute <span class="ot">=</span> customRoute createIndexRoute</a>
|
||||
<a class="sourceLine" id="cb17-5" title="5"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb17-6" title="6"> createIndexRoute ident <span class="ot">=</span></a>
|
||||
<a class="sourceLine" id="cb17-7" title="7"> takeDirectory p <span class="op"></></span> takeBaseName p <span class="op"></></span> <span class="st">"index.html"</span></a>
|
||||
<a class="sourceLine" id="cb17-8" title="8"> <span class="kw">where</span> p<span class="ot">=</span>toFilePath ident</a></code></pre></div>
|
||||
<p>Not too difficult. But! There might be a problem. What if there is a <code>foo/index.html</code> link instead of a clean <code>foo/</code> in some content?</p>
|
||||
<p>Very simple, we simply remove all <code>/index.html</code> to all our links.</p>
|
||||
<div class="sourceCode" id="cb18"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb18-1" title="1"><span class="co">-- replace url of the form foo/bar/index.html by foo/bar</span></a>
|
||||
<a class="sourceLine" id="cb18-2" title="2"><span class="ot">removeIndexHtml ::</span> <span class="dt">Item</span> <span class="dt">String</span> <span class="ot">-></span> <span class="dt">Compiler</span> (<span class="dt">Item</span> <span class="dt">String</span>)</a>
|
||||
<a class="sourceLine" id="cb18-3" title="3">removeIndexHtml item <span class="ot">=</span> <span class="fu">return</span> <span class="op">$</span> <span class="fu">fmap</span> (withUrls removeIndexStr) item</a>
|
||||
<a class="sourceLine" id="cb18-4" title="4"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb18-5" title="5"><span class="ot"> removeIndexStr ::</span> <span class="dt">String</span> <span class="ot">-></span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb18-6" title="6"> removeIndexStr url <span class="ot">=</span> <span class="kw">case</span> splitFileName url <span class="kw">of</span></a>
|
||||
<a class="sourceLine" id="cb18-7" title="7"> (dir, <span class="st">"index.html"</span>) <span class="op">|</span> isLocal dir <span class="ot">-></span> dir</a>
|
||||
<a class="sourceLine" id="cb18-8" title="8"> _ <span class="ot">-></span> url</a>
|
||||
<a class="sourceLine" id="cb18-9" title="9"> <span class="kw">where</span> isLocal uri <span class="ot">=</span> <span class="fu">not</span> (isInfixOf <span class="st">"://"</span> uri)</a></code></pre></div>
|
||||
<p>And we apply this filter at the end of our compilation</p>
|
||||
<div class="sourceCode" id="cb19"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb19-1" title="1">match <span class="st">"posts/*.md"</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb19-2" title="2"> <span class="highlight">route <span class="op">$</span> niceRoute</span></a>
|
||||
<a class="sourceLine" id="cb19-3" title="3"> compile <span class="op">$</span> pandocCompiler</a>
|
||||
<a class="sourceLine" id="cb19-4" title="4"> <span class="co">-- use the template with the current content</span></a>
|
||||
<a class="sourceLine" id="cb19-5" title="5"> <span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/post.html"</span> defaultContext</a>
|
||||
<a class="sourceLine" id="cb19-6" title="6"> <span class="highlight"><span class="op">>>=</span> removeIndexHtml</span></a></code></pre></div>
|
||||
<h3 id="create-an-archive-page">Create an archive page</h3>
|
||||
<p>Creating an archive start to be difficult. There is an example in the default Hakyll example. Unfortunately, it assumes all posts prefix their name with a date like in <code>2013-03-20-My-New-Post.md</code>.</p>
|
||||
<p>I migrated from an older blog and didn’t want to change my <span class="sc"><abbr title="Uniform Ressource Locator">url</abbr></span>. Also I prefer not to use any filename convention. Therefore, I add the date information in the metadata <code>published</code>. And the solution is here:</p>
|
||||
<div class="sourceCode" id="cb20"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb20-1" title="1">match <span class="st">"archive.md"</span> <span class="op">$</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb20-2" title="2"> route <span class="op">$</span> niceRoute</a>
|
||||
<a class="sourceLine" id="cb20-3" title="3"> compile <span class="op">$</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb20-4" title="4"> body <span class="ot"><-</span> getResourceBody</a>
|
||||
<a class="sourceLine" id="cb20-5" title="5"> <span class="fu">return</span> <span class="op">$</span> renderPandoc body</a>
|
||||
<a class="sourceLine" id="cb20-6" title="6"> <span class="highlight"><span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/archive.html"</span> archiveCtx</span></a>
|
||||
<a class="sourceLine" id="cb20-7" title="7"> <span class="op">>>=</span> loadAndApplyTemplate <span class="highlight"><span class="st">"templates/base.html"</span></span> defaultContext</a>
|
||||
<a class="sourceLine" id="cb20-8" title="8"> <span class="op">>>=</span> removeIndexHtml</a></code></pre></div>
|
||||
<p>Where <code>templates/archive.html</code> contains</p>
|
||||
<div class="sourceCode" id="cb21"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb21-1" title="1">$body$</a>
|
||||
<a class="sourceLine" id="cb21-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb21-3" title="3"><span class="kw"><ul></span></a>
|
||||
<a class="sourceLine" id="cb21-4" title="4"> $posts$</a>
|
||||
<a class="sourceLine" id="cb21-5" title="5"><span class="kw"></ul></span></a></code></pre></div>
|
||||
<p>And <code>base.html</code> is a standard template (simpler than <code>post.html</code>).</p>
|
||||
<p><code>archiveCtx</code> provide a context containing an <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> representation of a list of posts in the metadata named <code>posts</code>. It will be used in the <code>templates/archive.html</code> file with <code>$posts$</code>.</p>
|
||||
<div class="sourceCode" id="cb22"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb22-1" title="1">archiveCtx <span class="ot">=</span></a>
|
||||
<a class="sourceLine" id="cb22-2" title="2"> defaultContext <span class="op"><></span></a>
|
||||
<a class="sourceLine" id="cb22-3" title="3"> metaKeywordContext <span class="op"><></span></a>
|
||||
<a class="sourceLine" id="cb22-4" title="4"> <span class="highlight">field <span class="st">"posts"</span> (\_ <span class="ot">-></span> postList createdFirst)</span></a></code></pre></div>
|
||||
<p><code>postList</code> returns an <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> representation of a list of posts given an Item sort function. The representation will apply a minimal template on all posts. Then it concatenate all the results. The template is <code>post-item.html</code>:</p>
|
||||
<div class="sourceCode" id="cb23"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb23-1" title="1"><span class="kw"><li><a</span><span class="ot"> href=</span><span class="st">"$url$"</span><span class="kw">></span>$published$ - $title$<span class="kw"></a></li></span></a></code></pre></div>
|
||||
<p>Here is how it is done:</p>
|
||||
<div class="sourceCode" id="cb24"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb24-1" title="1"><span class="ot">postList ::</span> [<span class="dt">Item</span> <span class="dt">String</span>] <span class="ot">-></span> <span class="dt">Compiler</span> [<span class="dt">Item</span> <span class="dt">String</span>]</a>
|
||||
<a class="sourceLine" id="cb24-2" title="2"> <span class="ot">-></span> <span class="dt">Compiler</span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb24-3" title="3">postList sortFilter <span class="ot">=</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb24-4" title="4"> <span class="co">-- sorted posts</span></a>
|
||||
<a class="sourceLine" id="cb24-5" title="5"> posts <span class="ot"><-</span> loadAll <span class="st">"post/*"</span> <span class="op">>>=</span> sortFilter</a>
|
||||
<a class="sourceLine" id="cb24-6" title="6"> itemTpl <span class="ot"><-</span> loadBody <span class="st">"templates/post-item.html"</span></a>
|
||||
<a class="sourceLine" id="cb24-7" title="7"> <span class="co">-- we apply the template to all post</span></a>
|
||||
<a class="sourceLine" id="cb24-8" title="8"> <span class="co">-- and we concatenate the result.</span></a>
|
||||
<a class="sourceLine" id="cb24-9" title="9"> <span class="co">-- list is a string</span></a>
|
||||
<a class="sourceLine" id="cb24-10" title="10"> list <span class="ot"><-</span> applyTemplateList itemTpl defaultContext posts</a>
|
||||
<a class="sourceLine" id="cb24-11" title="11"> <span class="fu">return</span> list</a></code></pre></div>
|
||||
<p><code>createdFirst</code> sort a list of item and put it inside <code>Compiler</code> context. We need to be in the <code>Compiler</code> context to access metadatas.</p>
|
||||
<div class="sourceCode" id="cb25"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb25-1" title="1"><span class="ot">createdFirst ::</span> [<span class="dt">Item</span> <span class="dt">String</span>] <span class="ot">-></span> <span class="dt">Compiler</span> [<span class="dt">Item</span> <span class="dt">String</span>]</a>
|
||||
<a class="sourceLine" id="cb25-2" title="2">createdFirst items <span class="ot">=</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb25-3" title="3"> <span class="co">-- itemsWithTime is a list of couple (date,item)</span></a>
|
||||
<a class="sourceLine" id="cb25-4" title="4"> itemsWithTime <span class="ot"><-</span> forM items <span class="op">$</span> \item <span class="ot">-></span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb25-5" title="5"> <span class="co">-- getItemUTC will look for the metadata "published" or "date"</span></a>
|
||||
<a class="sourceLine" id="cb25-6" title="6"> <span class="co">-- then it will try to get the date from some standard formats</span></a>
|
||||
<a class="sourceLine" id="cb25-7" title="7"> utc <span class="ot"><-</span> getItemUTC defaultTimeLocale <span class="op">$</span> itemIdentifier item</a>
|
||||
<a class="sourceLine" id="cb25-8" title="8"> <span class="fu">return</span> (utc,item)</a>
|
||||
<a class="sourceLine" id="cb25-9" title="9"> <span class="co">-- we return a sorted item list</span></a>
|
||||
<a class="sourceLine" id="cb25-10" title="10"> <span class="fu">return</span> <span class="op">$</span> <span class="fu">map</span> <span class="fu">snd</span> <span class="op">$</span> <span class="fu">reverse</span> <span class="op">$</span> sortBy (comparing <span class="fu">fst</span>) itemsWithTime</a></code></pre></div>
|
||||
<p>It wasn’t so easy. But it works pretty well.</p>
|
||||
<h3 id="create-an-rss-feed">Create an <span class="sc"><abbr title="Rich Site Summary">rss</abbr></span> feed</h3>
|
||||
<p>To create an <span class="sc"><abbr title="Rich Site Summary">rss</abbr></span> feed, we have to:</p>
|
||||
<ul>
|
||||
<li>select only the lasts posts.</li>
|
||||
<li>generate partially rendered posts (no css, js, etc…)</li>
|
||||
</ul>
|
||||
<p>We could then render the posts twice. One for <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> rendering and another time for <span class="sc"><abbr title="Rich Site Summary">rss</abbr></span>. Remark we need to generate the <span class="sc"><abbr title="Rich Site Summary">rss</abbr></span> version to create the <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> one.</p>
|
||||
<p>One of the great feature of Hakyll is to be able to save snapshots. Here is how:</p>
|
||||
<div class="sourceCode" id="cb26"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb26-1" title="1">match <span class="st">"posts/*.md"</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb26-2" title="2"> route <span class="op">$</span> setExtension <span class="st">"html"</span></a>
|
||||
<a class="sourceLine" id="cb26-3" title="3"> compile <span class="op">$</span> pandocCompiler</a>
|
||||
<a class="sourceLine" id="cb26-4" title="4"> <span class="co">-- save a snapshot to be used later in rss generation</span></a>
|
||||
<a class="sourceLine" id="cb26-5" title="5"> <span class="highlight"><span class="op">>>=</span> saveSnapshot <span class="st">"content"</span></span></a>
|
||||
<a class="sourceLine" id="cb26-6" title="6"> <span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/post.html"</span> defaultContext</a></code></pre></div>
|
||||
<p>Now for each post there is a snapshot named “content” associated. The snapshots are created before applying a template and after applying pandoc. Furthermore feed don’t need a source markdown file. Then we create a new file from no one. Instead of using <code>match</code>, we use <code>create</code>:</p>
|
||||
<div class="sourceCode" id="cb27"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb27-1" title="1">create [<span class="st">"feed.xml"</span>] <span class="op">$</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb27-2" title="2"> route idRoute</a>
|
||||
<a class="sourceLine" id="cb27-3" title="3"> compile <span class="op">$</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb27-4" title="4"> <span class="co">-- load all "content" snapshots of all posts</span></a>
|
||||
<a class="sourceLine" id="cb27-5" title="5"> loadAllSnapshots <span class="st">"posts/*"</span> <span class="st">"content"</span></a>
|
||||
<a class="sourceLine" id="cb27-6" title="6"> <span class="co">-- take the latest 10</span></a>
|
||||
<a class="sourceLine" id="cb27-7" title="7"> <span class="op">>>=</span> (<span class="fu">fmap</span> (<span class="fu">take</span> <span class="dv">10</span>)) <span class="op">.</span> createdFirst</a>
|
||||
<a class="sourceLine" id="cb27-8" title="8"> <span class="co">-- renderAntom feed using some configuration</span></a>
|
||||
<a class="sourceLine" id="cb27-9" title="9"> <span class="op">>>=</span> renderAtom feedConfiguration feedCtx</a>
|
||||
<a class="sourceLine" id="cb27-10" title="10"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb27-11" title="11"><span class="ot"> feedCtx ::</span> <span class="dt">Context</span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb27-12" title="12"> feedCtx <span class="ot">=</span> defaultContext <span class="op"><></span></a>
|
||||
<a class="sourceLine" id="cb27-13" title="13"> <span class="co">-- $description$ will render as the post body</span></a>
|
||||
<a class="sourceLine" id="cb27-14" title="14"> <span class="highlight">bodyField <span class="st">"description"</span></span></a></code></pre></div>
|
||||
<p>The <code>feedConfiguration</code> contains some general informations about the feed.</p>
|
||||
<div class="sourceCode" id="cb28"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb28-1" title="1"><span class="ot">feedConfiguration ::</span> <span class="dt">FeedConfiguration</span></a>
|
||||
<a class="sourceLine" id="cb28-2" title="2">feedConfiguration <span class="ot">=</span> <span class="dt">FeedConfiguration</span></a>
|
||||
<a class="sourceLine" id="cb28-3" title="3"> { feedTitle <span class="ot">=</span> <span class="st">"Great Old Ones"</span></a>
|
||||
<a class="sourceLine" id="cb28-4" title="4"> , feedDescription <span class="ot">=</span> <span class="st">"This feed provide information about Great Old Ones"</span></a>
|
||||
<a class="sourceLine" id="cb28-5" title="5"> , feedAuthorName <span class="ot">=</span> <span class="st">"Abdul Alhazred"</span></a>
|
||||
<a class="sourceLine" id="cb28-6" title="6"> , feedAuthorEmail <span class="ot">=</span> <span class="st">"abdul.alhazred@great-old-ones.com"</span></a>
|
||||
<a class="sourceLine" id="cb28-7" title="7"> , feedRoot <span class="ot">=</span> <span class="st">"http://great-old-ones.com"</span></a>
|
||||
<a class="sourceLine" id="cb28-8" title="8"> }</a></code></pre></div>
|
||||
<p>Great idea certainly steal from <a href="http://nanoc.ws">nanoc</a> (my previous blog engine)!</p>
|
||||
<h3 id="filter-the-content">Filter the content</h3>
|
||||
<p>As I just said, <a href="http://nanoc.ws">nanoc</a> was my preceding blog engine. It is written in Ruby and as Hakyll, it is quite awesome. And one thing Ruby does more naturally than Haskell is regular expressions. I had a <em>lot</em> of filters in nanoc. I lost some because I don’t use them much. But I wanted to keep some. Generally, filtering the content is just a way to apply to the body a function of type <code>String -> String</code>.</p>
|
||||
<p>Also we generally want prefilters (to filter the markdown) and postfilters (to filter the <span class="sc"><abbr title="HyperText Markup Language">html</abbr></span> after the pandoc compilation).</p>
|
||||
<p>Here is how I do it:</p>
|
||||
<div class="sourceCode" id="cb29"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb29-1" title="1">markdownPostBehavior <span class="ot">=</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb29-2" title="2"> route <span class="op">$</span> niceRoute</a>
|
||||
<a class="sourceLine" id="cb29-3" title="3"> compile <span class="op">$</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb29-4" title="4"> body <span class="ot"><-</span> getResourceBody</a>
|
||||
<a class="sourceLine" id="cb29-5" title="5"> <span class="highlight">prefilteredText <span class="ot"><-</span> <span class="fu">return</span> <span class="op">$</span> (<span class="fu">fmap</span> preFilters body)</span></a>
|
||||
<a class="sourceLine" id="cb29-6" title="6"> <span class="highlight"><span class="fu">return</span> <span class="op">$</span> renderPandoc prefilteredText</span></a>
|
||||
<a class="sourceLine" id="cb29-7" title="7"> <span class="highlight"><span class="op">>>=</span> applyFilter postFilters</span></a>
|
||||
<a class="sourceLine" id="cb29-8" title="8"> <span class="op">>>=</span> saveSnapshot <span class="st">"content"</span></a>
|
||||
<a class="sourceLine" id="cb29-9" title="9"> <span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/post.html"</span> yContext</a>
|
||||
<a class="sourceLine" id="cb29-10" title="10"> <span class="op">>>=</span> loadAndApplyTemplate <span class="st">"templates/boilerplate.html"</span> yContext</a>
|
||||
<a class="sourceLine" id="cb29-11" title="11"> <span class="op">>>=</span> relativizeUrls</a>
|
||||
<a class="sourceLine" id="cb29-12" title="12"> <span class="op">>>=</span> removeIndexHtml</a></code></pre></div>
|
||||
<p>Where</p>
|
||||
<div class="sourceCode" id="cb30"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb30-1" title="1">applyFilter strfilter str <span class="ot">=</span> <span class="fu">return</span> <span class="op">$</span> (<span class="fu">fmap</span> <span class="op">$</span> strfilter) str</a>
|
||||
<a class="sourceLine" id="cb30-2" title="2"><span class="ot">preFilters ::</span> <span class="dt">String</span> <span class="ot">-></span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb30-3" title="3"><span class="ot">postFilters ::</span> <span class="dt">String</span> <span class="ot">-></span> <span class="dt">String</span></a></code></pre></div>
|
||||
<p>Now we have a simple way to filter the content. Let’s augment the markdown ability.</p>
|
||||
<h3 id="add-abbreviations-support">Add abbreviations support</h3>
|
||||
<p>Comparing to <span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span>, a very annoying markdown limitation is the lack of abbreviations.</p>
|
||||
<p>Fortunately we can filter our content. And here is the filter I use:</p>
|
||||
<div class="sourceCode" id="cb31"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb31-1" title="1"><span class="ot">abbreviationFilter ::</span> <span class="dt">String</span> <span class="ot">-></span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb31-2" title="2">abbreviationFilter <span class="ot">=</span> replaceAll <span class="st">"%[a-zA-Z0-9_]*"</span> newnaming</a>
|
||||
<a class="sourceLine" id="cb31-3" title="3"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb31-4" title="4"> newnaming matched <span class="ot">=</span> <span class="kw">case</span> M.lookup (<span class="fu">tail</span> matched) abbreviations <span class="kw">of</span></a>
|
||||
<a class="sourceLine" id="cb31-5" title="5"> <span class="dt">Nothing</span> <span class="ot">-></span> matched</a>
|
||||
<a class="sourceLine" id="cb31-6" title="6"> <span class="dt">Just</span> v <span class="ot">-></span> v</a>
|
||||
<a class="sourceLine" id="cb31-7" title="7"><span class="ot">abbreviations ::</span> <span class="dt">Map</span> <span class="dt">String</span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb31-8" title="8">abbreviations <span class="ot">=</span> M.fromList</a>
|
||||
<a class="sourceLine" id="cb31-9" title="9"> [ (<span class="st">"html"</span>, <span class="st">"<span class=\"sc\">html</span>"</span>)</a>
|
||||
<a class="sourceLine" id="cb31-10" title="10"> , (<span class="st">"css"</span>, <span class="st">"<span class=\"sc\">css</span>"</span>)</a>
|
||||
<a class="sourceLine" id="cb31-11" title="11"> , (<span class="st">"svg"</span>, <span class="st">"<span class=\"sc\">svg</span>"</span>)</a>
|
||||
<a class="sourceLine" id="cb31-12" title="12"> , (<span class="st">"xml"</span>, <span class="st">"<span class=\"sc\">xml</span>"</span>)</a>
|
||||
<a class="sourceLine" id="cb31-13" title="13"> , (<span class="st">"xslt"</span>, <span class="st">"<span class=\"sc\">xslt</span>"</span>) ]</a></code></pre></div>
|
||||
<p>It will search for all string starting by ‘%’ and it will search in the <code>Map</code> if there is a corresponding abbreviation. If there is one, we replace the content. Otherwise we do nothing.</p>
|
||||
<p>Do you really believe I type</p>
|
||||
<div class="sourceCode" id="cb32"><pre class="sourceCode html wrap"><code class="sourceCode html"><a class="sourceLine" id="cb32-1" title="1"><span class="kw"><span</span><span class="ot"> style=</span><span class="st">"text-transform: uppercase"</span><span class="kw">></span>L<span class="kw"><sup</span><span class="ot"> style=</span><span class="st">"vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em"</span><span class="kw">></span>a<span class="kw"></sup></span>T<span class="kw"><sub</span><span class="ot"> style=</span><span class="st">"vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em"</span><span class="kw">></span>e<span class="kw"></sub></span>X<span class="kw"></span></span></a></code></pre></div>
|
||||
<p>each time I write <span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span>?</p>
|
||||
<h3 id="manage-two-languages">Manage two languages</h3>
|
||||
<p>Generally I write my post in English and French. And this is more difficult than it appears. For example, I need to filter the language in order to get the right list of posts. I also use some words in the templates and I want them to be translated.</p>
|
||||
<div class="sourceCode" id="cb33"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb33-1" title="1"><span class="kw"><a</span><span class="ot"> href=</span><span class="st">"$otherLanguagePath$"</span></a>
|
||||
<a class="sourceLine" id="cb33-2" title="2"><span class="ot"> onclick=</span><span class="st">"setLanguage('$otherlanguage$')"</span><span class="kw">></span></a>
|
||||
<a class="sourceLine" id="cb33-3" title="3"> <span class="highlight">$changeLanguage$</span> <span class="kw"></a></span></a></code></pre></div>
|
||||
<p>First I create a Map containing all translations.</p>
|
||||
<div class="sourceCode" id="cb34"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb34-1" title="1"><span class="kw">data</span> <span class="dt">Trad</span> <span class="ot">=</span> <span class="dt">Trad</span> {<span class="ot"> frTrad ::</span> <span class="dt">String</span>,<span class="ot"> enTrad ::</span> <span class="dt">String</span> }</a>
|
||||
<a class="sourceLine" id="cb34-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb34-3" title="3"><span class="ot">trads ::</span> <span class="dt">Map</span> <span class="dt">String</span> <span class="dt">Trad</span></a>
|
||||
<a class="sourceLine" id="cb34-4" title="4">trads <span class="ot">=</span> M.fromList <span class="op">$</span> <span class="fu">map</span> toTrad [</a>
|
||||
<a class="sourceLine" id="cb34-5" title="5"> (<span class="st">"changeLanguage"</span>,</a>
|
||||
<a class="sourceLine" id="cb34-6" title="6"> (<span class="st">"English"</span></a>
|
||||
<a class="sourceLine" id="cb34-7" title="7"> , <span class="st">"Français"</span>))</a>
|
||||
<a class="sourceLine" id="cb34-8" title="8"> ,(<span class="st">"switchCss"</span>,</a>
|
||||
<a class="sourceLine" id="cb34-9" title="9"> (<span class="st">"Changer de theme"</span></a>
|
||||
<a class="sourceLine" id="cb34-10" title="10"> ,<span class="st">"Change Theme"</span>))</a>
|
||||
<a class="sourceLine" id="cb34-11" title="11"> ,(<span class="st">"socialPrivacy"</span>,</a>
|
||||
<a class="sourceLine" id="cb34-12" title="12"> (<span class="st">"Ces liens sociaux préservent votre vie privée"</span></a>
|
||||
<a class="sourceLine" id="cb34-13" title="13"> ,<span class="st">"These social sharing links preserve your privacy"</span>))</a>
|
||||
<a class="sourceLine" id="cb34-14" title="14"> ]</a>
|
||||
<a class="sourceLine" id="cb34-15" title="15"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb34-16" title="16"> toTrad (key,(french,english)) <span class="ot">=</span></a>
|
||||
<a class="sourceLine" id="cb34-17" title="17"> (key, <span class="dt">Trad</span> { frTrad <span class="ot">=</span> french , enTrad <span class="ot">=</span> english })</a></code></pre></div>
|
||||
<p>Then I create a context for all key:</p>
|
||||
<div class="sourceCode" id="cb35"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb35-1" title="1"><span class="ot">tradsContext ::</span> <span class="dt">Context</span> a</a>
|
||||
<a class="sourceLine" id="cb35-2" title="2">tradsContext <span class="ot">=</span> <span class="fu">mconcat</span> (<span class="fu">map</span> addTrad (M.keys trads))</a>
|
||||
<a class="sourceLine" id="cb35-3" title="3"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb35-4" title="4"><span class="ot"> addTrad ::</span> <span class="dt">String</span> <span class="ot">-></span> <span class="dt">Context</span> a</a>
|
||||
<a class="sourceLine" id="cb35-5" title="5"> addTrad name <span class="ot">=</span></a>
|
||||
<a class="sourceLine" id="cb35-6" title="6"> field name <span class="op">$</span> \item <span class="ot">-></span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb35-7" title="7"> lang <span class="ot"><-</span> itemLang item</a>
|
||||
<a class="sourceLine" id="cb35-8" title="8"> <span class="kw">case</span> M.lookup name trads <span class="kw">of</span></a>
|
||||
<a class="sourceLine" id="cb35-9" title="9"> <span class="dt">Just</span> (<span class="dt">Trad</span> lmap) <span class="ot">-></span> <span class="kw">case</span> M.lookup (<span class="dt">L</span> lang) lmap <span class="kw">of</span></a>
|
||||
<a class="sourceLine" id="cb35-10" title="10"> <span class="dt">Just</span> tr <span class="ot">-></span> <span class="fu">return</span> tr</a>
|
||||
<a class="sourceLine" id="cb35-11" title="11"> <span class="dt">Nothing</span> <span class="ot">-></span> <span class="fu">return</span> (<span class="st">"NO TRANSLATION FOR "</span> <span class="op">++</span> name)</a>
|
||||
<a class="sourceLine" id="cb35-12" title="12"> <span class="dt">Nothing</span> <span class="ot">-></span> <span class="fu">return</span> (<span class="st">"NO TRANSLATION FOR "</span> <span class="op">++</span> name)</a></code></pre></div>
|
||||
<h2 id="conclusion">Conclusion</h2>
|
||||
<p>The full code is <a href="http://github.com/yogsototh/yblog.git">here</a>. And except from the main file, I use literate Haskell. This way the code should be easier to understand.</p>
|
||||
<p>If you want to know why I switched from nanoc:</p>
|
||||
<p>My preceding nanoc website was a bit too messy. So much in fact, that the dependency system recompiled the entire website for any change.</p>
|
||||
<p>So I had to do something about it. I had two choices:</p>
|
||||
<ol type="1">
|
||||
<li>Correct my old code (in Ruby)</li>
|
||||
<li>Duplicate the core functionalities with Hakyll (in Haskell)</li>
|
||||
</ol>
|
||||
<p>I added too much functionalities in my nanoc system. Starting from scratch (almost) remove efficiently a lot of unused crap.</p>
|
||||
<p>So far I am very happy with the switch. A complete build is about 4x faster. I didn’t broke the dependency system this time. As soon as I modify and save the markdown source, I can reload the page in the browser.</p>
|
||||
<p>I removed a lot of feature thought. Some of them will be difficult to achieve with Hakyll. A typical example:</p>
|
||||
<p>In nanoc I could take a file like this as source:</p>
|
||||
<div class="sourceCode" id="cb36"><pre class="sourceCode markdown"><code class="sourceCode markdown"><a class="sourceLine" id="cb36-1" title="1"><span class="fu"># Title</span></a>
|
||||
<a class="sourceLine" id="cb36-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb36-3" title="3">content</a>
|
||||
<a class="sourceLine" id="cb36-4" title="4"></a>
|
||||
<a class="sourceLine" id="cb36-5" title="5"><code file="foo.hs"></a>
|
||||
<a class="sourceLine" id="cb36-6" title="6">main = putStrLn "Cthulhu!"</a>
|
||||
<a class="sourceLine" id="cb36-7" title="7"></code></a></code></pre></div>
|
||||
<p>And it will create a file <code>foo.hs</code> which could then be downloaded.</p>
|
||||
<div class="sourceCode" id="cb37"><pre class="sourceCode html"><code class="sourceCode html"><a class="sourceLine" id="cb37-1" title="1"><span class="kw"><h1></span>Title<span class="kw"></h1></span></a>
|
||||
<a class="sourceLine" id="cb37-2" title="2"></a>
|
||||
<a class="sourceLine" id="cb37-3" title="3"><span class="kw"><p></span>content<span class="kw"></p></span></a>
|
||||
<a class="sourceLine" id="cb37-4" title="4"></a>
|
||||
<a class="sourceLine" id="cb37-5" title="5"><span class="kw"><a</span><span class="ot"> href=</span><span class="st">"code/foo.hs"</span><span class="kw">></span>Download foo.hs<span class="kw"></a></span></a>
|
||||
<a class="sourceLine" id="cb37-6" title="6"><span class="kw"><pre><code></span>main = putStrLn "Cthulhu!"<span class="kw"></code></pre></span></a></code></pre></div>
|
||||
<section class="footnotes">
|
||||
<hr />
|
||||
<ol>
|
||||
<li id="fn1"><p>We could also add the metadatas in an external file (<code>foo.md.metadata</code>).<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/Hakyll-setup/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/Hakyll-setup/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2013-03-16
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
a=27;b=79;c=C(-2.0,-1.0);d=C(1.0,1.0);e=C(-2.501,-1.003)
|
||||
newtype C = C (Double,Double) deriving (Show,Eq)
|
||||
instance Num C where C(x,y)*C(z,t)=C(z*x-y*t,y*z+x*t);C(x,y)+C(z,t)=C(x+z,y+t);abs(C(x,y))=C(sqrt(x*x+y*y),0.0)
|
||||
r(C(x,y))=x;i(C(x,y))=y
|
||||
f c z 0=0;f c z n=if(r(abs(z))>2)then n else f c ((z*z)+c) (n-1)
|
||||
h j k = map (\z->(f (C z) (C(0,0)) 32,(fst z>l - q/2))) [(x,y)|y<-[p,(p+((o-p)/a))..o],x<-[m,(m + q)..l]] where o=i k;p=i j;m=r j;l=r k;q=(l-m)/b
|
||||
u j k = concat $ map v $ h j k where v (i,p)=(" .,`'°\":;-+oO0123456789=!%*§&$@#"!!i):rst p;rst True="\n";rst False=""
|
||||
main = putStrLn $ im 0 where cl n (C (x,y))=let cs=(1.1**n-1) in C ((x+cs*(r e))/cs+1,(y+cs*(i e))/cs+1);bl n=cl n c;tr n=cl n d;im n=u (bl n) (tr n)++"\x1b[H\x1b[25A"++im (n+1)
|
||||
|
|
@ -0,0 +1,205 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>YBlog - ASCII Haskell Mandelbrot</title>
|
||||
<meta name="keywords" content="mandelbrot, haskell, ASCII, golfed" />
|
||||
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/brutalist.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../../Scratch/css/pandoc-solarized.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="../../../../Scratch/en/blog/feed/feed.xml" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||||
<![endif]-->
|
||||
<!-- IndieAuth -->
|
||||
<link href="https://twitter.com/yogsototh" rel="me">
|
||||
<link href="https://github.com/yogsototh" rel="me">
|
||||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||||
</head>
|
||||
<body lang="en" class="article">
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<div id="choix">
|
||||
<span id="choixlang">
|
||||
<a href="../../../../Scratch/fr/blog/Haskell-Mandelbrot/">French</a>
|
||||
</span>
|
||||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||||
<span class="flush"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="titre">
|
||||
<h1>ASCII Haskell Mandelbrot</h1>
|
||||
|
||||
</div>
|
||||
<div class="flush"></div>
|
||||
<div id="afterheader" class="article">
|
||||
<div class="corps">
|
||||
<p>Here is the obfuscated code:</p>
|
||||
<div class="sourceCode" id="cb1"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb1-1" title="1">a<span class="ot">=</span><span class="dv">27</span>;b<span class="ot">=</span><span class="dv">79</span>;c<span class="ot">=</span><span class="dt">C</span>(<span class="op">-</span><span class="fl">2.0</span>,<span class="op">-</span><span class="fl">1.0</span>);d<span class="ot">=</span><span class="dt">C</span>(<span class="fl">1.0</span>,<span class="fl">1.0</span>);e<span class="ot">=</span><span class="dt">C</span>(<span class="op">-</span><span class="fl">2.501</span>,<span class="op">-</span><span class="fl">1.003</span>)</a>
|
||||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw">newtype</span> <span class="dt">C</span> <span class="ot">=</span> <span class="dt">C</span> (<span class="dt">Double</span>,<span class="dt">Double</span>) <span class="kw">deriving</span> (<span class="dt">Show</span>,<span class="dt">Eq</span>)</a>
|
||||
<a class="sourceLine" id="cb1-3" title="3"><span class="kw">instance</span> <span class="dt">Num</span> <span class="dt">C</span> <span class="kw">where</span> <span class="dt">C</span>(x,y)<span class="op">*</span><span class="dt">C</span>(z,t)<span class="ot">=</span><span class="dt">C</span>(z<span class="op">*</span>x<span class="op">-</span>y<span class="op">*</span>t,y<span class="op">*</span>z<span class="op">+</span>x<span class="op">*</span>t);<span class="dt">C</span>(x,y)<span class="op">+</span><span class="dt">C</span>(z,t)<span class="ot">=</span><span class="dt">C</span>(x<span class="op">+</span>z,y<span class="op">+</span>t);<span class="fu">abs</span>(<span class="dt">C</span>(x,y))<span class="ot">=</span><span class="dt">C</span>(<span class="fu">sqrt</span>(x<span class="op">*</span>x<span class="op">+</span>y<span class="op">*</span>y),<span class="fl">0.0</span>)</a>
|
||||
<a class="sourceLine" id="cb1-4" title="4">r(<span class="dt">C</span>(x,y))<span class="ot">=</span>x;i(<span class="dt">C</span>(x,y))<span class="ot">=</span>y</a>
|
||||
<a class="sourceLine" id="cb1-5" title="5">f c z <span class="dv">0</span><span class="ot">=</span><span class="dv">0</span>;f c z n<span class="ot">=</span><span class="kw">if</span>(r(<span class="fu">abs</span>(z))<span class="op">></span><span class="dv">2</span>)<span class="kw">then</span> n <span class="kw">else</span> f c ((z<span class="op">*</span>z)<span class="op">+</span>c) (n<span class="op">-</span><span class="dv">1</span>)</a>
|
||||
<a class="sourceLine" id="cb1-6" title="6">h j k <span class="ot">=</span> <span class="fu">map</span> (\z<span class="ot">-></span>(f (<span class="dt">C</span> z) (<span class="dt">C</span>(<span class="dv">0</span>,<span class="dv">0</span>)) <span class="dv">32</span>,(<span class="fu">fst</span> z<span class="op">></span>l <span class="op">-</span> q<span class="op">/</span><span class="dv">2</span>))) [(x,y)<span class="op">|</span>y<span class="ot"><-</span>[p,(p<span class="op">+</span>((o<span class="op">-</span>p)<span class="op">/</span>a))<span class="op">..</span>o],x<span class="ot"><-</span>[m,(m <span class="op">+</span> q)<span class="op">..</span>l]] <span class="kw">where</span> o<span class="ot">=</span>i k;p<span class="ot">=</span>i j;m<span class="ot">=</span>r j;l<span class="ot">=</span>r k;q<span class="ot">=</span>(l<span class="op">-</span>m)<span class="op">/</span>b</a>
|
||||
<a class="sourceLine" id="cb1-7" title="7">u j k <span class="ot">=</span> <span class="fu">concat</span> <span class="op">$</span> <span class="fu">map</span> v <span class="op">$</span> h j k <span class="kw">where</span> v (i,p)<span class="ot">=</span>(<span class="st">" .,`'°\":;-+oO0123456789=!%*§&$@#"</span><span class="op">!!</span>i)<span class="op">:</span>rst p;rst <span class="dt">True</span><span class="ot">=</span><span class="st">"\n"</span>;rst <span class="dt">False</span><span class="ot">=</span><span class="st">""</span></a>
|
||||
<a class="sourceLine" id="cb1-8" title="8">main <span class="ot">=</span> <span class="fu">putStrLn</span> <span class="op">$</span> im <span class="dv">0</span> <span class="kw">where</span> cl n (<span class="dt">C</span> (x,y))<span class="ot">=</span><span class="kw">let</span> cs<span class="ot">=</span>(<span class="fl">1.1</span><span class="op">**</span>n<span class="op">-</span><span class="dv">1</span>) <span class="kw">in</span> <span class="dt">C</span> ((x<span class="op">+</span>cs<span class="op">*</span>(r e))<span class="op">/</span>cs<span class="op">+</span><span class="dv">1</span>,(y<span class="op">+</span>cs<span class="op">*</span>(i e))<span class="op">/</span>cs<span class="op">+</span><span class="dv">1</span>);bl n<span class="ot">=</span>cl n c;tr n<span class="ot">=</span>cl n d;im n<span class="ot">=</span>u (bl n) (tr n)<span class="op">++</span><span class="st">"\x1b[H\x1b[25A"</span><span class="op">++</span>im (n<span class="op">+</span><span class="dv">1</span>)</a></code></pre></div>
|
||||
<p>To launch it, you’ll need to have <a href="http://haskell.org">haskell</a> installed and to run:</p>
|
||||
<p><code class="zsh">ghc –make animandel.hs && animandel</code></p>
|
||||
<p>Here is some image after 50 iterations:</p>
|
||||
<pre>
|
||||
###@@@@@@@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&&&&WWOOClbUOWW&&$$$$$$$$$$$$$$
|
||||
##@@@@@@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&&&&WWUCUb; ,jUOWW&&&$$$$$$$$$$$$
|
||||
#@@@@@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&&WWWWWUb ooCWW&&&&&&$$$$$$$$
|
||||
@@@@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&WWWWWWWWOU uUOWWWW&&&&&&$$$$$
|
||||
@@@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&&WOUObUOOOUUUCbi rbCUUUOWWWWWOUW&$$$
|
||||
@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&&&&&WWWUcr,iiCb o wUUUUUC;OW&$$
|
||||
$$$$$$$$$$$$$$$$$$$$$$$$$$&&&&&&&&&&WWWWOUC, j llW&&$
|
||||
$$$$$$$$$$$$$$$$$$$$$&&&&&&&&&&&&WWWWWWOCCbi bWWW&&
|
||||
$$$$$$$$$$$$$$$$$&&WWWWWWW&&&WWWWWWWWOUo jUOWW&&
|
||||
$$$$$$$$$$$$$$&&&WWOwOOWWWOUUOWWWWWOOUbw j.blW&
|
||||
$$$$$$$$$$$&&&&&WWWObiijbUCl bCiUUUUUCj, bOW&
|
||||
$$$$$$$$$&&&&&&&WWWOUbw ; oobCbl jUWW&
|
||||
$$$$$$$&&&&&&&WWWWOcbi ij jUW&&
|
||||
$$$$$&&WWWWWWWOwUUCbw WW&&
|
||||
WWWOWWWWWWWWWUUbo UWWW&&
|
||||
: wbUOWW&&&
|
||||
WWWOWWWWWWWWWUUbo UWWW&&
|
||||
$$$$$&&WWWWWWWOwUUCbw WW&&
|
||||
$$$$$$$&&&&&&&WWWWOcbi ij jUW&&
|
||||
$$$$$$$$$&&&&&&&WWWOUbw ; oobCbl jUWW&
|
||||
$$$$$$$$$$$&&&&&WWWObiijbUCl bCiUUUUUCj, bOW&
|
||||
$$$$$$$$$$$$$$&&&WWOwOOWWWOUUOWWWWWOOUbw j.blW&
|
||||
$$$$$$$$$$$$$$$$$&&WWWWWWW&&&WWWWWWWWOUo jUOWW&&
|
||||
$$$$$$$$$$$$$$$$$$$$$&&&&&&&&&&&&WWWWWWOCCbi bWWW&&
|
||||
$$$$$$$$$$$$$$$$$$$$$$$$$$&&&&&&&&&&WWWWOUC, j llW&&$
|
||||
@$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$&&&&&&WWWUcr,iiCb o wUUUUUC;OW&$$
|
||||
</pre>
|
||||
<p>Here is the more readable version. I believe with this far more readable version, no more explanation is needed.</p>
|
||||
<div class="sourceCode" id="cb2"><pre class="sourceCode haskell"><code class="sourceCode haskell"><a class="sourceLine" id="cb2-1" title="1">nbvert <span class="ot">=</span> <span class="dv">30</span></a>
|
||||
<a class="sourceLine" id="cb2-2" title="2">nbhor <span class="ot">=</span> <span class="dv">79</span></a>
|
||||
<a class="sourceLine" id="cb2-3" title="3">zoomfactor <span class="ot">=</span> <span class="fl">1.01</span></a>
|
||||
<a class="sourceLine" id="cb2-4" title="4">init_bottom_left <span class="ot">=</span> <span class="dt">C</span> (<span class="op">-</span><span class="fl">2.0</span>,<span class="op">-</span><span class="fl">2.0</span>)</a>
|
||||
<a class="sourceLine" id="cb2-5" title="5">init_top_right <span class="ot">=</span> <span class="dt">C</span> (<span class="fl">3.0</span>,<span class="fl">2.0</span>)</a>
|
||||
<a class="sourceLine" id="cb2-6" title="6">interrest <span class="ot">=</span> <span class="dt">C</span> (<span class="op">-</span><span class="fl">1.713</span>,<span class="op">-</span><span class="fl">0.000</span>)</a>
|
||||
<a class="sourceLine" id="cb2-7" title="7"></a>
|
||||
<a class="sourceLine" id="cb2-8" title="8"><span class="kw">newtype</span> <span class="dt">Complex</span> <span class="ot">=</span> <span class="dt">C</span> (<span class="dt">Float</span>,<span class="dt">Float</span>) <span class="kw">deriving</span> (<span class="dt">Show</span>,<span class="dt">Eq</span>)</a>
|
||||
<a class="sourceLine" id="cb2-9" title="9"><span class="kw">instance</span> <span class="dt">Num</span> <span class="dt">Complex</span> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb2-10" title="10"> <span class="fu">fromInteger</span> n <span class="ot">=</span> <span class="dt">C</span> (<span class="fu">fromIntegral</span> n,<span class="fl">0.0</span>)</a>
|
||||
<a class="sourceLine" id="cb2-11" title="11"> <span class="dt">C</span> (x,y) <span class="op">*</span> <span class="dt">C</span> (z,t) <span class="ot">=</span> <span class="dt">C</span> (z<span class="op">*</span>x <span class="op">-</span> y<span class="op">*</span>t, y<span class="op">*</span>z <span class="op">+</span> x<span class="op">*</span>t)</a>
|
||||
<a class="sourceLine" id="cb2-12" title="12"> <span class="dt">C</span> (x,y) <span class="op">+</span> <span class="dt">C</span> (z,t) <span class="ot">=</span> <span class="dt">C</span> (x<span class="op">+</span>z, y<span class="op">+</span>t)</a>
|
||||
<a class="sourceLine" id="cb2-13" title="13"> <span class="fu">abs</span> (<span class="dt">C</span> (x,y)) <span class="ot">=</span> <span class="dt">C</span> (<span class="fu">sqrt</span> (x<span class="op">*</span>x <span class="op">+</span> y<span class="op">*</span>y),<span class="fl">0.0</span>)</a>
|
||||
<a class="sourceLine" id="cb2-14" title="14"> <span class="fu">signum</span> (<span class="dt">C</span> (x,y)) <span class="ot">=</span> <span class="dt">C</span> (<span class="fu">signum</span> x , <span class="fl">0.0</span>)</a>
|
||||
<a class="sourceLine" id="cb2-15" title="15"></a>
|
||||
<a class="sourceLine" id="cb2-16" title="16"><span class="ot">real ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Float</span></a>
|
||||
<a class="sourceLine" id="cb2-17" title="17">real (<span class="dt">C</span> (x,y)) <span class="ot">=</span> x</a>
|
||||
<a class="sourceLine" id="cb2-18" title="18"><span class="ot">im ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Float</span></a>
|
||||
<a class="sourceLine" id="cb2-19" title="19">im (<span class="dt">C</span> (x,y)) <span class="ot">=</span> y</a>
|
||||
<a class="sourceLine" id="cb2-20" title="20"></a>
|
||||
<a class="sourceLine" id="cb2-21" title="21"><span class="ot">cabs ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Float</span></a>
|
||||
<a class="sourceLine" id="cb2-22" title="22">cabs <span class="ot">=</span> real<span class="op">.</span><span class="fu">abs</span></a>
|
||||
<a class="sourceLine" id="cb2-23" title="23"></a>
|
||||
<a class="sourceLine" id="cb2-24" title="24"><span class="ot">f ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Int</span> <span class="ot">-></span> <span class="dt">Int</span></a>
|
||||
<a class="sourceLine" id="cb2-25" title="25">f c z <span class="dv">0</span> <span class="ot">=</span> <span class="dv">0</span></a>
|
||||
<a class="sourceLine" id="cb2-26" title="26">f c z n <span class="ot">=</span> <span class="kw">if</span> (cabs z <span class="op">></span> <span class="dv">2</span>) <span class="kw">then</span> n <span class="kw">else</span> f c ((z<span class="op">*</span>z)<span class="op">+</span>c) (n<span class="op">-</span><span class="dv">1</span>) </a>
|
||||
<a class="sourceLine" id="cb2-27" title="27"></a>
|
||||
<a class="sourceLine" id="cb2-28" title="28">bmandel bottomleft topright <span class="ot">=</span> <span class="fu">map</span> (\z <span class="ot">-></span> (f (<span class="dt">C</span> z) (<span class="dt">C</span>(<span class="dv">0</span>,<span class="dv">0</span>)) <span class="dv">32</span>, (<span class="fu">fst</span> z <span class="op">></span> right <span class="op">-</span> hstep<span class="op">/</span><span class="dv">2</span> ))) [(x,y) <span class="op">|</span> y <span class="ot"><-</span> [bottom,(bottom <span class="op">+</span> vstep)<span class="op">..</span>top], x<span class="ot"><-</span>[left,(left <span class="op">+</span> hstep)<span class="op">..</span>right]]</a>
|
||||
<a class="sourceLine" id="cb2-29" title="29"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb2-30" title="30"> top <span class="ot">=</span> im topright</a>
|
||||
<a class="sourceLine" id="cb2-31" title="31"> bottom <span class="ot">=</span> im bottomleft</a>
|
||||
<a class="sourceLine" id="cb2-32" title="32"> left <span class="ot">=</span> real bottomleft</a>
|
||||
<a class="sourceLine" id="cb2-33" title="33"> right <span class="ot">=</span> real topright</a>
|
||||
<a class="sourceLine" id="cb2-34" title="34"> vstep<span class="ot">=</span>(top<span class="op">-</span>bottom)<span class="op">/</span>nbvert</a>
|
||||
<a class="sourceLine" id="cb2-35" title="35"> hstep<span class="ot">=</span>(right<span class="op">-</span>left)<span class="op">/</span>nbhor</a>
|
||||
<a class="sourceLine" id="cb2-36" title="36"></a>
|
||||
<a class="sourceLine" id="cb2-37" title="37"><span class="ot">mandel ::</span> (<span class="dt">Complex</span>,<span class="dt">Complex</span>) <span class="ot">-></span> <span class="dt">String</span></a>
|
||||
<a class="sourceLine" id="cb2-38" title="38">mandel (bottomleft,topright) <span class="ot">=</span> <span class="fu">concat</span> <span class="op">$</span> <span class="fu">map</span> treat <span class="op">$</span> bmandel bottomleft topright</a>
|
||||
<a class="sourceLine" id="cb2-39" title="39"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb2-40" title="40"> treat (i,jump) <span class="ot">=</span> <span class="st">" .,:;rcuowijlbCUOW&$@#"</span> <span class="op">!!</span> (<span class="fu">div</span> (i<span class="op">*</span><span class="dv">22</span>) <span class="dv">32</span>)<span class="op">:</span>rst jump</a>
|
||||
<a class="sourceLine" id="cb2-41" title="41"> rst <span class="dt">True</span> <span class="ot">=</span> <span class="st">"\n"</span></a>
|
||||
<a class="sourceLine" id="cb2-42" title="42"> rst <span class="dt">False</span> <span class="ot">=</span> <span class="st">""</span></a>
|
||||
<a class="sourceLine" id="cb2-43" title="43"></a>
|
||||
<a class="sourceLine" id="cb2-44" title="44"><span class="ot">cdiv ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Float</span> <span class="ot">-></span> <span class="dt">Complex</span></a>
|
||||
<a class="sourceLine" id="cb2-45" title="45">cdiv (<span class="dt">C</span>(x,y)) r <span class="ot">=</span> <span class="dt">C</span>(x<span class="op">/</span>r, y<span class="op">/</span>r) </a>
|
||||
<a class="sourceLine" id="cb2-46" title="46"><span class="ot">cmul ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Float</span> <span class="ot">-></span> <span class="dt">Complex</span></a>
|
||||
<a class="sourceLine" id="cb2-47" title="47">cmul (<span class="dt">C</span>(x,y)) r <span class="ot">=</span> <span class="dt">C</span>(x<span class="op">*</span>r, y<span class="op">*</span>r) </a>
|
||||
<a class="sourceLine" id="cb2-48" title="48"></a>
|
||||
<a class="sourceLine" id="cb2-49" title="49"><span class="ot">zoom ::</span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Complex</span> <span class="ot">-></span> <span class="dt">Float</span> <span class="ot">-></span> (<span class="dt">Complex</span>,<span class="dt">Complex</span>)</a>
|
||||
<a class="sourceLine" id="cb2-50" title="50">zoom bl tr center magn <span class="ot">=</span> (f bl, f tr)</a>
|
||||
<a class="sourceLine" id="cb2-51" title="51"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb2-52" title="52"> f point <span class="ot">=</span> ((center <span class="ot">`cmul`</span> magn) <span class="op">+</span> point ) <span class="ot">`cdiv`</span> (magn <span class="op">+</span> <span class="dv">1</span>)</a>
|
||||
<a class="sourceLine" id="cb2-53" title="53"></a>
|
||||
<a class="sourceLine" id="cb2-54" title="54">main <span class="ot">=</span> <span class="kw">do</span></a>
|
||||
<a class="sourceLine" id="cb2-55" title="55"> x <span class="ot"><-</span> <span class="fu">getContents</span></a>
|
||||
<a class="sourceLine" id="cb2-56" title="56"> <span class="fu">putStrLn</span> <span class="op">$</span> infinitemandel <span class="dv">0</span></a>
|
||||
<a class="sourceLine" id="cb2-57" title="57"> <span class="kw">where</span></a>
|
||||
<a class="sourceLine" id="cb2-58" title="58"> window n <span class="ot">=</span> zoom init_bottom_left init_top_right interrest (zoomfactor<span class="op">**</span>n) </a>
|
||||
<a class="sourceLine" id="cb2-59" title="59"> infinitemandel n <span class="ot">=</span> mandel (window n) <span class="op">++</span> <span class="st">"\x1b[H\x1b[25A"</span> <span class="op">++</span> infinitemandel (n<span class="op">+</span><span class="dv">1</span>)</a></code></pre></div>
|
||||
</div>
|
||||
<div id="afterarticle">
|
||||
<div id="social">
|
||||
<a href="../../../../Scratch/en/blog/feed/feed.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||||
·
|
||||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/Haskell-Mandelbrot/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||||
·
|
||||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/Haskell-Mandelbrot/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||||
<br />
|
||||
<a class="message" href="../../../../Scratch/en/blog/Social-link-the-right-way/">These social sharing links preserve your privacy</a>
|
||||
</div>
|
||||
<div id="navigation">
|
||||
<a href="../../../../">Home</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/blog">Blog</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/softwares">Softwares</a>
|
||||
<span class="sep">¦</span>
|
||||
<a href="../../../../Scratch/en/about">About</a>
|
||||
</div>
|
||||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||||
<div id="bottom">
|
||||
<div>
|
||||
Published on 2011-07-10
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||||
</div>
|
||||
<div>
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Done with
|
||||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||||
<span class="pala">&</span>
|
||||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||||
</div>
|
||||
<hr />
|
||||
<div style="max-width: 100%">
|
||||
<a href="https://cardanohub.org">
|
||||
<img src="../../../../Scratch/img/ada-logo.png" class="simple" style="height: 16px;
|
||||
border-radius: 50%;
|
||||
vertical-align:middle;
|
||||
display:inline-block;" />
|
||||
ADA:
|
||||
</a>
|
||||
<code style="display:inline-block;
|
||||
word-wrap:break-word;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
max-width: 85%;">
|
||||
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
## Introduction
|
||||
|
||||
In my
|
||||
[preceding article](/Scratch/en/blog/Haskell-the-Hard-Way/) I introduced Haskell.
|
||||
|
||||
This article goes further.
|
||||
It will show how to use functional programming with interactive programs.
|
||||
But more than that, it will show how to organize your code in a functional way.
|
||||
This article is more about functional paradigm than functional language.
|
||||
The code organization can be used in most imperative language.
|
||||
|
||||
As Haskell is designed for functional paradigm, it is easier to use in this context.
|
||||
In reality, the firsts sections will use an imperative paradigm.
|
||||
As you can use functional paradigm in imperative language,
|
||||
you can also use imperative paradigm in functional languages.
|
||||
|
||||
This article is about creating an useful and clean program.
|
||||
It can interact with the user in real time.
|
||||
It uses OpenGL, a library with imperative programming foundations.
|
||||
Despite this fact,
|
||||
most of the final code will remain in the pure part (no `IO`).
|
||||
|
||||
I believe the main audience for this article are:
|
||||
|
||||
- Haskell programmer looking for an OpengGL tutorial.
|
||||
- People interested in program organization (programming language agnostic).
|
||||
- Fractal lovers and in particular 3D fractal.
|
||||
- People interested in user interaction in a functional paradigm.
|
||||
|
||||
I had in mind for some time now to make a Mandelbrot set explorer.
|
||||
I had already written a [command line Mandelbrot set generator in Haskell](http://github.com/yogsototh/mandelbrot.git).
|
||||
This utility is highly parallel; it uses the `repa` package[^001].
|
||||
|
||||
[^001]: Unfortunately, I couldn't make this program to work on my Mac. More precisely, I couldn't make the [DevIL](http://openil.sourceforge.net/) library work on Mac to output the image. Yes I have done a `brew install libdevil`. But even a minimal program who simply write some `jpg` didn't worked. I tried both with `Haskell` and `C`.
|
||||
|
||||
This time, we will not parallelize the computation.
|
||||
Instead, we will display the Mandelbrot set extended in 3D using OpenGL and Haskell.
|
||||
You will be able to move it using your keyboard.
|
||||
This object is a Mandelbrot set in the plan (z=0),
|
||||
and something nice to see in 3D.
|
||||
|
||||
Here are some screenshots of the result:
|
||||
|
||||
blogfigure("GoldenMandelbulb.png","The entire Mandelbulb")
|
||||
blogfigure("3DMandelbulbDetail.png","A Mandelbulb detail")
|
||||
blogfigure("3DMandelbulbDetail2.png","Another detail of the Mandelbulb")
|
||||
|
||||
And you can see the intermediate steps to reach this goal:
|
||||
|
||||
blogimage("HGL_Plan.png","The parts of the article")
|
||||
|
||||
From the 2nd section to the 4th it will be _dirtier_ and _dirtier_.
|
||||
We start cleaning the code at the 5th section.
|
||||
|
|
@ -0,0 +1,182 @@
|
|||
## First version
|
||||
|
||||
We can consider two parts.
|
||||
The first being mostly some boilerplate[^011].
|
||||
And the second part more focused on OpenGL and content.
|
||||
|
||||
[^011]: Generally in Haskell you need to declare a lot of import lines.
|
||||
This is something I find annoying.
|
||||
In particular, it should be possible to create a special file, Import.hs
|
||||
which make all the necessary import for you, as you generally need them all.
|
||||
I understand why this is cleaner to force the programmer not to do so,
|
||||
but, each time I do a copy/paste, I feel something is wrong.
|
||||
I believe this concern can be generalized to the lack of namespace in Haskell.
|
||||
|
||||
### Let's play the song of our people
|
||||
|
||||
> import Graphics.Rendering.OpenGL
|
||||
> import Graphics.UI.GLUT
|
||||
> import Data.IORef
|
||||
|
||||
For efficiency reason[^010001], I will not use the default Haskell `Complex` data type.
|
||||
|
||||
[^010001]: I tried `Complex Double`, `Complex Float`, this current data type with `Double` and the actual version `Float`. For rendering a 1024x1024 Mandelbrot set it takes `Complex Double` about 6.8s, for `Complex Float` about 5.1s, for the actual version with `Double` and `Float` it takes about `1.6` sec. See these sources for testing yourself: [https://gist.github.com/2945043](https://gist.github.com/2945043). If you really want to things to go faster, use `data Complex = C {-# UNPACK #-} !Float {-# UNPACK #-} !Float`. It takes only one second instead of 1.6s.
|
||||
|
||||
> data Complex = C (Float,Float) deriving (Show,Eq)
|
||||
|
||||
|
||||
> instance Num Complex where
|
||||
> fromInteger n = C (fromIntegral n,0.0)
|
||||
> C (x,y) * C (z,t) = C (z*x - y*t, y*z + x*t)
|
||||
> C (x,y) + C (z,t) = C (x+z, y+t)
|
||||
> abs (C (x,y)) = C (sqrt (x*x + y*y),0.0)
|
||||
> signum (C (x,y)) = C (signum x , 0.0)
|
||||
|
||||
We declare some useful functions for manipulating complex numbers:
|
||||
|
||||
> complex :: Float -> Float -> Complex
|
||||
> complex x y = C (x,y)
|
||||
>
|
||||
> real :: Complex -> Float
|
||||
> real (C (x,y)) = x
|
||||
>
|
||||
> im :: Complex -> Float
|
||||
> im (C (x,y)) = y
|
||||
>
|
||||
> magnitude :: Complex -> Float
|
||||
> magnitude = real.abs
|
||||
|
||||
|
||||
### Let us start
|
||||
|
||||
We start by giving the main architecture of our program:
|
||||
|
||||
> main :: IO ()
|
||||
> main = do
|
||||
> -- GLUT need to be initialized
|
||||
> (progname,_) <- getArgsAndInitialize
|
||||
> -- We will use the double buffered mode (GL constraint)
|
||||
> initialDisplayMode $= [DoubleBuffered]
|
||||
> -- We create a window with some title
|
||||
> createWindow "Mandelbrot Set with Haskell and OpenGL"
|
||||
> -- Each time we will need to update the display
|
||||
> -- we will call the function 'display'
|
||||
> displayCallback $= display
|
||||
> -- We enter the main loop
|
||||
> mainLoop
|
||||
|
||||
Mainly, we initialize our OpenGL application.
|
||||
We declared that the function `display` will be used to render the graphics:
|
||||
|
||||
> display = do
|
||||
> clear [ColorBuffer] -- make the window black
|
||||
> loadIdentity -- reset any transformation
|
||||
> preservingMatrix drawMandelbrot
|
||||
> swapBuffers -- refresh screen
|
||||
|
||||
Also here, there is only one interesting line;
|
||||
the draw will occur in the function `drawMandelbrot`.
|
||||
|
||||
This function will provide a list of draw actions.
|
||||
Remember that OpenGL is imperative by design.
|
||||
Then, one of the consequence is you must write the actions in the right order.
|
||||
No easy parallel drawing here.
|
||||
Here is the function which will render something on the screen:
|
||||
|
||||
> drawMandelbrot =
|
||||
> -- We will print Points (not triangles for example)
|
||||
> renderPrimitive Points $ do
|
||||
> mapM_ drawColoredPoint allPoints
|
||||
> where
|
||||
> drawColoredPoint (x,y,c) = do
|
||||
> color c -- set the current color to c
|
||||
> -- then draw the point at position (x,y,0)
|
||||
> -- remember we're in 3D
|
||||
> vertex $ Vertex3 x y 0
|
||||
|
||||
The `mapM_` function is mainly the same as map but inside a monadic context.
|
||||
More precisely, this can be transformed as a list of actions where the order is important:
|
||||
|
||||
~~~
|
||||
drawMandelbrot =
|
||||
renderPrimitive Points $ do
|
||||
color color1
|
||||
vertex $ Vertex3 x1 y1 0
|
||||
...
|
||||
color colorN
|
||||
vertex $ Vertex3 xN yN 0
|
||||
~~~
|
||||
|
||||
We also need some kind of global variables.
|
||||
In fact, global variable are a proof of a design problem.
|
||||
We will get rid of them later.
|
||||
|
||||
> width = 320 :: GLfloat
|
||||
> height = 320 :: GLfloat
|
||||
|
||||
And of course our list of colored points.
|
||||
In OpenGL the default coordinate are from -1 to 1.
|
||||
|
||||
> allPoints :: [(GLfloat,GLfloat,Color3 GLfloat)]
|
||||
> allPoints = [ (x/width,y/height,colorFromValue $ mandel x y) |
|
||||
> x <- [-width..width],
|
||||
> y <- [-height..height]]
|
||||
>
|
||||
|
||||
We need a function which transform an integer value to some color:
|
||||
|
||||
> colorFromValue n =
|
||||
> let
|
||||
> t :: Int -> GLfloat
|
||||
> t i = 0.5 + 0.5*cos( fromIntegral i / 10 )
|
||||
> in
|
||||
> Color3 (t n) (t (n+5)) (t (n+10))
|
||||
|
||||
And now the `mandel` function.
|
||||
Given two coordinates in pixels, it returns some integer value:
|
||||
|
||||
> mandel x y =
|
||||
> let r = 2.0 * x / width
|
||||
> i = 2.0 * y / height
|
||||
> in
|
||||
> f (complex r i) 0 64
|
||||
|
||||
It uses the main Mandelbrot function for each complex \\(c\\).
|
||||
The Mandelbrot set is the set of complex number \\(c\\) such that the following sequence does not escape to infinity.
|
||||
|
||||
Let us define \\(f_c: \mathbb{C} \to \mathbb{C}\\)
|
||||
|
||||
$$ f_c(z) = z^2 + c $$
|
||||
|
||||
The sequence is:
|
||||
|
||||
$$ 0 \rightarrow f_c(0) \rightarrow f_c(f_c(0)) \rightarrow \cdots \rightarrow f^n_c(0) \rightarrow \cdots $$
|
||||
|
||||
Of course, instead of trying to test the real limit, we just make a test after a finite number of occurrences.
|
||||
|
||||
> f :: Complex -> Complex -> Int -> Int
|
||||
> f c z 0 = 0
|
||||
> f c z n = if (magnitude z > 2 )
|
||||
> then n
|
||||
> else f c ((z*z)+c) (n-1)
|
||||
|
||||
Well, if you download this file (look at the bottom of this section), compile it and run it this is the result:
|
||||
|
||||
blogimage("hglmandel_v01.png","The mandelbrot set version 1")
|
||||
|
||||
A first very interesting property of this program is that the computation for all the points is done only once.
|
||||
It is a bit long before the first image appears, but if you resize the window, it updates instantaneously.
|
||||
This property is a direct consequence of purity.
|
||||
If you look closely, you see that `allPoints` is a pure list.
|
||||
Therefore, calling `allPoints` will always render the same result and Haskell is clever enough to use this property.
|
||||
While Haskell doesn't garbage collect `allPoints` the result is reused for free.
|
||||
We did not specified this value should be saved for later use.
|
||||
It is saved for us.
|
||||
|
||||
See what occurs if we make the window bigger:
|
||||
|
||||
blogimage("hglmandel_v01_too_wide.png","The mandelbrot too wide, black lines and columns")
|
||||
|
||||
We see some black lines because we have drawn less point than there is on the surface.
|
||||
We can repair this by drawing little squares instead of just points.
|
||||
But, instead we will do something a bit different and unusual.
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue