KaneAI - World’s First E2E Software Testing Agent.Book a Demo Join TestMu Conference

How to use navigable method in wpt

Best JavaScript code snippet using wpt

developr.navigable.js

Source:developr.navigable.js

1/**2 *3 * '||''|.                            '||4 *  ||   ||    ....  .... ...   ....   ||    ...   ... ...  ... ..5 *  ||    || .|...||  '|.  |  .|...||  ||  .|  '|.  ||'  ||  ||' ''6 *  ||    || ||        '|.|   ||       ||  ||   ||  ||    |  ||7 * .||...|'   '|...'    '|     '|...' .||.  '|..|'  ||...'  .||.8 *                                                  ||9 * --------------- By Display:inline ------------- '''' -----------10 *11 * Navigable menus plugin12 *13 * Structural good practices from the article from Addy Osmani 'Essential jQuery plugin patterns'14 * @url http://coding.smashingmagazine.com/2011/10/11/essential-jquery-plugin-patterns/15 */16/*17 * The semi-colon before the function invocation is a safety18 * net against concatenated scripts and/or other plugins19 * that are not closed properly.20 */21;(function($, window, document)22{23	/*24	 * window and document are passed through as local variables rather than as globals, because this (slightly)25	 * quickens the resolution process and can be more efficiently minified.26	 */27		// Objects cache28	var doc = $(document),29		// Global animation switch30		animate = true;31	// Navigable menus32	doc.on('click', '.navigable li, .navigable li > span, .navigable li > a', function(event)33	{34		// Only work if the element is the event's target35		if (event.target !== this)36		{37			return;38		}39			// Clicked element40		var clicked = $(this),41			// LI element42			li = $(this).closest('li'),43			// Sub-menu44			submenu = li.children('ul:first'),45			// List of all ul above the current li46			allUL = li.parentsUntil('.navigable', 'ul'),47			// Current li ul48			parentUL = allUL.eq(0),49			// Main ul50			mainUL = allUL.eq(-1),51			// Root navigable element52			root = mainUL.closest('.navigable'),53			// Settings54			settings = $.extend({}, $.template.navigable, root.data('navigable-options')),55			// Back button56			back = root.children('.back'),57			backText,58			// Load indicator59			load = root.children('.load'),60			// Other vars61			current, url, delayedOpen, text;62		// Prepare on first call63		if (!mainUL.hasClass('fixed'))64		{65			root.height(mainUL.outerHeight(true));66			mainUL.addClass('fixed');67		}68		// Create back button if needed69		if (back.length === 0)70		{71			// Text72			text = settings.backText || '&nbsp;';73			// Create element74			back = $('<div class="back"><span class="back-arrow"></span><span class="back-text">'+text+'</span></div>').prependTo(root).click(function(event)75			{76				var current = root.data('navigableCurrent'),77					target, left, backHeight, parentLi, parentLink;78				// If no current element, we're already at the top level79				if (!current)80				{81					back.stop(true)[animate ? 'animate' : 'css']({ marginTop: -back.outerHeight()+'px' });82					return;83				}84				// Get parent target85				target = current.parent().closest('ul');86				// Check if working on the main UL87				if (target.hasClass('fixed'))88				{89					right = 0;90					backHeight = 0;91					root.removeData('navigableCurrent');92					back.stop(true)[animate ? 'animate' : 'css']({ marginTop: -back.outerHeight()+'px' });93				}94				else95				{96					right = -target.parentsUntil('.navigable', 'ul').length*100;97					backHeight = back.outerHeight();98					root.data('navigableCurrent', target);99					// Text100					if (settings.backText)101					{102						backText.text(settings.backText);103					}104					else105					{106						parentLi = target.closest('li');107						parentLink = parentLi.children('a, span').first();108						if (!parentLink.length)109						{110							parentLink = parentLi;111						}112						backText.text(parentLink.contents().filter(function(){ return(this.nodeType == 3); }).text() );113					}114				}115				// Set root element size according to target size116				root.stop(true)[animate ? 'animate' : 'css']({ height: (target.outerHeight(true)+backHeight)+'px' });117				// Move whole navigation to reveal target ul118				mainUL.stop(true)[animate ? 'animate' : 'css']({ right: right+'%' });119				// Send close event120				current.parent().closest('li').trigger('navigable-close');121			});122			// Hide it123			back.css({ marginTop: -back.outerHeight()+'px' });124		}125		// Button126		backText = back.children('.back-text');127		// If there is a load indicator on, remove it first128		if (load.length > 0)129		{130			// Currently displayed UL131			current = root.data('navigableCurrent') || mainUL;132			// Animation and callback133			mainUL.stop(true)[animate ? 'animate' : 'css']({ right: -(current.parentsUntil('.navigable', 'ul').length*100)+'%' }, 'fast');134			load.stop(true).removeData('navigable-target');135			if (animate)136			{137				load.animate({ left: '-10%' }, 'fast', function()138				{139					load.remove();140					clicked.click();141				});142				// Prevent default behavior143				event.preventDefault();144				// Done for now145				return;146			}147			else148			{149				load.remove();150			}151		}152		// If there is a submenu153		if (submenu.length > 0)154		{155			// If not ready yet156			if (parentUL.outerHeight(true) === 0 && allUL.length < 3)157			{158				// Delay action159				delayedOpen = function()160				{161					if (parentUL.outerHeight(true) > 0)162					{163						animate = false;164						clicked.click();165						animate = true;166					}167					else168					{169						setTimeout(delayedOpen, 40);170					}171				};172				setTimeout(delayedOpen, 40);173				return;174			}175			// Set as current176			root.data('navigableCurrent', submenu);177			// Hide previously open submenus178			parentUL.find('ul').hide();179			// Display parent menus180			allUL.show();181			// Display it182			submenu.show();183			// Correct position if needed184			submenu.add(allUL.not(':last')).each(function(i)185			{186				var menu = $(this),187					parent = menu.parent();188				if ($.inArray(parent.css('position'), ['relative', 'absolute']) > -1)189				{190					menu.css('top', -parent.position().top+'px');191				}192			});193			/*194			 * Animation195			 */196			// Set root element size according to target size197			root.stop(true).height(parentUL.outerHeight(true)+back.outerHeight(true))[animate ? 'animate' : 'css']({ height: (submenu.outerHeight(true)+back.outerHeight())+'px' });198			// Move whole navigation to reveal target ul199			mainUL.stop(true)[animate ? 'animate' : 'css']({ right: -(allUL.length*100)+'%' });200			// Show back button201			back[animate ? 'animate' : 'css']({ marginTop: 0 });202			backText.text(settings.backText || clicked.contents().filter(function(){ return(this.nodeType == 3); }).text() );203			// Send open event204			li.trigger('navigable-open');205			// Prevent default behavior206			event.preventDefault();207		}208		else if (clicked.hasClass('navigable-ajax'))209		{210			// Get target url211			url = clicked.is('a') ? clicked.attr('href') : clicked.data('navigable-url');212			// If valid213			if (url && typeof url === 'string' && $.trim(url).length > 0 && url.substr(0, 1) !== '#')214			{215				// Load indicator216				load = $('<div class="load" style="left: -10%"></div>').appendTo(root);217				// MÃ©morise the current element in the load indicator, so in case of concurrent loads, only the last one gets open218				load.data('navigable-target', this);219				// Move whole navigation to reveal load indicator220				mainUL.stop(true)[animate ? 'animate' : 'css']({ right: -((allUL.length-1)*100+10)+'%' });221				// Show load222				load[animate ? 'animate' : 'css']({ left: '0%' });223				// Load submenu224				$.ajax(url, {225					error: function(jqXHR, textStatus, errorThrown)226					{227						// Refresh load notification since it may have changed since the request was sent228						var load = root.children('.load'),229							current;230						// If notification system is enabled231						if (window.notify)232						{233							window.notify('Menu loading failed with the status "'+textStatus+'"');234						}235						// If related load is still here236						if (load.length > 0 && load.data('navigable-target') === clicked[0])237						{238							// Currently displayed UL239							current = root.data('navigableCurrent') || mainUL;240							// Animation and callback241							mainUL.stop(true)[animate ? 'animate' : 'css']({ right: -(current.parentsUntil('.navigable', 'ul').length*100)+'%' }, 'fast');242							load.stop(true).removeData('navigable-target');243							if (animate)244							{245								load.animate({ left: '-10%' }, 'fast', function()246								{247									// Remove load, not needed anymore248									load.remove();249								});250							}251							else252							{253								load.remove();254							}255						}256					},257					success: function(data, textStatus, jqXHR)258					{259						// Refresh load notification since it may have changed since the request was sent260						var load = root.children('.load');261						// Remove ajax marker, mark as loaded262						clicked.removeClass('navigable-ajax').addClass('navigable-ajax-loaded');263						// Append data264						li.append(data);265						// If related load is still here266						if (load.length > 0 && load.data('navigable-target') === clicked[0])267						{268							// Remove load, not needed anymore269							load.remove();270							// Finally open the clicked element271							clicked.click();272						}273					}274				});275				// Prevent default behavior276				event.preventDefault();277			}278		}279		else if (clicked.hasClass('navigable-ajax-loaded'))280		{281			// Probably an ajax menu who loaded nothing, prevent default behavior282			event.preventDefault();283		}284	});285	/**286	 * Reset navigable position to main menu287	 */288	$.fn.navigableReset = function()289	{290		this.filter('.navigable').each( function(i)291		{292				// Navigable element293			var root = $(this),294				// Back button295				back = root.children('.back');296				// If valid297				if (back.length > 0)298				{299					while (root.data('navigableCurrent'))300					{301						back.click();302					}303				}304		});305		return this;306	};307	// Add to template setup function308	$.template.addSetupFunction(function(self, children)309	{310		// Current open menu element311		this.findIn(self, children, '.navigable-current').each(function(i)312		{313			var closest = $(this).closest('ul').closest('li, .navigable'),314				child;315			// Check if in a submenu316			if (closest.length > 0 && !closest.hasClass('navigable'))317			{318				// Disable animation319				animate = false;320				// Is there a span or a link?321				child = closest.children('a, span').first();322				if (child.length > 0)323				{324					child.click();325				}326				else327				{328					closest.click();329				}330				// Enable animation331				animate = true;332			}333		});334		return this;335	});336	/**337	 * Navigable menu defaults338	 * @var object339	 */340	$.template.navigable = {341		/**342		 * Text of the back button, or false to use the parent element's text343		 * @var string|boolean344		 */345		backText: false346	};...

Using AI Code Generation

1var wptools = require('wptools');2var page = wptools.page('Sachin Tendulkar');3page.get(function(err, resp) {4  if (err) {5    console.log(err);6  } else {7    resp.data.navigable(function(err, resp) {8      if (err) {9        console.log(err);10      } else {11        console.log(resp);12      }13    });14  }15});16{ 'Sachin Tendulkar': 17   { name: 'Sachin Tendulkar',

Using AI Code Generation

1    if (err) {2        console.log(err);3    } else {4        console.log(navigable);5    }6});7    .then(function (navigable) {8        console.log(navigable);9    })10    .catch(function (err) {11        console.log(err);12    });13{14}15{16}

Using AI Code Generation

1var toolkit = require('wptoolkit');2var wp = new toolkit();3  if (err) {4    console.log('error: ', err);5  }6  console.log('result: ', res);7});8var toolkit = require('wptoolkit');9var wp = new toolkit();10  if (err) {11    console.log('error: ', err);12  }13  console.log('result: ', res);14});15var toolkit = require('wptoolkit');16var wp = new toolkit();17  if (err) {18    console.log('error: ', err);19  }20  console.log('result: ', res);21});22var toolkit = require('wptoolkit');23var wp = new toolkit();24  if (err) {25    console.log('error: ', err);26  }27  console.log('result: ', res);28});29var toolkit = require('wptoolkit');30var wp = new toolkit();31  if (err) {32    console.log('error: ', err);33  }34  console.log('result: ', res);35});36var toolkit = require('wptoolkit');37var wp = new toolkit();38  if (err) {39    console.log('error: ', err);40  }41  console.log('result: ', res);42});43var toolkit = require('wptoolkit');44var wp = new toolkit();45wp.navigable('http

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.