Find the bug...

CaptainComedy · 22 Sep 2009 at 12:18

Hi guys, (forgot to say this is a php/javascript problem)

I have an audio uploading script so users can upload to my amazon s3 bucket. But some users are reporting that they can't upload (it just goes through the process but uploads nothing)

I cant see anything in the php that should cause an issue but in opera I'm finding that I get graphical errors (things not displaying) when using it

does anyone have any javascript software or php software that can help identify a problem when the script fails?

and can anyone see any problems with the following javascript function:

PHP:

var initBandTrackSubmit=function()
	{
	var A=$("addbandtrack");
	var C=$("bandtrack");
	var D=$("bandtracksubmit");
	var B=function()
		{
		$D.setStyle("bandtracktitle_error","display","none");
		$D.setStyle("bandtrackfile_error","display","none");
		var E=true;
		if($("bandtracktitle").value=="")
			{
			$D.setStyle("bandtracktitle_error","display","block");
			E=false
			}
		if(($("bandtrackfile").value=="")||($("bandtrackfile").value.lastIndexOf(".mp3")==-1)&&($("bandtrackfile").value.lastIndexOf(".MP3")==-1)&&($("track_id").value==""))
			{
			$D.setStyle("bandtrackfile_error","display","block");
			E=false
			}
		if(E)
			{
			var H=
				{
				success:function(I){},
				upload:function(I)
					{
					if(I.responseText=="success")
						{
						window.location.reload()
						}
					else
						{
						A.innerHTML="";
						var J=document.createElement("div");
						J.innerHTML=I.responseText;
						A.appendChild(J);
						initBandTrackSubmit()
						}
					},
				failure:function(I){},
				scope:this
				};
			var G=new Date();
			var F="/band/savetrack/"+G.getTime();
			$C.setForm(C,true);
			$("bandtracksubmit").value="Uploading...";
			$C.asyncRequest("POST",F,H)
			}
		};
	$E.addListener(C,"submit",B);
	$E.addListener(D,"click",B)
	};
$E.onDOMReady(initBandTrackSubmit);

Ladforce · 22 Sep 2009 at 14:08

Your declaring variables as say 'var D=$("bandtracksubmit"); ' but then when you come to use D your adding another $ in front of it this is done throughout the code. If you use firefox you can just use the error console to find bugs in your javascript.

CaptainComedy · 22 Sep 2009 at 16:07

so I should drop all $ in front of the D's? what about the other letters? I tried doing it and it just more errors

Ladforce · 22 Sep 2009 at 16:52

Yea drop it from infront of all your variables. Javascript doesnt use it like in php - I guess your using some library like JQuery which uses the $ character as a quick way of accessing elements. ie. $("bandtracksubmit") quickly get the element with id bandtracksubmit. Once youve assigned this element to a variable eg D you can access its members with just a dot so D.something. The same is true for all your variables. You could also think about using a bit more descriptive names for your variables hehe.

What errors do you get in the firefox error console after dropping the $ characters.

CaptainComedy · 23 Sep 2009 at 11:29

I don't get any errors from the error console when I use the code above, and I don't get any errors when remove $, but when I do remove the $ and press the upload button, it doesn't do anything. It just sits there

Here is the updated code:

PHP:

var initBandTrackSubmit=function()
	{
	var A=$("addbandtrack");
	var C=$("bandtrack");
	var D=$("bandtracksubmit");
	var B=function()
		{
		D.setStyle("bandtracktitle_error","display","none");
		D.setStyle("bandtrackfile_error","display","none");
		var E=true;
		if($("bandtracktitle").value=="")
			{
			D.setStyle("bandtracktitle_error","display","block");
			E=false
			}
		if(($("bandtrackfile").value=="")||($("bandtrackfile").value.lastIndexOf(".mp3")==-1)&&($("bandtrackfile").value.lastIndexOf(".MP3")==-1)&&($("track_id").value==""))
			{
			D.setStyle("bandtrackfile_error","display","block");
			E=false
			}
		if(E)
			{
			var H=
				{
				success:function(I){},
				upload:function(I)
					{
					if(I.responseText=="success")
						{
						window.location.reload()
						}
					else
						{
						A.innerHTML="";
						var J=document.createElement("div");
						J.innerHTML=I.responseText;
						A.appendChild(J);
						initBandTrackSubmit()
						}
					},
				failure:function(I){},
				scope:this
				};
			var G=new Date();
			var F="/band/savetrack/"+G.getTime();
			C.setForm(C,true);
			$("bandtracksubmit").value="Uploading...";
			C.asyncRequest("POST",F,H)
			}
		};
	E.addListener(C,"submit",B);
	E.addListener(D,"click",B)
	};
$E.onDOMReady(initBandTrackSubmit);

I had to put a $ on the last line of code

PHP:

$E.onDOMReady(initBandTrackSubmit);

because the error console was saying it was undefined.

I then put $ infront of

