<?php 


Route::isJs(function(){
ob_start();
?>
<div>
	<div>
		<span class="avs-messageerrauth-msg"></span>
	</div>
	<div class="form-group avs">
		<label style="display:block" class="control-label">{{label || 'Login'}}</label>
		<div class="input-group">
			<span class="input-group-addon">
				<span class="glyphicon glyphicon-user"></span>
			</span>
			<input ng-required="required" type="text" class="form-control avs" name="login" placeholder="{{label || 'Login'}}">
		</div>
	</div>
</div>
<?php
$inputLogin=ob_get_clean();
ob_start();
?>
<div class="form-group avs">
	<label style="display:block" class="control-label">{{label || 'Login'}}</label>
	<div class="input-group" ng-if="glyphicon">
		<span class="input-group-addon">
			<span class="glyphicon glyphicon-{{glyphicon}}"></span>
		</span>
		<input autocompleteapi="{{autoCompleteApi}}" ng-blur="onblur({})" ng-required="required" ng-enter="onEnter({})" ng-change="ngChange()" type="{{type || 'text'}}" class="form-control avs" ng-model="ctrl.ngModel" name="{{name || 'name'}}" placeholder="{{placeholder || label || 'Login'}}">
	</div>
	<input autocompleteapi="{{autoCompleteApi}}" ng-blur="onblur({})" ng-required="required" ng-enter="onEnter({})" ng-change="ngChange()" ng-if="!glyphicon" type="{{type || 'text'}}" class="form-control avs" ng-model="ctrl.ngModel" name="{{name || 'name'}}" placeholder="{{placeholder || label || 'Login'}}">
</div>
<?php
$inputTxt=ob_get_clean();
ob_start();
?>
	<div class="form-group avs">
		<label style="display:block" class="control-label">{{label || 'Mot de passe'}}</label>
		<div class="input-group">
			<span class="input-group-addon">
				<span class="glyphicon glyphicon-lock"></span>
			</span>
			<input ng-required="required" type="password" class="form-control avs" name="password" placeholder="{{label || 'Mot de passe'}}">
		</div>
	</div>
<?php
$inputPassword=ob_get_clean();
ob_start();
?>
	<div class="form-group inputrememberme  avs">
		<input type="hidden" name="rememberme" value="{{ngModel}}">
		<md-checkbox ng-model="ngModel" style="padding: 6px 0;margin: 0" value="true" aria-label="{{label || 'Se souvenir de moi'}}">
			{{label || 'Se souvenir de moi'}}
		</md-checkbox>
		<style type="text/css">
			.inputrememberme .md-label > span{
				white-space: nowrap;
			}
		</style>
	</div>
<?php
$inputRememberme=ob_get_clean();
ob_start();
?>
<div>
	<div class="form-group avs">
		<button ng-click="dialog.show()" type="button" class="btn btn-link">{{label || 'Mot de passe oublié ?'}}</button>
	</div>
	<dialog ng-model="dialog" widget="fpwDialog" size="sm" titre="{{label || 'Mot de passe oublié ?'}}" api="fpw" btn-fermer="true" btn-valider="(dialog.data && dialog.data.sended)?false:true">
		<div ng-hide="dialog.data.sended">
			<div class="form-group avs">
				<label style="display:block" class="control-label">Email</label>
				<input type="email" class="form-control avs" name="email" required="" placeholder="Email">
			</div>
		</div>
		<div ng-show="dialog.data.sended">
			<div class="alert alert-success">
				<p>Nous vous avons envoyé un email de confirmation, veuillez consulter votre boite mail.</p>
			</div>
		</div>
	</dialog>
</div>
<?php
$inputFpw=ob_get_clean();
ob_start();
?>
	<div class="form-group avs">
		<button type="submit" class="btn btn-primary">{{label || 'Connecter'}}</button>
	</div>
<?php
$inputSubmit=ob_get_clean();
ob_start();
?>
<div>
	<style type="text/css">
		#facebook-connect{
			width: 1px;
			border-radius: 21%;
			margin: 0 6%;
			background-color: transparent !important;
		}
		#facebook-connect:hover{
			background-color: rgb(60, 90, 154) !important;
		}
		#google-connect{
			width: 1px;
			border-radius: 21%;
			margin: 0 6%;
			background-color: transparent !important;
		}
		#google-connect:hover{
			background-color: rgb(220, 74, 61) !important;
		}
		#twitter-connect{
			width: 1px;
			border-radius: 21%;
			margin: 0 6%;
			background-color: transparent !important;
		}
		#twitter-connect:hover{
			background-color: rgb(85, 172, 238) !important;
		}
	</style>
	<div style="display: flex;">
		<a ng-click="$root.authVia('Facebook')" class="social-button" id="facebook-connect"> <span></span></a>
		<a ng-click="$root.authVia('Google')" class="social-button" id="google-connect"> <span></span></a>
		<a ng-click="$root.authVia('Twitter')" class="social-button" id="twitter-connect"> <span></span></a>
	</div>
