Skip to content

Commit

Permalink
Revert "Issue/5166 - Icons in the frontend and performance"
Browse files Browse the repository at this point in the history
  • Loading branch information
sunnyratilal committed Jan 12, 2017
1 parent 56b13b7 commit 1e2347a
Show file tree
Hide file tree
Showing 17 changed files with 152 additions and 110 deletions.
11 changes: 10 additions & 1 deletion assets/js/edd-ajax.js
Expand Up @@ -99,9 +99,17 @@ jQuery(document).ready(function ($) {
var $spinner = $this.find('.edd-loading');
var container = $this.closest('div');

var spinnerWidth = $spinner.width(),
spinnerHeight = $spinner.height();

// Show the spinner
$this.attr('data-edd-loading', '');

$spinner.css({
'margin-left': spinnerWidth / -2,
'margin-top' : spinnerHeight / -2
});

var form = $this.parents('form').last();
var download = $this.data('download-id');
var variable_price = $this.data('variable-price');
Expand Down Expand Up @@ -453,7 +461,7 @@ function edd_load_gateway( payment_mode ) {

// Show the ajax loader
jQuery('.edd-cart-ajax').show();
jQuery('#edd_purchase_form_wrap').html('<span class="edd-loading-ajax edd-loading"></span>');
jQuery('#edd_purchase_form_wrap').html('<img src="' + edd_scripts.ajax_loader + '"/>');

var url = edd_scripts.ajaxurl;

Expand All @@ -474,3 +482,4 @@ function edd_load_gateway( payment_mode ) {
);

}

12 changes: 3 additions & 9 deletions includes/checkout/template.php
Expand Up @@ -229,11 +229,7 @@ function edd_get_cc_form() {
<legend><?php _e( 'Credit Card Info', 'easy-digital-downloads' ); ?></legend>
<?php if( is_ssl() ) : ?>
<div id="edd_secure_site_wrapper">
<span class="padlock">
<svg class="edd-icon edd-icon-lock" xmlns="http://www.w3.org/2000/svg" width="18" height="28" viewBox="0 0 18 28" aria-hidden="true">
<path d="M5 12h8V9c0-2.203-1.797-4-4-4S5 6.797 5 9v3zm13 1.5v9c0 .828-.672 1.5-1.5 1.5h-15C.672 24 0 23.328 0 22.5v-9c0-.828.672-1.5 1.5-1.5H2V9c0-3.844 3.156-7 7-7s7 3.156 7 7v3h.5c.828 0 1.5.672 1.5 1.5z"/>
</svg>
</span>
<span class="padlock"></span>
<span><?php _e( 'This is a secure SSL encrypted payment.', 'easy-digital-downloads' ); ?></span>
</div>
<?php endif; ?>
Expand Down Expand Up @@ -619,8 +615,6 @@ function edd_payment_mode_select() {
<?php if( edd_is_ajax_disabled() ) { ?>
</form>
<?php } ?>
<div id="edd_purchase_form_wrap"></div><!-- the checkout fields are loaded into this-->

<div id="edd_purchase_form_wrap"></div><!-- the checkout fields are loaded into this-->
<?php do_action('edd_payment_mode_bottom');
}
Expand Down Expand Up @@ -727,12 +721,12 @@ function edd_discount_field() {
<p id="edd-discount-code-wrap" class="edd-cart-adjustment">
<label class="edd-label" for="edd-discount">
<?php _e( 'Discount', 'easy-digital-downloads' ); ?>
<img src="<?php echo EDD_PLUGIN_URL; ?>assets/images/loading.gif" id="edd-discount-loader" style="display:none;"/>
</label>
<span class="edd-description"><?php _e( 'Enter a coupon code if you have one.', 'easy-digital-downloads' ); ?></span>
<input class="edd-input" type="text" id="edd-discount" name="edd-discount" placeholder="<?php _e( 'Enter discount', 'easy-digital-downloads' ); ?>"/>
<input type="submit" class="edd-apply-discount edd-submit button <?php echo $color . ' ' . $style; ?>" value="<?php echo _x( 'Apply', 'Apply discount at checkout', 'easy-digital-downloads' ); ?>"/>
<span class="edd-discount-loader edd-loading" id="edd-discount-loader" style="display:none;"></span>
<span id="edd-discount-error-wrap" class="edd_error edd-alert edd-alert-error" aria-hidden="true" style="display:none;"></span>
<span id="edd-discount-error-wrap" class="edd_error edd-alert edd-alert-error" style="display:none;"></span>
</p>
</fieldset>
<?php
Expand Down
6 changes: 6 additions & 0 deletions includes/scripts.php
Expand Up @@ -81,6 +81,7 @@ function edd_load_scripts() {
'empty_cart_message' => __('Your cart is empty','easy-digital-downloads' ), // Item already in the cart message
'loading' => __('Loading','easy-digital-downloads' ) , // General loading message
'select_option' => __('Please select an option','easy-digital-downloads' ) , // Variable pricing error with multi-purchase option enabled
'ajax_loader' => set_url_scheme( EDD_PLUGIN_URL . 'assets/images/loading.gif', 'relative' ), // AJAX loading image
'is_checkout' => edd_is_checkout() ? '1' : '0',
'default_gateway' => edd_get_default_gateway(),
'redirect_to_checkout' => ( edd_straight_to_checkout() || edd_is_checkout() ) ? '1' : '0',
Expand Down Expand Up @@ -139,6 +140,11 @@ function edd_register_styles() {

wp_register_style( 'edd-styles', $url, array(), EDD_VERSION, 'all' );
wp_enqueue_style( 'edd-styles' );

if( edd_is_checkout() && is_ssl() ) {
// Dashicons are used to show the padlock icon on the credit card form
wp_enqueue_style( 'dashicons' );
}
}
add_action( 'wp_enqueue_scripts', 'edd_register_styles' );

Expand Down
7 changes: 2 additions & 5 deletions includes/template-functions.php
Expand Up @@ -174,7 +174,7 @@ function edd_get_purchase_link( $args = array() ) {

if ( ! edd_is_ajax_disabled() ) {

echo '<a href="#" class="edd-add-to-cart ' . esc_attr( $class ) . '" data-action="edd_add_to_cart" data-download-id="' . esc_attr( $download->ID ) . '" ' . $data_variable . ' ' . $type . ' ' . $data_price . ' ' . $button_display . '><span class="edd-add-to-cart-label">' . $args['text'] . '</span> <span class="edd-loading"><span class="screen-reader-text">' . __( 'Loading', 'easy-digital-downloads' ) . '</span></span></a>';
echo '<a href="#" class="edd-add-to-cart ' . esc_attr( $class ) . '" data-action="edd_add_to_cart" data-download-id="' . esc_attr( $download->ID ) . '" ' . $data_variable . ' ' . $type . ' ' . $data_price . ' ' . $button_display . '><span class="edd-add-to-cart-label">' . $args['text'] . '</span> <span class="edd-loading"><i class="edd-icon-spinner edd-icon-spin"></i></span></a>';

}

Expand All @@ -185,10 +185,7 @@ function edd_get_purchase_link( $args = array() ) {
<?php if ( ! edd_is_ajax_disabled() ) : ?>
<span class="edd-cart-ajax-alert" aria-live="assertive">
<span class="edd-cart-added-alert" style="display: none;">
<svg class="edd-icon edd-icon-check" xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" aria-hidden="true">
<path d="M26.11 8.844c0 .39-.157.78-.44 1.062L12.234 23.344c-.28.28-.672.438-1.062.438s-.78-.156-1.06-.438l-7.782-7.78c-.28-.282-.438-.673-.438-1.063s.156-.78.438-1.06l2.125-2.126c.28-.28.672-.438 1.062-.438s.78.156 1.062.438l4.594 4.61L21.42 5.656c.282-.28.673-.438 1.063-.438s.78.155 1.062.437l2.125 2.125c.28.28.438.672.438 1.062z"/>
</svg>
<?php echo __( 'Added to cart', 'easy-digital-downloads' ); ?>
<?php echo '<i class="edd-icon-ok" aria-hidden="true"></i> ' . __( 'Added to cart', 'easy-digital-downloads' ); ?>
</span>
</span>
<?php endif; ?>
Expand Down
143 changes: 56 additions & 87 deletions templates/edd.css
Expand Up @@ -8,22 +8,52 @@
*/
@charset "UTF-8";

/* Base styles for SVG icons. */

.edd-icon {
/* Icon font generated by IconMoon */
@font-face {
font-family: 'EDD-Icons';
src: url('fonts/EDD-Icons.eot');
src: url('fonts/EDD-Icons.eot?#iefix') format('embedded-opentype'),
url('fonts/EDD-Icons.woff') format('woff'),
url('fonts/EDD-Icons.ttf') format('truetype'),
url('fonts/EDD-Icons.svg#EDD-Icons') format('svg');
font-weight: normal;
font-style: normal;
}
[class*="edd-icon-"],
[class*=" edd-icon-"] {
font-family: 'EDD-Icons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
width: auto;
height: auto;
line-height: 1;
-webkit-font-smoothing: antialiased;
}
[class*="edd-icon-"]:before,
[class*=" edd-icon-"]:before {
text-decoration: inherit;
display: inline-block;
fill: currentColor;
position: relative; /* Align more nicely with capital letters */
top: -0.0625em;
vertical-align: middle;
width: 1em;
height: 1em;
cursor: default;
speak: none;
}

.edd-icon-lock {
top: -0.125rem;
.edd-icon-spinner:before {
content: "\71";
}
.edd-icon-ok:before {
content: "\77";
}
.edd-icon-remove:before {
content: "\65";
}
.edd-icon-remove-circle:before {
content: "\72";
}
.edd-icon-ok-circle:before {
content: "\74";
}

.edd-icon-spin {
display: inline-block;
-moz-animation: edd-icon-spin 2s infinite linear;
Expand Down Expand Up @@ -350,6 +380,13 @@
padding: 4px 4px 4px 0;
font-weight: bold;
}
#edd_secure_site_wrapper span.padlock:before {
content: '\f160';
display: inline-block;
-webkit-font-smoothing: antialiased;
font: normal 20px/1 'dashicons';
vertical-align: top;
}
#edd_checkout_form_wrap input.edd-input.card-number.valid {
background-image: url(images/tick.png);
background-repeat: no-repeat;
Expand Down Expand Up @@ -381,6 +418,7 @@
#edd_checkout_form_wrap span.card-type.amex {
background: url(images/icons/americanexpress.png ) no-repeat;
}
#edd_checkout_form_wrap #edd-discount-loader,
#edd_checkeout_form_wrap .edd-cart-ajax {
-webkit-box-shadow: none;
-moz-box-shadow: none;
Expand Down Expand Up @@ -444,83 +482,15 @@
opacity: 1;
filter: alpha(opacity=100);
}
.edd-loading,
.edd-loading:after {
border-radius: 50%;
display: block;
width: 1.5em;
height: 1.5em;
}
.edd-loading {
-webkit-animation: edd-spinning 1.1s infinite linear;
animation: edd-spinning 1.1s infinite linear;
border-top: 0.2em solid rgba(255, 255, 255, 0.2);
border-right: 0.2em solid rgba(255, 255, 255, 0.2);
border-bottom: 0.2em solid rgba(255, 255, 255, 0.2);
border-left: 0.2em solid #fff;
font-size: 0.75em;
a.edd-add-to-cart .edd-loading {
position: absolute;
left: calc(50% - 0.75em);
top: calc(50% - 0.75em);
left: 50%;
top: 50%;
opacity: 0;
filter: alpha(opacity=0);
-ms-transform: translateZ(0);
transform: translateZ(0);
}
a.edd-add-to-cart.white .edd-loading,
.edd-discount-loader.edd-loading,
.edd-loading-ajax.edd-loading {
border-top-color: rgba(0, 0, 0, 0.2);
border-right-color: rgba(0, 0, 0, 0.2);
border-bottom-color: rgba(0, 0, 0, 0.2);
border-left-color: #000;
}
.edd-loading-ajax.edd-loading {
display: inline-block;
position: relative;
top: 0;
left: 0.25em;
vertical-align: middle;
}

#edd_checkout_form_wrap .edd-cart-adjustment .edd-apply-discount.edd-submit {
display: inline-block;
}
.edd-discount-loader.edd-loading {
display: inline-block;
position: relative;
left: auto;
vertical-align: middle;
width: 1.25em;
height: 1.25em;
}

.edd-loading-ajax.edd-loading {
opacity: 1;
}

@-webkit-keyframes edd-spinning {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes edd-spinning {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
a.edd-add-to-cart .edd-add-to-cart-label,
.edd-loading {
a.edd-add-to-cart .edd-loading {
-webkit-transition: .1s opacity !important;
-moz-transition: .1s opacity !important;
-ms-transition: .1s opacity !important;
Expand All @@ -531,8 +501,7 @@ a.edd-add-to-cart .edd-add-to-cart-label,
opacity: 0;
filter: alpha(opacity=0);
}
.edd-add-to-cart[data-edd-loading] .edd-loading,
.edd-discount-loader.edd-loading {
.edd-add-to-cart[data-edd-loading] .edd-loading {
opacity: 1;
filter: alpha(opacity=100);
}
Expand Down
19 changes: 19 additions & 0 deletions templates/fonts/EDD-Icons.dev.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added templates/fonts/EDD-Icons.eot
Binary file not shown.
1 change: 1 addition & 0 deletions templates/fonts/EDD-Icons.json

Large diffs are not rendered by default.

19 changes: 19 additions & 0 deletions templates/fonts/EDD-Icons.svg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added templates/fonts/EDD-Icons.ttf
Binary file not shown.
Binary file added templates/fonts/EDD-Icons.woff
Binary file not shown.
4 changes: 0 additions & 4 deletions templates/fonts/check.svg

This file was deleted.

4 changes: 0 additions & 4 deletions templates/fonts/lock.svg

This file was deleted.

Binary file added templates/fonts/padlock.eot
Binary file not shown.

0 comments on commit 1e2347a

Please sign in to comment.