Projektänderung von XML auf JSON (Hilfe)

[Knost]

Da unser Lehrer uns nun aufgetragen hat unser Projekt dahingehend zu verändern das wir JSON mit einbinden sollen, stehen wir vor einem Problem. Da wir uns mit der Materie bisher nicht auskennenm hoffe ich hier im Forum auf Hilfe zu stoßen. Unser Projekt ist soweit fertig, müssen nur noch kleinere Änderungnen vornehmen und halt von XML zu JSON übergehen. Ich stelle hier nun die meiner Meinung nach die wichtigen Dateien hoch die geändert werden müssten.

Datei 1
<%
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
response.setHeader("pragma","no-cache");
%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %><?xml version="1.0" ?>
<Bildaustausch><!-- in dieser .jsp Datei wird eine XMl zur Auswertung durch das aufrufende JavaScript generiert. -->
    <c:forEach var="item" items="${fotoBean.array}"><!-- Fuer jedes vorhandene Bild wird ein neues Bildelement erstellt -->
        <Bild>
            <url>${item[0]}</url><!-- Hier werden die Daten aus der FotoDataBean in das XML Dokument eingebunden -->
            <name>${item[1]}</name>
            <text>${item[2]}</text>
            <datum>${item[3]}</datum>
            <laenge>${item[4]}</laenge>
        </Bild>
    </c:forEach>
</Bildaustausch>

In dieser Datei müsst ich meiner Meinung nach nur alles nach JSON umformen. z.B. nach dieser Art:
"skillz": {
    "web":[
        {"name": "html",
         "years": "5"
        },
        {"name": "css",
         "years": "3"
        }],
    "database":[
        {"name": "sql",
         "years": "7"
        }]
}}

Das sollten wir denn auch soweit hinkriegen.

Datei 2

//Dies ist die JavaScript Datei, die asynchrone Anfragen an den Server stellt und die durch das Servlet generierten antworten entgegen nimmt
var client;
var mappe;
var Sortierung = "a";
function galerieAnfrage(a,b,c,d){
    showProgress(); //An dieser Stelle wird die Wartenzeige eingeblendet
    var Laenge = 0;
    var Anfang = 0;
    if(a != null){//Hier werden die bei Aufruf der Funktion übermittelten Parameter ausgewertet
     mappe = a;
    }
    if(d != null){
     Sortierung = d;
    }
    if(b == "minus"){
            Anfang = -1;
    }
    if(b == "plus"){
         Anfang = 1;
    }
    if(c == "minus"){
        Laenge = -1;
    }
    if(c == "plus"){
        Laenge = 1;
    }
    if(mappe == null){//Wenn noch keine Fotomappe ausgewählt wurde soll auch noch kein Request an den Server möglich sein.
      alert("Bitte waehlen Sie zunaechst eine Fotomappe aus.");
    }else{
        //Hier wird ein neuer Request an das Servelett generiert und als Parameter die gewünschte Modifikationen an der Sortierung, der Anzahl der anzuzeigenden Vorschaubilder und der Scrollposition übermittelt. Außerdem wird der Eventhandler der für das Behandlen der Serverantwort zuständig ist definiert
        client = new XMLHttpRequest();
        client.onreadystatechange = eventHandler01;
        client.open("GET","../servlet/Controller?Mappe=" + mappe + "&Anfang=" + Anfang + "&Laenge=" + Laenge + "&Sortierung=" + Sortierung);
        client.send(null);
    }
}