</div>
<?php
$inputSocial=ob_get_clean();

ob_start();
?>
<div>
	<style type="text/css">
		.tabsauth md-tabs-wrapper{
			display: none;
		}
	</style>
	<md-tabs md-dynamic-height class="tabsauth" md-selected="indextabauth" ng-init="indextabauth=0">
	  <md-tab label="Connecter">
		<form method="post" action="uauth">
			<input-login required="true"></input-login>
			<input-password required="true"></input-password>
			<input-rememberme></input-rememberme>
			<div style="display: flex;flex-wrap: wrap;justify-content: space-between;">
				<input-submit></input-submit>
				<input-fpw></input-fpw>
			</div>
			<div style="display: flex;align-items: center;">
				<hr style="flex:1">
				<span style="margin:10px;">OU Via</span>
				<hr style="flex:1">
			</div>
			<input-social></input-social>
			<div style="display: flex;flex-wrap: wrap;justify-content: center;align-items: center;border-top: 1px solid #ccc;margin-top: 15px;padding-top: 7px;">
				<span>Pas encore inscrit ?</span>
				<button type="button" class="btn btn-link" ng-click="indextabauth=1">S'inscrir</button>
			</div>
		</form>
	  </md-tab>
	  <md-tab label="S'inscrir">
			<form method="post" action="signup">
				<input-txt required="true" name="nom" label="Nom & Prénom" glyphicon="user"></input-txt>
				<input-txt required="true" name="email" label="Email" type="email" glyphicon="envelope"></input-txt>
				<input-txt required="true" name="login" label="Login" glyphicon="user"></input-txt>
				<input-txt required="true" name="password" label="Mot de passe" type="password" glyphicon="lock"></input-txt>
				<input-txt required="true" name="password_confirm" label="Confirmez mot de passe" type="password" glyphicon="lock"></input-txt>
				<div style="display: flex;flex-wrap: wrap;justify-content: space-between;">
					<input-submit label="S'inscrir"></input-submit>
					<div class="form-group avs">
						<button type="button" ng-click="indextabauth=0" class="btn btn-link">Connecter</button>
					</div>
				</div>
				<div style="display: flex;align-items: center;">
					<hr style="flex:1">
					<span style="margin:10px;">OU Via</span>
					<hr style="flex:1">
				</div>
				<input-social></input-social>
			</form>
	  </md-tab>
	</md-tabs>
</div>
<?php
$authForm=ob_get_clean();











ob_start();
?>
<div>
	<div>
		<div style="display: flex;margin-bottom: 5px;align-items: center;" ng-show="label">
			<label style="display:block;flex:1;margin:0;" class="control-label">{{label}}</label>
		</div>
		<div style="width: 100%;">
			<style type="text/css">
				.ui-select-bootstrap>.ui-select-choices, .ui-select-bootstrap>.ui-select-no-choice {
					position: absolute !important;
				}
			</style>
			<select ng-if="useSelectTag" class="form-control avs" ng-model="ngModel" ng-options="item as item.titre for item in data track by item.id">
			</select>
			<div ng-hide="useSelectTag" style="min-width: 150px;">
				<ui-select on-select="selectedelm($item, $model)" theme="bootstrap" style="display: block;width: 100%;box-shadow: rgb(160, 160, 160) 0px 0px 1px;">
				    <ui-select-match placeholder="{{placeholder}}">{{$select.selected.titre}}</ui-select-match>
				    <ui-select-choices style="min-height: 175px;position: relative;" refresh="loadData($select)" refresh-delay="100" repeat="item in data | filter: $select.search" ui-disable-choice="item.loading">
				      <div>
				      	<div ng-hide="item.loading" ng-bind-html="item.titre | highlight: $select.search"></div>
				      	<div ng-show="item.loading" style="padding: 5px 0;position: absolute;top: 0;left: 0;right: 0;bottom: 0;display: flex;align-items: center;justify-content: center;">
				      		<md-progress-circular md-mode="indeterminate"></md-progress-circular>
				      	</div>
				      </div>
				    </ui-select-choices>
				</ui-select>
			</div>
		</div>
	</div> 
</div>
<?php
$inputSelect=ob_get_clean();










