Javascript - Assigning seperate links to a slide of products menu

User Tag List

Results 1 to 1 of 1
  1. #1
    Puff's Avatar Member
    Reputation
    655
    Join Date
    Jul 2007
    Posts
    700
    Thanks G/R
    0/0
    Trade Feedback
    0 (0%)
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Javascript - Assigning seperate links to a slide of products

    Hi there,

    I really have no knowledge of javascript what so ever, I will try and be as helpful as I can with any information you need but I am in real need of help! My friend designed me a webpage and it so you know the jist of things, it's for server hosting of the game Minecraft.

    Now the webpage as a slider on it where the customer can choose what "package" they want to buy. So theres a starter, advanced, expert package and so on. Then whatever one they are on theres an "Order Now" button.

    yet the only link is the order now button so theres surely no point of the customer choosing what package they want.

    I have the javascript code here if it makes any sense to anyone that would be awesome.

    Code:
    function log(data)
    {
    	if(window.console != undefined)
    		console.log(data);
    }
    
    (function($) {
    
    	var packagesData = Array();
    	packagesData.push({
    		name:	'Starter',
    		maxSlots:	6,
    		ram:	'192 MB',
    		bukkit:	true,
    		panel:	true,
    		web:	true,
    		price:	'$5.95 USD',
    	});
    	packagesData.push({
    		name:	'Public',
    		maxSlots:	12,
    		ram:	'384 MB',
    		bukkit:	true,
    		panel:	true,
    		web:	true,
    		price:	'$11.95 USD',
    	});
    	packagesData.push({
    		name:	'Pro',
    		maxSlots:	18,
    		ram:	'576 MB',
    		bukkit:	true,
    		panel:	true,
    		web:	true,
    		price:	'$17.95 USD'
    	});
    	packagesData.push({
    		name:	'Expert',
    		maxSlots:	24,
    		ram:	'768 MB',
    		bukkit:	true,
    		panel:	true,
    		web:	true,
    		price:	'$23.95 USD'
    	});
    	packagesData.push({
    		name:	'Diamond',
    		maxSlots:	32,
    		ram:	'1024 MB',
    		bukkit:	true,
    		panel:	true,
    		web:	true,
    		price:	'$30.95 USD'
    	});
    	packagesData.push({
    		name:	'Prestige',
    		maxSlots:	64,
    		ram:	'2048 MB',
    		bukkit:	true,
    		panel:	true,
    		web:	true,
    		price:	'$62.95 USD'
    	});
    
    	$.slotSlider = function(settings)
    	{
    		$.slotSlider.init(settings);
    	}
    	$.extend($.slotSlider,{
    
    		settings:{
    			defaultBocks:6,
    			planHeight:34,
    			cubeXstep:30,
    			cubeYstep:15,
    			sliderDelay:20
    		},
    		selectors:{
    			container:'#slotSlider',
    			slider:'.slider',
    			cubes:'#slotCubes',
    			packagesTable:'.package',
    			packageName:'.arrows span b',
    			arrows:'.arrows a',
    			slotsNumber:'.slots span'
    		},
    		cubesMatrix:Array(
    			{x:3, y:0},{x:2, y:1},{x:4, y:1},{x:3, y:2},
    			{x:1, y:2},{x:5, y:2},{x:2, y:3},{x:4, y:3},
    			{x:3, y:4},{x:0, y:3},{x:6, y:3},{x:1, y:4},
    			{x:5, y:4},{x:2, y:5},{x:4, y:5},{x:3, y:6}
    		),
    
    		init:function(opts)
    		{
    			$.extend(this.settings, opts || {});
    
    			var settings = this.settings;
    			var selectors = this.selectors;
    			var $container = $(this.selectors.container);
    			var $table = $container.find(this.selectors.packagesTable);
    			
    			var $slider = $container.find(this.selectors.slider).slider
    			({
    				min:1,
    				max:64,
    				slide:slide,
    				stop:stop
    			});
    			function slide(event, ui)
    			{
    				ui.handle.blur();
    				setCubes(ui.value);
    
    				var i = 0;
    				for(i in packagesData)
    				{
    					var data = packagesData[i];
    					if(data.maxSlots >= ui.value)
    						break;
    				}
    				setPackageData(i);
    			}
    			function stop(event, ui)
    			{
    				ui.handle.blur();
    			}
    
    			var $cubesContainer = $(this.selectors.cubes);
    			var cubesMatrix = this.cubesMatrix;
    			var plans = Array;
    			for(var i = 0; i < 4; i ++)
    			{
    				var $plan = $('<div/>').appendTo($cubesContainer);
    				$plan.css({top:(3 - i) * this.settings.planHeight});
    				plans[i] = $plan;
    				createPlan($plan);
    			}
    			function createPlan($plan)
    			{
    				for(var i in cubesMatrix)
    				{
    					var $cube = $('<div/>').appendTo($plan);
    					var cubeCoords = cubesMatrix[i];
    					var xPos = cubeCoords.x * settings.cubeXstep;
    					var yPos = cubeCoords.y * settings.cubeYstep;
    					$cube.css({left:xPos,top:yPos});
    				}
    			}
    
    			//setCubes(1);
    			setPackageData(0, true);
    
    			function setCubes(cubes)
    			{
    				$table.find(selectors.slotsNumber).text(cubes);
    
    				var completePlans = Math.floor(cubes / 16);
    
    				var lastCube = false;
    				for(var i in plans)
    				{
    					var $plan = plans[i];
    					var $cubes = $plan.find('div');
    
    					if(i < completePlans)
    						$cubes.show();
    					else
    					{
    						if(lastCube)
    						{
    							$cubes.hide();
    							continue;
    						}
    						var rest = cubes % 16;
    						$cubes.each(function(i, cube)
    						{
    							var $cube = $(cube);
    							if(i < rest)
    								$cube.show();
    							else
    								$cube.hide();
    						});
    						lastCube = true;
    					}
    				}
    			}
    
    			var currentPackage = 0;
    			$container.find(selectors.arrows).click(selectPackage);
    			function selectPackage(event)
    			{
    				event.preventDefault();
    
    				var $arrow = $(this);
    				if($arrow.hasClass('left'))
    				{
    					if(currentPackage > 0)
    						setPackageData(parseInt(currentPackage) - 1, true);
    				}
    				else if($arrow.hasClass('right'))
    				{
    					if(currentPackage < packagesData.length - 1)
    						setPackageData(parseInt(currentPackage) + 1, true);
    				}
    			}
    
    			var sliderDest;
    			/*
    			 *  name:	'Wood',
    				maxSlots:	6,
    				ram:	'192 MB',
    				bukkit:	true,
    				panel:	true,
    				web:	true,
    				price:	'$5.95 USD'
    			 */
    			function setPackageData(index, snapToMax)
    			{
    				currentPackage = index;
    				var data = packagesData[index];
    				for(var i in data)
    				{
    					var value = data[i];
    					var $li = $table.find('.' + i);
    					if($li.size() > 0)
    					{
    						var $span = $li.find('span');
    						if($li.hasClass('bool'))
    						{
    							var $img = $span.find('img');
    							if(value)
    								$img.attr('src','../images/check.png');
    							else
    								$img.attr('src','../images/check.png');
    						}
    						else
    							$span.text(value);
    					}
    				}
    				var $packageName = $container.find(selectors.packageName);
    				$packageName.text(data.name);
    
    				if(snapToMax)
    				{
    					sliderDest = data.maxSlots;
    					moveSlider();
    				}
    			}
    
    			function moveSlider()
    			{
    				var currValue = $slider.slider('value');
    				var dir = 0;
    				if(sliderDest > currValue)
    					dir = 1;
    				else if(sliderDest < currValue)
    					dir = -1;
    
    				if(dir != 0)
    				{
    					setTimeout(function()
    					{
    						$slider.slider('value', currValue + dir);
    						setCubes(currValue + dir);
    						moveSlider();
    					},
    					settings.sliderDelay);
    				}
    			}
    		}
    	});
    
    })(jQuery);
    This is where I can change the values of the products I know that would be awesome if it could work so it could go to seperate destinations.

    If any more information is needed just ask, I'll be as helpful as I can just in such a pickle!

    Thank you so much!
    Art
    Last edited by Puff; 04-29-2011 at 08:18 AM.

    Art

    Javascript - Assigning seperate links to a slide of products

