jQuery( document ).ready(
	function ( $ ) {
		// Insert tag text at cursor in template fields.
		function insertTagAtCursor( inputElement, tag ) {
			var input    = inputElement[0];
			var startPos = input.selectionStart;
			var endPos   = input.selectionEnd;
			var value    = input.value;

			input.value = value.substring( 0, startPos ) + tag + value.substring( endPos, value.length );

			input.setSelectionRange( startPos + tag.length, startPos + tag.length );
			input.focus();

			$( input ).trigger( 'input' );
		}

		$( '.bsh-tag-btn' ).on(
			'click',
			function ( e ) {
				e.preventDefault();

				var tag         = $( this ).data( 'tag' );
				var targetId    = $( this ).closest( '.bsh-tag-buttons' ).data( 'target' );
				var targetField = $( '#' + targetId );

				insertTagAtCursor( targetField, tag );
			}
		);

		$( '.bsh-variable code' ).on(
			'click',
			function ( e ) {
				e.preventDefault();

				var tag         = $( this ).text();
				var targetField = $( '.bsh-template-field:focus' );

				if ( targetField.length === 0 ) {
					targetField = $( '#bsh_default_title_template' );
				}

				insertTagAtCursor( targetField, tag );
			}
		);

		function updatePreview() {
			var titleTemplate         = $( '#bsh_default_title_template' ).val() || '{post_title} {separator} {site_name}';
			var descriptionTemplate   = $( '#bsh_default_description_template' ).val() || '{excerpt}';
			var ogTitleTemplate       = $( '#bsh_default_og_title_template' ).val() || '{post_title}';
			var ogDescriptionTemplate = $( '#bsh_default_og_description_template' ).val() || '{excerpt}';
			var separator             = $( '#bsh_title_separator' ).val() || '|';

			var sampleData = {
				'{site_name}': cspgbaseTemplates.siteName,
				'{tagline}': cspgbaseTemplates.tagline,
				'{post_title}': 'Sample Blog Post Title',
				'{excerpt}': 'This is a sample excerpt that shows how your description template will look when rendered.',
				'{category}': 'Web Development',
				'{author}': 'Sample Author',
				'{date}': cspgbaseTemplates.currentDate,
				'{post_type}': 'Post',
				'{separator}': separator
			};

			var titlePreview       = titleTemplate;
			var descriptionPreview = descriptionTemplate;

			for ( var variable in sampleData ) {
				var regex = new RegExp( variable.replace( /[.*+?^${}()|[\]\\]/g, '\\$&' ), 'g' );

				titlePreview       = titlePreview.replace( regex, sampleData[ variable ] );
				descriptionPreview = descriptionPreview.replace( regex, sampleData[ variable ] );
			}

			$( '#bsh-title-preview' ).text( titlePreview );
			$( '#bsh-description-preview' ).text( descriptionPreview );
		}

		$( document ).on(
			'input change keyup',
			'#bsh_default_title_template, #bsh_default_description_template, #bsh_default_og_title_template, #bsh_default_og_description_template, #bsh_title_separator, #bsh_fallback_text',
			function () {
				updatePreview();
			}
		);

		updatePreview();

		if ( typeof cspgbaseTemplates !== 'undefined' && cspgbaseTemplates.templatesSaved ) {
			setTimeout(
				function () {
					updatePreview();
				},
				250
			);
		}

		setTimeout(
			function () {
				updatePreview();
			},
			100
		);

		$( '.bsh-tag-btn' ).attr( 'title', 'Click to insert this tag at cursor position' );
		$( '.bsh-variable code' ).attr( 'title', 'Click to insert this tag into the focused field' );
	}
);
