make actionbar buttons unselectable

js/h5p-action-bar.js

@@ -36,7 +36,7 @@ H5P.ActionBar = (function ($, EventDispatcher) {
         self.trigger(type);
       };
       H5P.jQuery('<li/>', {
-        'class': 'h5p-button h5p-' + (customClass ? customClass : type),
+        'class': 'h5p-button h5p-noselect h5p-' + (customClass ? customClass : type),
         role: 'button',
         tabindex: 0,
         title: H5P.t(type + 'Description'),

styles/h5p.css

@@ -30,6 +30,15 @@ html.h5p-iframe, html.h5p-iframe > body {
   box-sizing: border-box;
   -moz-box-sizing: border-box;
 }
+.h5p-noselect
+{
+  -khtml-user-select: none;
+  -ms-user-select: none;
+  -moz-user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  user-select: none;
+}
 html.h5p-iframe .h5p-content {
   font-size: 16px;
   line-height: 1.5em;