Login   Register  
PHP Classes
elePHPant
Icontem

File: area_edit.js

Recommend this page to a friend!
Stumble It! Stumble It! Bookmark in del.icio.us Bookmark in del.icio.us
  Classes of JImmy Bo  >  Weller MUD Area Loader  >  area_edit.js  >  Download  
File: area_edit.js
Role: Auxiliary data
Content type: text/plain
Description: Example Area Editor :: Javascript
Class: Weller MUD Area Loader
Parse and manipulate Weller MUD map area files
Author: By
Last change: Object Editor added
Date: 2013-10-23 21:02
Size: 16,189 bytes
 

Contents

Class file image Download
/*

	// EXAMPLE USAGE of [class.weller.mud.php] and [class.weller.mud.render.php]

	// usage: Just RUN THIS FILE after generating a mud directory with [class.load.rom.area.php] or similar area to [weller mud area format] script
	
		Related:
		PHP Class :: MUDs :: Multi User Dungeons :: Multi User Dimensions :: MMORPG :: Internet Games :: RPG :: Role Playing Game 
		Simulation :: Game Development :: World :: Universe
		
		find this and other classes by this author at:
		http://www.phpclasses.org/browse/author/144301.html
		
		you can find [class.load.rom.area.php] here:
		http://www.phpclasses.org/package/8282-PHP-Load-ROM-MUD-area-map-files-into-arrays.html

*/

			// CONSTANTS //
			var CONST_ROOMDIV = $('.rooms');
			var CONST_EXITSDIV = $('.exit_data');
			
			// GLOBALS //
			var global_curRoom = '-1';
			var global_exitData = '';
			
			// BEGIN FUNCTIONS
			// BEGIN FUNCTIONS
			// BEGIN FUNCTIONS
			
			function select_area(whichArea, whichRoom) 
			{
				// whichRoom is optional
			
				url = 'area_edit.php';
				url += '?&cmd=select_area';
			
				$.ajax({
					type: "POST",
					url: url,
					data: { area: whichArea },
					dataType: "json"
				
				}).done(function( msg ) {
					// console.log(msg);
					jQuery.each(msg.command, function(index, item) {
						// do something with `item` (or `this` is also `item` if you like)
						console.log(item);
						
						switch(item) // item is command
						{
							case 'redraw_rooms':
									CONST_ROOMDIV.html(msg.rooms_html);
									CONST_EXITSDIV.html(msg.rooms_html);
									
									global_exitData = msg.exits_json;
								break;
							
							case 'reset_current_room':
									if(!whichRoom)
									{
										var vnum = msg.first_room;
										
										console.log('attempting to set current room: '+vnum);
										console.log($('.' + vnum));
										$('.' + vnum).addClass('edit');
										
										console.log('setting exits...');
										console.log(msg);
										
										global_curRoom = vnum;
										set_exits();
									}
									else
									{
										change_room(whichRoom, false);
									}
								break;
							
						}
					});					
				}); /* END - ajax to handle area select */
				
			} // end function select_area
			
			
			
			
			
			function set_exits()	// sets exit buttons to current room
			{

				var exits = global_exitData[global_curRoom];

				$(function() {
				  // Handler for .ready() called.
					// first clear old data
					$( ".navigate .n" ).attr('toRoom','');
					$( ".navigate .e" ).attr('toRoom','');
					$( ".navigate .s" ).attr('toRoom','');
					$( ".navigate .w" ).attr('toRoom','');
					
					$( ".navigate .n" ).hide();
					$( ".navigate .e" ).hide();
					$( ".navigate .s" ).hide();
					$( ".navigate .w" ).hide();


					// now get exits for current room...
					console.log('js :: function set_exits()');
					
					if(typeof exits.south !== 'undefined')
					{
						var thisExit 		= $( ".navigate .s" );
						var thisExitData 	= exits.south;
						var thisDir 		= 's';
						
						/* bring more in line with exit handler */
						thisExit.attr('to', thisExitData["to"]);
						thisExit.attr('dir', thisDir);
						
						if(thisExitData["command"] == 'change-area')
							thisExit.addClass('change-area');
						else
							thisExit.removeClass('change-area');
						
						if( thisExitData["area-name"]  )
							thisExit.attr('area', thisExitData["area-name"]);
												
						thisExit.show();
					}
					
					if(typeof exits.north !== 'undefined')
					{
						var thisExit 		= $( ".navigate .n" );
						var thisExitData 	= exits.north;
						var thisDir 		= 'n';
						
						/* bring more in line with exit handler */
						thisExit.attr('to', thisExitData["to"]);
						thisExit.attr('dir', thisDir);
						
						if(thisExitData["command"] == 'change-area')
							thisExit.addClass('change-area');
						else
							thisExit.removeClass('change-area');
						
						if( thisExitData["area-name"]  )
							thisExit.attr('area', thisExitData["area-name"]);
												
						thisExit.show();
					}
					if(typeof exits.east !== 'undefined')
					{
						var thisExit 		= $( ".navigate .e" );
						var thisExitData 	= exits.east;
						var thisDir 		= 'e';
						
						/* bring more in line with exit handler */
						thisExit.attr('to', thisExitData["to"]);
						thisExit.attr('dir', thisDir);
						
						if(thisExitData["command"] == 'change-area')
							thisExit.addClass('change-area');
						else
							thisExit.removeClass('change-area');
						
						if( thisExitData["area-name"]  )
							thisExit.attr('area', thisExitData["area-name"]);
												
						thisExit.show();
					}
					if(typeof exits.west !== 'undefined')
					{
						var thisExit 		= $( ".navigate .w" );
						var thisExitData 	= exits.west;
						var thisDir 		= 'w';
						
						/* bring more in line with exit handler */
						thisExit.attr('to', thisExitData["to"]);
						thisExit.attr('dir', thisDir);
						
						if(thisExitData["command"] == 'change-area')
							thisExit.addClass('change-area');
						else
							thisExit.removeClass('change-area');
						
						if( thisExitData["area-name"]  )
							thisExit.attr('area', thisExitData["area-name"]);
												
						thisExit.show();
					}
					
				});
				
			} // END function set_exits
			
			
			
			
			
			function change_room(whatRoom, whatDir)
			{
				var old_room = global_curRoom;
				var new_room = whatRoom;
				
				// check for existing room  - prevent going out of bounds (eg room that exists in another area) //
				var new_div = $("." + new_room);
				if ( !new_div.length )
					return false;
				var old_div = $('.' + old_room);
				
				
				var min_x = 0 - new_div.width();
				var min_y = 0 - new_div.height();
				var max_x = screen.width + new_div.width();
				var max_y = screen.height + new_div.height();
				
				var reset_x = '50%';
				var reset_y = '50%';
				
				var move_speed = 200;
				
				var oldpos = old_div.offset(); // oldpos.top , etc
				
				
				switch(whatDir)
				{
					// animate the navigation arrows... 
					case 'n':
					case 'north':

						$(function() {
						  // Handler for .ready() called.
						  
							old_div.animate({
								top: max_y
							}, move_speed, function() {
								// Animation complete.

								// swap out classes and reset div //
								old_div.removeClass('edit');
								
								
								old_div.css('top', reset_y);
								old_div.css('left', min_x);
								
								new_div.css('top', min_y); // swaparoo
								new_div.css('left', reset_x); // swaparoo
								
								new_div.addClass('edit');
								
								new_div.animate({
									top: ($( window ).height() / 2)
								}, move_speed, function() {
									// Animation complete.
									new_div.css('top', reset_y);
								}); // end animate

								
							}); // end animate
						});
					

					
					break; // END - n
					
					case 's':
					case 'south':
					
					
						$(function() {
						  // Handler for .ready() called.
						  
							old_div.animate({
								top: min_y
							}, move_speed, function() {
								// Animation complete.

								// swap out classes and reset div //
								old_div.removeClass('edit');
								
								// stays same - place all old divs in old div storage land
								old_div.css('top', reset_y);
								old_div.css('left', min_x);
								
								new_div.css('top', max_y); // swaparoo - opposite of initial movement
								new_div.css('left', reset_x); // swaparoo - make sure it's reset first
								
								new_div.addClass('edit');
								
								new_div.animate({
									top: ($( window ).height() / 2)
								}, move_speed, function() {
									// Animation complete.
									new_div.css('top', reset_y);
								}); // end animate

								
							}); // end animate
						});
					

					break; // END - s
					
					case 'w':
					case 'west':
						$(function() {
						  // Handler for .ready() called.
						  
							old_div.animate({
								left: max_x
							}, move_speed, function() {
								// Animation complete.

								// swap out classes and reset div //
								old_div.removeClass('edit');

								// reset to old position 
								old_div.css('left', min_x);
								old_div.css('top', reset_y);
								
								
								new_div.css('left', min_x); // swaparoo

								new_div.addClass('edit');
								
								new_div.animate({
									left: ($( window ).width() / 2)
								}, move_speed, function() {
									// Animation complete.
									new_div.css('left', reset_x);
								}); // end animate

								
							}); // end animate
						});
						
					break; // END - e


					case 'e':
					case 'east':
						$(function() {
						  // Handler for .ready() called.
						  
							old_div.animate({
								left: min_x
							}, move_speed, function() {
								// Animation complete.

								// swap out classes and reset div //
								old_div.removeClass('edit');
								
								// reset to old position 
								old_div.css('left', min_x);
								old_div.css('top', reset_y);
								
								new_div.css('left', max_x); // swaparoo

								new_div.addClass('edit');
								
								new_div.animate({
									left: ($( window ).width() / 2)
								}, move_speed, function() {
									// Animation complete.
									new_div.css('left', reset_x);
								}); // end animate

								
							}); // end animate
						});
						
					break; // END - n
					
					default:
						old_div.removeClass('edit');
					
						// reset to old 
						old_div.css('left', min_x);
						old_div.css('top', reset_y);
						
						new_div.addClass('edit');
						new_div.css('left', reset_x);
						new_div.css('top', reset_y);
					break;  // END - n // just swap - other
				}
				
				global_curRoom = new_room;
				set_exits();
			
			} // END function change_room(whatRoom)
			
			// END FUNCTIONS
			// END FUNCTIONS
			// END FUNCTIONS
			









