
{% load splunkmvc %}

<!DOCTYPE html>
<html>
	<head>
		<title>Splunk Application Framework Quick Start</title>
		<!-- Bootstrap -->
    	<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}splunkjs/css/bootstrap.css"/>
		<link href="{{STATIC_URL}}quickstartfx/css/style.css" rel="stylesheet" type="text/css" media="screen">
		<link href="{{STATIC_URL}}quickstartfx/css/prettify.css" rel="stylesheet" type="text/css" media="screen">
		<script type="text/javascript" src="{{STATIC_URL}}quickstartfx/js/prettify.js"></script>
		<script type="text/javascript" src="{{STATIC_URL}}quickstartfx/js/jquery-1.8.2.min.js"></script>
		
	</head>
	<body onload="prettyPrint();">
		<div id="splunk-bar"></div>
		<div id="container">
			<div class="progress-buttons">
				<a href="{% url 'quickstartfx:steps' id='addSearch' %}" class="btn btn-next btn-success">Next</a>
			</div>
			<h1>Splunk Application Framework Quick Start</h1>
			
			
			<div class="row" id="content-container">
				<div class="span23" id="main">
						<h2>Create an app</h2>
						<p>Let's create an app. We'll use the <b>splunkdj</b> command-line tool from the framework's home folder to perform this and other tasks.</p>
						<!-- <ul class="nav nav-tabs" id="main-tabs">
							<li class="active">
								<a href="#">Regular</a>
							</li>
							<li>
								<a href="#">splunkjs.Async</a>
							</li>
						</ul> -->
						<div class="well well-white" id="well-main">

							<h3>Create an app</h3>
							<p>To create an app, run the command <code>splunkdj createapp <i>app_name</i></code>. The framework sets up the basic directory structure and files for your app under the <b>$SPLUNKDJ_HOME/server/apps</b> directory. Your new app includes URL-routing logic, basic Django templates, views, and HTML templates.</p>
							
							<h3>Run apps</h3>
							<p>During development, run your apps from the development server that is included with the framework. Just start the framework server from the command line (<code>splunkdj run</code>), then browse to <i>http://localhost:3000/dj</i>. All of your installed framework apps are listed. Click one to run it.</p>

							<h3>Other command-line options</h3>
							<p>Command-line tools for app management include <code>setup</code>, <code>run</code>, <code>test</code>, <code>clean</code>, <code>createapp</code>, <code>removeapp</code>, and <code>deploy</code>.</p>
					
				</div>
				<div class="span9 offset1" id="sidebar">
					<div class="well well-white">
						<ul class="nav nav-list ">
							<li class="nav-header">Quick Start</li>
							<li class="active"><a href="{% url 'quickstartfx:steps' id='createApp' %}">Create an app</a></li>
							<li><a href="{% url 'quickstartfx:steps' id='addSearch' %}">Add a search</a></li>
							<li><a href="{% url 'quickstartfx:steps' id='addResultTable' %}">Add search results to table</a></li>
							<li><a href="{% url 'quickstartfx:steps' id='addMap' %}">Map your results</a></li>
							<li><a href="{% url 'quickstartfx:steps' id='addInteractivity' %}">Add interactivity</a></li>
							<li><a href="{% url 'quickstartfx:steps' id='nextSteps' %}">Next steps</a></li>
						</ul>
					</div>
				</div>
			</div>
			
			<div style="clear: both;"></div>
		</div>
		<div class="progress-buttons">
				<a href="{% url 'quickstartfx:steps' id='addSearch' %}" class="btn btn-next btn-success">Next</a>
			</div>
	 
	    {% component_loader %}
	</body>
</html>
