Merge pull request #396 from amiaopensource/extract_recipes

simplify recipe extraction

css/css.css

@@ -105,7 +105,7 @@ h2 {
   margin: 6px 0px 12px 0px;
 }
 
-h3 {
+h3, h5 {
   font-size: 1.5em;
 }
 

index.html

@@ -62,6 +62,7 @@
       <span class="intro-lead">Sister projects</span>
       <p><a href="https://dd388.github.io/crals/" target="_blank">Script Ahoy</a>: Community Resource for Archivists and Librarians Scripting</p>
       <p><a href="https://datapraxis.github.io/sourcecaster/" target="_blank">The Sourcecaster</a>: an app that helps you use the command line to work through common challenges that come up when working with digital primary sources.</p>
+      <p><a href="https://pugetsoundandvision.github.io/micropops/" target="_blank">Micropops</a>: One liners and automation tools from Moving Image Preservation of Puget Sound</p>
       <p><a href="https://amiaopensource.github.io/cable-bible/" target="_blank">Cable Bible</a>: A Guide to Cables and Connectors Used for Audiovisual Tech</p>
     </div>
 
@@ -71,7 +72,7 @@
       <label class="recipe" for="basic-structure">Basic structure of an FFmpeg command</label>
       <input type="checkbox" id="basic-structure">
       <div class="hiding">
-        <h3>Basic structure of an FFmpeg command</h3>
+        <h5>Basic structure of an FFmpeg command</h5>
         <p>At its basis, an FFmpeg command is relatively simple. After you have installed FFmpeg (see instructions <a href="https://avpres.net/FFmpeg/#ch1" target="_blank">here</a>), the program is invoked simply by typing <code>ffmpeg</code> at the command prompt.</p>
         <p>Subsequently, each instruction that you supply to FFmpeg is actually a pair: a flag, which designates the <em>type</em> of action you want to carry out; and then the specifics of that action. Flags are always prepended with a hyphen.</p>
         <p>For example, in the instruction <code>-i <em>input_file.ext</em></code>, the <code>-i</code> flag tells FFmpeg that you are supplying an input file, and <code>input_file.ext</code> states which file it is.</p>
@@ -110,7 +111,7 @@
     <label class="recipe" for="codec-defaults">Codec defaults</label>
     <input type="checkbox" id="codec-defaults">
     <div class="hiding">
-      <h3>Codec Defaults</h3>
+      <h5>Codec Defaults</h5>
       <p>Unless specified, FFmpeg will automatically set codec choices and codec parameters based off of internal defaults. These defaults are applied based on the file type used in the output (for example <code>.mov</code> or <code>.wav</code>).</p>
       <p>When creating or transcoding files with FFmpeg, it is important to consider codec settings for both audio and video, as the default options may not be desirable in your particular context. The following is a brief list of codec defaults for some common file types:</p>
       <ul>
@@ -160,7 +161,7 @@
     <label class="recipe" for="stream-mapping">Stream mapping</label>
     <input type="checkbox" id="stream-mapping">
     <div class="hiding">
-      <h3>Stream mapping</h3>
+      <h5>Stream mapping</h5>
       <p>Stream mapping is the practice of defining which of the streams (e.g., video or audio tracks) present in an input file will be present in the output file. FFmpeg recognizes five stream types:</p>
       <ul>
         <li><code>a</code> - audio</li>
@@ -177,8 +178,12 @@
         <li><code>-map 0:0 -map 0:2</code> means ‘take the first and third streams from the first input file’.</li>
         <li><code>-map 0:1 -map 1:0</code> means ‘take the second stream from the first input file and the first stream from the second input file’.</li>
       </ul>
-      <p>To map <em>all</em> streams in the input file to the output file, use <code>-map 0</code>. However, note that not all container formats can include all stream types: for example, .mp4 cannot contain timecode.</p>
       <p>When no mapping is specified in an ffmpeg command, the default for video files is to take just one video and one audio stream for the output: other stream types, such as timecode or subtitles, will not be copied to the output file by default. If multiple video or audio streams are present, the best quality one is automatically selected by FFmpeg.</p>
+      <p>To map <em>all</em> streams in the input file to the output file, use <code>-map 0</code>. However, note that not all container formats can include all stream types: for example, .mp4 cannot contain timecode.</p>
+      <h4>Mapping with a failsafe</h4>
+      <p>To safely process files that may or may not contain given a type of stream, you can add a trailing <code>?</code> to your map commands: for example, <code>-map 0:a?</code> instead of <code>-map 0:a</code>.</p>
+      <p>This makes the map optional: audio streams will be mapped over if they are present in the file—but if the file contains no audio streams, the transcode will precede as usual, minus the audio stream mapping. Without adding the trailing <code>?</code>, FFmpeg will exit with an error on that file.</p>
+      <p>This is especially recommended when batch processing video files: it ensures that all files in your batch will be transcoded, whether or not they contain audio streams.</p>
       <p>For more information, check out the FFmpeg wiki <a href="https://trac.ffmpeg.org/wiki/Map" target="_blank">Map</a> page, and the official FFmpeg <a href="https://ffmpeg.org/ffmpeg.html#Advanced-options" target="_blank">documentation on <code>-map</code></a>.</p>
       <p class="link"></p>
     </div>
@@ -212,28 +217,6 @@
     </div>
     <!-- End Basic rewrap command -->
 
-    <!-- MKV to MP4 -->
-    <label class="recipe" for="mkv_to_mp4">Convert Matroska (MKV) to MP4</label>
-    <input type="checkbox" id="mkv_to_mp4">
-    <div class="hiding">
-      <h3>MKV to MP4</h3>
-      <p><code>ffmpeg -i <em>input_file</em>.mkv -c:v copy -c:a aac <em>output_file</em>.mp4</code></p>
-      <p>This will convert your Matroska (MKV) files to MP4 files.</p>
-      <dl>
-        <dt>ffmpeg</dt><dd>starts the command</dd>
-        <dt>-i <em>input_file</em></dt><dd>path and name of the input file<br>
-        The extension for the Matroska container is <code>.mkv</code>.</dd>
-        <dt>-c:v copy</dt><dd>copies the video stream without re-encoding it</dd>
-        <dt>-c:a aac</dt><dd>re-encodes the audio stream using the AAC audio codec<br>
-        Note that sadly MP4 cannot contain sound encoded by a PCM (Pulse-Code Modulation) audio codec.<br>
-        For silent videos you can replace <code>-c:a aac</code> by <code>-an</code>, which means that there will be no audio track in the output file.</dd>
-        <dt><em>output_file</em></dt><dd>path and name of the output file<br>
-        The extension for the MP4 container is <code>.mp4</code>.</dd>
-      </dl>
-      <p class="link"></p>
-    </div>
-    <!-- ends MKV to MP4 -->
-
     <!-- Rewrap DV -->
     <label class="recipe" for="rewrap-dv">Rewrap DV video to .dv file</label>
     <input type="checkbox" id="rewrap-dv">
@@ -788,7 +771,7 @@
       </dl>
       <p>It's also possible to specify the crop position by adding the x and y coordinates representing the top left of your cropped area to your crop filter, as such:</p>
       <p><code>ffmpeg -i <em>input_file</em> -vf "crop=<em>width</em>:<em>height</em>[:<em>x_position</em>:<em>y_position</em>]" <em>output_file</em></code></p>
-      <h3>Examples</h3>
+      <h5>Examples</h5>
       <p>The original frame, a screenshot of the SMPTE colorbars:</p>
       <img class="sample-image" src="img/crop_example_orig.png" alt="VLC screenshot of Maggie Cheung">
       <p>Result of the command <code>ffmpeg -i <em>smpte_colorsbars.mov</em> -vf "crop=500:500" <em>output_file</em></code>:</p>

js/js.js

@@ -1,23 +1,38 @@
 $(document).ready(function() {
 
-  // open recipe window if a hash is found in URL
-  if(window.location.hash) {
-    id = window.location.hash
-    console.log(id.substring(1))
+  function appendLink(id) {
+    $(id).next('div').find('.link').empty();
+    $(id).next('div').find('.link').append("<small>Link to this command: <a href='https://amiaopensource.github.io/ffmprovisr/index.html" + id + "'>https://amiaopensource.github.io/ffmprovisr/index.html" + id + "</a></small>");
+  }
+
+  function moveToRecipe(id) {
     document.getElementById(id.substring(1)).checked = true;
-    $('html, body').animate({ scrollTop: $(id).offset().top}, 1000);
-    $(id).closest('div').find('.link').empty();
-    $(id).closest('div').find('.link').append("<small>Link to this command: <a href='https://amiaopensource.github.io/ffmprovisr/index.html"+window.location.hash+"'>https://amiaopensource.github.io/ffmprovisr/index.html"+window.location.hash+"</a></small>");
+    $('html, body').animate({ scrollTop: $(id).offset().top }, 1000);
+    appendLink(id)
+  }
+
+  // open recipe window if a hash is found in URL
+  if (window.location.hash) {
+    id = window.location.hash
+    moveToRecipe(id)
   }
 
   // add hash URL when recipe is opened
   $('label[class="recipe"]').on("click", function(){
     id = $(this).attr("for");
     window.location.hash = ('#' + id)
-    $('#' + id).closest('div').find('.link').empty();
-    $('#' + id).closest('div').find('.link').append("<small>Link to this command: <a href='https://amiaopensource.github.io/ffmprovisr/index.html"+window.location.hash+"'>https://amiaopensource.github.io/ffmprovisr/index.html"+window.location.hash+"</a></small>");
-  });
+    appendLink('#' + id)
+  })
 
+  // open recipe when clicked
+  $('a').on("click", function(){
+    intralink = $(this).attr("href")
+    if (intralink[0] == "#") {
+      moveToRecipe(intralink)
+    }
+  })
+
+  // open all windows if button is clicked
   $('#open-all').on("click", function(){
     $('input[type=checkbox]').each(function(){
       this.checked = !this.checked;

recipes.txt

@@ -1,7 +1,5 @@
 # Basic rewrap command
 ffmpeg -i input_file.ext -c copy -map 0 output_file.ext
-# Convert Matroska (MKV) to MP4
-ffmpeg -i input_file.mkv -c:v copy -c:a aac output_file.mp4
 # Rewrap DV video to .dv file
 ffmpeg -i input_file -f rawvideo -c:v copy output_file.dv
 # Transcode to deinterlaced Apple ProRes LT