How to use su method in taiko

Best JavaScript code snippet using taiko

generator.js

Source:generator.js

1jQuery(document).ready(function($) {2	// Prepare data3	var $generator = $('#su-generator'),4		$search = $('#su-generator-search'),5		$filter = $('#su-generator-filter'),6		$filters = $filter.children('a'),7		$choices = $('#su-generator-choices'),8		$choice = $choices.find('span'),9		$settings = $('#su-generator-settings'),10		$prefix = $('#su-compatibility-mode-prefix'),11		$result = $('#su-generator-result'),12		$selected = $('#su-generator-selected'),13		mce_selection = '';14	// Hotkey15	if (typeof $.hotkeys == 'object' && $.hotkeys.version === '(beta)(0.0.3)' && su_generator.hotkey) {16		$.hotkeys.add(su_generator.hotkey, function() {17			$('.su-generator-button').trigger('click');18		});19	}20	// Generator button21	$('body').on('click', '.su-generator-button', function(e) {22		e.preventDefault();23		// Save the target24		window.su_generator_target = $(this).data('target');25		// Get open shortcode26		var shortcode = $(this).data('shortcode');27		// Open magnificPopup28		$(this).magnificPopup({29			type: 'inline',30			alignTop: true,31			callbacks: {32				open: function() {33					// Open queried shortcode34					if (shortcode) $choice.filter('[data-shortcode="' + shortcode + '"]').trigger('click');35					// Focus search field when popup is opened36					else window.setTimeout(function() {37						$search.focus();38					}, 200);39					// Change z-index40					$('body').addClass('su-mfp-shown');41					// Save selection42					mce_selection = (typeof tinyMCE !== 'undefined' && tinyMCE.activeEditor != null && tinyMCE.activeEditor.hasOwnProperty('selection')) ? tinyMCE.activeEditor.selection.getContent({43						format: "text"44					}) : '';45				},46				close: function() {47					// Clear search field48					$search.val('');49					// Hide settings50					$settings.html('').hide();51					// Remove narrow class52					$generator.removeClass('su-generator-narrow');53					// Show filters54					$filter.show();55					// Show choices panel56					$choices.show();57					$choice.show();58					// Clear selection59					mce_selection = '';60					// Change z-index61					$('body').removeClass('su-mfp-shown');62				}63			}64		}).magnificPopup('open');65	});66	// Filters67	$filters.click(function(e) {68		// Prepare data69		var filter = $(this).data('filter');70		// If filter All, show all choices71		if (filter === 'all') $choice.css({72			opacity: 173		}).removeClass('su-generator-choice-first');74		// Else run search75		else {76			var regex = new RegExp(filter, 'gi');77			// Hide all choices78			$choice.css({79				opacity: 0.280			});81			// Find searched choices and show82			$choice.each(function() {83				// Get shortcode name84				var group = $(this).data('group');85				// Show choice if matched86				if (group.match(regex) !== null) $(this).css({87					opacity: 188				}).removeClass('su-generator-choice-first');89			});90		}91		e.preventDefault();92	});93	// Go to home link94	$('#su-generator').on('click', '.su-generator-home', function(e) {95		// Clear search field96		$search.val('');97		// Hide settings98		$settings.html('').hide();99		// Remove narrow class100		$generator.removeClass('su-generator-narrow');101		// Show filters102		$filter.show();103		// Show choices panel104		$choices.show();105		$choice.show();106		// Clear selection107		mce_selection = '';108		// Focus search field109		$search.focus();110		e.preventDefault();111	});112	// Generator close button113	$('#su-generator').on('click', '.su-generator-close', function(e) {114		// Close popup115		$.magnificPopup.close();116		// Prevent default action117		e.preventDefault();118	});119	// Search field120	$search.on({121		focus: function() {122			// Clear field123			$(this).val('');124			// Hide settings125			$settings.html('').hide();126			// Remove narrow class127			$generator.removeClass('su-generator-narrow');128			// Show choices panel129			$choices.show();130			$choice.css({131				opacity: 1132			}).removeClass('su-generator-choice-first');133			// Show filters134			$filter.show();135		},136		blur: function() {},137		keyup: function(e) {138			// Prepare vars139			var $first = $('.su-generator-choice-first:first'),140				val = $(this).val(),141				regex = new RegExp(val, 'gi'),142				best = 0;143			// Hotkey action144			if (e.keyCode === 13 && $first.length > 0) {145				e.preventDefault();146				$(this).val('').blur();147				$first.trigger('click');148			}149			// Hide all choices150			$choice.css({151				opacity: 0.2152			}).removeClass('su-generator-choice-first');153			// Loop and highlight choices154			$choice.each(function() {155				// Get choice data156				var data = $(this).data(),157					id = data.shortcode,158					name = data.name,159					desc = data.desc,160					group = data.group,161					matches = ([id, name, desc, group].join(' ')).match(regex);162				// Highlight choice if matched163				if (matches !== null) {164					// Highlight current choice165					$(this).css({166						opacity: 1167					});168					// Check for exact match169					if (val === id) {170						// Remove primary class from all choices171						$choice.removeClass('su-generator-choice-first');172						// Add primary class to the current choice173						$(this).addClass('su-generator-choice-first');174						// Prevent selecting by matches number175						best = 999;176					}177					// Check matches length178					else if (matches.length > best) {179						// Remove primary class from all choices180						$choice.removeClass('su-generator-choice-first');181						// Add primary class to the current choice182						$(this).addClass('su-generator-choice-first');183						// Save the score184						best = matches.length;185					}186				}187			});188			// Remove primary class if search field is empty189			if (val === '') $choice.removeClass('su-generator-choice-first');190		}191	});192	// Click on shortcode choice193	$choice.on('click', function(e) {194		// Prepare data195		var shortcode = $(this).data('shortcode');196		// Load shortcode options197		$.ajax({198			type: 'POST',199			url: ajaxurl,200			data: {201				action: 'su_generator_settings',202				shortcode: shortcode203			},204			beforeSend: function() {205				// Hide preview box206				$('#su-generator-preview').hide();207				// Hide choices panel208				$choices.hide();209				// Show loading animation210				$settings.addClass('su-generator-loading').show();211				// Add narrow class212				$generator.addClass('su-generator-narrow');213				// Hide filters214				$filter.hide();215			},216			success: function(data) {217				// Hide loading animation218				$settings.removeClass('su-generator-loading');219				// Insert new HTML220				$settings.html(data);221				// Apply selected text to the content field222				var $content = $('#su-generator-content');223				if (typeof mce_selection !== 'undefined' && mce_selection !== '' && $content.attr('type') !== 'hidden') {224					$content.val(mce_selection);225				}226				// Init range pickers227				$('.su-generator-range-picker').each(function(index) {228					var $picker = $(this),229						$val = $picker.find('input'),230						min = $val.attr('min'),231						max = $val.attr('max'),232						step = $val.attr('step');233					// Apply noUIslider234					$val.simpleSlider({235						snap: true,236						step: step,237						range: [min, max]238					});239					$val.show();240					$val.on('keyup blur', function(e) {241						$val.simpleSlider('setValue', $val.val());242					});243				});244				// Init color pickers245				$('.su-generator-select-color').each(function(index) {246					$(this).find('.su-generator-select-color-wheel').filter(':first').farbtastic('.su-generator-select-color-value:eq(' + index + ')');247					$(this).find('.su-generator-select-color-value').focus(function() {248						$('.su-generator-select-color-wheel:eq(' + index + ')').show();249					});250					$(this).find('.su-generator-select-color-value').blur(function() {251						$('.su-generator-select-color-wheel:eq(' + index + ')').hide();252					});253				});254				// Init image sourse pickers255				$('.su-generator-isp').each(function() {256					var $picker = $(this),257						$sources = $picker.find('.su-generator-isp-sources'),258						$source = $picker.find('.su-generator-isp-source'),259						$add_media = $picker.find('.su-generator-isp-add-media'),260						$images = $picker.find('.su-generator-isp-images'),261						$cats = $picker.find('.su-generator-isp-categories'),262						$taxes = $picker.find('.su-generator-isp-taxonomies'),263						$terms = $('.su-generator-isp-terms'),264						$val = $picker.find('.su-generator-attr'),265						frame;266					// Update hidden value267					var update = function() {268							var val = 'none',269								ids = '',270								source = $sources.val();271							// Media library272							if (source === 'media') {273								var images = [];274								$images.find('span').each(function(i) {275									images[i] = $(this).data('id');276								});277								if (images.length > 0) ids = images.join(',');278							}279							// Category280							else if (source === 'category') {281								var categories = $cats.val() || [];282								if (categories.length > 0) ids = categories.join(',');283							}284							// Taxonomy285							else if (source === 'taxonomy') {286								var tax = $taxes.val() || '',287									terms = $terms.val() || [];288								if (tax !== '0' && terms.length > 0) val = 'taxonomy: ' + tax + '/' + terms.join(',');289							}290							// Deselect291							else if (source === '0') {292								val = 'none';293							}294							// Other options295							else {296								val = source;297							}298							if (ids !== '') val = source + ': ' + ids;299							$val.val(val).trigger('change');300						}301						// Switch source302					$sources.on('change', function(e) {303						var source = $(this).val();304						e.preventDefault();305						$source.removeClass('su-generator-isp-source-open');306						if (source.indexOf(':') === -1) $picker.find('.su-generator-isp-source-' + source).addClass('su-generator-isp-source-open');307						update();308					});309					// Remove image310					$images.on('click', 'span i', function() {311						$(this).parent('span').css('border-color', '#f03').fadeOut(300, function() {312							$(this).remove();313							update();314						});315					});316					// Add image317					$add_media.click(function(e) {318						e.preventDefault();319						if (typeof(frame) !== 'undefined') frame.close();320						frame = wp.media.frames.su_media_frame_1 = wp.media({321							title: su_generator.isp_media_title,322							library: {323								type: 'image'324							},325							button: {326								text: su_generator.isp_media_insert327							},328							multiple: true329						});330						frame.on('select', function() {331							var files = frame.state().get('selection').toJSON();332							$images.find('em').remove();333							$.each(files, function(i) {334								$images.append('<span data-id="' + this.id + '" title="' + this.title + '"><img src="' + this.url + '" alt="" /><i class="fa fa-times"></i></span>');335							});336							update();337						}).open();338					});339					// Sort images340					$images.sortable({341						revert: 200,342						containment: $picker,343						tolerance: 'pointer',344						stop: function() {345							update();346						}347					});348					// Select categories and terms349					$cats.on('change', update);350					$terms.on('change', update);351					// Select taxonomy352					$taxes.on('change', function() {353						var $cont = $(this).parents('.su-generator-isp-source'),354							tax = $(this).val();355						// Remove terms356						$terms.hide().find('option').remove();357						update();358						// Taxonomy is not selected359						if (tax === '0') return;360						// Taxonomy selected361						else {362							var ajax_term_select = $.ajax({363								url: ajaxurl,364								type: 'post',365								dataType: 'html',366								data: {367									'action': 'su_generator_get_terms',368									'tax': tax,369									'class': 'su-generator-isp-terms',370									'multiple': true,371									'size': 10372								},373								beforeSend: function() {374									if (typeof ajax_term_select === 'object') ajax_term_select.abort();375									$terms.html('').attr('disabled', true).hide();376									$cont.addClass('su-generator-loading');377								},378								success: function(data) {379									$terms.html(data).attr('disabled', false).show();380									$cont.removeClass('su-generator-loading');381								}382							});383						}384					});385				});386				// Init media buttons387				$('.su-generator-upload-button').each(function() {388					var $button = $(this),389						$val = $(this).parents('.su-generator-attr-container').find('input:text'),390						file;391					$button.on('click', function(e) {392						e.preventDefault();393						e.stopPropagation();394						// If the frame already exists, reopen it395						if (typeof(file) !== 'undefined') file.close();396						// Create WP media frame.397						file = wp.media.frames.su_media_frame_2 = wp.media({398							// Title of media manager frame399							title: su_generator.upload_title,400							button: {401								//Button text402								text: su_generator.upload_insert403							},404							// Do not allow multiple files, if you want multiple, set true405							multiple: false406						});407						//callback for selected image408						file.on('select', function() {409							var attachment = file.state().get('selection').first().toJSON();410							$val.val(attachment.url).trigger('change');411						});412						// Open modal413						file.open();414					});415				});416				// Init icon pickers417				$('.su-generator-icon-picker-button').each(function() {418					var $button = $(this),419						$field = $(this).parents('.su-generator-attr-container'),420						$val = $field.find('.su-generator-attr'),421						$picker = $field.find('.su-generator-icon-picker'),422						$filter = $picker.find('input:text');423					$button.click(function(e) {424						$picker.toggleClass('su-generator-icon-picker-visible');425						$filter.val('').trigger('keyup');426						if ($picker.hasClass('su-generator-icon-picker-loaded')) return;427						// Load icons428						$.ajax({429							type: 'post',430							url: ajaxurl,431							data: {432								action: 'su_generator_get_icons'433							},434							dataType: 'html',435							beforeSend: function() {436								// Show loading animation437								$picker.addClass('su-generator-loading');438								// Add loaded class439								$picker.addClass('su-generator-icon-picker-loaded');440							},441							success: function(data) {442								$picker.append(data);443								var $icons = $picker.children('i');444								$icons.click(function(e) {445									$val.val('icon: ' + $(this).attr('title'));446									$picker.removeClass('su-generator-icon-picker-visible');447									$val.trigger('change');448									e.preventDefault();449								});450								$filter.on({451									keyup: function() {452										var val = $(this).val(),453											regex = new RegExp(val, 'gi');454										// Hide all choices455										$icons.hide();456										// Find searched choices and show457										$icons.each(function() {458											// Get shortcode name459											var name = $(this).attr('title');460											// Show choice if matched461											if (name.match(regex) !== null) $(this).show();462										});463									},464									focus: function() {465										$(this).val('');466										$icons.show();467									}468								});469								$picker.removeClass('su-generator-loading');470							}471						});472						e.preventDefault();473					});474				});475				// Init switches476				$('.su-generator-switch').click(function(e) {477					// Prepare data478					var $switch = $(this),479						$value = $switch.parent().children('input'),480						is_on = $value.val() === 'yes';481					// Disable482					if (is_on) {483						// Change value484						$value.val('no').trigger('change');485					}486					// Enable487					else {488						// Change value489						$value.val('yes').trigger('change');490					}491					e.preventDefault();492				});493				$('.su-generator-switch-value').on('change', function() {494					// Prepare data495					var $value = $(this),496						$switch = $value.parent().children('.su-generator-switch'),497						value = $value.val();498					// Disable499					if (value === 'yes') $switch.removeClass('su-generator-switch-no').addClass('su-generator-switch-yes');500					// Enable501					else if (value === 'no') $switch.removeClass('su-generator-switch-yes').addClass('su-generator-switch-no');502				});503				// Init tax_term selects504				$('select#su-generator-attr-taxonomy').on('change', function() {505					var $taxonomy = $(this),506						tax = $taxonomy.val(),507						$terms = $('select#su-generator-attr-tax_term');508					// Load new options509					window.su_generator_get_terms = $.ajax({510						type: 'POST',511						url: ajaxurl,512						data: {513							action: 'su_generator_get_terms',514							tax: tax,515							noselect: true516						},517						dataType: 'html',518						beforeSend: function() {519							// Check previous requests520							if (typeof window.su_generator_get_terms === 'object') window.su_generator_get_terms.abort();521							// Show loading animation522							$terms.parent().addClass('su-generator-loading');523						},524						success: function(data) {525							// Remove previous options526							$terms.find('option').remove();527							// Append new options528							$terms.append(data);529							// Hide loading animation530							$terms.parent().removeClass('su-generator-loading');531						}532					});533				});534				// Init shadow pickers535				$('.su-generator-shadow-picker').each(function(index) {536					var $picker = $(this),537						$fields = $picker.find('.su-generator-shadow-picker-field input'),538						$hoff = $picker.find('.su-generator-sp-hoff'),539						$voff = $picker.find('.su-generator-sp-voff'),540						$blur = $picker.find('.su-generator-sp-blur'),541						$color = {542							cnt: $picker.find('.su-generator-shadow-picker-color'),543							value: $picker.find('.su-generator-shadow-picker-color-value'),544							wheel: $picker.find('.su-generator-shadow-picker-color-wheel')545						},546						$val = $picker.find('.su-generator-attr');547					// Init color picker548					$color.wheel.farbtastic($color.value);549					$color.value.focus(function() {550						$color.wheel.show();551					});552					$color.value.blur(function() {553						$color.wheel.hide();554					});555					// Handle text fields556					$fields.on('change blur keyup', function() {557						$val.val($hoff.val() + 'px ' + $voff.val() + 'px ' + $blur.val() + 'px ' + $color.value.val()).trigger('change');558					});559					$val.on('keyup', function() {560						var value = $(this).val().split(' ');561						// Value is correct562						if (value.length === 4) {563							$hoff.val(value[0].replace('px', ''));564							$voff.val(value[1].replace('px', ''));565							$blur.val(value[2].replace('px', ''));566							$color.value.val(value[3]);567							$fields.trigger('keyup');568						}569					});570				});571				// Init border pickers572				$('.su-generator-border-picker').each(function(index) {573					var $picker = $(this),574						$fields = $picker.find('.su-generator-border-picker-field input, .su-generator-border-picker-field select'),575						$width = $picker.find('.su-generator-bp-width'),576						$style = $picker.find('.su-generator-bp-style'),577						$color = {578							cnt: $picker.find('.su-generator-border-picker-color'),579							value: $picker.find('.su-generator-border-picker-color-value'),580							wheel: $picker.find('.su-generator-border-picker-color-wheel')581						},582						$val = $picker.find('.su-generator-attr');583					// Init color picker584					$color.wheel.farbtastic($color.value);585					$color.value.focus(function() {586						$color.wheel.show();587					});588					$color.value.blur(function() {589						$color.wheel.hide();590					});591					// Handle text fields592					$fields.on('change blur keyup', function() {593						$val.val($width.val() + 'px ' + $style.val() + ' ' + $color.value.val()).trigger('change');594					});595					$val.on('keyup', function() {596						var value = $(this).val().split(' ');597						// Value is correct598						if (value.length === 3) {599							$width.val(value[0].replace('px', ''));600							$style.val(value[1]);601							$color.value.val(value[2]);602							$fields.trigger('keyup');603						}604					});605				});606				// Remove skip class when setting is changed607				$settings.find('.su-generator-attr').on('change keyup blur', function() {608					var $cnt = $(this).parents('.su-generator-attr-container'),609						_default = $cnt.data('default'),610						val = $(this).val();611					// Value is changed612					if (val != _default) $cnt.removeClass('su-generator-skip');613					else $cnt.addClass('su-generator-skip');614				});615				// Init value setters616				$('.su-generator-set-value').click(function(e) {617					$(this).parents('.su-generator-attr-container').find('input').val($(this).text()).trigger('change');618				});619				// Save selected value620				$selected.val(shortcode);621				// Load last used preset622				$.ajax({623					type: 'GET',624					url: ajaxurl,625					data: {626						action: 'su_generator_get_preset',627						id: 'last_used',628						shortcode: shortcode629					},630					beforeSend: function() {631						// Show loading animation632						// $settings.addClass('su-generator-loading');633					},634					success: function(data) {635						// Remove loading animation636						// $settings.removeClass('su-generator-loading');637						// Set new settings638						set(data);639						// Apply selected text to the content field640						var $content = $('#su-generator-content');641						if (typeof mce_selection !== 'undefined' && mce_selection !== '' && $content.attr('type') !== 'hidden') {642							$content.val(mce_selection);643						}644					},645					dataType: 'json'646				});647			},648			dataType: 'html'649		});650	});651	// Insert shortcode652	$('#su-generator').on('click', '.su-generator-insert', function(e) {653		// Prepare data654		var shortcode = parse();655		// Save current settings to presets656		add_preset('last_used', su_generator.last_used);657		// Close popup658		$.magnificPopup.close();659		// Save shortcode to div660		$result.text(shortcode);661		// Prevent default action662		e.preventDefault();663		// Save original activeeditor664		window.su_wpActiveEditor = window.wpActiveEditor;665		// Set new active editor666		window.wpActiveEditor = window.su_generator_target;667		// Insert shortcode668		window.wp.media.editor.insert(shortcode);669		// Restore previous editor670		window.wpActiveEditor = window.su_wpActiveEditor;671		// Check for target content editor672		// if (typeof window.su_generator_target === 'undefined') return;673		// Insert into default content editor674		// else if (window.su_generator_target === 'content') window.wp.media.editor.insert(shortcode);675		// Insert into ET page builder (text box)676		// else if (window.su_generator_target === 'et_pb_content_new') window.wp.media.editor.insert(shortcode);677		// Insert into textarea678		// else {679		// var $target = $('textarea#' + window.su_generator_target);680		// if ($target.length > 0) $target.val($target.val() + shortcode);681		// }682	});683	// Preview shortcode684	$('#su-generator').on('click', '.su-generator-toggle-preview', function(e) {685		// Prepare data686		var $preview = $('#su-generator-preview'),687			$button = $(this);688		// Hide button689		$button.hide();690		// Show preview box691		$preview.addClass('su-generator-loading').show();692		// Bind updating on settings changes693		$settings.find('input, textarea, select').on('change keyup blur', function() {694			update_preview();695		});696		// Update preview box697		update_preview(true);698		// Prevent default action699		e.preventDefault();700	});701	var gp_hover_timer;702	// Presets manager - mouseenter703	$('#su-generator').on('mouseenter click', '.su-generator-presets', function() {704		clearTimeout(gp_hover_timer);705		$('.su-gp-popup').show();706	});707	// Presets manager - mouseleave708	$('#su-generator').on('mouseleave', '.su-generator-presets', function() {709		gp_hover_timer = window.setTimeout(function() {710			$('.su-gp-popup').fadeOut(200);711		}, 600);712	});713	// Presets manager - add new preset714	$('#su-generator').on('click', '.su-gp-new', function(e) {715		// Prepare data716		var $container = $(this).parents('.su-generator-presets'),717			$list = $('.su-gp-list'),718			id = new Date().getTime();719		// Ask for preset name720		var name = prompt(su_generator.presets_prompt_msg, su_generator.presets_prompt_value);721		// Name is entered722		if (name !== '' && name !== null) {723			// Hide default text724			$list.find('b').hide();725			// Add new option726			$list.append('<span data-id="' + id + '"><em>' + name + '</em><i class="fa fa-times"></i></span>');727			// Perform AJAX request728			add_preset(id, name);729		}730	});731	// Presets manager - load preset732	$('#su-generator').on('click', '.su-gp-list span', function(e) {733		// Prepare data734		var shortcode = $('.su-generator-presets').data('shortcode'),735			id = $(this).data('id'),736			$insert = $('.su-generator-insert');737		// Hide popup738		$('.su-gp-popup').hide();739		// Disable hover timer740		clearTimeout(gp_hover_timer);741		// Get the preset742		$.ajax({743			type: 'GET',744			url: ajaxurl,745			data: {746				action: 'su_generator_get_preset',747				id: id,748				shortcode: shortcode749			},750			beforeSend: function() {751				// Disable insert button752				$insert.addClass('button-primary-disabled').attr('disabled', true);753			},754			success: function(data) {755				// Enable insert button756				$insert.removeClass('button-primary-disabled').attr('disabled', false);757				// Set new settings758				set(data);759			},760			dataType: 'json'761		});762		// Prevent default action763		e.preventDefault();764		e.stopPropagation();765	});766	// Presets manager - remove preset767	$('#su-generator').on('click', '.su-gp-list i', function(e) {768		// Prepare data769		var $list = $(this).parents('.su-gp-list'),770			$preset = $(this).parent('span'),771			id = $preset.data('id');772		// Remove DOM element773		$preset.remove();774		// Show default text if last preset was removed775		if ($list.find('span').length < 1) $list.find('b').show();776		// Perform ajax request777		remove_preset(id);778		// Prevent <span> action779		e.stopPropagation();780		// Prevent default action781		e.preventDefault();782	});783	/**784	 * Create new preset with specified name from current settings785	 */786	function add_preset(id, name) {787			// Prepare shortcode name and current settings788			var shortcode = $('.su-generator-presets').data('shortcode'),789				settings = get();790			// Perform AJAX request791			$.ajax({792				type: 'POST',793				url: ajaxurl,794				data: {795					action: 'su_generator_add_preset',796					id: id,797					name: name,798					shortcode: shortcode,799					settings: settings800				}801			});802		}803		/**804		 * Remove preset by ID805		 */806	function remove_preset(id) {807		// Get current shortcode name808		var shortcode = $('.su-generator-presets').data('shortcode');809		// Perform AJAX request810		$.ajax({811			type: 'POST',812			url: ajaxurl,813			data: {814				action: 'su_generator_remove_preset',815				id: id,816				shortcode: shortcode817			}818		});819	}820	function parse() {821		// Prepare data822		var query = $selected.val(),823			prefix = $prefix.val(),824			$settings = $('#su-generator-settings .su-generator-attr-container:not(.su-generator-skip) .su-generator-attr'),825			content = $('#su-generator-content').val(),826			result = new String('');827		// Open shortcode828		result += '[' + prefix + query;829		// Add shortcode attributes830		$settings.each(function() {831			// Prepare field and value832			var $this = $(this),833				value = '';834			// Selects835			if ($this.is('select')) value = $this.find('option:selected').val();836			// Other fields837			else value = $this.val();838			// Check that value is not empty839			if (value == null) value = '';840			else if (typeof value === 'array') value = value.join(',');841			// Add attribute842			if (value !== '') result += ' ' + $(this).attr('name') + '="' + $(this).val().toString().replace(/"/gi, "'") + '"';843		});844		// End of opening tag845		result += ']';846		// Wrap shortcode if content presented847		if (content != 'false') result += content + '[/' + prefix + query + ']';848		// Return result849		return result;850	}851	function get() {852		// Prepare data853		var query = $selected.val(),854			$settings = $('#su-generator-settings .su-generator-attr'),855			content = $('#su-generator-content').val(),856			data = {};857		// Add shortcode attributes858		$settings.each(function(i) {859			// Prepare field and value860			var $this = $(this),861				value = '',862				name = $this.attr('name');863			// Selects864			if ($this.is('select')) value = $this.find('option:selected').val();865			// Other fields866			else value = $this.val();867			// Check that value is not empty868			if (value == null) value = '';869			// Save value870			data[name] = value;871		});872		// Add content873		data['content'] = content.toString();874		// Return data875		return data;876	}877	function set(data) {878		// Prepare data879		var $settings = $('#su-generator-settings .su-generator-attr'),880			$content = $('#su-generator-content');881		// Loop through settings882		$settings.each(function() {883			var $this = $(this),884				name = $this.attr('name');885			// Data contains value for this field886			if (data.hasOwnProperty(name)) {887				// Set new value888				$this.val(data[name]);889				$this.trigger('keyup').trigger('change').trigger('blur');890			}891		});892		// Set content893		if (data.hasOwnProperty('content')) $content.val(data['content']).trigger('keyup').trigger('change').trigger('blur');894		// Update preview895		update_preview();896	}897	var update_preview_timer,898		update_preview_request;899	function update_preview(forced) {900		// Prepare data901		var $preview = $('#su-generator-preview'),902			shortcode = parse(),903			previous = $result.text();904		// Check forced mode905		forced = forced || false;906		// Break if preview box is hidden (preview isn't enabled)907		if (!$preview.is(':visible')) return;908		// Check shortcode is changed is this is not a forced mode909		if (shortcode === previous && !forced) return;910		// Run timer to filter often calls911		window.clearTimeout(update_preview_timer);912		update_preview_timer = window.setTimeout(function() {913			update_preview_request = $.ajax({914				type: 'POST',915				url: ajaxurl,916				cache: false,917				data: {918					action: 'su_generator_preview',919					shortcode: shortcode920				},921				beforeSend: function() {922					// Abort previous requests923					if (typeof update_preview_request === 'object') update_preview_request.abort();924					// Show loading animation925					$preview.addClass('su-generator-loading').html('');926				},927				success: function(data) {928					// Hide loading animation and set new HTML929					$preview.html(data).removeClass('su-generator-loading');930				},931				dataType: 'html'932			});933		}, 300);934		// Save shortcode to div935		$result.text(shortcode);936	}...

Using AI Code Generation

1const { openBrowser, goto, click, closeBrowser } = require('taiko');2(async () => {3    try {4        await openBrowser();5        await goto("google.com");6        await click("Sign in");7        await click("Create account");8        await write("John");9        await press("Tab");10        await write("Doe");11        await press("Tab");12        await write("

Using AI Code Generation

1const taiko = require('taiko');2(async () => {3    try {4        await openBrowser();5        await goto("google.com");6        await write("taiko",into(textBox(toRightOf("Google Search"))));7        await click("Google Search");8        await click("Taiko - A Node.js library for automating end-to-end tests");9        await click("Documentation");10        await click("API Reference");11        await click("Browser");12        await click("openBrowser");13        await click("Examples");14        await click("openBrowser")

Using AI Code Generation

1const { openBrowser, goto, click, closeBrowser, below, textBox } = require('taiko');2(async () => {3    try {4        await openBrowser({ headless: false });5        await click("Sign in");6        await click("Create account");7        await write("John", into(textBox(below("First name"))));8        await write("Doe", into(textBox(below("Last name"))));9        await write("

Using AI Code Generation

1const { openBrowser, goto, closeBrowser, click, textBox, toRightOf, write, button, into, dropDown, text, waitFor, $ } = require('taiko');2(async () => {3    try {4        await openBrowser();5        await click('Login');6        await write('admin');7        await click('Password');8        await write('admin');9        await click('Login');10        await click('Admin');11        await click('Users');12        await click('Add User');13        await write('testuser');14        await click('Password');15        await write('testuser');16        await click('Name');17        await write('Test User');18        await click('Email');19        await write('

Using AI Code Generation

1const { openBrowser, goto, click, closeBrowser, write, press, toRightOf, text, focus, textBox, button, link, $ } = require('taiko');2(async () => {3    try {4        await openBrowser({ headless: false });5        await write("taiko", into(textBox(toRightOf("Google Search"))));6        await press("Enter");7        await click("Taiko · Get Started with Taiko - A Node.js library for browser automation.");8        await click("Documentation");9        await click("Installation");10        await click("Install using npm");11        await focus(textBox("Search"));12        await write("git", into(textBox("Search")));13        await press("Enter");14        await click("Git - Wikipedia");15        await click("Download Git");16        await click("Windows");17        await click("Download for Windows");18        await click("Download");19        await click("Next");20        await click("Next");21        await click("Next");22        await click("Next");23        await click("Next");24        await click("Install");25        await click("Finish");26        await click("Next");27        await click("Next");28        await click("Next");29        await click("Finish");30        await click("Next");31        await click("Finish");32        await click("Next");33        await click("Next");34        await click("N

Using AI Code Generation

1const { openBrowser, goto, write, click, closeBrowser, text, $, button, below, toRightOf, into, toLeftOf, waitFor, image, focus, textBox, radioButton, link, dropDown, checkBox, evaluate, below, above, toLeftOf, toRightOf, near, intercept, rangeSlider, to, browser } = require('taiko');2(async () => {3    try {4        await openBrowser();5        await write("taiko", into(textBox({"placeholder":"Search"})));6        await click("Google Search");7        await click(link("Taiko: Test Automation for modern web apps"));8        await click("Get Started");9        await click("Install Taiko");10        await click("Install");11        await click("Try it out");12        await write("Taiko is an open source test automation framework for modern web applications.");13        await click("Run");14        await click("Next");15        await click("Next");16        await click("Ne

Using AI Code Generation

1const { openBrowser, goto, click, closeBrowser, button, textBox, write, dropDown, toRightOf, into, waitFor, $, text, focus, press, screenshot, evaluate, below, above, toLeftOf, link, toLeftOf, toRightOf, image, attach, to, intercept, clear, reload, scrollTo, scrollRight, scrollLeft, scrollUp, scrollDown, hover, highlight, doubleClick, rightClick, tap, mouseAction, $x, $i, $a, $l, $n, $t, $d, $r, $c, $s, $f, $p, $g, $h, $m, $b, $u, $v, $w, $y, $z, $o, $q, $k, $e } = require('taiko');2const assert = require("assert");3const headless = false;4const { openBrowserArgs, openBrowserConfig } = require('./taikoConfig');5(async () => {6    try {7        await openBrowser(openBrowserConfig);8        await write("Taiko");9        await press("Enter");10        await click("Taiko");11        await screenshot({ path: "taiko.png" });12        await hover("Taiko");13        await highlight("Taiko");14        await click("Taiko");15        await screenshot({ path: "taiko.png" });

Using AI Code Generation

1const { openBrowser, goto, closeBrowser, $, text, waitFor, button, click, write, into, toRightOf, focus, textBox, link, image, below, toLeftOf, $x, evaluate, reload, intercept, below, toLeftOf, toRightOf, above, screenshot } = require('taiko');2(async () => {3    try {4        await openBrowser({ headless: false });5        await click("Login");6        await write("admin", into(textBox(toRightOf("Username"))));7        await write("admin", into(textBox(toRightOf("Password"))));8        await click("Submit");9        await click("My Profile");10        await click("Edit Profile");11        await click("Update Profile");12        await click("Home");13        await click("Logout");14        await click("Login");15        await write("admin", into(textBox(toRightOf("Username"))));16        await write("admin", into(textBox(toRightOf("Password"))));17        await click("Submit");18        await click("My Profile");19        await click("Edit Profile");20        await write("admin", into(textBox(toRightOf("Username"))));21        await write("admin", into(textBox(toRightOf("Password"))));22        await write("admin", into(textBox(toRightOf("Confirm Password"))));23        await write("admin", into(textBox(toRightOf("First Name"))));24        await write("admin", into(textBox(toRightOf("Last Name"))));25        await write("admin", into(textBox(toRightOf("Email"))));26        await write("admin", into(textBox(toRightOf("Phone Number"))));27        await click("Update Profile");28        await click("Home");29        await click("Logout");30        await click("Login");31        await write("admin", into(textBox(toRightOf("Username"))));32        await write("admin", into(textBox(toRightOf("Password"))));33        await click("Submit");34        await click("My Profile");35        await click("Edit Profile");36        await write("admin", into(textBox(toRightOf("Username"))));37        await write("admin", into(textBox(toRightOf("Password"))));38        await write("admin", into(textBox(toRightOf("Confirm Password"))));39        await write("admin", into(textBox(toRightOf("First Name"))));40        await write("admin", into(textBox(toRightOf("Last Name"))));41        await write("admin

Using AI Code Generation

1const { openBrowser, goto, click, closeBrowser, screenshot, text, $, link, below, toRightOf, write, focus, toLeftOf, button, evaluate, reload, press, waitFor, textBox, into, clear, $x, doubleClick, rightClick, hover, intercept } = require('taiko');2(async () => {3    try {4        await openBrowser({ headless: false });5        await click("Login");6        await click("Email");7        await write("

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.