WordPress.org
Get WordPress

Plugin Directory

Changeset 3428462


Ignore:
Timestamp:
12/28/2025 03:56:53 AM (2 weeks ago)
Author:
pickplugins
Message:

version update

Location:
social-share-button/trunk
Files:
13 edited

Legend:

Unmodified
Added
Removed

  • social-share-button/trunk/assets/settings-tabs/settings-tabs.css

    r2363173 r3428462  
    55/*General CSS*/
    66
    7 .settings-tabs .float-right{
     7.settings-tabs .float-right {
    88    float: right;
    99}
    1010
    11 .settings-tabs .float-left{
     11.settings-tabs .float-left {
    1212    float: right;
    1313}
    1414
    15 .settings-tabs .float-none{
     15.settings-tabs .float-none {
    1616    float: right;
    1717}
    1818
    1919
    20 .settings-tabs .loading{}
    21 .settings-tabs .submit{
     20.settings-tabs .loading {}
     21
     22.settings-tabs .submit {
    2223    padding: 15px 20px;
    2324}
    2425
    2526
     27.settings-tabs .disabled {
     28    color: #f00;
     29}
    2630
    2731/* Collapsible */
    2832
    29 .settings-tabs .collapsible{
     33.settings-tabs .collapsible {
    3034    margin-bottom: 2px;
    3135}
    32 .settings-tabs .collapsible .header{
     36
     37.settings-tabs .collapsible .header {
    3338    background: #eee;
    3439    padding: 8px 10px;
    35 }
    36 
    37 .settings-tabs .collapsible .header span{
     40    display: flex;
     41}
     42
     43.settings-tabs .collapsible .header span {
    3844    display: inline-block;
    3945    vertical-align: middle;
    4046}
    4147
    42 .settings-tabs .collapsible .content{
     48.settings-tabs .collapsible .content {
    4349    display: none;
    4450    padding: 10px;
    … …  
    4753
    4854
    49 .settings-tabs .collapsible.active .content{
     55.settings-tabs .collapsible.active .content {
    5056    display: block;
    5157}
    … …  
    5763
    5864
    59 .settings-tabs{
     65
     66.settings-tabs {
    6067    background: #fff;
    6168    margin: 25px 0;
    6269}
    6370
    64 .settings-tabs.vertical{
     71.settings-tabs.vertical {
    6572    position: relative;
    6673}
    67 .settings-tabs .tab-navs{
     74
     75.settings-tabs .tab-navs {
    6876    float: left;
    6977    margin: 0;
    … …  
    7280    top: 32px;
    7381}
    74 .settings-tabs .tab-nav{
    75     width: 200px;
     82
     83.settings-tabs .tab-nav {
     84    width: 250px;
    7685    padding: 12px 10px;
    7786    background: #f1f1f1;
    … …  
    7988    border-bottom: 1px solid #eee;
    8089    cursor: pointer;
    81     font-size: 13px;
    82 }
    83 
    84 .settings-tabs .tab-nav.active{
    85     background:#f1f1f159;
     90    font-size: 16px;
     91    border-bottom: 1px solid #ddd;
     92    box-sizing: border-box;
     93}
     94
     95.settings-tabs .tab-nav.active {
     96    background: #f1f1f159;
    8697}
    8798
    … …  
    95106    color: #b7b7b7;
    96107}
     108
    97109.tab-nav.active i {
    98110    color: #333;
    99111}
    100 .settings-tabs .tab-content{
    101     margin-left: 220px;
     112
     113.settings-tabs .tab-content {
     114    margin-left: 250px;
    102115    padding: 0px 0;
    103116    background: #f1f1f159;
    … …  
    105118}
    106119
    107 .settings-tabs .tab-content.active{
     120.settings-tabs .tab-content.active {
    108121    display: block;
    109122}
    110123
    111 .settings-tabs.has-right-panel{
    112 
    113 }
     124.settings-tabs.has-right-panel {}
    114125
    115126.settings-tabs.has-right-panel .tab-content {
    … …  
    118129
    119130
    120 .settings-tabs-right-panel{
     131.settings-tabs-right-panel {
    121132    width: 250px;
    122133    float: right;
    … …  
    126137}
    127138
    128 .settings-tabs-right-panel .right-panel-content{
     139.settings-tabs-right-panel .right-panel-content {
    129140    display: none;
    130141}
    131142
    132 .settings-tabs-right-panel .right-panel-content.active{
     143.settings-tabs-right-panel .right-panel-content.active {
    133144    display: block;
    134145}
    … …  
    137148/*horizontal*/
    138149
    139 .settings-tabs.horizontal{
    140 
    141 }
    142 
    143 .settings-tabs.horizontal .tab-navs{
     150.settings-tabs.horizontal {}
     151
     152.settings-tabs.horizontal .tab-navs {
    144153    float: none;
    145154    position: relative;
    … …  
    148157}
    149158
    150 .settings-tabs.horizontal .tab-navs .tab-nav{
     159.settings-tabs.horizontal .tab-navs .tab-nav {
    151160    display: inline-block;
    152161    float: left;
    … …  
    155164}
    156165
    157 .settings-tabs.horizontal .tab-navs .tab-nav:last-child{
    158     border-right: 1px solid rgba(0,0,0,0);
    159 }
    160 
    161 
    162 .settings-tabs.horizontal .tab-content{
     166.settings-tabs.horizontal .tab-navs .tab-nav:last-child {
     167    border-right: 1px solid rgba(0, 0, 0, 0);
     168}
     169
     170
     171.settings-tabs.horizontal .tab-content {
    163172    margin-left: 0;
    164173    /*clear: both;*/
    … …  
    168177
    169178
    170 
    171 
    172 
    173 
    174 
    175 
    176 
    177 
    178 
    179 
    180 
    181 
    182 
    183 .settings-tabs .section{
     179.radio-img {
     180
     181    display: flex;
     182    flex-wrap: wrap;
     183}
     184
     185
     186.radio-img .name {
     187
     188    padding: 5px;
     189    text-align: center;
     190    position: absolute;
     191    bottom: 0;
     192    width: 100%;
     193    left: 0;
     194}
     195
     196
     197
     198
     199.radio-img label {
     200    display: inline-block;
     201    vertical-align: top;
     202    margin: 5px;
     203    padding: 5px;
     204    background: #eee;
     205    position: relative;
     206    border-radius: 5px;
     207    overflow: hidden;
     208    padding-bottom: 30px;
     209}
     210
     211.radio-img label.active .name {
     212    background: #1976ec;
     213
     214}
     215
     216
     217.radio-img label.active {
     218    background: #1976ec;
     219    color: #fff;
     220    font-weight: bold;
     221}
     222
     223.radio-img label.disabled {
     224    background: #e2e2e2;
     225
     226}
     227
     228.radio-img label.disabled img {
     229    background: #e2e2e2;
     230    opacity: .3;
     231}
     232
     233.radio-img label.disabled .pro-msg {
     234    background: #ffd87f;
     235    position: absolute;
     236    top: 50%;
     237    left: 50%;
     238    transform: translate(-50%, -50%);
     239    padding: 0 10px;
     240
     241}
     242
     243.radio-img label .link {
     244    background: hsl(200, 7%, 42%);
     245    position: absolute;
     246    top: 2px;
     247    /* transform: translate(0%,-50%); */
     248    padding: 3px 14px;
     249    text-decoration: none;
     250    font-size: 14px;
     251    color: #fff;
     252    right: 2px;
     253
     254}
     255
     256
     257.radio-img input[type=radio] {
     258    display: none;
     259}
     260
     261.radio-img img {
     262
     263    vertical-align: top;
     264    width: 100%;
     265}
     266
     267
     268
     269
     270
     271
     272.settings-tabs .section {
    184273    margin: 0;
    185274    padding: 15px 0;
    186275}
    187 .settings-tabs .section-title{
     276
     277.settings-tabs .section-title {
    188278    padding: 0 15px;
    189     font-size: 16px;
     279    font-size: 24px;
    190280    font-weight: 600;
    191281}
    192282
    193 .settings-tabs .section-description{
     283.settings-tabs .section-description {
    194284    padding: 0 15px;
    195285    margin-bottom: 25px;
    196 }
    197 
    198 
    199 
    200 .settings-tabs .setting-field{
     286    font-size: 16px;
     287
     288}
     289
     290
     291
     292.settings-tabs .setting-field {
    201293    border-bottom: 1px solid #eee;
    202294    padding: 15px;
    203295}
    204 .settings-tabs .setting-field:last-child{
    205 
    206 }
    207 
    208 
    209 
    210 .settings-tabs .setting-field .field-lable{
     296
     297.settings-tabs input[type="text"],
     298.settings-tabs input[type="number"],
     299.settings-tabs .range-slider,
     300.settings-tabs input[type="email"],
     301.settings-tabs textarea,
     302.settings-tabs select,
     303.settings-tabs input[type="range"] {
     304    border: 2px solid #2563eb69;
     305    border-radius: 0;
     306    padding: 5px 10px;
     307
     308}
     309
     310.settings-tabs input[type=radio],
     311.settings-tabs input[type=checkbox] {
     312    background: #fff;
     313    padding: 5px 10px;
     314    border: 1px solid #2563eb69;
     315
     316
     317}
     318
     319.settings-tabs input[type=radio]:checked {
     320    background: #2563eb69;
     321    padding: 5px 10px;
     322
     323}
     324
     325.settings-tabs input[type=radio]:checked::before {
     326    border: 3px solid #fff;
     327    background: #2563eb69;
     328}
     329
     330
     331.settings-tabs input[type=checkbox] {
     332    border-radius: 0;
     333}
     334
     335.settings-tabs input[type=checkbox]:checked {}
     336
     337.settings-tabs input[type=checkbox]:checked::before {}
     338
     339.settings-tabs .setting-field:last-child {}
     340
     341
     342
     343.settings-tabs .setting-field .field-lable {
    211344    width: 270px;
    212345    float: left;
    213     font-size: 14px;
     346    font-size: 18px;
    214347    word-break: break-word;
    215 }
    216 .settings-tabs .setting-field .field-input{
     348    font-weight: 600;
     349}
     350
     351.settings-tabs .setting-field .field-input {
    217352    margin-left: 270px;
    218353}
    219 .settings-tabs .setting-field .description{
     354
     355.settings-tabs .setting-field .description {
    220356    word-break: break-word;
    221 }
    222 
    223 .settings-tabs .setting-field .setting-field{
     357    font-size: 16px;
     358    margin: 10px 0;
     359
     360}
     361
     362.settings-tabs .setting-field .setting-field {
    224363    padding: 0 15px 15px 0px;
    225364}
    226 .settings-tabs .setting-field .setting-field .field-lable{
     365
     366.settings-tabs .setting-field .setting-field .field-lable {
    227367
    228368    float: none;
    229369}
    230370
    231 .settings-tabs .setting-field .setting-field .field-input{
     371.settings-tabs .setting-field .setting-field .field-input {
    232372    margin-left: 0px;
    233373}
    234374
    235375
    236 .settings-tabs .expandable .setting-field{
     376.settings-tabs .expandable .setting-field {
    237377    padding: 10px 0;
    238378    margin: 10px 0;
    239379}
    240 .settings-tabs .expandable .setting-field .field-lable{
     380
     381.settings-tabs .expandable .setting-field .field-lable {
    241382    float: left;
    242383}
    243384
    244 .settings-tabs .expandable .setting-field .field-input{
     385.settings-tabs .expandable .setting-field .field-input {
    245386    margin-left: 270px;
    246387}
    247388
    248 .settings-tabs .expandable .setting-field .setting-field .field-lable{
     389.settings-tabs .expandable .setting-field .setting-field .field-lable {
    249390    float: none;
    250391}
    251392
    252 .settings-tabs .expandable .setting-field .setting-field .field-input{
     393.settings-tabs .expandable .setting-field .setting-field .field-input {
    253394    margin-left: 0px;
    254395}
    … …  
    258399}
    259400
    260 .settings-tabs .field-error .error-details{
     401.settings-tabs .field-error .error-details {
    261402    color: #c11f1f;
    262403}
    … …  
    264405/*field-repeatable-wrapper*/
    265406
    266 .settings-tabs .field-media-wrapper .media-upload, .field-media-wrapper .clear {
     407.settings-tabs .field-media-wrapper .media-upload,
     408.field-media-wrapper .clear {
    267409    display: inline-block;
    268410    background: #ddd;
    … …  
    271413    border: 1px solid #999;
    272414}
    273 .ppof-settings .repeatable .item-wrap{
     415
     416.ppof-settings .repeatable .item-wrap {
    274417    margin-bottom: 5px;
    275418    padding-bottom: 0px;
    … …  
    277420
    278421
    279 .field-repeatable-wrapper .field-list{
     422.field-repeatable-wrapper .field-list {
    280423    margin-top: 18px;
    281424}
    282 .field-repeatable-wrapper .button{
    283 
    284 }
    285 
    286 .field-repeatable-wrapper .sort{
     425
     426.field-repeatable-wrapper .button {}
     427
     428.field-repeatable-wrapper .sort {
    287429    background: rgba(87, 99, 117, 0.48) none repeat scroll 0 0;
    288430    color: rgb(255, 255, 255);
    … …  
    293435}
    294436
    295 .field-repeatable-wrapper .remove{
     437.field-repeatable-wrapper .remove {
    296438    background: rgb(228, 65, 8) none repeat scroll 0 0;
    297439    color: rgb(255, 255, 255);
    … …  
    301443    border-radius: 3px;
    302444}
    303 .field-repeatable-wrapper .title-text{
     445
     446.field-repeatable-wrapper .title-text {
    304447    cursor: pointer;
    305 }
    306 
    307 .field-repeatable-wrapper .add-repeat-field{
     448    width: 90%;
     449}
     450
     451.field-repeatable-wrapper .add-repeat-field {
    308452    background: rgba(87, 99, 117, 0.48) none repeat scroll 0 0;
    309453    color: rgb(255, 255, 255);
    … …  
    317461
    318462
    319 .settings-tabs .field-media-wrapper .media-upload, .field-media-wrapper .clear {
     463.settings-tabs .field-media-wrapper .media-upload,
     464.field-media-wrapper .clear {
    320465    display: inline-block;
    321466    background: #ddd;
    … …  
    328473/*input*/
    329474
    330 .settings-tabs input[type="text"], .settings-tabs .range-slider, .settings-tabs input[type="email"],.settings-tabs textarea, .settings-tabs select, .settings-tabs input[type="range"]{
     475.settings-tabs input[type="text"],
     476.settings-tabs input[type="number"],
     477.settings-tabs .range-slider,
     478.settings-tabs input[type="email"],
     479.settings-tabs textarea,
     480.settings-tabs select,
     481.settings-tabs input[type="range"] {
    331482    width: 360px;
    332     background: #f1f1f1;
    333 }
    334 
    335 
    336 @media (max-width: 1170px){
    337     .settings-tabs input[type="text"],     .settings-tabs input[type="email"],.settings-tabs textarea, .settings-tabs select, .settings-tabs input[type="range"], .settings-tabs .select2{
     483    background: #ffffff;
     484}
     485
     486
     487@media (max-width: 1170px) {
     488
     489    .settings-tabs input[type="text"],
     490    .settings-tabs input[type="email"],
     491    .settings-tabs textarea,
     492    .settings-tabs select,
     493    .settings-tabs input[type="range"],
     494    .settings-tabs .select2 {
    338495        width: 100% !important;
    339496
    … …  
    342499
    343500
    344 @media (max-width: 1440px){
    345 
    346     .settings-tabs .setting-field .field-lable{
     501@media (max-width: 1440px) {
     502
     503    .settings-tabs .setting-field .field-lable {
    347504        width: auto;
    348505        float: none;
    … …  
    350507        margin-bottom: 10px;
    351508    }
    352     .settings-tabs .setting-field .field-input{
     509
     510    .settings-tabs .setting-field .field-input {
    353511        margin-left: 0px;
    354512    }
    355     .settings-tabs .setting-field .description{}
     513
     514    .settings-tabs .setting-field .description {}
    356515
    357516    /*.settings-tabs-right-panel {*/
    … …  
    369528}
    370529
    371 @media (max-width: 1700px){
    372 
    373     .settings-tabs .setting-field .setting-field .field-lable{
     530@media (max-width: 1700px) {
     531
     532    .settings-tabs .setting-field .setting-field .field-lable {
    374533        width: auto;
    375534        float: none;
    376535        font-size: 14px;
    377536    }
    378     .settings-tabs .setting-field .setting-field .field-input{
     537
     538    .settings-tabs .setting-field .setting-field .field-input {
    379539        margin-left: 0px;
    380540    }
    … …  
    412572    padding: 10px 15px;
    413573    position: relative;
     574    display: flex;
     575    align-items: center;
    414576
    415577}
    … …  
    431593}
    432594
    433 .settings-tabs .expandable  .options.active {
     595.settings-tabs .expandable .options.active {
    434596    display: block;
    435597}
    … …  
    443605    display: none;
    444606}
     607
    445608.settings-tabs .item.active .expand .fa-compress {
    446609    display: inline-block;
    447610}
     611
    448612.settings-tabs .item.active .expand .fa-expand {
    449613    display: none;
    … …  
    462626    padding: 5px;
    463627    cursor: pointer;
    464 }
     628    margin-right: 10px;
     629}
     630
     631.settings-tabs .expandable .item .header-text {
     632
     633    width: 90%;
     634}
     635
    465636
    466637.settings-tabs .expandable .remove {
    … …  
    473644}
    474645
    475 .settings-tabs .expandable .sort  {
     646.settings-tabs .expandable .sort {
    476647    background: rgba(87, 99, 117, 0.48) none repeat scroll 0 0;
    477648    color: rgb(255, 255, 255);
    … …  
    485656
    486657
    487 .settings-tabs .pro-feature{
     658.settings-tabs .pro-feature {
    488659    background: #ffd87f;
    489660    padding: 0 5px;
    … …  
    494665/*3rd Party*/
    495666
    496 .settings-tabs .field-input .CodeMirror{
     667.settings-tabs .field-input .CodeMirror {
    497668    background: #f1f1f1;
    498669}
    … …  
    501672/*.accordion*/
    502673
    503 .settings-tabs .accordion{}
    504 .settings-tabs .accordion .accordion-title{
     674.settings-tabs .accordion {}
     675
     676.settings-tabs .accordion .accordion-title {
    505677    padding: 10px;
    506678    background: #f1f1f1;
    … …  
    510682    font-size: 14px;
    511683}
    512 .settings-tabs .accordion .accordion-content{
     684
     685.settings-tabs .accordion .accordion-content {
    513686    padding: 10px;
    514687    background: #f5f4f4a6;
    … …  
    516689
    517690
    518 
    519 @media only screen and (min-width: 1024px ){
    520 
    521 }
    522 
    523 @media only screen and ( min-width: 768px ) and ( max-width: 1023px ) {
    524 
    525 }
    526 
    527 @media only screen and ( min-width: 0px ) and ( max-width: 767px ){
    528 
    529 
    530 
    531 
    532     .settings-tabs .tab-navs{
     691.range-input {}
     692
     693.range-input .range-value {
     694    display: inline-block;
     695    vertical-align: top;
     696    margin: 0 0;
     697    padding: 4px 10px;
     698    background: #eee;
     699}
     700
     701.text-icon {}
     702
     703.text-icon .icon {
     704    /* width: 30px; */
     705    background: #ddd;
     706    /* height: 28px; */
     707    display: inline-block;
     708    vertical-align: top;
     709    text-align: center;
     710    font-size: 14px;
     711    padding: 5px 10px;
     712    line-height: normal;
     713}
     714
     715
     716
     717
     718
     719
     720
     721
     722
     723
     724
     725@media only screen and (min-width: 1024px) {}
     726
     727@media only screen and (min-width: 768px) and (max-width: 1023px) {}
     728
     729@media only screen and (min-width: 0px) and (max-width: 767px) {
     730
     731
     732
     733
     734    .settings-tabs .tab-navs {
    533735        float: none;
    534736        position: relative;
    … …  
    537739    }
    538740
    539     .settings-tabs .tab-navs .tab-nav{
     741    .settings-tabs .tab-navs .tab-nav {
    540742        display: inline-block;
    541743        float: left;
    … …  
    545747    }
    546748
    547     .settings-tabs .tab-navs .tab-nav:last-child{
    548         border-right: 1px solid rgba(0,0,0,0);
    549     }
    550 
    551 
    552     .settings-tabs .tab-content{
     749    .settings-tabs .tab-navs .tab-nav:last-child {
     750        border-right: 1px solid rgba(0, 0, 0, 0);
     751    }
     752
     753
     754    .settings-tabs .tab-content {
    553755        margin-left: 0;
    554756        /*clear: both;*/
    … …  
    571773    }
    572774
    573     input[type=checkbox], input[type=radio] {
     775    input[type=checkbox],
     776    input[type=radio] {
    574777        margin: 6px 7px 0 0;
    575778    }
    … …  
    584787
    585788}
    586 
    587 
    588 
    589 
    590 
    591 
    592 
    593 
    594 

  • social-share-button/trunk/assets/settings-tabs/settings-tabs.js

    r2363173 r3428462  
    1 jQuery(document).ready(function($){
    2 
    3     $( ".settings-tabs-loading").fadeOut();
    4     $( ".settings-tabs").fadeIn();
    5 
    6     accordion = $( ".settings-tabs .accordion").accordion({
    7         heightStyle:'content',
    8         active: 99,
    9         header: "> div > h3",
    10         collapsible: true,
    11     });
    12 
    13     $( ".settings-tabs [colorPicker]").wpColorPicker();
    14 
    15 
    16     $( ".settings-tabs .accordion[sortable='true']").sortable({
    17         axis: "y",
    18         handle: "h3",
    19         stop: function( event, ui ) {
    20             // IE doesn't register the blur when sorting
    21             // so trigger focusout handlers to remove .ui-state-focus
    22             ui.item.children( "h3" ).triggerHandler( "focusout" );
    23 
    24             // Refresh accordion to handle new order
    25             $( this ).accordion( "refresh" );
     1(function ($) {
     2    //jQuery(document).ready(function($){
     3    $(document).ready(function () {
     4        $(".settings-tabs-loading").fadeOut();
     5        $(".settings-tabs").fadeIn();
     6
     7        accordion = $(".settings-tabs .accordion").accordion({
     8            heightStyle: 'content',
     9            active: 99,
     10            header: "> div > h3",
     11            collapsible: true,
     12        });
     13        $(".color-picker").wpColorPicker();
     14        $(".settings-tabs [colorPicker]").wpColorPicker();
     15
     16        if ($(".datepicker").length) {
     17            $(".datepicker").datepicker({
     18                dateFormat: ""
     19            });
    2620        }
    27     })
    28 
    29 
    30 
    31     $(".settings-tabs .sortable" ).sortable({ handle: ".sort" });
    32 
    33 
    34     $(document).on('click','.settings-tabs .tab-nav',function(){
    35 
    36         $(this).parent().parent().children('.tab-navs').children('.tab-nav').removeClass('active');
    37 
    38         $(this).addClass('active');
    39 
    40         id = $(this).attr('data-id');
    41         $('input[name="tab"], input.current_tab').val(id);
    42 
    43 
    44         //console.log('Hello click');
    45         //console.log(id);
    46 
    47         $(this).parent().parent().children('.tab-content').removeClass('active');
    48         $(this).parent().parent().children('.tab-content#'+id).addClass('active');
    49 
    50         $(this).parent().parent().children('.settings-tabs-right-panel').children('.right-panel-content').removeClass('active');
    51         $(this).parent().parent().children('.settings-tabs-right-panel').children('.right-panel-content-'+id).addClass('active');
    52 
    53 
    54 
    55     })
    56 
    57 
    58 
    59     $(document).on('click','.settings-tabs .field-media-wrapper .clear ',function(e){
    60 
    61         $(this).parent().children().children('.media-preview').attr('src', '');
    62         $(this).parent().children().children('.media-title').html('');
    63         $(this).parent().children('.media-input-value').val('');
    64 
    65         placeholder = $(this).attr('placeholder');
    66         $(this).parent().children().children('.media-preview').attr('src', placeholder);
    67 
    68     })
    69 
    70     $(document).on('click','.settings-tabs .field-media-wrapper .media-upload',function(e){
    71         var side_uploader;
    72         this_ = $(this);
    73         //alert(target_input);
    74         e.preventDefault();
    75         //If the uploader object has already been created, reopen the dialog
    76         if (side_uploader) {
     21
     22
     23        $(document).on("keyup", ".text-icon input", function () {
     24            val = $(this).val();
     25            if (val) {
     26                $(this).parent().children(".icon").html(val);
     27            }
     28        })
     29
     30        if ($('.code-editor').length) {
     31            wp.codeEditor.initialize($('.code-editor'), { type: "text/javascript" });
     32        }
     33        if ($('.css_editor').length) {
     34            wp.codeEditor.initialize($('.css_editor'), { type: "text/css" });
     35        }
     36
     37
     38
     39
     40
     41        $(document).on("change", ".range", function () {
     42            val = $(this).val();
     43            if (val) {
     44                $(this).parent().children(".range-value").html(val);
     45            }
     46        })
     47
     48        $(".settings-tabs .accordion[sortable='true']").sortable({
     49            axis: "y",
     50            handle: "h3",
     51            stop: function (event, ui) {
     52                // IE doesn't register the blur when sorting
     53                // so trigger focusout handlers to remove .ui-state-focus
     54                ui.item.children("h3").triggerHandler("focusout");
     55
     56                // Refresh accordion to handle new order
     57                $(this).accordion("refresh");
     58            }
     59        })
     60
     61
     62
     63        $(".settings-tabs .sortable").sortable({ handle: ".sort" });
     64
     65
     66        $(document).on('click', '.settings-tabs .tab-nav', function () {
     67
     68            $(this).parent().parent().children('.tab-navs').children('.tab-nav').removeClass('active');
     69
     70            $(this).addClass('active');
     71
     72            id = $(this).attr('data-id');
     73            $('input[name="tab"], input.current_tab').val(id);
     74
     75
     76
     77
     78            $(this).parent().parent().children('.tab-content').removeClass('active');
     79            $(this).parent().parent().children('.tab-content#' + id).addClass('active');
     80
     81            $(this).parent().parent().children('.settings-tabs-right-panel').children('.right-panel-content').removeClass('active');
     82            $(this).parent().parent().children('.settings-tabs-right-panel').children('.right-panel-content-' + id).addClass('active');
     83
     84
     85
     86        })
     87
     88
     89
     90        $(document).on('click', '.settings-tabs .field-media-wrapper .clear ', function (e) {
     91
     92            $(this).parent().children().children('.media-preview').attr('src', '');
     93            $(this).parent().children().children('.media-title').html('');
     94            $(this).parent().children('.media-input-value').val('');
     95
     96            placeholder = $(this).attr('placeholder');
     97            $(this).parent().children().children('.media-preview').attr('src', placeholder);
     98
     99        })
     100
     101        $(document).on('click', '.settings-tabs .field-media-wrapper .media-upload', function (e) {
     102            var side_uploader;
     103            this_ = $(this);
     104            //alert(target_input);
     105            e.preventDefault();
     106            //If the uploader object has already been created, reopen the dialog
     107            if (side_uploader) {
     108                side_uploader.open();
     109                return;
     110            }
     111            //Extend the wp.media object
     112            side_uploader = wp.media.frames.file_frame = wp.media({
     113                title: 'Choose Image',
     114                button: {
     115                    text: 'Choose Image'
     116                },
     117                multiple: false
     118            });
     119            //When a file is selected, grab the URL and set it as the text field's value
     120            side_uploader.on('select', function () {
     121                attachment = side_uploader.state().get('selection').first().toJSON();
     122
     123                attachmentId = attachment.id;
     124
     125                src_url = attachment.url;
     126                src_filename = attachment.filename;
     127
     128
     129
     130                $(this_).prev().val(attachmentId);
     131
     132                $(this_).parent().children('.media-preview-wrap').children('img').attr('src', src_url);
     133                $(this_).parent().children().children('.media-title').html(src_filename);
     134            });
     135
     136            //Open the uploader dialog
    77137            side_uploader.open();
    78             return;
     138
     139        })
     140
     141
     142
     143        $(document).on('click', '.settings-tabs .field-media-url-wrapper .media-upload', function (e) {
     144            var side_uploader;
     145            this_ = $(this);
     146            //alert(target_input);
     147            e.preventDefault();
     148            //If the uploader object has already been created, reopen the dialog
     149            if (side_uploader) {
     150                side_uploader.open();
     151                return;
     152            }
     153            //Extend the wp.media object
     154            side_uploader = wp.media.frames.file_frame = wp.media({
     155                title: 'Choose Image',
     156                button: {
     157                    text: 'Choose Image'
     158                },
     159                multiple: false
     160            });
     161            //When a file is selected, grab the URL and set it as the text field's value
     162            side_uploader.on('select', function () {
     163                attachment = side_uploader.state().get('selection').first().toJSON();
     164
     165                attachmentId = attachment.id;
     166                src_url = attachment.url;
     167
     168
     169                $(this_).prev().val(src_url);
     170
     171                $(this_).parent().children('.media-preview-wrap').children('img').attr('src', src_url);
     172
     173            });
     174
     175            //Open the uploader dialog
     176            side_uploader.open();
     177
     178        })
     179
     180
     181        $(document).on('click', '.settings-tabs .field-media-url-wrapper .clear', function (e) {
     182            $(this).parent().children('.media-preview-wrap').children('img').attr('src', '');
     183            $(this).parent().children('input').val('');
     184
     185
     186        })
     187
     188
     189        jQuery(document).on('click', '.settings-tabs .input-text-multi-wrapper .add-item', function () {
     190
     191            dataName = $(this).attr('data-name');
     192            dataSort = $(this).attr('data-sort');
     193            dataClone = $(this).attr('data-clone');
     194            dataPlaceholder = $(this).attr('data-placeholder');
     195
     196            html = '<div class="item">';
     197            html += '<input  type="text" name="' + dataName + '" placeholder="' + dataPlaceholder + '" />';
     198
     199            if (dataClone) {
     200                html += ' <span class="button clone"><i class="far fa-clone"></i></span>';
     201            }
     202
     203            if (dataSort) {
     204                html += ' <span class="button sort" ><i class="fas fa-arrows-alt"></i></span>';
     205            }
     206
     207
     208
     209
     210            html += ' <span class="button remove" onclick="jQuery(this).parent().remove()"><i class="fas fa-times"></i></span>';
     211            html += '</div>';
     212
     213
     214            jQuery(this).parent().children('.field-list').append(html);
     215
     216
     217
     218        })
     219
     220
     221        jQuery(document).on("click", ".settings-tabs .field-repeatable-wrapper .collapsible .header .title-text", function () {
     222            if (jQuery(this).parent().parent().hasClass("active")) {
     223                jQuery(this).parent().parent().removeClass("active");
     224            } else {
     225                jQuery(this).parent().parent().addClass("active");
     226                textarea_to_editor();
     227            }
     228        })
     229
     230        // jQuery(document).on("click", ".settings-tabs .field-repeatable-wrapper .add-repeat-field", function () {
     231        //     now = jQuery.now();
     232        //     add_html = $(this).attr('add_html');
     233
     234        //     //console.log($(this));
     235
     236        //     repeatable_html = add_html.replace(/TIMEINDEX/g, now);
     237
     238        //     $(this).parent().children('.repeatable-field-list').append(repeatable_html);
     239
     240        //     textarea_to_editor();
     241
     242
     243        // })
     244
     245
     246        document.querySelectorAll(".add-repeat-field").forEach(item => {
     247            item.addEventListener("click", function (e) {
     248                const timestamp = Date.now();
     249
     250                const wrapperid = e.target.getAttribute("data-wrapper-id");
     251                const add_html = e.target.getAttribute("data-add_html");
     252                repeatable_html = add_html.replace(/TIMEINDEX/g, timestamp);
     253
     254                console.log(wrapperid);
     255                console.log(repeatable_html);
     256
     257                e.target.parentElement.querySelector('.repeatable-field-list').insertAdjacentHTML('beforeend', repeatable_html);
     258                textarea_to_editor();
     259            });
     260        });
     261
     262
     263
     264
     265
     266
     267
     268
     269
     270        function textarea_to_editor() {
     271
     272            //textarea = $('.textarea-editor');
     273
     274            var textarea = document.getElementsByClassName("textarea-editor");
     275
     276            for (i = 0; i < textarea.length; i++) {
     277
     278                el_id = textarea[i].id;
     279                el_attr = textarea[i].getAttribute('editor_enabled');
     280
     281                //editor_enabled = $(this).attr('editor_enabled');
     282
     283
     284
     285
     286                if (el_attr == 'no' && typeof wp.editor != 'undefined') {
     287                    wp.editor.initialize(el_id, {
     288                        mediaButtons: true,
     289                        tinymce: {
     290                            wpautop: true,
     291                            toolbar1: 'bold italic underline strikethrough | bullist numlist | blockquote hr wp_more | alignleft aligncenter alignright | link unlink | fullscreen |  wp_adv',
     292                            toolbar2: 'formatselect alignjustify forecolor | pastetext removeformat charmap table | outdent indent | undo redo | wp_help',
     293
     294                        },
     295                        quicktags: true,
     296                    });
     297
     298                    textarea[i].setAttribute('editor_enabled', 'yes')
     299                    //$(this).attr('editor_enabled','yes');
     300                }
     301
     302
     303
     304            }
     305
    79306        }
    80         //Extend the wp.media object
    81         side_uploader = wp.media.frames.file_frame = wp.media({
    82             title: 'Choose Image',
    83             button: {
    84                 text: 'Choose Image'
    85             },
    86             multiple: false
    87         });
    88         //When a file is selected, grab the URL and set it as the text field's value
    89         side_uploader.on('select', function() {
    90             attachment = side_uploader.state().get('selection').first().toJSON();
    91 
    92             attachmentId = attachment.id;
    93 
    94             src_url = attachment.url;
    95             src_filename = attachment.filename;
    96 
    97             //console.log(attachment);
    98 
    99             $(this_).prev().val(attachmentId);
    100 
    101             $(this_).parent().children('.media-preview-wrap').children('img').attr('src',src_url);
    102             $(this_).parent().children().children('.media-title').html(src_filename);
    103         });
    104 
    105         //Open the uploader dialog
    106         side_uploader.open();
    107 
    108     })
    109 
    110 
    111 
    112     $(document).on('click','.settings-tabs .field-media-url-wrapper .media-upload',function(e){
    113         var side_uploader;
    114         this_ = $(this);
    115         //alert(target_input);
    116         e.preventDefault();
    117         //If the uploader object has already been created, reopen the dialog
    118         if (side_uploader) {
    119             side_uploader.open();
    120             return;
    121         }
    122         //Extend the wp.media object
    123         side_uploader = wp.media.frames.file_frame = wp.media({
    124             title: 'Choose Image',
    125             button: {
    126                 text: 'Choose Image'
    127             },
    128             multiple: false
    129         });
    130         //When a file is selected, grab the URL and set it as the text field's value
    131         side_uploader.on('select', function() {
    132             attachment = side_uploader.state().get('selection').first().toJSON();
    133 
    134             attachmentId = attachment.id;
    135             src_url = attachment.url;
    136             //console.log(attachment);
    137 
    138             $(this_).prev().val(src_url);
    139 
    140             $(this_).parent().children('.media-preview-wrap').children('img').attr('src',src_url);
    141 
    142         });
    143 
    144         //Open the uploader dialog
    145         side_uploader.open();
    146 
    147     })
    148 
    149 
    150     $(document).on('click','.settings-tabs .field-media-url-wrapper .clear',function(e){
    151         $(this).parent().children('.media-preview-wrap').children('img').attr('src','');
    152         $(this).parent().children('input').val('');
    153 
    154 
    155     })
    156 
    157 
    158     jQuery(document).on('click', '.settings-tabs .input-text-multi-wrapper .add-item',function(){
    159 
    160         dataName = $(this).attr('data-name');
    161         dataSort = $(this).attr('data-sort');
    162         dataClone = $(this).attr('data-clone');
    163         dataPlaceholder = $(this).attr('data-placeholder');
    164 
    165         html = '<div class="item">';
    166         html += '<input  type="text" name="'+dataName+'" placeholder="'+dataPlaceholder+'" />';
    167 
    168         if(dataClone){
    169             html += ' <span class="button clone"><i class="far fa-clone"></i></span>';
    170         }
    171 
    172         if(dataSort){
    173             html += ' <span class="button sort" ><i class="fas fa-arrows-alt"></i></span>';
    174         }
    175 
    176 
    177 
    178 
    179         html += ' <span class="button remove" onclick="jQuery(this).parent().remove()"><i class="fas fa-times"></i></span>';
    180         html += '</div>';
    181 
    182 
    183         jQuery(this).parent().children('.field-list').append(html);
    184 
    185 
    186 
    187     })
    188 
    189 
    190     jQuery(document).on("click", ".settings-tabs .field-repeatable-wrapper .collapsible .header .title-text", function() {
    191         if(jQuery(this).parent().parent().hasClass("active")){
    192             jQuery(this).parent().parent().removeClass("active");
    193         }else{
    194             jQuery(this).parent().parent().addClass("active");
    195             textarea_to_editor();
    196         }
    197     })
    198 
    199     jQuery(document).on("click", ".settings-tabs .field-repeatable-wrapper .add-repeat-field", function() {
    200         now = jQuery.now();
    201         add_html = $(this).attr('add_html');
    202 
    203         repeatable_html = add_html.replace(/TIMEINDEX/g, now);
    204 
    205         $(this).parent().children('.repeatable-field-list').append(repeatable_html);
    206 
    207         textarea_to_editor();
    208 
    209 
    210     })
    211 
    212 
    213     function textarea_to_editor(){
    214 
    215         //textarea = $('.textarea-editor');
    216 
    217         var textarea = document.getElementsByClassName("textarea-editor");
    218 
    219         for (i = 0; i < textarea.length; i++) {
    220 
    221             el_id = textarea[i].id;
    222             el_attr = textarea[i].getAttribute('editor_enabled');
    223 
    224             //editor_enabled = $(this).attr('editor_enabled');
    225 
    226 
    227             //console.log(typeof wp.editor);
    228 
    229             if(el_attr == 'no' && typeof wp.editor != 'undefined'){
    230                 wp.editor.initialize( el_id, {
     307
     308        $(document).on('click', '.settings-tabs .textarea-editor', function () {
     309
     310            id = $(this).attr('id');
     311            editor_enabled = $(this).attr('editor_enabled');
     312
     313
     314
     315
     316            if (editor_enabled == 'no' && typeof wp.editor != 'undefined') {
     317                wp.editor.initialize(id, {
    231318                    mediaButtons: true,
    232319                    tinymce: {
    233320                        wpautop: true,
    234                         toolbar1: 'bold italic underline strikethrough | bullist numlist | blockquote hr wp_more | alignleft aligncenter alignright | link unlink | fullscreen |  wp_adv',
    235                         toolbar2: 'formatselect alignjustify forecolor | pastetext removeformat charmap table | outdent indent | undo redo | wp_help',
    236 
     321                        toolbar1: 'bold italic underline strikethrough | bullist numlist | blockquote hr wp_more | alignleft aligncenter alignright | link unlink | fullscreen | wp_adv',
     322                        toolbar2: 'formatselect alignjustify forecolor | pastetext removeformat charmap table | outdent indent | undo redo | wp_help'
    237323                    },
    238                     quicktags:    true,
    239                 } );
    240 
    241                 textarea[i].setAttribute('editor_enabled','yes')
    242                 //$(this).attr('editor_enabled','yes');
    243             }
    244 
    245 
    246 
    247         }
    248 
    249     }
    250 
    251     $(document).on('click','.settings-tabs .textarea-editor',function(){
    252 
    253         id = $(this).attr('id');
    254         editor_enabled = $(this).attr('editor_enabled');
    255 
    256 
    257         //console.log(typeof wp.editor);
    258 
    259         if(editor_enabled == 'no' && typeof wp.editor != 'undefined'){
    260             wp.editor.initialize( id, {
    261                 mediaButtons: true,
    262                 tinymce: {
    263                     wpautop: true,
    264                     toolbar1: 'bold italic underline strikethrough | bullist numlist | blockquote hr wp_more | alignleft aligncenter alignright | link unlink | fullscreen | wp_adv',
    265                     toolbar2: 'formatselect alignjustify forecolor | pastetext removeformat charmap table | outdent indent | undo redo | wp_help'
    266                 },
    267                 quicktags:    true,
    268             } );
    269 
    270             $(this).attr('editor_enabled','yes');
    271         }
    272 
    273     })
    274 
    275     jQuery(document).on("click", ".settings-tabs .select-reset", function() {
    276 
    277         $(this).prev('select').val('');
    278 
    279     })
    280 
    281 
    282 
    283 
    284 
    285 
    286     $(document).on('click', '.settings-tabs .expandable .expand', function(){
    287         if($(this).parent().parent().children('.options').hasClass('active')){
    288             //$(this).parent().parent().removeClass('active');
    289             $(this).parent().parent().children('.options').removeClass('active');
    290         }else {
    291             //$(this).parent().parent().addClass('active');
    292             $(this).parent().parent().children('.options').addClass('active');
    293         }
    294 
    295 
    296     })
    297 
    298     // radio-img
    299 
    300     $(document).on("click", ".radio-img label", function () {
    301         if($(this).hasClass('disabled')){
    302             return;
    303         }
    304 
    305         $(this).parent().children("label").removeClass("active");
    306         $(this).addClass("active");
    307 
    308     })
    309 
    310     $(function() {
    311         $('.lazy').Lazy();
     324                    quicktags: true,
     325                });
     326
     327                $(this).attr('editor_enabled', 'yes');
     328            }
     329
     330        })
     331
     332        jQuery(document).on("click", ".settings-tabs .select-reset", function () {
     333
     334            $(this).prev('select').val('');
     335
     336        })
     337
     338
     339
     340
     341
     342
     343        $(document).on('click', '.settings-tabs .expandable .expand', function () {
     344            if ($(this).parent().parent().children('.options').hasClass('active')) {
     345                //$(this).parent().parent().removeClass('active');
     346                $(this).parent().parent().children('.options').removeClass('active');
     347            } else {
     348                //$(this).parent().parent().addClass('active');
     349                $(this).parent().parent().children('.options').addClass('active');
     350            }
     351
     352
     353        })
     354
     355        // radio-img
     356
     357        $(document).on("click", ".radio-img label", function () {
     358            if ($(this).hasClass('disabled')) {
     359                return;
     360            }
     361
     362            $(this).parent().children("label").removeClass("active");
     363            $(this).addClass("active");
     364
     365        })
     366
     367        $(function () {
     368            //$('.lazy').Lazy();
     369        });
     370
     371
     372
    312373    });
    313 
    314 
    315 
    316 });
     374})(jQuery);

  • social-share-button/trunk/includes/class-migrate.php

    r2076431 r3428462  
    1212    public function __construct(){
    1313
    14         add_action('admin_notices', array($this, 'migrate_admin_notices'));
    15         add_action('admin_notices', array($this, 'migrate_admin_notices_settings'));
     14        //add_action('admin_notices', array($this, 'migrate_admin_notices'));
     15        //add_action('admin_notices', array($this, 'migrate_admin_notices_settings'));
    1616
    1717        }
    … …  
    2929        if($social_share_button_migrate_2_1_1!='done'):
    3030        ?>
    31         <div class="update-nag"><strong>Social Share Button</strong> plugin need to <a href="<?php echo admin_url().'admin.php?page=social_share_button_migrate&_wpnonce='.$nonce; ?>">update data</a>
     31        <div class="update-nag"><strong>Social Share Button</strong> plugin need to <a href="<?php echo esc_url(admin_url().'admin.php?page=social_share_button_migrate&_wpnonce='.$nonce); ?>">update data</a>
    3232
    3333
    … …  
    5050        if($social_share_button_migrate_2_1_6!='done'):
    5151            ?>
    52             <div class="update-nag"><strong>Social Share Button</strong> plugin need to <a href="<?php echo admin_url().'admin.php?page=social_share_button_migrate_settings&_wpnonce='.$nonce; ?>">update settings</a>
     52            <div class="update-nag"><strong>Social Share Button</strong> plugin need to <a href="<?php echo esc_url(admin_url().'admin.php?page=social_share_button_migrate_settings&_wpnonce='.$nonce); ?>">update settings</a>
    5353
    5454

  • social-share-button/trunk/includes/class-settings-tabs.php

    r2517096 r3428462  
    11<?php
    2 if ( ! defined('ABSPATH')) exit;  // if direct access
    3 
    4 if( ! class_exists( 'settings_tabs_field' ) ) {
    5 class settings_tabs_field{
     2if (!defined('ABSPATH')) exit;  // if direct access
     3if (!class_exists('settings_tabs_field')) {
     4  class settings_tabs_field
     5  {
     6
     7    public function allowed()
     8    {
     9
     10      return  wp_kses_allowed_html('post');
     11    }
     12    public $custom = array(
     13      'select' => array(
     14        'name'     => true,
     15        'id'       => true,
     16        'class'    => true,
     17        'multiple' => true,
     18      ),
     19      'option' => array(
     20        'value'    => true,
     21        'selected' => true,
     22      ),
     23      'optgroup' => array(
     24        'label' => true,
     25      ),
     26      'input' => array(
     27        'type'  => true,
     28        'name'  => true,
     29        'value' => true,
     30        'class' => true,
     31        'id'    => true,
     32        'checked' => true,
     33        'placeholder' => true,
     34      ),
     35      'label' => array(
     36        'for'   => true,
     37        'class' => true,
     38      ),
     39    );
     40
     41    public function allowed_html()
     42    {
     43
     44      return  array_merge($this->allowed(), $this->custom);
     45    }
     46
    647
    748    //public $asset_dir_url = '';
    8     public $textdomain = 'settings-tabs';
    9 
    10     public function __construct(){
    11 
    12 //        $this->asset_dir_url = isset($args['asset_dir_url']) ? $args['asset_dir_url'] : '';
    13 //        $this->textdomain = isset($args['textdomain']) ? $args['textdomain'] : '';
    14 
    15     }
    16 
    17 
    18     function admin_scripts(){
    19 
    20 
    21         wp_enqueue_script('jquery');
    22         wp_enqueue_script('jquery-ui-sortable');
    23         wp_enqueue_script( 'jquery-ui-core' );
    24         wp_enqueue_script('jquery-ui-accordion');
    25         wp_enqueue_style( 'jquery-ui');
    26 
    27         wp_enqueue_script('wp-color-picker');
    28         wp_enqueue_style( 'wp-color-picker' );
    29 
    30 
    31         wp_enqueue_style( 'font-awesome-5' );
    32 
    33         wp_enqueue_style( 'settings-tabs' );
    34         wp_enqueue_script( 'settings-tabs' );
    35 
    36         wp_enqueue_script( 'code-editor' );
    37         wp_enqueue_style( 'code-editor' );
    38 
    39         wp_enqueue_script( 'jquery.lazy' );
    40 
    41         if (function_exists('wp_enqueue_editor')) {
    42             wp_enqueue_editor();
    43         }
    44 
    45 
    46     }
    47 
    48     function field_template($option){
    49 
    50         $id             = isset( $option['id'] ) ? $option['id'] : "";
    51         $wraper_class           = isset( $option['wraper_class'] ) ? $option['wraper_class'] : "";
    52         $conditions     = isset( $option['conditions'] ) ? $option['conditions'] : array();
    53 
    54         $is_error           = isset( $option['is_error'] ) ? $option['is_error'] : false;
    55         $error_details          = isset( $option['error_details'] ) ? $option['error_details'] : '';
    56 
    57 
    58 
    59         if(!empty($conditions)):
    60 
    61             $depends = '';
    62 
    63             $field = isset($conditions['field']) ? $conditions['field'] :'';
    64             $cond_value = isset($conditions['value']) ? $conditions['value']: '';
    65             $type = isset($conditions['type']) ? $conditions['type'] : '';
    66             $pattern = isset($conditions['pattern']) ? $conditions['pattern'] : '';
    67             $modifier = isset($conditions['modifier']) ? $conditions['modifier'] : '';
    68             $like = isset($conditions['like']) ? $conditions['like'] : '';
    69             $strict = isset($conditions['strict']) ? $conditions['strict'] : '';
    70             $empty = isset($conditions['empty']) ? $conditions['empty'] : '';
    71             $sign = isset($conditions['sign']) ? $conditions['sign'] : '';
    72             $min = isset($conditions['min']) ? $conditions['min'] : '';
    73             $max = isset($conditions['max']) ? $conditions['max'] : '';
    74 
    75             $depends .= "{'[name=$field]':";
    76             $depends .= '{';
    77 
    78             if(!empty($type)):
    79                 $depends .= "'type':";
    80                 $depends .= "'".$type."'";
    81             endif;
    82 
    83             if(!empty($modifier)):
    84                 $depends .= ",'modifier':";
    85                 $depends .= "'".$modifier."'";
    86             endif;
    87 
    88             if(!empty($like)):
    89                 $depends .= ",'like':";
    90                 $depends .= "'".$like."'";
    91             endif;
    92 
    93             if(!empty($strict)):
    94                 $depends .= ",'strict':";
    95                 $depends .= "'".$strict."'";
    96             endif;
    97 
    98             if(!empty($empty)):
    99                 $depends .= ",'empty':";
    100                 $depends .= "'".$empty."'";
    101             endif;
    102 
    103             if(!empty($sign)):
    104                 $depends .= ",'sign':";
    105                 $depends .= "'".$sign."'";
    106             endif;
    107 
    108             if(!empty($min)):
    109                 $depends .= ",'min':";
    110                 $depends .= "'".$min."'";
    111             endif;
    112 
    113             if(!empty($max)):
    114                 $depends .= ",'max':";
    115                 $depends .= "'".$max."'";
    116             endif;
    117             if(!empty($cond_value)):
    118                 $depends .= ",'value':";
    119                 if(is_array($cond_value)):
    120                     $count= count($cond_value);
    121                     $i = 1;
    122                     $depends .= "[";
    123                     foreach ($cond_value as $val):
    124                         $depends .= "'".$val."'";
    125                         if($i<$count)
    126                             $depends .= ",";
    127                         $i++;
    128                     endforeach;
    129                     $depends .= "]";
    130                 else:
    131                     $depends .= "[";
    132                     $depends .= "'".$cond_value."'";
    133                     $depends .= "]";
     49    public function __construct() {}
     50
     51
     52
     53
     54
     55
     56
     57
     58
     59    function admin_scripts()
     60    {
     61      wp_enqueue_script('jquery');
     62      wp_enqueue_script('jquery-ui-sortable');
     63      wp_enqueue_script('jquery-ui-core');
     64      wp_enqueue_script('jquery-ui-accordion');
     65      wp_enqueue_style('jquery-ui');
     66      wp_enqueue_script('wp-color-picker');
     67      wp_enqueue_style('wp-color-picker');
     68      wp_enqueue_style('select2');
     69      wp_enqueue_script('select2');
     70      wp_enqueue_style('font-awesome-5');
     71      wp_enqueue_style('settings-tabs');
     72      wp_enqueue_script('settings-tabs');
     73      wp_enqueue_script('code-editor');
     74      wp_enqueue_style('code-editor');
     75      wp_enqueue_script('jquery.lazy');
     76      wp_enqueue_script('jquery-ui-datepicker');
     77
     78      if (function_exists('wp_enqueue_editor')) {
     79        wp_enqueue_editor();
     80      }
     81    }
     82    function field_template($option)
     83    {
     84      $id             = isset($option['id']) ? $option['id'] : "";
     85      $wraper_class            = isset($option['wraper_class']) ? $option['wraper_class'] : "";
     86      $conditions     = isset($option['conditions']) ? $option['conditions'] : array();
     87      $is_error             = isset($option['is_error']) ? $option['is_error'] : false;
     88      $error_details             = isset($option['error_details']) ? $option['error_details'] : '';
     89      if (!empty($conditions)) :
     90        $depends = '';
     91        $field = isset($conditions['field']) ? $conditions['field'] : '';
     92        $cond_value = isset($conditions['value']) ? $conditions['value'] : '';
     93        $type = isset($conditions['type']) ? $conditions['type'] : '';
     94        $pattern = isset($conditions['pattern']) ? $conditions['pattern'] : '';
     95        $modifier = isset($conditions['modifier']) ? $conditions['modifier'] : '';
     96        $like = isset($conditions['like']) ? $conditions['like'] : '';
     97        $strict = isset($conditions['strict']) ? $conditions['strict'] : '';
     98        $empty = isset($conditions['empty']) ? $conditions['empty'] : '';
     99        $sign = isset($conditions['sign']) ? $conditions['sign'] : '';
     100        $min = isset($conditions['min']) ? $conditions['min'] : '';
     101        $max = isset($conditions['max']) ? $conditions['max'] : '';
     102        $depends .= "{'[name=$field]':";
     103        $depends .= '{';
     104        if (!empty($type)) :
     105          $depends .= "'type':";
     106          $depends .= "'" . $type . "'";
     107        endif;
     108        if (!empty($modifier)) :
     109          $depends .= ",'modifier':";
     110          $depends .= "'" . $modifier . "'";
     111        endif;
     112        if (!empty($like)) :
     113          $depends .= ",'like':";
     114          $depends .= "'" . $like . "'";
     115        endif;
     116        if (!empty($strict)) :
     117          $depends .= ",'strict':";
     118          $depends .= "'" . $strict . "'";
     119        endif;
     120        if (!empty($empty)) :
     121          $depends .= ",'empty':";
     122          $depends .= "'" . $empty . "'";
     123        endif;
     124        if (!empty($sign)) :
     125          $depends .= ",'sign':";
     126          $depends .= "'" . $sign . "'";
     127        endif;
     128        if (!empty($min)) :
     129          $depends .= ",'min':";
     130          $depends .= "'" . $min . "'";
     131        endif;
     132        if (!empty($max)) :
     133          $depends .= ",'max':";
     134          $depends .= "'" . $max . "'";
     135        endif;
     136        if (!empty($cond_value)) :
     137          $depends .= ",'value':";
     138          if (is_array($cond_value)) :
     139            $count = count($cond_value);
     140            $i = 1;
     141            $depends .= "[";
     142            foreach ($cond_value as $val) :
     143              $depends .= "'" . $val . "'";
     144              if ($i < $count)
     145                $depends .= ",";
     146              $i++;
     147            endforeach;
     148            $depends .= "]";
     149          else :
     150            $depends .= "[";
     151            $depends .= "'" . $cond_value . "'";
     152            $depends .= "]";
     153          endif;
     154        endif;
     155        $depends .= '}}';
     156      endif;
     157      ob_start();
     158?>
     159      <div <?php if (!empty($depends)) { ?> data-depends="[<?php echo esc_attr($depends); ?>]" <?php } ?> class="setting-field <?php if ($is_error) echo 'field-error';  ?> <?php echo esc_attr($wraper_class); ?> <?php if (!empty($depends)) echo 'dependency-field'; ?>">
     160        <div class="field-lable ">%s</div>
     161        <div class="field-input">%s
     162          <p class="description">%s</p>
     163          <?php if ($is_error && !empty($error_details)) : ?>
     164            <p class="error-details"><i class="fas fa-exclamation-circle"></i> <?php echo esc_html($error_details); ?></p>
     165          <?php endif; ?>
     166        </div>
     167      </div>
     168    <?php
     169      return ob_get_clean();
     170    }
     171    function generate_field($option)
     172    {
     173      $id         = isset($option['id']) ? $option['id'] : "";
     174      $type         = isset($option['type']) ? $option['type'] : "";
     175      $details     = isset($option['details']) ? $option['details'] : "";
     176      if (empty($id)) return;
     177      if (isset($option['type']) && $option['type'] === 'select')                 $this->field_select($option);
     178      elseif (isset($option['type']) && $option['type'] === 'select2')            $this->field_select2($option);
     179      elseif (isset($option['type']) && $option['type'] === 'checkbox')            $this->field_checkbox($option);
     180      elseif (isset($option['type']) && $option['type'] === 'radio')                $this->field_radio($option);
     181      elseif (isset($option['type']) && $option['type'] === 'radio_image')        $this->field_radio_image($option);
     182      elseif (isset($option['type']) && $option['type'] === 'textarea')            $this->field_textarea($option);
     183      elseif (isset($option['type']) && $option['type'] === 'scripts_js')            $this->field_scripts_js($option);
     184      elseif (isset($option['type']) && $option['type'] === 'scripts_css')        $this->field_scripts_css($option);
     185      elseif (isset($option['type']) && $option['type'] === 'number')             $this->field_number($option);
     186      elseif (isset($option['type']) && $option['type'] === 'text')                 $this->field_text($option);
     187      elseif (isset($option['type']) && $option['type'] === 'text_icon')         $this->field_text_icon($option);
     188      elseif (isset($option['type']) && $option['type'] === 'text_multi')         $this->field_text_multi($option);
     189      elseif (isset($option['type']) && $option['type'] === 'hidden')             $this->field_hidden($option);
     190      elseif (isset($option['type']) && $option['type'] === 'range')             $this->field_range($option);
     191      elseif (isset($option['type']) && $option['type'] === 'colorpicker')        $this->field_colorpicker($option);
     192      elseif (isset($option['type']) && $option['type'] === 'colorpicker_multi')  $this->field_colorpicker_multi($option);
     193      elseif (isset($option['type']) && $option['type'] === 'datepicker')            $this->field_datepicker($option);
     194      elseif (isset($option['type']) && $option['type'] === 'faq')                $this->field_faq($option);
     195      elseif (isset($option['type']) && $option['type'] === 'addons_grid')        $this->field_addons_grid($option);
     196      elseif (isset($option['type']) && $option['type'] === 'custom_html')        $this->field_custom_html($option);
     197      elseif (isset($option['type']) && $option['type'] === 'repeatable')            $this->field_repeatable($option);
     198      elseif (isset($option['type']) && $option['type'] === 'media')                $this->field_media($option);
     199      elseif (isset($option['type']) && $option['type'] === 'media_url')            $this->field_media_url($option);
     200      elseif (isset($option['type']) && $option['type'] === 'option_group')        $this->field_option_group($option);
     201      elseif (isset($option['type']) && $option['type'] === 'option_group_accordion')        $this->field_option_group_accordion($option);
     202      elseif (isset($option['type']) && $option['type'] === 'wp_editor')        $this->field_wp_editor($option);
     203      elseif (isset($option['type']) && $option['type'] === 'textarea_editor')        $this->field_textarea_editor($option);
     204      elseif (isset($option['type']) && $option['type'] === $type)     do_action("settings_tabs_field_$type", $option);
     205    }
     206    public function field_option_group_accordion($option)
     207    {
     208      $id             = isset($option['id']) ? $option['id'] : "";
     209      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     210      $sortable             = isset($option['sortable']) ? $option['sortable'] : false;
     211      $args_index     = isset($option['args_index']) ? $option['args_index'] : array();
     212      $args_index_default     = isset($option['args_index_default']) ? $option['args_index_default'] : array();
     213      $args_index_hide     = isset($option['args_index_hide']) ? $option['args_index_hide'] : array();
     214      $args_index = !empty($args_index) ? $args_index : $args_index_default;
     215      $args     = isset($option['args']) ? $option['args'] : array();
     216      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     217      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     218      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     219      $title            = isset($option['title']) ? $option['title'] : "";
     220      $group_details             = isset($option['details']) ? $option['details'] : "";
     221      if ($is_pro == true) {
     222        $group_details = '<span class="pro-feature">' . $pro_text . '</span> ' . $group_details;
     223      }
     224      ob_start();
     225    ?>
     226      <div class="option-group-accordion-wrap" id="<?php echo esc_attr($css_id); ?>">
     227        <div sortable="<?php echo esc_attr($sortable) ? 'true' :  'false'; ?>" class='option-group-accordion accordion'>
     228          <?php
     229          if (!empty($args_index))
     230            foreach ($args_index as $index) :
     231              //foreach( $args as $key => $value ):
     232              $group_title = isset($args[$index]['title']) ? $args[$index]['title'] : '';
     233              $is_hide = isset($args_index_hide[$index]) ? $args_index_hide[$index] : false;
     234              //$link = $value['link'];
     235              $options = isset($args[$index]['options']) ? $args[$index]['options'] : array();
     236          ?>
     237            <div class="group">
     238              <h3 class="accordion-title">
     239                <?php if ($sortable) : ?>
     240                  <span class="sort"><i class="fas fa-sort"></i></span>
     241                <?php endif; ?>
     242                <span class="title-text"><?php echo esc_html($group_title); ?></span>
     243              </h3>
     244              <div class="accordion-content">
     245                <?php
     246                if (!empty($options)) :
     247                  foreach ($options as $option) :
     248                    $id         = isset($option['id']) ? $option['id'] : "";
     249                    $type         = isset($option['type']) ? $option['type'] : "";
     250                    $details     = isset($option['details']) ? $option['details'] : "";
     251                    if (isset($option['type']) && $option['type'] === 'select')                 $this->field_select($option);
     252                    elseif (isset($option['type']) && $option['type'] === 'select2')            $this->field_select2($option);
     253                    elseif (isset($option['type']) && $option['type'] === 'checkbox')            $this->field_checkbox($option);
     254                    elseif (isset($option['type']) && $option['type'] === 'radio')                $this->field_radio($option);
     255                    elseif (isset($option['type']) && $option['type'] === 'radio_image')        $this->field_radio_image($option);
     256                    elseif (isset($option['type']) && $option['type'] === 'textarea')            $this->field_textarea($option);
     257                    elseif (isset($option['type']) && $option['type'] === 'scripts_js')            $this->field_scripts_js($option);
     258                    elseif (isset($option['type']) && $option['type'] === 'scripts_css')        $this->field_scripts_css($option);
     259                    elseif (isset($option['type']) && $option['type'] === 'number')             $this->field_number($option);
     260                    elseif (isset($option['type']) && $option['type'] === 'text')                 $this->field_text($option);
     261                    elseif (isset($option['type']) && $option['type'] === 'text_icon')         $this->field_text_icon($option);
     262                    elseif (isset($option['type']) && $option['type'] === 'text_multi')         $this->field_text_multi($option);
     263                    elseif (isset($option['type']) && $option['type'] === 'hidden')                 $this->field_hidden($option);
     264                    elseif (isset($option['type']) && $option['type'] === 'range')             $this->field_range($option);
     265                    elseif (isset($option['type']) && $option['type'] === 'colorpicker')        $this->field_colorpicker($option);
     266                    elseif (isset($option['type']) && $option['type'] === 'colorpicker_multi')  $this->field_colorpicker_multi($option);
     267                    elseif (isset($option['type']) && $option['type'] === 'datepicker')            $this->field_datepicker($option);
     268                    elseif (isset($option['type']) && $option['type'] === 'faq')                $this->field_faq($option);
     269                    elseif (isset($option['type']) && $option['type'] === 'addons_grid')        $this->field_addons_grid($option);
     270                    elseif (isset($option['type']) && $option['type'] === 'custom_html')        $this->field_custom_html($option);
     271                    elseif (isset($option['type']) && $option['type'] === 'repeatable')            $this->field_repeatable($option);
     272                    elseif (isset($option['type']) && $option['type'] === 'media')                $this->field_media($option);
     273                    elseif (isset($option['type']) && $option['type'] === 'media_url')            $this->field_media_url($option);
     274                  endforeach;
    134275                endif;
    135             endif;
    136             $depends .= '}}';
    137 
     276                ?>
     277              </div> <!-- ..accordion-content -->
     278            </div><!-- .group -->
     279          <?php
     280            //endforeach;
     281            endforeach;
     282          ?>
     283        </div> <!-- .option-group-accordion -->
     284      </div><!-- .option-group-accordion-wrap -->
     285    <?php
     286      $input_html = ob_get_clean();
     287      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($group_details)));
     288    }
     289    public function field_option_group($option)
     290    {
     291      $id             = isset($option['id']) ? $option['id'] : "";
     292      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     293      $options     = isset($option['options']) ? $option['options'] : array();
     294      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     295      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     296      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     297      $title            = isset($option['title']) ? $option['title'] : "";
     298      $group_details             = isset($option['details']) ? $option['details'] : "";
     299      if ($is_pro == true) {
     300        $group_details = '<span class="pro-feature">' . $pro_text . '</span> ' . $group_details;
     301      }
     302      ob_start();
     303    ?>
     304      <div id="<?php echo esc_attr($css_id); ?>">
     305        <?php
     306        if (!empty($options)) :
     307          foreach ($options as $option) :
     308            $id         = isset($option['id']) ? $option['id'] : "";
     309            $type         = isset($option['type']) ? $option['type'] : "";
     310            $details     = isset($option['details']) ? $option['details'] : "";
     311            if (isset($option['type']) && $option['type'] === 'select')                 $this->field_select($option);
     312            elseif (isset($option['type']) && $option['type'] === 'select2')            $this->field_select2($option);
     313            elseif (isset($option['type']) && $option['type'] === 'checkbox')            $this->field_checkbox($option);
     314            elseif (isset($option['type']) && $option['type'] === 'radio')                $this->field_radio($option);
     315            elseif (isset($option['type']) && $option['type'] === 'radio_image')        $this->field_radio_image($option);
     316            elseif (isset($option['type']) && $option['type'] === 'textarea')            $this->field_textarea($option);
     317            elseif (isset($option['type']) && $option['type'] === 'scripts_js')            $this->field_scripts_js($option);
     318            elseif (isset($option['type']) && $option['type'] === 'scripts_css')        $this->field_scripts_css($option);
     319            elseif (isset($option['type']) && $option['type'] === 'number')             $this->field_number($option);
     320            elseif (isset($option['type']) && $option['type'] === 'text')                 $this->field_text($option);
     321            elseif (isset($option['type']) && $option['type'] === 'text_icon')         $this->field_text_icon($option);
     322            elseif (isset($option['type']) && $option['type'] === 'text_multi')         $this->field_text_multi($option);
     323            elseif (isset($option['type']) && $option['type'] === 'hidden')             $this->field_hidden($option);
     324            elseif (isset($option['type']) && $option['type'] === 'range')             $this->field_range($option);
     325            elseif (isset($option['type']) && $option['type'] === 'colorpicker')        $this->field_colorpicker($option);
     326            elseif (isset($option['type']) && $option['type'] === 'colorpicker_multi')  $this->field_colorpicker_multi($option);
     327            elseif (isset($option['type']) && $option['type'] === 'datepicker')            $this->field_datepicker($option);
     328            elseif (isset($option['type']) && $option['type'] === 'faq')                $this->field_faq($option);
     329            elseif (isset($option['type']) && $option['type'] === 'addons_grid')        $this->field_addons_grid($option);
     330            elseif (isset($option['type']) && $option['type'] === 'custom_html')        $this->field_custom_html($option);
     331            elseif (isset($option['type']) && $option['type'] === 'repeatable')            $this->field_repeatable($option);
     332            elseif (isset($option['type']) && $option['type'] === 'media')                $this->field_media($option);
     333            elseif (isset($option['type']) && $option['type'] === 'media_url')            $this->field_media_url($option);
     334          endforeach;
    138335        endif;
    139 
    140 
    141 
    142         ob_start();
    143 
    144336        ?>
    145         <div <?php if(!empty($depends)) {?> data-depends="[<?php echo $depends; ?>]" <?php } ?> class="setting-field <?php if($is_error) echo 'field-error';  ?> <?php echo $wraper_class; ?> <?php if(!empty($depends)) echo 'dependency-field'; ?>">
    146             <div class="field-lable">%s</div>
    147             <div class="field-input">%s
    148                 <p class="description">%s</p>
    149                 <?php if($is_error && !empty($error_details)): ?>
    150                     <p class="error-details"><i class="fas fa-exclamation-circle"></i> <?php echo $error_details; ?></p>
    151                 <?php endif; ?>
    152 
    153             </div>
     337      </div>
     338    <?php
     339      $input_html = ob_get_clean();
     340      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($group_details)), $this->allowed_html());
     341    }
     342    public function field_media($option)
     343    {
     344      $id            = isset($option['id']) ? $option['id'] : "";
     345      if (empty($id)) return;
     346      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     347      $field_name     = isset($option['field_name']) ? $option['field_name'] : $id;
     348      $parent             = isset($option['parent']) ? $option['parent'] : "";
     349      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     350      $title            = isset($option['title']) ? $option['title'] : "";
     351      $placeholder    = isset($option['placeholder']) ? $option['placeholder'] : "";
     352      $details             = isset($option['details']) ? $option['details'] : "";
     353      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     354      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     355      $default            = isset($option['default']) ? $option['default'] : '';
     356      $value            = isset($option['value']) ? $option['value'] : '';
     357      $value          = !empty($value) ?  $value : $default;
     358      $media_url    = wp_get_attachment_url($value);
     359      $media_type    = get_post_mime_type($value);
     360      $media_title = !empty($value) ? get_the_title($value) : "Placeholder";
     361      $media_url = !empty($media_url) ? $media_url : $default;
     362      $media_url = !empty($media_url) ? $media_url : $placeholder;
     363      $media_basename = wp_basename($media_type);
     364      $field_name     = !empty($field_name) ? $field_name : $id;
     365      $field_name = !empty($parent) ? $parent . '[' . $field_name . ']' : $field_name;
     366      ob_start();
     367      //wp_enqueue_media();
     368    ?>
     369      <div id="input-wrapper-<?php echo esc_attr($css_id); ?>" class="input-wrapper field-media-wrapper
     370            field-media-wrapper-<?php echo esc_attr($css_id); ?>">
     371        <div class="media-preview-wrap" style="width: 150px;margin-bottom: 10px;background: #eee;padding: 5px;    text-align: center;word-break: break-all;">
     372          <?php
     373          if ("audio/mpeg" == $media_type) {
     374          ?>
     375            <div class="media-preview" class="dashicons dashicons-format-audio" style="font-size: 70px;display: inline;"></div>
     376            <div class="media-title"><?php echo esc_html($media_title); ?></div>
     377          <?php
     378          } elseif (
     379            "images/png" == $media_type ||
     380            "image/png" == $media_type ||
     381            "images/gif" == $media_type  ||
     382            "image/gif" == $media_type  ||
     383            "images/jpeg" == $media_type ||
     384            "image/jpeg" == $media_type ||
     385            "images/jpg" == $media_type ||
     386            "image/jpg" == $media_type ||
     387            "images/ico" == $media_type ||
     388            "image/ico" == $media_type
     389          ) {
     390          ?>
     391            <img class="media-preview" src="<?php echo esc_url($media_url); ?>" style="width:100%" />
     392            <div class="media-title"><?php echo esc_html($media_title); ?></div>
     393          <?php
     394          } else {
     395          ?>
     396            <img class="media-preview" src="<?php echo esc_url($media_url); ?>" style="width:100%" />
     397            <div class="media-title"><?php echo esc_html($media_title); ?></div>
     398          <?php
     399          }
     400          ?>
     401        </div>
     402        <input class="media-input-value" type="hidden" name="<?php echo esc_attr($field_name); ?>" id="media_input_<?php echo esc_attr($css_id); ?>" value="<?php echo esc_attr($value); ?>" />
     403        <div class="media-upload button" id="media_upload_<?php echo esc_attr($css_id); ?>">
     404          <?php echo "Upload"; ?></div>
     405        <div placeholder="<?php echo esc_attr($placeholder); ?>" class="clear button" id="media_clear_<?php echo esc_attr($css_id); ?>"><?php echo 'Clear'; ?></div>
     406        <div class="error-mgs"></div>
     407      </div>
     408    <?php
     409      $input_html = ob_get_clean();
     410      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     411    }
     412    public function field_media_url($option)
     413    {
     414      $id            = isset($option['id']) ? $option['id'] : "";
     415      if (empty($id)) return;
     416      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     417      $field_name     = isset($option['field_name']) ? $option['field_name'] : $id;
     418      $parent             = isset($option['parent']) ? $option['parent'] : "";
     419      $placeholder    = isset($option['placeholder']) ? $option['placeholder'] : "";
     420      $placeholder_img    = isset($option['placeholder_img']) ? $option['placeholder_img'] : "";
     421      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     422      $title            = isset($option['title']) ? $option['title'] : "";
     423      $details             = isset($option['details']) ? $option['details'] : "";
     424      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     425      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     426      $default            = isset($option['default']) ? $option['default'] : '';
     427      $value            = isset($option['value']) ? $option['value'] : '';
     428      $value          = !empty($value) ?  $value : $default;
     429      $media_url    = $value;
     430      $media_type    = get_post_mime_type($value);
     431      $media_title = get_the_title($value);
     432      $media_url = !empty($media_url) ? $media_url : '';
     433      $media_url = !empty($media_url) ? $media_url : $placeholder_img;
     434      $field_name     = !empty($field_name) ? $field_name : $id;
     435      $field_name = !empty($parent) ? $parent . '[' . $field_name . ']' : $field_name;
     436      wp_enqueue_media();
     437      ob_start();
     438    ?>
     439      <div id="input-wrapper-<?php echo esc_attr($css_id); ?>" class="input-wrapper field-media-url-wrapper
     440            field-media-wrapper-<?php echo esc_attr($css_id); ?>">
     441        <div class="media-preview-wrap" style="width: 150px;margin-bottom: 10px;background: #eee;padding: 5px;    text-align: center;">
     442          <?php
     443          if ("audio/mpeg" == $media_type) {
     444          ?>
     445            <div class="media-preview" class="dashicons dashicons-format-audio" style="font-size: 70px;display: inline;"></div>
     446          <?php
     447          } elseif (
     448            "images/png" == $media_type || "images/jpg" == $media_type || "images/jpeg" == $media_type ||
     449            "images/gif" == $media_type  ||
     450            "images/ico" == $media_type
     451          ) {
     452          ?>
     453            <img class="media-preview" src="<?php echo esc_url($media_url); ?>" style="width:100%" />
     454          <?php
     455          } else {
     456          ?>
     457            <img class="media-preview" src="<?php echo esc_url($media_url); ?>" style="width:100%" />
     458          <?php
     459          }
     460          ?>
     461        </div>
     462        <input type="text" placeholder="<?php echo esc_attr($placeholder); ?>" name="<?php echo esc_attr($field_name); ?>" id="media_input_<?php echo esc_attr($css_id); ?>" value="<?php echo esc_attr($value); ?>" />
     463        <div class="media-upload button" id="media_upload_<?php echo esc_attr($css_id); ?>">
     464          <?php echo 'Upload'; ?></div>
     465        <div class="clear button" id="media_clear_<?php echo esc_attr($css_id); ?>">
     466          <?php echo 'Clear'; ?></div>
     467        <div class="error-mgs"></div>
     468      </div>
     469    <?php
     470      $input_html = ob_get_clean();
     471      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     472    }
     473    public function field_repeatable($option)
     474    {
     475      $id             = isset($option['id']) ? $option['id'] : "";
     476      if (empty($id)) return;
     477      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     478      $parent             = isset($option['parent']) ? $option['parent'] : "";
     479      $field_name     = isset($option['field_name']) ? $option['field_name'] : $id;
     480      $field_name     = !empty($parent) ? $parent . '[' . $field_name . ']' : $field_name;
     481      $sortable         = isset($option['sortable']) ? $option['sortable'] : true;
     482      $collapsible     = isset($option['collapsible']) ? $option['collapsible'] : true;
     483      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     484      $values            = isset($option['value']) ? $option['value'] : array();
     485      $fields         = isset($option['fields']) ? $option['fields'] : array();
     486      $title_field     = isset($option['title_field']) ? $option['title_field'] : '';
     487      $remove_text     = isset($option['remove_text']) ? $option['remove_text'] : '<i class="fas fa-times"></i>';
     488      $limit             = isset($option['limit']) ? $option['limit'] : '';
     489      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     490      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     491      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     492      $title            = isset($option['title']) ? $option['title'] : "";
     493      $details             = isset($option['details']) ? $option['details'] : "";
     494      $settings_tabs_field = new settings_tabs_field();
     495      ob_start();
     496    ?>
     497      <div class="item-wrap collapsible">
     498        <div class="header">
     499          <span class="remove" onclick="jQuery(this).parent().parent().remove()"><?php echo wp_kses_post($remove_text); ?></span>
     500          <?php
     501          if ($sortable) :
     502          ?>
     503            <span class="sort"><i class="fas fa-arrows-alt"></i></span>
     504          <?php
     505          endif;
     506          ?>
     507          <span class="title-text">#TIMEINDEX</span>
    154508        </div>
    155509        <?php
    156 
    157         return ob_get_clean();
    158 
    159     }
    160 
    161 
    162 
    163 
    164 
    165 
    166     function generate_field($option){
    167 
    168         $id         = isset( $option['id'] ) ? $option['id'] : "";
    169         $type       = isset( $option['type'] ) ? $option['type'] : "";
    170         $details    = isset( $option['details'] ) ? $option['details'] : "";
    171 
    172 
    173 
    174 
    175 
    176 
    177         if( empty( $id ) ) return;
    178 
    179         if( isset($option['type']) && $option['type'] === 'select' )                $this->field_select( $option );
    180         elseif( isset($option['type']) && $option['type'] === 'select2')            $this->field_select2( $option );
    181         elseif( isset($option['type']) && $option['type'] === 'checkbox')           $this->field_checkbox( $option );
    182         elseif( isset($option['type']) && $option['type'] === 'radio')              $this->field_radio( $option );
    183         elseif( isset($option['type']) && $option['type'] === 'radio_image')        $this->field_radio_image( $option );
    184         elseif( isset($option['type']) && $option['type'] === 'textarea')           $this->field_textarea( $option );
    185         elseif( isset($option['type']) && $option['type'] === 'scripts_js')         $this->field_scripts_js( $option );
    186         elseif( isset($option['type']) && $option['type'] === 'scripts_css')        $this->field_scripts_css( $option );
    187         elseif( isset($option['type']) && $option['type'] === 'number' )            $this->field_number( $option );
    188         elseif( isset($option['type']) && $option['type'] === 'text' )              $this->field_text( $option );
    189         elseif( isset($option['type']) && $option['type'] === 'text_icon' )         $this->field_text_icon( $option );
    190         elseif( isset($option['type']) && $option['type'] === 'text_multi' )        $this->field_text_multi( $option );
    191         elseif( isset($option['type']) && $option['type'] === 'hidden' )            $this->field_hidden( $option );
    192 
    193         elseif( isset($option['type']) && $option['type'] === 'range' )             $this->field_range( $option );
    194         elseif( isset($option['type']) && $option['type'] === 'colorpicker')        $this->field_colorpicker( $option );
    195         elseif( isset($option['type']) && $option['type'] === 'colorpicker_multi')  $this->field_colorpicker_multi( $option );
    196 
    197         elseif( isset($option['type']) && $option['type'] === 'datepicker')         $this->field_datepicker( $option );
    198         elseif( isset($option['type']) && $option['type'] === 'faq')                $this->field_faq( $option );
    199         elseif( isset($option['type']) && $option['type'] === 'addons_grid')        $this->field_addons_grid( $option );
    200         elseif( isset($option['type']) && $option['type'] === 'custom_html')        $this->field_custom_html( $option );
    201         elseif( isset($option['type']) && $option['type'] === 'repeatable')         $this->field_repeatable( $option );
    202         elseif( isset($option['type']) && $option['type'] === 'media')              $this->field_media( $option );
    203         elseif( isset($option['type']) && $option['type'] === 'media_url')          $this->field_media_url( $option );
    204 
    205         elseif( isset($option['type']) && $option['type'] === 'option_group')       $this->field_option_group( $option );
    206         elseif( isset($option['type']) && $option['type'] === 'option_group_accordion')     $this->field_option_group_accordion( $option );
    207         elseif( isset($option['type']) && $option['type'] === 'wp_editor')      $this->field_wp_editor( $option );
    208         elseif( isset($option['type']) && $option['type'] === 'textarea_editor')        $this->field_textarea_editor( $option );
    209 
    210 
    211 
    212         elseif( isset($option['type']) && $option['type'] === $type )   do_action( "settings_tabs_field_$type", $option );
    213 
    214 
    215         //if( !empty( $details ) ) echo "<p class='description'>$details</p>";
    216 
    217 
    218 
    219 
    220 
    221     }
    222 
    223 
    224     public function field_option_group_accordion( $option ){
    225 
    226         $id             = isset( $option['id'] ) ? $option['id'] : "";
    227         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    228         $sortable           = isset( $option['sortable'] ) ? $option['sortable'] : false;
    229 
    230         $args_index     = isset( $option['args_index'] ) ? $option['args_index'] : array();
    231         $args_index_default     = isset( $option['args_index_default'] ) ? $option['args_index_default'] : array();
    232         $args_index_hide    = isset( $option['args_index_hide'] ) ? $option['args_index_hide'] : array();
    233 
    234         $args_index = !empty($args_index) ? $args_index : $args_index_default;
    235 
    236         $args   = isset( $option['args'] ) ? $option['args'] : array();
    237 
    238         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    239 
    240         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    241         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    242 
    243 
    244         $title          = isset( $option['title'] ) ? $option['title'] : "";
    245         $group_details          = isset( $option['details'] ) ? $option['details'] : "";
    246 
    247         if($is_pro == true){
    248             $group_details = '<span class="pro-feature">'.$pro_text.'</span> '.$group_details;
    249         }
    250 
    251 
    252         ob_start();
     510        if (!empty($fields)) :
     511          foreach ($fields as $field) :
     512            $fieldType = isset($field['type']) ? $field['type'] : '';
     513            $field['parent'] = $field_name . '[TIMEINDEX]';
    253514        ?>
    254         <div class="option-group-accordion-wrap" id="<?php echo $css_id; ?>">
    255             <div sortable="<?php echo ($sortable) ? 'true':  'false'; ?>" class='option-group-accordion accordion'>
     515            <div class="item">
     516              <?php if ($collapsible) : ?>
     517                <div class="content">
     518                <?php endif; ?>
    256519                <?php
    257 
    258                 if(!empty($args_index))
    259                 foreach( $args_index as $index ):
    260 
    261                     //foreach( $args as $key => $value ):
    262 
    263                     $group_title = isset($args[$index]['title']) ? $args[$index]['title'] : '';
    264                     $is_hide = isset($args_index_hide[$index]) ? $args_index_hide[$index] : false;
    265 
    266 
    267                         //$link = $value['link'];
    268                         $options = isset($args[$index]['options']) ? $args[$index]['options'] : array();
    269 
    270                         ?>
    271                         <div class="group">
    272                             <h3 class="accordion-title">
    273 
    274 
    275                                 <?php if($sortable): ?>
    276                                     <span class="sort"><i class="fas fa-sort"></i></span>
    277                                 <?php endif; ?>
    278 
    279                                 <span class="title-text"><?php echo $group_title; ?></span>
    280                             </h3>
    281                             <div class="accordion-content">
    282 
    283                                 <?php
    284 
    285                                 if(!empty($options)):
    286                                     foreach ($options as $option):
    287 
    288                                         $id         = isset( $option['id'] ) ? $option['id'] : "";
    289                                         $type       = isset( $option['type'] ) ? $option['type'] : "";
    290                                         $details    = isset( $option['details'] ) ? $option['details'] : "";
    291 
    292                                         if( isset($option['type']) && $option['type'] === 'select' )                $this->field_select( $option );
    293                                         elseif( isset($option['type']) && $option['type'] === 'select2')            $this->field_select2( $option );
    294                                         elseif( isset($option['type']) && $option['type'] === 'checkbox')           $this->field_checkbox( $option );
    295                                         elseif( isset($option['type']) && $option['type'] === 'radio')              $this->field_radio( $option );
    296                                         elseif( isset($option['type']) && $option['type'] === 'radio_image')        $this->field_radio_image( $option );
    297                                         elseif( isset($option['type']) && $option['type'] === 'textarea')           $this->field_textarea( $option );
    298                                         elseif( isset($option['type']) && $option['type'] === 'scripts_js')         $this->field_scripts_js( $option );
    299                                         elseif( isset($option['type']) && $option['type'] === 'scripts_css')        $this->field_scripts_css( $option );
    300                                         elseif( isset($option['type']) && $option['type'] === 'number' )            $this->field_number( $option );
    301                                         elseif( isset($option['type']) && $option['type'] === 'text' )              $this->field_text( $option );
    302                                         elseif( isset($option['type']) && $option['type'] === 'text_icon' )         $this->field_text_icon( $option );
    303                                         elseif( isset($option['type']) && $option['type'] === 'text_multi' )        $this->field_text_multi( $option );
    304                                         elseif( isset($option['type']) && $option['type'] === 'hidden' )                $this->field_hidden( $option );
    305 
    306                                         elseif( isset($option['type']) && $option['type'] === 'range' )             $this->field_range( $option );
    307                                         elseif( isset($option['type']) && $option['type'] === 'colorpicker')        $this->field_colorpicker( $option );
    308                                         elseif( isset($option['type']) && $option['type'] === 'colorpicker_multi')  $this->field_colorpicker_multi( $option );
    309 
    310                                         elseif( isset($option['type']) && $option['type'] === 'datepicker')         $this->field_datepicker( $option );
    311                                         elseif( isset($option['type']) && $option['type'] === 'faq')                $this->field_faq( $option );
    312                                         elseif( isset($option['type']) && $option['type'] === 'addons_grid')        $this->field_addons_grid( $option );
    313                                         elseif( isset($option['type']) && $option['type'] === 'custom_html')        $this->field_custom_html( $option );
    314                                         elseif( isset($option['type']) && $option['type'] === 'repeatable')         $this->field_repeatable( $option );
    315                                         elseif( isset($option['type']) && $option['type'] === 'media')              $this->field_media( $option );
    316                                         elseif( isset($option['type']) && $option['type'] === 'media_url')          $this->field_media_url( $option );
    317 
    318                                     endforeach;
    319                                 endif;
    320                                 ?>
    321                             </div> <!-- ..accordion-content -->
    322                         </div><!-- .group -->
    323 
    324 
    325                     <?php
    326                     //endforeach;
    327 
    328                 endforeach;
    329 
    330 
     520                $settings_tabs_field->generate_field($field);
    331521                ?>
    332             </div> <!-- .option-group-accordion -->
    333         </div><!-- .option-group-accordion-wrap -->
    334 
     522                <?php if ($collapsible) : ?>
     523                </div>
     524              <?php endif; ?>
     525            </div>
    335526        <?php
    336 
    337         $input_html = ob_get_clean();
    338 
    339         echo sprintf($field_template, $title, $input_html, $group_details);
    340 
    341 
    342     }
    343 
    344 
    345     public function field_option_group( $option ){
    346 
    347         $id             = isset( $option['id'] ) ? $option['id'] : "";
    348         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    349         $options    = isset( $option['options'] ) ? $option['options'] : array();
    350         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    351 
    352         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    353         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    354 
    355 
    356         $title          = isset( $option['title'] ) ? $option['title'] : "";
    357         $group_details          = isset( $option['details'] ) ? $option['details'] : "";
    358 
    359         if($is_pro == true){
    360             $group_details = '<span class="pro-feature">'.$pro_text.'</span> '.$group_details;
    361         }
    362 
    363 
    364         ob_start();
     527          endforeach;
     528        endif;
    365529        ?>
    366         <div id="<?php echo $css_id; ?>">
     530      </div>
     531      <?php
     532      $fieldHtml = ob_get_clean();
     533      $fieldHtml = preg_replace("/[\r\n]+/", "\n", $fieldHtml);
     534      $fieldHtml = preg_replace("/\s+/", ' ', $fieldHtml);
     535      ob_start();
     536      ?>
     537      <div id="input-wrapper-<?php echo esc_attr($css_id); ?>" class=" input-wrapper field-repeatable-wrapper
     538            field-repeatable-wrapper-<?php echo esc_attr($css_id); ?>">
     539        <div data-add_html="<?php echo esc_attr($fieldHtml); ?>" class="add-repeat-field" data-wrapper-id="<?php echo esc_attr($css_id); ?>"><i class="far fa-plus-square"></i>
     540          <?php echo 'Add'; ?></div>
     541        <div class="repeatable-field-list sortable" id="<?php echo esc_attr($css_id); ?>">
     542          <?php
     543          if (!empty($values)) :
     544            $count = 1;
     545            foreach ($values as $index => $val) :
     546              $title_field_val = !empty($val[$title_field]) ? $val[$title_field] : '#' . $count;
     547          ?>
     548              <div class="item-wrap <?php if ($collapsible) echo 'collapsible'; ?>" index="<?php echo esc_attr($index); ?>">
     549                <?php if ($collapsible) : ?>
     550                  <div class="header">
     551                  <?php endif; ?>
     552                  <span class="remove" onclick="jQuery(this).parent().parent().remove()"><?php echo wp_kses_post($remove_text); ?></span>
     553                  <?php if ($sortable) : ?>
     554                    <span class="sort"><i class="fas fa-arrows-alt"></i></span>
     555                  <?php endif; ?>
     556                  <span class="title-text"><?php echo esc_html($title_field_val); ?></span>
     557                  <?php if ($collapsible) : ?>
     558                  </div>
     559                <?php endif; ?>
     560                <?php
     561                foreach ($fields as $field_index => $field) :
     562                  $fieldId = $field['id'];
     563                  $field_css_id = isset($field['css_id']) ? str_replace('TIMEINDEX', $index, $field['css_id']) : '';
     564                  $title_field_class = ($title_field == $field_index) ? 'title-field' : '';
     565                ?>
     566                  <div class="item <?php echo esc_attr($title_field_class); ?>">
     567                    <?php if ($collapsible) : ?>
     568                      <div class="content">
     569                      <?php endif; ?>
     570                      <?php
     571                      $field['parent'] = $field_name . '[' . $index . ']';
     572                      $field['css_id'] = $field_css_id;
     573                      $field['value'] = isset($val[$fieldId]) ? $val[$fieldId] : '';
     574                      $settings_tabs_field->generate_field($field);
     575                      if ($collapsible) : ?>
     576                      </div>
     577                    <?php endif; ?>
     578                  </div>
     579                <?php
     580                endforeach; ?>
     581              </div>
    367582            <?php
    368 
    369             if(!empty($options)):
    370                 foreach ($options as $option):
    371 
    372                     $id         = isset( $option['id'] ) ? $option['id'] : "";
    373                     $type       = isset( $option['type'] ) ? $option['type'] : "";
    374                     $details    = isset( $option['details'] ) ? $option['details'] : "";
    375 
    376                     if( isset($option['type']) && $option['type'] === 'select' )                $this->field_select( $option );
    377                     elseif( isset($option['type']) && $option['type'] === 'select2')            $this->field_select2( $option );
    378                     elseif( isset($option['type']) && $option['type'] === 'checkbox')           $this->field_checkbox( $option );
    379                     elseif( isset($option['type']) && $option['type'] === 'radio')              $this->field_radio( $option );
    380                     elseif( isset($option['type']) && $option['type'] === 'radio_image')        $this->field_radio_image( $option );
    381                     elseif( isset($option['type']) && $option['type'] === 'textarea')           $this->field_textarea( $option );
    382                     elseif( isset($option['type']) && $option['type'] === 'scripts_js')         $this->field_scripts_js( $option );
    383                     elseif( isset($option['type']) && $option['type'] === 'scripts_css')        $this->field_scripts_css( $option );
    384                     elseif( isset($option['type']) && $option['type'] === 'number' )            $this->field_number( $option );
    385                     elseif( isset($option['type']) && $option['type'] === 'text' )              $this->field_text( $option );
    386                     elseif( isset($option['type']) && $option['type'] === 'text_icon' )         $this->field_text_icon( $option );
    387                     elseif( isset($option['type']) && $option['type'] === 'text_multi' )        $this->field_text_multi( $option );
    388                     elseif( isset($option['type']) && $option['type'] === 'hidden' )            $this->field_hidden( $option );
    389 
    390                     elseif( isset($option['type']) && $option['type'] === 'range' )             $this->field_range( $option );
    391                     elseif( isset($option['type']) && $option['type'] === 'colorpicker')        $this->field_colorpicker( $option );
    392                     elseif( isset($option['type']) && $option['type'] === 'colorpicker_multi')  $this->field_colorpicker_multi( $option );
    393 
    394                     elseif( isset($option['type']) && $option['type'] === 'datepicker')         $this->field_datepicker( $option );
    395                     elseif( isset($option['type']) && $option['type'] === 'faq')                $this->field_faq( $option );
    396                     elseif( isset($option['type']) && $option['type'] === 'addons_grid')        $this->field_addons_grid( $option );
    397                     elseif( isset($option['type']) && $option['type'] === 'custom_html')        $this->field_custom_html( $option );
    398                     elseif( isset($option['type']) && $option['type'] === 'repeatable')         $this->field_repeatable( $option );
    399                     elseif( isset($option['type']) && $option['type'] === 'media')              $this->field_media( $option );
    400                     elseif( isset($option['type']) && $option['type'] === 'media_url')          $this->field_media_url( $option );
    401 
    402                 endforeach;
     583              $count++;
     584            endforeach;
     585          else :
     586            ?>
     587          <?php
     588          endif;
     589          ?>
     590        </div>
     591        <div class="error-mgs"></div>
     592      </div>
     593    <?php
     594      $input_html = ob_get_clean();
     595      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     596    }
     597    public function field_select($option)
     598    {
     599      $id             = isset($option['id']) ? $option['id'] : "";
     600      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     601      $parent             = isset($option['parent']) ? $option['parent'] : "";
     602      $args     = isset($option['args']) ? $option['args'] : array();
     603      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     604      $disabled     = isset($option['disabled']) ? $option['disabled'] : false;
     605      $disabledMessage     = isset($option['disabledMessage']) ? $option['disabledMessage'] : '';
     606      $multiple     = isset($option['multiple']) ? $option['multiple'] : false;
     607      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     608      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     609      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     610      $title            = isset($option['title']) ? $option['title'] : "";
     611      $details             = isset($option['details']) ? $option['details'] : "";
     612      if ($is_pro == true) {
     613        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     614      }
     615      if ($multiple) {
     616        $value     = isset($option['value']) ? $option['value'] : array();
     617        $field_name = !empty($parent) ? $parent . '[' . $id . '][]' : $id . '[]';
     618        $default     = isset($option['default']) ? $option['default'] : array();
     619      } else {
     620        $value     = isset($option['value']) ? $option['value'] : '';
     621        $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     622        $default     = isset($option['default']) ? $option['default'] : '';
     623      }
     624      $value = !empty($value) ? $value : $default;
     625      ob_start();
     626    ?>
     627      <select <?php if ($multiple) echo 'multiple'; ?> <?php if ($disabled) echo 'disabled'; ?> name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>">
     628        <?php
     629        foreach ($args as $key => $name) :
     630          if ($multiple) {
     631            $selected =  in_array($key, $value) ? "selected" : "";
     632          } else {
     633            $selected = $value == $key ? "selected" : "";
     634          }
     635        ?>
     636          <option <?php echo esc_attr($selected); ?> value="<?php echo esc_attr($key); ?>"><?php echo esc_html($name); ?>
     637          </option>
     638        <?php
     639        endforeach;
     640        ?>
     641      </select>
     642      <?php
     643      if ($multiple) :
     644      ?>
     645        <div class="button select-reset"><?php echo 'Reset'; ?></div><br>
     646      <?php
     647      endif;
     648      ?>
     649      <?php if ($disabled) : ?>
     650        <div class="disabled"><?php echo wp_kses_post($disabledMessage); ?></div>
     651      <?php endif; ?>
     652    <?php
     653      $input_html = ob_get_clean();
     654      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     655    }
     656    public function field_select2($option)
     657    {
     658      $id                 = isset($option['id']) ? $option['id'] : "";
     659      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     660      $parent             = isset($option['parent']) ? $option['parent'] : "";
     661      $args                 = isset($option['args']) ? $option['args'] : array();
     662      $multiple             = isset($option['multiple']) ? $option['multiple'] : "";
     663      $attributes         = isset($option['attributes']) ? $option['attributes'] : array();
     664      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     665      $is_pro             = isset($option['is_pro']) ? $option['is_pro'] : false;
     666      $pro_text             = isset($option['pro_text']) ? $option['pro_text'] : '';
     667      if ($multiple) {
     668        $value     = isset($option['value']) ? $option['value'] : array();
     669        $field_name = !empty($parent) ? $parent . '[' . $id . '][]' : $id . '[]';
     670        $default     = isset($option['default']) ? $option['default'] : array();
     671      } else {
     672        $value     = isset($option['value']) ? $option['value'] : '';
     673        $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     674        $default     = isset($option['default']) ? $option['default'] : '';
     675      }
     676      $value = !empty($value) ? $value : $default;
     677      //$value  = get_post_meta( $post_id, $id, true );
     678      $title            = isset($option['title']) ? $option['title'] : "";
     679      $details             = isset($option['details']) ? $option['details'] : "";
     680      $attributes_html = '';
     681      foreach ($attributes as $attributeId => $attribute) :
     682        $attributes_html = $attributeId . '=' . $attribute . ' ';
     683      endforeach;
     684      ob_start();
     685    ?>
     686      <select <?php echo esc_attr($attributes_html); ?> class="select2" <?php if ($multiple) echo 'multiple'; ?> name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>">
     687        <?php
     688        foreach ($args as $key => $name) :
     689          if ($multiple) {
     690            $selected = in_array($key, $value) ? "selected" : "";
     691          } else {
     692            $selected = ($key == $value) ? "selected" : "";
     693          }
     694        ?>
     695          <option <?php echo esc_attr($selected); ?> value="<?php echo esc_attr($key); ?>"><?php echo esc_html($name); ?>
     696          </option>
     697        <?php
     698        endforeach;
     699        ?>
     700      </select>
     701    <?php
     702      $input_html = ob_get_clean();
     703      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     704    }
     705    public function field_text_multi($option)
     706    {
     707      $id             = isset($option['id']) ? $option['id'] : "";
     708      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     709      $parent             = isset($option['parent']) ? $option['parent'] : "";
     710      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     711      $default     = isset($option['default']) ? $option['default'] : array();
     712      $values     = isset($option['value']) ? $option['value'] : $default;
     713      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     714      $remove_text     = isset($option['remove_text']) ? $option['remove_text'] : '<i class="fas fa-times"></i>';
     715      $sortable         = isset($option['sortable']) ? $option['sortable'] : true;
     716      $allow_clone         = isset($option['allow_clone']) ? $option['allow_clone'] : false;
     717      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     718      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     719      $title            = isset($option['title']) ? $option['title'] : "";
     720      $details             = isset($option['details']) ? $option['details'] : "";
     721      if ($is_pro == true) {
     722        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     723      }
     724      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     725      ob_start();
     726    ?>
     727      <div id="input-wrapper-<?php echo esc_attr($id); ?>" class="input-wrapper input-text-multi-wrapper
     728            input-text-multi-wrapper-<?php echo esc_attr($css_id); ?>">
     729        <span data-placeholder="<?php echo esc_attr($placeholder); ?>" data-sort="<?php echo esc_attr($sortable); ?>" data-clone="<?php echo esc_attr($allow_clone); ?>" data-name="<?php echo esc_attr($field_name); ?>[]" class="button add-item"><?php echo 'Add'; ?></span>
     730        <div class="field-list <?php if ($sortable) {
     731                                  echo 'sortable';
     732                                } ?>" id="<?php echo esc_attr($css_id); ?>">
     733          <?php
     734          if (!empty($values)) :
     735            foreach ($values as $value) :
     736          ?>
     737              <div class="item">
     738                <input type="text" name="<?php echo esc_attr($field_name); ?>[]" placeholder="<?php
     739                                                                                              echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
     740                <?php if ($allow_clone) : ?>
     741                  <span class="button clone"><i class="far fa-clone"></i></span>
     742                <?php endif; ?>
     743                <?php if ($sortable) : ?>
     744                  <span class="button sort"><i class="fas fa-arrows-alt"></i></span>
     745                <?php endif; ?>
     746                <span class="button remove" onclick="jQuery(this).parent().remove()"><?php echo wp_kses_post($remove_text); ?></span>
     747              </div>
     748            <?php
     749            endforeach;
     750          else :
     751            ?>
     752            <div class="item">
     753              <input type="text" name="<?php echo esc_attr($field_name); ?>[]" placeholder="<?php
     754                                                                                            echo esc_attr($placeholder); ?>" value="" />
     755              <?php if ($allow_clone) : ?>
     756                <span class="button clone"><i class="far fa-clone"></i></span>
     757              <?php endif; ?>
     758              <?php if ($sortable) : ?>
     759                <span class="button sort"><i class="fas fa-arrows-alt"></i></span>
     760              <?php endif; ?>
     761              <span class="button remove" onclick="jQuery(this).parent().remove()"><?php echo wp_kses_post($remove_text); ?></span>
     762            </div>
     763          <?php
     764          endif;
     765          ?>
     766        </div>
     767        <div class="error-mgs"></div>
     768      </div>
     769    <?php
     770      $input_html = ob_get_clean();
     771      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     772    }
     773    public function field_hidden($option)
     774    {
     775      $id             = isset($option['id']) ? $option['id'] : "";
     776      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     777      $parent             = isset($option['parent']) ? $option['parent'] : "";
     778      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     779      $value     = isset($option['value']) ? $option['value'] : '';
     780      $default     = isset($option['default']) ? $option['default'] : '';
     781      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     782      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     783      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     784      $value = !empty($value) ? $value : $default;
     785      $title            = isset($option['title']) ? $option['title'] : "";
     786      $details             = isset($option['details']) ? $option['details'] : "";
     787      if ($is_pro == true) {
     788        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     789      }
     790      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     791      ob_start();
     792    ?>
     793      <input type="hidden" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
     794    <?php
     795      $input_html = ob_get_clean();
     796      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     797    }
     798    public function field_text($option)
     799    {
     800      $id             = isset($option['id']) ? $option['id'] : "";
     801      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     802      $parent             = isset($option['parent']) ? $option['parent'] : "";
     803      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     804      $default     = isset($option['default']) ? $option['default'] : '';
     805      $value     = isset($option['value']) ? $option['value'] : $default;
     806      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     807      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     808      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     809      $title            = isset($option['title']) ? $option['title'] : "";
     810      $details             = isset($option['details']) ? $option['details'] : "";
     811      if ($is_pro == true) {
     812        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     813      }
     814      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     815      ob_start();
     816    ?>
     817      <input type="text" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
     818    <?php
     819      $input_html = ob_get_clean();
     820      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     821    }
     822    public function field_number($option)
     823    {
     824      $id             = isset($option['id']) ? $option['id'] : "";
     825      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     826      $parent             = isset($option['parent']) ? $option['parent'] : "";
     827      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     828      $value     = isset($option['value']) ? $option['value'] : '';
     829      $default     = isset($option['default']) ? $option['default'] : '';
     830      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     831      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     832      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     833      $value = !empty($value) ? $value : $default;
     834      $title            = isset($option['title']) ? $option['title'] : "";
     835      $details             = isset($option['details']) ? $option['details'] : "";
     836      if ($is_pro == true) {
     837        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     838      }
     839      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     840      ob_start();
     841    ?>
     842      <input type="number" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
     843    <?php
     844      $input_html = ob_get_clean();
     845      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     846    }
     847    public function field_wp_editor($option)
     848    {
     849      $id             = isset($option['id']) ? $option['id'] : "";
     850      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     851      $parent             = isset($option['parent']) ? $option['parent'] : "";
     852      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     853      $value     = isset($option['value']) ? $option['value'] : '';
     854      $default     = isset($option['default']) ? $option['default'] : '';
     855      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     856      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     857      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     858      $value = !empty($value) ? $value : $default;
     859      $title            = isset($option['title']) ? $option['title'] : "";
     860      $details             = isset($option['details']) ? $option['details'] : "";
     861      if ($is_pro == true) {
     862        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     863      }
     864      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     865      $editor_settings = isset($option['editor_settings']) ? $option['editor_settings'] : array('textarea_name' => $field_name, 'teeny' => true,  'textarea_rows' => 15,);
     866      ob_start();
     867    ?>
     868      <div id="field-wrapper-<?php echo esc_attr($id); ?>" class="<?php if (!empty($depends)) echo 'dependency-field'; ?> field-wrapper field-wp_editor-wrapper
     869            field-wp_editor-wrapper-<?php echo esc_attr($id); ?>">
     870        <?php
     871        wp_editor($value, $css_id, $editor_settings);
     872        ?>
     873        <div class="error-mgs"></div>
     874      </div>
     875    <?php
     876      $input_html = ob_get_clean();
     877      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     878    }
     879    public function field_text_icon($option)
     880    {
     881      $id             = isset($option['id']) ? $option['id'] : "";
     882      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     883      $parent             = isset($option['parent']) ? $option['parent'] : "";
     884      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     885      $value     = isset($option['value']) ? $option['value'] : '';
     886      $default     = isset($option['default']) ? $option['default'] : '';
     887      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     888      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     889      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     890      $title            = isset($option['title']) ? $option['title'] : "";
     891      $details             = isset($option['details']) ? $option['details'] : "";
     892      $option_value = empty($value) ? $default : $value;
     893      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     894      ob_start();
     895    ?>
     896      <div class="text-icon">
     897        <span class="icon"><?php echo esc_html($option_value); ?></span><input type="text" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($option_value); ?>" />
     898      </div>
     899
     900
     901    <?php
     902      $input_html = ob_get_clean();
     903      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     904    }
     905    public function field_range($option)
     906    {
     907      $id             = isset($option['id']) ? $option['id'] : "";
     908      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     909      $parent             = isset($option['parent']) ? $option['parent'] : "";
     910      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     911      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     912      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     913      $value     = isset($option['value']) ? $option['value'] : '';
     914      $default     = isset($option['default']) ? $option['default'] : '';
     915      $value = !empty($value) ? $value : $default;
     916      $args     = isset($option['args']) ? $option['args'] : "";
     917      $min = isset($args['min']) ? $args['min'] : '';
     918      $max = isset($args['max']) ? $args['max'] : '';
     919      $step = isset($args['step']) ? $args['step'] : '';
     920      $title            = isset($option['title']) ? $option['title'] : "";
     921      $details             = isset($option['details']) ? $option['details'] : "";
     922      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     923      ob_start();
     924    ?>
     925      <div class="range-input">
     926        <span class="range-value"><?php echo esc_html($value); ?></span><input type="range" min="<?php if ($min) echo esc_attr($min); ?>" max="<?php if ($max) echo esc_attr($max); ?>" step="<?php if ($step) echo esc_attr($step); ?>" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" class="range" value="<?php echo esc_attr($value); ?>" />
     927      </div>
     928
     929
     930    <?php
     931      $input_html = ob_get_clean();
     932      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     933    }
     934    public function field_textarea($option)
     935    {
     936      $id             = isset($option['id']) ? $option['id'] : "";
     937      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     938      $parent             = isset($option['parent']) ? $option['parent'] : "";
     939      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     940      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     941      $value     = isset($option['value']) ? $option['value'] : '';
     942      $default     = isset($option['default']) ? $option['default'] : '';
     943      $value = !empty($value) ? $value : $default;
     944      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     945      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     946      $title            = isset($option['title']) ? $option['title'] : "";
     947      $details             = isset($option['details']) ? $option['details'] : "";
     948      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     949      if ($is_pro == true) {
     950        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     951      }
     952      ob_start();
     953    ?>
     954      <textarea name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" cols="40" rows="5" placeholder="<?php echo esc_attr($placeholder); ?>"><?php echo esc_html($value); ?></textarea>
     955    <?php
     956      $input_html = ob_get_clean();
     957      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     958    }
     959    public function field_textarea_editor($option)
     960    {
     961      $id             = isset($option['id']) ? $option['id'] : "";
     962      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     963      $parent             = isset($option['parent']) ? $option['parent'] : "";
     964      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     965      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     966      $value     = isset($option['value']) ? $option['value'] : '';
     967      $default     = isset($option['default']) ? $option['default'] : '';
     968      $value = !empty($value) ? $value : $default;
     969      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     970      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     971      $title            = isset($option['title']) ? $option['title'] : "";
     972      $details             = isset($option['details']) ? $option['details'] : "";
     973      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     974      if ($is_pro == true) {
     975        $details = '<span class="pro-feature">' . $pro_text . '</span> ' . $details;
     976      }
     977      ob_start();
     978    ?>
     979      <textarea editor_enabled="no" class="textarea-editor" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" cols="40" rows="5" placeholder="<?php echo esc_attr($placeholder); ?>"><?php echo esc_html($value); ?></textarea>
     980    <?php
     981      $input_html = ob_get_clean();
     982      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     983    }
     984    public function field_scripts_js($option)
     985    {
     986      $id             = isset($option['id']) ? $option['id'] : "";
     987      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     988      $parent             = isset($option['parent']) ? $option['parent'] : "";
     989      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     990      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     991      $value     = isset($option['value']) ? $option['value'] : '';
     992      $default     = isset($option['default']) ? $option['default'] : '';
     993      $value = !empty($value) ? $value : $default;
     994      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     995      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     996      $title            = isset($option['title']) ? $option['title'] : "";
     997      $details             = isset($option['details']) ? $option['details'] : "";
     998      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     999      ob_start();
     1000    ?>
     1001      <textarea name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" class="code-editor" cols="40" rows="5" placeholder="<?php echo esc_attr($placeholder); ?>"><?php echo esc_html($value); ?></textarea>
     1002
     1003    <?php
     1004      $input_html = ob_get_clean();
     1005      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1006    }
     1007    public function field_scripts_css($option)
     1008    {
     1009      $id             = isset($option['id']) ? $option['id'] : "";
     1010      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1011      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1012      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1013      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     1014      $value     = isset($option['value']) ? $option['value'] : '';
     1015      $default     = isset($option['default']) ? $option['default'] : '';
     1016      $value = !empty($value) ? $value : $default;
     1017      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1018      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1019      $title            = isset($option['title']) ? $option['title'] : "";
     1020      $details         = isset($option['details']) ? $option['details'] : "";
     1021      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1022    ?>
     1023      <?php
     1024      ob_start();
     1025      ?>
     1026      <textarea name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" class="css_editor" cols="40" rows="5" placeholder="<?php echo esc_attr($placeholder); ?>"><?php echo esc_html($value); ?></textarea>
     1027
     1028    <?php
     1029      $input_html = ob_get_clean();
     1030      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1031    }
     1032    public function field_checkbox($option)
     1033    {
     1034      $id                = isset($option['id']) ? $option['id'] : "";
     1035      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1036      $title            = isset($option['title']) ? $option['title'] : "";
     1037      $details         = isset($option['details']) ? $option['details'] : "";
     1038      $for         = isset($option['for']) ? $option['for'] : "";
     1039      $args            = isset($option['args']) ? $option['args'] : array();
     1040      $style            = isset($option['style']) ? $option['style'] : array();
     1041      $style_inline            = isset($style['inline']) ? $style['inline'] : true;
     1042      $option_value     = isset($option['value']) ? $option['value'] : '';
     1043      $default     = isset($option['default']) ? $option['default'] : '';
     1044      $option_value = !empty($option_value) ? $option_value : $default;
     1045      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1046    ?>
     1047      <div class="setting-field">
     1048        <div class="field-lable"><?php if (!empty($title)) echo esc_html($title);  ?></div>
     1049        <div class="field-input">
     1050          <?php
     1051          if (!empty($args))
     1052            foreach ($args as $key => $value) :
     1053              //$checked = ( $key == $option_value ) ? "checked" : "";
     1054              $checked = in_array($key, $option_value) ? "checked" : "";
     1055              $for = !empty($for) ? $for . '-' . $id . "-" . $key : $id . "-" . $key;
     1056          ?>
     1057            <label for='<?php echo esc_attr($for); ?>'><input name='<?php echo esc_attr($field_name); ?>[]' type='checkbox' id='<?php echo esc_attr($for); ?>' value='<?php echo esc_attr($key); ?>' <?php echo esc_attr($checked); ?>><span><?php echo esc_html($value); ?></span></label>
     1058            <?php
     1059              if (!$style_inline) {
     1060            ?>
     1061              <br>
     1062          <?php
     1063              }
     1064            endforeach;
     1065          ?>
     1066          <p class="description"><?php if (!empty($details)) echo esc_html($details);  ?></p>
     1067        </div>
     1068      </div>
     1069      <?php
     1070    }
     1071    public function field_radio($option)
     1072    {
     1073      $id                = isset($option['id']) ? $option['id'] : "";
     1074      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1075      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1076      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1077      $title            = isset($option['title']) ? $option['title'] : "";
     1078      $details         = isset($option['details']) ? $option['details'] : "";
     1079      $for         = isset($option['for']) ? $option['for'] : "";
     1080      $args            = isset($option['args']) ? $option['args'] : array();
     1081      $style            = isset($option['style']) ? $option['style'] : array();
     1082      $style_inline            = isset($style['inline']) ? $style['inline'] : true;
     1083      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1084      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1085      $option_value     = isset($option['value']) ? $option['value'] : '';
     1086      $default     = isset($option['default']) ? $option['default'] : '';
     1087      $option_value = !empty($option_value) ? $option_value : $default;
     1088      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1089      ob_start();
     1090      if (!empty($args))
     1091        foreach ($args as $key => $value) :
     1092          $for = '';
     1093          $checked = ($key == $option_value) ? "checked" : "";
     1094          $for = !empty($for) ? $for . '-' . $css_id . "-" . $key : $css_id . "-" . $key;
     1095      ?>
     1096        <label for="<?php echo esc_attr($for); ?>"><input name="<?php echo esc_attr($field_name); ?>" type="radio" id="<?php echo esc_attr($for); ?>" value="<?php echo esc_attr($key); ?>" <?php echo esc_attr($checked); ?>><span><?php echo esc_html($value); ?></span></label>
     1097        <?php
     1098          if (!$style_inline) {
     1099        ?>
     1100          <br>
     1101      <?php
     1102          }
     1103        endforeach;
     1104      $input_html = ob_get_clean();
     1105      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1106    }
     1107    public function field_radio_image($option)
     1108    {
     1109      $id                = isset($option['id']) ? $option['id'] : "";
     1110      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1111      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1112      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1113      $args            = isset($option['args']) ? $option['args'] : array();
     1114      //$args           = is_array( $args ) ? $args : $this->generate_args_from_string( $args );
     1115      $option_value     = isset($option['value']) ? $option['value'] : '';
     1116      $default     = isset($option['default']) ? $option['default'] : '';
     1117      $lazy_load_img     = isset($option['lazy_load_img']) ? $option['lazy_load_img'] : '';
     1118      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1119      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1120      $title            = isset($option['title']) ? $option['title'] : "";
     1121      $details             = isset($option['details']) ? $option['details'] : "";
     1122      $width             = isset($option['width']) ? $option['width'] : "250px";
     1123      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1124      $option_value = empty($option_value) ? $default : $option_value;
     1125      ob_start();
     1126      ?>
     1127      <div class="radio-img">
     1128        <?php
     1129        foreach ($args as $key => $value) :
     1130          $name = isset($value['name']) ? $value['name'] : '';
     1131          $thumb = isset($value['thumb']) ? $value['thumb'] : '';
     1132          $disabled = isset($value['disabled']) ? $value['disabled'] : '';
     1133          $pro_msg = isset($value['pro_msg']) ? $value['pro_msg'] : '';
     1134          $link = isset($value['link']) ? $value['link'] : '';
     1135          $link_text = isset($value['link_text']) ? $value['link_text'] : 'Go';
     1136          $checked = ($key == $option_value) ? "checked" : "";
     1137        ?>
     1138          <label style="width: <?php echo esc_attr($width); ?>;" title="<?php echo esc_attr($name); ?>" data-value="<?php echo esc_attr($key); ?>" class="<?php if ($checked == 'checked') echo 'active'; ?> <?php if ($disabled == true) echo 'disabled'; ?>">
     1139            <input <?php if ($disabled) echo 'disabled'; ?> name="<?php echo esc_attr($field_name); ?>" type="radio" id="<?php echo esc_attr($css_id); ?>-<?php echo esc_attr($key); ?>" value="<?php echo esc_attr($key); ?>" <?php echo esc_attr($checked); ?>>
     1140            <?php
     1141            if (!empty($thumb)) :
     1142            ?>
     1143              <img alt="<?php echo esc_attr($name); ?>" src="<?php echo esc_url($thumb); ?>">
     1144              <div class="name"><?php echo esc_html($name); ?></div>
     1145            <?php
     1146            else :
     1147              echo esc_html($name);
    4031148            endif;
    4041149            ?>
    405         </div>
     1150            <?php if ($disabled == true) : ?>
     1151              <span class="pro-msg"><?php echo esc_html($pro_msg); ?></span>
     1152            <?php endif; ?>
     1153            <?php if (!empty($link)) : ?>
     1154              <a target="_blank" class="link" href="<?php echo esc_url($link); ?>"><?php echo esc_html($link_text); ?></a>
     1155            <?php endif; ?>
     1156          </label>
    4061157        <?php
    407 
    408         $input_html = ob_get_clean();
    409 
    410         echo sprintf($field_template, $title, $input_html, $group_details);
    411 
    412 
    413     }
    414 
    415 
    416     public function field_media( $option ){
    417 
    418 
    419 
    420         $id         = isset( $option['id'] ) ? $option['id'] : "";
    421         if(empty($id)) return;
    422         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    423         $field_name     = isset( $option['field_name'] ) ? $option['field_name'] : $id;
    424         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    425         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    426         $title          = isset( $option['title'] ) ? $option['title'] : "";
    427         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    428 
    429         $details            = isset( $option['details'] ) ? $option['details'] : "";
    430 
    431         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    432         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    433 
    434         $default            = isset( $option['default'] ) ? $option['default'] : '';
    435         $value          = isset( $option['value'] ) ? $option['value'] : '';
    436         $value          = !empty($value) ?  $value : $default;
    437 
    438         $media_url  = wp_get_attachment_url( $value );
    439         $media_type = get_post_mime_type( $value );
    440         $media_title = !empty($value) ? get_the_title( $value ) : __('Placeholder.jpg', $this->textdomain);
    441 
    442 
    443         $media_url = !empty($media_url) ? $media_url : $default;
    444         $media_url = !empty($media_url) ? $media_url : $placeholder;
    445         $media_basename = wp_basename($media_type);
    446 
    447         $field_name     = !empty( $field_name ) ? $field_name : $id;
    448         $field_name = !empty($parent) ? $parent.'['.$field_name.']' : $field_name;
    449 
    450 
    451 
    452         ob_start();
    453         //wp_enqueue_media();
    454 
     1158        endforeach;
    4551159        ?>
    456         <div id="input-wrapper-<?php echo $css_id; ?>" class="input-wrapper field-media-wrapper
    457             field-media-wrapper-<?php echo $css_id; ?>">
    458             <div class="media-preview-wrap" style="width: 150px;margin-bottom: 10px;background: #eee;padding: 5px;    text-align: center;word-break: break-all;">
    459                 <?php
    460 
    461                 //var_dump($media_type);
    462 
    463                 if( "audio/mpeg" == $media_type ){
    464                     ?>
    465                     <div class="media-preview" class="dashicons dashicons-format-audio" style="font-size: 70px;display: inline;"></div>
    466                     <div class="media-title"><?php echo $media_title; ?></div>
    467                     <?php
    468                 }elseif( "images/png" == $media_type ||
    469                     "image/png" == $media_type ||
    470                     "images/gif" == $media_type  ||
    471                     "image/gif" == $media_type  ||
    472                     "images/jpeg" == $media_type ||
    473                     "image/jpeg" == $media_type ||
    474                     "images/jpg" == $media_type ||
    475                     "image/jpg" == $media_type ||
    476                     "images/ico" == $media_type||
    477                     "image/ico" == $media_type
    478                 ){
    479                     ?>
    480                     <img class="media-preview" src="<?php echo $media_url; ?>" style="width:100%"/>
    481                     <div class="media-title"><?php echo $media_title; ?></div>
    482                     <?php
    483                 }else {
    484                     ?>
    485                     <img class="media-preview" src="<?php echo $media_url; ?>" style="width:100%"/>
    486                     <div class="media-title"><?php echo $media_title; ?></div>
    487 
    488                     <?php
    489                 }
    490                 ?>
    491             </div>
    492             <input class="media-input-value" type="hidden" name="<?php echo esc_attr($field_name); ?>" id="media_input_<?php echo esc_attr($css_id); ?>" value="<?php echo esc_attr($value); ?>" />
    493             <div class="media-upload button" id="media_upload_<?php echo $css_id; ?>"><?php echo __('Upload', $this->textdomain);?></div>
    494             <div placeholder="<?php echo $placeholder; ?>" class="clear button" id="media_clear_<?php echo $css_id; ?>"><?php echo __('Clear', $this->textdomain);?></div>
    495             <div class="error-mgs"></div>
    496         </div>
    497 
    498         <?php
    499 
    500 
    501         $input_html = ob_get_clean();
    502 
    503         echo sprintf($field_template, $title, $input_html, $details);
    504 
    505     }
    506 
    507 
    508 
    509 
    510     public function field_media_url( $option ){
    511 
    512 
    513 
    514         $id         = isset( $option['id'] ) ? $option['id'] : "";
    515         if(empty($id)) return;
    516         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    517         $field_name     = isset( $option['field_name'] ) ? $option['field_name'] : $id;
    518         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    519         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    520         $placeholder_img    = isset( $option['placeholder_img'] ) ? $option['placeholder_img'] : "";
    521 
    522         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    523         $title          = isset( $option['title'] ) ? $option['title'] : "";
    524         $details            = isset( $option['details'] ) ? $option['details'] : "";
    525 
    526         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    527         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    528 
    529         $default            = isset( $option['default'] ) ? $option['default'] : '';
    530         $value          = isset( $option['value'] ) ? $option['value'] : '';
    531         $value          = !empty($value) ?  $value : $default;
    532 
    533         $media_url  = $value;
    534         $media_type = get_post_mime_type( $value );
    535         $media_title= get_the_title( $value );
    536         $media_url = !empty($media_url) ? $media_url : '';
    537         $media_url = !empty($media_url) ? $media_url : $placeholder_img;
    538 
    539         $field_name     = !empty( $field_name ) ? $field_name : $id;
    540         $field_name = !empty($parent) ? $parent.'['.$field_name.']' : $field_name;
    541 
    542 
    543         wp_enqueue_media();
    544         ob_start();
    545 
    546 
    547         ?>
    548         <div id="input-wrapper-<?php echo $css_id; ?>" class="input-wrapper field-media-url-wrapper
    549             field-media-wrapper-<?php echo $css_id; ?>">
    550             <div class="media-preview-wrap" style="width: 150px;margin-bottom: 10px;background: #eee;padding: 5px;    text-align: center;">
    551                 <?php
    552 
    553                 if( "audio/mpeg" == $media_type ){
    554                     ?>
    555                     <div class="media-preview" class="dashicons dashicons-format-audio" style="font-size: 70px;display: inline;"></div>
    556 
    557                     <?php
    558                 }
    559                 elseif( "images/png" == $media_type || "images/jpg" == $media_type || "images/jpeg" == $media_type ||
    560                     "images/gif" == $media_type  ||
    561                     "images/ico" == $media_type){
    562                     ?>
    563                     <img class="media-preview" src="<?php echo $media_url; ?>" style="width:100%"/>
    564 
    565                     <?php
    566                 }
    567 
    568                 else {
    569                     ?>
    570                     <img class="media-preview" src="<?php echo $media_url; ?>" style="width:100%"/>
    571 
    572                     <?php
    573                 }
    574                 ?>
    575             </div>
    576             <input type="text" placeholder="<?php echo esc_attr($placeholder); ?>" name="<?php echo esc_attr($field_name); ?>" id="media_input_<?php echo esc_attr($css_id); ?>" value="<?php echo esc_attr($value); ?>" />
    577             <div class="media-upload button" id="media_upload_<?php echo $css_id; ?>"><?php echo __('Upload', $this->textdomain);?></div>
    578             <div class="clear button" id="media_clear_<?php echo $css_id; ?>"><?php echo __('Clear','post-grid');?></div>
    579             <div class="error-mgs"></div>
    580         </div>
    581 
    582         <?php
    583 
    584 
    585         $input_html = ob_get_clean();
    586 
    587         echo sprintf($field_template, $title, $input_html, $details);
    588 
    589     }
    590 
    591 
    592 
    593     public function field_repeatable( $option ){
    594 
    595         $id             = isset( $option['id'] ) ? $option['id'] : "";
    596         if(empty($id)) return;
    597         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    598         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    599         $field_name     = isset( $option['field_name'] ) ? $option['field_name'] : $id;
    600         $field_name     = !empty( $parent ) ? $parent.'['.$field_name.']' : $field_name;
    601 
    602         $sortable       = isset( $option['sortable'] ) ? $option['sortable'] : true;
    603         $collapsible    = isset( $option['collapsible'] ) ? $option['collapsible'] : true;
    604         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    605         $values         = isset( $option['value'] ) ? $option['value'] : array();
    606         $fields         = isset( $option['fields'] ) ? $option['fields'] : array();
    607         $title_field    = isset( $option['title_field'] ) ? $option['title_field'] : '';
    608         $remove_text    = isset( $option['remove_text'] ) ? $option['remove_text'] : '<i class="fas fa-times"></i>';
    609         $limit          = isset( $option['limit'] ) ? $option['limit'] : '';
    610 
    611         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    612         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    613 
    614         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    615         $title          = isset( $option['title'] ) ? $option['title'] : "";
    616         $details            = isset( $option['details'] ) ? $option['details'] : "";
    617 
    618         $settings_tabs_field = new settings_tabs_field();
    619 
    620 
    621         ob_start();
    622         ?>
    623         <div class="item-wrap collapsible">
    624             <div class="header">
    625                 <span class="remove" onclick="jQuery(this).parent().parent().remove()"><?php echo $remove_text; ?></span>
    626                 <?php
    627                 if($sortable):
    628                     ?>
    629                     <span class="sort" ><i class="fas fa-arrows-alt"></i></span>
    630                 <?php
    631                 endif;
    632                 ?>
    633                 <span  class="title-text">#TIMEINDEX</span>
    634             </div>
    635             <?php
    636 
    637 
    638             if(!empty($fields)):
    639                 foreach ($fields as $field):
    640 
    641                     $fieldType = isset($field['type']) ? $field['type'] : '';
    642                     $field['parent'] = $field_name.'[TIMEINDEX]';
    643 
    644 
    645                     ?>
    646                     <div class="item">
    647                         <?php if($collapsible):?>
    648                         <div class="content">
    649                             <?php endif; ?>
    650 
    651                             <?php
    652                             $settings_tabs_field->generate_field($field);
    653                             ?>
    654                             <?php if($collapsible):?>
    655                         </div>
    656                     <?php endif; ?>
    657 
    658                     </div>
    659                 <?php
    660 
    661                 endforeach;
    662             endif;
    663             ?>
    664         </div>
    665         <?php
    666 
    667         $fieldHtml = ob_get_clean();
    668 
    669         $fieldHtml = preg_replace("/[\r\n]+/", "\n", $fieldHtml);
    670         $fieldHtml = preg_replace("/\s+/", ' ', $fieldHtml);
    671 
    672 
    673         ob_start();
    674         ?>
    675 
    676 
    677         <div id="input-wrapper-<?php echo $css_id; ?>" class=" input-wrapper field-repeatable-wrapper
    678             field-repeatable-wrapper-<?php echo $css_id; ?>">
    679             <div add_html="<?php echo esc_attr($fieldHtml); ?>" class="add-repeat-field"><i class="far fa-plus-square"></i> <?php _e('Add','post-grid'); ?></div>
    680             <div class="repeatable-field-list sortable" id="<?php echo $css_id; ?>">
    681                 <?php
    682                 if(!empty($values)):
    683                     $count = 1;
    684                     foreach ($values as $index=>$val):
    685                         $title_field_val = !empty($val[$title_field]) ? $val[$title_field] : '#'.$count;
    686 
    687                     //var_dump($index);
    688 
    689                         ?>
    690                         <div class="item-wrap <?php if($collapsible) echo 'collapsible'; ?>" index="<?php echo $index; ?>">
    691                             <?php if($collapsible):?>
    692                             <div class="header">
    693                                 <?php endif; ?>
    694                                 <span class="remove" onclick="jQuery(this).parent().parent().remove()"><?php echo $remove_text; ?></span>
    695                                 <?php if($sortable):?>
    696                                     <span class="sort"><i class="fas fa-arrows-alt"></i></span>
    697                                 <?php endif; ?>
    698 
    699                                 <span class="title-text"><?php echo $title_field_val; ?></span>
    700                                 <?php if($collapsible):?>
    701                             </div>
    702                         <?php endif; ?>
    703                             <?php
    704 
    705 
    706 
    707                             foreach ($fields as $field_index => $field):
    708                                 $fieldId = $field['id'];
    709                                 $field_css_id = isset($field['css_id']) ? str_replace('TIMEINDEX', $index, $field['css_id']) : '';
    710 
    711                             //var_dump($field_css_id);
    712 
    713                                 $title_field_class = ($title_field == $field_index) ? 'title-field':'';
    714                                 ?>
    715                                 <div class="item <?php echo $title_field_class; ?>">
    716                                     <?php if($collapsible):?>
    717                                     <div class="content">
    718                                         <?php endif; ?>
    719 
    720                                         <?php
    721                                         $field['parent'] = $field_name.'['.$index.']';
    722                                         $field['css_id'] = $field_css_id;
    723 
    724                                         $field['value'] = isset($val[$fieldId]) ? $val[$fieldId] : '';
    725 
    726                                         $settings_tabs_field->generate_field($field);
    727 
    728 
    729                                         if($collapsible):?>
    730                                     </div>
    731                                 <?php endif; ?>
    732                                 </div>
    733                             <?php
    734 
    735                             endforeach; ?>
    736                         </div>
    737                         <?php
    738                         $count++;
    739                     endforeach;
    740                 else:
    741                     ?>
    742                 <?php
    743                 endif;
    744                 ?>
    745             </div>
    746             <div class="error-mgs"></div>
    747         </div>
    748 
    749         <?php
    750 
    751         $input_html = ob_get_clean();
    752 
    753         echo sprintf($field_template, $title, $input_html, $details);
    754 
    755 
    756 
    757     }
    758 
    759 
    760 
    761 
    762 
    763 
    764 
    765 
    766     public function field_select( $option ){
    767 
    768         $id             = isset( $option['id'] ) ? $option['id'] : "";
    769         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    770         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    771         $args   = isset( $option['args'] ) ? $option['args'] : array();
    772         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    773         $multiple   = isset( $option['multiple'] ) ? $option['multiple'] : false;
    774         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    775 
    776         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    777         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    778 
    779 
    780         $title          = isset( $option['title'] ) ? $option['title'] : "";
    781         $details            = isset( $option['details'] ) ? $option['details'] : "";
    782 
    783         if($is_pro == true){
    784             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    785         }
    786 
    787 
    788         if($multiple){
    789             $value  = isset( $option['value'] ) ? $option['value'] : array();
    790             $field_name = !empty($parent) ? $parent.'['.$id.'][]' : $id.'[]';
    791             $default    = isset( $option['default'] ) ? $option['default'] : array();
    792         }else{
    793             $value  = isset( $option['value'] ) ? $option['value'] : '';
    794             $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    795             $default    = isset( $option['default'] ) ? $option['default'] : '';
    796         }
    797 
    798 
    799         $value = !empty($value) ? $value : $default;
    800 
    801 
    802 
    803 
    804         ob_start();
    805         ?>
    806 
    807         <select  <?php if($multiple) echo 'multiple'; ?> name="<?php echo $field_name; ?>" id="<?php echo $css_id; ?>">
    808             <?php
    809             foreach( $args as $key => $name ):
    810                 if($multiple){
    811                     $selected =  in_array($key, $value) ? "selected" : "";
    812                 }else{
    813                     $selected = $value == $key ? "selected" : "";
    814                 }
    815 
    816 
    817                 ?>
    818                 <option <?php echo $selected; ?> value="<?php echo esc_attr($key); ?>"><?php echo esc_html($name); ?></option>
    819             <?php
    820             endforeach;
    821             ?>
    822         </select>
    823         <?php
    824         if($multiple):
    825             ?>
    826             <div class="button select-reset">Reset</div><br>
    827         <?php
    828         endif;
    829         ?>
    830 
    831         <?php
    832 
    833         $input_html = ob_get_clean();
    834 
    835         echo sprintf($field_template, $title, $input_html, $details);
    836 
    837 
    838     }
    839 
    840     public function field_select2( $option ){
    841 
    842         $id                 = isset( $option['id'] ) ? $option['id'] : "";
    843         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    844         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    845         $args               = isset( $option['args'] ) ? $option['args'] : array();
    846         $multiple           = isset( $option['multiple'] ) ? $option['multiple'] : "";
    847         $attributes         = isset( $option['attributes'] ) ? $option['attributes'] : array();
    848         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    849 
    850         $is_pro             = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    851         $pro_text           = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    852 
    853 
    854         //var_dump($css_id);
    855 
    856         if($multiple){
    857             $value  = isset( $option['value'] ) ? $option['value'] : array();
    858             $field_name = !empty($parent) ? $parent.'['.$id.'][]' : $id.'[]';
    859             $default    = isset( $option['default'] ) ? $option['default'] : array();
    860         }else{
    861             $value  = isset( $option['value'] ) ? $option['value'] : '';
    862             $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    863             $default    = isset( $option['default'] ) ? $option['default'] : '';
    864         }
    865 
    866         $value = !empty($value) ? $value : $default;
    867 
    868         //$value    = get_post_meta( $post_id, $id, true );
    869         $title          = isset( $option['title'] ) ? $option['title'] : "";
    870         $details            = isset( $option['details'] ) ? $option['details'] : "";
    871 
    872         $attributes_html = '';
    873 
    874         foreach ($attributes as $attributeId=>$attribute):
    875 
    876             $attributes_html = $attributeId.'='.$attribute.' ';
    877 
     1160      </div>
     1161    <?php
     1162      $input_html = ob_get_clean();
     1163      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1164    }
     1165    public function field_datepicker($option)
     1166    {
     1167      $id             = isset($option['id']) ? $option['id'] : "";
     1168      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1169      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1170      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1171      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     1172      $format     = isset($option['format']) ? $option['format'] : "";
     1173      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1174      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1175      $value     = isset($option['value']) ? $option['value'] : '';
     1176      $default     = isset($option['default']) ? $option['default'] : '';
     1177      $value = !empty($value) ? $value : $default;
     1178      $title            = isset($option['title']) ? $option['title'] : "";
     1179      $details             = isset($option['details']) ? $option['details'] : "";
     1180      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1181
     1182      ob_start();
     1183    ?>
     1184      <input type="text" autocomplete="off" name="<?php echo esc_attr($field_name); ?>" class="datepicker" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" format="<?php echo esc_attr($format); ?>" />
     1185
     1186    <?php
     1187      $input_html = ob_get_clean();
     1188      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1189    }
     1190    public function field_colorpicker($option)
     1191    {
     1192      $id             = isset($option['id']) ? $option['id'] : "";
     1193      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1194      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1195      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1196      $placeholder     = isset($option['placeholder']) ? $option['placeholder'] : "";
     1197      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1198      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1199      $value     = isset($option['value']) ? $option['value'] : '';
     1200      $default     = isset($option['default']) ? $option['default'] : '';
     1201      $value = !empty($value) ? $value : $default;
     1202      $title            = isset($option['title']) ? $option['title'] : "";
     1203      $details             = isset($option['details']) ? $option['details'] : "";
     1204      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1205      ob_start();
     1206    ?>
     1207      <input colorPicker="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr(esc_attr($placeholder)); ?>" value="<?php echo esc_attr($value); ?>" />
     1208      <?php
     1209      $input_html = ob_get_clean();
     1210      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1211    }
     1212    public function field_colorpicker_multi($option)
     1213    {
     1214      $id             = isset($option['id']) ? $option['id'] : "";
     1215      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1216      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1217      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1218      $args     = isset($option['args']) ? $option['args'] : "";
     1219      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1220      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1221      $value     = isset($option['value']) ? $option['value'] : '';
     1222      $default     = isset($option['default']) ? $option['default'] : '';
     1223      $value = !empty($value) ? $value : $default;
     1224      $title            = isset($option['title']) ? $option['title'] : "";
     1225      $details             = isset($option['details']) ? $option['details'] : "";
     1226      $field_name = !empty($parent) ? $parent . '[' . $id . ']' : $id;
     1227      ob_start();
     1228      if (!empty($args)) :
     1229        foreach ($args as $arg_key => $arg) :
     1230          $item_value = isset($value[$arg_key]) ? $value[$arg_key] : $arg;
     1231      ?>
     1232          <div class="">
     1233            <span><?php echo esc_html($arg_key); ?></span>
     1234            <input name="<?php echo esc_attr($field_name); ?>[<?php echo esc_attr($arg_key); ?>]" id="<?php echo esc_attr($arg_key . '-' . $css_id); ?>" class="color-picker" value="<?php echo esc_attr($item_value); ?>" />
     1235
     1236          </div>
     1237<?php
    8781238        endforeach;
    879 
    880 
    881         ob_start();
    882         ?>
    883         <select <?php echo esc_html($attributes_html); ?> class="select2" <?php if($multiple) echo 'multiple'; ?>  name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>">
    884             <?php
    885             foreach( $args as $key => $name ):
    886 
    887                 if($multiple){
    888                     $selected = in_array($key, $value) ? "selected" : "";
    889                 }else{
    890                     $selected = ($key == $value) ? "selected" : "";
    891                 }
    892 
    893                 ?>
    894                 <option <?php echo $selected; ?> value="<?php echo esc_attr($key); ?>"><?php echo esc_html($name); ?></option>
    895             <?php
    896             endforeach;
    897             ?>
    898         </select>
    899         <?php
    900 
    901         $input_html = ob_get_clean();
    902 
    903         echo sprintf($field_template, $title, $input_html, $details);
    904 
    905 
    906 
    907 
    908 
    909     }
    910 
    911 
    912 
    913 
    914 
    915     public function field_text_multi( $option ){
    916 
    917         $id             = isset( $option['id'] ) ? $option['id'] : "";
    918         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    919         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    920         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    921 
    922         $default    = isset( $option['default'] ) ? $option['default'] : array();
    923         $values     = isset( $option['value'] ) ? $option['value'] : $default;
    924 
    925         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    926 
    927         $remove_text    = isset( $option['remove_text'] ) ? $option['remove_text'] : '<i class="fas fa-times"></i>';
    928         $sortable       = isset( $option['sortable'] ) ? $option['sortable'] : true;
    929         $allow_clone        = isset( $option['allow_clone'] ) ? $option['allow_clone'] : false;
    930 
    931 
    932         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    933         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    934 
    935 
    936         $title          = isset( $option['title'] ) ? $option['title'] : "";
    937         $details            = isset( $option['details'] ) ? $option['details'] : "";
    938 
    939         if($is_pro == true){
    940             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    941         }
    942 
    943         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    944 
    945 
    946         ob_start();
    947         ?>
    948         <div  id="input-wrapper-<?php echo $id; ?>" class="input-wrapper input-text-multi-wrapper
    949             input-text-multi-wrapper-<?php echo $css_id; ?>">
    950             <span data-placeholder="<?php echo esc_attr($placeholder); ?>" data-sort="<?php echo $sortable; ?>" data-clone="<?php echo $allow_clone; ?>" data-name="<?php echo $field_name; ?>[]" class="button add-item"><?php echo __('Add', $this->textdomain); ?></span>
    951             <div class="field-list <?php if($sortable){ echo 'sortable'; }?>" id="<?php echo $css_id; ?>">
    952                 <?php
    953                 if(!empty($values)):
    954                     foreach ($values as $value):
    955                         ?>
    956                         <div class="item">
    957                             <input type="text" name="<?php echo esc_attr($field_name); ?>[]"  placeholder="<?php
    958                             echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
    959 
    960                             <?php if($allow_clone):?>
    961                                 <span class="button clone"><i class="far fa-clone"></i></span>
    962                             <?php endif; ?>
    963 
    964 
    965                             <?php if($sortable):?>
    966                                 <span class="button sort"><i class="fas fa-arrows-alt"></i></span>
    967                             <?php endif; ?>
    968 
    969                             <span class="button remove" onclick="jQuery(this).parent().remove()"><?php echo ($remove_text); ?></span>
    970                         </div>
    971                     <?php
    972                     endforeach;
    973 
    974                 else:
    975 
    976                     ?>
    977                     <div class="item">
    978                         <input type="text" name="<?php echo esc_attr($field_name); ?>[]"  placeholder="<?php
    979                         echo esc_attr($placeholder); ?>" value="" />
    980 
    981                         <?php if($allow_clone):?>
    982                             <span class="button clone"><i class="far fa-clone"></i></span>
    983                         <?php endif; ?>
    984 
    985 
    986                         <?php if($sortable):?>
    987                             <span class="button sort"><i class="fas fa-arrows-alt"></i></span>
    988                         <?php endif; ?>
    989 
    990                         <span class="button remove" onclick="jQuery(this).parent().remove()"><?php echo ($remove_text); ?></span>
    991                     </div>
    992                 <?php
    993 
    994                 endif;
    995                 ?>
    996             </div>
    997             <div class="error-mgs"></div>
    998 
    999 
    1000         </div>
    1001 
    1002         <?php
    1003 
    1004         $input_html = ob_get_clean();
    1005 
    1006         echo sprintf($field_template, $title, $input_html, $details);
    1007 
    1008     }
    1009 
    1010     public function field_hidden( $option ){
    1011 
    1012         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1013         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1014         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1015         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1016         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1017         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1018         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1019 
    1020         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1021         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1022 
    1023         $value = !empty($value) ? $value : $default;
    1024 
    1025         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1026         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1027 
    1028         if($is_pro == true){
    1029             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    1030         }
    1031 
    1032         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1033 
    1034 
    1035         ob_start();
    1036         ?>
    1037         <input type="hidden" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
    1038         <?php
    1039 
    1040         $input_html = ob_get_clean();
    1041 
    1042         echo sprintf($field_template, $title, $input_html, $details);
    1043 
    1044     }
    1045 
    1046 
    1047     public function field_text( $option ){
    1048 
    1049         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1050         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1051         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1052         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1053         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1054         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1055         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1056 
    1057         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1058         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1059 
    1060         $value = !empty($value) ? $value : $default;
    1061 
    1062         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1063         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1064 
    1065         if($is_pro == true){
    1066             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    1067         }
    1068 
    1069         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1070 
    1071 
    1072         ob_start();
    1073         ?>
    1074         <input type="text" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
    1075         <?php
    1076 
    1077         $input_html = ob_get_clean();
    1078 
    1079         echo sprintf($field_template, $title, $input_html, $details);
    1080 
    1081     }
    1082 
    1083 
    1084 
    1085     public function field_wp_editor( $option ){
    1086 
    1087         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1088         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1089         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1090         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1091         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1092         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1093         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1094 
    1095 
    1096 
    1097         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1098         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1099 
    1100         $value = !empty($value) ? $value : $default;
    1101 
    1102         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1103         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1104 
    1105         if($is_pro == true){
    1106             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    1107         }
    1108 
    1109         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1110 
    1111         $editor_settings= isset( $option['editor_settings'] ) ? $option['editor_settings'] : array('textarea_name'=>$field_name, 'teeny' => true,  'textarea_rows' => 15, );
    1112 
    1113         ob_start();
    1114 
    1115         ?>
    1116         <div id="field-wrapper-<?php echo $id; ?>" class="<?php if(!empty($depends)) echo 'dependency-field'; ?> field-wrapper field-wp_editor-wrapper
    1117             field-wp_editor-wrapper-<?php echo $id; ?>">
    1118             <?php
    1119             wp_editor( $value, $css_id, $editor_settings);
    1120             ?>
    1121             <div class="error-mgs"></div>
    1122         </div>
    1123 
    1124         <?php
    1125 
    1126 
    1127 
    1128 
    1129         $input_html = ob_get_clean();
    1130 
    1131         echo sprintf($field_template, $title, $input_html, $details);
    1132 
    1133     }
    1134 
    1135 
    1136 
    1137 
    1138 
    1139 
    1140     public function field_text_icon( $option ){
    1141 
    1142         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1143         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1144         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1145         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1146         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1147         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1148         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1149 
    1150         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1151         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1152 
    1153         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1154         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1155 
    1156         $option_value = empty($value) ? $default : $value;
    1157 
    1158         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1159 
    1160 
    1161 
    1162 
    1163         ob_start();
    1164         ?>
    1165         <div class="text-icon">
    1166             <span class="icon"><?php echo $option_value; ?></span><input type="text" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($option_value); ?>" />
    1167         </div>
    1168         <style type="text/css">
    1169             .text-icon{}
    1170             .text-icon .icon{
    1171                 /* width: 30px; */
    1172                 background: #ddd;
    1173                 /* height: 28px; */
    1174                 display: inline-block;
    1175                 vertical-align: top;
    1176                 text-align: center;
    1177                 font-size: 14px;
    1178                 padding: 5px 10px;
    1179                 line-height: normal;
    1180             }
    1181         </style>
    1182         <script>
    1183             jQuery(document).ready(function($){
    1184                 $(document).on("keyup", ".text-icon input", function () {
    1185                     val = $(this).val();
    1186                     if(val){
    1187                         $(this).parent().children(".icon").html(val);
    1188                     }
    1189                 })
    1190             })
    1191         </script>
    1192         <?php
    1193 
    1194         $input_html = ob_get_clean();
    1195 
    1196         echo sprintf($field_template, $title, $input_html, $details);
    1197 
    1198     }
    1199 
    1200 
    1201 
    1202     public function field_range( $option ){
    1203 
    1204         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1205         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1206         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1207         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1208 
    1209         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1210         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1211 
    1212         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1213         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1214         $value = !empty($value) ? $value : $default;
    1215 
    1216         $args   = isset( $option['args'] ) ? $option['args'] : "";
    1217 
    1218         $min = isset($args['min']) ? $args['min'] : '';
    1219         $max = isset($args['max']) ? $args['max'] : '';
    1220         $step = isset($args['step']) ? $args['step'] : '';
    1221 
    1222         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1223         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1224 
    1225         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1226 
    1227 
    1228         ob_start();
    1229         ?>
    1230         <div class="range-input">
    1231             <span class="range-value"><?php echo $value; ?></span><input type="range" min="<?php if($min) echo esc_attr($min); ?>" max="<?php if($max) echo esc_attr($max); ?>" step="<?php if($step) echo esc_attr($step); ?>" class="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" value="<?php echo esc_attr($value); ?>" />
    1232         </div>
    1233 
    1234         <script>
    1235             jQuery(document).ready(function($){
    1236                 $(document).on("change", "#<?php echo $css_id; ?>", function () {
    1237                     val = $(this).val();
    1238                     if(val){
    1239                         $(this).parent().children(".range-value").html(val);
    1240                     }
    1241                 })
    1242             })
    1243         </script>
    1244 
    1245         <style type="text/css">
    1246             .range-input{}
    1247             .range-input .range-value{
    1248                 display: inline-block;
    1249                 vertical-align: top;
    1250                 margin: 0 0;
    1251                 padding: 4px 10px;
    1252                 background: #eee;
    1253             }
    1254         </style>
    1255         <?php
    1256 
    1257         $input_html = ob_get_clean();
    1258         echo sprintf($field_template, $title, $input_html, $details);
    1259     }
    1260 
    1261 
    1262 
    1263     public function field_textarea( $option ){
    1264 
    1265         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1266         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1267         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1268         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1269         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1270         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1271         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1272         $value = !empty($value) ? $value : $default;
    1273 
    1274         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1275         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1276 
    1277         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1278         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1279 
    1280         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1281 
    1282         if($is_pro == true){
    1283             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    1284         }
    1285 
    1286 
    1287         ob_start();
    1288         ?>
    1289         <textarea name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" cols="40" rows="5" placeholder="<?php echo esc_attr($placeholder); ?>"><?php echo esc_textarea($value); ?></textarea>
    1290         <?php
    1291 
    1292         $input_html = ob_get_clean();
    1293 
    1294         echo sprintf($field_template, $title, $input_html, $details);
    1295 
    1296     }
    1297 
    1298 
    1299 
    1300     public function field_textarea_editor( $option ){
    1301 
    1302         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1303         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1304         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1305         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1306         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1307         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1308         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1309         $value = !empty($value) ? $value : $default;
    1310 
    1311         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1312         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1313 
    1314         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1315         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1316 
    1317         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1318 
    1319         if($is_pro == true){
    1320             $details = '<span class="pro-feature">'.$pro_text.'</span> '.$details;
    1321         }
    1322 
    1323 
    1324         ob_start();
    1325         ?>
    1326         <textarea editor_enabled="no" class="textarea-editor" name="<?php echo $field_name; ?>" id="<?php echo $css_id; ?>" cols="40" rows="5" placeholder="<?php echo $placeholder; ?>"><?php echo $value; ?></textarea>
    1327         <?php
    1328 
    1329         $input_html = ob_get_clean();
    1330 
    1331         echo sprintf($field_template, $title, $input_html, $details);
    1332 
    1333     }
    1334 
    1335 
    1336 
    1337     public function field_scripts_js( $option ){
    1338 
    1339         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1340         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1341         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1342         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1343         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1344         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1345         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1346         $value = !empty($value) ? $value : $default;
    1347 
    1348         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1349         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1350 
    1351         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1352         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1353 
    1354         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1355 
    1356         $settings = wp_enqueue_code_editor( array( 'type' => 'text/javascript' ) );
    1357         $code_editor = wp_json_encode( $settings );
    1358 
    1359 
    1360         ob_start();
    1361         ?>
    1362         <textarea name="<?php echo $field_name; ?>" id="<?php echo $css_id; ?>" cols="40" rows="5" placeholder="<?php echo $placeholder; ?>"><?php echo $value; ?></textarea>
    1363 
    1364         <script>
    1365             jQuery(document).ready(function($){
    1366                 wp.codeEditor.initialize($('#<?php echo $css_id; ?>'), <?php echo $code_editor; ?>);
    1367             })
    1368         </script>
    1369         <?php
    1370 
    1371         $input_html = ob_get_clean();
    1372 
    1373         echo sprintf($field_template, $title, $input_html, $details);
    1374 
    1375 
    1376 
    1377 
    1378     }
    1379 
    1380 
    1381     public function field_scripts_css( $option ){
    1382 
    1383         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1384         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1385         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1386 
    1387         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1388         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1389         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1390         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1391         $value = !empty($value) ? $value : $default;
    1392 
    1393         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1394         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1395 
    1396         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1397         $details        = isset( $option['details'] ) ? $option['details'] : "";
    1398 
    1399         $settings = wp_enqueue_code_editor( array( 'type' => 'text/css' ) );
    1400         $code_editor = wp_json_encode( $settings );
    1401 
    1402         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1403         ?>
    1404 
    1405         <?php
    1406 
    1407         ob_start();
    1408         ?>
    1409         <textarea name="<?php echo $field_name; ?>" id="<?php echo $css_id; ?>" cols="40" rows="5" placeholder="<?php echo $placeholder; ?>"><?php echo $value; ?></textarea>
    1410         <script>
    1411 
    1412 
    1413             jQuery(document).ready(function($){
    1414 
    1415                 wp.codeEditor.initialize($('#<?php echo $css_id; ?>'), <?php echo $code_editor; ?>);
    1416 
    1417 
    1418             })
    1419 
    1420 
    1421 
    1422 
    1423         </script>
    1424         <?php
    1425 
    1426         $input_html = ob_get_clean();
    1427 
    1428         echo sprintf($field_template, $title, $input_html, $details);
    1429 
    1430     }
    1431 
    1432 
    1433 
    1434 
    1435 
    1436     public function field_checkbox( $option ){
    1437 
    1438         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1439         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1440         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1441         $details        = isset( $option['details'] ) ? $option['details'] : "";
    1442         $for        = isset( $option['for'] ) ? $option['for'] : "";
    1443         $args           = isset( $option['args'] ) ? $option['args'] : array();
    1444 
    1445         $style          = isset( $option['style'] ) ? $option['style'] : array();
    1446         $style_inline           = isset( $style['inline'] ) ? $style['inline'] : true;
    1447 
    1448 
    1449         $option_value   = isset( $option['value'] ) ? $option['value'] : '';
    1450         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1451         $option_value = !empty($option_value) ? $option_value : $default;
    1452 
    1453         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1454 
    1455 
    1456 
    1457         ?>
    1458         <div class="setting-field">
    1459             <div class="field-lable"><?php if(!empty($title)) echo $title;  ?></div>
    1460             <div class="field-input">
    1461                 <?php
    1462 
    1463 
    1464 
    1465                 if(!empty($args))
    1466                     foreach( $args as $key => $value ):
    1467 
    1468 
    1469                         //$checked = ( $key == $option_value ) ? "checked" : "";
    1470                         $checked = in_array($key, $option_value) ? "checked" : "";
    1471 
    1472                         $for = !empty($for) ? $for.'-'.$id."-".$key : $id."-".$key;
    1473 
    1474 
    1475                         ?>
    1476                         <label for='<?php echo $for;?>'><input name='<?php echo esc_attr($field_name); ?>[]' type='checkbox' id='<?php echo esc_attr($for); ?>' value='<?php echo esc_attr($key);?>'  <?php echo esc_attr($checked);?>><span><?php echo esc_html($value);?></span></label>
    1477 
    1478                         <?php
    1479 
    1480                         if(!$style_inline){
    1481                             ?>
    1482                             <br>
    1483                             <?php
    1484                         }
    1485 
    1486                     endforeach;
    1487 
    1488                 ?>
    1489                 <p class="description"><?php if(!empty($details)) echo $details;  ?></p>
    1490             </div>
    1491         </div>
    1492         <?php
    1493 
    1494 
    1495     }
    1496 
    1497 
    1498 
    1499     public function field_radio( $option ){
    1500 
    1501         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1502         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1503         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1504         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1505         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1506         $details        = isset( $option['details'] ) ? $option['details'] : "";
    1507         $for        = isset( $option['for'] ) ? $option['for'] : "";
    1508         $args           = isset( $option['args'] ) ? $option['args'] : array();
    1509 
    1510         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1511         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1512 
    1513         $option_value   = isset( $option['value'] ) ? $option['value'] : '';
    1514         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1515         $option_value = !empty($option_value) ? $option_value : $default;
    1516 
    1517         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1518 
    1519 
    1520         ob_start();
    1521 
    1522         if(!empty($args))
    1523             foreach( $args as $key => $value ):
    1524                 $checked = ( $key == $option_value ) ? "checked" : "";
    1525                 $for = !empty($for) ? $for.'-'.$css_id."-".$key : $css_id."-".$key;
    1526                 ?>
    1527                 <label for="<?php echo $for;?>"><input name="<?php echo esc_attr($field_name); ?>" type="radio" id="<?php echo esc_attr($for); ?>" value="<?php echo esc_attr($key);?>"  <?php echo esc_attr($checked);?>><span><?php echo esc_html($value);?></span></label>
    1528 
    1529                 <?php
    1530             endforeach;
    1531 
    1532         $input_html = ob_get_clean();
    1533 
    1534         echo sprintf($field_template, $title, $input_html, $details);
    1535 
    1536 
    1537     }
    1538 
    1539 
    1540 
    1541     public function field_radio_image( $option ){
    1542 
    1543         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1544         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1545         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1546         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1547         $args           = isset( $option['args'] ) ? $option['args'] : array();
    1548         //$args         = is_array( $args ) ? $args : $this->generate_args_from_string( $args );
    1549         $option_value   = isset( $option['value'] ) ? $option['value'] : '';
    1550         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1551         $lazy_load_img  = isset( $option['lazy_load_img'] ) ? $option['lazy_load_img'] : '';
    1552 
    1553         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1554         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1555 
    1556         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1557         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1558         $width          = isset( $option['width'] ) ? $option['width'] : "250px";
    1559 
    1560         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1561 
    1562         //var_dump($option_value);
    1563 
    1564         $option_value = empty($option_value) ? $default : $option_value;
    1565 
    1566 
    1567 
    1568         ob_start();
    1569         ?>
    1570         <div class="radio-img">
    1571             <?php
    1572             foreach( $args as $key => $value ):
    1573 
    1574                 $name = $value['name'];
    1575                 $thumb = $value['thumb'];
    1576                 $disabled = isset($value['disabled']) ? $value['disabled'] : '';
    1577                 $pro_msg = isset($value['pro_msg']) ? $value['pro_msg'] : '';
    1578                 $link = isset($value['link']) ? $value['link'] : '';
    1579                 $link_text = isset($value['link_text']) ? $value['link_text'] : 'Go';
    1580 
    1581                 $checked = ($key == $option_value) ? "checked" : "";
    1582 
    1583                 //var_dump($checked);
    1584 
    1585                 ?>
    1586                 <label style="width: <?php echo $width; ?>;" title="<?php echo $name; ?>" class="<?php if($checked =='checked') echo 'active';?> <?php if($disabled == true) echo 'disabled';?>">
    1587                     <input <?php if($disabled) echo 'disabled'; ?>  name="<?php echo esc_attr($field_name); ?>" type="radio" id="<?php echo esc_attr($css_id); ?>-<?php echo esc_attr($key); ?>" value="<?php echo esc_attr($key); ?>"  <?php echo esc_attr($checked); ?>>
    1588 
    1589                     <?php
    1590                     if(!empty($thumb)):
    1591 
    1592                         ?>
    1593                         <img class="lazy"  alt="<?php echo $name; ?>" data-src="<?php echo $thumb; ?>" src="<?php echo $lazy_load_img; ?>">
    1594                         <div style="padding: 5px;" class="name"><?php echo $name; ?></div>
    1595 
    1596                         <?php
    1597                     else:
    1598                          echo $name;
    1599                     endif;
    1600                     ?>
    1601 
    1602                     <?php if($disabled == true):?>
    1603                     <span class="pro-msg"><?php echo $pro_msg; ?></span>
    1604                     <?php endif; ?>
    1605                     <?php if(!empty($link)):?>
    1606                         <a target="_blank" class="link" href="<?php echo $link; ?>"><?php echo $link_text; ?></a>
    1607                     <?php endif; ?>
    1608 
    1609                 </label>
    1610             <?php
    1611 
    1612             endforeach;
    1613             ?>
    1614         </div>
    1615 
    1616         <style type="text/css">
    1617             .radio-img{}
    1618             .radio-img label{
    1619                 display: inline-block;
    1620                 vertical-align: top;
    1621                 margin: 5px;
    1622                 padding: 2px;
    1623                 background: #eee;
    1624                 position: relative;
    1625             }
    1626 
    1627             .radio-img label.active{
    1628                 background: #fd730d;
    1629             }
    1630 
    1631             .radio-img label.disabled{
    1632                 background: #e2e2e2;
    1633 
    1634             }
    1635             .radio-img label.disabled img{
    1636                 background: #e2e2e2;
    1637                 opacity: .3;
    1638             }
    1639 
    1640             .radio-img label.disabled .pro-msg{
    1641                 background: #ffd87f;
    1642                 position: absolute;
    1643                 top: 50%;
    1644                 left: 50%;
    1645                 transform: translate(-50%,-50%);
    1646                 padding: 0 10px;
    1647 
    1648             }
    1649 
    1650             .radio-img label .link{
    1651                 background: hsl(200, 7%, 42%);
    1652                 position: absolute;
    1653                 top: 2px;
    1654                 /* transform: translate(0%,-50%); */
    1655                 padding: 3px 14px;
    1656                 text-decoration: none;
    1657                 font-size: 14px;
    1658                 color: #fff;
    1659                 right: 2px;
    1660 
    1661             }
    1662 
    1663 
    1664             .radio-img input[type=radio]{
    1665                 display: none;
    1666             }
    1667             .radio-img img{
    1668 
    1669                 vertical-align: top;
    1670                 width: 100%;
    1671             }
    1672 
    1673         </style>
    1674         <?php
    1675 
    1676         $input_html = ob_get_clean();
    1677 
    1678         echo sprintf($field_template, $title, $input_html, $details);
    1679 
    1680 
    1681     }
    1682 
    1683     public function field_datepicker( $option ){
    1684 
    1685         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1686         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1687         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1688         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1689         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1690         $format     = isset( $option['format'] ) ? $option['format'] : "";
    1691 
    1692         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1693         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1694 
    1695         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1696         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1697         $value = !empty($value) ? $value : $default;
    1698 
    1699         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1700         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1701 
    1702         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1703 
    1704 
    1705         wp_enqueue_script('jquery-ui-datepicker');
    1706         wp_enqueue_style( 'jquery-ui');
    1707 
    1708         ob_start();
    1709         ?>
    1710         <input type="text" autocomplete="off"  name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
    1711         <script>jQuery(document).ready(function($) { $("#<?php echo $css_id; ?>").datepicker({ dateFormat: "<?php echo $format; ?>" });});</script>
    1712         <?php
    1713 
    1714         $input_html = ob_get_clean();
    1715 
    1716         echo sprintf($field_template, $title, $input_html, $details);
    1717     }
    1718 
    1719 
    1720 
    1721     public function field_colorpicker( $option ){
    1722 
    1723         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1724         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1725         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1726         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1727         $placeholder    = isset( $option['placeholder'] ) ? $option['placeholder'] : "";
    1728 
    1729         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1730         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1731 
    1732         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1733         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1734         $value = !empty($value) ? $value : $default;
    1735 
    1736         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1737         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1738 
    1739         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1740 
    1741         ob_start();
    1742         ?>
    1743         <input colorPicker="" name="<?php echo esc_attr($field_name); ?>" id="<?php echo esc_attr($css_id); ?>" placeholder="<?php echo esc_attr($placeholder); ?>" value="<?php echo esc_attr($value); ?>" />
    1744         <?php
    1745 
    1746         $input_html = ob_get_clean();
    1747 
    1748         echo sprintf($field_template, $title, $input_html, $details);
    1749     }
    1750 
    1751 
    1752     public function field_colorpicker_multi( $option ){
    1753 
    1754         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1755         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1756         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1757         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1758         $args   = isset( $option['args'] ) ? $option['args'] : "";
    1759 
    1760 
    1761         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1762         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1763 
    1764         $value  = isset( $option['value'] ) ? $option['value'] : '';
    1765         $default    = isset( $option['default'] ) ? $option['default'] : '';
    1766         $value = !empty($value) ? $value : $default;
    1767 
    1768         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1769         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1770 
    1771         $field_name = !empty($parent) ? $parent.'['.$id.']' : $id;
    1772 
    1773 
    1774 
    1775         //echo '<pre>'.var_export($args, true).'</pre>';
    1776 
    1777         ob_start();
    1778 
    1779         if(!empty($args)):
    1780 
    1781             foreach ($args as $arg_key => $arg):
    1782 
    1783                 $item_value = isset($value[$arg_key]) ? $value[$arg_key] : $arg;
    1784 
    1785 
    1786                 ?>
    1787                 <div class="">
    1788                     <span><?php echo $arg_key; ?></span>
    1789                     <input name="<?php echo esc_attr($field_name); ?>[<?php echo esc_attr($arg_key); ?>]" id="<?php echo esc_attr($arg_key).'-'.esc_attr($css_id); ?>"  value="<?php echo esc_attr($item_value); ?>" />
    1790                     <script>jQuery(document).ready(function($) { $("#<?php echo $arg_key.'-'.$css_id; ?>").wpColorPicker();});</script>
    1791                 </div>
    1792 
    1793             <?php
    1794             endforeach;
    1795 
    1796         endif;
    1797 
    1798 
    1799         $input_html = ob_get_clean();
    1800 
    1801         echo sprintf($field_template, $title, $input_html, $details);
    1802     }
    1803 
    1804 
    1805 
    1806     public function field_custom_html( $option ){
    1807 
    1808         $id             = isset( $option['id'] ) ? $option['id'] : "";
    1809         $css_id             = isset( $option['css_id'] ) ? $option['css_id'] : $id;
    1810         $parent             = isset( $option['parent'] ) ? $option['parent'] : "";
    1811         $field_template     = isset( $option['field_template'] ) ? $option['field_template'] : $this->field_template($option);
    1812         $html   = isset( $option['html'] ) ? $option['html'] : "";
    1813 
    1814         $is_pro     = isset( $option['is_pro'] ) ? $option['is_pro'] : false;
    1815         $pro_text   = isset( $option['pro_text'] ) ? $option['pro_text'] : '';
    1816 
    1817         $title          = isset( $option['title'] ) ? $option['title'] : "";
    1818         $details            = isset( $option['details'] ) ? $option['details'] : "";
    1819 
    1820 
    1821         echo sprintf($field_template, $title, $html, $details);
    1822 
    1823 
    1824 
    1825 
    1826 
    1827 
    1828 
    1829     }
    1830 
    1831 
    1832 
    1833 }}
     1239      endif;
     1240      $input_html = ob_get_clean();
     1241      echo wp_kses(sprintf($field_template, esc_html($title), $input_html, wp_kses_post($details)), $this->allowed_html());
     1242    }
     1243    public function field_custom_html($option)
     1244    {
     1245      $id             = isset($option['id']) ? $option['id'] : "";
     1246      $css_id             = isset($option['css_id']) ? $option['css_id'] : $id;
     1247      $parent             = isset($option['parent']) ? $option['parent'] : "";
     1248      $field_template     = isset($option['field_template']) ? $option['field_template'] : $this->field_template($option);
     1249      $html     = isset($option['html']) ? $option['html'] : "";
     1250      $is_pro     = isset($option['is_pro']) ? $option['is_pro'] : false;
     1251      $pro_text     = isset($option['pro_text']) ? $option['pro_text'] : '';
     1252      $title            = isset($option['title']) ? $option['title'] : "";
     1253      $details             = isset($option['details']) ? $option['details'] : "";
     1254      echo wp_kses(sprintf($field_template, esc_html($title), $html, wp_kses_post($details)), $this->allowed_html());
     1255    }
     1256  }
     1257}

  • social-share-button/trunk/includes/class-shortcodes.php

    r2518411 r3428462  
    2424        $social_share_button_settings = get_option( 'social_share_button_settings' );
    2525        $theme = $social_share_button_settings['theme'];
    26         $custom_css = $social_share_button_settings['custom_css'];
    2726        $themes = $theme;
    2827
    2928
    30         //$themes = $_GET['themes'];
    3129
    3230
    … …  
    4240        include $social_share_button_themes_dir[$themes].'/index.php';
    4341
    44         echo $html;
     42        echo wp_kses_post($html);
    4543
    4644
    47         ?>
    48         <style type="text/css"><?php echo $custom_css; ?></style>
    49         <?php
     45 
    5046
    5147        return ob_get_clean();

  • social-share-button/trunk/includes/functions-settings.php

    r2517096 r3428462  
    1212    $social_share_button_settings = get_option( 'social_share_button_settings' );
    1313
    14     $max_button_count = $social_share_button_settings['max_button_count'];
    15     $display_more_button = $social_share_button_settings['display_more_button'];
    16     $display_total_count = $social_share_button_settings['display_total_count'];
    17     $count_format = $social_share_button_settings['count_format'];
    18     $sharing_media = $social_share_button_settings['sharing_media'];
     14    $max_button_count = isset($social_share_button_settings['max_button_count']) ? $social_share_button_settings['max_button_count'] : 4;
     15    $display_more_button = isset($social_share_button_settings['display_more_button']) ? $social_share_button_settings['display_more_button'] : 'no';
     16    $display_total_count = isset($social_share_button_settings['display_total_count']) ? $social_share_button_settings['display_total_count'] : 'no';
     17    $count_format = isset($social_share_button_settings['count_format']) ? $social_share_button_settings['count_format'] : 'full';
     18    $sharing_media = isset($social_share_button_settings['sharing_media']) ? $social_share_button_settings['sharing_media'] : array();
    1919
    2020    if(empty($sharing_media)) {
    … …  
    231231    $social_share_button_settings = get_option( 'social_share_button_settings' );
    232232
    233     $theme = $social_share_button_settings['theme'];
     233    $theme = isset($social_share_button_settings['theme']) ? $social_share_button_settings['theme'] : '';
    234234
    235235
    … …  
    411411                    <div class="item template <?php //echo $post_type; ?>">
    412412                        <div class="header">
    413                                 <span title="<?php echo __('Click to expand', 'job-board-manager'); ?>" class="expand ">
     413                                <span title="<?php echo esc_html__('Click to expand', 'social-share-button'); ?>" class="expand ">
    414414                                    <i class="fa fa-expand"></i>
    415415                                    <i class="fa fa-compress"></i>
    … …  
    419419                            if($enable =='yes'):
    420420                                ?>
    421                                 <span title="<?php echo __('Enable', 'job-board-manager'); ?>" class="is-enable ">
     421                                <span title="<?php echo esc_html__('Enable', 'social-share-button'); ?>" class="is-enable ">
    422422                                        <i class="fa fa-check-square"></i>
    423423                                    </span>
    … …  
    425425                            else:
    426426                                ?>
    427                                 <span title="<?php echo __('Disabled', 'job-board-manager'); ?>" class="is-enable ">
     427                                <span title="<?php echo esc_html__('Disabled', 'social-share-button'); ?>" class="is-enable ">
    428428                                    <i class="fa fa-times-circle"></i>
    429429                                    </span>
    … …  
    433433
    434434
    435                             <?php echo $post_name; ?>
     435                            <?php echo esc_html($post_name); ?>
    436436                        </div>
    437437                        <input type="hidden" name="wishlist_settings[post_types_display][<?php echo esc_attr($post_type); ?>][name]" value="<?php echo esc_attr($post_type); ?>" />
    438438                        <div class="options">
    439                             <div class="description"><?php echo $description; ?></div><br/><br/>
     439                            <div class="description"><?php echo esc_html($description); ?></div><br/><br/>
    440440
    441441                            <?php
    … …  
    444444                                'id'        => 'enable',
    445445                                'parent'        => 'social_share_button_settings[post_types_display]['.$post_type.']',
    446                                 'title'     => __('Enable?','related-post'),
    447                                 'details'   => sprintf(__('Enable or disable related post automatically for %s.','related-post'), $post_type),
     446                                'title'     => esc_html__('Enable?','social-share-button'),
     447/* translators: Post Type name */
     448                                'details'   => sprintf(esc_html__('Enable or disable related post automatically for %s.','social-share-button'), $post_type),
    448449                                'type'      => 'select',
    449450                                'value'     => $enable,
    … …  
    460461                                'id'        => 'content_position',
    461462                                'parent'        => 'social_share_button_settings[post_types_display]['.$post_type.']',
    462                                 'title'     => __('Content positions','related-post'),
    463                                 'details'   => __('Display before or after content.','related-post'),
     463                                'title'     => __('Content positions','social-share-button'),
     464                                'details'   => __('Display before or after content.','social-share-button'),
    464465                                'type'      => 'checkbox',
    465466                                'value'     => $content_position,
    … …  
    475476                                'id'        => 'excerpt_position',
    476477                                'parent'        => 'social_share_button_settings[post_types_display]['.$post_type.']',
    477                                 'title'     => __('Excerpt positions','related-post'),
    478                                 'details'   => __('Display before or after excerpt.','related-post'),
     478                                'title'     => __('Excerpt positions','social-share-button'),
     479                                'details'   => __('Display before or after excerpt.','social-share-button'),
    479480                                'type'      => 'checkbox',
    480481                                'value'     => $excerpt_position,
    … …  
    493494                                'id'        => 'paragraph_positions',
    494495                                'parent'        => 'social_share_button_settings[post_types_display]['.$post_type.']',
    495                                 'title'     => __('Paragraph positions','related-post'),
    496                                 'details'   => __('Display related post after n\'th paragraph. N is total paragraph count, use comma to separate.','related-post'),
     496                                'title'     => __('Paragraph positions','social-share-button'),
     497                                'details'   => __('Display related post after n\'th paragraph. N is total paragraph count, use comma to separate.','social-share-button'),
    497498                                'type'      => 'text',
    498499                                'value'     => $paragraph_positions,
    … …  
    508509                                'id'        => 'headline_text',
    509510                                'parent'        => 'social_share_button_settings[post_types_display]['.$post_type.']',
    510                                 'title'     => __('Headline text','related-post'),
    511                                 'details'   => __('Custom text for related post headline..','related-post'),
     511                                'title'     => __('Headline text','social-share-button'),
     512                                'details'   => __('Custom text for related post headline..','social-share-button'),
    512513                                'type'      => 'text',
    513514                                'value'     => $headline_text,
    … …  
    545546            'id'        => 'post_types',
    546547            //'parent'      => '',
    547             'title'     => __('Post types display','job-board-manager'),
    548             'details'   => __('Display automatically wishlist under following post types content and excerpt.','job-board-manager'),
     548            'title'     => __('Post types display','social-share-button'),
     549            'details'   => __('Display automatically wishlist under following post types content and excerpt.','social-share-button'),
    549550            'type'      => 'custom_html',
    550551            //'multiple'        => true,
    … …  
    606607
    607608
    608         <style type="text/css">
     609       
     610        <?php
     611        $html = ob_get_clean();
     612        $args = array(
     613            'id' => 'breadcrumb_shortcodes',
     614            'title' => __('Get shortcode', 'social-share-button'),
     615            'details' => '',
     616            'type' => 'custom_html',
     617            'html' => $html,
     618        );
     619        $settings_tabs_field->generate_field($args);
     620
     621
     622
     623
     624
     625
     626        ob_start();
     627        ?>
     628
     629
     630        <div class="">
     631            <video autoplay="" loop="" class="" style="max-width: 100%; min-height: 505px;"><source type="video/mp4" src="<?php echo esc_url(social_share_button_plugin_url.'assets/admin/images/tBpP1jl.mp4'); ?>"></video>
     632        </div>
     633
     634
     635
     636        <?php
     637        $html = ob_get_clean();
     638        $args = array(
     639            'id' => 'breadcrumb_use_shortcodes',
     640            'title' => __('Where to use shortcode', 'social-share-button'),
     641            'details' => '',
     642            'type' => 'custom_html',
     643            'html' => $html,
     644        );
     645        $settings_tabs_field->generate_field($args);
     646
     647
     648
     649
     650
     651
     652
     653
     654
     655
     656
     657
     658
     659        ?>
     660    </div>
     661
     662 <style type="text/css">
    609663             .copy-to-clipboard {
    610664            }
    … …  
    628682            })
    629683        </script>
    630         <?php
    631         $html = ob_get_clean();
    632         $args = array(
    633             'id' => 'breadcrumb_shortcodes',
    634             'title' => __('Get shortcode', 'social-share-button'),
    635             'details' => '',
    636             'type' => 'custom_html',
    637             'html' => $html,
    638         );
    639         $settings_tabs_field->generate_field($args);
    640 
    641 
    642 
    643 
    644 
    645 
    646         ob_start();
    647         ?>
    648 
    649 
    650         <div class="">
    651             <video autoplay="" loop="" class="" style="max-width: 100%; min-height: 505px;"><source type="video/mp4" src="<?php echo social_share_button_plugin_url.'assets/admin/images/tBpP1jl.mp4'; ?>"></video>
    652         </div>
    653 
    654 
    655 
    656         <?php
    657         $html = ob_get_clean();
    658         $args = array(
    659             'id' => 'breadcrumb_use_shortcodes',
    660             'title' => __('Where to use shortcode', 'social-share-button'),
    661             'details' => '',
    662             'type' => 'custom_html',
    663             'html' => $html,
    664         );
    665         $settings_tabs_field->generate_field($args);
    666 
    667 
    668 
    669 
    670 
    671 
    672 
    673 
    674 
    675 
    676 
    677 
    678 
    679         ?>
    680     </div>
    681684    <?php
    682685
    … …  
    694697    $social_share_button_settings = get_option( 'social_share_button_settings' );
    695698
    696     $custom_css = $social_share_button_settings['custom_css'];
     699    $custom_css = isset($social_share_button_settings['custom_css']) ? $social_share_button_settings['custom_css'] : '';
    697700
    698701    ?>

  • social-share-button/trunk/includes/functions.php

    r2518411 r3428462  
    130130
    131131       
    132         echo $data;
     132        echo wp_kses_post($data);
    133133       
    134134       
    … …  
    318318
    319319function social_share_button_ajax_update_count(){
    320         $current_site_id = sanitize_text_field($_POST['site_id']);
    321         $post_id = (int)$_POST['post_id'];
     320        $current_site_id = isset($_POST['site_id']) ? sanitize_text_field(wp_unslash($_POST['site_id'])) : '';
     321        $post_id = isset($_POST['post_id']) ? (int)wp_unslash($_POST['post_id']) : '';
    322322       
    323323        $social_share_button_sites = get_option( 'social_share_button_sites' );
    … …  
    352352   
    353353
     354
     355function social_share_button_inline_css() {
     356
     357global $socialShareButtonCss;
     358
     359
     360
     361    if ( empty( $socialShareButtonCss ) ) {
     362        return;
     363    }
     364
     365        $social_share_button_settings = get_option( 'social_share_button_settings' );
     366        $custom_css = isset($social_share_button_settings['custom_css']) ? $social_share_button_settings['custom_css'] : '';
     367
     368
     369    wp_register_style( 'social-share-button-style', false );
     370    wp_enqueue_style( 'social-share-button-style' );
     371
     372$socialShareButtonCss = $custom_css;
     373
     374    wp_add_inline_style( 'social-share-button-style', $socialShareButtonCss );
     375}
     376add_action( 'wp_footer', 'social_share_button_inline_css' );
     377

  • social-share-button/trunk/includes/menu/migrate-settings.php

    r2517096 r3428462  
    22if ( ! defined('ABSPATH')) exit;  // if direct access
    33
    4 $nonce = isset($_GET['_wpnonce']) ? sanitize_text_field($_GET['_wpnonce']) : '';
     4$nonce = isset($_GET['_wpnonce']) ? sanitize_text_field(wp_unslash($_GET['_wpnonce'])) : '';
    55
    66
    … …  
    1515<div class="wrap">
    1616
    17     <div id="icon-tools" class="icon32"><br><?php echo "<h2>".social_share_button_plugin_name.' '.__('Migrate', 'social-share-button')."</h2>";?></div>
     17    <div id="icon-tools" class="icon32"><br><?php echo "<h2>".esc_html__('Social Share Button Migrate', 'social-share-button')."</h2>";?></div>
    1818
    1919    <?php

  • social-share-button/trunk/includes/menu/migrate.php

    r2517096 r3428462  
    22if ( ! defined('ABSPATH')) exit;  // if direct access
    33
    4 $nonce = sanitize_text_field($_GET['_wpnonce']);
     4$nonce = isset($_GET['_wpnonce']) ? sanitize_text_field(wp_unslash($_GET['_wpnonce'])) : '';
    55
    66
    … …  
    1515<div class="wrap">
    1616
    17     <div id="icon-tools" class="icon32"><br><?php echo "<h2>".social_share_button_plugin_name.' '.__('Migrate', 'social-share-button')."</h2>";?></div>
     17    <div id="icon-tools" class="icon32"><br><?php echo "<h2>".esc_html__('Social Share Button Migrate', 'social-share-button')."</h2>";?></div>
    1818
    1919    <?php
    … …  
    7272        while ( $wp_query->have_posts() ) : $wp_query->the_post();
    7373
    74             echo '<li><i class="fa fa-check-square" aria-hidden="true"></i> '.get_the_title().'</li>';
     74            echo '<li><i class="fa fa-check-square" aria-hidden="true"></i> '.esc_html(get_the_title()).'</li>';
    7575            $ssb_post_sites = get_post_meta(get_the_ID(),'ssb_post_sites', true);
    7676

  • social-share-button/trunk/includes/menu/settings.php

    r2517096 r3428462  
    1111if(!empty($_POST['ssb_hidden'])) {
    1212
    13     $nonce = sanitize_text_field($_POST['_wpnonce']);
     13    $nonce = isset($_POST['_wpnonce']) ? sanitize_text_field(wp_unslash($_POST['_wpnonce'])) : '';
    1414    if(wp_verify_nonce( $nonce, 'ssb_nonce' ) && $_POST['ssb_hidden'] == 'Y') {
    1515        //if($_POST['ssb_hidden'] == 'Y') {
    … …  
    1717
    1818
    19         $social_share_button_settings = social_share_button_sanitize_arr($_POST['social_share_button_settings']);
     19        $social_share_button_settings = isset($_POST['social_share_button_settings']) ? social_share_button_sanitize_arr(wp_unslash($_POST['social_share_button_settings'])) : '';
    2020        update_option('social_share_button_settings', $social_share_button_settings);
    2121
    … …  
    101101<div class="wrap">
    102102
    103     <div id="icon-tools" class="icon32"><br></div><?php echo "<h2>".sprintf(__('%s - Settings', 'social-share-button'), 'Social Share Button' )."</h2>";?>
    104         <form  method="post" action="<?php echo str_replace( '%7E', '~', esc_url_raw($_SERVER['REQUEST_URI'])); ?>">
     103    <div id="icon-tools" class="icon32"><br></div><?php echo "<h2>Social Share Button Settings</h2>";?>
     104        <form  method="post" action="<?php echo esc_url(str_replace( '%7E', '~', isset($_SERVER['REQUEST_URI']) ? sanitize_text_field(wp_unslash($_SERVER['REQUEST_URI'])) : '')); ?>">
    105105        <input type="hidden" name="ssb_hidden" value="Y">
    106106
    … …  
    117117                        $hidden = isset($tab['hidden']) ? $tab['hidden'] : false;
    118118                        ?>
    119                         <li <?php if(!empty($data_visible)):  ?> data_visible="<?php echo $data_visible; ?>" <?php endif; ?> class="tab-nav <?php if($hidden) echo 'hidden';?> <?php if($active) echo 'active';?>" data-id="<?php echo $id; ?>"><?php echo $title; ?></li>
     119                        <li <?php if(!empty($data_visible)):  ?> data_visible="<?php echo esc_attr($data_visible); ?>" <?php endif; ?> class="tab-nav <?php if($hidden) echo 'hidden';?> <?php if($active) echo 'active';?>" data-id="<?php echo esc_attr($id); ?>"><?php echo wp_kses_post($title); ?></li>
    120120                        <?php
    121121                    }
    … …  
    131131                    ?>
    132132
    133                     <div class="tab-content <?php if($active) echo 'active';?>" id="<?php echo $id; ?>">
     133                    <div class="tab-content <?php if($active) echo 'active';?>" id="<?php echo esc_attr($id); ?>">
    134134                        <?php
    135135                        do_action('ssb_settings_tabs_content_'.$id, $tab);
    … …  
    148148            <p class="submit">
    149149                <?php wp_nonce_field( 'ssb_nonce' ); ?>
    150                 <input class="button button-primary" type="submit" name="Submit" value="<?php echo __('Save Changes', 'social-share-button' ) ?>" />
     150                <input class="button button-primary" type="submit" name="Submit" value="<?php echo esc_html__('Save Changes', 'social-share-button' ) ?>" />
    151151            </p>
    152152        </form>

  • social-share-button/trunk/readme.txt

    r2899358 r3428462  
    22    Contributors: pickplugins
    33    Donate link: http://pickplugins.com
    4     Tags: Share, social share buttons, social share button, share button, social share, social share plugin, share plugin, social share plugin wordpress, Social Media Plugins, Social Media share
     4    Tags: Share, social share buttons, social share button, share button, social share, social share plugin
    55    Requires at least: 4.1
    6     Tested up to: 6.2
    7     Stable tag: 2.1.12
     6    Tested up to: 6.9
     7    Stable tag: 2.1.13
    88    License: GPLv2 or later
    99    License URI: http://www.gnu.org/licenses/gpl-2.0.html

  • social-share-button/trunk/social-share-button.php

    r2518411 r3428462  
    44Plugin URI: http://pickplugins.com
    55Description: Awesome Share Button.
    6 Version: 2.1.12
     6Version: 2.1.13
    77Author: PickPlugins
    88Author URI: http://pickplugins.com
    … …  
    2121        define('social_share_button_plugin_url', plugins_url('/', __FILE__)  );
    2222        define('social_share_button_plugin_dir', plugin_dir_path( __FILE__ ) );
    23         define('social_share_button_plugin_name', __('Social Share Button', 'social-share-button') );
    24         define('social_share_button_plugin_version', '2.1.12' );
     23        define('social_share_button_plugin_name', "Social Share Button" );
     24        define('social_share_button_plugin_version', '2.1.13' );
     25
     26
     27$socialShareButtonCss = '';
     28global $socialShareButtonCss;
    2529
    2630
    … …  
    8589        //wp_enqueue_script('jquery-ui-datepicker');
    8690       
    87         wp_enqueue_script('social_share_button_front_js', plugins_url( 'assets/front/js/scripts.js' , __FILE__ ) , array( 'jquery' ));
     91        wp_enqueue_script('social_share_button_front_js', plugins_url( 'assets/front/js/scripts.js' , __FILE__ ) , array( 'jquery' ),'1.0.0');
    8892        wp_localize_script('social_share_button_front_js', 'social_share_button_ajax', array( 'social_share_button_ajaxurl' => admin_url( 'admin-ajax.php')));
    8993       
    9094       
    91         wp_enqueue_style('social_share_button_style', social_share_button_plugin_url.'assets/front/css/style.css');
    92         //wp_enqueue_style('font-awesome-4', social_share_button_plugin_url.'assets/global/css/font-awesome.css');
    93         wp_enqueue_style('fontawesome-5', social_share_button_plugin_url.'assets/global/css/fontawesome-5.min.css');
    94         //wp_enqueue_style('jquery-ui', social_share_button_plugin_url.'admin/css/jquery-ui.css');
     95        wp_enqueue_style('social_share_button_style', social_share_button_plugin_url.'assets/front/css/style.css',[],'1.0.0');
     96        wp_enqueue_style('fontawesome-5', social_share_button_plugin_url.'assets/global/css/fontawesome-5.min.css',[],'5.0.0');
    9597
    9698        }
    … …  
    104106
    105107
    106         wp_register_style('font-awesome-4', social_share_button_plugin_url.'assets/global/css/font-awesome.css');
    107         wp_register_style('font-awesome-5', social_share_button_plugin_url.'assets/global/css/fontawesome-5.min.css');
     108        wp_register_style('font-awesome-4', social_share_button_plugin_url.'assets/global/css/font-awesome.css',[],'4.0.0');
     109        wp_register_style('font-awesome-5', social_share_button_plugin_url.'assets/global/css/fontawesome-5.min.css',[],'5.0.0');
    108110
    109         wp_register_script('select2', social_share_button_plugin_url.'assets/admin/js/select2.full.js', array('jquery'));
    110         wp_register_style(  'select2', social_share_button_plugin_url . 'assets/admin/css/select2.min.css');
    111         wp_register_script('jquery.lazy', social_share_button_plugin_url.'assets/admin/js/jquery.lazy.min.js', array('jquery'));
     111        wp_register_script('select2', social_share_button_plugin_url.'assets/admin/js/select2.full.js', array('jquery'),'4.0.0');
     112        wp_register_style(  'select2', social_share_button_plugin_url . 'assets/admin/css/select2.min.css',[],'4.0.0');
     113        wp_register_script('jquery.lazy', social_share_button_plugin_url.'assets/admin/js/jquery.lazy.min.js', array('jquery'),'1.0.0');
    112114
    113115
    114         wp_register_style('settings-tabs', social_share_button_plugin_url.'assets/settings-tabs/settings-tabs.css');
    115         wp_register_script('settings-tabs', social_share_button_plugin_url. 'assets/settings-tabs/settings-tabs.js', array( 'jquery' ));
     116        wp_register_style('settings-tabs', social_share_button_plugin_url.'assets/settings-tabs/settings-tabs.css',[],'1.0.0');
     117        wp_register_script('settings-tabs', social_share_button_plugin_url. 'assets/settings-tabs/settings-tabs.js', array( 'jquery' ),'1.0.0');
    116118
    117119        if ($screen->id == 'toplevel_page_social-share-button'){

  • social-share-button/trunk/templates/variables.php

    r2363173 r3428462  
    3131$social_share_button_count_format = $count_format;
    3232
    33 //var_dump($share_count);
    3433
    35 //$social_share_button_total = $_GET['total'];
    3634
    3735if(empty($social_share_button_sites)){
Note: See TracChangeset for help on using the changeset viewer.