Index: Dev/branches/rest-dojo-ui/client/rft/css/layout.css
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/css/layout.css	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/css/layout.css	(revision 355)
@@ -343,4 +343,5 @@
 .claro.blue .inheritBgColor {
     background-color: #0072bc;
+    color: #ffffff;
 }
 .claro div.green.inheritBgColor,
@@ -348,4 +349,5 @@
 .claro.green .inheritBgColor {
     background-color: #3aa605;
+    color: #ffffff;
 }
 .claro div.orange.inheritBgColor,
@@ -353,4 +355,5 @@
 .claro.orange .inheritBgColor {
     background-color: #ff5b12;
+    color: #ffffff;
 }
 .claro div.purple.inheritBgColor,
@@ -358,4 +361,5 @@
 .claro.purple .inheritBgColor {
     background-color: #6529b7;
+    color: #ffffff;
 }
 .claro div.red.inheritBgColor,
@@ -363,4 +367,5 @@
 .claro.red .inheritBgColor {
     background-color: #8c0310;
+    color: #ffffff;
 }
 .claro div.trans.inheritBgColor,
@@ -368,4 +373,5 @@
 .claro.trans .inheritBgColor {
     background-color: transparent;
+    color: #ffffff;
 }
 .claro div.blue.inheritBgColor.light,
@@ -373,4 +379,5 @@
 .claro.blue .inheritBgColor.light {
     background-color: #0794d1;
+    color: #ffffff;
 }
 .claro div.green.inheritBgColor.light,
@@ -378,4 +385,5 @@
 .claro.green .inheritBgColor.light {
     background-color: #79ca0a;
+    color: #ffffff;
 }
 .claro div.orange.inheritBgColor.light,
@@ -383,4 +391,5 @@
 .claro.orange .inheritBgColor.light {
     background-color: #ff9140;
+    color: #ffffff;
 }
 .claro div.purple.inheritBgColor.light,
@@ -388,4 +397,5 @@
 .claro.purple .inheritBgColor.light {
     background-color: #993dec;
+    color: #ffffff;
 }
 .claro div.red.inheritBgColor.light,
@@ -393,4 +403,5 @@
 .claro.red .inheritBgColor.light {
     background-color: #bd0013;
+    color: #ffffff;
 }
 
@@ -453,6 +464,4 @@
 
 
-
-
 /* Alignment */
 .claro .floatRight {
@@ -461,2 +470,16 @@
     padding: 0;
 }
+
+
+/* SurveyListView */
+.claro .rftSurveyListView {
+}
+.claro .rftSurveyListView .rftSurveyListViewContent {
+    height: 300px;
+    background: #444444;
+    overflow: auto;
+}
+.claro .rftSurveyListView .rftLineWithButtons .rftLineWithButtonsTitle {
+    max-width: 200px;
+    overflow: hidden;
+}
Index: Dev/branches/rest-dojo-ui/client/rft/css/rftLineWithButtons.css
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/css/rftLineWithButtons.css	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/css/rftLineWithButtons.css	(revision 355)
@@ -22,33 +22,55 @@
 }
 