function show_mob_list_area(area_name)
{
	var writeDiv = $('.menu-mob-list');

	var url =  'area_edit.php';
	    url += '?&cmd=select_mob_list_area&area_name='+area_name;
	

	$.post( url, { area_name: area_name })
	  .done(function( data ) {
		console.log('loading mob list dropdown : ' + area_name);
		console.log(data);
		 writeDiv.html(data);
	  });
  
} // END ::  show_mob_editor(mob_vnum, area_name)			



function show_obj_list_area(area_name)
{
	var writeDiv = $('.menu-obj-list');

	var url =  'area_edit.php';
	    url += '?&cmd=select_obj_list_area&area_name='+area_name;
	

	$.post( url, { area_name: area_name })
	  .done(function( data ) {
		console.log('loading obj list dropdown : ' + area_name);
		console.log(data);
		 writeDiv.html(data);
	  });
  
} // END ::  show_mob_editor(mob_vnum, area_name)			







			
			
			$(function() {
				// Handler for .ready() called.

				// handle updating elements //
				$( ".myAreaList" ).change(function() {
					that = $(this);
					console.log(that.val());
					
					select_area(that.val()); // select target area
					
					show_mob_list_area(that.val()); // show select combobox populated with mobs from this area
					show_obj_list_area(that.val());
					
					hide_mob_editor(); // reset mob editor
				});





				$( ".mob-list-area" ).live( "change", function() {
					var that = $(this);
					console.log(that.val());
					console.log(that.attr('area-name'));
					show_mob_editor(that.val(), that.attr('area-name'));
				});
				

				$( ".obj-list-area" ).live( "change", function() {
					var that = $(this);
					console.log(that.val());
					console.log(that.attr('area-name'));
					show_obj_editor(that.val(), that.attr('area-name'));
				});
				





				$( ".exit" ).live( "click", function() {
					console.log($(this));
					change_room($(this).attr('to'), $(this).attr('dir'));
				});
				
				
				$(".exit.change-area").live( "click", function() {
					select_area( $(this).attr('area'), $(this).attr('to') );
					// change_room($(this).attr('to'), false);
					
				});
				
				
				
				// handle editing
				
				
						
			});
			
			
			
			
			
			
			
			
			
			
			





































			
			
			
			
			
			
			
			
			
