var page5 = Class.create(abstractOrderPage, {
		
		initialize: function($super, container, controller){
			$super(container, controller);
			this.instID = 'page5.' + parseInt(Math.random()*1000000);
		},
		
		start:function(){
			var wpsRPC = new wps.rpc;
			wpsRPC.debug=true;
			wpsRPC.createCall('order', this.drawSortable.bind(this));
			wpsRPC.call('getOrderJSON', 'orderID='+this.controller.orderID);			
		},
		
		drawSortable : function(req){
			if (!this.imageContainer){
				this.imageContainer = new Element('div', {className:'sortableContainer', id:this.instID+"_sortables"});
				$('sortable').insert(this.imageContainer);
			}
			this.imageContainer.update('');
			
			var images = req.responseJSON.media;
			var i = 1;
			var y = 0;
			$A(images).each(
				(function(img){
					var div = new Element('div', {className:'sortableDiv'});
					var span = new Element('span', {className:'sortableNumber', id:img.id+'_number'}).update(i);
					div.insert(span);
					if ( (img.file.toLowerCase().indexOf('jpg') > -1) || (img.file.toLowerCase().indexOf('jpeg') > -1) ){
						var elem = new Element('img', {className:'sortableImg', src:'/include/lib/makeThumb.php?height=100&id='+img.id+"&orderID=" + this.controller.orderID,id:"sortable_"+img.id});
					}else{
						var elem = new Element('img', {src:'/images/video.png' ,id:"sortable_"+img.id});
					}
					div.insert(elem);
					elem.metaData = img;
					div.metaData = img;
					this.imageContainer.insert(div);
					i++;
					y++;
					if (y == 7){
//						this.imageContainer.insert('<br style="clear:both"/>');
						y = 0;
					}
					
				}).bind(this)
			)
			
			Sortable.create(
				this.instID + "_sortables",
				{
					tag:'div',
					only:'sortableDiv', 
					onChange : this.setSorted.bind(this)
				}
			)
		},
		
		setSorted : function(){
			var i = 1;
			$$('.sortableDiv').each(
					function(img){
						$(img.metaData.id+'_number').update(i);
						i++;
					}
				)
		},
		
		save : function(callBack){
			// loop through images:
			var i = 1;
			var args = '';
			
			var wpsRPC = new wps.rpc;
			wpsRPC.debug=true;
			wpsRPC.createCall('order', callBack);

			$A($(this.instID+"_sortables").childNodes).each(
				function(img){
					wpsRPC.addArgument(img.metaData.id, (i*1000));
					i++;
				}
			)
			wpsRPC.call('updateMediaSortorder');

			var wpsRPC = new wps.rpc;
			wpsRPC.debug=true;
			wpsRPC.createCall('order', function(){});
			wpsRPC.call('updateOrder', 'orderID='+this.controller.orderID, 'ORDER_page_index='+ (this.controller.pageIdx));			
			
			
		}

	})