<!Doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>MV Admin</title>
		<?php echo HTML::style('administrator/css/bootstrap.css'); ?>
		<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
		<link rel="stylesheet" href="http://malihu.github.io/custom-scrollbar/3.0.0/jquery.mCustomScrollbar.min.css" />
		<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
		<?php echo HTML::style('administrator/css/ui.css'); ?>
		<?php echo HTML::style('administrator/css/scrollbar.css'); ?>
		<?php echo HTML::style('administrator/css/main.css'); ?>

		<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
		<script src="http://malihu.github.io/custom-scrollbar/3.0.0/jquery.mCustomScrollbar.concat.min.js"></script>
		<?php echo HTML::script('administrator/js/ui.min.js'); ?>
		<?php echo HTML::script('administrator/js/scrollbar.js'); ?>
		<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
		<?php echo HTML::script('administrator/js/main.js'); ?>
	</head>

	<body>


	<input type="hidden" class="base_url" value="<?php echo url(); ?>">

		<!-- Modal -->
		<div class="modal fade" id="modalForAutopilot" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">Autopilot</h4>
					</div>
					<div class="modal-body">
						All statuses will be approved. However, you will be able to archive any status from the playlist.
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
						<button type="button" class="btn btn-primary add-column">Approve and enable</button>
					</div>
				</div>
			</div>
		</div>

		<!-- Modal -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">New column</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal">
							<div class="form-group">
								<label for="select" class="col-lg-2 control-label">Social network</label>
								<div class="col-lg-10">
									<select class="form-control" id="select-social-network">
										<option value="1">Twitter</option>
										<option value="2">Instagram</option>
									</select>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail" class="col-lg-2 control-label">Hashtags</label>
								<div class="col-lg-10">
									<input autocomplete="off" class="form-control" id="input-hashtag" placeholder="#hash1,#hash2..." type="text">
								</div>
							</div>
							<div class="form-group has-error modal-error">
								<label class="col-lg-12 control-label"></label>
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
						<button type="button" class="btn btn-primary add-column">Add column</button>
					</div>
				</div>
			</div>
		</div>

		<!-- Menu -->
		<div class="left-menu">
			<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
				<span class="glyphicon glyphicon-plus"></span>
			</button>
			<a href="<?php echo url(); ?>/login" class="btn btn-default">
				<span class="glyphicon glyphicon-off"></span>
			</a>
		</div>

		<!-- Columns -->
		<div id="columns" class="">
			<div class="panel panel-primary playlist column col-sm-4" id = "column_playlist">
				<div class="panel-heading row">
					<div class="panel-heading-content">
						<div class="panel-heading-title">
							Playlist
							<span class="badge"></span>
						</div>
						<div class="dropdown pull-right">
							<a data-toggle="dropdown" href="#">
								<span class="icon-menu"></span>
							</a>
							<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
								<li><a class="archive-all-playlist" href="javascript:;"></span>Archive all</a></li>
								<li role="presentation" class="divider"></li>
								<li role="presentation" class="dropdown-header">Filter options</li>
								<li><a data-id="playlist" data-action="2" class="filter-options" href="javascript:;"></span>Show active</a></li>
								<li><a data-id="playlist" data-action="4" class="filter-options" href="javascript:;"></span>Show archived</a></li>
							</ul>
						</div>
					</div>
				</div>

				<div class="panel-body column-stauses-holder row"></div>
			</div>

			<div class="columns added_columns col-sm-8">
				<div class="scrolls row"></div>
			</div>
		</div>

	</body>
</html>