/* Handle MOB edit */
function hide_mob_editor()
{
	$('.mob-editor').addClass('hide');
}

function show_mob_editor(mob_vnum, area_name)
{
	var editorDiv = $('.mob-editor');

	var url =  'area_edit.php';
	    url += '?&cmd=edit_mob';
	
			
				$.ajax({
					type: "POST",
					url: url,
					data: { mob_vnum: mob_vnum , area: area_name },
					dataType: "json"
				
				}).done(function( msg ) {
					// console.log(msg);
					jQuery.each(msg.command, function(index, item) {
						// do something with `item` (or `this` is also `item` if you like)
						console.log(item);
						
						switch(item) // item is command
						{
							case 'write':	
									var theContent 	= msg.content;
									var theDiv		= $(msg.targetDiv);
									theDiv.html(theContent);
									// console.log(theDiv);
									// console.log(theContent);
								break;
													
						} // end -- switch
						
					}); // end $.each					
					
				}); /* END - ajax to handle area select */
				
				$('.mob-editor').removeClass('hide');
} // END ::  show_mob_editor(mob_vnum, area_name)			
			
			
			
			

			$(function() {
			  // Handler for .ready() called.
				
				// hide mob editor window //
				hide_mob_editor();
				
				$(".mob").live( "click", function() {
					// code here
					that = $(this);
					console.log(that.attr('vnum'));
					console.log(that.attr('area'));
					show_mob_editor(that.attr('vnum'), that.attr('area'));
				});


				$( ".mob-editor .close" ).click(function() {
					console.log('hiding');
					hide_mob_editor();
				});


						
			});
						
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
/* Handle OBJ edit */
function hide_obj_editor()
{
	$('.obj-editor').addClass('hide');
}

