jhartman86 · August 25, 2015 14:03
diff --git a/test-sample-index.js b/test-sample-index.js
 <html>
 <head>
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <style type="text/css">
        * {box-sizing:border-box;}
        html, body {font-size:14px;width:100%;height:100%;margin:0;padding:0;}
        .tabular {width:100%;height:100%;display:table;}
        .cellular {width:100%;height:100%;display:table-cell;vertical-align:middle;text-align:center;}
        .container {text-align:right;position:relative;display:inline-block;width:100%;max-width:90%;}
        main {padding:1rem;text-align:left;font-size:1rem;line-height:1;position:absolute;top:0;left:0;bottom:0;width:65%;}
        main h4 {margin:0;padding-bottom:1rem;border-bottom:1px solid #ccc;}
        aside {text-align:left;font-size:1rem;line-height:1;width:35%;position:relative;display:inline-block;}
    </style>
 </head>

 <body>
    <div class="tabular">
        <div class="cellular">
            <div class="container">
                <main>
                    <h4>Outputs:</h4>
                </main>

                <aside>
                    <h3>Setion 1</h3>
                    <div>
                        <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit</p>
                    </div>
                    <h3>Setion 2</h3>
                    <div>
                        <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit</p>
                    </div>
                    <h3>Setion 3</h3>
                    <div>
                        <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit</p>
                    </div>
                </aside>
            </div>
        </div>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript">
        var runtime = (function(){

            var $jq = jQuery.noConflict(true);

            function Runtime(){
                this.$jq = $jq;
            }

            Runtime.prototype.initialize = function( _callback ){
                var self        = this,
                    markupData  = [];

                for(var i = 0; i < 9999; i++){
                    markupData.push({
                        classes: 'alpha beta gamma',
                        content: 'Lorem ipsum dolor sit amet consect et tetur'
                    });
                }

                this.$jq.getScript("https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js", function(){
                    $('aside').accordion();
                    _callback.apply(self, [self.$jq, markupData]);
                });
            }

            Runtime.prototype.method1 = function( _value, _callback ){
                setTimeout(function(){ console.log('dependency1_resolved');
                    _callback.apply(this, [{valIs:_value}]);
                }.bind(this), (Math.random() * 1000));
            };

            Runtime.prototype.method2 = function( _value, _callback ){
                var self = this;
                setTimeout(function(){ console.log('dependency2_resolved');
                    _callback.apply(self, [{differntValIs:3}]);
                }, (Math.random() * 1000));
            };

            Runtime.prototype.method3 = function( _value, _callback ){
                setTimeout(function(){ console.log('dependency3_resolved');
                    _callback.apply(this, [{valIs:_value['differntValIs'] *= 4}]);
                }.bind(this), (Math.random() * 1000));
            };

            Runtime.prototype.trackTime = function( _callback ){
                console.time('timeTracker');
                _callback();
                console.timeEnd('timeTracker');
            };

            return new Runtime();
        })();
    </script>
    <script type="text/javascript" src="./solutions.js"></script>
 </body>
 </html>
	<html>
	<head>
	<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
	<style type="text/css">
	* {box-sizing:border-box;}
	html, body {font-size:14px;width:100%;height:100%;margin:0;padding:0;}
	.tabular {width:100%;height:100%;display:table;}
	.cellular {width:100%;height:100%;display:table-cell;vertical-align:middle;text-align:center;}
	.container {text-align:right;position:relative;display:inline-block;width:100%;max-width:90%;}
	main {padding:1rem;text-align:left;font-size:1rem;line-height:1;position:absolute;top:0;left:0;bottom:0;width:65%;}
	main h4 {margin:0;padding-bottom:1rem;border-bottom:1px solid #ccc;}
	aside {text-align:left;font-size:1rem;line-height:1;width:35%;position:relative;display:inline-block;}
	</style>
	</head>

	<body>
	<div class="tabular">
	<div class="cellular">
	<div class="container">
	<main>
	<h4>Outputs:</h4>
	</main>

	<aside>
	<h3>Setion 1</h3>
	<div>
	<p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit</p>
	</div>
	<h3>Setion 2</h3>
	<div>
	<p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit</p>
	</div>
	<h3>Setion 3</h3>
	<div>
	<p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit</p>
	</div>
	</aside>
	</div>
	</div>
	</div>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
	<script type="text/javascript">
	var runtime = (function(){

	var $jq = jQuery.noConflict(true);

	function Runtime(){
	this.$jq = $jq;
	}

	Runtime.prototype.initialize = function( _callback ){
	var self = this,
	markupData = [];

	for(var i = 0; i < 9999; i++){
	markupData.push({
	classes: 'alpha beta gamma',
	content: 'Lorem ipsum dolor sit amet consect et tetur'
	});
	}

	this.$jq.getScript("https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js", function(){
	$('aside').accordion();
	_callback.apply(self, [self.$jq, markupData]);
	});
	}

	Runtime.prototype.method1 = function( _value, _callback ){
	setTimeout(function(){ console.log('dependency1_resolved');
	_callback.apply(this, [{valIs:_value}]);
	}.bind(this), (Math.random() * 1000));
	};

	Runtime.prototype.method2 = function( _value, _callback ){
	var self = this;
	setTimeout(function(){ console.log('dependency2_resolved');
	_callback.apply(self, [{differntValIs:3}]);
	}, (Math.random() * 1000));
	};

	Runtime.prototype.method3 = function( _value, _callback ){
	setTimeout(function(){ console.log('dependency3_resolved');
	_callback.apply(this, [{valIs:_value['differntValIs'] *= 4}]);
	}.bind(this), (Math.random() * 1000));
	};

	Runtime.prototype.trackTime = function( _callback ){
	console.time('timeTracker');
	_callback();
	console.timeEnd('timeTracker');
	};

	return new Runtime();
	})();
	</script>
	<script type="text/javascript" src="./solutions.js"></script>
	</body>
	</html>