diff --git a/rowers/templates/embedded_video_mini.html b/rowers/templates/embedded_video_mini.html
new file mode 100644
index 00000000..3ff231a7
--- /dev/null
+++ b/rowers/templates/embedded_video_mini.html
@@ -0,0 +1,682 @@
+{% extends "newbase.html" %}
+{% load staticfiles %}
+{% load rowerfilters %}
+{% load i18n %}
+{% load leaflet_tags %}
+
+
+
+{% block title %}Workout Video{% endblock %}
+{% block og_title %}{{ analysis.name }}{% endblock %}
+{% block description %}Rowing Video Analysis:{{ analysis.name }}{% endblock %}
+{% block og_description %}Rowing Video Analysis:{{ analysis.name }}{% endblock %}
+{% block og_image %}
+{% if analysis %}
+<meta property="og:image" content="https://img.youtube.com/vi/{{ analysis.video_id }}/hqdefault.jpg" />
+<meta property="og:image:secure_url" content="https://img.youtube.com/vi/{{ analysis.video_id }}/hqdefault.jpg" />
+{% else %}
+<meta property="og:image" content="http://rowsandall.com/static/img/logo_r.png" />
+<meta property="og:image:secure_url" content="https://rowsandall.com/static/img/logo_r.png" />
+{% endif %}
+{% endblock %}
+
+{% if analysis %}
+{% block image_src %}
+<link rel="image_src" href="https://img.youtube.com/vi/{{ analysis.video_id }}/hqdefault.jpg" />
+{% endblock %}
+{% endif %}
+
+{% block meta %}
+{% leaflet_js %}
+{% leaflet_css %}
+<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
+<script type="text/javascript" src="{% static 'js/videogauges.js' %}"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.js"></script>
+<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
+<script>
+  $(document).ready(function() {
+  $('form').submit(function(e) {
+    $(':disabled').each(function(e) {
+        $(this).removeAttr('disabled');
+    });
+  });
+
+});
+</script>
+<script>
+function copyText() {
+  var tempInput = document.createElement("input");
+    tempInput.style = "position: absolute; left: -1000px; top: -1000px";
+    tempInput.value = "{{ siteurl }}/rowers/video/{{ analysis.id|encode }}/";
+    document.body.appendChild(tempInput);
+    tempInput.select();
+    document.execCommand("copy");
+    alert("Copied to clipboard: " + tempInput.value);
+    document.body.removeChild(tempInput);
+}
+</script>
+{% endblock %}
+
+{% block main %}
+
+<style>
+  .slidecontainer {
+    width: 100%; /* Width of the outside container */
+  }
+
+  .bold { font-weight: bold; }
+
+  /* The slider itself */
+  .slider {
+    -webkit-appearance: none;  /* Override default CSS styles */
+    appearance: none;
+    width: 100%; /* Full-width */
+    height: 25px; /* Specified height */
+    background: #d3d3d3; /* Grey background */
+    outline: none; /* Remove outline */
+    opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
+    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
+    transition: opacity .2s;
+  }
+
+  /* Mouse-over effects */
+  .slider:hover {
+    opacity: 1; /* Fully shown on mouse-over */
+  }
+
+  /* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
+  .slider::-webkit-slider-thumb {
+    -webkit-appearance: none; /* Override default look */
+    appearance: none;
+    width: 25px; /* Set a specific slider handle width */
+    height: 25px; /* Slider handle height */
+    background: #4CAF50; /* Green background */
+    cursor: pointer; /* Cursor on hover */
+  }
+
+  .slider::-moz-range-thumb {
+    width: 25px; /* Set a specific slider handle width */
+    height: 25px; /* Slider handle height */
+    background: #4CAF50; /* Green background */
+    cursor: pointer; /* Cursor on hover */
+  }
+</style>
+
+{% language 'en' %}
+<h1>Video Analysis for {{ workout.name }}</h1>
+<ul class="main-content">
+  <li class="grid_4">
+    <p>Playing the video will advance the data in synchronization. Use the regular
+      YouTube controls to move around in the video and play it.</p>
+  </li>
+  <li class="grid_4">
+    <span class="fb-share-button" style="height:20px; vertical-align: top;"
+    data-href="{{ siteurl }}/rowers/video/{{ analysis.id|encode }}"
+    data-layout="button" data-size="small" data-mobile-iframe="false">
+      <a class="fb-xfbml-parse-ignore" target="_blank"
+      href="https://www.facebook.com/sharer/sharer.php?u=https://rowsandall.com/rowers/video/{{ analysis.id|encode }}/">
+      Share</a>
+    </span>
+    <span>
+      <a class="twitter-share-button"
+      href="https://twitter.com/intent/tweet"
+      data-url="{{ siteurl }}/rowers/video/{{ analysis.id|encode }}/"
+      data-text="@rowsandall #rowingdata">Tweet</a>
+    </span>
+    <span>
+      <button title="Copy Shareable Link" onclick="copyText()"
+      style="color:#1c75bc;background:none;border:0;"><i class="fas fa-copy"></i></button>
+    </span>
+  </li>
+</ul>
+<ul class="main-content">
+  <li class="grid_3">
+    <div id="theplot" class="flexplot mapdiv">
+      {{ mapdiv | safe}}
+
+    </div>
+    <div class="slidecontainer">
+      <input type="range" min="0" max="{{ maxtime }}" value="{{ analysis.delay }}"
+      id="myRange">
+    </div>
+    <div id="dataplay"></div>
+    <!-- <div id="datastop"></div> -->
+  </li>
+  <li class="grid_4">
+    <div id="player"></div>
+    <script>
+      // 1. Code for the map
+      {{ mapscript | safe }}
+
+
+      // 2. This code loads the IFrame Player API code asynchronously.
+      var tag = document.createElement('script');
+
+      tag.src = "https://www.youtube.com/iframe_api";
+      var firstScriptTag = document.getElementsByTagName('script')[0];
+      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
+
+      // 3. This function creates an <iframe> (and YouTube player)
+      //    after the API code downloads.
+      var player;
+      var playing = false;
+      var dataplaying = false;
+
+      var videotime = 0;
+      var data = JSON.parse('{{ data|safe }}');
+      {% for id, metric in metrics.items %}
+      var {{ id }}_values = data["{{ id }}"];
+      // console.log("{{ id }}_values",{{ id }}_values);
+      {% endfor %}
+      // var boatspeed = data["boatspeed"];
+      var latitude = data["latitude"];
+      var longitude = data["longitude"];
+      // var spm = data["spm"];
+      // var ctch = data["catch"];
+
+      function onYouTubeIframeAPIReady() {
+        player = new YT.Player('player', {
+          height: '315',
+          width: '560',
+          modestbranding: '1',
+          videoId: '{{ video_id }}',
+          events: {
+            'onReady': onPlayerReady,
+            'onStateChange': onPlayerStateChange
+          }
+        });
+      }
+
+      // 4. The API will call this function when the video player is ready.
+      function onPlayerReady(event) {
+        // event.target.playVideo();
+
+
+      }
+
+      function updateTime() {
+        var oldTime = videotime;
+        var slider = document.getElementById("myRange");
+        var lock = document.getElementById("lock");
+        if(player && player.getCurrentTime) {
+          videotime = player.getCurrentTime();
+          var delay = document.getElementById("id_delay").value;
+          if (lock.checked) {
+            sliderpos = Math.round(videotime) + Math.round(delay);
+            slider.value = sliderpos;
+          }
+
+
+          // gauge.set(catch_now);
+
+        }
+        if(videotime !== oldTime) {
+          onProgress(videotime);
+        }
+      }
+
+      timeupdater = setInterval(updateTime, 1000);
+
+      // when the time changes, this will be called.
+      function onProgress(currentTime) {
+        var slider = document.getElementById("myRange");
+        var lock = document.getElementById("lock");
+        videotime = player.getCurrentTime();
+        var delay = document.getElementById("id_delay").value;
+        var output = document.getElementById("id_delay");
+        datatime = slider.value;
+
+        if (lock.checked) {
+          if (!dataplaying) { // set data values
+            sliderpos = Math.round(videotime) + Math.round(delay);
+            slider.value = sliderpos;
+
+            // Setting Data
+            // velo = boatspeed[Math.round(datatime)];
+            lat = latitude[Math.round(datatime)];
+            lon = longitude[Math.round(datatime)];
+            // strokerate = spm[Math.round(datatime)];
+            // catchangle = ctch[Math.round(datatime)];
+            {% for id, metric in metrics.items %}
+            {{ id }}_now = {{ id }}_values[Math.round(datatime)];
+            // console.log(datatime,{{ id }},{{ id }}_now, "{{ metric.name }}")
+            {% endfor %}
+
+            {% for group in metricsgroups %}
+            try {
+              set_{{ group }}();
+            } catch (e) {
+              console.log(e);
+            }
+            {% endfor %}
+            try {
+              var newLatLng = new L.LatLng(lat, lon);
+              // console.log(newLatLng);
+              marker.setLatLng(newLatLng);
+            } catch (e) {
+            }
+          }
+
+        } else {
+          if (!dataplaying) {
+            output.value = Math.round(datatime)-Math.round(videotime);
+          }
+        }
+
+      }
+
+      function stopVideo() {
+        player.pauseVideo();
+        playing = false;
+      }
+
+      // call this function when player state changes
+      function onPlayerStateChange(event) {
+        if (event.data == YT.PlayerState.PLAYING && lock.checked) {
+          var dataplay = document.getElementById("dataplay").childNodes[0];
+          dataplay.value = String.fromCharCode(10074,10074);
+        } else if (lock.checked) {
+          var dataplay = document.getElementById("dataplay").childNodes[0];
+          dataplay.value = String.fromCharCode(9658);
+        }
+      }
+
+    </script>
+  </li>
+  <li class="grid_4">
+    <input type="hidden" name="lock" id="lock" value="Lock">
+  </li>
+</ul>
+<p>&nbsp;</p>
+<form enctype="multipart/form-data" action="" method="post">
+  <ul class="main-content">
+    <li class="grid_4">
+      <input type="hidden" id="id_delay" value="{{ analysis.delay }}">
+    </li>
+
+    <li class="grid_4" >
+      <ul class="main-content">
+      {% if 'basic' in metricsgroups %}
+      <li class="grid_1">
+        <div id="basic_spm"></div>
+      </li>
+      <li class="grid_1">
+        <div id="basic_boatspeed"></div>
+      </li>
+      {% endif %}
+      {% if 'forcepower' in metricsgroups %}
+      <li class="grid_1">
+        <div id="forcepower_power"></div>
+      </li>
+      {% endif %}
+      {% if 'athlete' in metricsgroups %}
+      <li class="grid_1">
+        <div id="athlete_hr"></div>
+      </li>
+      {% endif %}
+      {% if 'stroke' in metricsgroups %}
+      {% if workout.workouttype == 'water' %}
+      <li class="grid_1" style="height:500px">
+        <div style="width:100%;height:70%;" id="stroke_angles"></div>
+      </li>
+      {% endif %}
+      {% endif %}
+    </ul>
+  </li>
+</ul>
+</form>
+<p>&nbsp;</p>
+
+<script>
+  $(document).ready( function() {
+    $(window).load(function() {
+      // initialize data fields
+      console.log('initializing first value of data');
+      {% for id, metric in metrics.items %}
+      {{ id }}_now = {{ id }}_values[0];
+
+      {% endfor %}
+
+      var slider = document.getElementById("myRange");
+
+
+      // gauge settings
+      {% if workout.workouttype != 'water' %}
+      speedoptions.max = 7;
+      speedoptions.redTo = 7;
+      speedoptions.majorTicks = ['0','1','2','3','4','5','6','7'];
+      {% endif %}
+
+      {% if 'basic' in metricsgroups %}
+      spm_now = spm_values[0];
+      boatspeed_now = boatspeed_values[0];
+      set_basic();
+      {% endif %}
+      {% if 'forcepower' in metricsgroups %}
+      poweroptions.max = {{ workout.user.pw_an|add:100|round100 }};
+      poweroptions.greenFrom = {{ workout.user.pw_ut2 }};
+      poweroptions.greenTo = {{ workout.user.pw_at }};
+      poweroptions.yellowFrom = {{ workout.user.pw_at }};
+      poweroptions.yellowTo = {{ workout.user.pw_an }};
+      poweroptions.redFrom = {{ workout.user.pw_an }};
+      poweroptions.redTo = {{ workout.user.pw_an|add:100|round100 }};
+      poweroptions.majorTicks = {{ workout.user.pw_an|add:100|round100|majorticks }};
+      {% if workout.workouttype == 'water' %}
+      poweroptions.max = {{ workout.user.pw_an|waterpower:workout.user|add:100|round100 }}
+      poweroptions.greenFrom = {{ workout.user.pw_ut2|waterpower:workout.user }};
+      poweroptions.greenTo = {{ workout.user.pw_at|waterpower:workout.user }};
+      poweroptions.yellowFrom = {{ workout.user.pw_at|waterpower:workout.user }};
+      poweroptions.yellowTo = {{ workout.user.pw_an|waterpower:workout.user }};
+      poweroptions.redFrom = {{ workout.user.pw_an|waterpower:workout.user }};
+      poweroptions.redTo = {{ workout.user.pw_an|waterpower:workout.user|add:100|round100 }};
+      poweroptions.majorTicks = {{ workout.user.pw_an|waterpower:workout.user|add:100|round100|majorticks }};
+      {% endif %}
+      power_now = power_values[0];
+      set_forcepower();
+      {% endif %}
+      {% if 'athlete' in metricsgroups %}
+      hroptions.max = {{ workout.user.max|round20 }}
+      hroptions.greenFrom = {{ workout.user.ut2 }}
+      hroptions.greenTo = {{ workout.user.at }}
+      hroptions.yellowFrom = {{ workout.user.at }}
+      hroptions.yellowTo = {{ workout.user.an }}
+      hroptions.redFrom = {{ workout.user.an }}
+      hroptions.redTo = {{ workout.user.max }}
+      hroptions.majorTicks = {{ workout.user.max|round20|hrmajorticks:workout.user.rest }}
+      hr_now = hr_values[0];
+      set_athlete();
+      {% endif %}
+      {% if 'stroke' in metricsgroups %}
+      {% if workout.workouttype == 'water' %}
+      anglesoptions.PieStartAngle = 90+catch_now;
+      set_stroke();
+      {% endif %}
+      {% endif %}
+
+      // cookie reader
+      function createCookie(name,value,days) {
+        if (days) {
+          var date = new Date();
+          date.setTime(date.getTime()+(days*24*60*60*1000));
+          var expires = "; expires="+date.toGMTString();
+        }
+        else var expires = "";
+        document.cookie = name+"="+value+expires+"; path=/";
+      }
+      function readCookie(name) {
+        var nameEQ = name + "=";
+        var ca = document.cookie.split(';');
+        for(var i=0;i < ca.length;i++) {
+          var c = ca[i];
+          while (c.charAt(0)==' ') c = c.substring(1,c.length);
+          if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
+        }
+        return null;
+      }
+      // lock
+      var lock = document.getElementById("lock");
+      var output = document.getElementById("id_delay");
+      var cookie = readCookie("lock{{ workout.id }}");
+      var delay = output.value;
+      if (cookie=="true") {
+        lock.checked = true;
+        output.disabled = true;
+      }
+
+      // lock.onchange nog doen
+
+      {% if locked %}
+      lock.checked = true;
+      output.disabled = true;
+      {% endif %}
+
+
+      // slider
+      var slider = document.getElementById("myRange");
+      {% if user.is_authenticated and user == workout.user.user %}
+      document.getElementById("myRange").style.display = "block";
+      {% else %}
+      document.getElementById("myRange").style.display = "none";
+      {% endif %}
+      var output = document.getElementById("id_delay");
+
+      // Update the current slider value (each time you drag the slider handle)
+      slider.oninput = function() {
+        if (!lock.checked) {
+          try {
+
+            delay = Math.round(slider.value)-Math.round(player.getCurrentTime());
+            output.value = Math.round(slider.value)-Math.round(player.getCurrentTime()); // Display the default slider value
+          }
+          catch(err) {
+            output.value = Math.round(slider.value);
+            delay = Math.round(slider.value);
+          }
+        }
+        clearInterval(timeupdater);
+        var datatime = this.value
+        var videotime = Math.round(player.getCurrentTime());
+        if (lock.checked) {
+          if (this.value-output.value > 0) {
+            player.seekTo(this.value-output.value);
+            videotime = this.value-output.value;
+          } else {
+            if (playing && !dataplaying) {
+              player.seekTo(0);
+              player.playVideo();
+            }
+            else if (!playing && !dataplaying) {
+              player.seekTo(0);
+              player.pauseVideo();
+              playing = false;
+            }
+          }
+        } else {
+          // console.log('changing, not checked');
+          output.value = this.value-Math.round(player.getCurrentTime());
+        }
+
+        // Setting Data
+        // velo = boatspeed[Math.round(datatime)];
+        lat = latitude[Math.round(datatime)];
+        lon = longitude[Math.round(datatime)];
+        // strokerate = spm[Math.round(datatime)];
+        // catchangle = ctch[Math.round(datatime)];
+        {% for id, metric in metrics.items %}
+        {{ id }}_now = {{ id }}_values[Math.round(datatime)];
+        // console.log(datatime,{{ id }}_now, "{{ metric.name }}")
+        {% endfor %}
+
+        {% for group in metricsgroups %}
+        try {
+          set_{{ group }}();
+        } catch (e) {
+        }
+        {% endfor %}
+        try {
+          var newLatLng = new L.LatLng(lat, lon);
+          // console.log(newLatLng);
+          marker.setLatLng(newLatLng);
+        } catch (e) {
+        }
+        timeupdater = setInterval(updateTime, 1000);
+      }
+
+      output.oninput = function() {
+        slider.value = this.value+Math.round(player.getCurrentTime());
+      }
+
+
+      // Update the current slider value (each time the slider is changed)
+      slider.onchange = function() {
+        clearInterval(timeupdater)
+        if (lock.checked) {
+          if (this.value-output.value > 0) {
+            player.seekTo(this.value-output.value);
+            if (playing) {
+              player.playVideo();
+            } else {
+              player.pauseVideo();
+            }
+          } else {
+            if (playing) {
+              player.seekTo(0);
+              player.playVideo();
+            }
+            else {
+              player.seekTo(0);
+              player.pauseVideo();
+              playing = false;
+            }
+          }
+        } else {
+          output.value = this.value-Math.round(player.getCurrentTime());
+        }
+        var datatime = this.value
+        var videotime = Math.round(player.getCurrentTime());
+        //
+        // Setting Data
+        // velo = boatspeed[Math.round(datatime)];
+        lat = latitude[Math.round(datatime)];
+        lon = longitude[Math.round(datatime)];
+        // strokerate = spm[Math.round(datatime)];
+        // catchangle = ctch[Math.round(datatime)];
+        {% for id, metric in metrics.items %}
+        {{ id }}_now = {{ id }}_values[Math.round(datatime)];
+        // console.log(datatime,{{ id }}_now, "{{ metric.name }}")
+        {% endfor %}
+
+        {% for group in metricsgroups %}
+        try {
+          set_{{ group }}();
+        } catch (e) {
+          console.log(e);
+        }
+        {% endfor %}
+        try {
+          var newLatLng = new L.LatLng(lat, lon);
+          // console.log(newLatLng);
+          marker.setLatLng(newLatLng);
+        } catch (e) {
+          console.log('error')
+        }
+        console.log('changed all')
+        timeupdater = setInterval(updateTime, 1000);
+      }
+
+      output.oninput = function() {
+        slider.value = this.value+Math.round(player.getCurrentTime());
+      }
+
+      // lock delay form field if checkbox checked
+      lock.oninput = function() {
+        if (this.checked) {
+          output.disabled = true;
+          createCookie("lock{{ workout.id}}","true",0);
+        } else {
+          output.disabled = false;
+          createCookie("lock{{ workout.id }}","false",0);
+        }
+      }
+      // Slider start stop
+      // moet de buttons pas hieronder definieren en dan in de html
+      // pluggen
+      var timer;
+
+
+      function clock() {
+        timer = setInterval(myClock, 1000);
+        var c = parseInt(slider.value,10);
+        console.log('starting clock');
+
+        function myClock() {
+          c = c+1;
+          slider.value = c;
+
+          // update data fields
+          lat = latitude[Math.round(c)];
+          lon = longitude[Math.round(c)];
+          {% for id, metric in metrics.items %}
+          {{ id }}_now = {{ id }}_values[Math.round(c)];
+          // console.log(datatime,{{ id }}_now, "{{ metric.name }}")
+          {% endfor %}
+
+
+          {% for group in metricsgroups %}
+          try {
+            set_{{ group }}();
+          } catch (e) {}
+          {% endfor %}
+          try {
+            var newLatLng = new L.LatLng(lat, lon);
+            // console.log(newLatLng);
+            marker.setLatLng(newLatLng);
+          } catch (e) {
+          }
+
+          if (lock.checked) {
+            player.seekTo(c+parseInt(output.value));
+          } else {
+            delay = Math.round(slider.value)-Math.round(player.getCurrentTime());
+            output.value = Math.round(slider.value)-Math.round(player.getCurrentTime());
+          }
+
+          if (c == latitude.length) {
+            clearInterval(timer);
+            c = 0;
+          }
+        }
+      }
+
+      // onderstaande alleen als lock.checked
+      var dataplay = document.createElement("input");
+      dataplay.type = "button";
+      dataplay.value = String.fromCharCode(9658);
+      document.getElementById("dataplay").appendChild(dataplay);
+
+      // var datastop = document.createElement("input");
+      // datastop.type = "button";
+      // datastop.value = "Stop";
+      // document.getElementById("datastop").appendChild(datastop)
+
+
+
+      dataplay.onclick = function() {
+        if (lock.checked) {
+          dataplaying = false;
+          if (playing == false) {
+            player.playVideo();
+            dataplay.value = String.fromCharCode(10074,10074);
+            playing = true;
+          } else {
+            player.pauseVideo();
+            dataplay.value = String.fromCharCode(9658);
+            playing = false;
+          }
+        } else {
+          if (!dataplaying) {
+            clock();
+            dataplay.value = String.fromCharCode(10074,10074);
+            dataplaying = true;
+            if (lock.checked) {
+              playing = true;
+            }
+          } else {
+            clearInterval(timer);
+            dataplay.value = String.fromCharCode(9658);
+            dataplaying = false;
+          }
+        }
+      }
+
+      });
+    });
+
+  </script>
+{% endlanguage %}
+
+{% endblock %}
+
+{% block sidebar %}
+{% include 'menu_workout.html' %}
+{% endblock %}