ob_start();
?>
<div>
	<div style="display: flex;margin-bottom: 5px;align-items: center;" ng-show="label">
		<label style="display:block;flex:1;margin:0;" class="control-label">{{label}}</label>
	</div>
	<div style="width: 100%;">
		<upfile 
			ng-model="ngModel"
			max="{{max || '1'}}"
			height="{{height || '150'}}"
			width="{{width || '150'}}"
			dist="{{dist || 'upload'}}"
			titre="{{label || 'file'}}"
			accept="{{accept || 'image/*'}}"
			ext="jpg"
		></upfile>
	</div>
</div>
<?php
$inputFile=ob_get_clean();






?>
<script>
	app.directive('inputTxt', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputTxt) ?>,
			scope : {
				ngModel         : "=",
				label           : "@?",
				type            : "@?",
				name            : "@?",
				placeholder     : "@?",
				required        : "=?",
				glyphicon       : "@?",
				onEnter         : "&?",
				ngChange        : "&?",
				onblur          : "&?",
				autoCompleteApi : "@?"
			},
			controller: function($scope){
				$scope.ctrl = $scope;
			},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputFile', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputFile) ?>,
			scope : {
				ngModel     : "=",
				max         : "@?",
				label       : "@?",
				height      : "@?",
				width       : "@?",
				dist        : "@?",
				accept      : "@?"
			},
			controller: function($scope){
				$scope.ctrl = $scope;
			},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);




	app.directive('inputLogin', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputLogin) ?>,
			scope : {label:"@?",required : "=?"},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputPassword', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputPassword) ?>,
			scope : {ngModel:"=",label:"@?",required : "=?"},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputRememberme', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputRememberme) ?>,
			scope : {label:"@?"},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputFpw', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputFpw) ?>,
			scope : {label:"@?"},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputSubmit', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputSubmit) ?>,
			scope : {label:"@?"},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputSocial', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputSocial) ?>,
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('authForm', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($authForm) ?>,
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
	app.directive('inputSelect', [function () {
		return {
			restrict: 'E',
			template : <?= json_encode($inputSelect) ?>,
			scope : {ngModel:"=?",titre : "@?",join:"@?",api:"@",ngChange:"&?",empty:"@?",default:"=?",onitemchange:"=?",label:"@?"},
			controller : function($scope){
				$scope.loading = false;
				$scope.activeEmpty = true;
				$scope.useSelectTag = true;
				$scope.apiCall = function(data,callback){
					$scope.loading = true;
					api($scope.api,data,function(rep){
						$scope.loading = false;
						if(callback) callback(rep);
						$scope.$apply();
					});
				}
				$scope.selectedelm = function(item){
					if(item){
						$scope.ngModel = angular.copy(item);
					}
				}
				$scope.data = [];
				$scope.loadData = function($select){
					$scope.apiCall({join:$scope.join,q:$select?$select.search:''},function(rep){
						rep = rep || {};
						$scope.data = rep.data || [];
						$scope.useSelectTag = !!rep.useSelectTag;
						$scope.actDefault();
						$scope.injectEmptyValue();
						$scope.actDefault();
					});
				}
				$scope.injectEmptyValue = function(){
					for (var i = 0; i < $scope.data.length; i++) {
						if($scope.data[i].empty){
							$scope.data.splice(i,1);
						}
					}
					if ($scope.activeEmpty) {
						$scope.data.unshift({id:0,empty:true,titre : $scope.empty});
					}
				};
				$scope.$watch("activeEmpty",function(){
					$scope.injectEmptyValue();
				});
				$scope.injectEmptyValue();
				$scope.defaultValue = null;
				$scope.actDefault = function(){
					$scope.defaultValue = null;
					if (!$scope.default) {
						$scope.default = {id:0,empty:true,titre : $scope.empty};
					}
					if ($scope.default) {
						$scope.data.forEach(function(elm){
							if(elm.id+"" == $scope.default.id+""){
								$scope.defaultValue = angular.copy(elm);
								$scope.defaultValue.id = $scope.defaultValue.id*1;
								$scope.onitemchange();
							}
						});
					}
				}
				$scope.$watch("default",function(){
					$scope.actDefault();
				});
				$scope.onitemchange = function(){
					if ($scope.defaultValue && !$scope.ngModel) {
						if(!$scope.ngModel) $scope.ngModel = {};
						for(var x in $scope.defaultValue){
							if( (x+"")[0] != "$" ){
								$scope.ngModel[x] = angular.copy($scope.defaultValue[x]);
							}
						}
					}
				};
			},
			link: function (scope, iElement, iAttrs) {
				
			}
		};
	}]);
</script>
<?php
});































