316 lines
13 KiB
PHP
316 lines
13 KiB
PHP
<? \S::set_session( 'modal-token', bin2hex( random_bytes( 32 ) ) );?>
|
|
<div class="box-popup">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<!-- first section -->
|
|
<div class="modal-container modal-step-1">
|
|
<div class="modal-close">
|
|
<img src="./images/popup/close-icon.png" alt="close">
|
|
</div>
|
|
<div class="modal-step-1-wrap">
|
|
<div class="box-left box-col">
|
|
<div class="title-text">
|
|
<span>szybki</span>
|
|
<span class="white-title">kontakt</span>
|
|
</div>
|
|
<span class="subtitle-text">
|
|
skontaktuj się z nami >
|
|
</span>
|
|
</div>
|
|
<div class="box-right box-col">
|
|
<div class="title-text">
|
|
<span>wycena na podstawie</span>
|
|
<span class="yellow-title">projektu</span>
|
|
</div>
|
|
<span class="subtitle-text">
|
|
Chcę dodać pliki >
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- second section -->
|
|
<div class="modal-container modal-step-2">
|
|
<div class="modal-close">
|
|
<img src="./images/popup/close-icon.png" alt="close">
|
|
</div>
|
|
<div class="modal-step-2-wrap">
|
|
<div class="modal-tabs">
|
|
<div class="item active">
|
|
Znajdź najbliższy salon
|
|
</div>
|
|
<!-- <div class="item">
|
|
Telefon naszego doradcy
|
|
</div> -->
|
|
</div>
|
|
<div class="modal-tabs-content">
|
|
<div class="content-1">
|
|
<div class="phone-col">
|
|
<div class="item item-gray">
|
|
<span>Rudna Mała 75/k. Rzeszowa</span>
|
|
<a href="tel:+48178595671">+48 17 859 56 71</a>
|
|
</div>
|
|
<div class="item">
|
|
<span>Kraków</span>
|
|
<a href="tel:0048124159549">+48 12 415 95 49</a>
|
|
</div>
|
|
<div class="item item-gray">
|
|
<span>Przemyśl</span>
|
|
<a href="tel:+48166760227">+48 16 676 02 27</a>
|
|
</div>
|
|
<div class="item">
|
|
<span>Łańcut</span>
|
|
<a href="tel:+48172252645">+48 17 225 26 45</a>
|
|
</div>
|
|
<div class="item item-gray">
|
|
<span>Krosno</span>
|
|
<a href="tel:0048134327311">+48 13 432 73 11</a>
|
|
</div>
|
|
</div>
|
|
<div class="phone-col">
|
|
<div class="item item-gray">
|
|
<span>Rzeszów</span>
|
|
<a href="tel:+48178539362">+48 17 853 93 62</a>
|
|
</div>
|
|
<div class="item">
|
|
<span>Sanok</span>
|
|
<a href="tel:0048134640338">+48 13 464 03 38</a>
|
|
</div>
|
|
<div class="item item-gray">
|
|
<span>Tarnobrzeg</span>
|
|
<a href="tel:0048609668375">+48 609 668 375</a>
|
|
</div>
|
|
<div class="item">
|
|
<span>Zakopane</span>
|
|
<a href="tel:0048661804867">+48 661 804 867</a>
|
|
</div>
|
|
<div class="item item-gray">
|
|
<span>Nowy Targ</span>
|
|
<a href="tel:0048511 071 485">+48 511 071 485</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="content-2">
|
|
<div class="title">
|
|
Doradca salonu sprzedaży
|
|
<span>MAŁGORZATA BRZYCKA</span>
|
|
</div>
|
|
<a class="mail" href="mailto:m.brzycka@vidok.com">
|
|
m.brzycka@vidok.com
|
|
</a>
|
|
<a href="tel:0048178595671" class="phone">TEL: +48 17 85 95 671</a>
|
|
</div>
|
|
</div>
|
|
<div class="step-back">
|
|
<button class="step-prev-to-quick-form2">< Powrót</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- third section -->
|
|
<div class="modal-container modal-step-3">
|
|
<div class="modal-close">
|
|
<img src="./images/popup/close-icon.png" alt="close">
|
|
</div>
|
|
<div class="modal-step-3-wrap">
|
|
<form method="POST" action="" enctype="multipart/form-data" id="modal-contact-form">
|
|
<input type="hidden" name="action" value="send-contact-modal">
|
|
<input type="hidden" name="token" value="<?= \S::get_session( 'modal-token' );?>">
|
|
<input type="hidden" name="website" value="">
|
|
|
|
<p class="form-title">Wypełnij formularz</p>
|
|
<div class="form-row justify-content-center">
|
|
<input type="text" name="name" size="40" placeholder="Imię" required>
|
|
<input type="email" name="email" size="40" placeholder="Adres e-mail" required>
|
|
</div>
|
|
<div class="form-row justify-content-center">
|
|
<input type="text" name="phone" size="40" placeholder="Telefon kontaktowy" required>
|
|
<input type="text" name="address" size="40" placeholder="Kod pocztowy" required>
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="column-full">
|
|
<textarea name="information" cols="40" rows="10"
|
|
placeholder="Jeśli masz jakieś uwagi, wytyczne możesz wpisać je tutaj"></textarea>
|
|
</div>
|
|
</div>
|
|
<label class="confirm-data">
|
|
<input type="checkbox" name="acceptance-323" value="1" aria-invalid="false" required>
|
|
<span class="wpcf7-list-item-label">Wyrażam zgodę na przetwarzanie moich danych osobowych podanych przeze mnie powyżej w celu przygotowania stosownej oferty.</span>
|
|
</label>
|
|
<label class="confirm-data">
|
|
<input type="checkbox" name="acceptance-324" value="1" aria-invalid="false" required>
|
|
<span class="wpcf7-list-item-label">Wyrażam zgodę na przetwarzanie moich danych osobowych podanych przeze mnie powyżej w celu otrzymywania materiałów reklamowych.</span>
|
|
</label>
|
|
<div class="form-row codedropz-upload-wrapper">
|
|
<div class="form-group col-12">
|
|
<div class="fileuploader fileuploader-theme-default">
|
|
<input type="hidden" name="fileuploader-list-files" value="[]">
|
|
<input type="file" name="files[]" class="files" multiple="multiple">
|
|
<div class="fileuploader-items">
|
|
<ul class="fileuploader-items-list"></ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="inner-data">
|
|
<p class="mb-0">W innym przypadku podaj rozmiary, kolor oraz funkcje okien i drzwi, które chcesz wycenić:
|
|
</p>
|
|
<p class="mb-0">(Nie martw się o dokładność. Jeżeli zdecydujesz się na naszą ofertę, przedstawiciel VIDOKu
|
|
bezpłatnie dokona profesjonalnego pomiaru).</p>
|
|
<textarea name="wymiaryStolarki" cols="40" rows="10" class="wpcf7-form-control wpcf7-textarea"
|
|
aria-invalid="false" placeholder="Tutaj wpisz wymiary swojej stolarki"></textarea>
|
|
</div>
|
|
<div class="step-actions">
|
|
<div class="step-back">
|
|
<button class="step-prev-to-quick-form2">< Powrót</button>
|
|
</div>
|
|
<div class="step-send">
|
|
<div class="g-recaptcha" data-sitekey="6LfaovglAAAAAAieLVC7i4xGkQA5ufXUbWLipSbp"></div>
|
|
<input type="submit" value="Wyślij zapytanie >" class="form-send-content">
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<link class="footer" href="/plugins/fileuploader/jquery.fileuploader.min.css" rel="stylesheet" type="text/css">
|
|
<link class="footer" href="/plugins/fileuploader/font/font-fileuploader.css" rel="stylesheet" type="text/css">
|
|
<script class="footer" type="text/javascript" src="/plugins/fileuploader/jquery.fileuploader.min.js"></script>
|
|
|
|
<script class="footer" type="text/javascript">
|
|
let modalContactForm_Started = false;
|
|
$('#modal-contact-form input, #modal-contact-form textarea, #modal-contact-form select').one('input change', function() {
|
|
if (!modalContactForm_Started) {
|
|
modalContactForm_Started = true;
|
|
|
|
window.dataLayer = window.dataLayer || [];
|
|
window.dataLayer.push({
|
|
event: "form_start",
|
|
form_name: "Kontakt (Modal)",
|
|
form_id: "modal-contact-form",
|
|
form_step: "1"
|
|
});
|
|
}
|
|
});
|
|
|
|
$(function () {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
if (urlParams.get('modal_form_sent') === '1') {
|
|
window.dataLayer = window.dataLayer || [];
|
|
window.dataLayer.push({
|
|
event: "form_submit",
|
|
form_name: "Kontakt (Modal)",
|
|
form_id: "modal-contact-form",
|
|
submission_status: "success"
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<script class="footer" type="text/javascript">
|
|
// Popup open
|
|
$(".btn-popup-oferta").on(click_event, function() {
|
|
$(".box-popup").show();
|
|
$(".box-popup .modal-step-1").show();
|
|
});
|
|
// Popup close
|
|
$(".box-popup .modal-close img").on(click_event, function() {
|
|
$(".box-popup").hide();
|
|
$(".box-popup .modal-step-1").hide();
|
|
$(".box-popup .modal-step-2").hide();
|
|
$(".box-popup .modal-step-3").hide();
|
|
});
|
|
// Okno start (1)
|
|
$(".box-popup .modal-step-1-wrap .box-left").on(click_event, function() {
|
|
$(".box-popup .modal-step-1").hide();
|
|
$(".box-popup .modal-step-2").show();
|
|
kontaktTogle();
|
|
});
|
|
$(".box-popup .modal-step-1-wrap .box-right").on(click_event, function() {
|
|
$(".box-popup .modal-step-1").hide();
|
|
$(".box-popup .modal-step-3").show();
|
|
});
|
|
// Okno 'szybki kontakt' (2)
|
|
$(".box-popup .modal-step-2 .modal-tabs .item").on(click_event, function() {
|
|
$(".box-popup .modal-step-2 .modal-tabs .item").removeClass("active");
|
|
$(this).addClass("active");
|
|
kontaktTogle();
|
|
})
|
|
$(".box-popup .modal-step-2 .step-prev-to-quick-form2").on(click_event, function() {
|
|
$(".box-popup .modal-step-1").show();
|
|
$(".box-popup .modal-step-2").hide();
|
|
})
|
|
// Okno 'szybki kontakt' nav tab
|
|
function kontaktTogle() {
|
|
if ($(".box-popup .modal-step-2 .modal-tabs .item:nth-child(1)").hasClass("active")) {
|
|
$(".box-popup .modal-step-2 .modal-step-2-wrap .content-1").css("display", "flex");
|
|
$(".box-popup .modal-step-2 .modal-step-2-wrap .content-2").hide();
|
|
} else if ($(".box-popup .modal-step-2 .modal-tabs .item:nth-child(2)").hasClass("active")) {
|
|
$(".box-popup .modal-step-2 .modal-step-2-wrap .content-2").css("display", "flex");
|
|
$(".box-popup .modal-step-2 .modal-step-2-wrap .content-1").hide();
|
|
}
|
|
}
|
|
// Okno 'wycenana podstawie projektu' (3)
|
|
$(".box-popup .modal-step-3 .step-prev-to-quick-form2").on(click_event, function() {
|
|
$(".box-popup .modal-step-1").show();
|
|
$(".box-popup .modal-step-3").hide();
|
|
})
|
|
|
|
function wycenaNaPodstawieProjektu(event) {
|
|
event.preventDefault();
|
|
$(".box-popup").show();
|
|
$(".box-popup .modal-step-3").show();
|
|
}
|
|
</script>
|
|
<!-- Form action -->
|
|
<script class="footer" type="text/javascript">
|
|
$(document).ready(function() {
|
|
$('#modal-contact-form input.files').fileuploader({
|
|
fileMaxSize: 10,
|
|
extensions: ['jpg', 'jpeg', 'png', 'pdf', 'text/plain', 'csv', 'xml', 'xls', 'xlsx', 'doc', 'dot', 'docx'],
|
|
addMore: true,
|
|
captions: {
|
|
button: function(e) {
|
|
return "WYBIERZ PLIKI";
|
|
},
|
|
feedback: function(e) {
|
|
return (
|
|
"PRZYCIĄGNIJ I UPUŚĆ LUB"
|
|
);
|
|
},
|
|
feedback2: function(e) {
|
|
return (
|
|
e.length +
|
|
" " +
|
|
(1 < e.length ? "pliki są wybrane" : "plik jest wybrany")
|
|
);
|
|
},
|
|
confirm: "Potwierdzenie",
|
|
cancel: "Anuluj",
|
|
name: "Nazwa",
|
|
type: "Typ pliku",
|
|
size: "Rozmiar pliku",
|
|
dimensions: "Wymiary",
|
|
duration: "Czas",
|
|
crop: "Utnij to",
|
|
rotate: "Koło",
|
|
sort: "Sortować",
|
|
open: "Otwierasz",
|
|
download: "Ściągnij",
|
|
remove: "Usunąć",
|
|
drop: "Umieść plik tutaj do przesłania",
|
|
paste: '<div class="fileuploader-pending-loader"></div> Wklej plik, kliknij tutaj, aby usunąć',
|
|
removeConfirmation: "Czy na pewno chcesz usunąć plik??",
|
|
errors: {
|
|
filesLimit: "Sam ${limit} pliki można przesyłać.",
|
|
filesType: "Sam ${extensions} pliki można przesyłać.",
|
|
fileSize: "${name} jest zbyt duży! Wybierz plik do ${fileMaxSize} MB.",
|
|
filesSizeAll: "Wybrane pliki są za duże! Wybierz plik do ${maxSize} MB.",
|
|
fileName: "Plik o tej samej nazwie ${name} jest już wybrany.",
|
|
remoteFile: "Pliki zdalne są niedozwolone.",
|
|
folderUpload: "Foldery są niedozwolone.",
|
|
}
|
|
}
|
|
});
|
|
});
|
|
</script>
|