energylink/public/app/partials/playlist.html

<div ng-controller="PlaylistCtrl" ng-init="init()">
	<div class="gf-box-header">
		<div class="gf-box-title">
			<i class="fa fa-play"></i>
			Start dashboard playlist
		</div>

		<button class="gf-box-header-close-btn" ng-click="dismiss();">
			<i class="fa fa-remove"></i>
		</button>

	</div>

	<div class="gf-box-body">
		<div class="row-fluid" style="margin-bottom: 10px;">
			<div class="span12">
				<div style="display: inline-block">
					<div class="tight-form last">
						<ul class="tight-form-list">
							<li class="tight-form-item">
								Search
							</li>
							<li>
								<input type="text" class="tight-form-input input-xlarge last" ng-model="searchQuery" placeholder="query or empty for starred" ng-change="search()">
							</li>
						</ul>
						<div class="clearfix"></div>
					</div>
				</div>
			</div>
		</div>

		<div class="row-fluid">
			<div class="span6">
				<h5>Search result</h5>
				<table class="grafana-options-table">
					<tr ng-repeat="dashboard in filteredHits">
						<td style="white-space: nowrap;">
							{{dashboard.title}}
						</td>
						<td style="text-align: center">
							<button class="btn btn-inverse btn-mini pull-right" ng-click="addDashboard(dashboard)">
								<i class="fa fa-plus"></i>
								Add to playlist
							</button>
						</td>
					</tr>
					<tr ng-hide="searchHits.length">
						<td colspan="2">
							<i class="fa fa-warning"></i> No dashboards found
						</td>
					</tr>
				</table>
			</div>
			<div class="span6">
				<h5>Playlist dashboards</h5>

				<table class="grafana-options-table">
					<tr ng-repeat="dashboard in playlist">
						<td style="white-space: nowrap;">
							{{dashboard.title}}
						</td>
						<td style="text-align: center">
							<button class="btn btn-inverse btn-mini pull-right" ng-click="removeDashboard(dashboard)">
								<i class="fa fa-remove"></i>
							</button>
						</td>
					</tr>
					<tr ng-hide="playlist.length">
						<td colspan="2">
							Playlist empty
						</td>
					</tr>
				</table>
			</div>
		</div>

		<br>
		<br>
		<div class="pull-left">
			<div class="tight-form last">
				<ul class="tight-form-list">
					<li class="tight-form-item">
						Timespan between dashboard change
					</li>
					<li>
						<input type="text" class="tight-form-input input-small" ng-model="timespan" />
					</li>
					<li>
						<button class="btn btn-success tight-form-btn" ng-click="start();dismiss();"><i class="fa fa-play"></i> Start</button>
					</li>
				</ul>
				<div class="clearfix"></div>
			</div>
		</div>

		<div class="clearfix"></div>

	</div>
</div>