/*
	 *
	 *	jquery sliding menu plugin
	 *	mobile app list-style navigation in the browser
	 *
	 *	written by ali zahid
	 *	http://designplox.com/jquery-sliding-menu
	 *
	 */

(function($)
{
	var usedids = [];

	$.fn.menu = function(options)
	{
		var selector = this.selector;

		var settings = $.extend(
		{
			datajson: false,
			backlabel: 'back'

		}, options);

		return this.each(function()
		{
			var self = this,
				menu = $(self),
				data;

			if (menu.hasclass('sliding-menu'))
			{
				return;
			}

			var menuwidth = menu.width();

			if (settings.datajson)
			{
				data = processjson(settings.datajson);
			}
			else
			{
				data = process(menu);
			}

			menu.empty().addclass('sliding-menu');

			var rootpanel;

			if (settings.datajson)
			{
				$(data).each(function(index, item)
				{
					var panel = $('<ul></ul>');

					if (item.root)
					{
						rootpanel = '#' + item.id;
					}

					panel.attr('id', item.id);
					panel.addclass('menu-panel');
					panel.width(menuwidth);

					$(item.children).each(function(index, item)
					{
						var link = $('<a></a>');

						link.attr('class', item.styleclass);
						link.attr('href', item.href);
						link.text(item.label);

						var li = $('<li></li>');

						li.append(link);

						panel.append(li);

					});

					menu.append(panel);

				});
			}
			else
			{
				$(data).each(function(index, item)
				{
					var panel = $(item);

					if (panel.hasclass('menu-panel-root'))
					{
						rootpanel = '#' + panel.attr('id');
					}

					panel.width(menuwidth);

					menu.append(item);

				});
			}

			rootpanel = $(rootpanel);
			rootpanel.addclass('menu-panel-root');

			var currentpanel = rootpanel;

			menu.height(rootpanel.height());

			var wrapper = $('<div></div>').addclass('sliding-menu-wrapper').width(data.length * menuwidth);

			menu.wrapinner(wrapper);

			wrapper = $('.sliding-menu-wrapper', menu);

			$('a', self).on('click', function(e)
			{
				var href = $(this).attr('href'),
					label = $(this).text();

				if (href == '#')
				{
					e.preventdefault();
				}
				else if (href.indexof('#menu-panel') == 0)
				{
					var target = $(href),
						isback = $(this).hasclass('back'),
						marginleft = parseint(wrapper.css('margin-left'));

					if (isback)
					{
						if (href == '#menu-panel-back')
						{
							target = currentpanel.prev();
						}

						wrapper.animate(
						{
							marginleft: marginleft + menuwidth

						}, 'fast');
					}
					else
					{
						target.insertafter(currentpanel);

						if (settings.backlabel === true)
						{
							$('.back', target).text(label);
						}
						else
						{
							$('.back', target).text(settings.backlabel);
						}

						wrapper.animate(
						{
							marginleft: marginleft - menuwidth

						}, 'fast');
					}

					currentpanel = target;

					menu.animate(
					{
						height: target.height()

					}, 'fast');

					e.preventdefault();
				}

			});

			return this;

		});

		function process(data)
		{
			var ul = $('ul', data),
				panels = [];

			$(ul).each(function(index, item)
			{
				var panel = $(item),
					handler = panel.prev(),
					id = getnewid();

				if (handler.length == 1)
				{
					handler.addclass('nav').attr('href', '#menu-panel-' + id);
				}

				panel.attr('id', 'menu-panel-' + id);

				if (index == 0)
				{
					panel.addclass('menu-panel-root');
				}
				else
				{
					panel.addclass('menu-panel');

					var li = $('<li></li>'),
						back = $('<a></a>').addclass('back').attr('href', '#menu-panel-back');

					panel.prepend(back);
				}

				panels.push(item);

			});

			return panels;
		}

		function processjson(data, parent)
		{
			var root = { id: 'menu-panel-' + getnewid(), children: [], root: (parent ? false : true) },
				panels = [];

			if (parent)
			{
				root.children.push(
				{
					styleclass: 'back',
					href: '#' + parent.id

				});
			}

			$(data).each(function(index, item)
			{
				root.children.push(item);

				if (item.children)
				{
					var panel = processjson(item.children, root);

					item.href = '#' + panel[0].id;
					item.styleclass = 'nav';

					panels = panels.concat(panel);
				}

			});

			return [root].concat(panels);
		}

		function getnewid()
		{
			var id;

			do
			{
				id = math.random().tostring(36).substring(3, 8);
			}
			while (usedids.indexof(id) >= 0);

			usedids.push(id);

			return id;
		}

	};

} (jquery));