The hourglass challenge
JavaScript (ES6), 203  208 233 270 256 characters
Edit Revised using a loop instead of a sequence of calls.
Edit Added top and bottom row that were missing.
A function returning the output. Run the snippet in Firefox to test.


f=w=&gt;[h='█'[R='repeat'](19),...[17,15,13,9,5,1,5,9,13,15,17].map((d,i)=&gt;(t=i&gt;5?-v:v,v-=i&lt;5?d:1-d,e=' '[R](d/2),b='█'[R](10-d/2),b+('.'[R](t&lt;d&amp;&amp;d-t)+e+' .'[i&gt;4&amp;w&gt;i-6&amp;t&gt;=d|0]+e).slice(0,d)+b),v=w),h].join`
`

// Less golfed
F=
w=&gt;[h='█'.repeat(19),
    ... [17, 15, 13, 9, 5, 1, 5, 9, 13, 15, 17].map(
     (d,i) =&gt; (
       t = i&gt;5 ? -v : v,
       v -= i&lt;5 ? d : 1-d, 
       e = ' '.repeat(d / 2),
       b = '█'.repeat(10 - d / 2),
       b + 
        ('.'.repeat(t &lt; d &amp;&amp; d - t) 
         + e + ' .'[i &gt; 4 &amp; w &gt; i-6 &amp; t &gt;= d | 0]
         + e).slice(0,d)
       + b
     ), v = w
    ),
    h].join('\n')

// TEST            

O.innerHTML=f(+I.value)

function tick(d) {
  var i=+I.value+d
  I.value=i
  O.innerHTML=f(i)
}

var int=0;

function auto()
{
  function go()
  {
    var t = I.value;
    O.innerHTML=f(++t)
    if (t&gt;70)t=0;
    I.value = t;
  }
  if (A.checked &amp;&amp; !int)
  { 
    int = setInterval(go, 200);
  }
  else if (!A.checked &amp;&amp; int)
  {
    clearInterval(int);
    int = 0;
  }
}
input[type=text] { width: 3em }
&lt;button onclick='tick(-1)'&gt;-&lt;/button&gt;
&lt;input type=text id=I value=0 onchange='tick(0)' &gt;
&lt;button onclick='tick(1)'&gt;+&lt;/button&gt;
&lt;input type=checkbox id=A onclick='auto()'&gt;Fly time
&lt;pre id=O&gt;&lt;pre&gt;