diff --git a/includes/class-options-framework-admin.php b/includes/class-options-framework-admin.php index a9ada83..839649e 100644 --- a/includes/class-options-framework-admin.php +++ b/includes/class-options-framework-admin.php @@ -200,12 +200,20 @@ function enqueue_admin_scripts( $hook ) { if ( $this->options_screen != $hook ) { return; } + + // Enqueue alpha color picker + wp_enqueue_script( + 'wp-color-picker-alpha', + plugin_dir_url( dirname(__FILE__) ) . 'js/wp-color-picker-alpha.min.js', + array( 'wp-color-picker' ), + Options_Framework::VERSION + ); // Enqueue custom option panel JS wp_enqueue_script( 'options-custom', plugin_dir_url( dirname(__FILE__) ) . 'js/options-custom.js', - array( 'jquery','wp-color-picker' ), + array( 'jquery','wp-color-picker-alpha' ), Options_Framework::VERSION ); diff --git a/includes/class-options-framework.php b/includes/class-options-framework.php index 5da0be7..b9d5900 100644 --- a/includes/class-options-framework.php +++ b/includes/class-options-framework.php @@ -15,7 +15,7 @@ class Options_Framework { * @since 1.7.0 * @type string */ - const VERSION = '1.8.6'; + const VERSION = '1.9.1'; /** * Initialize the plugin. diff --git a/includes/class-options-interface.php b/includes/class-options-interface.php index 604a039..5f15a84 100644 --- a/includes/class-options-interface.php +++ b/includes/class-options-interface.php @@ -206,7 +206,7 @@ static function optionsframework_fields() { if ( $val != $value['std'] ) $default_color = ' data-default-color="' .$value['std'] . '" '; } - $output .= ''; + $output .= ''; break; @@ -279,7 +279,7 @@ static function optionsframework_fields() { if ( $val != $value['std']['color'] ) $default_color = ' data-default-color="' .$value['std']['color'] . '" '; } - $font_color = ''; + $font_color = ''; } // Allow modification/injection of typography fields diff --git a/includes/class-options-sanitization.php b/includes/class-options-sanitization.php index 49d7266..95c0895 100644 --- a/includes/class-options-sanitization.php +++ b/includes/class-options-sanitization.php @@ -187,7 +187,7 @@ function of_sanitize_background( $input ) { 'attachment' => 'scroll' ) ); - $output['color'] = apply_filters( 'of_sanitize_hex', $input['color'] ); + $output['color'] = apply_filters( 'of_sanitize_color', $input['color'] ); $output['image'] = apply_filters( 'of_sanitize_upload', $input['image'] ); $output['repeat'] = apply_filters( 'of_background_repeat', $input['repeat'] ); $output['position'] = apply_filters( 'of_background_position', $input['position'] ); @@ -366,7 +366,26 @@ function of_sanitize_hex( $hex, $default = '' ) { } return $default; } -add_filter( 'of_sanitize_color', 'of_sanitize_hex' ); +add_filter( 'of_sanitize_hex', 'of_sanitize_hex' ); + +/** + * Sanitize a color + * + * @param string Color in hexadecimal, rgba, or rgba notation. "#" may or may not be prepended to the hexadecimal + * @param string The value that this function should return if it cannot be recognized as a color. + * @return string + */ + +function of_sanitize_color( $color, $default = '' ) { + if ( of_validate_hex( $color ) ) { + return $color; + } + elseif ( of_validate_rgba_hsla( $color ) ) { + return $color; + } + return $default; +} +add_filter( 'of_sanitize_color', 'of_sanitize_color' ); /** * Get recognized font sizes. @@ -450,3 +469,15 @@ function of_validate_hex( $hex ) { return true; } } + +/** + * Is a given string a color formatted in rgb(a) or hsl(a) notation? + * + * @param string Color in rgb(a) or hsl(a) notation. + * @return bool + */ +function of_validate_rgba_hsla ( $color ) { + $color = trim( $color ); + + return preg_match( '/^(rgb|hsl)a?\((-?\d+%?(deg|rad|grad|turn)?[,\s]+){2,3}[\s\/]*[\d\.]+%?\)$/i', $color ); +} diff --git a/js/wp-color-picker-alpha.min.js b/js/wp-color-picker-alpha.min.js new file mode 100644 index 0000000..21fe8c4 --- /dev/null +++ b/js/wp-color-picker-alpha.min.js @@ -0,0 +1,11 @@ +/**! + * wp-color-picker-alpha + * + * Overwrite Automattic Iris for enabled Alpha Channel in wpColorPicker + * Only run in input and is defined data alpha in true + * + * Version: 2.1.3 + * https://github.com/kallookoo/wp-color-picker-alpha + * Licensed under the GPLv2 license. + */ +!function(t){if(!t.wp.wpColorPicker.prototype._hasAlpha){var o="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAAHnlligAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHJJREFUeNpi+P///4EDBxiAGMgCCCAGFB5AADGCRBgYDh48CCRZIJS9vT2QBAggFBkmBiSAogxFBiCAoHogAKIKAlBUYTELAiAmEtABEECk20G6BOmuIl0CIMBQ/IEMkO0myiSSraaaBhZcbkUOs0HuBwDplz5uFJ3Z4gAAAABJRU5ErkJggg==",r='
',e='',a='',i=void 0!==wpColorPickerL10n.current;if(i)var n='';else{n='';var l="",s=''}Color.fn.toString=function(){if(this._alpha<1)return this.toCSS("rgba",this._alpha).replace(/\s+/g,"");var t=parseInt(this._color,10).toString(16);return this.error?"":(t.length<6&&(t=("00000"+t).substr(-6)),"#"+t)},t.widget("wp.wpColorPicker",t.wp.wpColorPicker,{_hasAlpha:!0,_create:function(){if(t.support.iris){var p=this,c=p.element;if(t.extend(p.options,c.data()),"hue"===p.options.type)return p._createHueOnly();p.close=t.proxy(p.close,p),p.initialValue=c.val(),c.addClass("wp-color-picker"),i?(c.hide().wrap(e),p.wrap=c.parent(),p.toggler=t(n).insertBefore(c).css({backgroundColor:p.initialValue}).attr("title",wpColorPickerL10n.pick).attr("data-current",wpColorPickerL10n.current),p.pickerContainer=t(r).insertAfter(c),p.button=t(a).addClass("hidden")):(c.parent("label").length||(c.wrap(l),p.wrappingLabelText=t(s).insertBefore(c).text(wpColorPickerL10n.defaultLabel)),p.wrappingLabel=c.parent(),p.wrappingLabel.wrap(e),p.wrap=p.wrappingLabel.parent(),p.toggler=t(n).insertBefore(p.wrappingLabel).css({backgroundColor:p.initialValue}),p.toggler.find(".wp-color-result-text").text(wpColorPickerL10n.pick),p.pickerContainer=t(r).insertAfter(p.wrappingLabel),p.button=t(a)),p.options.defaultColor?(p.button.addClass("wp-picker-default").val(wpColorPickerL10n.defaultString),i||p.button.attr("aria-label",wpColorPickerL10n.defaultAriaLabel)):(p.button.addClass("wp-picker-clear").val(wpColorPickerL10n.clear),i||p.button.attr("aria-label",wpColorPickerL10n.clearAriaLabel)),i?c.wrap('').after(p.button):(p.wrappingLabel.wrap('').after(p.button),p.inputWrapper=c.closest(".wp-picker-input-wrap")),c.iris({target:p.pickerContainer,hide:p.options.hide,width:p.options.width,mode:p.options.mode,palettes:p.options.palettes,change:function(r,e){p.options.alpha?(p.toggler.css({"background-image":"url("+o+")"}),i?p.toggler.html(''):(p.toggler.css({position:"relative"}),0==p.toggler.find("span.color-alpha").length&&p.toggler.append('')),p.toggler.find("span.color-alpha").css({width:"30px",height:"24px",position:"absolute",top:0,left:0,"border-top-left-radius":"2px","border-bottom-left-radius":"2px",background:e.color.toString()})):p.toggler.css({backgroundColor:e.color.toString()}),t.isFunction(p.options.change)&&p.options.change.call(this,r,e)}}),c.val(p.initialValue),p._addListeners(),p.options.hide||p.toggler.click()}},_addListeners:function(){var o=this;o.wrap.on("click.wpcolorpicker",function(t){t.stopPropagation()}),o.toggler.click(function(){o.toggler.hasClass("wp-picker-open")?o.close():o.open()}),o.element.on("change",function(r){(""===t(this).val()||o.element.hasClass("iris-error"))&&(o.options.alpha?(i&&o.toggler.removeAttr("style"),o.toggler.find("span.color-alpha").css("backgroundColor","")):o.toggler.css("backgroundColor",""),t.isFunction(o.options.clear)&&o.options.clear.call(this,r))}),o.button.on("click",function(r){t(this).hasClass("wp-picker-clear")?(o.element.val(""),o.options.alpha?(i&&o.toggler.removeAttr("style"),o.toggler.find("span.color-alpha").css("backgroundColor","")):o.toggler.css("backgroundColor",""),t.isFunction(o.options.clear)&&o.options.clear.call(this,r),o.element.trigger("change")):t(this).hasClass("wp-picker-default")&&o.element.val(o.options.defaultColor).change()})}}),t.widget("a8c.iris",t.a8c.iris,{_create:function(){if(this._super(),this.options.alpha=this.element.data("alpha")||!1,this.element.is(":input")||(this.options.alpha=!1),void 0!==this.options.alpha&&this.options.alpha){var o=this,r=o.element,e=t(' ').appendTo(o.picker.find(".iris-picker-inner")),a={aContainer:e,aSlider:e.find(".iris-slider-offset-alpha")};void 0!==r.data("custom-width")?o.options.customWidth=parseInt(r.data("custom-width"))||0:o.options.customWidth=100,o.options.defaultWidth=r.width(),(o._color._alpha<1||-1!=o._color.toString().indexOf("rgb"))&&r.width(parseInt(o.options.defaultWidth+o.options.customWidth)),t.each(a,function(t,r){o.controls[t]=r}),o.controls.square.css({"margin-right":"0"});var i=o.picker.width()-o.controls.square.width()-20,n=i/6,l=i/2-n;t.each(["aContainer","strip"],function(t,r){o.controls[r].width(l).css({"margin-left":n+"px"})}),o._initControls(),o._change()}},_initControls:function(){if(this._super(),this.options.alpha){var t=this;t.controls.aSlider.slider({orientation:"vertical",min:0,max:100,step:1,value:parseInt(100*t._color._alpha),slide:function(o,r){t._color._alpha=parseFloat(r.value/100),t._change.apply(t,arguments)}})}},_change:function(){this._super();var t=this,r=t.element;if(this.options.alpha){var e=t.controls,a=parseInt(100*t._color._alpha),i=t._color.toRgb(),n=["rgb("+i.r+","+i.g+","+i.b+") 0%","rgba("+i.r+","+i.g+","+i.b+", 0) 100%"],l=t.options.defaultWidth,s=t.options.customWidth,p=t.picker.closest(".wp-picker-container").find(".wp-color-result");e.aContainer.css({background:"linear-gradient(to bottom, "+n.join(", ")+"), url("+o+")"}),p.hasClass("wp-picker-open")&&(e.aSlider.slider("value",a),t._color._alpha<1?(e.strip.attr("style",e.strip.attr("style").replace(/rgba\(([0-9]+,)(\s+)?([0-9]+,)(\s+)?([0-9]+)(,(\s+)?[0-9\.]+)\)/g,"rgb($1$3$5)")),r.width(parseInt(l+s))):r.width(l))}(r.data("reset-alpha")||!1)&&t.picker.find(".iris-palette-container").on("click.palette",".iris-palette",function(){t._color._alpha=1,t.active="external",t._change()}),r.trigger("change")},_addInputListeners:function(t){var o=this,r=function(r){var e=new Color(t.val()),a=t.val();t.removeClass("iris-error"),e.error?""!==a&&t.addClass("iris-error"):e.toString()!==o._color.toString()&&("keyup"===r.type&&a.match(/^[0-9a-fA-F]{3}$/)||o._setOption("color",e.toString()))};t.on("change",r).on("keyup",o._debounce(r,100)),o.options.hide&&t.on("focus",function(){o.show()})}})}}(jQuery),jQuery(document).ready(function(t){t(".color-picker").wpColorPicker()}); \ No newline at end of file diff --git a/options-framework.php b/options-framework.php index d4e9d06..f31736b 100644 --- a/options-framework.php +++ b/options-framework.php @@ -12,7 +12,7 @@ * Plugin Name: Options Framework * Plugin URI: http://wptheming.com * Description: A framework for building theme options. - * Version: 1.8.6 + * Version: 1.9.1 * Author: Devin Price * Author URI: http://wptheming.com * License: GPL-2.0+