1 | define([ |
---|
2 | 'dojo/_base/declare', |
---|
3 | 'dojo/_base/lang', |
---|
4 | 'dojo/fx', |
---|
5 | 'dijit/_WidgetBase', |
---|
6 | 'dijit/_TemplatedMixin', |
---|
7 | 'dijit/_WidgetsInTemplateMixin', |
---|
8 | 'dijit/_Container', |
---|
9 | './LineWithActionsWidgetThijs', |
---|
10 | 'dojo/text!./templates/SelectorThijs.html', |
---|
11 | 'dojo/dom-class' |
---|
12 | ],function( |
---|
13 | declare, |
---|
14 | lang, |
---|
15 | fx, |
---|
16 | _WidgetBase, |
---|
17 | _TemplatedMixin, |
---|
18 | _WidgetsInTemplateMixin, |
---|
19 | _Container, |
---|
20 | LineWithActionsWidget, |
---|
21 | templateString, |
---|
22 | domClass |
---|
23 | ){ |
---|
24 | return declare('rft.ui.SelectorThijs',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_Container],{ |
---|
25 | templateString: templateString, |
---|
26 | title: "The professional as a participant", |
---|
27 | baseClass: 'rftSelector', |
---|
28 | modifiers: 'blue', // Extra CSS classes |
---|
29 | postCreate: function() { |
---|
30 | domClass.add(this.domNode, this.modifiers); |
---|
31 | domClass.add(this.selectedColorNode, "pending"); |
---|
32 | var infoFunction = function() { |
---|
33 | alert("Show info here"); |
---|
34 | } |
---|
35 | new LineWithActionsWidget({ |
---|
36 | title: this.title, |
---|
37 | modifiers: this.modifiers, |
---|
38 | actions: { |
---|
39 | "Accept" : { |
---|
40 | callback: function(arg){}, |
---|
41 | properties: { |
---|
42 | blockButton: true, |
---|
43 | modifiers: this.modifiers |
---|
44 | } |
---|
45 | } |
---|
46 | } |
---|
47 | },this.titleNode); |
---|
48 | var selectorLine = new LineWithActionsWidget({ |
---|
49 | title: 'None', |
---|
50 | modifiers: this.modifiers, |
---|
51 | actions: { |
---|
52 | "HalfArrowDown" : { |
---|
53 | callback: lang.hitch(this,function(){ |
---|
54 | var node = this.optionsNode; |
---|
55 | var show = fx.wipeIn({ |
---|
56 | node: node |
---|
57 | }); |
---|
58 | var hide = fx.wipeOut({ |
---|
59 | node: node |
---|
60 | }); |
---|
61 | hide.play(); |
---|
62 | var folded = true; |
---|
63 | return function(e) { |
---|
64 | if ( folded ) { |
---|
65 | // Bit of an ugly solution, really. Limit workload by limiting search to child elements of selecorLine.buttonsNode |
---|
66 | var downArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowDown", selectorLine.buttonsNode)[0]; // Query the down arrow rftIcon span |
---|
67 | if (downArrowIcon){ |
---|
68 | domClass.replace(downArrowIcon, "rftIconHalfArrowUp", "rftIconHalfArrowDown"); |
---|
69 | } |
---|
70 | show.play(); |
---|
71 | folded = false; |
---|
72 | } else { |
---|
73 | // Bit of an ugly solution, really. Limit workload by limiting search to child elements of selecorLine.buttonsNode |
---|
74 | var upArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowUp", selectorLine.buttonsNode)[0]; // Query the up arrow rftIcon span |
---|
75 | if (upArrowIcon){ |
---|
76 | domClass.replace(upArrowIcon, "rftIconHalfArrowDown", "rftIconHalfArrowUp"); |
---|
77 | } |
---|
78 | hide.play(); |
---|
79 | folded = true; |
---|
80 | |
---|
81 | } |
---|
82 | e.preventDefault(); |
---|
83 | e.stopPropagation(); |
---|
84 | }; |
---|
85 | })(), |
---|
86 | properties: { |
---|
87 | blockButton: true, |
---|
88 | modifiers: this.modifiers, |
---|
89 | showLabel: false |
---|
90 | } |
---|
91 | } |
---|
92 | } |
---|
93 | },this.selectedItemNode); |
---|
94 | new LineWithActionsWidget({ |
---|
95 | title: 'Are there direct colleagues among the other participants?', |
---|
96 | actions: { |
---|
97 | "Inspect" : { |
---|
98 | callback: infoFunction, |
---|
99 | properties: { |
---|
100 | blockButton: false, |
---|
101 | showLabel: false |
---|
102 | } |
---|
103 | } |
---|
104 | } |
---|
105 | }).placeAt(this.optionsNode); |
---|
106 | } |
---|
107 | }); |
---|
108 | }); |
---|