@extends('layouts.'.((Session::get('user')->CurrentRole === 'Firm Admin')?'admin':'filer').'-dashboard')
@section('headcss')
<!--<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">-->
<link type='text/css' rel="stylesheet" href="/css/dropzone.css" />
<link type='text/css' rel="stylesheet" href="/css/ng-grid.css" />
@stop
@section('content')
<form action="cabinet/upload"
      class="dropzone"
      id="my-awesome-dropzone"></form>
<div id="my_cabinet" class="dashboardTable" ng-controller='cabinetCtrl'>

	<div class="DocumentTable gridStyle" ng-grid="gridOptions"></div>

	<div class="popupWrapper customPopWidth popup_delete">
		<div class="popupContent">
			<img src="/images/modal_close.png"  class="closePopup" alt="close">
			<div class="popupBody">
				<div class="centerstyle" style="text-align:center">
					<p id="popup_small_text" class="mb35">Are your sure you want to delete the service contact?</p>
					<p>
						<a href="#" class="btn btn-medium" id="confirmdelete" style="margin-left:15px">Yes</a>&nbsp;&nbsp;
						<a href="#" class="btn btn-medium delete_closebtn" style="margin-left:15px">No</a>&nbsp;&nbsp;
					</p>
				</div>
			</div>
		</div>
	</div>

	<div id="edit_popup" class="popupWrapper customPopWidth popup_response">
		<div class="popupContent">
<!--			<img src="/images/modal_close.png"  class="closePopup" alt="close">-->
			<div class="popupBody">
				<form id="cabinet_edit" class="cabinet_edit">					
					<input type="hidden" ng-model="cabedit.entity.id" name="filingCabinetId" value="[[cabedit.entity.id]]" />
					<label for="filename">File Name</label>
					<input type="text" ng-model="cabedit.entity.file_name" readonly />
					<label for="description">Description</label>
					<input type="text" ng-model="cabedit.entity.description" name="description" />
					<label for="description">Client Matter</label>
					<input type="text" ng-model="cabedit.entity.client_matter" name="client_matter" />
					<input type="button" value="Save" ng-click="cabinet_save(cabedit.entity)"/>
					<input type="button" value="Cancel" ng-click="cabinet_cancel()" />
				</form>
			</div>
		</div>
	</div>
	@stop
	@section('scripts_bottom')

	<script src="/js/jquery.validate.min.js"></script>
	<script src="/js/additional-methods.min.js"></script>
	<script type="text/javascript" src='/js/servicecontact.js?@assetsVersion()'></script>
	<script type="text/javascript" src='/js/dropzone.min.js'></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular-resource.min.js"></script>
	<script type="text/javascript" src="/js/ng-grid-2.0.7.min.js"></script>
	<script type="text/javascript">
		window.MFR = window.MFR || {};
		angular.module('MFR', ['ngGrid'], function($interpolateProvider) {
			$interpolateProvider.startSymbol('[[');
			$interpolateProvider.endSymbol(']]');
		}).value('cabinetUrl', MFR.siteConfig.base_url + '/cabinet')
				.factory('Cabinets', function(cabinetUrl) {
			var cabinetCollection = [];
			$.ajax({
				type: 'GET',
				dataType: 'json',
				url: cabinetUrl,
				async: false,
				success: function(data) {
					cabinetCollection = data;
				}
			});
			return cabinetCollection;
		});
		function cabinetCtrl($scope, Cabinets, $filter, $http, cabinetUrl) {
			$scope.cabinet = Cabinets.data;
			$scope.totalServerItems = Cabinets.count;
			$scope.editableInPopup = '<ul class="cabinet-tab_action"><li><a href="#[[cabinet.id]]" class="edit_ac" ng-click="edit(row)" ></a></li><li> <a ng-click="cab_delete(row)" href = "#[[cabinet.id]]" class = "delete_acc"> </a></li ></ul>';
			$scope.pagingOptions = {
				pageSizes: [5, 10, 25, 50],
				pageSize: 10,
				currentPage: 1
			};
			$scope.edit = function edit(row) {
				console.log(row);
				$scope.cabedit = row;
				$('#edit_popup').show();
			};
			$scope.cabinet_save = function cabinet_save(cabinet) {
				$('#edit_popup').hide();
				var sdata = $('#cabinet_edit').serialize();
				$.ajax({
					type: 'post',
					dataType: 'json',
					url: cabinetUrl,
					data: sdata,
					beforeSend: function(request) {
						$('.loader').show();
						$('.overlay').show();
					},
					success: function(data) {
						$('.loader').hide();
						$('.overlay').hide();
						alert(data.message);
					}
				});
			};
			$scope.cabinet_cancel = function cancel() {
				$('#edit_popup').hide();
			};
			$scope.cab_delete = function cab_delete(row) {
				$.ajax({
					type: 'DELETE',
					dataType: 'json',
					url: cabinetUrl + '/' + row.entity.id,
					beforeSend: function(request) {
						$('.loader').show();
						$('.overlay').show();
					},
					success: function(data) {
						$('.loader').hide();
						$('.overlay').hide();
						alert(data.message);
						$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);
					}

				});
			};

			$scope.setPagingData = function(data, page, pageSize) {
				$scope.cabinet = data;
				if (!$scope.$$phase) {
					$scope.$apply();
				}
			};
			$scope.getPagedDataAsync = function(pageSize, page) {
				setTimeout(function() {
					var start = (page - 1) * pageSize;
					var limit = pageSize;
					$http.get(cabinetUrl + '?start=' + start + '&limit=' + limit).success(function(largeLoad) {
						$scope.setPagingData(largeLoad.data, page, pageSize);
					});
				}, 100);
			};

			$scope.$watch('pagingOptions', function(newVal, oldVal) {
				//console.log(newVal);pageSize
				if (newVal !== oldVal) {
					$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);
				}
			}, true);
			$scope.$watch('filterOptions', function(newVal, oldVal) {
				if (newVal !== oldVal) {
					$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);
				}
			}, true);
			$scope.gridOptions = {
				data: 'cabinet',
				columnDefs: [{field: 'file_name', displayName: 'Document File Name'}, {field: 'description', displayName: "Description"}, {field: 'client_matter', displayName: 'Client Matter'}, {displayName: 'Actions', cellTemplate: $scope.editableInPopup}],
				enablePaging: true,
				showFooter: true,
				totalServerItems: 'totalServerItems',
				showGroupPanel: true,
				multiSelect: false,
				selectedItems: [],
				pagingOptions: $scope.pagingOptions,
				filterOptions: $scope.filterOptions
			};
		}

		$(function() {
			Dropzone.options.myAwesomeDropzone = {
				paramName: "file_upload", // The name that will be used to transfer the file
				maxFilesize: 35, // MB
				init: function() {
					this.on('success', function(file, response) {
						if (response.error == false) {
							$('#my_cabinet').scope().getPagedDataAsync(10, 1);
						} else {
							file.previewElement.classList.add("dz-error");
							return file.previewElement.querySelector("[data-dz-errormessage]").textContent = response.message;
						}
					});
				}
			};
		});



	</script>

	@stop