Changeset 342

Timestamp:

06/14/12 18:34:52 (13 years ago)

Author:

tjcschipper

Message:

• Fixed callbacks/actions in LineWithActionsWidgetThijs?.js. Previously an onClick event would not fire the correct callback. They were also incorrectly bound to the context of the widget, so the this keyword referred to the properties object instead of the LineWithActions?.
• Changed a bunch of stuff in CSS files, general layout.
• Added another mockup page to show the Session selection page.

Location:

Dev/branches/rest-dojo-ui/client

Files:

• mSessions.html (added)
• mSurvey.html (added)
• rft/css/images/icons/rftIcons16.png (modified) (previous)
• rft/css/images/icons/rftIcons16black.png (modified) (previous)
• rft/css/images/icons/rftIcons24.png (modified) (previous)
• rft/css/images/icons/rftIcons32.png (modified) (previous)
• rft/css/layout.css (modified) (2 diffs)
• rft/css/rftButtons.css (modified) (2 diffs)
• rft/css/rftIcons.css (modified) (1 diff)
• rft/css/rftSelector.css (modified) (2 diffs)
• rft/ui/LineWithActionsWidgetThijs.js (modified) (3 diffs)
• rft/ui/SelectorThijs.js (modified) (4 diffs)
• rft/ui/templates/List.html (modified) (1 diff)

Dev/branches/rest-dojo-ui/client/rft/css/layout.css

@@ -45 +45 @@
     /* Section headers */
     font-size: 18px;
+    margin: 0 0 4px 0;
 }
 .claro h4 {
@@ -69 +70 @@
     height: 16px;
     line-height: 16px;
+    margin: 0 0 4px 0;
 }
 .claro .breadcrumbs .breadcrumb {

Dev/branches/rest-dojo-ui/client/rft/css/rftButtons.css

@@ -63 +63 @@
 }
 .claro .rftBlockButton .rftIcon {
-    height: 16px;
-    width: 16px;
-    background-image: url('images/icons/rftIcons16.png');
+    height: 16px !important;
+    width: 16px !important;
+    background-image: url('images/icons/rftIcons16.png') !important;
+    margin-right: 4px !important;
 }
 .claro .rftBlockButton.rftBlockButtonHover .rftIcon {
-    background-image: url('images/icons/rftIcons16black.png');
+    background-image: url('images/icons/rftIcons16black.png') !important;
 }
 .claro .rftBlockButton.rftBlockButtonHover .dijitButtonNode {
@@ -113 +114 @@
     color: #993dec;
 }
-
+.claro .rftBlockButton.trans .dijitButtonNode {
+    background: transparent;
+}
+.claro .rftBlockButton.trans.rftBlockButtonHover .dijitButtonNode {
+    background: #ffffff !important;
+    color: #000000;
+}
 
 /* InlineButton */

Dev/branches/rest-dojo-ui/client/rft/css/rftIcons.css

@@ -34 +34 @@
     background-position: -64px 0px;
 }
