Skip to content

Instantly share code, notes, and snippets.

@sayak-sarkar
Forked from GenOpen/gist:5207901
Created April 1, 2013 15:36
Show Gist options
  • Save sayak-sarkar/5285619 to your computer and use it in GitHub Desktop.
Save sayak-sarkar/5285619 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<base href="https://popcorn.webmaker.org/templates/basic/">
<title>Popcorn Maker</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="../../../css/transitions.css">
<link rel="stylesheet" href="../assets/plugins/popup/popcorn.popup.css">
<link rel="stylesheet" href="../assets/plugins/image/popcorn.image.css">
<link rel="stylesheet" href="../assets/plugins/twitter/popcorn.twitter.css">
<link rel="stylesheet" href="../assets/plugins/text/popcorn.text.css">
<link rel="stylesheet" href="../assets/plugins/wikipedia/popcorn.wikipedia.css">
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-35433268-2']);
_gaq.push(['_setDomainName', 'webmaker.org']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<meta property="og:title" content="Popcorn Maker">
<meta property="og:description" content="Video beyond the box. Popcorn Maker makes it easy to enhance, remix and share web video. ">
<meta property="og:url" content="https://popcorn.webmaker.org">
<meta property="og:site_name" content="Mozilla Webmaker">
<meta property="og:type" content="website">
<meta property="og:image" content="https://popcorn.webmaker.org/resources/icons/fb-logo.png">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="200">
<meta property="og:image:height" content="200">
<script>
var popcornDataFn = function(){
var popcorn = Popcorn.smart("#video", [ "#t=,30" ], {"frameAnimation":true,"id":"Butter-Generated"});
popcorn.text({
"start": 0,
"end": 5,
"target": "video-container",
"left": 0.5327388218470982,
"top": 89.20634920634922,
"text": "A Generation Open Project\n",
"linkUrl": "",
"position": "custom",
"alignment": "left",
"transition": "popcorn-slide-down",
"fontFamily": "Covered By Your Grace",
"fontSize": "7",
"fontColor": "#000000",
"shadow": false,
"shadowColor": "#444444",
"background": false,
"backgroundColor": "#888888",
"fontDecorations": {
"bold": false,
"italics": true
},
"width": 97.85714285714285,
"zindex": 1000,
"id": "TrackEvent1"
});
popcorn.text({
"start": 0,
"end": 5,
"target": "video-container",
"left": 6.25,
"top": 39.04761904761905,
"text": "&#34; My Music &#34;\n",
"linkUrl": "",
"position": "middle",
"alignment": "left",
"transition": "popcorn-fade",
"fontFamily": "Covered By Your Grace",
"fontSize": "16",
"fontColor": "#000000",
"shadow": false,
"shadowColor": "#444444",
"background": false,
"backgroundColor": "#888888",
"fontDecorations": {
"bold": false,
"italics": true
},
"width": 91.96428571428571,
"zindex": 999,
"id": "TrackEvent0"
});};
</script>
<link rel="stylesheet" href="/css/embed.css">
<link rel="stylesheet" href="/css/controls.css">
<!-- This is the embed, the actual content is at the following URL-->
<link rel="canonical" href="http://popcorn.webmadecontent.org/tiz">
<style>
@-o-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-webkit-viewport { width: device-width; }
@viewport { width: device-width; }
</style>
<script src="/src/embed.js"></script>
</head>
<body class="embed">
<div id="container" class="container">
<div id="video-container" class="video video-container">
<div id="video" class="video"></div>
</div>
<div class="loading-message"></div>
</div>
<div id="controls-big-play-button"></div>
<div id="post-roll-container">
<div id="post-roll" class="embed-overlay">
<div class="post-roll-inner"><a class="embed-logo"></a>
<div class="embed-project">
<div>
<div class="mozpopcorn">Popcorn Maker</div>
<div class="embed-title">My Music</div>
<div class="embed-author"></div>
</div>
<div class="post-roll-description">This was created with Popcorn Maker.<br><a href="/" target="_blank">Create a project like this!</a></div>
<ul class="embed-nav post-roll-options">
<li><a id="replay-post"><span>Replay</span></a></li>
<li><a href="?savedDataUrl=/api/remix/38267" target="_blank" id="remix-post"><span>Remix</span></a></li>
<li><a id="share-post"><span>Share</span></a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="share-container">
<div id="share" class="embed-overlay">
<div class="share-inner"><a id="share-close">X</a><a class="embed-logo"></a>
<div class="embed-project">
<div>
<div class="mozpopcorn">Popcorn Maker</div>
<div class="embed-title">My Music</div>
<div class="embed-author"></div>
</div>
</div>
<div id="share-options" class="share-options">
<fieldset>
<label>URL</label>
<input id="share-url" type="url" class="share-ul">
<ul class="embed-nav share-buttons">
<li><a id="replay-share" href="#">Twitter</a></li>
<li><a id="share-share" href="#">Google+</a></li>
</ul>
</fieldset>
<fieldset>
<label>Embed</label>
<textarea id="share-iframe">
<iframe></iframe>
</textarea>
<div class="share-size">
<div class="size-options"><a href="#" class="small option"><span class="icon"></span><span class="size">Small</span><span class="dimensions">560x358</span></a><a href="#" class="medium option current"><span class="icon"></span><span class="size">Medium</span><span class="dimensions">640x403</span></a><a href="#" class="large option"><span class="icon"></span><span class="size">Large</span><span class="dimensions">853x523</span></a><a href="#" class="xlarge option"><span class="icon"></span><span class="size">X-Large</span><span class="dimensions">1280x763</span></a></div>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div id="attribution-info" class="attribution-info">
<div id="attribution-logo" class="attribution-logo"><span class="attribution-text">Credits</span></div>
<div id="attribution-details" class="attribution-details"><span class="attribution-close"></span>
<div class="attribution-mopop">mozilla Popcorn</div>
<div class="attribution-title">My Music</div>
<div class="attribution-media"><span class="media-icon"></span><a href="#t=,30" target="_blank" class="attribution-media-src">#t=,30</a></div>
<div class="attribution-extra"></div>
</div>
</div>
<div id="controls" class="controls"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment