Skip to content

Instantly share code, notes, and snippets.

View gsemino's full-sized avatar

Glen S gsemino

1 follower · 1 following
View GitHub Profile
@gsemino
gsemino / boostrap-sample-final.html
Created July 13, 2018 10:02
Bootstrap page for Bitmovin Background Video tutorial with Video Embedded and CSS (final)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bitmovin Background Video on Responsive Bootstrap 4 page</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
@gsemino
gsemino / bitmovin-background-video.css
Created July 13, 2018 09:53
Bitmovin Background Video tutorial css
.bmpui-ui-uicontainer {
/* eliminates the video container, which gets rid of controls and logo */
display: none;
}
.bitmovinplayer-container {
/* will allow player to be under header text */
position: relative;
}
@gsemino
gsemino / boostrap-sample-video.html
Created July 13, 2018 09:01
Bootstrap page for Bitmovin Background Video tutorial with Video Embedded
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bitmovin Background Video on Responsive Bootstrap 4 page</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
@gsemino
gsemino / player.js
Last active July 13, 2018 09:00
Bitmovin HTML5 Player configuration (mute, autoplay and loop video)
var conf = {
key: '<your-license-key-here>',
source: {
dash: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/mpds/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.mpd',
hls: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8',
progressive: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/MI201109210084_mpeg-4_hd_high_1080p25_10mbits.mp4',
poster: 'https://media.giphy.com/media/5wFGNEqoIuQlwyjxOB/giphy.gif'
},
playback: {
//bellow will autoplay video and mute it
@gsemino
gsemino / boostrap-sample.html
Created July 13, 2018 07:52
Initial Bootstrap page for Bitmovin Background Video tutorial
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bitmovin Background Video on Responsive Bootstrap 4 page</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
@gsemino
gsemino / final-video-source.html
Created November 27, 2017 17:53
html file with all css added
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>SYNQ.fm Fullscreen Video Sample</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel=stylesheet type="text/css" href="main.css">
<link rel=stylesheet type="text/css" href="media_queries.css">
</head>
<body>
@gsemino
gsemino / media_queries.css
Created November 27, 2017 17:22
media queries css file
@media only screen and (max-width: 767px) {
header {
max-height: auto;
background-color: gray;
background-image: url("https://multicdn.synq.fm/projects/24/19/2419e41be6e04824a8f5019076bf61fe/derivatives/thumbnails/8c/41/8c4179f509914ee8a1906193db830756/0000630.jpg");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 0% 0%;
background-size: cover;
}
@gsemino
gsemino / sample-video-background-video-embed.html
Last active August 10, 2018 05:37
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>SYNQ.fm Fullscreen Video Sample</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<header>
<video loop muted autoplay playsinline poster="https://media.giphy.com/media/26Ff43GwoaAks9XgY/giphy.gif">
@gsemino
gsemino / video_embed_sample.html
Created October 10, 2017 18:25
Sample html page with code for embedding a SYNQ video
<!DOCTYPE html>
<html>
<head>
<style>
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 0px;
height: 0;
overflow: hidden;
@gsemino
gsemino / Runscope-template-Stoplight-GitHub-sync.json
Last active September 19, 2017 17:23
This is a Runscope template for syncing your oas file in Stoplight with GitHub
{
"trigger_url": "https://api.runscope.com/radar/81de52ef-ccf6-4063-ba43-d4755b29d05f/trigger",
"name": "Stoplight-GitHub Sync",
"version": "1.0",
"exported_at": 1505331232,
"steps": [
{
"headers": {},
"url": "https://api.stoplight.io/v1/versions/version-id-here/export/oas.json",
"variables": [