cmcculloh/a.rb

## a.rb
		showLoading:  function showLoading(msg) {
			var loading = app.views.get('loading');
			if (typeof msg === "undefined") {
				msg = "Loading, please wait...";
			}

			//render to put new error message in there if already visible
			if (loading.isVisible) {
				loading.render();
			} else {//otherweise, show it
				loading.isVisible = true;
				app.loadingRegion.show(app.views.get('loading'));
				app.loadingRegion.$el.find(".progress .bar").width("100%");
			}
		},

		hideLoading:  function hideLoading() {
			var loading = app.views.get('loading');
			loading.isVisible = false;
			app.loadingRegion.close();
		},

## app.js
	app.addRegions({
		mainRegion: '#main',
		/*navRegion: '#nav',*/
		loadingRegion: '#loading'
	});

## index.hbs
<!DOCTYPE html>
<html lang="en" class="fuelux">
<head>
	<meta charset="utf-8">
	<title>App Center | Code@ExactTarget</title>
	<link href="vendor/fuelux/css/fuelux.css" rel="stylesheet">
	<link href="styles/global.css" rel="stylesheet">


	<!--link href="https://fuelcdn.com/fuelux-imh/2.3/css/fuelux.css" rel="stylesheet" /-->

	<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
	<![endif]-->

	<!--[if lte IE 9]>
	<script src="/vendor/json2.js" type="text/javascript"></script>
	<![endif]-->

	<script src="/vendor/zeroclipboard/ZeroClipboard.min.js"></script>
	<script src="vendor/require.js"></script>
	<script>
		ZeroClipboard.setDefaults( { moviePath: '/vendor/zeroclipboard/ZeroClipboard.swf' } );
		define('config', JSON.parse('{{{config}}}'));
		require(['javascripts/app/main']);
	</script>
</head>


<div id="loading"></div>

<div id="main"></div>


<script type="text/javascript">
piAId = '19122';
piCId = '13641';
(function() {
function async_load()
{ var s = document.createElement('script'); s.type = 'text/javascript'; s.src = ('https:' == document.location.protocol ? 'https://pi' : 'http://cdn') + '.pardot.com/pd.js'; var c = document.getElementsByTagName('script')[0]; c.parentNode.insertBefore(s, c); }
if(window.attachEvent)
{ window.attachEvent('onload', async_load); }
else
{ window.addEventListener('load', async_load, false); }
})();
</script>
</body>
</html>

## views_loading.js
define(function (require) {
	var Marionette = require('backbone.marionette');

	return Marionette.ItemView.extend({
		template: require('tmpl!templates/loading.html')
	});
});
	showLoading: function showLoading(msg) {
	var loading = app.views.get('loading');
	if (typeof msg === "undefined") {
	msg = "Loading, please wait...";
	}

	//render to put new error message in there if already visible
	if (loading.isVisible) {
	loading.render();
	} else {//otherweise, show it
	loading.isVisible = true;
	app.loadingRegion.show(app.views.get('loading'));
	app.loadingRegion.$el.find(".progress .bar").width("100%");
	}
	},

	hideLoading: function hideLoading() {
	var loading = app.views.get('loading');
	loading.isVisible = false;
	app.loadingRegion.close();
	},
	app.addRegions({
	mainRegion: '#main',
	/navRegion: '#nav',/
	loadingRegion: '#loading'
	});
	<!DOCTYPE html>
	<html lang="en" class="fuelux">
	<head>
	<meta charset="utf-8">
	<title>App Center \| Code@ExactTarget</title>
	<link href="vendor/fuelux/css/fuelux.css" rel="stylesheet">
	<link href="styles/global.css" rel="stylesheet">




	<!--link href="https://fuelcdn.com/fuelux-imh/2.3/css/fuelux.css" rel="stylesheet" /-->

	<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
	<![endif]-->

	<!--[if lte IE 9]>
	<script src="/vendor/json2.js" type="text/javascript"></script>
	<![endif]-->

	<script src="/vendor/zeroclipboard/ZeroClipboard.min.js"></script>
	<script src="vendor/require.js"></script>
	<script>
	ZeroClipboard.setDefaults( { moviePath: '/vendor/zeroclipboard/ZeroClipboard.swf' } );
	define('config', JSON.parse('{{{config}}}'));
	require(['javascripts/app/main']);
	</script>
	</head>


	<div id="loading"></div>

	<div id="main"></div>


	<script type="text/javascript">
	piAId = '19122';
	piCId = '13641';
	(function() {
	function async_load()
	{ var s = document.createElement('script'); s.type = 'text/javascript'; s.src = ('https:' == document.location.protocol ? 'https://pi' : 'http://cdn') + '.pardot.com/pd.js'; var c = document.getElementsByTagName('script')[0]; c.parentNode.insertBefore(s, c); }
	if(window.attachEvent)
	{ window.attachEvent('onload', async_load); }
	else
	{ window.addEventListener('load', async_load, false); }
	})();
	</script>
	</body>
	</html>
	define(function (require) {
	var Marionette = require('backbone.marionette');

	return Marionette.ItemView.extend({
	template: require('tmpl!templates/loading.html')
	});
	});