Similar Threads

  1. Joana video link
    By Dok-121 in forum World of Warcraft General
    Replies: 5
    Last Post: 11-20-2006, 07:39 AM
  2. Nothing big, MWS color with link
    By Piratewolf in forum World of Warcraft Model Editing
    Replies: 5
    Last Post: 08-24-2006, 08:14 PM
  3. Seperate sections for forums
    By mlb553 in forum Suggestions
    Replies: 6
    Last Post: 08-09-2006, 02:05 AM
  4. anybody got links for Emu?
    By Krazzee in forum World of Warcraft General
    Replies: 4
    Last Post: 06-10-2006, 04:49 PM
  5. [Exploit] Warlock: Soul Linked Pets take no damage
    By Matt in forum World of Warcraft Exploits
    Replies: 3
    Last Post: 05-09-2006, 12:01 PM
All times are GMT -5. The time now is 10:07 PM. Powered by vBulletin® Version 4.2.3
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved. User Alert System provided by Advanced User Tagging (Pro) - vBulletin Mods & Addons Copyright © 2025 DragonByte Technologies Ltd.
Google Authenticator verification provided by Two-Factor Authentication (Free) - vBulletin Mods & Addons Copyright © 2025 DragonByte Technologies Ltd.
Digital Point modules: Sphinx-based search