Team:Groningen/Layout Ideas

From 2009.igem.org

(Difference between revisions)
(New page: Banner maken met foto's Die faden en zo alle facetten van ons team laten zien. voorbeeld: http://www.professorfrancken.nl/ "Paden" door de Wiki die de lezer op een logische manier door o...)
(Example of dynamic hierarchy of categories using javascript.)
Line 3: Line 3:
"Paden" door de Wiki die de lezer op een logische manier door onze documenten leiden. Eventueel zouden we zijpaden kunnen maken voor meer detail. Denk bijv. ook aan de rode/gele paden in bossen en op eilanden. (Zo van, volg de gele paaltjes.) Kun je gelijk een mooie "site'''map'''" maken.
"Paden" door de Wiki die de lezer op een logische manier door onze documenten leiden. Eventueel zouden we zijpaden kunnen maken voor meer detail. Denk bijv. ook aan de rode/gele paden in bossen en op eilanden. (Zo van, volg de gele paaltjes.) Kun je gelijk een mooie "site'''map'''" maken.
 +
 +
We could use JavaScript and the [https://2009.igem.org/wiki/api.php Wiki's API] to create a menu and/or sitemap based on categories (this hierarchy is created dynamically using JavaScript):
 +
<html>
 +
<ul id="pageList"></ul>
 +
<script type="text/javascript" src="http://o.aolcdn.com/dojo/1.3.0/dojo/dojo.xd.js" djConfig="isDebug: false"></script>
 +
<script>
 +
dojo.require("dojo.io.script");
 +
dojo.require("dojox.rpc.Service");
 +
dojo.addOnLoad(onLoadCallback);
 +
 +
var svc;
 +
var pageList = document.getElementById('pageList');
 +
var wikismd = {
 +
    "SMDVersion": "2.0",
 +
    "id": "https://2009.igem.org/wiki/api.php",
 +
    "description": "iGEM Wiki API",
 +
 +
    transport: "JSONP",
 +
    envelope: "URL",
 +
    additionalParameters: true,
 +
    target: "https://2009.igem.org/wiki/api.php",
 +
    parameters: [
 +
        { name: "format", optional: false, "default": "json" }
 +
    ],
 +
 +
    services: {
 +
        query: {
 +
            parameters: [
 +
                { name: "action", type: "string", "default": "parse" }
 +
            ]
 +
        }
 +
    }
 +
}
 +
 +
function onLoadCallback() {
 +
  svc = new dojox.rpc.Service(wikismd);
 +
  fillPageList(pageList, "Category:Team:Groningen");
 +
}
 +
 +
function fillPageList(list, pageTitle) {
 +
  svc.query({
 +
        action: "query",
 +
        list: "categorymembers",
 +
        cmtitle: pageTitle
 +
    }).addCallback(this, function(results){ createPageList(list,results); });
 +
}
 +
 +
function createPageList(list, results) {
 +
  var members = results.query.categorymembers;
 +
  for(var i=0; i<members.length; i++) {
 +
    var fulltitle = members[i].title;
 +
    if (members[i].ns == 14) {
 +
      var pathElements = fulltitle.split('/');
 +
      var subpage = pathElements.pop();
 +
      var li = document.createElement("li");
 +
      li.innerHTML = subpage.link("/" + fulltitle);
 +
      list.appendChild(li);
 +
 +
      var ul = document.createElement("ul");
 +
      list.appendChild(ul);
 +
      fillPageList(ul, fulltitle);
 +
    } else {
 +
      var li = document.createElement("li");
 +
      li.innerHTML = fulltitle.link("/" + fulltitle);
 +
      list.appendChild(li);
 +
    }
 +
  }
 +
}
 +
</script>
 +
</html>

Revision as of 12:50, 12 May 2009

Banner maken met foto's Die faden en zo alle facetten van ons team laten zien. voorbeeld: http://www.professorfrancken.nl/

"Paden" door de Wiki die de lezer op een logische manier door onze documenten leiden. Eventueel zouden we zijpaden kunnen maken voor meer detail. Denk bijv. ook aan de rode/gele paden in bossen en op eilanden. (Zo van, volg de gele paaltjes.) Kun je gelijk een mooie "sitemap" maken.

We could use JavaScript and the Wiki's API to create a menu and/or sitemap based on categories (this hierarchy is created dynamically using JavaScript):

    Retrieved from "http://2009.igem.org/Team:Groningen/Layout_Ideas"