-/* Colour settings */
-.claro div.blue.rftLineWithButtons,
-.claro .blue .rftLineWithButtons {
-    background-color: #0072bc;
+/* SurveyListView stuff */
+.claro div.blue.inheritBgColor.dojoDndItemAnchor,
+.claro .blue .inheritBgColor.dojoDndItemAnchor,
+.claro.blue .inheritBgColor.dojoDndItemAnchor {
+    background-color: #0794d1;
     color: #ffffff;
 }
-.claro div.red.rftLineWithButtons,
-.claro .red .rftLineWithButtons {
-    background-color: #8c0310;
+.claro div.green.inheritBgColor.dojoDndItemAnchor,
+.claro .green .inheritBgColor.dojoDndItemAnchor,
+.claro.green .inheritBgColor.dojoDndItemAnchor {
+    background-color: #79ca0a;
     color: #ffffff;
 }
-.claro div.green.rftLineWithButtons,
-.claro .green .rftLineWithButtons {
-    background-color: #3aa605;
+.claro div.orange.inheritBgColor.dojoDndItemAnchor,
+.claro .orange .inheritBgColor.dojoDndItemAnchor,
+.claro.orange .inheritBgColor.dojoDndItemAnchor {
+    background-color: #ff9140;
     color: #ffffff;
 }
-.claro div.purple.rftLineWithButtons,
-.claro .purple .rftLineWithButtons {
-    background-color: #6529b7;
+.claro div.purple.inheritBgColor.dojoDndItemAnchor,
+.claro .purple .inheritBgColor.dojoDndItemAnchor,
+.claro.purple .inheritBgColor.dojoDndItemAnchor {
+    background-color: #993dec;
     color: #ffffff;
 }
-.claro div.orange.rftLineWithButtons,
-.claro *.orange .rftLineWithButtons {
-    background-color: #ff5b12;
+.claro div.red.inheritBgColor.dojoDndItemAnchor,
+.claro .red .inheritBgColor.dojoDndItemAnchor,
+.claro.red .inheritBgColor.dojoDndItemAnchor {
+    background-color: #bd0013;
     color: #ffffff;
 }
-.claro div.trans.rftLineWithButtons,
-.claro .trans .rftLineWithButtons {
-    background-color: transparent;
-    color: #ffffff;
+
+.claro .rftLineWithButtons.dojoDndItem {
+    transition: all 0.2s;
+    -moz-transition: all 0.2s;
+    -webkit-transition: all 0.2s;
+    -o-transition: all 0.2s;
 }
+.claro .rftLineWithButtons.dojoDndItem.dojoDndItemBefore {
+    margin-top: 6px;
+    border-top: 6px solid #ffffff;
+}
+.claro .rftLineWithButtons.dojoDndItem.dojoDndItemAfter {
+    margin-bottom: 6px;
+    border-bottom: 6px solid #ffffff;
+}
+.claro .dojoDndAvatar {
+    color: #000000;
+}
+.claro .dojoDndSourceMoved .rftLineWithButtons.dojoDndItemAnchor {
+    height: 0;
+    overflow: hidden;
+}
Index: Dev/branches/rest-dojo-ui/client/rft/css/rftSelector.css
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/css/rftSelector.css	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/css/rftSelector.css	(revision 355)
@@ -39,2 +39,6 @@
     background-color: #00ff00;
 }
+
+.claro .rftSelector .rftSelectorOptions .rftLineWithButtons.selected {
+    
+}
Index: Dev/branches/rest-dojo-ui/client/rft/css/surveyEditor.css
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/css/surveyEditor.css	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/css/surveyEditor.css	(revision 355)
@@ -0,0 +1,38 @@
+.claro .surveyEditorPreviewSource {
+	overflow: auto;
+	height: 350px;
+}
+
+.claro .surveyEditorPreview .surveyEditorPreviewItem {
+	margin: 8px;
+	display: block;
+	color: #ffffff;
+	padding: 0 8px;
+}
+
+.claro .surveyEditorPreviewItem .topBorder,
+.claro .surveyEditorPreviewItem .bottomBorder {
+	height: 24px;
+	line-height: 20px;
+}
+
+.claro .surveyEditorPreviewItem .topBorder .title {
+	margin: 0 16px 0 16px;
+}
+
+.claro .surveyEditorPreviewItem .topBorderButtons {
+	float: right;
+	margin: 0;
+	padding: 0;
+}
+
+.claro .surveyEditorPreviewItemInner {
+	margin: 0;
+	padding: 0;
+	overflow: hidden;
+}
+
+.claro .surveyEditorPreviewItemContent {
+	padding: 8px;
+	border: 1px solid #ffffff;
+}
Index: Dev/branches/rest-dojo-ui/client/rft/pages/survey.html
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/pages/survey.html	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/pages/survey.html	(revision 355)
@@ -1,4 +1,5 @@
-<div data-dojo-type="rft.pages.survey" id="survey">
+<div data-dojo-type="rft.pages.survey" id="survey" class="blue">
     <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'" style="height: 500px;">
+
         <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
             <h2>
@@ -7,22 +8,15 @@
             </h2>
         </div>
+        
         <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'">
-            <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
-                Presets
-            </div>
             <div id="tabList" data-dojo-type="dijit.layout.TabContainer" class="blue" data-dojo-props="tabPosition:'left-h',region:'center'">
                 <!-- tabs go here -->
             </div>
         </div>
-        <!-- "Shopping cart" -->
+        
         <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'right'" style="width: 300px">
-            <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'top'">
-                <h3>Included questions</h3>
+            <div id="SurveyListViewNode" class="rftSurveyListView">
             </div>
-            <div data-dojo-type="rft.ui.List" data-dojo-props="region:'center'">
-                <!-- These would have to be dynamically generated instead of declared here! -->
-                <div data-dojo-type="rft.ui.LineWithActionsWidget" data-dojo-props="title:'Question one', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
-                <div data-dojo-type="rft.ui.LineWithActionsWidget" data-dojo-props="title:'Question two', actions: {'Cancel':{callback: function(){}, properties: {blockButton: false, icon: 'Delete', modifiers:'white'}}}"></div>
-            </div>
+
             <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'bottom'">
                 <button id="btnProperties" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconProperties'">Properties</button>
Index: Dev/branches/rest-dojo-ui/client/rft/pages/survey.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/pages/survey.js	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/pages/survey.js	(revision 355)
@@ -1,131 +1,171 @@
 define(['dojo/_base/declare',
-    'dojo/_base/lang',
-    'dojo/_base/event',
-    'dojo/_base/Deferred',
-    'rft/ui/AccordionList',
-    'rft/ui/LineWithActionsWidget',
-    'rft/store',
-    'rft/ui/_Page',
-    'rft/api',
-    'dijit/registry',
-    'rft/content',
-    'dojo/on',
-    'dojo/query'],
-    function(declare,lang,event,Deferred,AccordionList,LineWithActionsWidget,store,_Page,api,registry,content, on, query){
-        return declare('rft.pages.survey',[_Page],{
-            object: null,
-            onVisit: function() {
-                if ( this.pageArgs.uid ) {
-                    Deferred.when(store.get(this.pageArgs.uid))
-                    .then(lang.hitch(this,function(obj){
-                       this.object = obj;
-                       return Deferred.when( obj.creator && store.dereference(obj.creator) );
-                   }));
-                    this._createQuestionBrowser();
-                } else {
-                    //this.header.innerHTML = "Error: no uid for survey!"
-                }
-                this._setupButtons(this);
-                this._insertQuestion({title: "This is the question title!", sorting: {categories: ['CategoryOne', 'CategoryB123'], topic: 'The first question topic'}});
-                this._insertQuestion({title: "BLablabla question text!", sorting: {categories: ['CategoryOne'], topic: 'The first question topic'}});
-                this._insertQuestion({title: "Yaddayaddayaddaa ... sigh", sorting: {categories: ['CategoryThree', 'CategoryB123'], topic: 'Another topic'}});
-            },
-            onLeave: function() {
-                this.inherited(arguments);
-            },
-            onReset: function() {
-                this.setFields(this.object);
-            },
-            onSave: function(evt) {
-                /*lang.mixin(this.object,this.form.get('value'));
-                Deferred.when( store.put(this.object) )
-                .then(lang.hitch(this,function(obj){
-                    this.object = obj;
-                    this.setFields(obj);
-                    api.notify("Object saved");
-                }),lang.hitch(this,function(){
-                    api.notify("Object save failed",'error');
-                }));
-                event.stop(evt);
-                evt.stopPropagation();
-                return false;
-                */
-            },
-            _goToPreview: function() {
-                content.goTo('surveyAdvanced', {uid: this.object._id});
-                /* 
-                * TODO: How to prevent widgets with identical id's on different pages clashing?
-                * For example: btnSave clashes when going from survey to surveyAdvanced, since both contain one. survey.btnSave is not destroyed when loading surveyAdvanced.btnSave!
-                * Since there is no page reload, only a contentPane content swap!
-                * Talk to Hendrik about this! 
-                * TEMPORARY FIX IN THIS.ONLEAVE!
-                */
-            },
-            _setupButtons: function() {
-                // Setup button events
-                registry.byId("btnSave").on("click", lang.hitch(this, function(){
-                    this.onSave(arguments);
-                }));
-                registry.byId("btnPreview").on("click", lang.hitch(this, function(){
-                    this._goToPreview();
-                }));
-            },
-            _createQuestionBrowser: function() {
-                Deferred.when(store.query('_design/default/_view/by_type',{key:'Question'}))
-                .then(lang.hitch(this,function(questions){
-                 questions.forEach(function(question) {
-                    this._insertQuestion(question);
-                }, this);
-             }));
-            },
-            _insertQuestion: function(question) {
-                // MASSIVE TODO: The question categories cannot have spaces currently, due to the way we append them to the ID property of the container. ID's cannot have spaces.
-                // Easy fix: Replace spaces with underscores for the time being? The alternative is to make these containers have an actual "questioncategory" property in the governing widget. Not fun.
-                var tabs = registry.byId("tabList");
-                for (var c in question.sorting.categories) {
-                    var cat = question.sorting.categories[c];
-                    var catPane = query("#tab"+cat, tabs.containerNode)[0];
-                    if (catPane) {
-                        this._insertIntoCategory(question, catPane);
-                    } else {
-                        catPane = this._createCategoryTab(cat);
-                        if (catPane) {
-                            this._insertIntoCategory(question, catPane);
-                        } else {
-                            throw "Error: could not find or create category pane!";
-                        }
-                    }
-                }
-            },
-            _createCategoryTab: function(category) {
-                var tabs = registry.byId("tabList");
-                var newCat = new dijit.layout.ContentPane({
-                    title: category
-                });
-                newCat.domNode.id = "tab"+category;
-                tabs.addChild(newCat);
-                var pane = query("#tab"+category, tabs.containerNode)[0];
-                return (pane) ? pane : false;
-            },
-            _insertIntoCategory: function(question, container) {
-                debugger;
-                var selector = query(".rftSelector[title='"+question.sorting.topic+"']", container)[0];
-                var selectorWidget;
-                if (selector) {
-                    selectorWidget = registry.byNode(selector);
-                    
-                } else {
-                    selectorWidget = new rft.ui.Selector({
-                        title: question.sorting.topic
-                    });
-                    selectorWidget.placeAt(container);
-                }
-                selectorWidget.addQuestion(question);
-            },
+	'dojo/_base/lang',
+	'dojo/_base/event',
+	'dojo/_base/Deferred',
+	'rft/ui/AccordionList',
+	'rft/ui/LineWithActionsWidget',
+	'rft/ui/SurveyListView',
+	'rft/store',
+	'rft/ui/_Page',
+	'rft/api',
+	'dijit/registry',
+	'rft/content',
+	'dojo/on',
+	'dojo/query'],
+	function(declare,lang,event,Deferred,AccordionList,LineWithActionsWidget,SurveyListView,store,_Page,api,registry,content, on, query){
+		return declare('rft.pages.survey',[_Page],{
+			object: null,
+			questions: null,
+			listView: null,
+			
+			onVisit: function() {
+				if ( this.pageArgs.uid ) {	// Load survey
+					Deferred.when(store.get(this.pageArgs.uid))
+					.then(lang.hitch(this,function(obj){
+						this.object = obj;
+						return Deferred.when( obj.creator && store.dereference(obj.creator) );
+					}));
 
+					//this._createQuestionBrowser();	// Load questions database and create browser
+					this.questions = new dojo.store.Memory({	// Create local copy store of questions database
+						data: [],
+						idProperty: "_id"
+					});
+				} else {
+					throw "No valid uid or survey passed!";
+				}
+				this._setupButtons(this);
+				var testQuestion1 = {_id: "123", title: "How long have you worked here?", categories: ['Professional background'], topic: 'Work experience'};
+				this.questions.add(testQuestion1);
+				this._insertQuestion(testQuestion1);
+				var testQuestion2 = {_id: "234", title: "How many years have you been employed here?", categories: ['Respondent personals','Professional background'], topic: 'Work experience'};
+				this.questions.add(testQuestion2);
+				this._insertQuestion(testQuestion2);
+				var testQuestion3 = {_id: "345", title: "Have you worked here longer than 10 years?", categories: ['Respondent personals','Professional background'], topic: 'Work experience'};
+				this.questions.add(testQuestion3);
+				this._insertQuestion(testQuestion3);
+				var testQuestion4 = {_id: "456", title: "Rate your experience at your current employer from 1 to 10.", categories: ['Respondent personals','Professional background'], topic: 'Work experience'};
+				this.questions.add(testQuestion4);
+				this._insertQuestion(testQuestion4);
+				
+				this._createListView(this.questions);
+			},
+			onLeave: function() {
+				this.inherited(arguments);
+			},
+			onReset: function() {
+				this.setFields(this.object);
+			},
+			onSave: function(evt) {
+				/*lang.mixin(this.object,this.form.get('value'));
+				Deferred.when( store.put(this.object) )
+				.then(lang.hitch(this,function(obj){
+				this.object = obj;
+				this.setFields(obj);
+				api.notify("Object saved");
+				}),lang.hitch(this,function(){
+				api.notify("Object save failed",'error');
+				}));
+				event.stop(evt);
+				evt.stopPropagation();
+				return false;
+				*/
+			},
+			_goToPreview: function() {
+				content.goTo('surveyAdvanced', {uid: this.object._id});
+			},
+			_setupButtons: function() {
+				// Setup button events
+				registry.byId("btnSave").on("click", lang.hitch(this, function(){
+					this.onSave(arguments);
+				}));
+				registry.byId("btnPreview").on("click", lang.hitch(this, function(){
+					this._goToPreview();
+				}));
+			},
+			/* Store code */
+			GetQuestion: function(_id) {
+				return this.questions.get(_id);
+			},
+			SetQuestion: function(question) {
+				return this.questions.put(question);
+			},
+			SyncStore: function() {
+			},
+			/* Browser code */
+			_createQuestionBrowser: function() { // TODO: Do all operations from the local store. Put querying routine in SyncStore()!
+				var getQuestions = function(self){
+					return questions = Deferred.when(store.query('_design/default/_view/by_type', {key:'Question'}), function(res){
+						self.questions.setData(res);	// Store queried questions in this.questions MemoryStore
+						return res;
+					});
+				};
 
+				Deferred.when(getQuestions(this), lang.hitch(this, function(questions){
+					questions.forEach(function(question){
+						this._insertQuestion(question)
+					}, this);
+				}), function(err){
+					throw "Questions could not be fetched. No connection or null query!";
+				});
+			},
+			_insertQuestion: function(question) {
+				var tabs = registry.byId("tabList");
+				for (var c in question.categories) {
+					var cat = question.categories[c];
+					var q = "div[data-category='"+cat+"']";
+					var catPane = query(q, tabs.containerNode)[0];
+					if (catPane) {
+						this._insertIntoCategory(question, catPane);
+					} else {
+						catPane = this._createCategoryTab(cat);
+						if (catPane) {
+							this._insertIntoCategory(question, catPane);
+						} else {
+							throw "Error: could not find or create category pane!";
+						}
+					}
+				}
+			},
+			_createCategoryTab: function(category) {
+				var tabs = registry.byId("tabList");
+				var newCat = new dijit.layout.ContentPane({
+					title: category,
+					postCreate: function(){
+						this.domNode.dataset["category"] = category;
+					}
+				});
+				newCat.domNode.id = "tab"+category;
+				tabs.addChild(newCat);
+				var q = "div[data-category='"+category+"']";
+				var pane = query(q, tabs.containerNode)[0];
+				return (pane) ? pane : false;
+			},
+			_insertIntoCategory: function(question, container) {
+				var selector = query(".rftSelector[data-topic='"+question.topic+"']", container)[0];
+				var selectorWidget;
+				if (selector) {
+					selectorWidget = registry.byNode(selector);
 
+				} else {
+					selectorWidget = new rft.ui.Selector({
+						topic: question.topic,
+						controller: this
+					});
+					selectorWidget.placeAt(container);
+				}
+				selectorWidget.addQuestion(question._id);
+			},
+			/* ListView code */
+			_createListView: function() {
+				this.listView = new SurveyListView({
+					controller: this
+				}).placeAt("SurveyListViewNode");
+			},
+			IncludeQuestion: function(_id) {
+				this.listView.insertItem(_id);
+			},
 
-        });
+		});
 });
 
Index: Dev/branches/rest-dojo-ui/client/rft/pages/surveyAdvanced.html
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/pages/surveyAdvanced.html	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/pages/surveyAdvanced.html	(revision 355)
@@ -0,0 +1,34 @@
+<div data-dojo-type="rft.pages.surveyAdvanced">
+	<div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'center'" style="height: 500px;">
+		<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
+			<h2>
+				<span class="rftIcon rftIconSurvey"></span>
+				<span class="headerText">Survey A [Design]</span>
+			</h2>
+		</div>
+		<div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="region:'left', design:'headline'" style="width: 300px;">
+			
+			<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'">
+				<div data-dojo-type="dijit.layout.AccordionContainer" class="blue">
+					<div data-dojo-type="dijit.layout.ContentPane" title="Content" data-dojo-props="iconClass:'rftIcon rftIconPlus'">
+						<div id="SurveyEditorToolkit" data-dojo-props="skipForm: true, accept:[], selfAccept: false, copyOnly: true, horizontal: false, singular: true">
+							
+						</div>
+					</div>
+				</div>
+			</div>
+			<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'bottom'">
+				<button id="btnSave" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconAccept'">Save</button>
+				<button id="btnDiscard" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconCancel'">Discard</button>
+				<button id="btnBack" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconUndo'">Exit Design</button>
+			</div>
+		</div>
+		<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'">
+			<div id="SurveyEditorPreview">
+				
+			</div>
+
+			<button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftLargeButton', iconClass: 'rftIcon rftIconPlus'">Add new</button>
+		</div>
+	</div>
+</div>
Index: Dev/branches/rest-dojo-ui/client/rft/pages/surveyAdvanced.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/pages/surveyAdvanced.js	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/pages/surveyAdvanced.js	(revision 355)
@@ -0,0 +1,57 @@
+define(['dojo/_base/declare',
+    'dojo/_base/lang',
+    'dojo/_base/Deferred',
+    'rft/ui/LineWithActionsWidget',
+    'rft/store',
+    'rft/ui/_Page',
+    'rft/api',
+    'rft/content',
+    'dijit/registry',
+    'dojo/on'],
+    function(declare, lang, Deferred, LineWithActionsWidget, store, _Page, api, content, registry, on){
+        return declare('rft.pages.surveyAdvanced', [_Page], {
+            object: null,
+            onVisit: function() {
+                if (this.pageArgs.uid) {
+                    Deferred.when(store.get(this.pageArgs.uid))
+                    .then(lang.hitch(this, function(obj) {
+                        this.object = obj;
+                    }));
+                } else {
+                    throw new Error("Error: no reference to object set!");
+                }
+
+                this._setupButtons();
+            },
+            onLeave: function() {
+                this.inherited(arguments);
+            },
+            _confirmSave: function() {
+                return confirm("Do you want to save?");
+            },
+            _saveSurvey: function() {
+            },
+            _restartEditor: function() {
+            },
+            _backToEditor: function() {
+                if (this._confirmSave()) {
+                    this._saveSurvey()
+                    content.goTo('survey', {uid: this.object._id}); 
+                } else {
+                    content.goTo('survey', {uid: this.object._id});
+                }
+            },
+            _setupButtons: function() {
+                registry.byId("btnSave").on("click", lang.hitch(this, function() {
+                    this._saveSurvey();
+                }));
+                registry.byId("btnDiscard").on("click", lang.hitch(this, function() {
+                    this._restartEditor();
+                }));
+                registry.byId("btnBack").on("click", lang.hitch(this, function() {
+                    this._backToEditor();
+                }));
+            }
+        });
+});
+
Index: Dev/branches/rest-dojo-ui/client/rft/ui/LineWithActionsWidget.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/LineWithActionsWidget.js	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/LineWithActionsWidget.js	(revision 355)
@@ -1,68 +1,87 @@
-define(['dojo/_base/declare','dojo/_base/lang','dojo/on','dojo/dom', 'dojo/dom-class', 'dijit/form/Button',
-    'dijit/_WidgetBase','dijit/_TemplatedMixin','dijit/_WidgetsInTemplateMixin',
-    'dojo/text!./templates/LineWithActionsWidget.html'
-    ],
-    function(declare,lang,on,dom,domClass,Button,_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,templateString){
-        return declare('rft.ui.LineWithActionsWidget',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin],{
-            templateString: templateString,
-            baseClass: 'rftLineWithButtons',
-            title: '',
-            modifiers: "blue",
-            userObject: null,
-            actions: {},
-            postCreate: function() {
-                dom.setSelectable(this.domNode, false);
-                on(this.titleNode,'click',lang.hitch(this,'_onClick'));
-            },
-            startup: function() {
-                this.inherited(arguments);
-                this._setupActions();
-                domClass.add(this.domNode, this.modifiers);
-                this.refresh();
-            },
-            _setupActions: function() {
-                for (var action in this.actions) {
-                    var properties;
-                    if (this.actions[action].properties.blockButton == true) {  // BlockButton
-                        properties = lang.mixin({
-                            baseClass: 'rftBlockButton',
-                            modifiers: this.modifiers,
-                            label: "Default",
-                            iconClass: 'rftIcon rftIcon'+this.actions[action].properties.icon,
-                            title: action,
-                            onClick: lang.hitch(this, this.actions[action].callback)
-                        }, this.actions[action].properties);
-                        properties["class"] = properties.modifiers;
-                        new Button(properties).placeAt(this.buttonsNode);
-                    } else {    //InlineButton
-                        properties = lang.mixin({
-                            baseClass: 'rftInlineButton',
-                            modifiers: 'black',
-                            label: "Default",
-                            showLabel: false,
-                            iconClass: 'rftIcon rftIcon'+this.actions[action].properties.icon,
-                            title: action,
-                            onClick: lang.hitch(this, this.actions[action].callback)
-                        }, this.actions[action].properties);
-                        properties["class"] = properties.modifiers;
-                        new Button(properties).placeAt(this.buttonsNode);
-                    }
-                }
-            },
-            refresh: function() {
-                this.titleNode.innerHTML = this.title;
-            },
-            _onClick: function(e){
-                var preventDefault = this.onClick(e) === false;
-                if(preventDefault){
-                    e.preventDefault();
-                }
-                return !preventDefault;
-            },
-            onClick: function(e) {},
-            _setTitleAttr: function(value){
-                this.title = value;
-                this.refresh();
-            }
-        });
-    });
+define(['dojo/_base/declare',
+	'dojo/_base/lang',
+	'dojo/on',
+	'dojo/dom',
+	'dojo/_base/event',
+	'dojo/dom-class',
+	'dijit/form/Button',
+	'dijit/_WidgetBase',
+	'dijit/_TemplatedMixin',
+	'dijit/_WidgetsInTemplateMixin',
+	'dojo/text!./templates/LineWithActionsWidget.html'
+	],
+	function(declare,lang,on,dom,event,domClass,Button,_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,templateString){
+		return declare('rft.ui.LineWithActionsWidget',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin],{
+			templateString: templateString,
+			baseClass: 'rftLineWithButtons',
+			title: '',
+			modifiers: "blue",
+			selectable: false,
+			userObject: null,
+
+			actions: {},
+			postCreate: function() {
+				dom.setSelectable(this.domNode, false); // Text selection, has nothing to do with object selection!
+				on(this.domNode,'click',lang.hitch(this,'_onClick'));
+			},
+			startup: function() {
+				this.inherited(arguments);
+				this._setupActions();
+				domClass.add(this.domNode, this.modifiers);
+				this.refresh();
+			},
+			_setupActions: function() {
+				for (var action in this.actions) {
+					var properties;
+					if (this.actions[action].properties.blockButton == true) {
+						properties = lang.mixin({
+							baseClass: 'rftBlockButton',
+							modifiers: this.modifiers,
+							label: "Default",
+							iconClass: 'rftIcon rftIcon'+this.actions[action].properties.icon,
+							title: action,
+							onClick: lang.hitch(this, function(e){
+								lang.hitch(this, this.actions[action].callback )(e);
+								event.stop(e);
+								return false;
+							})
+						}, this.actions[action].properties);
+						properties["class"] = properties.modifiers;
+						new Button(properties).placeAt(this.buttonsNode);
+					} else {
+						properties = lang.mixin({
+							baseClass: 'rftInlineButton',
+							modifiers: 'black',
+							label: "Default",
+							showLabel: false,
+							iconClass: 'rftIcon rftIcon'+this.actions[action].properties.icon,
+							title: action,
+							onClick: lang.hitch(this, function(e){
+								lang.hitch(this, this.actions[action].callback)(e);
+								event.stop(e);
+								return false;
+							})
+						}, this.actions[action].properties);
+						properties["class"] = properties.modifiers;
+						new Button(properties).placeAt(this.buttonsNode);
+					}
+				}
+			},
+			refresh: function() {
+				this.titleNode.innerHTML = this.title;
+			},
+			_onClick: function(e){
+				var preventDefault = this.onClick(e) === false;
+				if (preventDefault) {
+					event.stop(e);
+				}
+				return !preventDefault;
+			},
+			onClick: function(e) {
+			},
+			_setTitleAttr: function(value){
+				this.title = value;
+				this.refresh();
+			}
+		});
+});
Index: Dev/branches/rest-dojo-ui/client/rft/ui/Selector.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/Selector.js	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/Selector.js	(revision 355)
@@ -1,4 +1,6 @@
 define([
     'dojo/_base/declare',
+    'dojo/_base/array',
+    'dijit/registry',
     'dojo/_base/lang',
     'dojo/fx',
@@ -12,4 +14,6 @@
     ],function(
         declare,
+        baseArray,
+        registry,
         lang,
         fx,
@@ -24,17 +28,21 @@
         return declare('rft.ui.Selector',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_Container],{
             templateString: templateString,
-            title: "The professional as a participant",
+            title: "ERROR: NULL_TOPIC",
             baseClass: 'rftSelector',
             modifiers: 'blue',
+            currentlySelectedId: null,
+            controller: null,   // Use events/pubsub instead of a controller variable? Decoupling!
+
             postCreate: function() {
                 domClass.add(this.domNode, this.modifiers);
                 domClass.add(this.selectedColorNode, "pending");
-                
+                this.domNode.dataset["topic"] = this.topic;
+
                 new LineWithActionsWidget({
-                    title: this.title,
+                    title: this.topic,
                     modifiers: this.modifiers,
                     actions: {
                         "AddToSurvey" : {
-                            callback: function(arg){},
+                            callback: lang.hitch(this, this.includeQuestion),
                             properties: {
                                 blockButton: true,
@@ -46,5 +54,5 @@
                     }
                 },this.titleNode);
-                
+
                 this.selectorLine = new LineWithActionsWidget({
                     title: 'None',
@@ -63,5 +71,6 @@
                 },this.selectedItemNode);
             },
-            _toggleDropdown: function(selectorLine) {
+            _toggleDropdown: function() {
+
                 var node = this.optionsNode;
                 var show = fx.wipeIn({
@@ -94,22 +103,60 @@
                 };
             },
-            addQuestion: function(question) {
-                new LineWithActionsWidget({
-                    title: question.title,
-                    question: question,
-                    actions: {
-                        "InfoHover" : {
-                            callback: this.infoFunction,
-                            properties: {
-                                blockButton: false,
-                                showLabel: false,
-                                icon: "Inspect"
+            addQuestion: function(questionId) {
+                var question = this.controller.GetQuestion(questionId);
+                if (question) {
+                    var w = new LineWithActionsWidget({
+                        title: question.title,
+                        questionId: questionId,
+                        actions: {
+                            "InfoHover" : {
+                                callback: dojo.partial(this.infoFunction, this),
+                                properties: {
+                                    blockButton: false,
+                                    showLabel: false,
+                                    icon: "Inspect"
+                                }
                             }
                         }
-                    }
-                }).placeAt(this.optionsNode);
+                    });
+                    w.placeAt(this.optionsNode);
+                    w.on("Click", lang.hitch(this, function(){
+                        this.selectQuestion(questionId);
+                        this._toggleDropdown();
+                    }, questionId));
+
+                }    
             },
-            infoFunction: function(){
-                alert("Some info here!");text
+            infoFunction: function(selector) {
+                var question = selector.controller.GetQuestion(this.questionId);
+                console.log(question);
+                alert("Some info here!");
+            },
+            includeQuestion: function() {
+                if (this.currentlySelectedId) {
+                    this.controller.IncludeQuestion(this.currentlySelectedId)
+                } else {
+                    return false;
+                }
+            },
+            selectQuestion: function(questionId) {
+                /* TODO: TEST THOROUGHLY! */
+                var question = this.controller.GetQuestion(questionId);
+                if (question) {
+                    this.currentlySelectedId = questionId;
+                    this.selectorLine.questionId = questionId;
+                    this.selectorLine.set("title", question.title);
+                    // Iterate through optionsNode, add "selected" class to currently selected node
+                    baseArray.forEach(this.optionsNode.childNodes, function(node, index){
+                        var line = registry.byNode(node);
+                        if (line) {
+                            if (line.questionId == this.currentlySelectedId) {
+                                domClass.add(line.domNode, "inheritBgColor light");
+                            } else {
+                                domClass.remove(line.domNode, "inheritBgColor light");
+                            }
+                        }
+                    }, this);
+                }
             }
         });
Index: Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditor.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditor.js	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditor.js	(revision 355)
@@ -0,0 +1,28 @@
+define([
+	'dojo/_base/declare',
+	'rft/ui/SurveyEditorPreview'
+	], function(declare, SurveyEditorPreview) {
+		return declare("rft.ui.SurveyEditor", [], {
+
+	//Properties
+	/* This class will coordinate between the SurveyEditorPreview and SurveyEditorToolkit (in both the SurveyEditor.html and QuestionEditor.html, if at all possible!)
+		It will keep the list of SurveyContent that is currently included and configured, and pass this to the aforementioned instances so they can display this and allow the user to interact.
+		It will need to either expose a bunch of method calls that the two subclasses can call when the user performs an action, or it will have to listen to their events.
+		*/
+		postCreate: function(){
+			this.preview = new SurveyEditorPreview({}).placeAt("surveyEditorPreviewNode");
+			this.preview.startup();
+			/* NOT DEFINED YET
+			this.toolkit = new SurveyEditorToolkit({}).placeAt("surveyEditorToolkitNode");
+			this.toolkit.startup();
+			*/
+		},
+
+		loadSurveyContent: function() {
+			// 1. Get data from server on startup.
+			// 2. Pass this data to toolkit and preview so they can update the visual representation.
+			debugger;
+		}
+
+	});
+});
Index: Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorPreview.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorPreview.js	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorPreview.js	(revision 355)
@@ -0,0 +1,84 @@
+define([
+	'dojo/_base/declare',
+	'dojo/_base/lang',
+	'dojo/_base/array',
+	'dijit/_WidgetBase',
+	'dijit/_Container',
+	'dojo/dom-construct',
+	'dojo/store/Memory',
+	'rft/ui/SurveyEditorPreviewItem',
+	'dijit/_TemplatedMixin',
+	'dijit/_WidgetsInTemplateMixin',
+	'dojo/text!./templates/SurveyEditorPreview.html'
+	], function(declare, lang, baseArray, _WidgetBase, _Container, domConstruct, Memory, SurveyEditorPreviewItem, _TemplatedMixin, _WidgetsInTemplateMixin, template) {
+		return declare("rft.ui.SurveyEditorPreview", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _Container], {
+
+			templateString: template,
+			store: null,
+			dndSource: null,
+
+			postCreate: function(){
+				this.dndSource = new dojo.dnd.Source(this.dndSourceNode, {
+					isSource: true,
+					//accept: ["editorToolkitItem", "editorPreviewItem"],
+					horizontal: false,
+					withHandles: false,
+					copyOnly: false,
+					selfCopy: false,
+					selfAccept: true,
+					delay: 0,
+					skipForm: true,
+					parent: this.dndSourceContainerNode,
+					creator: lang.hitch(this, this._sourceCreatorMethod)
+				});
+				this.dndSource.startup();
+
+				this.store = new Memory({
+					data: [],
+					idProperty: "code"
+				});
+			},
+			_sourceCreatorMethod: function(item, hint){
+				switch(hint){
+					case "avatar":
+					var node = document.createElement("div");
+					node.innerHTML = item.title || "Dragging!!!";
+					item.node = node;
+					break;
+					default:
+					var widget = new rft.ui.SurveyEditorPreviewItem({
+						data: item.data,
+						type: item.type
+					});
+					item.node = widget.domNode;
+					break;					
+				}
+				console.log(item);
+				return item;
+
+				
+				/* TODO: Create widgetFactory method that handles creation of PreviewItem Dialogs and Views */
+			},
+			
+			InsertObjects: function(/*Array*/objects) {
+				// This takes an array of objects {data:{//props}, type:[//types]}. Node is NOT included!
+				objects.forEach(function(item){
+					this.dndSource.insertNodes(false, [item]);
+				}, this);
+			},
+
+			RemoveObject: function(widget) {
+			},
+			GetNodeList: function() {
+				return this.dndSource.getAllNodes();
+			},
+			onDropInternal: function() {
+				topic.publish("/SurveyEditor/Preview/MoveItem");
+			},
+			onDropExternal: function() {
+				// This is fired when something from the Toolkit is dropped into the Preview -- add operation.
+				topic.publish("/SurveyEditor/Preview/AddItem");
+			}
+
+		});
+});
Index: Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorPreviewItem.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorPreviewItem.js	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorPreviewItem.js	(revision 355)
@@ -0,0 +1,58 @@
+define([
+	'dojo/_base/declare',
+	'dojo/_base/fx',
+	'dijit/_WidgetBase',
+	'dojo/dom-class',
+	'dojo/_base/lang',
+	'dijit/_TemplatedMixin',
+	'dijit/_WidgetsInTemplateMixin',
+	'dojo/text!./templates/SurveyEditorPreviewItem.html',
+	], function(declare, fx, _WidgetBase, domClass, lang, _TemplatedMixin, _WidgetsInTemplateMixin, templateFull) {
+		return declare("rft.ui.SurveyEditorPreviewItem", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin], {
+
+			version: "full",
+			templateString: templateFull,
+			baseClass: "surveyEditorPreviewItem",
+			previousContentHeight: 200,
+			innerWidget: null,
+			foldDuration: [250, 250],
+			animation: null,
+			
+			postCreate: function() {
+				this.foldButtonNode.onClick = lang.hitch(this, this.toggleFold);
+			},
+			toggleFold: function() {
+				if (!this.animation) {
+					if (!domClass.contains(this.domNode, "fold")) {
+						this.previousContentHeight = dojo.marginBox(this.innerNode).h;
+						this.animation = fx.animateProperty({
+							node: this.innerNode,
+							duration: this.foldDuration[0],
+							properties: {
+								height: 1						
+							},
+							onEnd: lang.hitch(this, function(){
+								domClass.add(this.domNode, "fold");
+								this.animation = null;
+							})
+						}).play();
+						this.foldButtonNode.iconNode.className = this.foldButtonNode.iconNode.className.replace("rftIconHalfArrowUp", "rftIconHalfArrowDown");
+					} else {
+						this.animation = fx.animateProperty({
+							node: this.innerNode,
+							duration: this.foldDuration[1],
+							properties: {
+								height: this.previousContentHeight				
+							},
+							onEnd: lang.hitch(this, function(){
+								domClass.remove(this.domNode, "fold");
+								this.animation = null;
+							})
+						}).play();
+						this.foldButtonNode.iconNode.className = this.foldButtonNode.iconNode.className.replace("rftIconHalfArrowDown", "rftIconHalfArrowUp");
+					}
+				}
+			},
+
+		});
+});
Index: Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorToolkit.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorToolkit.js	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/SurveyEditorToolkit.js	(revision 355)
@@ -0,0 +1,88 @@
+define([
+	'dojo/_base/declare',
+	'dojo/_base/lang',
+	'dojo/_base/array',
+	'dijit/_WidgetBase',
+	'dijit/_Container',
+	'dojo/dom-construct',
+	'dojo/store/Memory',
+	'rft/ui/SurveyEditorPreviewItem',
+	'dijit/_TemplatedMixin',
+	'dijit/_WidgetsInTemplateMixin',
+	'dojo/text!./templates/SurveyEditorPreview.html'
+	], function(declare, lang, baseArray, _WidgetBase, _Container, domConstruct, Memory, SurveyEditorPreviewItem, _TemplatedMixin, _WidgetsInTemplateMixin, template) {
+		return declare("rft.ui.SurveyEditorToolkit", [_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, _Container], {
+
+			templateString: template,
+			store: null,
+			dndSource: null,
+
+			postCreate: function(){
+				this.dndSource = new dojo.dnd.Source(this.dndSourceNode, {
+					isSource: true,
+					//accept: ["editorToolkitItem", "editorPreviewItem"],
+					horizontal: false,
+					withHandles: false,
+					copyOnly: false,
+					selfCopy: false,
+					selfAccept: true,
+					delay: 0,
+					skipForm: true,
+					parent: this.dndSourceContainerNode,
+					creator: lang.hitch(this, this._sourceCreatorMethod)
+				});
+				this.dndSource.startup();
+
+				this.store = new Memory({
+					data: [],
+					idProperty: "code"
+				});
+			},
+			_sourceCreatorMethod: function(item, hint){
+				switch(hint){
+					case "avatar":
+					debugger;
+					var node = document.createElement("div");
+					node.innerHTML = item.title || "Dragging!!!";
+					item.node = node;
+					break;
+					default:
+					var widget = new rft.ui.SurveyEditorPreviewItem({
+						data: item.data,
+						title: (item.data.title || "Untitled"),
+						description: (item.data.description || "No description"),
+						type: item.type,
+						code: item.data.code
+					});
+					item.node = widget.domNode;
+					break;					
+				}
+				console.log(item);
+				return item;
+
+				
+				/* TODO: Create widgetFactory method that handles creation of PreviewItem Dialogs and Views */
+			},
+			
+			InsertObjects: function(/*Array*/objects) {
+				// This takes an array of objects {data:{//props}, type:[//types]}. Node is NOT included!
+				objects.forEach(function(item){
+					this.dndSource.insertNodes(false, [item]);
+				}, this);
+			},
+
+			RemoveObject: function(widget) {
+			},
+			GetNodeList: function() {
+				return this.dndSource.getAllNodes();
+			},
+			onDropInternal: function() {
+				topic.publish("/SurveyEditor/Preview/MoveItem");
+			},
+			onDropExternal: function() {
+				// This is fired when something from the Toolkit is dropped into the Preview -- add operation.
+				topic.publish("/SurveyEditor/Preview/AddItem");
+			}
+
+		});
+});
Index: Dev/branches/rest-dojo-ui/client/rft/ui/SurveyListView.js
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/SurveyListView.js	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/SurveyListView.js	(revision 355)
@@ -0,0 +1,156 @@
+define([
+	'dojo/_base/declare',
+	'dijit/_WidgetBase',
+	'dijit/_TemplatedMixin',
+	'dojo/_base/lang',
+	'dojo/fx',
+	'dojo/_base/fx',
+	'dijit/_WidgetsInTemplateMixin',
+	'dijit/_Container',
+	'rft/ui/LineWithActionsWidget',
+	'dojo/text!./templates/SurveyListView.html'
+	],function(
+		declare,
+		_WidgetBase,
+		_TemplatedMixin,
+		lang,
+		fx,
+		baseFx,
+		_WidgetsInTemplateMixin,
+		_Container,
+		LineWithActionsWidget,
+		templateString
+		){
+		return declare('rft.ui.SurveyListView',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_Container],{
+			templateString: templateString,
+			baseClass: 'rftSurveyListView',
+			source: null,
+			controller: null,
+			region: 'center',
+
+			postCreate: function() {
+				if (this.title) {
+					this.titleNode.innerHTML = this.title;
+				} else {
+					this.domNode.removeChild(this.titleNode);
+				}
+
+				this.source = new dojo.dnd.Source(this.sourceNode, {
+					isSource: true,
+					accept: ["SurveyListViewItem"],
+					horizontal: false,
+					withHandles: false,
+					copyOnly: false,
+					selfCopy: false,
+					selfAccept: true,
+					delay: 0,
+					singular: true,
+					creator: dojo.partial(this.creatorMethod, this.controller, this)
+				});
+
+				new dijit.form.Button({
+					label: "Move up",
+					showLabel: false,
+					iconClass: "rftIcon rftIconFullArrowUp",
+					baseClass: "rftBlockButton",
+					class: "trans",
+					onClick: lang.hitch(this, function() {
+						this.moveItem("up");
+					})
+				}, this.btnListMoveUp);
+
+				new dijit.form.Button({
+					label: "Move down",
+					showLabel: false,
+					iconClass: "rftIcon rftIconFullArrowDown",
+					baseClass: "rftBlockButton",
+					class: "trans",
+					onClick: lang.hitch(this, function() {
+						this.moveItem("down");
+					})
+				}, this.btnListMoveDown);
+			},
+			creatorMethod: function(controller, listView, item, hint) {
+				var node,
+				object = controller.GetQuestion(item);
+				if (!object) {
+					return false;
+				}
+
+				if (hint == "avatar") {
+					node = document.createElement("div");
+					node.className = "dragAvatar";
+					node.innerHTML = object.title;
+				} else {
+					var w = new LineWithActionsWidget({
+						title: object.title,
+						class: "inheritBgColor",
+						actions: {
+							"Remove" : {
+								callback: lang.hitch(listView, function(){
+									source.removeItem(evt);
+								}),
+								properties: {
+									blockButton: false,
+									icon: "Delete",
+									modifiers: "white",
+									label: "Remove"
+								}
+							},
+							"Info" : {
+								callback: function(){
+									var question = controller.GetQuestion(item);
+									console.log(question);
+									alert("info goes here yo!");
+								},
+								properties: {
+									blockButton: false,
+									icon: "Inspect",
+									modifiers: "white",
+									label: "Show info"
+								}
+							}
+						}
+					});
+					w.startup();
+					node = w.domNode;
+				}
+				var fullItem = {node: node, data: item, type: "SurveyListviewItem"}
+				return fullItem;
+			},
+			moveItem: function(dir) {
+				var node = this.source.getSelectedNodes()[0];
+				if (node) {
+					if (dir == "up") {
+						if (node.previousSibling) {
+							return node.parentNode.insertBefore(node, node.previousSibling);
+						} else {
+							return false;
+						}
+
+					} else if (dir == "down") {
+						if (node.nextSibling) {
+							return node.parentNode.insertBefore(node.nextSibling, node);
+						} else {
+							return false;
+						}
+					} else {
+						throw "Invalid move direction passed!";
+					}
+				} else {
+					return false;
+				}
+			},
+			insertItem: function(objectId) {
+				var anchor = this.source.getSelectedNodes()[0];
+				if (anchor) {
+					this.source.insertNodes(false, [objectId], false, anchor);
+				} else {
+					this.source.insertNodes(false, [objectId]);
+				}
+			},
+			removeItem: function(evt){
+
+			}
+		});
+});
Index: Dev/branches/rest-dojo-ui/client/rft/ui/templates/LineWithActionsWidget.html
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/templates/LineWithActionsWidget.html	(revision 354)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/templates/LineWithActionsWidget.html	(revision 355)
@@ -1,3 +1,3 @@
-<div class="${baseClass}">
+<div class="${baseClass} inheritBgColor">
     <span class="${baseClass}Title" data-dojo-attach-point="titleNode"></span>
     <span class="${baseClass}Buttons" data-dojo-attach-point="buttonsNode"></span>
Index: Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyEditorPreview.html
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyEditorPreview.html	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyEditorPreview.html	(revision 355)
@@ -0,0 +1,8 @@
+<div>
+	<div data-dojo-attach-point="windowNode" class="surveyEditorPreview">
+		<div data-dojo-attach-point="dndSourceNode">
+			<h2>Preview:</h2>
+			<div data-dojo-attach-point="dndSourceContainerNode" class="surveyEditorPreviewSource"></div>
+		</div>
+	</div>
+</div>
Index: Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyEditorPreviewItem.html
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyEditorPreviewItem.html	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyEditorPreviewItem.html	(revision 355)
@@ -0,0 +1,24 @@
+<div class="inheritBgColor light">
+	<div class="topBorder inheritBgColor light" data-dojo-attach-point="topBorderNode">
+		<span class="title" data-dojo-attach-point="titleNode">Default title</span>
+		<span class="floatRight">
+			<button class="blue" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', showLabel: false, iconClass: 'rftIcon rftIconHalfArrowUp'" data-dojo-attach-point="foldButtonNode">Fold</button>
+			<button class="blue" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', showLabel: false, iconClass: 'rftIcon rftIconDelete'">Remove</button>
+		</span>
+	</div>
+	
+	<div class="surveyEditorPreviewItemInner" data-dojo-attach-point="innerNode">
+		<div class="surveyEditorPreviewItemContent inheritBgColor" data-dojo-attach-point="containerNode">
+			Content goes here.<br/>
+			This is content.<br/><br/>
+			This is some more content. <br/>
+			And the last bit.
+		</div>
+	</div>
+	
+	<div class="bottomBorder inheritBgColor light" data-dojo-attach-point="bottomBorderNode">
+		<span class="floatRight">
+			<button class="trans" data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', iconClass: 'rftIcon rftIconEdit'">Edit</button>
+		</span>
+	</div>
+</div>
Index: Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyListView.html
===================================================================
--- Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyListView.html	(revision 355)
+++ Dev/branches/rest-dojo-ui/client/rft/ui/templates/SurveyListView.html	(revision 355)
@@ -0,0 +1,11 @@
+<div>
+	<h3 data-dojo-attach-point="titleNode"></h3>
+	<div data-dojo-attach-point="sourceNode" id="DERPDERP" class="${baseClass}Content"></div>
+	<div data-dojo-attach-point="buttonsNode" class="floatRight">
+		<span>Move selected: </span>
+		<button data-dojo-attach-point="btnListMoveUp" ></button>
+		<button data-dojo-attach-point="btnListMoveDown"></button>
+	</div>
+	<div data-dojo-attach-point="containerNode">
+	</div>
+</div>
