Basic Video Player with Effects for Local Videos

<html>
<head>
    <style>
        #myvideo {
            //-webkit-filter: sepia(1);
            //-webkit-filter: blur(3px);
            -webkit-filter: grayscale(1);
            //-webkit-filter: sepia(1);
            //-webkit-filter: brightness(2.5);
            //-webkit-filter: contrast(5);
            //-webkit-filter: hue-rotate(125deg);
            //-webkit-filter: invert(1);
            //-webkit-filter: saturate(3);
            //-webkit-filter: opacity(0.3);
        }

    </style>

</head>
<body>
    <h1>HTML5 local video file player example</h1>
    <div id="message"></div>
    <input type="file" accept="video/*"/>
    <video id="myvideo" controls autoplay></video>

    <script>
     play = function playSelect(event) {
        var file = this.files[0];
        var videoNode = document.querySelector('video');
        var fileURL = URL.createObjectURL(file);

        videoNode.src = fileURL;
     },
     inputNode = document.querySelector('input');


    inputNode.addEventListener('change', play, false);

    </script>
</body>

</html>