function show_obj_editor(obj_vnum, area_name)
{
	var editorDiv = $('.obj-editor');

	var url =  'area_edit.php';
	    url += '?&cmd=edit_obj';
	
			
				$.ajax({
					type: "POST",
					url: url,
					data: { obj_vnum: obj_vnum , area: area_name },
					dataType: "json"
				
				}).done(function( msg ) {
					// console.log(msg);
					jQuery.each(msg.command, function(index, item) {
						// do something with `item` (or `this` is also `item` if you like)
						console.log(item);
						
						switch(item) // item is command
						{
							case 'write':	
									var theContent 	= msg.content;
									var theDiv		= $(msg.targetDiv);
									theDiv.html(theContent);
									// console.log(theDiv);
									// console.log(theContent);
								break;
													
						} // end -- switch
						
					}); // end $.each					
					
				}); /* END - ajax to handle area select */
				
				editorDiv.removeClass('hide');
} // END ::  show_mob_editor(mob_vnum, area_name)			
			
			
			
			

			$(function() {
			  // Handler for .ready() called.
				
				// hide mob editor window //
				hide_obj_editor();
				
				$(".obj").live( "click", function() {
					// code here
					that = $(this);
					console.log(that.attr('vnum'));
					console.log(that.attr('area'));
					show_mob_editor(that.attr('vnum'), that.attr('area'));
				});


				$( ".obj-editor .close" ).click(function() {
					console.log('hiding');
					hide_obj_editor();
				});


						
			});