Kirki_Control_Background::content_template() - Code Metrics - Inspection of "Background control" - aristath/kirki - Measure and Improve Code Quality continuously with Scrutinizer

Completed

Pull Request — develop (#1283)

by Aristeides

created 2017-03-28 02:09 UTC

Kirki_Control_Background::content_template() B

↳ Parent: Kirki_Control_Background

Complexity

Conditions	1
Paths	1

Size

Total Lines	106
Code Lines	4

Duplication

Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
cc	1
eloc	4
nc	1
nop	0
dl	0
loc	106
rs	8.2857
c	0
b	0
f	0

How to fix Long Method

<?php

class Kirki_Control_Background extends WP_Customize_Control {

	/**
	 * The control type.
	 *
	 * @access public
	 * @var string
	 */
	public $type = 'kirki-background';

	/**
	 * Used to automatically generate all CSS output.
	 *
	 * @access public
	 * @var array
	 */
	public $output = array();

	/**
	 * Data type
	 *
	 * @access public
	 * @var string
	 */
	public $option_type = 'theme_mod';

	/**
	 * Enqueue control related scripts/styles.
	 *
	 * @access public
	 */
	public function enqueue() {
		wp_enqueue_script( 'wp-color-picker-alpha', trailingslashit( Kirki::$url ) . 'controls/background/wp-color-picker-alpha.js', array( 'wp-color-picker' ), '1.2', true );
		wp_enqueue_style( 'wp-color-picker' );

		wp_enqueue_script( 'kirki-background', trailingslashit( Kirki::$url ) . 'controls/background/background.js', array( 'jquery', 'wp-color-picker-alpha' ) );
		wp_enqueue_style( 'kirki-background', trailingslashit( Kirki::$url ) . 'controls/background/background.css', null );
    }

	/**
	 * Refresh the parameters passed to the JavaScript via JSON.
	 *
	 * @access public
	 */
	public function to_json() {
		parent::to_json();

		$this->json['default'] = $this->setting->default;
		if ( isset( $this->default ) ) {
			$this->json['default'] = $this->default;
		}
		$this->json['output']  = $this->output;
		$this->json['value']   = $this->value();
		$this->json['choices'] = $this->choices;
		$this->json['link']    = $this->get_link();
		$this->json['id']      = $this->id;

		if ( 'user_meta' === $this->option_type ) {
			$this->json['value'] = get_user_meta( get_current_user_id(), $this->id, true );
		}

		$this->json['inputAttrs'] = '';
		foreach ( $this->input_attrs as $attr => $value ) {
			$this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
		}
		$config_id = 'global';
		$this->json['l10n'] = $this->l10n( $config_id );
	}

	/**
	 * An Underscore (JS) template for this control's content (but not its container).
	 *
	 * Class variables for this control class are available in the `data` JS object;
	 * export custom variables by overriding {@see WP_Customize_Control::to_json()}.
	 *
	 * @see WP_Customize_Control::print_template()
	 *
	 * @access protected
	 */
	protected function content_template() {
		?>
		<label>
			<span class="customize-control-title">
				{{{ data.label }}}
			</span>
			<# if ( data.description ) { #>
				<span class="description customize-control-description">{{{ data.description }}}</span>
			<# } #>
		</label>
		<div class="background-wrapper">

			<!-- background-color -->
			<div class="background-color">
				<h4>{{ data.l10n['background-color'] }}</h4>
				<input type="text" data-default-color="{{ data.default['background-color'] }}" value="{{ data.value['background-color'] }}" class="kirki-color-control color-picker" {{{ data.link }}} />
			</div>

			<!-- background-image -->
			<div class="background-image">
				<h4>{{ data.l10n['background-image'] }}</h4>
				<div class="attachment-media-view background-image-upload">
					<# if ( data.value['background-image'] ) { #>
						<div class="thumbnail thumbnail-image">
							<img src="{{ data.value['background-image'] }}" alt="" />
						</div>
					<# } else { #>
						<div class="placeholder">
							{{ data.l10n['no-file-selected'] }}
						</div>
					<# } #>
					<div class="actions">
						<button class="button background-image-upload-remove-button<# if ( ! data.value['background-image'] ) { #> hidden <# } #>">
							{{ data.l10n['remove'] }}
						</button>
						<button type="button" class="button background-image-upload-button">
							{{ data.l10n['select-file'] }}
						</button>
					</div>
				</div>
			</div>

			<!-- background-repeat -->
			<div class="background-repeat">
				<h4>{{ data.l10n['background-repeat'] }}</h4>
				<#
				var repeats = [
						'no-repeat',
						'repeat-all',
						'repeat-x',
						'repeat-y'
					];
				#>
				<select {{{ data.inputAttrs }}} {{{ data.link }}}>
					<# _.each( repeats, function( repeat ) { #>
						<option value="{{ repeat }}"<# if ( repeat === data.value['background-repeat'] ) { #> selected <# } #>>{{ data.l10n[ repeat ] }}</option>
					<# }); #>
				</select>
			</div>

			<!-- background-size -->
			<div class="background-size">
				<h4>{{ data.l10n['background-size'] }}</h4>
				<#
				var sizes = [
						'cover',
						'contain',
						'auto'
					];
				#>
				<select {{{ data.inputAttrs }}} {{{ data.link }}}>
					<# _.each( sizes, function( size ) { #>
						<option value="{{ size }}"<# if ( size === data.value['background-size'] ) { #> selected <# } #>>{{ data.l10n[ size ] }}</option>
					<# }); #>
				</select>
			</div>

			<!-- background-attachment -->
			<!-- <div class="background-attachment">
				<h4>{{ data.l10n['background-attachment'] }}</h4>
			</div> -->

			<!-- background-position -->
			<div class="background-position">
				<h4>{{ data.l10n['background-position'] }}</h4>
				<#
				var positions = [
						'left top',
						'left center',
						'left bottom',
						'right top',
						'right center',
						'right bottom',
						'center top',
						'center center',
						'center bottom'
					];
				#>
				<select {{{ data.inputAttrs }}} {{{ data.link }}}>
					<# _.each( positions, function( position ) { #>
						<option value="{{ position }}"<# if ( position === data.value['background-position'] ) { #> selected <# } #>>{{ data.l10n[ position ] }}</option>
					<# }); #>
				</select>
			</div>
		<?php
	}

	/**
	 * Returns an array of translation strings.
	 *
	 * @access protected
	 * @since 3.0.0
	 * @param string|false $config_id The string-ID.
	 * @return array
	 */
	protected function l10n( $config_id ) {
		$translation_strings = array(
			'background-color'      => esc_attr__( 'Background Color', 'kirki' ),
			'background-image'      => esc_attr__( 'Background Image', 'kirki' ),
			'background-repeat'     => esc_attr__( 'Background Repeat', 'kirki' ),
			'background-attachment' => esc_attr__( 'Background Attachment', 'kirki' ),
			'background-position'   => esc_attr__( 'Background Position', 'kirki' ),
			'background-size'       => esc_attr__( 'Background Size', 'kirki' ),

			'no-repeat'             => esc_attr__( 'No Repeat', 'kirki' ),
			'repeat-all'            => esc_attr__( 'Repeat All', 'kirki' ),
			'repeat-x'              => esc_attr__( 'Repeat Horizontally', 'kirki' ),
			'repeat-y'              => esc_attr__( 'Repeat Vertically', 'kirki' ),

			'cover'                 => esc_attr__( 'Cover', 'kirki' ),
			'contain'               => esc_attr__( 'Contain', 'kirki' ),
			'auto'                  => esc_attr__( 'Auto', 'kirki' ),
			'inherit'               => esc_attr__( 'Inherit', 'kirki' ),

			'fixed'                 => esc_attr__( 'Fixed', 'kirki' ),
			'scroll'                => esc_attr__( 'Scroll', 'kirki' ),

			'left top'              => esc_attr__( 'Left Top', 'kirki' ),
			'left center'           => esc_attr__( 'Left Center', 'kirki' ),
			'left bottom'           => esc_attr__( 'Left Bottom', 'kirki' ),
			'right top'             => esc_attr__( 'Right Top', 'kirki' ),
			'right center'          => esc_attr__( 'Right Center', 'kirki' ),
			'right bottom'          => esc_attr__( 'Right Bottom', 'kirki' ),
			'center top'            => esc_attr__( 'Center Top', 'kirki' ),
			'center center'         => esc_attr__( 'Center Center', 'kirki' ),
			'center bottom'         => esc_attr__( 'Center Bottom', 'kirki' ),

			'no-file-selected'      => esc_attr__( 'No File Selected', 'kirki' ),
			'remove'                => esc_attr__( 'Remove', 'kirki' ),
			'select-file'           => esc_attr__( 'Select File', 'kirki' ),
		);
		return apply_filters( 'kirki/' . $config_id . '/l10n', $translation_strings );
	}
}


1			<?php
2
3			class Kirki_Control_Background extends WP_Customize_Control {
4
5			/**
6			* The control type.
7			*
8			* @access public
9			* @var string
10			*/
11			public $type = 'kirki-background';
12
13			/**
14			* Used to automatically generate all CSS output.
15			*
16			* @access public
17			* @var array
18			*/
19			public $output = array();
20
21			/**
22			* Data type
23			*
24			* @access public
25			* @var string
26			*/
27			public $option_type = 'theme_mod';
28
29			/**
30			* Enqueue control related scripts/styles.
31			*
32			* @access public
33			*/
34			public function enqueue() {
35			wp_enqueue_script( 'wp-color-picker-alpha', trailingslashit( Kirki::$url ) . 'controls/background/wp-color-picker-alpha.js', array( 'wp-color-picker' ), '1.2', true );
36			wp_enqueue_style( 'wp-color-picker' );
37
38			wp_enqueue_script( 'kirki-background', trailingslashit( Kirki::$url ) . 'controls/background/background.js', array( 'jquery', 'wp-color-picker-alpha' ) );
39			wp_enqueue_style( 'kirki-background', trailingslashit( Kirki::$url ) . 'controls/background/background.css', null );
40			}
41
42			/**
43			* Refresh the parameters passed to the JavaScript via JSON.
44			*
45			* @access public
46			*/
47			public function to_json() {
48			parent::to_json();
49
50			$this->json['default'] = $this->setting->default;
51			if ( isset( $this->default ) ) {
52			$this->json['default'] = $this->default;
53			}
54			$this->json['output'] = $this->output;
55			$this->json['value'] = $this->value();
56			$this->json['choices'] = $this->choices;
57			$this->json['link'] = $this->get_link();
58			$this->json['id'] = $this->id;
59
60			if ( 'user_meta' === $this->option_type ) {
61			$this->json['value'] = get_user_meta( get_current_user_id(), $this->id, true );
62			}
63
64			$this->json['inputAttrs'] = '';
65			foreach ( $this->input_attrs as $attr => $value ) {
66			$this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
67			}
68			$config_id = 'global';
69			$this->json['l10n'] = $this->l10n( $config_id );
70			}
71
72			/**
73			* An Underscore (JS) template for this control's content (but not its container).
74			*
75			* Class variables for this control class are available in the `data` JS object;
76			* export custom variables by overriding {@see WP_Customize_Control::to_json()}.
77			*
78			* @see WP_Customize_Control::print_template()
79			*
80			* @access protected
81			*/
82			protected function content_template() {
83			?>
84			<label>
85			<span class="customize-control-title">
86			{{{ data.label }}}
87			</span>
88			<# if ( data.description ) { #>
89			<span class="description customize-control-description">{{{ data.description }}}</span>
90			<# } #>
91			</label>
92			<div class="background-wrapper">
93
94			<!-- background-color -->
95			<div class="background-color">
96			<h4>{{ data.l10n['background-color'] }}</h4>
97			<input type="text" data-default-color="{{ data.default['background-color'] }}" value="{{ data.value['background-color'] }}" class="kirki-color-control color-picker" {{{ data.link }}} />
98			</div>
99
100			<!-- background-image -->
101			<div class="background-image">
102			<h4>{{ data.l10n['background-image'] }}</h4>
103			<div class="attachment-media-view background-image-upload">
104			<# if ( data.value['background-image'] ) { #>
105			<div class="thumbnail thumbnail-image">
106			<img src="{{ data.value['background-image'] }}" alt="" />
107			</div>
108			<# } else { #>
109			<div class="placeholder">
110			{{ data.l10n['no-file-selected'] }}
111			</div>
112			<# } #>
113			<div class="actions">
114			<button class="button background-image-upload-remove-button<# if ( ! data.value['background-image'] ) { #> hidden <# } #>">
115			{{ data.l10n['remove'] }}
116			</button>
117			<button type="button" class="button background-image-upload-button">
118			{{ data.l10n['select-file'] }}
119			</button>
120			</div>
121			</div>
122			</div>
123
124			<!-- background-repeat -->
125			<div class="background-repeat">
126			<h4>{{ data.l10n['background-repeat'] }}</h4>
127			<#
128			var repeats = [
129			'no-repeat',
130			'repeat-all',
131			'repeat-x',
132			'repeat-y'
133			];
134			#>
135			<select {{{ data.inputAttrs }}} {{{ data.link }}}>
136			<# _.each( repeats, function( repeat ) { #>
137			<option value="{{ repeat }}"<# if ( repeat === data.value['background-repeat'] ) { #> selected <# } #>>{{ data.l10n[ repeat ] }}</option>
138			<# }); #>
139			</select>
140			</div>
141
142			<!-- background-size -->
143			<div class="background-size">
144			<h4>{{ data.l10n['background-size'] }}</h4>
145			<#
146			var sizes = [
147			'cover',
148			'contain',
149			'auto'
150			];
151			#>
152			<select {{{ data.inputAttrs }}} {{{ data.link }}}>
153			<# _.each( sizes, function( size ) { #>
154			<option value="{{ size }}"<# if ( size === data.value['background-size'] ) { #> selected <# } #>>{{ data.l10n[ size ] }}</option>
155			<# }); #>
156			</select>
157			</div>
158
159			<!-- background-attachment -->
160			<!-- <div class="background-attachment">
161			<h4>{{ data.l10n['background-attachment'] }}</h4>
162			</div> -->
163
164			<!-- background-position -->
165			<div class="background-position">
166			<h4>{{ data.l10n['background-position'] }}</h4>
167			<#
168			var positions = [
169			'left top',
170			'left center',
171			'left bottom',
172			'right top',
173			'right center',
174			'right bottom',
175			'center top',
176			'center center',
177			'center bottom'
178			];
179			#>
180			<select {{{ data.inputAttrs }}} {{{ data.link }}}>
181			<# _.each( positions, function( position ) { #>
182			<option value="{{ position }}"<# if ( position === data.value['background-position'] ) { #> selected <# } #>>{{ data.l10n[ position ] }}</option>
183			<# }); #>
184			</select>
185			</div>
186			<?php
187			}
188
189			/**
190			* Returns an array of translation strings.
191			*
192			* @access protected
193			* @since 3.0.0
194			* @param string\|false $config_id The string-ID.
195			* @return array
196			*/
197			protected function l10n( $config_id ) {
198			$translation_strings = array(
199			'background-color' => esc_attr__( 'Background Color', 'kirki' ),
200			'background-image' => esc_attr__( 'Background Image', 'kirki' ),
201			'background-repeat' => esc_attr__( 'Background Repeat', 'kirki' ),
202			'background-attachment' => esc_attr__( 'Background Attachment', 'kirki' ),
203			'background-position' => esc_attr__( 'Background Position', 'kirki' ),
204			'background-size' => esc_attr__( 'Background Size', 'kirki' ),
205
206			'no-repeat' => esc_attr__( 'No Repeat', 'kirki' ),
207			'repeat-all' => esc_attr__( 'Repeat All', 'kirki' ),
208			'repeat-x' => esc_attr__( 'Repeat Horizontally', 'kirki' ),
209			'repeat-y' => esc_attr__( 'Repeat Vertically', 'kirki' ),
210
211			'cover' => esc_attr__( 'Cover', 'kirki' ),
212			'contain' => esc_attr__( 'Contain', 'kirki' ),
213			'auto' => esc_attr__( 'Auto', 'kirki' ),
214			'inherit' => esc_attr__( 'Inherit', 'kirki' ),
215
216			'fixed' => esc_attr__( 'Fixed', 'kirki' ),
217			'scroll' => esc_attr__( 'Scroll', 'kirki' ),
218
219			'left top' => esc_attr__( 'Left Top', 'kirki' ),
220			'left center' => esc_attr__( 'Left Center', 'kirki' ),
221			'left bottom' => esc_attr__( 'Left Bottom', 'kirki' ),
222			'right top' => esc_attr__( 'Right Top', 'kirki' ),
223			'right center' => esc_attr__( 'Right Center', 'kirki' ),
224			'right bottom' => esc_attr__( 'Right Bottom', 'kirki' ),
225			'center top' => esc_attr__( 'Center Top', 'kirki' ),
226			'center center' => esc_attr__( 'Center Center', 'kirki' ),
227			'center bottom' => esc_attr__( 'Center Bottom', 'kirki' ),
228
229			'no-file-selected' => esc_attr__( 'No File Selected', 'kirki' ),
230			'remove' => esc_attr__( 'Remove', 'kirki' ),
231			'select-file' => esc_attr__( 'Select File', 'kirki' ),
232			);
233			return apply_filters( 'kirki/' . $config_id . '/l10n', $translation_strings );
234			}
235			}
236

aristath / kirki

Pull Request — develop (#1283)

Kirki_Control_Background::content_template() B

Complexity

Size

Duplication

Importance

How to fix Long Method

Long Method

Duplication Side-by-Side

Filter issues like