123 lines
4.0 KiB
PHP
123 lines
4.0 KiB
PHP
<link rel="stylesheet" type="text/css" href="/templates/widgets/widget-phone.css">
|
|
<script src="/libraries/jquery-ui/1.11.3/jquery-ui.min.js"></script>
|
|
<a href="#" id="widget-phone-icon">
|
|
<i class="fa fa-phone"></i>
|
|
</a>
|
|
<div id="widget-phone-bg">
|
|
<div id="widget-phone-box">
|
|
<a href="#" id="widget-phone-close">
|
|
<i class="fa fa-times"></i>
|
|
</a>
|
|
<div id="widget-phone-tabs">
|
|
<ul>
|
|
<li class="active" tab="widget-phone-now">
|
|
<i class="fa fa-phone"></i> Zadzwoń do mnie teraz
|
|
</li>
|
|
<!-- <li tab="widget-phone-later">
|
|
<i class="fa fa-clock-o"></i> Zadzwoń do mnie później
|
|
</li>
|
|
<li tab="widget-phone-message">
|
|
<i class="fa fa-comments-o"></i> Zostaw wiadomość
|
|
</li>-->
|
|
</ul>
|
|
</div>
|
|
<div id="widget-phone-box-content">
|
|
<div id="widget-phone-now" class="tab active">
|
|
<div id="widget-phone-alert">Dziękujemy za kontakt. Wkrótce oddzwonimy.</div>
|
|
<p>Podaj swój numer telefonu a oddzwonimy do Ciebie</p>
|
|
<div class="form-group">
|
|
<i class="fa fa-phone"></i>
|
|
<input type="text" class="form-control" name="widget-phone-input" id="widget-phone-input">
|
|
</div>
|
|
<div class="form-group">
|
|
<button type="button" class="btn btn-success">Zadzwoń do mnie teraz</button>
|
|
</div>
|
|
</div>
|
|
<div id="widget-phone-later" class="tab">
|
|
b
|
|
</div>
|
|
<div id="widget-phone-message" class="tab">
|
|
c
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
$(document).ready( function()
|
|
{
|
|
setTimeout(function() {
|
|
$( '#widget-phone-icon' ).show( 'fade' );
|
|
}, 2000 );
|
|
|
|
$( 'body' ).on( 'click', '#widget-phone-icon', function()
|
|
{
|
|
$( this ).hide( 'fade' );
|
|
$( '#widget-phone-bg' ).show( 'fade' );
|
|
});
|
|
|
|
$( 'body' ).on( 'click', '#widget-phone-close', function()
|
|
{
|
|
$( '#widget-phone-bg' ).hide( 'fade' );
|
|
$( '#widget-phone-box-content .tab.active *' ).show();
|
|
$( '#widget-phone-box-content .tab.active #widget-phone-alert' ).hide();
|
|
$( '#widget-phone-icon' ).show( 'fade' );
|
|
});
|
|
|
|
$( 'body' ).on( 'click', '#widget-phone-tabs li', function()
|
|
{
|
|
var tab = $( this ).attr( 'tab' );
|
|
$( '#widget-phone-box-content .tab' ).removeClass( 'active' );
|
|
$( '#widget-phone-box-content #' + tab ).addClass( 'active' );
|
|
});
|
|
|
|
$( 'body' ).on( 'click', '#widget-phone-now button', function()
|
|
{
|
|
var phone = $( '#widget-phone-now #widget-phone-input' ).val();
|
|
if ( $.trim( phone ) == '' )
|
|
{
|
|
$( '#widget-phone-box' ).effect( "bounce", { direction: 'left', distance: 25, times: 2 }, 500 );
|
|
$( '#widget-phone-now #widget-phone-input' ).addClass( 'error' ).focus();
|
|
return false;
|
|
}
|
|
else
|
|
{
|
|
$.ajax(
|
|
{
|
|
type: 'POST',
|
|
cache: false,
|
|
url: 'ajax.php',
|
|
data:
|
|
{
|
|
a: 'widget-phone-now',
|
|
phone: phone
|
|
},
|
|
beforeSend: function()
|
|
{
|
|
$( '#widget-phone-now #widget-phone-input' ).removeClass( 'error' );
|
|
$( '#widget-phone-now button' ).attr( 'disabled', 'disabled' );
|
|
$( '#widget-phone-now button' ).html( 'Trwa wysyłanie...' );
|
|
},
|
|
success: function( data )
|
|
{
|
|
$( '#widget-phone-now button' ).removeAttr( 'disabled' );
|
|
|
|
response = jQuery.parseJSON( data );
|
|
|
|
$( '.jqibox' ).remove();
|
|
|
|
if ( response.status === 'ok' )
|
|
{
|
|
$( '#widget-phone-now *' ).hide();
|
|
$( '#widget-phone-now #widget-phone-alert' ).show().addClass( 'good' ).html( 'Dziękujemy za kontakt. Wkrótce oddzwonimy.' );
|
|
}
|
|
else
|
|
{
|
|
$( '#widget-phone-now *' ).hide();
|
|
$( '#widget-phone-now #widget-phone-alert' ).show().addClass( 'bad' ).html( 'Wystąpił błąd.<br />Spróbuj ponownie.' );
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|
|
});
|
|
</script> |