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 | "AddToSurvey" : { |
---|
40 | callback: function(arg){}, |
---|
41 | properties: { |
---|
42 | blockButton: true, |
---|
43 | modifiers: this.modifiers, |
---|
44 | icon: "Accept", |
---|
45 | label: "Include" |
---|
46 | } |
---|
47 | } |
---|
48 | } |
---|
49 | },this.titleNode); |
---|
50 | var selectorLine = new LineWithActionsWidget({ |
---|
51 | title: 'None', |
---|
52 | modifiers: this.modifiers, |
---|
53 | actions: { |
---|
54 | "ToggleDropdown" : { |
---|
55 | callback: lang.hitch(this,function(){ |
---|
56 | var node = this.optionsNode; |
---|
57 | var show = fx.wipeIn({ |
---|
58 | node: node |
---|
59 | }); |
---|
60 | var hide = fx.wipeOut({ |
---|
61 | node: node |
---|
62 | }); |
---|
63 | hide.play(); |
---|
64 | var folded = true; |
---|
65 | return function(e) { |
---|
66 | if ( folded ) { |
---|
67 | // Bit of an ugly solution, really. Limit workload by limiting search to child elements of selecorLine.buttonsNode |
---|
68 | var downArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowDown", selectorLine.buttonsNode)[0]; // Query the down arrow rftIcon span |
---|
69 | if (downArrowIcon){ |
---|
70 | domClass.replace(downArrowIcon, "rftIconHalfArrowUp", "rftIconHalfArrowDown"); |
---|
71 | } |
---|
72 | show.play(); |
---|
73 | folded = false; |
---|
74 | } else { |
---|
75 | // Bit of an ugly solution, really. Limit workload by limiting search to child elements of selecorLine.buttonsNode |
---|
76 | var upArrowIcon = dojo.query(".rftBlockButton .rftIconHalfArrowUp", selectorLine.buttonsNode)[0]; // Query the up arrow rftIcon span |
---|
77 | if (upArrowIcon){ |
---|
78 | domClass.replace(upArrowIcon, "rftIconHalfArrowDown", "rftIconHalfArrowUp"); |
---|
79 | } |
---|
80 | hide.play(); |
---|
81 | folded = true; |
---|
82 | |
---|
83 | } |
---|
84 | e.preventDefault(); |
---|
85 | e.stopPropagation(); |
---|
86 | }; |
---|
87 | })(), |
---|
88 | properties: { |
---|
89 | blockButton: true, |
---|
90 | modifiers: this.modifiers, |
---|
91 | showLabel: false, |
---|
92 | icon: "HalfArrowDown" |
---|
93 | } |
---|
94 | } |
---|
95 | } |
---|
96 | },this.selectedItemNode); |
---|
97 | new LineWithActionsWidget({ |
---|
98 | title: 'Are there direct colleagues among the other participants?', |
---|
99 | actions: { |
---|
100 | "InfoHover" : { |
---|
101 | callback: infoFunction, |
---|
102 | properties: { |
---|
103 | blockButton: false, |
---|
104 | showLabel: false, |
---|
105 | icon: "Inspect" |
---|
106 | } |
---|
107 | } |
---|
108 | } |
---|
109 | }).placeAt(this.optionsNode); |
---|
110 | } |
---|
111 | }); |
---|
112 | }); |
---|