wp/wp-content/plugins/option-tree/assets/js/ot-admin.js
changeset 11 bf1778c34b9a
parent 7 cf61fcea0001
equal deleted inserted replaced
10:372f2766ea20 11:bf1778c34b9a
     1 /**
     1 /**
     2  * Option Tree UI
     2  * Option Tree UI
     3  * 
     3  *
     4  * Dependencies: jQuery, jQuery UI, ColorPicker
     4  * Dependencies: jQuery, jQuery UI, ColorPicker
     5  *
     5  *
     6  * @author Derek Herman (derek@valendesigns.com)
     6  * @author Derek Herman (derek@valendesigns.com)
     7  */
     7  */
     8 ;(function($) {
     8 ;(function($) {
   316       var regex = /(.+?):(is|not|contains|less_than|less_than_or_equal_to|greater_than|greater_than_or_equal_to)\((.*?)\),?/g;
   316       var regex = /(.+?):(is|not|contains|less_than|less_than_or_equal_to|greater_than|greater_than_or_equal_to)\((.*?)\),?/g;
   317       var conditions = [];
   317       var conditions = [];
   318 
   318 
   319       while( match = regex.exec( condition ) ) {
   319       while( match = regex.exec( condition ) ) {
   320         conditions.push({
   320         conditions.push({
   321           'check': match[1], 
   321           'check': match[1],
   322           'rule':  match[2], 
   322           'rule':  match[2],
   323           'value': match[3] || ''
   323           'value': match[3] || ''
   324         });
   324         });
   325       }
   325       }
   326 
   326 
   327       return conditions;
   327       return conditions;
   359             case 'greater_than_or_equal_to':
   359             case 'greater_than_or_equal_to':
   360               result = ( parseInt( v1 ) >= parseInt( v2 ) );
   360               result = ( parseInt( v1 ) >= parseInt( v2 ) );
   361               break;
   361               break;
   362             case 'contains':
   362             case 'contains':
   363               result = ( v1.indexOf(v2) !== -1 ? true : false );
   363               result = ( v1.indexOf(v2) !== -1 ? true : false );
   364               break; 
   364               break;
   365             case 'is':
   365             case 'is':
   366               result = ( v1 == v2 );
   366               result = ( v1 == v2 );
   367               break;
   367               break;
   368             case 'not':
   368             case 'not':
   369               result = ( v1 != v2 );
   369               result = ( v1 != v2 );
   381             case 'and':
   381             case 'and':
   382             default:
   382             default:
   383               passed = ( passed && result );
   383               passed = ( passed && result );
   384               break;
   384               break;
   385           }
   385           }
   386           
   386 
   387         });
   387         });
   388 
   388 
   389         if ( passed ) {
   389         if ( passed ) {
   390           $(this).animate({opacity: 'show' , height: 'show'}, 200);
   390           $(this).animate({opacity: 'show' , height: 'show'}, 200);
   391         } else {
   391         } else {
   392           $(this).animate({opacity: 'hide' , height: 'hide'}, 200);
   392           $(this).animate({opacity: 'hide' , height: 'hide'}, 200);
   393         }
   393         }
   394         
   394 
   395         delete passed;
   395         delete passed;
   396 
   396 
   397       });
   397       });
   398     },
   398     },
   399     init_conditions: function() {
   399     init_conditions: function() {
   616           url: option_tree.ajax,
   616           url: option_tree.ajax,
   617           type: 'POST',
   617           type: 'POST',
   618           dataType: 'json',
   618           dataType: 'json',
   619           data: {
   619           data: {
   620             action: 'ot_google_font',
   620             action: 'ot_google_font',
   621             family: input.val(), 
   621             family: input.val(),
   622             field_id: input.attr('id')
   622             field_id: input.attr( 'id' ),
       
   623             nonce: option_tree.nonce
   623           }
   624           }
   624         }).done(function(response) {
   625         }).done(function(response) {
   625           if ( response.hasOwnProperty('variants') ) {
   626           if ( response.hasOwnProperty('variants') ) {
   626             update_items( input, response.variants, '.option-tree-google-font-variants' );
   627             update_items( input, response.variants, '.option-tree-google-font-variants' );
   627           }
   628           }
   726         var editor = ace.edit($(this).attr('id'));
   727         var editor = ace.edit($(this).attr('id'));
   727         var this_textarea = $('#textarea_' + $(this).attr('id'));
   728         var this_textarea = $('#textarea_' + $(this).attr('id'));
   728         editor.setTheme("ace/theme/chrome");
   729         editor.setTheme("ace/theme/chrome");
   729         editor.getSession().setMode("ace/mode/css");
   730         editor.getSession().setMode("ace/mode/css");
   730         editor.setShowPrintMargin( false );
   731         editor.setShowPrintMargin( false );
   731     
   732 
   732         editor.getSession().setValue(this_textarea.val());
   733         editor.getSession().setValue(this_textarea.val());
   733         editor.getSession().on('change', function(){
   734         editor.getSession().on('change', function(){
   734           this_textarea.val(editor.getSession().getValue());
   735           this_textarea.val(editor.getSession().getValue());
   735         });
   736         });
   736         this_textarea.on('change', function(){
   737         this_textarea.on('change', function(){
   816         $.ajax({
   817         $.ajax({
   817           type: 'POST',
   818           type: 'POST',
   818           url: ajaxurl,
   819           url: ajaxurl,
   819           dataType: 'html',
   820           dataType: 'html',
   820           data: {
   821           data: {
   821             action: 'gallery_update'
   822             action: 'gallery_update',
   822           , ids: ids
   823             ids: ids,
       
   824             nonce: option_tree.nonce
   823           },
   825           },
   824           success: function(res) {
   826           success: function(res) {
   825             parent.children('.ot-gallery-list').html(res);
   827             parent.children('.ot-gallery-list').html(res);
   826             if ( input.hasClass('ot-gallery-shortcode') ) {
   828             if ( input.hasClass('ot-gallery-shortcode') ) {
   827               input.val(shortcode);
   829               input.val(shortcode);
   858       if ( _.isUndefined( shortcode.get('id') ) && ! _.isUndefined( defaultPostId ) )
   860       if ( _.isUndefined( shortcode.get('id') ) && ! _.isUndefined( defaultPostId ) )
   859         shortcode.set( 'id', defaultPostId )
   861         shortcode.set( 'id', defaultPostId )
   860       
   862       
   861       if ( _.isUndefined( shortcode.get('ids') ) && ! input.hasClass('ot-gallery-shortcode') && ids )
   863       if ( _.isUndefined( shortcode.get('ids') ) && ! input.hasClass('ot-gallery-shortcode') && ids )
   862         shortcode.set( 'ids', ids )
   864         shortcode.set( 'ids', ids )
   863       
   865 
   864       if ( _.isUndefined( shortcode.get('ids') ) )
   866       if ( _.isUndefined( shortcode.get('ids') ) )
   865         shortcode.set( 'ids', '0' )
   867         shortcode.set( 'ids', '0' )
   866       
   868 
   867       attachments = wp.media.gallery.attachments( shortcode )
   869       attachments = wp.media.gallery.attachments( shortcode )
   868 
   870 
   869       selection = new wp.media.model.Selection( attachments.models, {
   871       selection = new wp.media.model.Selection( attachments.models, {
   870         props:    attachments.props.toJSON()
   872         props:    attachments.props.toJSON()
   871       , multiple: true
   873       , multiple: true
   872       })
   874       })
   873       
   875 
   874       selection.gallery = attachments.gallery
   876       selection.gallery = attachments.gallery
   875     
   877 
   876       // Fetch the query's attachments, and then break ties from the query to allow for sorting.
   878       // Fetch the query's attachments, and then break ties from the query to allow for sorting.
   877       selection.more().done( function () {
   879       selection.more().done( function () {
   878         selection.props.set({ query: false })
   880         selection.props.set({ query: false })
   879         selection.unmirror()
   881         selection.unmirror()
   880         selection.props.unset('orderby')
   882         selection.props.unset('orderby')
   881       })
   883       })
   882       
   884 
   883       return selection
   885       return selection
   884       
   886 
   885     }
   887     }
   886     
   888 
   887   , open: function (elm) {
   889   , open: function (elm) {
   888       
   890 
   889       ot_gallery.frame(elm).open()
   891       ot_gallery.frame(elm).open()
   890       
   892 
   891     }
   893     }
   892   
   894 
   893   , remove: function (elm) {
   895   , remove: function (elm) {
   894       
   896 
   895       if ( confirm( option_tree.confirm ) ) {
   897       if ( confirm( option_tree.confirm ) ) {
   896         
   898 
   897         $(elm).parents('.format-setting-inner').children('.ot-gallery-value').attr('value', '');
   899         $(elm).parents('.format-setting-inner').children('.ot-gallery-value').attr('value', '');
   898         $(elm).parents('.format-setting-inner').children('.ot-gallery-list').remove();
   900         $(elm).parents('.format-setting-inner').children('.ot-gallery-list').remove();
   899         $(elm).next('.ot-gallery-edit').text( option_tree.create );
   901         $(elm).next('.ot-gallery-edit').text( option_tree.create );
   900         $(elm).remove();
   902         $(elm).remove();
   901         OT_UI.parse_condition();
   903         OT_UI.parse_condition();
   902         
   904 
   903       }
   905       }
   904 
   906 
   905     }
   907     }
   906   
   908 
   907   }
   909   }
   908 
   910 
   909   // Gallery delete
   911   // Gallery delete
   910   $(document).on('click.ot_gallery.data-api', '.ot-gallery-delete', function (e) {
   912   $(document).on('click.ot_gallery.data-api', '.ot-gallery-delete', function (e) {
   911     e.preventDefault()
   913     e.preventDefault()
   912     ot_gallery.remove($(this))
   914     ot_gallery.remove($(this))
   913   })
   915   })
   914   
   916 
   915   // Gallery edit
   917   // Gallery edit
   916   $(document).on('click.ot_gallery.data-api', '.ot-gallery-edit', function (e) {
   918   $(document).on('click.ot_gallery.data-api', '.ot-gallery-edit', function (e) {
   917     e.preventDefault()
   919     e.preventDefault()
   918     ot_gallery.open($(this))
   920     ot_gallery.open($(this))
   919   })
   921   })
   920   
   922 
   921 }(window.jQuery);
   923 }(window.jQuery);
   922 
   924 
   923 /*!
   925 /*!
   924  * Adds metabox tabs
   926  * Adds metabox tabs
   925  */
   927  */
   926 !function ($) {
   928 !function ($) {
   927 
   929 
   928   $(document).on('ready', function () {
   930   $( document ).ready( function() {
   929     
   931 
   930     // Loop over the metaboxes
   932     // Loop over the metaboxes
   931     $('.ot-metabox-wrapper').each( function() {
   933     $('.ot-metabox-wrapper').each( function() {
   932     
   934 
   933       // Only if there is a tab option
   935       // Only if there is a tab option
   934       if ( $(this).find('.type-tab').length ) {
   936       if ( $(this).find('.type-tab').length ) {
   935         
   937 
   936         // Add .ot-metabox-panels
   938         // Add .ot-metabox-panels
   937         $(this).find('.type-tab').parents('.ot-metabox-wrapper').wrapInner('<div class="ot-metabox-panels" />')
   939         $(this).find('.type-tab').parents('.ot-metabox-wrapper').wrapInner('<div class="ot-metabox-panels" />')
   938         
   940 
   939         // Wrapp with .ot-metabox-tabs & add .ot-metabox-nav before .ot-metabox-panels
   941         // Wrapp with .ot-metabox-tabs & add .ot-metabox-nav before .ot-metabox-panels
   940         $(this).find('.ot-metabox-panels').wrap('<div class="ot-metabox-tabs" />').before('<ul class="ot-metabox-nav" />')
   942         $(this).find('.ot-metabox-panels').wrap('<div class="ot-metabox-tabs" />').before('<ul class="ot-metabox-nav" />')
   941         
   943 
   942         // Loop over settings and build the tabs nav
   944         // Loop over settings and build the tabs nav
   943         $(this).find('.format-settings').each( function() {
   945         $(this).find('.format-settings').each( function() {
   944       
   946 
   945           if ( $(this).find('.type-tab').length > 0 ) {
   947           if ( $(this).find('.type-tab').length > 0 ) {
   946             var title = $(this).find('.type-tab').prev().find('label').text()
   948             var title = $(this).find('.type-tab').prev().find('label').text()
   947               , id = $(this).attr('id')
   949               , id = $(this).attr('id')
   948   
   950 
   949             // Add a class, hide & append nav item 
   951             // Add a class, hide & append nav item
   950             $(this).addClass('is-panel').hide()
   952             $(this).addClass('is-panel').hide()
   951             $(this).parents('.ot-metabox-panels').prev('.ot-metabox-nav').append('<li><a href="#' + id + '">' + title + '</a></li>')
   953             $(this).parents('.ot-metabox-panels').prev('.ot-metabox-nav').append('<li><a href="#' + id + '">' + title + '</a></li>')
   952             
   954 
   953           }
   955           }
   954           
   956 
   955         })
   957         })
   956         
   958 
   957         // Loop over the panels and wrap and ID them.
   959         // Loop over the panels and wrap and ID them.
   958         $(this).find('.is-panel').each( function() {
   960         $(this).find('.is-panel').each( function() {
   959           var id = $(this).attr('id')
   961           var id = $(this).attr('id')
   960           
   962 
   961           $(this).add( $(this).nextUntil('.is-panel') ).wrapAll('<div id="' + id + '" class="tab-content" />')
   963           $(this).add( $(this).nextUntil('.is-panel') ).wrapAll('<div id="' + id + '" class="tab-content" />')
   962           
   964 
   963         })
   965         })
   964         
   966 
   965         // Create the tabs
   967         // Create the tabs
   966         $(this).find('.ot-metabox-tabs').tabs({
   968         $(this).find('.ot-metabox-tabs').tabs({
   967           activate: function( event, ui ) {
   969           activate: function( event, ui ) {
   968             var parent = $(this).outerHeight(),
   970             var parent = $(this).outerHeight(),
   969                 child = $(this).find('.ot-metabox-panels').outerHeight() + 8,
   971                 child = $(this).find('.ot-metabox-panels').outerHeight() + 8,
   972               $(this).find('.ot-metabox-panels').css({ minHeight: minHeight })
   974               $(this).find('.ot-metabox-panels').css({ minHeight: minHeight })
   973             }
   975             }
   974             OT_UI.load_editors();
   976             OT_UI.load_editors();
   975           }
   977           }
   976         })
   978         })
   977         
   979 
   978         // Move the orphaned settings to the top
   980         // Move the orphaned settings to the top
   979         $(this).find('.ot-metabox-panels > .format-settings').prependTo($(this))
   981         $(this).find('.ot-metabox-panels > .format-settings').prependTo($(this))
   980         
   982 
   981         // Remove a bunch of classes to stop style conflicts.
   983         // Remove a bunch of classes to stop style conflicts.
   982         $(this).find('.ot-metabox-tabs').removeClass('ui-widget ui-widget-content ui-corner-all')
   984         $(this).find('.ot-metabox-tabs').removeClass('ui-widget ui-widget-content ui-corner-all')
   983         $(this).find('.ot-metabox-nav').removeClass('ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all')
   985         $(this).find('.ot-metabox-nav').removeClass('ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all')
   984         $(this).find('.ot-metabox-nav li').removeClass('ui-state-default ui-corner-top ui-tabs-active ui-tabs-active')
   986         $(this).find('.ot-metabox-nav li').removeClass('ui-state-default ui-corner-top ui-tabs-active ui-tabs-active')
   985         $(this).find('.ot-metabox-nav li').on('mouseenter mouseleave', function() { $(this).removeClass('ui-state-hover') })
   987         $(this).find('.ot-metabox-nav li').on('mouseenter mouseleave', function() { $(this).removeClass('ui-state-hover') })
   986 
   988 
   987       }
   989       }
   988     
   990 
   989     })
   991     })
   990      
   992 
   991   })
   993   })
   992   
   994 
   993 }(window.jQuery);
   995 }(window.jQuery);
   994 
   996 
   995 /*!
   997 /*!
   996  * Adds theme option tabs
   998  * Adds theme option tabs
   997  */
   999  */
   998 !function ($) {
  1000 !function ($) {
   999 
  1001 
  1000   $(document).on('ready', function () {
  1002   $( document ).ready( function() {
  1001     
  1003 
  1002     // Loop over the theme options
  1004     // Loop over the theme options
  1003     $('#option-tree-settings-api .inside').each( function() {
  1005     $('#option-tree-settings-api .inside').each( function() {
  1004     
  1006 
  1005       // Only if there is a tab option
  1007       // Only if there is a tab option
  1006       if ( $(this).find('.type-tab').length ) {
  1008       if ( $(this).find('.type-tab').length ) {
  1007         
  1009 
  1008         // Add .ot-theme-option-panels
  1010         // Add .ot-theme-option-panels
  1009         $(this).find('.type-tab').parents('.inside').wrapInner('<div class="ot-theme-option-panels" />')
  1011         $(this).find('.type-tab').parents('.inside').wrapInner('<div class="ot-theme-option-panels" />')
  1010         
  1012 
  1011         // Wrap with .ot-theme-option-tabs & add .ot-theme-option-nav before .ot-theme-option-panels
  1013         // Wrap with .ot-theme-option-tabs & add .ot-theme-option-nav before .ot-theme-option-panels
  1012         $(this).find('.ot-theme-option-panels').wrap('<div class="ot-theme-option-tabs" />').before('<ul class="ot-theme-option-nav" />')
  1014         $(this).find('.ot-theme-option-panels').wrap('<div class="ot-theme-option-tabs" />').before('<ul class="ot-theme-option-nav" />')
  1013         
  1015 
  1014         // Loop over settings and build the tabs nav
  1016         // Loop over settings and build the tabs nav
  1015         $(this).find('.format-settings').each( function() {
  1017         $(this).find('.format-settings').each( function() {
  1016       
  1018 
  1017           if ( $(this).find('.type-tab').length > 0 ) {
  1019           if ( $(this).find('.type-tab').length > 0 ) {
  1018             var title = $(this).find('.type-tab').prev().find('.label').text()
  1020             var title = $(this).find('.type-tab').prev().find('.label').text()
  1019               , id = $(this).attr('id')
  1021               , id = $(this).attr('id')
  1020   
  1022 
  1021             // Add a class, hide & append nav item 
  1023             // Add a class, hide & append nav item
  1022             $(this).addClass('is-panel').hide()
  1024             $(this).addClass('is-panel').hide()
  1023             $(this).parents('.ot-theme-option-panels').prev('.ot-theme-option-nav').append('<li><a href="#' + id + '">' + title + '</a></li>')
  1025             $(this).parents('.ot-theme-option-panels').prev('.ot-theme-option-nav').append('<li><a href="#' + id + '">' + title + '</a></li>')
  1024             
  1026 
  1025           } else {
  1027           } else {
  1026           
  1028 
  1027           }
  1029           }
  1028           
  1030 
  1029         })
  1031         })
  1030         
  1032 
  1031         // Loop over the panels and wrap and ID them.
  1033         // Loop over the panels and wrap and ID them.
  1032         $(this).find('.is-panel').each( function() {
  1034         $(this).find('.is-panel').each( function() {
  1033           var id = $(this).attr('id')
  1035           var id = $(this).attr('id')
  1034           
  1036 
  1035           $(this).add( $(this).nextUntil('.is-panel') ).wrapAll('<div id="' + id + '" class="tab-content" />')
  1037           $(this).add( $(this).nextUntil('.is-panel') ).wrapAll('<div id="' + id + '" class="tab-content" />')
  1036           
  1038 
  1037         })
  1039         })
  1038         
  1040 
  1039         // Create the tabs
  1041         // Create the tabs
  1040         $(this).find('.ot-theme-option-tabs').tabs({
  1042         $(this).find('.ot-theme-option-tabs').tabs({
  1041           activate: function( event, ui ) {
  1043           activate: function( event, ui ) {
  1042             OT_UI.load_editors();
  1044             OT_UI.load_editors();
  1043           }
  1045           }
  1044         })
  1046         })
  1045         
  1047 
  1046         // Move the orphaned settings to the top
  1048         // Move the orphaned settings to the top
  1047         $(this).find('.ot-theme-option-panels > .format-settings').prependTo($(this).find('.ot-theme-option-tabs'))
  1049         $(this).find('.ot-theme-option-panels > .format-settings').prependTo($(this).find('.ot-theme-option-tabs'))
  1048       
  1050 
  1049       }
  1051       }
  1050     
  1052 
  1051     })
  1053     })
  1052      
  1054 
  1053   })
  1055   })
  1054   
  1056 
  1055 }(window.jQuery);
  1057 }(window.jQuery);
  1056 
  1058 
  1057 /*!
  1059 /*!
  1058  * Fixes the state of metabox radio buttons after a Drag & Drop event.
  1060  * Fixes the state of metabox radio buttons after a Drag & Drop event.
  1059  */
  1061  */
  1060 !function ($) {
  1062 !function ($) {
  1061   
  1063 
  1062   $(document).on('ready', function () {
  1064   $( document ).ready( function() {
  1063 
  1065 
  1064     // detect mousedown and store all checked radio buttons
  1066     // detect mousedown and store all checked radio buttons
  1065     $('.hndle').on('mousedown', function () {
  1067     $('.hndle').on('mousedown', function () {
  1066       
  1068       
  1067       // get parent element of .hndle selected. 
  1069       // get parent element of .hndle selected. 
  1069       var parent_id = $(this).closest('div').attr('id')
  1071       var parent_id = $(this).closest('div').attr('id')
  1070       
  1072       
  1071       // set live event listener for mouse up on the content .wrap 
  1073       // set live event listener for mouse up on the content .wrap 
  1072       // then give the dragged div time to settle before firing the reclick function
  1074       // then give the dragged div time to settle before firing the reclick function
  1073       $('.wrap').on('mouseup', function () {
  1075       $('.wrap').on('mouseup', function () {
  1074         
  1076 
  1075         var ot_checked_radios = {}
  1077         var ot_checked_radios = {}
  1076         
  1078 
  1077         // loop over all checked radio buttons inside of parent element
  1079         // loop over all checked radio buttons inside of parent element
  1078         $('#' + parent_id + ' input[type="radio"]').each( function () {
  1080         $('#' + parent_id + ' input[type="radio"]').each( function () {
  1079           
  1081 
  1080           // stores checked radio buttons
  1082           // stores checked radio buttons
  1081           if ( $(this).is(':checked') ) {
  1083           if ( $(this).is(':checked') ) {
  1082             
  1084 
  1083             ot_checked_radios[$(this).attr('name')] = $(this).val()
  1085             ot_checked_radios[$(this).attr('name')] = $(this).val()
  1084           
  1086 
  1085           }
  1087           }
  1086           
  1088 
  1087           // write to the object
  1089           // write to the object
  1088           $(document).data('ot_checked_radios', ot_checked_radios)
  1090           $(document).data('ot_checked_radios', ot_checked_radios)
  1089           
  1091 
  1090         })
  1092         })
  1091         
  1093         
  1092         // restore all checked radio buttons 
  1094         // restore all checked radio buttons 
  1093         setTimeout( function () {
  1095         setTimeout( function () {
  1094       
  1096 
  1095           // get object of checked radio button names and values
  1097           // get object of checked radio button names and values
  1096           var checked = $(document).data('ot_checked_radios')
  1098           var checked = $(document).data('ot_checked_radios')
  1097           
  1099 
  1098           // step thru each object element and trigger a click on it's corresponding radio button
  1100           // step thru each object element and trigger a click on it's corresponding radio button
  1099           for ( key in checked ) {
  1101           for ( key in checked ) {
  1100             
  1102 
  1101             $('input[name="' + key + '"]').filter('[value="' + checked[key] + '"]').trigger('click')
  1103             $('input[name="' + key + '"]').filter('[value="' + checked[key] + '"]').trigger('click')
  1102             
  1104 
  1103           }
  1105           }
  1104           
  1106 
  1105           $('.wrap').unbind('mouseup')
  1107           $('.wrap').unbind('mouseup')
  1106           
  1108 
  1107         }, 50 )
  1109         }, 50 )
  1108       
  1110 
  1109       })
  1111       })
  1110       
  1112 
  1111     })
  1113     })
  1112   
  1114 
  1113   })
  1115   })
  1114   
  1116 
  1115 }(window.jQuery);
  1117 }(window.jQuery);
  1116 
  1118 
  1117 /*!
  1119 /*!
  1118  * Adds opacity to the default colorpicker
  1120  * Adds opacity to the default colorpicker
  1119  *
  1121  *