requirebin sketch

index.js

// require() some stuff from npm (like you were using browserify)
// and then hit Run Code to run it on the right
var play = require('play-audio');

var parent = document.querySelector('.my-player');
var arrayMusic = [
  'http://cs9-15v4.vk.me/p23/d7b5836f0aa2b3.mp3?extra=9smwPXxS36hDfbxbfFboFFe1iG3ET0uObOpeoUpNASVyIbO3vGynqj3b7c-ayq3QydYnM553AjD8sdoIww9b5n_ZO7mfgw&/Unheilig%20-%20Geboren%20Um%20Zu%20Leben.mp3',
  'http://cs9-5v4.vk.me/p14/7f439d8e8b2012.mp3?extra=M5W5t54VhEN785zCu7XwwVj8yqj55u66Uj5Ku_r1TZR8tpyzYt1BdEtv97pYfl527mwh4u50MiIjDizXKD5JJ0tovh-vnA&/%D0%A1%D0%BC%D1%8B%D1%81%D0%BB%D0%BE%D0%B2%D1%8B%D0%B5%20%D0%93%D0%B0%D0%BB%D0%BB%D1%8E%D1%86%D0%B8%D0%BD%D0%B0%D1%86%D0%B8%D0%B8%20-%20%D0%94%D0%B5%D0%BC%D0%BE%D0%BD%D1%8B.mp3'
  ];
arrayMusic.forEach(function(val, key){
  play(val, parent).controls();
});

minified.js

require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){module.exports=require("./lib/player");module.exports.audio=media("audio");module.exports.video=media("video");function media(kind){return function(urls,dom){return module.exports(kind,urls,dom)}}},{"./lib/player":3}],2:[function(require,module,exports){var table={aif:"audio/x-aiff",aiff:"audio/x-aiff",wav:"audio/x-wav",mp3:"audio/mpeg",m3u:"audio/x-mpegurl",mid:"audio/midi",midi:"audio/midi",m4a:"audio/m4a",ogg:"audio/ogg",mp4:"video/mp4",ogv:"video/mp4",webm:"video/webm",mkv:"video/x-matroska",mpg:"video/mpeg"};module.exports=mimeOf;function mimeOf(url){return table[url.split(".").slice(-1)[0]]}},{}],3:[function(require,module,exports){var newChain=require("new-chain"),src=require("./src"),render=require("./render");module.exports=play;function play(media,urls,dom){var el,chain,url;dom||(dom=document.documentElement);el=render(media);dom.appendChild(el);chain=newChain({autoplay:bool("autoplay"),controls:bool("controls"),load:method("load"),loop:bool("loop"),muted:bool("muted"),on:on,pause:method("pause"),play:method("play"),preload:bool("preload")});chain.currentTime=attr("currentTime");chain.element=element;chain.src=src.attr(el);chain.volume=attr("volume");chain.remove=remove;chain.src(urls);return chain;function attr(name){return function(value){if(arguments.length){el[name]=value;return chain}return el[name]}}function bool(name){return function(value){if(value===false){return el[name]=false}return el[name]=true}}function element(){return el}function on(event,callback){el.addEventListener(event,callback,false)}function method(name){return function(){return el[name].apply(el,arguments)}}function remove(){return el.parentNode.removeChild(el)}}},{"./render":4,"./src":5,"new-chain":8}],4:[function(require,module,exports){var domify=require("domify"),templates=require("./templates");module.exports=render;function render(media){return domify(templates[media+".html"])}},{"./templates":6,domify:7}],5:[function(require,module,exports){var mimeOf=require("./mime");module.exports={attr:attr,pick:pick};function attr(el){var value;return function(urls){if(arguments.length){value=urls;el.setAttribute("src",pick(el,value))}return value}}function pick(el,urls){if(!urls)return;if(typeof urls=="string"){return urls}var canPlay=urls.filter(function(url){return!!el.canPlayType(url.mime||mimeOf(url.type||url))});if(canPlay.length==0)return;return canPlay[0].url||canPlay[0]}},{"./mime":2}],6:[function(require,module,exports){exports["audio.html"]='<audio preload="auto" /></audio>';exports["video.html"]='<video preload="auto" /></video>'},{}],7:[function(require,module,exports){module.exports=parse;var map={option:[1,'<select multiple="multiple">',"</select>"],optgroup:[1,'<select multiple="multiple">',"</select>"],legend:[1,"<fieldset>","</fieldset>"],thead:[1,"<table>","</table>"],tbody:[1,"<table>","</table>"],tfoot:[1,"<table>","</table>"],colgroup:[1,"<table>","</table>"],caption:[1,"<table>","</table>"],tr:[2,"<table><tbody>","</tbody></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],th:[3,"<table><tbody><tr>","</tr></tbody></table>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],_default:[0,"",""]};function parse(html){if("string"!=typeof html)throw new TypeError("String expected");var m=/<([\w:]+)/.exec(html);if(!m)throw new Error("No elements were generated.");var tag=m[1];if(tag=="body"){var el=document.createElement("html");el.innerHTML=html;return el.removeChild(el.lastChild)}var wrap=map[tag]||map._default;var depth=wrap[0];var prefix=wrap[1];var suffix=wrap[2];var el=document.createElement("div");el.innerHTML=prefix+html+suffix;while(depth--)el=el.lastChild;var els=el.children;if(1==els.length){return el.removeChild(els[0])}var fragment=document.createDocumentFragment();while(els.length){fragment.appendChild(el.removeChild(els[0]))}return fragment}},{}],8:[function(require,module,exports){module.exports=newChain;module.exports.from=from;function from(chain){return function(){var m,i;m=methods.apply(undefined,arguments);i=m.length;while(i--){chain[m[i].name]=m[i].fn}m.forEach(function(method){chain[method.name]=function(){method.fn.apply(this,arguments);return chain}});return chain}}function methods(){var all,el,i,len,result,key;all=Array.prototype.slice.call(arguments);result=[];i=all.length;while(i--){el=all[i];if(typeof el=="function"){result.push({name:el.name,fn:el});continue}if(typeof el!="object")continue;for(key in el){result.push({name:key,fn:el[key]})}}return result}function newChain(){return from({}).apply(undefined,arguments)}},{}],"play-audio":[function(require,module,exports){module.exports=require("media").audio},{media:1}]},{},[]);var play=require("play-audio");var parent=document.querySelector(".my-player");play("http://cs9-5v4.vk.me/p14/7f439d8e8b2012.mp3?extra=M5W5t54VhEN785zCu7XwwVj8yqj55u66Uj5Ku_r1TZR8tpyzYt1BdEtv97pYfl527mwh4u50MiIjDizXKD5JJ0tovh-vnA&/%D0%A1%D0%BC%D1%8B%D1%81%D0%BB%D0%BE%D0%B2%D1%8B%D0%B5%20%D0%93%D0%B0%D0%BB%D0%BB%D1%8E%D1%86%D0%B8%D0%BD%D0%B0%D1%86%D0%B8%D0%B8%20-%20%D0%94%D0%B5%D0%BC%D0%BE%D0%BD%D1%8B.mp3",parent).autoplay().controls();

package.json

{
  "name": "requirebin-sketch",
  "version": "1.0.0",
  "dependencies": {
    "play-audio": "0.1.0"
  }
}

page-body.html

<!-- contents of this file will be placed inside the <body> -->
<div class="my-player"></div>

page-head.html

<!-- contents of this file will be placed inside the <head> -->

requirebin.md

made with requirebin