Skip to content

Instantly share code, notes, and snippets.

@iamsathyaseelan

iamsathyaseelan/email_basket_custom_modal_j2store.php

Created June 25, 2020 07:57
Show Gist options
  • Save iamsathyaseelan/59afaa7b43b74de153f71e21369d5525 to your computer and use it in GitHub Desktop.
Save iamsathyaseelan/59afaa7b43b74de153f71e21369d5525 to your computer and use it in GitHub Desktop.
Download ZIP
Custom modal in email basket j2store
Raw
email_basket_custom_modal_j2store.php
<?php
/*
* @package plg_j2store_emailbasket
* @subpackage J2Store
* @author Gokila Priya - Weblogicx India http://www.weblogicxindia.com
* @copyright Copyright (c) 2014 Weblogicx India Ltd. All rights reserved.
* @license GNU/GPL license: http://www.gnu.org/copyleft/gpl.html
* --------------------------------------------------------------------------------
*/
/** ensure this file is being included by a parent file */
defined('_JEXEC') or die('Restricted access');
$user = JFactory::getUser();
$delay = (int)$this->params->get('empty_cart_delay', 2000);
JFactory::getDocument()->addStyleSheet(JUri::root() . '/plugins/j2store/app_emailbasket/app_emailbasket/assets/css/style.css');
require_once JPATH_SITE . '/components/com_users/helpers/route.php';
?>
<?php if ($this->params->get('disable_checkout_btn', 1)): ?>
<style type="text/css">
.cart-checkout-button {
display: none;
}
</style>
<?php endif; ?>
<style>
.btn-close {
color: #aaaaaa;
font-size: 20px;
text-decoration: none;
padding: 10px;
position: absolute;
right: 20px;
top: 20px;
}
.btn-close:hover {
color: #919191;
}
.j2store-custom-modal:before {
content: "";
display: none;
background: rgba(0, 0, 0, 0.6);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
}
.opened:before {
display: block;
}
.opened .j2store-modal-dialog {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
top: 20%;
}
.j2store-modal-dialog {
background: #fefefe;
border: #333333 solid 0px;
border-radius: 5px;
padding: 10px;
position: fixed;
top: -100%;
z-index: 11;
width: 50%;
left: 25%;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
-webkit-transform: translate(0, -500%);
-ms-transform: translate(0, -500%);
transform: translate(0, -500%);
-webkit-transition: -webkit-transform 0.3s ease-out;
-moz-transition: -moz-transform 0.3s ease-out;
-o-transition: -o-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
}
.j2store-modal-body {
padding: 20px;
overflow-x: scroll;
max-height: 300px;
text-align: left !important;
}
.j2store-modal-header,
.j2store-modal-footer {
padding: 10px 20px;
}
.j2store-modal-header {
border-bottom: #eeeeee solid 1px;
}
.j2store-modal-footer {
border-top: #eeeeee solid 1px;
text-align: right;
}
.j2store-modal-header h2 {
font-size: 20px;
}
@media screen and (max-width: 800px) {
.j2store-modal-dialog {
width: 100% !important;
left: 0;
}
.opened .j2store-modal-dialog {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
top: 10%;
}
.j2store-modal-body {
max-height: 250px;
}
}
<?php echo $this->params->get('modal_style',''); ?>
</style>
<div class="j2store-basket-email">
<div id="emailBasketNotice"></div>&nbsp;
<a id="sendEmailBasket" class="btn btn-success open-j2store-email-basket-modal" role="button"
data-target="#j2storeSendEmailBasket"
data-toggle="modal">
<i class="icon icon-mail"></i>
<?php echo JText::_('PLG_J2STORE_EMAILBASKET_SEND_TO_EMAIL'); ?>
</a>
<?php if ((JFactory::getUser()->id <= 0) && $this->params->get('show_save_cart', 0)): ?>
<a href="<?php echo JRoute::_('index.php?option=com_users&view=registration&Itemid=' . UsersHelperRoute::getRegistrationRoute()); ?>"
class="btn btn-primary"><?php echo JText::_('J2STORE_EMAILBASKET_SAVE_BUCKET'); ?></a>
<?php endif; ?>
<!-- Modal -->
<div class="j2store-custom-modal" id="j2store-custom-modal" aria-hidden="true">
<div class="j2store-modal-dialog">
<div class="j2store-modal-header">
<h3 id="myModalLabel"><i class="icon icon-cart"> </i> <?php echo JText::_('J2STORE_EMAIL') ?></h3>
<a href="#" class="btn-close close-j2store-email-basket-modal" aria-hidden="true">&times;</a>
</div>
<div class="j2store-modal-body">
<form id="j2storeBasketForm" action="index.php" class="form-horizontal" method="post">
<?php
$html = $this->params->get('quote_layout', '');
if (empty($html) || JString::strlen($html) < 5) {
//we dont have a profile set in the store profile. So use the default one.
$html = '<div class="row-fluid row">
<div class="span6 col-sm-6 col-lg-6 col-sm-12 col-xs-12">[first_name] [last_name] [phone_1] [phone_2][email] [company] [tax_number]</div>
<div class="span6 col-sm-6 col-lg-6 col-sm-12 col-xs-12 ">[address_1] [address_2] [city] [zip] [country_id] [zone_id]</div>
</div>';
}
//first find all the checkout fields
preg_match_all("^\[(.*?)\]^", $html, $checkoutFields, PREG_PATTERN_ORDER);
$allFields = $vars->fields;
$status = false;
?>
<?php foreach ($vars->fields as $fieldName => $oneExtraField): ?>
<?php
if ($fieldName == 'email') {
$status = true;
}
$onWhat = 'onchange';
if ($oneExtraField->field_type == 'radio') $onWhat = 'onclick';
if (property_exists($vars->address, $fieldName)) {
$html = str_replace('[' . $fieldName . ']', $vars->fieldsClass->getFormatedDisplay($oneExtraField, $vars->address->$fieldName, $fieldName, false, $options = '', $test = false, $allFields, $allValues = null) . '</br>', $html);
}
?>
<?php endforeach; ?>
<?php
$email = '<span class="j2store_field_required">*</span>' . JText::_('J2STORE_EMAIL');
$email .= '<br/><input type="text" name="email" value="" class="large-field" /> <br/>';
if ($status == false) {
//email not found. manually add it
$html = str_replace('[email]', $email, $html);
}
$phtml = '';
//re-check
if (!in_array('email', $checkoutFields[1])) {
//it seems deleted. so process them
$phtml .= $email;
}
?>
<?php
//check for unprocessed fields. If the user forgot to add the fields to the checkout layout in store profile, we probably have some.
$unprocessedFields = array();
/*foreach($vars->fields as $fieldName => $oneExtraField) {
if(!in_array($fieldName, $checkoutFields[1]) && $fieldName != 'email') {
$unprocessedFields[$fieldName] = $oneExtraField;
}
}*/
//now we have unprocessed fields. remove any other square brackets found.
preg_match_all("^\[(.*?)\]^", $html, $removeFields, PREG_PATTERN_ORDER);
foreach ($removeFields[1] as $fieldName) {
$html = str_replace('[' . $fieldName . ']', '', $html);
}
$html = $html . $phtml;
?>
<?php echo $html; ?>
<?php if (count($unprocessedFields)): ?>
<div class="row-fluid row">
<div class="span12 col-lg-12 col-md-12 col-sm-12 col-xs-12">
<?php $uhtml = ''; ?>
<?php foreach ($unprocessedFields as $fieldName => $oneExtraField): ?>
<?php $onWhat = 'onchange';
if ($oneExtraField->field_type == 'radio') $onWhat = 'onclick';
if (property_exists($vars->address, $fieldName)) {
$uhtml .= $vars->fieldsClass->getFormatedDisplay($oneExtraField, $vars->address->$fieldName, $fieldName, false, $options = '', $test = false, $allFields, $allValues = null);
$uhtml .= '<br/>';
}
?>
<?php endforeach; ?>
<?php echo $uhtml; ?>
</div>
</div>
<?php endif; ?>
<?php if (isset($vars->is_enable_terms) && !empty($vars->is_enable_terms)): ?>
<br/>
<label for="terms" id="email_basket_term">
<input type="checkbox" name="email_basket_term" value="1"> <?php echo JText::_('J2STORE_EMAIL_BASKET_TERMS_TEXT')?>
</label>
<?php endif; ?>
<br/>
<div class="row-fluid">
<div class="span12">
<h5><?php echo JText::_('PLG_J2STORE_EMAILBASKET_BODY'); ?></h5>
<?php if (!empty($vars->body)) : ?>
<div id="cartBody">
<?php echo $vars->body; ?>
</div>
<?php endif; ?>
<div class="modal-body" id="emailSuccess">
</div>
</div>
</div>
</form>
</div>
<div class="j2store-modal-footer">
<button class="btn close-j2store-email-basket-modal">
<?php echo JText::_('J2STORE_CLOSE'); ?>
</button>
<input type="button" id="hideSend" onclick="getBasketDetails()" class="btn btn-primary"
value="<?php echo JText::_('PLG_J2STORE_SEND'); ?>"/>
</div>
</div>
<div id="replace-content" class="hide" style="display: none;">
<?php if (!empty($vars->display_article)): ?>
<?php echo $vars->display_article; ?>
<?php else: ?>
<div>
<span class="alert alert-success"><?php echo JText::_('PLG_J2STORE_EMAILBASKET_SENDING_SUCCESS'); ?></span>
</div>
<?php endif; ?>
</div>
</div>
</div>
<?php
$document = JFactory::getDocument();
$document->addScriptDeclaration('
document.addEventListener("DOMContentLoaded", function(event) {
var modal_btn = document.getElementsByClassName("open-j2store-email-basket-modal")[0];
modal_btn.onclick = function(){
var modal = document.getElementById("j2store-custom-modal");
modal.classList.add("opened");
}
});
(function ($) {
$(document).on("click",".open-j2store-email-basket-modal",function(e){
$(".j2store-custom-modal").addClass("opened");
});
$(document).on("click",".close-j2store-email-basket-modal",function(e){
$(".j2store-custom-modal").removeClass("opened");
});
})(j2store.jQuery);');
$country_script = "(function($) {
$('#emailForm select[name=\'country_id\']').bind('change', function() {
$.ajax({
url:'index.php?option=com_j2store&view=carts&task=getCountry&country_id=' + this.value,
type: 'get',
dataType: 'json',
beforeSend: function() {
$('#emailForm select[name=\'country_id\']').after('<span class=\"wait\">&nbsp;<img src=\"".JUri::root(true)."/media/j2store/images/loader.gif\" alt=\"\" /></span>');
},
complete: function() {
$('.wait').remove();
},
success: function(json) {
html = '<option value=\"\">".JText::_('J2STORE_SELECT_OPTION')."</option>';
if (json['zone'] != '') {
for (i = 0; i < json['zone'].length; i++) {
html += '<option value=\"' + json['zone'][i]['j2store_zone_id'] + '\"';
if (json['zone'][i]['j2store_zone_id'] == '') {
html += ' selected=\"selected\"';
}
html += '>' + json['zone'][i]['zone_name'] + '</option>';
}
} else {
html += '<option value=\"0\" selected=\"selected\">".JText::_('J2STORE_CHECKOUT_ZONE_NONE')."</option>';
}
$('#emailForm select[name=\'zone_id\']').html(html);
},
error: function(xhr, ajaxOptions, thrownError) {
}
});
});
$('#emailForm select[name=\'country_id\']').trigger('change');
})(j2store.jQuery);";
$document->addScriptDeclaration($country_script);
?>
<script>
function getBasketDetails() {
(function ($) {
var data = $('form#j2storeBasketForm :input').serializeArray();
console.log(data);
$(".email-basket-error, .email-basket").remove();
var html = jQuery("#cartBody").html();
$.ajax({
url: 'index.php?option=com_j2store&view=callback&task=callback&method=app_emailbasket',
method: 'post',
data: data,
dataType: 'json',
success: function (json) {
$('.j2error').remove(); // remove old error messages
if (json['error']) {
$.each(json['error'], function (key, value) {
if (value) {
$('form#j2storeBasketForm #' + key).after('<br class="j2error" /><span class="j2error">' + value + '</span>');
}
});
}
if (json['success']) {
$('.warning, .j2error').remove();
//$("#j2storeSendEmailBasket").modal("hide");
$("#emailBasketNotice").append("<p class='email-basket text text-success'><strong>" + json['success']['msg'] + "</strong></p>");
$(".modal-body").html($('#replace-content').html());
$(".modal-footer").html('');
$(".email-basket").fadeIn('slow').delay(<?php echo $delay; ?>).fadeOut('slow');
setTimeout(function () {
if (json['redirect']) {
location = json['redirect'];
} else {
$("#j2storeSendEmailBasket").modal("hide");
location.reload();
}
}, <?php echo $delay; ?>);
}
}
});
})(j2store.jQuery);
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment