readme + makefile

6 years ago · c7b65da9bb
parent cf465bf5c4
commit c7b65da9bb
6 changed files with 175 additions and 1 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1 @@
 images/
--- a/30
+++ b/30
@ -0,0 +1,30 @@
 # find all .md files in the directory
 # mdsrc=$(shell ls *.md)
 mdsrc=$(shell find . -iname "*.md")
 # mdsrc=$(wildcard *.md */*.md **/*.md )
 # map *.mp => *.html for mdsrc
 html_from_md=$(mdsrc:%.md=%.html)
 all: $(html_from_md)
 fixnames:
 	rename "s/ /_/g" *
 today:
 	touch `date +"%Y-%m-%d.md"`
 now_folder:
 	mkdir `date +"%Y-%m-%d-%H%M%S"`
 # Implicit rule to know how to make .html from .md
 %.html: %.md
 	pandoc --from markdown \
 		--to html \
 		--standalone \
 		--smart \
 		--section-divs \
 		--css styles.css \
 		$< -o $@
 # special rule for debugging variables
 print-%:
 	@echo '$*=$($*)'
--- a/README.html
+++ b/README.html
@ -0,0 +1,82 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="Content-Style-Type" content="text/css" />
  <meta name="generator" content="pandoc" />
  <title></title>
  <style type="text/css">code{white-space: pre;}</style>
  <style type="text/css">
 div.sourceCode { overflow-x: auto; }
 table.sourceCode, tr.sourceCode, td.lineNumbers, td.sourceCode {
  margin: 0; padding: 0; vertical-align: baseline; border: none; }
 table.sourceCode { width: 100%; line-height: 100%; }
 td.lineNumbers { text-align: right; padding-right: 4px; padding-left: 4px; color: #aaaaaa; border-right: 1px solid #aaaaaa; }
 td.sourceCode { padding-left: 5px; }
 code > span.kw { color: #007020; font-weight: bold; } /* Keyword */
 code > span.dt { color: #902000; } /* DataType */
 code > span.dv { color: #40a070; } /* DecVal */
 code > span.bn { color: #40a070; } /* BaseN */
 code > span.fl { color: #40a070; } /* Float */
 code > span.ch { color: #4070a0; } /* Char */
 code > span.st { color: #4070a0; } /* String */
 code > span.co { color: #60a0b0; font-style: italic; } /* Comment */
 code > span.ot { color: #007020; } /* Other */
 code > span.al { color: #ff0000; font-weight: bold; } /* Alert */
 code > span.fu { color: #06287e; } /* Function */
 code > span.er { color: #ff0000; font-weight: bold; } /* Error */
 code > span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */
 code > span.cn { color: #880000; } /* Constant */
 code > span.sc { color: #4070a0; } /* SpecialChar */
 code > span.vs { color: #4070a0; } /* VerbatimString */
 code > span.ss { color: #bb6688; } /* SpecialString */
 code > span.im { } /* Import */
 code > span.va { color: #19177c; } /* Variable */
 code > span.cf { color: #007020; font-weight: bold; } /* ControlFlow */
 code > span.op { color: #666666; } /* Operator */
 code > span.bu { } /* BuiltIn */
 code > span.ex { } /* Extension */
 code > span.pp { color: #bc7a00; } /* Preprocessor */
 code > span.at { color: #7d9029; } /* Attribute */
 code > span.do { color: #ba2121; font-style: italic; } /* Documentation */
 code > span.an { color: #60a0b0; font-weight: bold; font-style: italic; } /* Annotation */
 code > span.cv { color: #60a0b0; font-weight: bold; font-style: italic; } /* CommentVar */
 code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Information */
  </style>
  <link rel="stylesheet" href="styles.css" type="text/css" />
 </head>
 <body>
 <div id="layouts" class="section level1">
 <h1>95 layouts</h1>
 <p>Because there’s always more than one way to do it.</p>
 <div id="publishing-an-image-gallery" class="section level2">
 <h2>Publishing an “image gallery”</h2>
 <p>Imagemagick’s suite of tools includes <em>montage</em> which is quite flexible and useful for making a quick overview page of image.</p>
 <ul>
 <li>mogrify</li>
 <li>identify</li>
 <li>convert</li>
 </ul>
 </div>
 <div id="sizing-down-a-bunch-of-images" class="section level2">
 <h2>Sizing down a bunch of images</h2>
 <p>Warning: MOGRIFY MODIES THE IMAGES – ERASING THE ORIGINAL – make a copy of the images before you do this!!!</p>
 <div class="sourceCode"><pre class="sourceCode bash"><code class="sourceCode bash"><span class="ex">mogrify</span> -resize 1024x *.JPG </code></pre></div>
 </div>
 <div id="fixing-the-orientation-of-images" class="section level2">
 <h2>Fixing the orientation of images</h2>
 <div class="sourceCode"><pre class="sourceCode bash"><code class="sourceCode bash"><span class="ex">mogrify</span> -auto-orient *.JPG</code></pre></div>
 </div>
 <div id="using-montage" class="section level2">
 <h2>Using Montage</h2>
 <div class="sourceCode"><pre class="sourceCode bash"><code class="sourceCode bash"><span class="ex">montage</span> -label <span class="st">&quot;%f&quot;</span> *.JPG \
    -shadow \
    -geometry 1000x1000+100+100 \
    montage.caption.jpg</code></pre></div>
 </div>
 <div id="using-pdftk-to-put-things-together" class="section level2">
 <h2>Using pdftk to put things together</h2>
 </div>
 </div>
 </body>
 </html>
--- a/README.md
+++ b/README.md
@ -1 +1,49 @@
-Exploring different ways to do page layout
+95 layouts
 ================
 Because there's always more than one way to do it.
 Publishing an "image gallery"
 ------------------------------------
 Imagemagick's suite of tools includes *montage* which is quite flexible and useful for making a quick overview page of image.
 * mogrify
 * identify
 * convert
 Sizing down a bunch of images
 --------------------------------
 Warning: MOGRIFY MODIES THE IMAGES -- ERASING THE ORIGINAL -- make a copy of the images before you do this!!!
 ```bash
 mogrify -resize 1024x *.JPG 
 ```
 Fixing the orientation of images
 ------------------------------------
 ```bash
 mogrify -auto-orient *.JPG
 ```
 Using Montage
 ---------------------
 ```bash
 montage -label "%f" *.JPG \
    -shadow \
    -geometry 1000x1000+100+100 \
    montage.caption.jpg
 ```
 Using pdftk to put things together
 --------------------------------------
--- a/layout_with_montage.sh
+++ b/layout_with_montage.sh
@ -0,0 +1,13 @@
 # "Fix" the images rotation
 # mogrify -auto-orient *.JPG
 # montage *.JPG -geometry 1000x1000 montage.1000x1000.jpg
 montage -label "%f" *.JPG \
    -shadow \
    -geometry 1000x1000+100+100 \
    montage.caption.jpg
 # montage -label '%f'  *.JPG  \
 #           -tile x1 -shadow -geometry '60x60+2+2>'  label_shadow.jpg
--- a/styles.css
+++ b/styles.css