Flowplayer speed buttons to switch video speed for https://wordpress.org/plugins/flowplayer5/ v1.11.1

fp5-speed-buttons.php

<?php
/*
Plugin Name: Flowplayer speed buttons
Plugin URI: https://gist.github.com/grappler/02b9d43c0606d74869a1
Description: Add buttons to adjust the speed of the video. The styles are added in the child theme
Version: 0.1.0
Author: Ulrich Pogson
Author URI: https://ulrich.pogson.ch/
License: GPLv2
License URI: http://www.gnu.org/licenses/old-licenses/gpl-2.0.en.html
*/

function juanmaguitar_video_speed( $video_data_config, $video_id ) {
	// Only add to specific video ids
	if ( '2161' === $video_id ) {
		$video_data_config['speeds'] = '[0.25, 0.5, 1.0, 1.5, 2.0]';
	}
	return $video_data_config;
}
add_filter( 'fp5_video_data_config', 'juanmaguitar_video_speed', 10, 2 );

function juanmaguitar_speed_buttons( $video_id ) {
	// Add the speed buttons to the specific videos
	if ( '2161' === $video_id ) {
		echo '<div class="fp5-speed-buttons">
		<span>0.25x</span>
		<span>0.5x</span>
		<span class="fp5-speed-active">1x</span>
		<span>1.5x</span>
		<span>2x</span>
		</div>';
	}
}
add_action( 'fp5_video_bottom', 'juanmaguitar_speed_buttons' );

function juanmaguitar_inline_script() {
	$js = 'flowplayer(function(api,root){var speedelement=root.querySelector(".fp5-speed-buttons"),buttons=Array.prototype.slice.call(speedelement.getElementsByTagName("span"));api.on("load",function(e,api){if(api.engine.engineName=="flash"||!flowplayer.support.inlineVideo){speedelement.parentNode.removeChild(speedelement);}}).on("speed",function(e,api,rate){var i;speedelement.querySelector(".fp5-speed-active").removeAttribute("class");for(i=0;i<api.conf.speeds.length;i=i+1){if(api.conf.speeds[i]==rate){buttons[i].className="fp5-speed-active";break;}}});buttons.forEach(function(button){button.onclick=function(){var i;if(button.classNme!="fp5-speed-active"){for(i=0;i<api.conf.speeds.length;i=i+1){if(buttons[i]===button){api.speed(api.conf.speeds[i]);break;}}}};});});';
	wp_add_inline_script( 'flowplayer5-script', $js );
}
add_action( 'wp_enqueue_scripts', 'juanmaguitar_inline_script' );

non-minified.js

// global speed widgets setup applying to all players on page
flowplayer(function (api, root) {
  var speedelement = root.querySelector(".fp5-speed-buttons"),
      // turn button elements into an indexable array
      buttons = Array.prototype.slice.call(speedelement.getElementsByTagName("span"));
 
  api.on("load", function (e, api) {
    // remove speed buttons if playback rate changes are not available
    if (api.engine.engineName == "flash" || !flowplayer.support.inlineVideo) {
      speedelement.parentNode.removeChild(speedelement);
    }
 
  }).on("speed", function (e, api, rate) {
    // mark the current speed button as active
    var i;
 
    speedelement.querySelector(".fp5-speed-active").removeAttribute("class");
    for (i = 0; i < api.conf.speeds.length; i = i + 1) {
      if (api.conf.speeds[i] == rate) {
        buttons[i].className = "fp5-speed-active";
        break;
      }
    }
  });
 
  // bind speed() call to click on buttons
  buttons.forEach(function (button) {
 
    button.onclick = function () {
      var i;
 
      if (button.classNme != "fp5-speed-active") {
        for (i = 0; i < api.conf.speeds.length; i = i + 1) {
          if (buttons[i] === button) {
            api.speed(api.conf.speeds[i]);
            break;
          }
        }
      }
    };
 
  });
 
});

style.css

/* initially hide speed buttons while they cannot be used */
.is-splash.flowplayer .fp5-speed-buttons, .is-loading.flowplayer .fp5-speed-buttons {
	display: none;
}
.flowplayer .fp5-speed-buttons {
	position: absolute;
	right: 15px;
	bottom: 40px;
	z-index: 12; /* make clickable */
	display: block;
	opacity: 1;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
}
.is-mouseout.flowplayer .fp5-speed-buttons {
	opacity: 0;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	/* same transition as other ui elements like fullscreen */
	-webkit-transition: opacity .15s .3s;
	-moz-transition: opacity .15s .3s;
	transition: opacity .15s .3s;
}
.flowplayer .fp5-speed-buttons span {
	padding: 1ex;
	margin: 0.5ex;
	width: 3em;
	display: inline-block;
	text-align: center;
	font-weight: bold;
	background-color: #eee;
	cursor: pointer;
	-webkit-border-radius: 1ex;
	-moz-border-radius: 1ex;
	border-radius: 1ex;
}
.flowplayer .fp5-speed-buttons span.fp5-speed-active {
	color: #00a7c8;
	background-color: #666;
	cursor: default;
}