OpenLayers load external API dynamically

HTML

<link rel="stylesheet" href="http://dev.openlayers.org/theme/default/style.css">
<link rel="stylesheet" href="http://dev.openlayers.org/examples/style.css">
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="http://openlayers.org/api/2.11/OpenLayers.js"></script>
<script src="http://fgnass.github.io/spin.js/spin.min.js"></script>
<div id="spinner"></div>
    
 <h1 id="title">Load external APIs on demand</h1>


<p id="shortdesc">Demonstrates the use of Ajax Request to load Google API.</p>
<div id="map" class="smallmap"></div>

CSS

#map
{ width:100% !important;}

JavaScript

window.onload = init;
var opts = {
    lines: 13, // The number of lines to draw
    length: 20, // The length of each line
    width: 12, // The line thickness
    radius: 30, // The radius of the inner circle
    corners: 1, // Corner roundness (0..1)
    rotate: 0, // The rotation offset
    direction: 1, // 1: clockwise, -1: counterclockwise
    color: '#000', // #rgb or #rrggbb or array of colors
    speed: 1, // Rounds per second
    trail: 60, // Afterglow percentage
    shadow: true, // Whether to render a shadow
    hwaccel: false, // Whether to use hardware acceleration
    className: 'spinner', // The CSS class to assign to the spinner
    zIndex: 2e9, // The z-index (defaults to 2000000000)
    top: '50%', // Top position relative to parent
    left: '50%' // Left position relative to parent
};


var map, switcher;
var google, google_layer;
var spinner, target;

function init() {

target = document.getElementById('spinner');


map = new OpenLayers.Map('map', {
    projection: new OpenLayers.Projection("EPSG:3857"),
    eventListeners: {
        //"moveend": mapEvent,
        //"zoomend": mapEvent,
        //"changelayer": mapLayerChanged,
        "changebaselayer": mapBaseLayerChanged
    }
});

switcher = new OpenLayers.Control.LayerSwitcher({
    'div': OpenLayers.Util.getElement('layerswitcher')
});
map.addControl(switcher);

var osm = new OpenLayers.Layer.OSM("OSM");


var dm_wms = new OpenLayers.Layer.WMS("DM Solutions Demo",
    "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap", {
    layers: "bathymetry,land_fn,park,drain_fn,drainage," +
        "prov_bound,fedlimit,rail,road,popplace",
    transparent: "true",
    format: "image/png"
});

google_layer = new OpenLayers.Layer("Google", {
    isBaseLayer: true,
    displayInLayerSwitcher: true
});

var osm2 = new OpenLayers.Layer.OSM("OSM2");
    // second OSM-Layer just to show that the Positon of the Google-Layer within the Layerswitcher does not change

map.addLayers([osm, google_layer, dm_wms,...