<?php

/* @var $this yii\web\View */
/* @var $form yii\bootstrap\ActiveForm */
/* @var $model app\models\ContactForm */

use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
use yii\captcha\Captcha;

$this->title = 'Контакты';
$this->params['breadcrumbs'][] = $this->title;

$this->registerCssFile('css/contact.css');
$this->registerJsFile('js/contact.js');
?>
<div class="contacts_wrapp-all">
<div class="contacts_wrapp-bg">
	<div class="contacts_bg_blocks-wr">
		<div class="contacts_bg_blocks">
			<div class="contacts_bg_blocks_cont">
				<p>Контакты</p>
			</div>
			<div class="contacts_bg_blocks_text-wr">
				<tr>
					<td>
						<table cellspacing="0" cellpadding="0" border="0" width="960">
							<tr>
								<td height="20"></td>
							</tr>
							<tr>
								<td align="center">
									<table cellpadding="0" cellspacing="0" border="0">
										<tr>
											<td valign="midle"><img style="vertical-align: middle" src="/images/ico-phone.png" alt=""/></td>
											<td width="10"></td>
											<td class="ico-phone-text">+38 (044) 593-73-76</td>
										</tr>
									</table>
								</td>
								<td align="center">
									<table cellpadding="0" cellspacing="0" border="0">
										<tr>
											<td valign="midle"><img style="vertical-align: middle" src="/images/ico-skype.png" alt=""/></td>
											<td width="10"></td>
											<td>
												<table cellspacing="0" cellpadding="0" border="0">
													<tr>
														<td class="ico-skype-text"><a style="color: #ffffff;font-size: 16px;font-family: arial;text-decoration: none; cursor: pointer" href="skype:artwebstudio">artwebstudio</a></td>
													</tr>
												</table>
											</td>
										</tr>
									</table>
								</td>
								<td align="center">
									<table cellpadding="0" cellspacing="0" border="0">
										<tr>
											<td valign="midle"><img style="vertical-align: middle" src="/images/ico-mail.png" alt=""/></td>
											<td width="10"></td>
											<td>
												<table cellspacing="0" cellpadding="0" border="0">
													<tr>
														<td class="ico-skype-text"><a style="cursor: pointer" href="mailto:m@arweb.ua">m@arweb.ua</a></td>
													</tr>
												</table>
											</td>
										</tr>
									</table>
								</td>
							</tr>
						</table>
					</td>
				</tr>
			</div>
		</div>
	</div>
</div>
<div class="contacts-help-wr-all">
	<div class="contacts-help-wr">
		<div class="contacts-wrapper-all">
			<div class="contacts-wrapper">
				<div class="block-title">
					<h2 style="color: #1d275b">Готовы помочь</h2>
					<p style="height: 10px;"></p>
					<img src="http://artweb.ua/wp-content/themes/artweb_home/images14/portfolio.png" width="181" height="16">
				</div>
				<div class="contacts-link-wr">
					<div class="contacts-link">
						<p>
							Связывайтесь с руководителями напрямую,</br>
							если у вас действительно "горящий" вопрос.
						</p>
					</div>
					<div class="contacts-link-shadow"></div>
				</div>
				<div class="contacts-fotos-wr">
					<div class="contacts-fotos">
<!--						<img src="/images/foto-1.jpg"/>-->
					</div>
					<div class="contacts-fotos-two">
						<div class="contacts-foto-office">
							<table cellpadding="0" cellspacing="0" border="0" width="412">
								<tr>
									<td>
										<table cellspacing="0" cellpadding="0" border="0" width="412">
											<tr>
												<td class="contacts-foto-office-tx" align="left">Менеджер по работе</br>с ключевыми клиентами</td>
												<td class="contacts-foto-office-tx" align="right">Директор по маркетингу</td>
											</tr>
										</table>
									</td>
								</tr>
								<tr>
									<td>
										<table cellpadding="0" cellspacing="0" border="0" width="412">
											<tr>
												<td align="left" width="206">
													<table class="table-two-contacts" cellspacing="0" cellpadding="0" border="0">
														<tr>
															<td valign="middle"><img src="/images/mail-cont.jpg"/></td>
															<td width="10"></td>
															<td id="cont_m1" class="contacts_m1 contacts_m_active">Алексей Марек</td>
														</tr>
													</table>
												</td>
												<td align="right" width="206">
													<table class="table-two-contacts" cellspacing="0" cellpadding="0" border="0">
														<tr>
															<td valign="middle"><img src="/images/mail-cont.jpg"/></td>
															<td width="10"></td>
															<td id="cont_m2" class="contacts_m1">Антон Зозуля</td>
														</tr>
													</table>
												</td>
											</tr>
										</table>
									</td>
								</tr>
							</table>
						</div>
						<div class="contacts-foto-form">
							<div class="contacts-form-arrow"></div>
							<form action="POST" id="jform" class="form_alex">
								<input type="text" id="fullname" name="" placeholder="Имя" />
								<input type="text" id="email" name="" placeholder="E-mail" />
								<textarea name=""  id="about" placeholder="Текст сообщения"></textarea>
								<div class="contacts-form-buttons">
									<input type="submit" id="send" value="Отправить"/>
								</div>
							</form>
							<form action="POST" id="jform-two" class="form_anton">
								<input type="text" id="fullname-two" name="" placeholder="Имя" />
								<input type="text" id="email-two" name="" placeholder="E-mail" />
								<textarea name=""  id="about-two" placeholder="Текст сообщения"></textarea>
								<div class="contacts-form-buttons">
									<input type="submit" id="send-two" value="Отправить"/>
								</div>
							</form>
						</div>
					</div>
					<div class="contacts-fotos">
