Add embed link to demo page, and update README

README.md

@@ -16,6 +16,25 @@ supported](http://caniuse.com/#feat=audio-api).
 - "Shade" mini-mode
 - "Doubled" mode, where the main window is twice as large: `Ctrl-D`
 
+## Embed Winamp2-js in your web page
+
+If you would like to embed Winamp2-js into your web page, simply paste this
+HTML snippet where you would like the player to appear:
+
+    <script async src="https://jordaneldredge.com/winamp2-js.js"></script>
+
+You can set the default audio file by adding the following attribute to the
+`<script>` tag:
+
+    data-media="https://example.com/dj-llama.mp3"
+
+*Note: The audio file must be hosted on the [same
+domain](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS)
+as your web page*
+
+If Winamp2-js cannot run in a user's browser, it will fall back to a simple
+`<audio>` tag.
+
 ## Running locally vs. Production
 
 Running Winamp2-js locally is as simple as cloning this repository and opening

css/page.css

@@ -33,3 +33,43 @@ body {
 .about a {
     color: white;
 }
+
+#embed {
+    position: absolute;
+    bottom: 0;
+    right: 0;
+    color: white;
+    margin-right: 15px;
+    text-align: left;
+}
+
+#embed label {
+    display: inline-block;
+}
+
+#embed a {
+    color: white;
+    float: left;
+}
+
+#embed input {
+    border: 1px solid black;
+    width: 300px;
+    padding: 5px;
+    border-radius: 5px;
+    font-size: 13px;
+    display: none;
+    margin-left: 15px;
+    margin-right: 15px;
+}
+
+#embed #embed-learn-more {
+    display: none;
+}
+#embed.selected #embed-learn-more {
+    display: inline;
+}
+
+#embed.selected input {
+    display: inline;
+}

index.html

@@ -25,6 +25,11 @@
             -
             <a href='https://github.com/captbaritone/winamp2-js'>GitHub</a>
         </p>
+        <p id='embed'>
+            <label><a href='#' id='embed-link'>Embed</a></label>
+            <input type='text' id='embed-input' value='<script async src="https://jordaneldredge.com/winamp2-js.js"></script>'>
+            <label><a href='https://github.com/captbaritone/winamp2-js#embed-winamp2-js-in-your-web-page' id='embed-learn-more'>?</a></label>
+        </p>
         <script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                     (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

js/main.js

@@ -13,6 +13,10 @@ require([
     Context,
     Hotkeys
 ) {
+    document.getElementById('embed-link').onclick = function() {
+        document.getElementById('embed').classList.toggle('selected');
+        document.getElementById('embed-input').select();
+    };
     if(Browser.isCompatible()) {
         var mainWindowElement = document.createElement('div');
         mainWindowElement.innerHTML = mainWindowHtml;