function eventHandler01(){//Dies ist der EventHandler der für die Bearbeitung der Serverantwort auf die oben stehende Anfrage verantwortlich ist
if(client.readyState == 4){
if(client.status == 200){
    document.getElementById("minus").style.visibility = "visible"; // Hier werden die Scrollschaltflächen und die Bildererhöhungs- und Bildererniedrigungsschaltflächen sichtbar gemacht
    document.getElementById("plus").style.visibility = "visible";
    document.getElementById("links").style.visibility = "visible";
    document.getElementById("rechts").style.visibility = "visible";
    var url = client.responseXML.getElementsByTagName("url"); //Hier werden die einzelnen durch die FotoAntwort.jsp in Form eines XML Dokuments generierten Antworten ausgelesen
    var name = client.responseXML.getElementsByTagName("name");
    var text = client.responseXML.getElementsByTagName("text");
    var datum = client.responseXML.getElementsByTagName("datum");
    var laenge = client.responseXML.getElementsByTagName("laenge");
    var bilder = "";

	    for(i = 0; i < url.length; ++i){//An dieser Stelle werden die im aktuellen Dokument anzuzeigenden Vorschubilder aufgelistet. Hierbei wird auch schon gleich das mouseoverevent, das später für die Großdarstellung eines Bildes verantwortlich ist, mit allen hierfür erforderlichen Parametern vorbereitet.  
	    	 		  bilder = bilder + "<img src='" + url[i].firstChild.nodeValue+"' width='90' height='60' alt='test' onmouseover='javascript:grossbild(\""+url[i].firstChild.nodeValue+"\",\""+name[i].firstChild.nodeValue+"\",\""+text[i].firstChild.nodeValue+"\",\""+datum[i].firstChild.nodeValue+"\",\""+laenge[i].firstChild.nodeValue+"\")'>";  
	    	//        bilder = bilder + "<img src='" + url[i].firstChild.nodeValue+"' width='90' height='60' alt='test' onmouseover='javascript:grossbild(\""+url[i].firstChild.nodeValue+"\",\""+name[i].firstChild.nodeValue+"\",\""+text[i].firstChild.nodeValue+"\",\""+datum[i].firstChild.nodeValue+"\",\""+laenge[i].firstChild.nodeValue+"\");)'>";  

//         alert(url[i].firstChild.nodeValue);
    }
    document.getElementById("pictures").innerHTML = bilder; // Hier wird die eben erstellte Bilderliste in das aktuelle Dokument eingehängt

	} else{  
		alert(client.status);  
	}  
	hideProgress(); // Hier wird die Fortschrittsanzeige ausgeblendet  
}  

}

function grossbild(url,name,text,datum,laenge){// Diese Funktion wird aufgerufen, wenn mit der Maus über ein Vorschaubild gefahren wird. Sie bewirkt das Anzeigen des entsprechenden Bildes in Originalgröße und die Angabe der bildspezifischen Daten
    document.getElementById("bigPicture").innerHTML = "<img src='" + url + "' alt='test'>";
    document.getElementById("bildbeschreibung").innerHTML = "Beschreibung: " + text;
    document.getElementById("bildname").innerHTML = "Name: " + name;
    document.getElementById("bilddatum").innerHTML = "Aenderungsdatum: " + datum;
    document.getElementById("bildlaenge").innerHTML = "Groesse: " + laenge + " kb";
}

function showProgress(){//Diese Funktion blendet die Fortschrittsanzeige ein
    document.getElementById("progress").style.display="inline";
}

function hideProgress(){//Diese Funktion blendet die Fortschrittsanzeige aus
    document.getElementById("progress").style.display="none";
}

Und in dieser Datei müsste man dann ja denn alles via JSON ansprechen und da würden wir kaum weiter wissen. Hoffe jemand kennt sich damit aus und könnte uns helfen. Wenn noch mehr wissen um das Projekt erforderlich wär kann ich gerne noch die anderen Dateien hochladen oder auch das Projekt zu Verfügung stellen.
Danke schonmal im Voraus.

[ChrisB]

Hi,

Und in dieser Datei müsste man dann ja denn alles via JSON ansprechen und da würden wir kaum weiter wissen.

Dann sollten „wir“ uns vielleicht erst mal ein bisschen informieren ...?

Hoffe jemand kennt sich damit aus und könnte uns helfen.

Und wobei?
Wenn du keine konkrete Frage stellst, können wir euch auch kaum weiterhelfen.

MfG ChrisB

[bleicher]

Grüße,
bin ebenso laie, aber JSOn ist afaik kein brainfuck -   http://www.json.org/ gukst du?
MFG
bleicher