Index: /Dev/branches/Cartis/classes/dbDataSelectionWidget.php
===================================================================
--- /Dev/branches/Cartis/classes/dbDataSelectionWidget.php	(revision 202)
+++ /Dev/branches/Cartis/classes/dbDataSelectionWidget.php	(revision 202)
@@ -0,0 +1,36 @@
+<?php
+
+/*
+ * To change this template, choose Tools | Templates
+ * and open the template in the editor.
+ */
+
+/**
+ * Description of dbDataSelectionWidget
+ *
+ * @author CPS
+ */
+class dbDataSelectionWidget {
+
+    //Properties
+    
+    public $sessions;
+    public $gamedata;
+
+    public function __construct() {
+        $dbi = new DatabaseInterface();
+        
+        $this->sessions = $dbi->get("Session", array());
+        $this->gamedata = $dbi->get("Application", array());
+    }
+
+    public function Javascript() {
+        ?>
+        <script type='text/javascript' src="js/generalScripts.js"></script>
+        <script type='text/javascript' src="js/dashboardScripts.js"></script>
+        <?php
+
+    }
+
+}
+?>
Index: /Dev/branches/Cartis/css/aapje.css
===================================================================
--- /Dev/branches/Cartis/css/aapje.css	(revision 201)
+++ /Dev/branches/Cartis/css/aapje.css	(revision 202)
@@ -135,5 +135,5 @@
     border-radius: 15px; 
     border: 1px solid white;
-}
+   }
 
 .selectionmenu {
@@ -166,6 +166,23 @@
     color: #fff;       
     font-size: 30px;
+    float: right;
 }
+
+.radarGraph {
+    width: 35em;
+    margin: 1em auto 0 auto;
+    padding: 2em;
+    text-align: center;
+    background-image: url('../images/bg/graygradient.png');
+    background-repeat: repeat-x;
+    background-color: #aeb2b3;
+    -moz-border-radius: 15px;
+    border-radius: 15px; 
+    border: 1px solid white;
+    text-orientation: center;
+   }
 
 
 
+
+
Index: /Dev/branches/Cartis/css/visualeditors.css
===================================================================
--- /Dev/branches/Cartis/css/visualeditors.css	(revision 201)
+++ /Dev/branches/Cartis/css/visualeditors.css	(revision 202)
@@ -67,4 +67,8 @@
     border-radius: 1em;
     -moz-border-radius: 1em;
+}
+
+.largeFrame .content {
+    clear: left;
 }
 
@@ -422,2 +426,61 @@
 }
 
