(function($){
	$(document).ready(function(){
		var textbox = $("#mli_text");
		textbox.keydown(function(event){
			if(event.keyCode == 32){
				textbox.self.liHandle.showtext(1);
				return false;
			}else if(event.keyCode == 13){
				textbox.self.liHandle.showtext(12);
				return false;
			}
		});
		
		var onblur = function(){
			if(textbox.self){
				var str = textbox.attr("value");
				str = parseInt(str);
				if(str>=0 && str<1000){
					textbox.self.text(str);
					textbox.self.css({color:""});
				}else{
					textbox.self.css({color:"red"});
				}
			}			
		}
		
		textbox.blur(function(){
			onblur();
			textbox.hide();
		});

		mli = function(t){		
			var l = $("<a></a>");
			var self = this;
			l.attr("href","javascript:;");
			l.click(function(event){
				self.showtext();
			});
			l.text(t);
			l.liHandle = this;
			this.id = mli.MArr.length;
			mli.MArr.push(l);
		};
		
		mli.MArr = new Array();
		
		mli.prototype.next = function(n){
			return mli.MArr[n ? ( (this.id + n) % 84 ) : this.id];
		}
		
		mli.serialize = function(){
			var rt = "";
			for(i = 0; i < mli.MArr.length-1 ; i++){
				rt += mli.MArr[i].text()+",";
			}
			rt += mli.MArr[i].text();
			return rt;
		}
		
		mli.prototype.showtext = function(n){
			onblur();
			
			var self = this.next(n);
			textbox.css(self.offset());
			textbox.attr("value",self.text());
			textbox.self = self;
			textbox.show().select().focus();
		}
				
		$("#div li").each(function(){
			
			var l = (new mli(Math.round(Math.random()*1000)+"")).next();
			$(this).text("");
			$(this).append(l);
			
		});
		
		$("#oncreate").click(function(){
			$("#imgresult").attr("src","matrix.php?mlidata="+mli.serialize()+"&type="+$("#type").attr("value"));
		});
		
		textbox.hide();

	});
})(jQuery);