PHP:

	$E.addListener(C,"submit",B);
	$E.addListener(D,"click",B)

and it said "D.setStyle is not a defined function" or something like that. and then it said "C.setStyle is not a defined function" so I put the $C's and $D's back, which took me back to the beginning... I don't get errors in error console when it is in its original state (first code posted)

But I'm getting complaints from users saying they can't upload...

Ladforce · 23 Sep 2009 at 11:54

Well, E is undefined because its declared in the local scope of the function initBandTrackSubmit and you then try and access it from the global scope.

CaptainComedy · 23 Sep 2009 at 12:05

Ladforce said:
Well, E is undefined because its declared in the local scope of the function initBandTrackSubmit and you then try and access it from the global scope.

From what I see I don't think there is any library being used. I didn't make the code see, the old developer did and then got the sack, I'm now picking up his mess and trying to fix the bugs he's left behind...

I don't see any links to any libraries in his code...

Hairybudda · 23 Sep 2009 at 12:55

What he's saying is that you're declaring E within the function and trying to access it outwith the function where the variable doesn't exist.

CaptainComedy · 23 Sep 2009 at 15:14

Hairybudda said:
What he's saying is that you're declaring E within the function and trying to access it outwith the function where the variable doesn't exist.

ah - ok I understand now. So I should move the var E outside of var B.

Well I changed the script so it completely avoided all javascript and users are saying it still doesn't work

and I honestly couldn't find anything wrong with php:

PHP:

 	function savetrack()
  		{
    	$band_id = $this->session->userdata('bandid');

    	// TODO: Verify form
		/*
    	$rules['bandtracktitle'] = "trim|required";
    	$rules['bandtrackfile'] = "trim|required";
    	$this->validation->set_rules($rules);

    	$this->validation->set_error_delimiters('<p class="error">', '</p>');
    	$this->validation->set_message('required', 'This field can\'t be empty.');

    	if ($this->validation->run() == TRUE)
		*/
    	if (TRUE)
    		{      		
      		if ($_FILES['bandtrackfile']['name'])
      			{
        		$mp3config['upload_path'] = './media/audio/';
        		$mp3config['allowed_types'] = 'mp3|MP3';
        		$mp3config['max_size'] = '0';
        		$mp3config['encrypt_name'] = TRUE;
        		$this->upload->initialize($mp3config);

        		$this->upload->do_upload('bandtrackfile');
        		$bandtrackupload = $this->upload->data();

        		// Do S3 audio/mpeg
        		if (!is_file($bandtrackupload['full_path']))
        			{
         			die();
       			 	}
        		$filename = $bandtrackupload['file_name'];
        		$contents = file_get_contents($bandtrackupload['full_path']);
       		
        		if (TRUE)
        			{
          			if ($this->s3->putObject($filename, $contents, $this->config->item('audios3bucket'), 'public-read', $bandtrackupload['file_type']))
         				{
            			$data = array(
			              	'band_id'   => $band_id,
			              	'title'     => $this->input->post('bandtracktitle'),
			              	'text'      => $this->input->post('bandtracktext'),
			              	'upload'    => $bandtrackupload,
			              	'hidden'    => '0'
			            	);
			            $track_id = $this->tracks->create($data);
			            unlink($bandtrackupload['full_path']);
			          	}
          			else
          				{
            			$data = array(
              				'band_id'   => $band_id,
              				'title'     => $this->input->post('bandtracktitle'),
		              		'text'      => $this->input->post('bandtracktext'),
		              		'upload'    => $bandtrackupload,
		              		'hidden'    => '1'
            				);
           	 			$track_id = $this->tracks->create($data);
          				}
        			}
        		else
        			{
          			/* TODO: Execute background process?
           			*
           			*/
        			}
      			}
      		else
      			{
        		$bandtrackupload = FALSE;
      			}

      		// Create or update track
      		if ($this->input->post('track_id'))
      			{
        		$data = array(
          			'track_id'  => $this->input->post('track_id'),
          			'title'     => $this->input->post('bandtracktitle'),
          			'text'      => $this->input->post('bandtracktext'),
          			'upload'    => $bandtrackupload
        			);
        		$track_id = $this->tracks->update($data);
      			}
    		}
    	else
    		{
      		$formdata = array();
      		$formdata['bandtracktitle'] = form_prep($this->input->post('bandtracktitle'));
      		$formdata['bandtracktext'] = form_prep($this->input->post('bandtracktext'));
      		$this->load->view('band/music_form', $formdata);
    		}
  		$permalink = $this->uri->segment(1);
		$url = "/$permalink/music";
		redirect ($url);		
  		}

its pretty standard where if it works for one it would work for all - I can't see otherwise...

CaptainComedy · 8 Oct 2009 at 13:02

Ok I've been speaking with the people at codeigniter and they say it could be a unrecognised mime type? but would that allow some people to upload and not for others?

I put a .htaccess up with 1 line of code in:

AddType audio/mpeg .mp3

will that work if I put it in the destination folder?