Zusammenführen 2er Javascripts

[Emjay_Lee]

Hallo und Guten Abend liebes Forum,


ich arbeite derzeit an einer mobilen Anwendung, welche auf die Kamerafunktion zugriefen soll. Mit jQuery habe ich bis hierhin gearbeitet und muss nun PhoneGap in meine Anwendung mit einbeziehen.


Per Knopfdruck soll sich die Kamera öffnen ein Bild aufgenommen werden, und dann per weiterem Klick hochgeladen werden.


Bisher habe ich per Klick eine Datei auswählen können, und diese dann hochladen. Nun soll der Kamerazugriff erfolgen. Ich poste jetzt hiermal die Teilstücke meines JS und hoffe ihr könnt mir da helfen.


Zu Beginn die FormAction-Geschichte in HTML

<form action="" method="post" enctype="multipart/form-data">
					<input name="file" type="file" id="fileA" onchange="fileChange();" class="file"/>
					
						
						
						<progress id="progress"></progress><span id="prozent"></span>
					
					


					<input name="upload" id="upper" value="Upload" type="button" data-inline="true" onclick="uploadFile();"  />


				</form>

Hier wird mit dem ersten <input> die File aufgerufen (quasi "Datei auswählen)
Da soll dann der Kamera aufruf stattfinden.


Bisher wird aber dieser Code hier aufgerufen:

function fileChange() {
				//FileList Objekt aus dem Input Element mit der ID "fileA"
				var fileList = document.getElementById("fileA").files;


				//File Objekt (erstes Element der FileList)
				var file = fileList[0];


				//File Objekt nicht vorhanden = keine Datei ausgewählt oder vom Browser nicht unterstützt
				if (!file)
					return;


				document.getElementById("fileName").innerHTML = 'Dateiname: ' + file.name;
				document.getElementById("fileSize").innerHTML = 'Dateigröße: ' + file.size + ' B';
				document.getElementById("fileType").innerHTML = 'Dateityp: ' + file.type;
				document.getElementById("progress").value = 0;
				document.getElementById("prozent").innerHTML = "0%";
			}

das Zweiter input ruft dann die Upload Funktion auf:

function uploadFile() {


				//var auswahl = $("#auswahl").val();
				var aktuell = dateToString(current);
				//Wieder unser File Objekt
				var file = document.getElementById("fileA").files[0];
				//FormData Objekt erzeugen
				var formData = new FormData();
				//XMLHttpRequest Objekt erzeugen
				var client = new XMLHttpRequest();
				var prog = document.getElementById("progress");


				if (!file)
					return;


				prog.value = 0;
				prog.max = file.size;


				//Fügt dem formData Objekt unser File Objekt hinzu
				formData.append("datei", file);
				//formData.append("auswahl",  );
				client.onerror = function(e) {
					alert("onError");
				};


				client.onload = function(e) {
					document.getElementById("prozent").innerHTML = "100%";
					prog.value = prog.max;
				};


				client.upload.onprogress = function(e) {
					document.getElementById("progress").value = e.loaded;
					document.getElementById("prozent").innerHTML = Math.round(100 / e.total * e.loaded) + "%";
				};


				client.open("POST", "upload.php?auswahl=" + auswahl + "&aktuell=" + aktuell);
				client.send(formData);


			}

nun Soll der erste Input (da wo das Bild festgelegt wird) die Kamera das Bild festlegen. Wie das funktionieren soll seht ihr hier: PhoneGap Kamera


Das Beispiel hat funktioniert. Aber wie füge ich meine beiden Javascripts zusammen?


Vielen Dank für jede Hilfe


Emjay