+/**************************/
+/* Survey Editor Specific */
+/**************************/
+
+#leftColumn {
+    float: left;
+    clear: left;
+}
+
+#rightColumn {
+    float: left;
+    clear: none;
+}
+
+.largeFrame.C{
+    clear: left;
+    margin: 10px;
+    padding: 5px;
+    
+    height: auto;
+    max-height: 400px;
+}
+
+.largeFrame.Cu{
+    clear: left;
+    margin: 10px;
+    padding: 5px;
+    width: 730px;
+}
+
+.largeFrame.Cv {
+    clear: left;
+    margin: 10px;
+    padding: 5px;
+    width: 200px;
+    height: 600px;
+}
+
+.checkboxList {
+    overflow-y: scroll; 
+    overflow-x: hidden;
+    clear: left;
+    width: auto; 
+    height: 250px; 
+    background-color: #FFF; 
+    border-width: 2px; 
+    border-style: solid; 
+    border-bottom-color: #AAA; 
+    border-top-color: #555; 
+    border-right-color: #AAA; 
+    border-left-color: #555;
+}
+
+.dbDataList {
+    width: 300px;
+    float: left;
+    clear: left;
+    margin: 0 10px 0 10px;
+}
Index: /Dev/branches/Cartis/dashboardDataSelection.php
===================================================================
--- /Dev/branches/Cartis/dashboardDataSelection.php	(revision 202)
+++ /Dev/branches/Cartis/dashboardDataSelection.php	(revision 202)
@@ -0,0 +1,84 @@
+<?php
+//Insert login check, dbi creation, etc...
+require "classes/master.php";
+
+$dbDataSelectionWidget = new dbDataSelectionWidget();
+?>
+
+
+
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+        <title></title>
+        <?php new Stylesheet("visualEditors"); ?>
+
+        <?php $dbDataSelectionWidget->Javascript(); ?>
+    </head>
+    <body>
+        <div id="header">
+            <?php new Logo(); ?>
+        </div>
+
+        <div id="content">
+            <div id="wrapper">
+
+                <div id="leftColumn">
+
+                    <div class="largeFrame C" id="dbDataSelector">
+                        <div class="content">
+
+                            <div style="float: left; clear: none;">
+                                <div class="largeTitle">Instance data</div>
+                                <select id="dbSessionInstancesList" multiple class="dbDataList" size="15" onchange="infoPanelTimeout(event);">
+                                    <?php
+                                    foreach ($dbDataSelectionWidget->sessions as $session) {
+                                        // Fill list
+                                        // First checkbox, then descriptor
+                                        echo "<option value='$session->uid'>$session->title</option>";
+                                    }
+                                    ?>
+                                </select>
+                            </div>
+
+                            <div style="float: left; clear:none;">
+                                <div class="largeTitle">Game data</div>
+                                <select id="dbGamedataList" multiple class="dbDataList" size="15" onChange="infoPanelTimeout(event);">
+                                    <?php
+                                    foreach ($dbDataSelectionWidget->gamedata as $gamedata) {
+                                        // Fill list
+                                        // First checkbox, then descriptor
+                                        echo "<option value='$gamedata->uid'>$gamedata->title</option>";
+                                    }
+                                    ?>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+
+
+                    <div class="largeFrame Cu" id="dbInfoPanel">
+                        <div class='largeTitle'>Info panel</div>
+                        <div class="content" id="dbInfoPanelContent" style="height: 100px;">
+                            
+                        </div>
+                        
+                        <div class="controls">
+                            <input type="button" class="smallButton" id="btnAddToCart" value="Add to list" onClick="addDataToList();" />
+                        </div>
+                    </div>
+                </div>
+
+                <div id="rightColumn">
+                    <div class="largeFrame Cv" id="dbShoppingCart">
+                        <div class="largeTitle">Shopping cart</div>
+                        <div class="content" id="shoppingCartContent">
+                            fsdfsdfsd
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </body>
+</html>
Index: /Dev/branches/Cartis/js/dashboardScripts.js
===================================================================
--- /Dev/branches/Cartis/js/dashboardScripts.js	(revision 202)
+++ /Dev/branches/Cartis/js/dashboardScripts.js	(revision 202)
@@ -0,0 +1,162 @@
+dbSelectionInfoTimeout = null;
+currentlySelected = {
+    titles: [],
+    uids: [],
+    type: null
+}
+
+shoppingCart = {
+    contents: {
+        titles: [],
+        uids: [],
+        types: []
+    }
+}
+
+function infoPanelTimeout(event) {
+    // If no event, crash.
+    if (event == undefined || event == null) return;
+    // Cancel previous timeout if present.
+    if (dbSelectionInfoTimeout) {
+        window.clearTimeout(dbSelectionInfoTimeout);
+    }
+    // Gather parameters about event.
+    var dbSelectionInfoTime = 500;
+    var selectBox = event.target;
+    var values = getMultipleListValue(selectBox).values;
+    var titles = getMultipleListValue(selectBox).titles;
+    var uid = values[values.length-1];
+    var type;
+    switch (selectBox.id) {
+        case "dbSessionInstancesList":
+            // This should be session instance, not session. Testing purpose only.
+            type = "Session";
+            break;
+        case "dbGamedataList":
+            // This is obviously not the real type, change before committing
+            type = "Application";
+            break;
+        default:
+            alert("No valid type passed!");
+            break;
+    }
+    currentlySelected.uids = values;
+    currentlySelected.titles = titles;
+    currentlySelected.type = type;
+    // Set timeout of 500ms, then execute ajaxInfoRequest with previously gathered parameters.
+    dbSelectionInfoTimeout = window.setTimeout(ajaxInfoRequest, dbSelectionInfoTime, uid, ge("dbInfoPanelContent"), type);
+    
+}
+
+function getMultipleListValue(element) {
+    // Get multiple values from multiple select box
+    //TODO: 
+    var result = {
+        values: [],
+        titles: []
+    }
+        
+    for (var i = 0; i < element.options.length; i++) {
+        if (element.options[i].selected == true) {
+            result.values.push(element.options[i].value);
+            result.titles.push(element.options[i].text);
+        }
+    }
+    return result;
+}
+
+function addDataToList() {
+    // Take selected objects and add to shopping cart
+        
+    // set element
+    var element;
+    switch (currentlySelected.type){
+        case "Session":
+            element = ge("dbSessionInstancesList");
+            break;
+        case "Application":
+            element = ge("dbGamedataList");
+            break;
+        default:
+            // ???
+            break;
+    }
+    var uid;
+    while (uid = currentlySelected.uids.pop()) {
+        // Add to shopping cart
+        shoppingCart.contents.uids.push(uid);
+        shoppingCart.contents.titles.push(currentlySelected.titles.pop());
+        shoppingCart.contents.types.push(currentlySelected.type);
+        
+        // Remove option from list
+        for (var i = 0; i < element.options.length; i++) {
+            if (element.options[i].value == uid) {
+                element.remove(i);
+                break;
+            }
+        }
+    }
+    
+    // Then add display of shopping cart contents
+    drawShoppingCart();
+    
+}
+
+function removeFromList(event) {
+    if (event == null || event == undefined) return;
+    var id = event.target.parentNode.id;
+    var uid = id.split("shoppingCartItem")[1];
+    // find index, remove from object
+    var indexInCart = shoppingCart.contents.uids.indexOf(uid);
+    shoppingCart.contents.uids.splice(indexInCart, 1);
+    var title = shoppingCart.contents.titles.splice(indexInCart, 1)[0];
+    var type = shoppingCart.contents.types.splice(indexInCart, 1)[0];
+    //Then replace element back into relevant list
+    // First set element
+    var element;
+    switch (type){
+        case "Session":
+            element = ge("dbSessionInstancesList");
+            break;
+        case "Application":
+            element = ge("dbGamedataList");
+            break;
+        default:
+            // ???
+            break;
+    }
+    
+    var option = ce("option");
+    option.value = uid;
+    option.text = title;
+    element.add(option,null);
+    
+    
+    
+    // Lastly, refresh
+    drawShoppingCart();
+    }
+
+function drawShoppingCart() {
+        var scElement = ge("shoppingCartContent");
+        scElement.innerHTML = "";
+        for (var i = 0; i < shoppingCart.contents.uids.length; i++) {
+            var newLine = ce("div");
+            newLine.className = "shoppingCartItem";
+            newLine.id = "shoppingCartItem"+shoppingCart.contents.uids[i];
+            var icon = ce("image");
+            icon.src = "images/ui/DeleteIcon.gif";
+            icon.addEventListener("click", function(event){
+                // TODO: Actually write this function
+                removeFromList(event);
+            }, false);
+            var titleField = ce("text");
+            titleField.innerHTML = shoppingCart.contents.titles[i];
+            newLine.appendChild(icon);
+            newLine.appendChild(titleField);
+            scElement.appendChild(newLine);
+        }
+    
+        // reset type after empty
+        currentlySelected.type = null;
+    }
