<script type="text/ng-template" id="templates/modals/call-link-job.html">
	@include('templates.modals.call-link-job')
</script>

<script type="text/ng-template" id="templates/modals/call-popup.html">
	@include('templates.modals.call-popup')
</script>

<script type="text/ng-template" id="templates/modals/chat-popover.html">
	@include('chat::templates.chat-popover')
</script>

<script type="text/ng-template" id="templates/modals/new-channel.html">
	@include('chat::templates.new-channel')
</script>

<script type="text/ng-template" id="templates/modals/file-upload.html">
	@include('chat::templates.file-upload')
</script>

<script type="text/ng-template" id="reminders/popover.html">
	@include('reminders::templates.popover')
</script>

<script type="text/ng-template" id="reminders/modals/reminder.html">
	@include('reminders::templates.modals.reminder')
</script>

<script type="text/ng-template" id="templates/notifications-popover.html">
	@include('templates.notifications-popover')
</script>

<script type="text/ng-template" id="templates/quick-task-popover.html">
	<div quick-task users="users" on-create="hide()" data-open="show()"></div>
</script>

<script type="text/ng-template" id="templates/quick-task.html">
	@include('templates.quick-task')
</script>
<!-- sv -->
<div id="sidebar" class="task-beta" ng-controller="SidebarCtrl" ng-init="user = {{ Auth::user() }}" ng-cloak>
	<div id="sidebar-user">
		<div class="pull-left">
			<img src="{!! Auth::user()->profile_photo_url !!}" alt="Profile Photo" title="{!! Auth::user()->name !!}">
		</div>
		<div class="user_info">
			<h4>{!! Auth::user()->name !!}</h4>
			<div class="dropdown pull-right">
				<a href="#" data-toggle="dropdown" style="color: #FFFFFF; text-decoration: none;" data-eat-click>
					<i class="fa fa-chevron-down" style="margin-top: 3px; margin-right: 5px;" ></i>
				</a>
				<ul class="dropdown-menu">
					<li><a href="#" ng-click="showSettings()" eat-click><i class="fa-fw fa fa-user"></i> Edit Profile</a></li>
					<li class="divider"></li>
					<li lunch></li>
					<li clock-in-out></li>
					<li><a href="{!! URL::to('hr') !!}"><i class="fa-fw fa fa-calendar"></i> View your times</a></li>
					<li class="divider"></li>
					<li><a href="{!! URL::to('logout') !!}"><i class="fa-fw fa fa-sign-out"></i> Logout</a></li>
				</ul>
			</div>
			<h5><small><span clocking-status></span></small></h5>
		</div>
	</div>

	<div id="sidebar-channels">

		<div class="nano" data-nanoscroller>
			<div class="nano-content">
				@if (env('BETA_MODE')) 
				<div class="alert alert-danger text-center">
					<h1>Beta Site</h1>
					<p>This is the beta site for test, things will break <p>
				</div>
				@endif
				<div class="alert alert-warning text-center" ng-show="notifications.isSupported && !notifications.hasPermission()">
					<a href="#" style="color: #333;" ng-click="notifications.requestPermission()"><small><i class="fa fa-info-circle"></i> Enable desktop notifications</small></a>
				</div>

				<!-- Initialise the controller that deals with phone calls -->
				<!-- <div class="channel-group" ng-controller="CallsSidebarCtrl"></div> -->

				<div ng-controller="ChatMainCtrl" ng-init="current_user = {{ Auth::user() }}">
					<div class="channel-group">
						<div class="channels_header">
							Channels
						</div>
						<ul class="chat-channels">
							<li ng-class="{active: channel.selected}" ng-repeat="channel in channels | filter:{public: 1}" uib-popover-template="'templates/modals/chat-popover.html'" popover-placement="left" popover-append-to-body="true" ng-controller="ChatChannelCtrl" ng-click="openChannel(channel)"># <span ng-bind="::channel.tag"></span> <span class="badge badge-important pull-right" ng-show="channel.notifications > 0" ng-bind="channel.notifications"></span></li>
						</ul>
					</div>

					<div class="channel-group">
						<div class="channels_header">
							Private Messages
						</div>
						<ul class="chat-channels">
							<li ng-repeat="user in users | orderBy:['online', 'name']" ng-class="::{active: user.selected}" ng-show="user.online || (show_offline && !user.online) || user.notifications > 0" uib-popover-template="'templates/modals/chat-popover.html'" popover-placement="left" popover-append-to-body="true" ng-controller="ChatPrivateCtrl" ng-click="openPrivate(user)">
								<small>
									<i class="fa-fw fa fa-circle" ng-class="getStatusClass(user)"></i>
								</small> <span ng-bind="::user.name"></span> <small ng-if="user.idle" class="muted">idle</small>
								<span class="badge badge-important pull-right" ng-show="user.notifications > 0" ng-bind="user.notifications"></span>
								<span class="pull-right dial-options" >
									<a href="#" data-ng-if="::user.mobile.length > 0" ng-click="dialer.dial(user.mobile, 'mobile')" data-eat-propagation=""><i class="fa fa-mobile" uib-tooltip="{[{ ::user.mobile }]}"></i></a>
									<a href="#" data-ng-if="::user.extension" ng-click="dialer.dial(user.extension, 'mobile')" data-eat-propagation=""><i class="fa fa-phone" uib-tooltip="{[{ ::user.extension }]}"></i></a>
								</span>
							</li>
							<li ng-hide="show_offline"><a href="#" ng-click="show_offline = true;" data-eat-click><small>Show offline users</small></a></li>
							<li ng-show="show_offline"><a href="#" ng-click="show_offline = false;" data-eat-click><small>Hide offline users</small></a></li>
						</ul>
					</div>

					<div class="channel-group">
						<div class="channels_header">
							Private Channels
						</div>
						<ul class="chat-channels">
							<li ng-class="{active: channel.selected}" ng-repeat="channel in channels | filter:{public: 0}" uib-popover-template="'templates/modals/chat-popover.html'" popover-placement="left" popover-append-to-body="true" ng-controller="ChatChannelCtrl" ng-click="openChannel(channel)"># <span ng-bind="::channel.tag"></span> <span class="badge badge-important pull-right" ng-show="channel.notifications > 0" ng-bind="channel.notifications"></span></li>
							<li><a href="#" ng-click="newChannel()" data-eat-click><small>Create a new channel</small></a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div id="tech-docs">
		<div class="channels_header">Useful Documents</div>
		<a href="{!! URL::route('docs.general-repairs-guidelines') !!}"><i class="fa fa-file"></i> &nbsp;General Repair Guidelines</a> <br>
		<a href="{!! URL::route('docs.new-machine-checklist') !!}"><i class="fa fa-file"></i> &nbsp;New Machine Checklist</a> <br>
		<a href="{!! URL::route('docs.technician-pricing-and-warranty') !!}"><i class="fa fa-file"></i> &nbsp;Technician Pricing and Warranty</a>
		<a href="{!! URL::asset('/files/QA_Repairs.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;QA Repairs</a>
		<a href="{!! URL::asset('/files/QA_New_Builds.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;QA New Builds</a>
		<a href="{!! URL::asset('/files/Antivirus-Anti malware Guide.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;Antivirus and Anti malware Guide</a>
		<a href="{!! URL::asset('/files/Laptop Screen Replacement, Diagnosis and Repair.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;Laptop Screen Replacement  Diagnosis and Repair</a>
		<a href="{!! URL::asset('/files/Liquid Damage Repairs.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;Liquid Damage Repairs</a>
		<a href="{!! URL::asset('/files/Standard Repair Operating Procedure.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;Standard Repair Operating Procedure</a>
		<a href="{!! URL::asset('/files/Windows Reinstall Procedure.pdf') !!}" target="_blank" style="display: block;"><i class="fa fa-file"></i> &nbsp;Windows Reinstall Procedure</a>
	</div>

	<div id="sidebar-tabs" ng-cloak>
		<div class="sidebar-tab" data-notification uib-popover-template="'templates/notifications-popover.html'" ng-click="markAsRead()" popover-placement="top">
			<i class="fa fa-bell"></i>
			<span class="label label-danger notification" ng-if="unread > 0">{[{ unread }]}</span>
		</div>
		{{-- <div class="sidebar-tab" data-reminders bs-popover="'reminders/popover.html'" data-placement="top" data-container="#sidebar" data-unique="1">
			<i class="fa fa-lightbulb-o"></i>
			<span class="badge badge-important notification" ng-if="notifications > 0">{[{ notifications }]}</span>
		</div> --}}
		<div class="sidebar-tab" data-unique='1' popover-placement="top" uib-popover-template="'templates/quick-task-popover.html'" ng-init="users = {{ App\Models\User::getActiveList() }}">
			<i class="fa fa-clock-o"></i> <i class="fa fa-plus"></i>
		</div>

		<a style="color:white; display: block;" href="changelog" target="_blank">
			<div class="sidebar-tab" data-unique='1' data-placement="top" data-container="#sidebar">
				<i class="fa fa-code-fork"></i>
			</div>
		</a>
	</div>
</div>
