//= require "libraries"
$('#library').bind('init', function () {
  var $select = $(this),
      html = ['<option value="none">None</option>'],
      selected = $select.val(),
      i, j;
  
  for (i = 0; i < libraries.length; i++) {
    html.push('<optgroup label="' + libraries[i].text + '">');
    for (j = 0; j < libraries[i].scripts.length; j++) {
      html.push('<option value="' + i + '-' + j + '">' + libraries[i].scripts[j].text + '</option>');
    }
    html.push('</optgroup>');
  }
  
  $select.html( html.join('') ).val(selected);
}).trigger('init');

var state = {};

$('#library').bind('change', function () {
  var libIndex = [],
      lib = {},
      thislib = {},
      re,
      i,
      code = editors.html.getCode();

  // strip existing libraries out  
  var addAdjust = code.match(/<(script|link) class="jsbin"/g);
  if (addAdjust == null) addAdjust = [];
  
  code = code.replace(/<script class="jsbin".*><\/script>\n?/g, '');
  code = code.replace(/<link class="jsbin".*\/>\n?/g, '');
  
  if (this.value != 'none') {
    // to restore (note - the adjustment isn't quite 100% right yet)
    state = {
      line: editors.html.currentLine(),
      character: editors.html.getCursor().ch,
      add: 1 - addAdjust.length
    };

    libIndex = this.value.split('-');
    lib = libraries[libIndex[0]];
    thislib = lib.scripts[libIndex[1]];

    if (thislib.requires) lib.requires = thislib.requires;
    if (thislib.style) lib.style = thislib.style;

    // all has to happen in reverse order because we're going directly after <head>
    code = code.replace('<head', "<head>\n<" + 'script class="jsbin" src="' + lib.scripts[libIndex[1]].url + '"><' + '/script');
    if (lib.requires) {
      state.add++;
      code = code.replace('<head', "<head>\n<" + 'script class="jsbin" src="' + lib.requires + '"><' + '/script');
    }
    
    if (lib.style) {
      state.add++;
      code = code.replace('<head', "<head>\n<" + 'link class="jsbin" href="' + lib.style + '" rel="stylesheet" type="text/css" /');
    }
    
    state.line += state.add;
  } else {
    state.line -= state.add;
  }

  editors.html.setCode(code);
  editors.html.focus();
  editors.html.setCursor({ line: state.line, ch: state.character });
});

@@ -1552,16 +1552,58 @@
  %3Chead%3E%0A
+    if (code.indexOf('%3Chead') !== -1) %7B%0A  
     code
@@ -1723,24 +1723,26 @@
 ript');%0A    
+ 
+ 
 if (lib.requ
@@ -1747,32 +1747,34 @@
 quires) %7B%0A      
+  
 state.add++;%0A   
@@ -1762,32 +1762,34 @@
    state.add++;%0A
+  
       code = cod
@@ -1887,31 +1887,37 @@
 ript');%0A    
+  
 %7D%0A    
+ 
-%0A
+ %0A  
     if (lib.
@@ -1927,24 +1927,26 @@
 le) %7B%0A      
+  
 state.add++;
@@ -1942,24 +1942,26 @@
 tate.add++;%0A
+  
       code =
@@ -2080,26 +2080,507 @@
 s%22 /');%0A
+      %7D%0A    %7D else %7B // add to the start of the doc%0A      code = %22%3C%22 + 'script class=%22jsbin%22 src=%22' + lib.scripts%5BlibIndex%5B1%5D%5D.url + '%22%3E%3C' + '/script%3E%5Cn' + code;%0A      if (lib.requires) %7B%0A        state.add++;%0A        code = %22%3C%22 + 'script class=%22jsbin%22 src=%22' + lib.requires + '%22%3E%3C' + '/script%3E%5Cn' + code;%0A      %7D%0A      %0A      if (lib.style) %7B%0A        state.add++;%0A        code = '%3C' + 'link class=%22jsbin%22 href=%22' + lib.style + '%22 rel=%22stylesheet%22 type=%22text/css%22 /%3E%5Cn' + code;%0A      %7D%0A
     %7D%0A
-    
 %0A    sta

allow library to be inserted when no head tag available