Ignore:
Timestamp:
07/30/12 00:19:37 (13 years ago)
Author:
hendrikvanantwerpen
Message:
File:
1 moved

Legend:

Unmodified
Added
Removed

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

    r385 r387  
    1 define( [
    2         'dojo',
    3         'dojo/_base/lang',
    4         'dijit',
    5         'dijit/layout/StackContainer',
    6         'dojox/form/CheckedMultiSelect',
    7         'dojox/layout/TableContainer',
    8         'rft/ui/MultipleChoiceListView'],
    9         function(dojo, lang, dijit, StackContainer, CheckedMultiSelect, TableContainer, ListView) {
    10                 dojo.provide('rft.ui.InnerWidgetFactory');
    11                 dojo.declare('rft.ui.InnerWidgetFactory', [],{
    12                         /* No default type, all should be valid */
    13                         createWidget: function(/*Object*/ options) {
    14                                 // options: Object
    15                                 //                      type: "header", "text", textinput, etc.
    16                                 //                      contents: "text"
    17                                 //                      disabled: bool
    18                                 return this['create'+options.widgetType+'Widget'](options);
    19                         },
    20                         createHeaderWidget: function(options) {
    21                                 var headerWidget = new rft.ui.HeaderItem();
    22                                 headerWidget.setObject(options);
    23                                 return headerWidget;
    24                         },
    25                         createTextWidget: function(options) {
    26                                 var textWidget = new rft.ui.TextItem();
    27                                 textWidget.setObject(options);
    28                                 return textWidget;
    29                         },
    30                         createFreeTextInputWidget: function(options) {
    31                                 return new rft.ui.FreeTextInput();
    32                         },
    33                         createIntegerInputWidget: function(options) {
    34                                 var integerWidget = new rft.ui.IntegerInput();
    35                                 integerWidget.setObject(options);
    36                                 return integerWidget;
    37                         },
    38                         createMultipleChoiceInputWidget: function(options) {
    39                                 var mcWidget = new rft.ui.MultipleChoiceInput();
    40                                 mcWidget.setObject(options);
    41                                 return mcWidget;
    42                         }
    43                 });
     1define([
     2    'dojo/_base/declare',
     3    'dojo/_base/lang',
     4    'dijit/form/NumberSpinner',
     5    'dijit/form/Textarea',
     6    'dijit/form/TextBox',
     7    'dijit/layout/StackContainer',
     8    'dojox/form/CheckedMultiSelect',
     9    'dojox/layout/TableContainer'
     10    ],function(declare, lang, NumberSpinner, Textarea, TextBox, StackContainer, CheckedMultiSelect, TableContainer) {
     11        var factory = declare('rft.ui.ContentWidgetFactory', [], {
     12            /* No default type, all should be valid */
     13            createWidget: function(/*Object*/ content) {
     14                // options: Object
     15                //            type: "header", "text", textinput, etc.
     16                //            contents: "text"
     17                //            disabled: bool
     18                return this['create'+content.type+'Widget'](content);
     19            },
     20            createHeaderWidget: function(options) {
     21                var headerWidget = new HeaderItem();
     22                headerWidget.setObject(options);
     23                return headerWidget;
     24            },
     25            createTextWidget: function(options) {
     26                var textWidget = new TextItem();
     27                textWidget.setObject(options);
     28                return textWidget;
     29            },
     30            createFreeTextInputWidget: function(options) {
     31                return new FreeTextInput();
     32            },
     33            createIntegerInputWidget: function(options) {
     34                var integerWidget = new IntegerInput();
     35                integerWidget.setObject(options);
     36                return integerWidget;
     37            },
     38            createMultipleChoiceInputWidget: function(options) {
     39                var mcWidget = new MultipleChoiceInput();
     40                mcWidget.setObject(options);
     41                return mcWidget;
     42            }
     43        });
    4444
    45                 /* Contents */
    46                 dojo.declare('rft.ui.HeaderItem', dijit.form.TextBox, {
    47                         getObject: function() {
    48                                 return { widgetType : 'Header',
    49                                                 contents: this.get('value'),
    50                                                 disabled: this.get('disabled')
    51                                 };
    52                         },
    53                         setObject: function(object) {
    54                                 this.set('value', object.contents);
    55                                 if (object.disabled) {
    56                                         this.set('disabled', true);
    57                                 }
    58                         }
    59                 });
     45        /* Contents */
     46        var HeaderItem = declare(TextBox, {
     47            getObject: function() {
     48                return { type : 'Header',
     49                        contents: this.get('value'),
     50                        disabled: this.get('disabled')
     51                };
     52            },
     53            setObject: function(object) {
     54                this.set('value', object.contents);
     55                if (object.disabled) {
     56                    this.set('disabled', true);
     57                }
     58            }
     59        });
    6060
    61                 dojo.declare('rft.ui.TextItem', dijit.form.Textarea, {
    62                         getObject: function() {
    63                                 return { widgetType : 'Text',
    64                                                 contents: this.get('value'),
    65                                                 disabled: this.get('disabled')
    66                                 };
    67                         },
    68                         setObject: function(object) {
    69                                 this.set('value', object.contents);
    70                                 if (object.disabled) {
    71                                         this.set('disabled', true);
    72                                 }
    73                         }       
    74                 });
     61        var TextItem = declare(Textarea, {
     62            getObject: function() {
     63                return { type: 'Text',
     64                        contents: this.get('value'),
     65                        disabled: this.get('disabled')
     66                };
     67            },
     68            setObject: function(object) {
     69                this.set('value', object.contents);
     70                if (object.disabled) {
     71                    this.set('disabled', true);
     72                }
     73            }   
     74        });
    7575
     76        /* Inputs */
     77        var FreeTextInput = declare(Textarea, {
     78            getObject: function() {
     79                return { type: 'FreeTextInput' };
     80            }
     81        });
    7682
     83        //Use CheckedMultiSelect
     84        var MultipleChoiceInput = declare(StackContainer, {
     85            _multiSelect: null,
     86            postCreate: function() {
     87                this.inherited(arguments);
     88                this._multiSelect = new CheckedMultiSelect();
     89                this._multiSelect.addOption({ label: "Hurr durr", value: 1 });
     90                this._multiSelect.addOption({ label: "This is a choice", value: 1 });
     91                this._multiSelect.addOption({ label: "This too", value: 1 });
     92                this._multiSelect.addOption({ label: "So because there are more", value: 1 });
     93                this._multiSelect.addOption({ label: "This must be multiple choice.", value: 1 });
     94                this.addChild(this._multiSelect);
     95            },
    7796
    78                 /* Inputs */
    79                 dojo.declare('rft.ui.FreeTextInput', dijit.form.Textarea, {
    80                         getObject: function() {
    81                                 return { widgetType: 'FreeTextInput' };
    82                         }
    83                 });
     97            setObject: function() {
     98                return;
     99            },
    84100
    85                 //Use CheckedMultiSelect
    86                 dojo.declare('rft.ui.MultipleChoiceInput',  StackContainer, {
    87                         _multiSelect: null,
    88                         postCreate: function() {
    89                                 this.inherited(arguments);
    90                                 this._multiSelect = new CheckedMultiSelect();
    91                                 this._multiSelect.addOption({ label: "Hurr durr", value: 1 });
    92                                 this._multiSelect.addOption({ label: "This is a choice", value: 1 });
    93                                 this._multiSelect.addOption({ label: "This too", value: 1 });
    94                                 this._multiSelect.addOption({ label: "So because there are more", value: 1 });
    95                                 this._multiSelect.addOption({ label: "This must be multiple choice.", value: 1 });
    96                                 this.addChild(this._multiSelect);
    97                         },
     101            edit: function() {
     102                return;
     103            }
    98104
    99                         setObject: function() {
    100                                 return;
    101                         },
     105        });
    102106
    103                         edit: function() {
    104                                 return;
    105                         }
     107        var IntegerInput = declare(StackContainer, {
     108            _numberSpinner:  null,
     109            _simpleTable: null,
     110            _editWidgets: null,
     111            _editTable: null,
     112            postCreate: function() {
     113                this.inherited(arguments);
     114                this._numberSpinner = new NumberSpinner( { title: "Answer", value: 0, constraints: { min: -100, max: 100 } });   
     115                this._simpleTable = new TableContainer({ cols: 1, customClass: "labelsAndValues", labelWidth : 150} );
     116                this._simpleTable.addChild(this._numberSpinner);
     117                this._editTable = new TableContainer({ cols: 1, customClass: "labelsAndValues"} );
     118                this._simpleTable.startup();
     119                this.addChild(this._simpleTable);
     120            },
     121            edit: function() {
     122                this.removeChild(this._simpleTable);
     123                this.addChild(this._editTable);
     124            },
     125            save: function () {
     126                for (var widget in this._editWidgets) {
     127                    var w = this._editWidgets[widget];
     128                    if (w.value) {
     129                        if (w.constraint)
     130                            this._numberSpinner.constraints[w.field] = w.value;
     131                        else
     132                            this._numberSpinner.set(w.field, w.value);
     133                    }
     134                }
     135                this.removeChild(this._editTable);
     136                this.addChild(this._simpleTable);
     137                this._simpleTable.layout();
     138            },
     139            setObject: function(object) {
     140                if(object.contents) {
     141                    lang.mixin(this._numberSpinner, object.contents);
     142                    this._setupEditWidgets(object.contents);
     143                }
     144                else {
     145                    //Create widgets with default values
     146                    this._setupEditWidgets(this.getObject().contents);
     147                }
     148            },
     149            _setupEditWidgets: function(contents) {
     150                //Set up widgets which should appear once edit is pressed.
     151                this._editWidgets = [];
     152                this._editWidgets.push(new NumberSpinner( { field: "value", title: "Default value" }))
     153                this._editWidgets.push(new NumberSpinner( { field: "smallDelta", title: "Increment size" }));
     154                this._editWidgets.push(new NumberSpinner( { constraint: true, field: "max", title: "Maximum value" }));
     155                this._editWidgets.push(new NumberSpinner( { constraint: true, field: "min", title: "Minimum value" }));
     156                this._editWidgets.push(new TextBox ( { field: "invalidMessage", title: "Invalid message" }));
     157                this._editWidgets.push(new TextBox ( { field: "title", title: "Label" }));
     158                for (var widget in this._editWidgets) {
     159                    var w = this._editWidgets[widget];
     160                    if (w.constraint)
     161                        w.set('value', contents.constraints[w.field]);
     162                    else
     163                        w.set('value', contents[w.field]);
     164                    this._editTable.addChild(w);
     165                }
     166                this._editTable.startup();
     167            },
     168            getObject: function() {
     169                return {
     170                    type: 'IntegerInput',
     171                    contents: {
     172                        value: this._numberSpinner.value,
     173                        smallDelta: this._numberSpinner.smallDelta,
     174                        constraints: this._numberSpinner.constraints,
     175                        invalidMessage: this._numberSpinner.invalidMessage,
     176                        title: this._numberSpinner.title
     177                    }
     178                };
     179            }
     180        });
    106181
    107                 });
    108 
    109                 dojo.declare('rft.ui.IntegerInput', StackContainer, {
    110                         _numberSpinner:  null,
    111                         _simpleTable: null,
    112                         _editWidgets: null,
    113                         _editTable: null,
    114                         postCreate: function() {
    115                                 this.inherited(arguments);
    116                                 this._numberSpinner = new dijit.form.NumberSpinner( { title: "Answer", value: 0, constraints: { min: -100, max: 100 } });       
    117                                 this._simpleTable = new TableContainer({ cols: 1, customClass: "labelsAndValues", labelWidth : 150} );
    118                                 this._simpleTable.addChild(this._numberSpinner);
    119                                 this._editTable = new TableContainer({ cols: 1, customClass: "labelsAndValues"} );
    120                                 this._simpleTable.startup();
    121                                 this.addChild(this._simpleTable);
    122                         },
    123                         edit: function() {
    124                                 this.removeChild(this._simpleTable);
    125                                 this.addChild(this._editTable);
    126                         },
    127                         save: function () {
    128                                 for (widget in this._editWidgets) {
    129                                         var w = this._editWidgets[widget];
    130                                         if (w.value) {
    131                                                 if (w.constraint)
    132                                                         this._numberSpinner.constraints[w.field] = w.value;
    133                                                 else
    134                                                         this._numberSpinner.set(w.field, w.value);
    135                                         }
    136                                 }
    137                                 this.removeChild(this._editTable);
    138                                 this.addChild(this._simpleTable);
    139                                 this._simpleTable.layout();
    140                         },
    141                         setObject: function(object) {
    142                                 if(object.contents) {
    143                                         lang.mixin(this._numberSpinner, object.contents);
    144                                         this._setupEditWidgets(object.contents);
    145                                 }
    146                                 else {
    147                                         //Create widgets with default values
    148                                         this._setupEditWidgets(this.getObject().contents);
    149                                 }
    150                         },
    151                         _setupEditWidgets: function(contents) {
    152                                 //Set up widgets which should appear once edit is pressed.
    153                                 this._editWidgets = [];
    154                                 this._editWidgets.push(new dijit.form.NumberSpinner( { field: "value", title: "Default value" }))
    155                                 this._editWidgets.push(new dijit.form.NumberSpinner( { field: "smallDelta", title: "Increment size" }));
    156                                 this._editWidgets.push(new dijit.form.NumberSpinner( { constraint: true, field: "max", title: "Maximum value" }));
    157                                 this._editWidgets.push(new dijit.form.NumberSpinner( { constraint: true, field: "min", title: "Minimum value" }));
    158                                 this._editWidgets.push(new dijit.form.TextBox ( { field: "invalidMessage", title: "Invalid message" }));
    159                                 this._editWidgets.push(new dijit.form.TextBox ( { field: "title", title: "Label" }));
    160                                 for (widget in this._editWidgets) {
    161                                         var w = this._editWidgets[widget];
    162                                         if (w.constraint)
    163                                                 w.set('value', contents.constraints[w.field]);
    164                                         else
    165                                                 w.set('value', contents[w.field]);
    166                                         this._editTable.addChild(w);
    167                                 }
    168                                 this._editTable.startup();
    169                         },
    170                         getObject: function() {
    171                                 return {
    172                                         widgetType: 'IntegerInput',
    173                                         contents: {
    174                                                 value: this._numberSpinner.value,
    175                                             smallDelta: this._numberSpinner.smallDelta,
    176                                                 constraints: this._numberSpinner.constraints,
    177                                                 invalidMessage: this._numberSpinner.invalidMessage,
    178                                                 title: this._numberSpinner.title
    179                                         }
    180                                 };
    181                         }
    182                 });
    183         }
    184 )
     182        return factory;
     183    });
Note: See TracChangeset for help on using the changeset viewer.