<div class="b-page-form" ng-controller="userCtrl">
	<div class="container" ng-controller="userAddressCtrl">
		<div ng-include="'views/part/top-button.html?ver=4'"></div>

		<!--<ui-gmap-google-map center='map.center' zoom='map.zoom'></ui-gmap-google-map>-->

		<div class="row">
			<div class="col-xs-12">
				<h2 class="h-title title text-center">{{getLocale('Fill in the delivery address')}}</h2>
			</div>
		</div>
		<form action="#" ng-hide="loadMap || toMap"  name="userAddress" novalidate>
			<div class="row">
				<div class="col-sm-2 col-sm-offset-2 text-right">
					<div class="form-group">
						<label for="street-delivery">{{getLocale('City')}}<span class="star">*</span></label>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="form-group">
						<input id="street-delivery" type="text" class="h-full-width h-input" name="city" ng-model="addressDelivery.city"
							   ng-class="{ 'error-field': userAddress.city.$invalid && formValidAddress }" required />
						<p class="error-message error-message-field" ng-show="userAddress.city.$invalid && formValidAddress">{{getLocale('Error. Empty field')}}</p>
						<!--<select id="street-delivery" >-->
							<!--<option ng-repeat="item in cityArray" value="{{ item.id }}">{{ item.name }}</option>-->
						<!--</select>-->
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-2 col-sm-offset-2 text-right">
					<div class="form-group">
						<label for="city-delivery">{{getLocale('Street')}}<span class="star">*</span></label>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="form-group">
						<input id="city-delivery" type="text" class="h-full-width h-input" ng-model="addressDelivery.street" name="street"
							   ng-class="{ 'error-field': userAddress.street.$invalid && formValidAddress }" required />
						<p class="error-message error-message-field" ng-show="userAddress.street.$invalid && formValidAddress">{{getLocale('Error. Empty field')}}</p>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-2 col-sm-offset-2 text-right">
					<div class="form-group">
						<label for="house">{{getLocale('House')}}<span class="star">*</span></label>
					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<input type="text" value="" id="house"  ng-model="addressDelivery.house" class="h-full-width input h-input"
						ng-class="{ 'error-field': userAddress.house.$invalid && formValidAddress }" required name="house" />
						<p class="error-message error-message-field" ng-show="userAddress.house.$invalid && formValidAddress">{{getLocale('Error. Empty field')}}</p>
					</div>
				</div>
				<div class="col-sm-2 text-right">
					<div class="form-group">
						<label for="housing">{{getLocale('Housing-building')}}</label>
					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<input type="text" value="" id="housing" name="housing" ng-model="addressDelivery.housing" class="h-full-width input h-input" />
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-2 col-sm-offset-2 text-right">
					<div class="form-group">
						<label for="room">{{getLocale('Room')}}</label>
					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<input type="text" value="" id="room" name="room" ng-model="addressDelivery.room" class="h-full-width input h-input" />
					</div>
				</div>
				<div class="col-sm-2 text-right">
					<div class="form-group">
						<label for="porch">{{getLocale('Access')}}</label>
					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<input type="text" value="" id="porch" name="porch" ng-model="addressDelivery.porch" class="h-full-width input h-input" />
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-2 col-sm-offset-2 text-right">
					<div class="form-group">
						<label for="level">{{getLocale('Level')}}</label>
					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<input type="text" value="" id="level" name="level" ng-model="addressDelivery.level" class="h-full-width input h-input" />
					</div>
				</div>
				<div class="col-sm-2 text-right">
					<div class="form-group">
						<label for="intercom">{{getLocale('Intercom')}}</label>
					</div>
				</div>
				<div class="col-sm-2">
					<div class="form-group">
						<input type="text" value="" id="intercom" name="intercom" ng-model="addressDelivery.intercom" class="h-full-width input h-input" />
					</div>
				</div>
			</div>
			<div class="row" ng-show="userAddress.$invalid && formValidAddress">
				<div class="col-xs-8 col-xs-offset-4">
					<p class="error-message">{{ getLocale('Errors when filling in the form') }}</p>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-6 col-sm-offset-4">
					<div class="form-group">
						<a ng-class="{'disabled-btn': !userAddress.$valid }"
							   class="js-submit pull-right btn" ng-click="getToMap();">{{getLocale('Next')}}</a>

						<!-- saveInfoUser -->
 					</div>
				</div>
			</div>
		</form>

		<div class="b-load load-map" ng-show="loadMap">
			<div class="load-circle"></div>
			<p class="text-center">{{getLocale('Loading map')}}</p>
		</div>
 		<div class="row hidden-map" ng-class="{ 'show-map': toMap }">
			<div class="col-sm-8 col-sm-offset-2">
				<p class="map-title text-center">{{getLocale('Add a valid address, and keep shopping')}}</p>
				<div id="map" class="b-map support-load"></div>
			</div>
		</div>
		<div class="row row-button-map" ng-show="toMap">
			<div class="col-sm-8 col-sm-offset-2 col-xs-12">
				<p class="current-address">{{getLocale('Current address')}}: {{addressDelivery.fullAddress}}</p>
			</div>
		</div>
		<div class="row row-button-map" ng-show="toMap">
			<div class="col-sm-4 col-sm-offset-2 col-xs-5">
				<a href="javascript: void(0);" class="btn map-btn" ng-click="backToForm()">{{getLocale('Back')}}</a>
			</div>
			<div class="col-sm-4 col-xs-7 text-right">
				<a href="javascript: void(0);" class="btn map-btn"
				   ng-click="toSaveInfoDelivery('#/catalog', $event)">{{getLocale('Go to order')}}</a>
			</div>
		</div>
	</div>



</div>