<!--						<img src="/images/foto-2.jpg"/>-->
					</div>
				</div>
			</div>
		</div>
		<div class="contacts-help-shadow-wr">
			<div class="contacts-help-shadow"></div>
		</div>
	</div>
</div>
<div class="contacts-street-wr">
	<div class="contacts-wrapper-all">
		<div class="contacts-wrapper">
			<div class="block-title">
				<h2 style="color: #1d275b">Адрес</h2>
				<p style="height: 10px;"></p>
				<img src="http://artweb.ua/wp-content/themes/artweb_home/images14/portfolio.png" width="181" height="16">
			</div>
			<div class="contacts-adress">
				<tr>
					<td align="center">
						<table class="contacts-adress-tb" cellpadding="0" cellspacing="0" border="0">
							<tr>
								<td>
									<table cellspacing="0" cellpadding="0" border="0" width="500">
										<tr>
											<td align="center">Наш офис находится по адресу:</td>
										</tr>
									</table>
								</td>
							</tr>
							<tr>
								<td height="10"></td>
							</tr>
							<tr>
								<td align="center">
									<table cellspacing="0" cellpadding="0" border="0">
										<tr>
											<td><img style="vertical-align: middle;" src="/images/ico_adress.png"/></td>
											<td width="10"></td>
											<td>г. Киев, ул. Срибнокольская, 2а, офис 81а </td>
										</tr>
									</table>
								</td>
							</tr>
						</table>
					</td>
				</tr>
			</div>
			<div class="contacts-fotka-wr">
				<div class="contacts-fotka"></div>
			</div>
		</div>
	</div>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" charset="utf-8"></script>
<script>
	$(document).ready(function(){
		var jVal = {
			'fullName' : function() {
				var ele = $('#fullname');
				if(ele.val().length < 2) {
					jVal.errors = true;
					ele.removeClass('normal').addClass('wrong');
				} else {
					ele.removeClass('wrong').addClass('normal');
				}
			},
			'email' : function() {
				var ele = $('#email');
				var patt = /^.+@.+[.].{2,}$/i;
				if(!patt.test(ele.val())) {
					jVal.errors = true;
					ele.removeClass('normal').addClass('wrong');
				} else {
					ele.removeClass('wrong').addClass('normal');
				}
			},
			'about' : function() {
				var ele = $('#about');
				if(ele.val().length < 5) {
					jVal.errors = true;
					ele.removeClass('normal').addClass('wrong').css({'font-weight': 'normal'});
				} else {
					ele.removeClass('wrong').addClass('normal');
				}
			},
			'sendIt' : function (){
				if(!jVal.errors) {
					$('#jform').submit();
				}
			}
		};
// ====================================================== //
		$('#send').click(function (){
			var obj = $.browser.webkit ? $('body') : $('html');
			obj.animate({ scrollTop: $('#jform').offset().top -65 }, 750, function (){
				jVal.errors = false;
				jVal.fullName();
				jVal.email();
				jVal.about();
				jVal.sendIt();
			});
			return false;
		});
		$('#fullname').change(jVal.fullName);
		$('#email').change(jVal.email);
		$('#about').change(jVal.about);
	});
</script>
<script>
	$(document).ready(function(){
		var jVal = {
			'fullName' : function() {
				var ele = $('#fullname-two');
				if(ele.val().length < 2) {
					jVal.errors = true;
					ele.removeClass('normal').addClass('wrong');
				} else {
					ele.removeClass('wrong').addClass('normal');
				}
			},
			'email' : function() {
				var ele = $('#email-two');
				var patt = /^.+@.+[.].{2,}$/i;
				if(!patt.test(ele.val())) {
					jVal.errors = true;
					ele.removeClass('normal').addClass('wrong');
				} else {
					ele.removeClass('wrong').addClass('normal');
				}
			},
			'about' : function() {
				var ele = $('#about-two');
				if(ele.val().length < 5) {
					jVal.errors = true;
					ele.removeClass('normal').addClass('wrong').css({'font-weight': 'normal'});
				} else {
					ele.removeClass('wrong').addClass('normal');
				}
			},
			'sendIt' : function (){
				if(!jVal.errors) {
					$('#jform-two').submit();
				}
			}
		};
// ====================================================== //
		$('#send-two').click(function (){
			var obj = $.browser.webkit ? $('body') : $('html');
			obj.animate({ scrollTop: $('#jform-two').offset().top }, 750, function (){
				jVal.errors = false;
				jVal.fullName();
				jVal.email();
				jVal.about();
				jVal.sendIt();
			});
			return false;
		});
		$('#fullname-two').change(jVal.fullName);
		$('#email-two').change(jVal.email);
		$('#about-two').change(jVal.about);
	});
</script>