-.rftIconSurvey {
+.rftIconSessionActive {
     background-position: -96px 0px;
 }
-.rftIconQuestion {
+.rftIconSessionTemplate {
     background-position: -128px 0px;
 }
-.rftIconQuestionAlt {
+.rftIconSurvey {
     background-position: -160px 0px;
 }
-.rftIconAccept {
+.rftIconQuestion {
     background-position: -192px 0px;
 }
-.rftIconCancel {
+.rftIconQuestionFill {
     background-position: -224px 0px;
 }
-.rftIconDelete {
+.rftIconRespondent {
     background-position: -256px 0px;
 }
-.rftIconHome {
+.rftIconAnswer {
     background-position: -288px 0px;
 }
-.rftIconPreview {
+.rftIconAnswerSet {
     background-position: -320px 0px;
 }
-.rftIconSave {
+.rftIconGameData {
     background-position: -352px 0px;
 }
-.rftIconSettings {
+.rftIconUser {
     background-position: -384px 0px;
 }
-.rftIconUndo {
+.rftIconAccept {
     background-position: -416px 0px;
 }
-.rftIconPrevious {
+.rftIconCancel {
     background-position: -448px 0px;
 }
-.rftIconNext {
+.rftIconPlus {
     background-position: -480px 0px;
 }
-.rftIconHalfArrowUp {
+.rftIconMinus {
     background-position: -512px 0px;
 }
-.rftIconHalfArrowDown {
+.rftIconIncrease {
     background-position: -544px 0px;
 }
-.rftIconHalfArrowLeft {
+.rftIconDecrease {
     background-position: -576px 0px;
 }
-.rftIconHalfArrowRight {
+.rftIconDelete {
     background-position: -608px 0px;
 }
-.rftIconFullArrowUp {
+.rftIconHome {
     background-position: -640px 0px;
 }
-.rftIconFullArrowDown {
+.rftIconPreview {
     background-position: -672px 0px;
 }
-.rftIconFullArrowLeft {
+.rftIconSave {
     background-position: -704px 0px;
 }
-.rftIconFullArrowRight {
+.rftIconDiscard {
     background-position: -736px 0px;
 }
-.rftIconHelp {
+.rftIconSettings {
     background-position: -768px 0px;
 }
-.rftIconInspect {
+.rftIconUndo {
     background-position: -800px 0px;
 }
-.rftIconMinus {
+.rftIconRedo {
     background-position: -832px 0px;
 }
-.rftIconPlus {
+.rftIconBack {
     background-position: -864px 0px;
 }
-
-/*  The following do not yet have an icon and are displaced a bit to make room for possible extra inlineIcons.
-    The reserved offsets are:  896, 928, 960, 992, 1024, 1056 and 1088 */
-.rftIconRespondent {
+.rftIconForward {
+    background-position: -896px 0px;
+}
+.rftIconRefresh {
+    background-position: -928px 0px;
+}
+.rftIconHelp {
+    background-position: -960px 0px;
+}
+.rftIconInspect {
+    background-position: -992px 0px;
+}
+.rftIconFullArrowUp {
+    background-position: -1024px 0px;
+}
+.rftIconFullArrowDown {
+    background-position: -1056px 0px;
+}
+.rftIconFullArrowLeft {
+    background-position: -1088px 0px;
+}
+.rftIconFullArrowRight {
     background-position: -1120px 0px;
 }
-.rftIconAnswerSet {
+.rftIconHalfArrowUp {
     background-position: -1152px 0px;
 }
-.rftIconAnswer {
+.rftIconHalfArrowDown {
     background-position: -1184px 0px;
 }
-.rftIconGameData {
+.rftIconHalfArrowLeft {
     background-position: -1216px 0px;
 }
+.rftIconHalfArrowRight {
+    background-position: -1248px 0px;
+}

Dev/branches/rest-dojo-ui/client/rft/css/rftSelector.css

@@ -56 +56 @@
     color: #ffffff;
 }
+.claro .rftLineWithButtons.trans {
+    background-color: transparent;
+    color: #ffffff;
+}
 
 /* Background colour settings for the various contexts of rftLineWithButtons */
@@ -103 +107 @@
     background-color: #00ff00;
 }
+
+/* rftSessionBar */
+.claro .rftSessionBar {
+    margin: 8px 0;
+}
+.claro .rftSessionBar .rftIcon.typeIcon {
+    background-image: url('images/icons/rftIcons32.png');
+    height: 32px;
+    width: 32px;
+    margin: 20px 8px;
+    float: left;
+}
+.claro .rftSessionBar .rftLineWithButtons {
+    margin: 0;
+    padding: 0;
+}

Dev/branches/rest-dojo-ui/client/rft/ui/LineWithActionsWidgetThijs.js

@@ -28 +28 @@
                             baseClass: 'rftBlockButton',
                             modifiers: this.modifiers,
-                            label: action,
-                            iconClass: 'rftIcon rftIcon'+action,
+                            label: "Default",
+                            iconClass: 'rftIcon rftIcon'+this.actions[action].properties.icon,
                             title: action,
-                            onClick: lang.hitch(this, function(){
-                                this.actions[action].callback(this.userObject);
-                            })
-                        },
-                        this.actions[action].properties);
+                            onClick: lang.hitch(this, this.actions[action].callback)
+                        }, this.actions[action].properties);
                         properties["class"] = properties.modifiers;
                         new Button(properties).placeAt(this.buttonsNode);
@@ -42 +39 @@
                             baseClass: 'rftInlineButton',
                             modifiers: 'black',
+                            label: "Default",
                             showLabel: false,
-                            iconClass: 'rftIcon rftIcon'+action,
+                            iconClass: 'rftIcon rftIcon'+this.actions[action].properties.icon,
                             title: action,
-                            onClick: lang.hitch(this, function(){
-                                this.actions[action].callback(this.userObject);
-                            })
-                        },
-                        this.actions[action].properties);
+                            onClick: lang.hitch(this, this.actions[action].callback)
+                        }, this.actions[action].properties);
                         properties["class"] = properties.modifiers;
                         new Button(properties).placeAt(this.buttonsNode);
@@ -65 +60 @@
                 return !preventDefault;
             },
-            onClick: function(e) {}
+            onClick: function(e) {},
+            _setTitleAttr: function(value){
+                this.title = value;
+                this.refresh();
+            }
         });
     });

Dev/branches/rest-dojo-ui/client/rft/ui/SelectorThijs.js

@@ -37 +37 @@
                     modifiers: this.modifiers,
                     actions: {
-                        "Accept" : {
+                        "AddToSurvey" : {
                             callback: function(arg){},
                             properties: {
                                 blockButton: true,
-                                modifiers: this.modifiers
+                                modifiers: this.modifiers,
+                                icon: "Accept",
+                                label: "Include"
                             }
                         }
@@ -50 +52 @@
                     modifiers: this.modifiers,
                     actions: {
-                        "HalfArrowDown" : {
+                        "ToggleDropdown" : {
                             callback: lang.hitch(this,function(){
                                 var node = this.optionsNode;
@@ -87 +89 @@
                                 blockButton: true,
                                 modifiers: this.modifiers,
-                                showLabel: false
+                                showLabel: false,
+                                icon: "HalfArrowDown"
                             }
                         }
@@ -95 +98 @@
                     title: 'Are there direct colleagues among the other participants?',
                     actions: {
-                        "Inspect" : {
+                        "InfoHover" : {
                             callback: infoFunction,
                             properties: {
                                 blockButton: false,
-                                showLabel: false
+                                showLabel: false,
+                                icon: "Inspect"
                             }
                         }

Dev/branches/rest-dojo-ui/client/rft/ui/templates/List.html

@@ -1 +1 @@
 <div>
     <div data-dojo-attach-point="containerNode"></div>
-    <div>
-        <span>Move selected</span>
-        <button data-dojo-type="dijit.form.Button">Up</button>
-        <button data-dojo-type="dijit.form.Button">Down</button>
+    <div style="float: right;">
+        <span>Move selected: </span>
+        <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', iconClass:'rftIcon rftIconFullArrowUp'" class="trans"></button>
+        <button data-dojo-type="dijit.form.Button" data-dojo-props="baseClass: 'rftBlockButton', iconClass:'rftIcon rftIconFullArrowDown'" class="trans"></button>
     </div>
 </div>