#set( $root = "$home$apphome/components/upload/types/dragsync")
#set($catalogid = $context.getRequestParameter("uploadcatalog"))
#set($path = "/${catalogid}/temp/uploading/${user.getUserName()}")

#set( $action = $context.getRequestParameter("action"))
#if( !$action )
#set( $action =	"/$applicationid/views/upload/finish.html" )
#end


<form name="uploadwizard" id="uploadwizard"  method="post" target="_top" action="$home$action" >

<div class="subcolumns">
	
	<div id="right-sidebar" style="padding: 0 20px 0 0">
		
		<div class="detailsbox ui-widget">
			<div class="ui-widget-header">[[Drag and Drop Below]]</div>
			<div class="ui-widget-content emrounded">
				
				<APPLET code="org.openedit.sync.DropBoxFilePickerApplet"
					width="198" height="293" MAYSCRIPT
					archive="$home/system/openedit-upload.jar?v=$context.findValue('appletserial')">
					<PARAM name="showdialog" value="false"/>
					<PARAM name="dropimagepath" value="$home$themeprefix/images/dragdropbox.jpg"/>
					<PARAM name="draglabel" value=""/>
					<PARAM name="pickerlabel" value="[[Pick Files]]"/>
					<PARAM name="bgcolor" value="$page.bgcolor"/>
				</APPLET>
				
			</div>
		</div>
		
	</div>
	<div id="main-area">
		
			
		<div class="ui-widget uipanel">
			<div  class="ui-widget-header">[[Upload Media]]</div>
			<div  class="ui-widget-content no-padding">
			 
			 <p class="hints" style="text-align: left; padding: 0 20px;" id="drag-and-drop-instructions">
			 	[[To upload multiple files, drag and drop from your computer's hard drive to the area on the left.  You can also click on]] <strong>[[Pick Files]]</strong> [[and then select multiple files by using the <strong>Shift</strong> key on your keyboard while clicking on the files you wish to upload]].
			 </p>
			 
			 
				<input type="hidden" name="catalogid" value="$!catalogid"/>
				<input type="hidden" name="searchtype" value="asset"/>
				
				<div id="enabledwithpick" style="display: none;">
					<a class="btn" href="#" onclick="document.uploadwizard.submit()">[[Upload]]</a>		
					<table id="emfilelist" class="emresultscontent">
							<!-- <tr id="tableheader">
								<th class="firstheader" ></th><th style="min-width: 150px;">File Name</th><th>Size</th><th>Description</th><th  class="lastheader" > Asset Type</th>
							</tr> -->
							<tbody>
							</tbody>
					</table>	
				</div>
				
				<!-- Fields pointing to files go here -->
				<div id="uploadforminsertionpoint" > </div>
				<input type="hidden" name="hitsname" value="hits" />
			#set( $searcher = $mediaarchive.getAssetSearcher() )
	
#set($details =  $searcher.getDetailsForView("asset/assettype/default/multipleupload", $user))
#foreach($detail in $details)
				<input type="hidden" name="field" value="$detail.id" />
#end				
			 
			</div> 
		</div>

	</div>
</div>

</form>












<script type="text/javascript">



		var oktosubmit = false;
		var queuecompleted = false;
		var idcounter = 0;
addFiles = function(innames, inlocalpaths, inparentpaths, insizes)
{
	var inserthere = jQuery("#uploadforminsertionpoint");
	//inserthere.empty();

	var names = innames.split(";");
	var localpaths = inlocalpaths.split(";");
	var parentpaths = inparentpaths.split(";");
	var sizes = insizes.split(";");
	
	for( var i=0;i<names.length;i++)
	{
		/*
		var newField = "<input type='hidden' name='localfilepath' value='" + pathsa[i] +"' />";
		inserthere.append(newField);

		var newFieldP = "<input type='hidden' name='parentpath' value='" + parentsa[i] +"' />";
		inserthere.append(newFieldP);

		var newFieldSize = "<input type='hidden' name='filesize' value='" + sizea[i] +"' />";
		inserthere.append(newFieldSize);
		*/
	    queuecompleted = false;
		try 
		{
			var link = "$root/uploadrow.html";
			//alert( "$root/uploadrow.html?id=" + idcounter + "&name=" + names[i] + "&localpath=" + localpaths[i] + "&parentpath=" + parentpaths[i] + "&size=" + sizes[i]);
			jQuery.ajax(
			{
			   type: "POST",
			   url: link,
			   async: false,
			   data: "id=" + idcounter + "&name=" + names[i] + "&localpath=" + localpaths[i] + "&parentpath=" + parentpaths[i] + "&size=" + sizes[i],
			   success: function(html)
			   {
			   		idcounter++;
					jQuery("#emfilelist > tbody:last").append(html);
					//swfu.startUpload(file.id);
					jQuery("#drag-and-drop-instructions").hide();
					jQuery("#enabledwithpick").show('fast');			   
			   }
			 });
		}
		catch (ex) 
		{
			alert( ex);
		}
	}
	if (jQuery('table#emfilelist tr[id^=row]').length>1){
		jQuery('table#emfilelist tr#row0 input').click(function(){
			if ($(this).siblings('a').length == 0){
				var field = $(this).attr("name");	
				var name = field.slice(field.indexOf(".")+1);
				//alert(name);
				var link = $(document.createElement('a'));
				$(link).addClass('btn');
				$(link).css('margin-left', '10px' );
				$(link).text("Apply to All").click(function(){
					var value = $('table#emfilelist tr input[name="' + field +'"]').val();
					var inputs = $('table#emfilelist tr input[name$="' + name +'"]');
					inputs.val(value);
				});
				$(this).after(link);
			}
					
		});
		jQuery('table#emfilelist tr#row0 select').live("change", 
			function(){
				var newclass = $(this).val();
				$(".apply-all").remove();
				var link = $(document.createElement('a'));
				$(link).addClass('btn').addClass("apply-all");
				$(link).css('margin-left', '10px' );
				$(link).text("Apply to All").click(
						function(){
						$("table#emfilelist tr#row0 select").each( function(){
							$(this).val(newclass);
							}
						)}
				);
				$(this).after(link);
				}
		);
			}
	}

function removeUpload(inId) 
		{
			jQuery("#emfilelist #row" + inId).html("");			
		}	   

function updateEpisodes(inId)
{
	//var title = jQuery("#" + inId + "titleselect").val();
	//jQuery("#" + inId + "episodeselect").load("$apphome/components/upload/types/dragsync/episodes.html?title=" + title + "&id=" + inId);
}
</script>