WordPress.org
Get WordPress

Plugin Directory

Changeset 2007994


Ignore:
Timestamp:
01/07/2019 07:35:57 PM (7 years ago)
Author:
ryner1
Message:

carousel optimize

Location:
cryptocurrency-shortcodes/trunk
Files:
6 edited

Legend:

Unmodified
Added
Removed

  • cryptocurrency-shortcodes/trunk/assets/admin_js_crypto.js

    r2006385 r2007994  
    11
    22(function($) {
    3     var body = $("html, body");
     3    var body = $("html, body");
    44    var rg__sel__cur__ = $('.rynerG_crypto_selected_currencies');
    55    var rg__span = rg__sel__cur__.find('span');
    … …  
    335335        rgcs_holder == '';
    336336        rgcs_update_selected_option();
     337       
    337338
    338339    });

  • cryptocurrency-shortcodes/trunk/assets/client_js_crypto.js

    r2005747 r2007994  
    11
    22(function($) {
    3     var body = $("html, body");
    4     var wind = $(window);
    5     var carousel = $('.RynerG_crypto_carousel_container .RynerG_crypto_carousel_content');
    6     var carousel_html = carousel.html();
    7     var width_base = wind.width();
    8     var carousel_itm_con = carousel.find('.rg_carousel_content_container');
    9     var carousel_itms = carousel_itm_con.find('.RynerG_crypto_carousel_item');
    10     var total_width = 0;
    11     var item_last = '';
    12     var total_num = 0;
    13     var set_w_base = width_base;
    14     var my_end_ctr = carousel_itms.length;
    15     // carousel_items.hover(
    16     //     function(){
    17     //         $(this).find('.rg__item_hidden').slideDown();
    18     //     },
    19     //     function(){
    20     //         $(this).find('.rg__item_hidden').slideUp();
    21     //     }
    22     // );
    23     var item_count = carousel.find('.rg__sequence1').find('.RynerG_crypto_carousel_item').length;
    24     var ctr_n = 4;
    25     if(width_base < 600){ width_base = 600; ctr_n = 1; }
    26     else if(width_base < 720){ width_base = 720; ctr_n = 2; }
    27     else if(width_base < 1200){ width_base = 1200; ctr_n = 3; }
    28     else if(width_base > 2000){ width_base = 2000; ctr_n = 5; }
    29     else if(width_base > 4000){ width_base = 4000; ctr_n = 6; }
     3    $(document).ready(function () {
    304
     5        console.log('testing something...');
     6        if( $('body').hasClass('rynerg_crypto_shortcode_carousel_active') ){
     7            rynerg_rgcs_carousel();
    318
    32     width_base = width_base / ctr_n;
    33     total_width = width_base * my_end_ctr;
    34     total_width = total_width + width_base;
    35     var base_trans = Math.ceil(my_end_ctr / ctr_n);
    36     var interval = parseInt(base_trans) * 1000;
    37     var trans = 'ease-out '+ item_count + '0s';
     9        }
     10       
     11    });
    3812
    39     set_max_width = (total_width * 2) + width_base;
     13    function rynerg_rgcs_carousel(){
    4014
    41     if( item_count <= ctr_n ){
    42         $('.rg__sequence2').remove();
    43         $('.rg_carousel_content_container').css('display','block').css('text-align','center').css('width','100%');
    44     }else{
    45         carousel.css('width',set_max_width+'px').css('left','0%');
    46         sexuence_wid = carousel.find('.rg__sequence1').width();
    47     }   
    48     $(window).load(function () {
    49         if( item_count >= ctr_n ){
    50             RynerG_crypto_carousel();   
    51         }
    52     });
    53    
    54     function RynerG_crypto_carousel(){
    55         rg_carousel_interval = setInterval(function(){
    56             $('.rg_carousel_content_container').attr('style','left:'+sexuence_wid+'; transition: '+trans+'; -webkit-transition: '+trans+'; ');
    57             $('.rg_carousel_content_container').css('left','-'+ sexuence_wid +'px');
    58             var get_left = $('.rg_carousel_content_container').css('left').replace("-","").replace("px","").replace("%","");
    59             if( get_left == sexuence_wid ){
    60                 $('.rg_carousel_content_container').attr('style','left:0; transition:0s; -webkit-transition:0s; ');
    61                 clearInterval(rg_carousel_interval);
    62                 RynerG_crypto_carousel();
     15        max_countdown = $('.rgcs_shortcode_carousel_container').attr('max_countdown');
     16        c_speed = $('.rgcs_shortcode_carousel_container').attr('c_speed');
     17        c_data_per_slide = $('.rgcs_shortcode_carousel_container').attr('c_data_per_slide');
     18
     19        jQuery.ajax({
     20            type : "post", dataType : "json", url : myAjax.ajaxurl,
     21            data : { action : "rynerg_rgcs_carousel" , max_countdown: max_countdown, c_speed: c_speed, c_data_per_slide: c_data_per_slide},
     22            success: function(res) {
     23                console.log('ajax working...');
     24                $('.rgcs_shortcode_carousel_container').html(res['s']);
     25                console.log('response: ' +res);
     26                setTimeout(function(){ rsg_carousel_start(res['c_speed'], res['c_num']); }, 1000);
     27               
     28            },
     29            error: function(){
     30                console.log('ajax failed!');
    6331            }
    64         },interval);
    65     };
     32        });
     33    }
     34
     35    function rsg_carousel_start(c_speed, c_num){
     36        $('.rynerg_rgcs_get_sample_shortcode_carousel').css('visibility','visible');
     37        $('.rgcs_shortcode_carousel_container').slick({
     38            dots: false,
     39            infinite: true,
     40            autoplay: true,
     41            autoplaySpeed:0,
     42            speed: c_speed,
     43            cssEase: 'linear',
     44            slidesToShow: c_num,
     45            slidesToScroll: 1,
     46            arrows: false,
     47            centerMode: false,
     48            pauseOnHover:true,
     49            responsive:[
     50            {
     51                breakpoint: 1800,
     52                settings:{
     53                    slidesToShow:5
     54                }
     55            },
     56            {
     57                breakpoint: 1550,
     58                settings:{
     59                    slidesToShow:4
     60                }
     61            },
     62            {
     63                breakpoint: 1250,
     64                settings:{
     65                    slidesToShow:3
     66                }
     67            },
     68            {
     69                breakpoint: 950,
     70                settings:{
     71                    slidesToShow:2
     72                }
     73            },
     74            {
     75                breakpoint: 460,
     76                settings:{
     77                    slidesToShow:1
     78                }
     79            },
     80            ]
     81        }).css('visibility','visible');
     82    }
    6683
    6784   

  • cryptocurrency-shortcodes/trunk/functions.php

    r2006480 r2007994  
    9292        $new_data_json  = update_option('rynerg_rgcs_api_crypto_json',$data_json);
    9393
    94         return $data_json;
     94        return $new_data_json;
    9595    }
    9696
    … …  
    118118        wp_register_script( 'admin_js_crypto', rg__Plugin_LINK.'assets/admin_js_crypto.js', array( 'jquery' ), 1.0, true );
    119119        wp_enqueue_script( 'admin_js_crypto' );
    120         wp_localize_script( 'admin_js_crypto', 'myAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' )));       
    121120
    122121        if( (! wp_style_is('admin_font_awesome_css_crypto', 'registered ') ) || (! wp_style_is('admin_font_awesome_css_crypto', 'enqueued ') ) ){
    … …  
    132131        wp_register_script( 'client_js_crypto', rg__Plugin_LINK.'assets/client_js_crypto.js', array( 'jquery' ), 1.0, true );
    133132        wp_enqueue_script( 'client_js_crypto' );
     133        wp_localize_script( 'client_js_crypto', 'myAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' )));       
    134134
    135135        if( (! wp_style_is('rsg_admin_slick', 'registered ') ) || (! wp_style_is('rsg_admin_slick', 'enqueued ') ) ){
    … …  
    250250rynerg_rgcs_initialize_class();
    251251rynerg_rgcs_deactivation_unsinstall();
    252 
    253    
    254 
    255 
    256252?>

  • cryptocurrency-shortcodes/trunk/my-admin/admin-return-html-templates/rg-shortcode-template-carousel.php

    r2006480 r2007994  
    1818$data               = get_option('rynerg_rgcs_api_crypto_json');
    1919$max_countdown      = $max;
     20$c_data_per_slide   = $c_data_per_slide;
     21$c_speed            = $c_speed;
    2022$coins_id           = get_option('rynerg_rgcs_selected_currencies');
    2123$img_url            = 'https://s2.coinmarketcap.com/static/img/coins/16x16/';
    … …  
    2426    $ctr_coins  = count($coins_id);
    2527
    26 
    27 
    28 
    2928?>
    30 <style>
    31     .rynerg_rgcs_get_sample_shortcode_carousel .rgcs_shortcode_carousel_container > .slick-list > .slick-track{ line-height: 0; }
    32     .rgcs_carousel_item > span{ width: 16px; height: 16px; padding: 0; display: inline-block; position: relative; left: -10px; top: 3px;}
    33 </style>
    34 
    35 <div class="rynerg_rgcs_get_sample_shortcode_carousel <?php echo ( $ctr_coins >= 5 ) ? 'rgcs_move_carousel' : ''; ?>" style="visibility: hidden;">
    36     <div class="rgcs_shortcode_carousel_container" rgcs_recur_carousel = 1 rgcs_recur_left = 0 style="visibility: hidden;">
    37         <?php
    38         foreach ($coins_id as $c_id):
    39             if($max_countdown > 0 ){
    40                 echo "<span class='rgcs_carousel_item'>";
    41                 foreach ( $data as $data_key=>$da ){
    42                     foreach ($da as $val) {
    43                         if(!empty($val->id) && $c_id == $val->id ){
    44 
    45                             $p_change_24h = $val->quote->USD->percent_change_24h;
    46                             $p_24h = number_format( (float)str_replace("-","",$p_change_24h),2,'.','');
    47                             if( $p_change_24h > 0)
    48                                 {$p_change_24h = '<i class="fas fa-long-arrow-alt-up" style="color:#0073aa;"></i>  %'.$p_24h;}
    49                             else
    50                                 {$p_change_24h = '<i class="fas fa-long-arrow-alt-down" style="color:#d82222;"></i>  %'.$p_24h;}
    51 
    52                             $bg = "background:url('".$img_url.$val->id.".png'); background-size: cover; background-repeat: no-repeat; ";
    53                             echo '<span style="'.$bg.' "></span>';
    54                            
    55                             // echo '<img src="'.$img_url.$val->id.'.png" style="display:inline-block;">&emsp;';
    56                             echo $val->name.'&emsp;';
    57                             echo '$'.number_format($val->quote->USD->price,4,'.',',').'&emsp;';
    58                             echo $p_change_24h;
    59                             break 2;
    60                         }
    61                     }
    62                 }
    63                 echo "</span>";
    64 
    65             }
    66             $max_countdown--;
    67            
    68         endforeach;
    69         ?>
    70        
     29<div class="rynerg_rgcs_get_sample_shortcode_carousel <?php echo ( $ctr_coins >= 5 ) ? 'rgcs_move_carousel' : ''; ?>" style="visibility: hidden; min-height: 40px;" >
     30    <div class="rgcs_shortcode_carousel_container" rgcs_recur_carousel = 1 rgcs_recur_left = 0 style="visibility: hidden;" max_countdown = "<?php echo $max_countdown ?>" c_data_per_slide = "<?php echo $c_data_per_slide ?>" c_speed = "<?php echo $c_speed ?>">
    7131    </div>
    7232</div>
     33<script type="text/javascript">
     34    jQuery(document).ready(function() {
     35        jQuery('body').addClass('rynerg_crypto_shortcode_carousel_active');
     36    });
     37</script>
    7338
    7439<?php endif;

  • cryptocurrency-shortcodes/trunk/my-admin/admin-return-html-templates/rg-shortcode-template.php

    r2005911 r2007994  
    66*/
    77if( ! function_exists('rgcs_template_shortcode') ):
    8 
    9 
    108function rgcs_template_shortcode($atts){       
    119    ob_start();
    … …  
    3735            .rynerg_rgcs_get_sample_shortcode_carousel, .rgcs_shortcode_carousel_container{ background: <?php echo $bg_color; ?> }
    3836            .rgcs_shortcode_carousel_container{ color: <?php echo $font_color; ?> }
     37            .rynerg_rgcs_get_sample_shortcode_carousel .rgcs_shortcode_carousel_container > .slick-list > .slick-track{ line-height: 0; }
     38            .rgcs_carousel_item > span{ width: 16px; height: 16px; padding: 0; display: inline-block; position: relative; left: -10px; top: 3px;}
    3939        </style>
    4040        <?php
    … …  
    4242    }
    4343
    44     ?>
    45         <script type="text/javascript">
    46 
    47             var rsg_slick = jQuery.noConflict();
    48 
    49             rsg_slick(document).ready(function() {
    50 
    51                 rsg_slick('.rynerg_rgcs_get_sample_shortcode_carousel').css('visibility','visible');
    52 
    53                 rsg_slick('.rgcs_shortcode_carousel_container').slick({
    54                   dots: false,
    55                   infinite: true,
    56                   autoplay: true,
    57                   autoplaySpeed:0,
    58                   speed: <?php echo $c_speed; ?>,
    59                   cssEase: 'linear',
    60                   slidesToShow: <?php echo $c_data_per_slide; ?>,
    61                   slidesToScroll: 1,
    62                   arrows: false,
    63                   centerMode: false,
    64                   pauseOnHover:true,
    65                   responsive:[
    66                     {
    67                         breakpoint: 1800,
    68                         settings:{
    69                             slidesToShow:5
    70                         }
    71                     },
    72                     {
    73                         breakpoint: 1550,
    74                         settings:{
    75                             slidesToShow:4
    76                         }
    77                     },
    78                     {
    79                         breakpoint: 1250,
    80                         settings:{
    81                             slidesToShow:3
    82                         }
    83                     },
    84                     {
    85                         breakpoint: 950,
    86                         settings:{
    87                             slidesToShow:2
    88                         }
    89                     },
    90                     {
    91                         breakpoint: 460,
    92                         settings:{
    93                             slidesToShow:1
    94                         }
    95                     },
    96                   ]
    97                 }).css('visibility','visible');
    98 
    99             });
    100 
    101         </script>
    102     <?php
    103 
    10444    return ob_get_clean();
    10545}
    106 
    107 
    10846add_shortcode( 'rgsc_crypto_shortcode', 'rgcs_template_shortcode');
    109 
    11047endif;
    111 
    112 

  • cryptocurrency-shortcodes/trunk/my-admin/rgcs-template-options-ajax.php

    r2006385 r2007994  
    232232
    233233
     234add_action('wp_ajax_nopriv_rynerg_rgcs_carousel','rynerg_rgcs_carousel');
     235add_action('wp_ajax_rynerg_rgcs_carousel','rynerg_rgcs_carousel');
     236if( ! function_exists('rynerg_rgcs_carousel') ):
     237
     238function rynerg_rgcs_carousel(){
     239    $max_countdown      = (int)$_REQUEST['max_countdown'];
     240    $get_previous_rate  = get_option('rynerg_rgcs_refresh_rate_of_currencies');
     241
     242
     243    if( $get_previous_rate == 'activated' ){
     244
     245        $det        = get_option('rynerg_rgcs_refresh_json_content');
     246        $now_det    = new DateTime();
     247        $apiCrypto  = new RynerG_crypto_shortcode();
     248        update_option('rynerg_rgcs_refresh_json_content',$now_det);
     249        $apiCrypto->callCurrencyRealTime();
     250    }
     251    $data               = get_option('rynerg_rgcs_api_crypto_json');
     252    $coins_id           = get_option('rynerg_rgcs_selected_currencies');
     253    $img_url            = 'https://s2.coinmarketcap.com/static/img/coins/16x16/';
     254
     255    if( $coins_id != false ):
     256        $ctr_coins  = count($coins_id);
     257        $con_class = ( $ctr_coins >= 5 ) ? 'rgcs_move_carousel' : '';
     258        $res_string = '';
     259        foreach ($coins_id as $c_id):
     260            if($max_countdown > 0 ){
     261                $res_string = $res_string."<span class='rgcs_carousel_item'>";
     262                foreach ( $data as $data_key=>$da ){
     263                    foreach ($da as $val) {
     264                        if(!empty($val->id) && $c_id == $val->id ){
     265
     266                            $p_change_24h = $val->quote->USD->percent_change_24h;
     267                            $p_24h = number_format( (float)str_replace("-","",$p_change_24h),2,'.','');
     268                            if( $p_change_24h > 0)
     269                                {$p_change_24h = '<i class="fas fa-long-arrow-alt-up" style="color:#0073aa;"></i>  %'.$p_24h;}
     270                            else
     271                                {$p_change_24h = '<i class="fas fa-long-arrow-alt-down" style="color:#d82222;"></i>  %'.$p_24h;}
     272
     273                            $bg = "background:url('".$img_url.$val->id.".png'); background-size: cover; background-repeat: no-repeat; ";
     274                            $res_string = $res_string.'<span style="'.$bg.' "></span>'.$val->name.'&emsp; $'.number_format($val->quote->USD->price,4,'.',',').'&emsp;'.$p_change_24h;
     275                            break 2;
     276                        }
     277                    }
     278                }
     279                $res_string = $res_string."</span>";   
     280
     281            }
     282            $max_countdown--;
     283           
     284        endforeach;
     285
     286        $result['s'] = $res_string;
     287
     288    endif;
     289
     290    $result['c_speed']  = $_REQUEST['c_speed'];
     291    $result['c_num']    = $_REQUEST['c_data_per_slide'];
     292   
     293    $result = json_encode($result); echo $result; die();
     294}
     295
     296endif;
     297
    234298function rynerg_rgcs_get_sample_shortcode_list($rgcs_sample_shortcode){
    235299    ob_start();
    … …  
    243307    return ob_get_clean();
    244308}
    245 
    246 ?>
Note: See TracChangeset for help on using the changeset viewer.