<!DOCTYPE blah>
<html>
<head>
  <title>{{ id }} - f0ck.me</title>
  <link rel="stylesheet" type="text/css" href="./s/stylo.css">
  <link rel="stylesheet" type="text/css" href="./s/style.css">
  <link rel="icon" type="image/gif" href="./s/favicon.gif" />
</head>
<body>
  <!<div class="id">[ID: {{ id }} | by: {{ username }}]</div>-->
  <div class="return"><a href="/" title="return to main">f0ck.me</a></div>
  <div class="controls">{% if next != null %}<a id="next" href="/{{ next }}"><<-</a> | {% endif %} <a id="random" href="/random" title="Random">random</a> {% if prev != null %} | <a id="prev" href="/{{ prev }}">->></a>{% endif %}</div><br />
  {% if thumb != null %}
  <div class="thumbnail">
    <img src="{{ thumb }}" />
  </div>
  {% endif %}
  <div class="medium">
    {% if item == "video" %}
      <video src="{{ dest }}" style="max-width: 1280px; height: 50%;" preload="auto" autoplay controls loop></video>
    {% elseif item == "audio" %}
      <audio controls loop src="{{ dest }}" type="audio/mp3" autoplay></audio>
    {% elseif item == "image" %}
      <a href="{{ dest }}" target="_blank"><img src="{{ dest }}" style="max-width: 1024px" /></a>
    {% else %}
      <h1>404 - Not f0cked</h1>
    {% endif %}
  <br />
  <div class="panel info">
    <span class="id">[ID: {{ id }} | by: {{ username }}]<span></span><br />
    <span class="src">src: <a href="{{ srcurl }}" target="_blank">{{ src }}</a></span><br />
    <span class="dest">dest: {{ dest }}</span><br />
    <span class="mime">mime: {{ mime }}</span>&nbsp;<br />
    <span class="size">size: {{ size }}</span><br />
    <span class="channel">channel: {{ userchannel }}</span>&nbsp;
    <span class="network">network: {{ usernetwork }}</span>
  </div>
  </div>
  <br />
  <script>
  function arrowKeys(e) {
    switch(e.keyCode) {
      case 39:
        var prev = document.getElementById('prev');
        if(prev) prev.click();
      break;
      case 37:
        var next = document.getElementById('next');
        if(next) next.click();
      break;
    }
  }
  if(document.readyState == 'complete' || document.readyState == 'loaded')
    document.addEventListener('keydown', arrowKeys);
  else {
    if(/Chrome/i.test(navigator.userAgent))
      window.addEventListener('load', function () {
        document.addEventListener('keydown', arrowKeys);
      });
    else
      document.addEventListener('DOMContentLoaded', function () {
        document.addEventListener('keydown', arrowKeys);
      });
  }
  </script>
</body>
<! Fuck git… seriously-->
</html>