Ignore:
Timestamp:
09/03/12 18:14:37 (13 years ago)
Author:
hendrikvanantwerpen
Message:

Lots of small fixes.

Make it possible to read survey answers (when a question code is
provided), it is now displayed in place of the survey. More to come.

Some whitespace fixes.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • Dev/branches/rest-dojo-ui/client/rft/ui/Selector.js

    r405 r406  
    1313    'dojo/text!./templates/Selector.html',
    1414    'dojo/dom-class',
    15     ],function(
    16         declare,
    17         baseArray,
    18         registry,
    19         lang,
    20         event,
    21         fx,
    22         _WidgetBase,
    23         _TemplatedMixin,
    24         _WidgetsInTemplateMixin,
    25         _Container,
    26         LineWithActionsWidget,
    27         templateString,
    28         domClass
    29         ){
    30         return declare('rft.ui.Selector',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_Container],{
    31             templateString: templateString,
    32             baseClass: 'rftSelector',
     15],function(
     16    declare,
     17    baseArray,
     18    registry,
     19    lang,
     20    event,
     21    fx,
     22    _WidgetBase,
     23    _TemplatedMixin,
     24    _WidgetsInTemplateMixin,
     25    _Container,
     26    LineWithActionsWidget,
     27    templateString,
     28    domClass
     29    ){
     30    return declare('rft.ui.Selector',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_Container],{
     31        templateString: templateString,
     32        baseClass: 'rftSelector',
    3333
    34             title: "",
    35             selectedActions: null,
    36             itemActions: null,
    37             // main selector action: Object
    38             //    title:
    39             //    description:
    40             //    icon:
     34        title: "",
     35        selectedActions: null,
     36        itemActions: null,
     37        // main selector action: Object
     38        //    title:
     39        //    description:
     40        //    icon:
    4141
    42             _folded: true,
    43             _titleLine: null,
    44             _selectorLine: null,
    45             _selectedItem: null,
     42        _folded: true,
     43        _titleLine: null,
     44        _selectorLine: null,
     45        _selectedItem: null,
    4646
    47             startup: function() {
    48                 if ( this._started ){ return; }
    49                                 this.inherited(arguments);
    50                 domClass.add(this.selectedColorNode, "pending");
     47        startup: function() {
     48            if ( this._started ){ return; }
     49            this.inherited(arguments);
     50            domClass.add(this.selectedColorNode, "pending");
    5151
    52                 this._createTitleLine();
    53                 this._createSelectorLine();
     52            this._createTitleLine();
     53            this._createSelectorLine();
    5454
     55            fx.wipeOut({
     56                node: this.optionsNode
     57            }).play();
     58        },
     59        _createTitleLine: function() {
     60            var actions = {};
     61            var action = null;
     62            if ( this.selectedActions !== null ) {
     63                for (var actionName in this.selectedActions) {
     64                    action = this.selectedActions[actionName];
     65                    actions[actionName] = {
     66                        callback: action.callback &&
     67                                lang.hitch(this,this._onSelectedAction,
     68                                        action.callback),
     69                        properties: {
     70                             blockButton: true,
     71                             label: action.title || actionName,
     72                             icon: action.icon,
     73                             tooltip: action.description
     74                         }
     75
     76                    };
     77                }
     78            }
     79
     80            this._titleLine = new LineWithActionsWidget({
     81                title: this.title,
     82                actions: actions
     83            },this.titleNode);
     84            this._titleLine.startup();
     85        },
     86        _createSelectorLine: function() {
     87            this._selectorLine = new LineWithActionsWidget({
     88                title: 'None',
     89                actions: {
     90                    "Toggle dropdown" : {
     91                        callback: lang.hitch(this, this.onToggle),
     92                        properties: {
     93                            blockButton: true,
     94                            showLabel: false,
     95                            icon: "HalfArrowDown"
     96                        }
     97                    }
     98                }
     99            },this.selectedItemNode);
     100            this._selectorLine.startup();
     101            this._selectorLine.on('click',lang.hitch(this, this.onToggle));
     102        },
     103        _onSelect: function(item, widget) {
     104            this._selectedItem = item;
     105            this.onToggle();
     106            this._selectorLine.set("title", item.title);
     107            baseArray.forEach(this.optionsNode.childNodes, function(node){
     108                var line = registry.byNode(node);
     109                if (line) {
     110                    if (line === widget) {
     111                        domClass.add(line.domNode, "inheritBgColor light");
     112                    } else {
     113                        domClass.remove(line.domNode, "inheritBgColor light");
     114                    }
     115                }
     116            }, this);
     117            this.onSelect(item);
     118        },
     119        _onSelectedAction: function(callback) {
     120            if (this._selectedItem && callback) {
     121                callback(this._selectedItem);
     122            }
     123        },
     124
     125        onToggle: function(evt) {
     126            if (this._folded) {
     127                var downArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowDown", this._selectorLine.buttonsNode)[0];
     128                if (downArrowIcon){
     129                    domClass.replace(downArrowIcon, "rftIconHalfArrowUp", "rftIconHalfArrowDown");
     130                }
     131                fx.wipeIn({
     132                    node: this.optionsNode
     133                }).play();
     134                this._folded = false;
     135            } else {
     136                var upArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowUp", this._selectorLine.buttonsNode)[0];
     137                if (upArrowIcon){
     138                    domClass.replace(upArrowIcon, "rftIconHalfArrowDown", "rftIconHalfArrowUp");
     139                }
    55140                fx.wipeOut({
    56141                    node: this.optionsNode
    57142                }).play();
    58             },
    59             _createTitleLine: function() {
    60                 var actions = {};
    61                 var action = null;
    62                 if ( this.selectedActions !== null ) {
    63                     for (var actionName in this.selectedActions) {
    64                         action = this.selectedActions[actionName];
    65                         actions[actionName] = {
    66                             callback: action.callback &&
    67                                     lang.hitch(this,this._onSelectedAction,
    68                                             action.callback),
    69                             properties: {
    70                                  blockButton: true,
    71                                  label: action.title || actionName,
    72                                  icon: action.icon,
    73                                  tooltip: action.description
    74                              }
     143                this._folded = true;
     144            }
     145            evt && event.stop(evt);
     146            return false;
     147        },
    75148
    76                         };
    77                     }
    78                 }
    79 
    80                 this._titleLine = new LineWithActionsWidget({
    81                     title: this.title,
    82                     actions: actions
    83                 },this.titleNode);
    84                 this._titleLine.startup();
    85             },
    86             _createSelectorLine: function() {
    87                 this._selectorLine = new LineWithActionsWidget({
    88                     title: 'None',
    89                     actions: {
    90                         "Toggle dropdown" : {
    91                             callback: lang.hitch(this, this.onToggle),
    92                             properties: {
    93                                 blockButton: true,
    94                                 showLabel: false,
    95                                 icon: "HalfArrowDown"
    96                             }
    97                         }
    98                     }
    99                 },this.selectedItemNode);
    100                 this._selectorLine.startup();
    101                 this._selectorLine.on('click',lang.hitch(this, this.onToggle));
    102             },
    103             _onSelect: function(item, widget) {
    104                 this._selectedItem = item;
    105                 this.onToggle();
    106                 this._selectorLine.set("title", item.title);
    107                 baseArray.forEach(this.optionsNode.childNodes, function(node){
    108                     var line = registry.byNode(node);
    109                     if (line) {
    110                         if (line === widget) {
    111                             domClass.add(line.domNode, "inheritBgColor light");
    112                         } else {
    113                             domClass.remove(line.domNode, "inheritBgColor light");
    114                         }
    115                     }
    116                 }, this);
    117                 this.onSelect(item);
    118             },
    119             _onSelectedAction: function(callback) {
    120                 if (this._selectedItem && callback) {
    121                     callback(this._selectedItem);
    122                 }
    123             },
    124 
    125             onToggle: function(evt) {
    126                 if (this._folded) {
    127                     var downArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowDown", this._selectorLine.buttonsNode)[0];
    128                     if (downArrowIcon){
    129                         domClass.replace(downArrowIcon, "rftIconHalfArrowUp", "rftIconHalfArrowDown");
    130                     }
    131                     fx.wipeIn({
    132                         node: this.optionsNode
    133                     }).play();
    134                     this._folded = false;
    135                 } else {
    136                     var upArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowUp", this._selectorLine.buttonsNode)[0];
    137                     if (upArrowIcon){
    138                         domClass.replace(upArrowIcon, "rftIconHalfArrowDown", "rftIconHalfArrowUp");
    139                     }
    140                     fx.wipeOut({
    141                         node: this.optionsNode
    142                     }).play();
    143                     this._folded = true;
    144                 }
    145                 evt && event.stop(evt);
    146                 return false;
    147             },
    148 
    149             addItem: function(item) {
    150                 var actions = {};
    151                 var action;
    152                 if (this.itemActions) {
    153                     for (var actionName in this.itemActions) {
    154                         action = this.itemActions[actionName];
    155                         actions[actionName] = {
    156                             callback: function(){
    157                                 action.callback && action.callback(item);
    158                             },
    159                             properties: {
    160                                 blockButton: false,
    161                                 showLabel: false,
    162                                 icon: action.icon + " black",
    163                                 tooltip: action.description
    164                             }
     149        addItem: function(item) {
     150            var actions = {};
     151            var action;
     152            if (this.itemActions) {
     153                for (var actionName in this.itemActions) {
     154                    action = this.itemActions[actionName];
     155                    actions[actionName] = {
     156                        callback: function(){
     157                            action.callback && action.callback(item);
     158                        },
     159                        properties: {
     160                            blockButton: false,
     161                            showLabel: false,
     162                            icon: action.icon + " black",
     163                            tooltip: action.description
    165164                        }
    166165                    }
    167166                }
    168                 var w = new LineWithActionsWidget({
    169                     title: item.title,
    170                     actions: actions
    171                 }).placeAt(this.optionsNode);
    172                 w.startup();
    173                 w.on("click", lang.hitch(this, this._onSelect, item, w));
    174             },
     167            }
     168            var w = new LineWithActionsWidget({
     169                title: item.title,
     170                actions: actions
     171            }).placeAt(this.optionsNode);
     172            w.startup();
     173            w.on("click", lang.hitch(this, this._onSelect, item, w));
     174        },
    175175
    176             onSelect: function(item) {}
    177         });
     176        onSelect: function(item) {}
     177    });
    178178});
Note: See TracChangeset for help on using the changeset viewer.