Last part of MKWS-413.
[mkws-moved-to-github.git] / src / mkws-widget.js
1 // Factory function for widget objects.
2 mkws.makeWidget = function($, team, type, node) {
3   // Static register of attributes that do not contribute to config
4   var ignoreAttrs = {
5     id:1, 'class':1, style:1, name:1, action:1, type:1, size:1,
6     value:1, width:1, valign:1
7   };
8
9   var that = {
10     team: team,
11     type: type,
12     node: $(node),
13     config: mkws.objectInheritingFrom(team.config)
14   };
15
16   that.trace = team.trace;
17   that.debug = team.debug;
18   that.info = team.info;
19   that.warn = team.warn;
20   that.error = team.error;
21   that.fatal = team.fatal;
22
23   that.toString = function() {
24     return '[Widget ' + team.name() + ':' + type + ']';
25   };
26
27   that.value = function() {
28     return node.value;
29   };
30
31   // Returns the HTML of a subwidget of the specified type. It gets
32   // the same attributes at the parent widget that invokes this
33   // function, except where overrides are passed in. If defaults are
34   // also provided, then these are used when the parent widget
35   // provides no values.
36   that.subwidget = function(type, overrides, defaults) {
37     var attrs = { _team: team.name() };
38     
39     // Copy locally-set properties from the parent widget
40     for (var name in this.config) {
41       if (this.config.hasOwnProperty(name)) {
42         attrs[name] = this.config[name];
43         this.info(this + " copied property " + name + "='" + attrs[name] + "' to " + type + " subwidget");
44       }
45     }
46     
47     for (var name in overrides) {
48       this.info(this + " overrode property " + name + "='" + overrides[name] + "' (was '" + attrs[name] + "') for " + type + " subwidget");
49       attrs[name] = overrides[name];
50     }
51
52     if (defaults) {
53       for (var name in defaults) {
54         if (!attrs[name]) {
55           attrs[name] = defaults[name];
56           this.info(this + " fell back to default property " + name + "='" + attrs[name] + "' for " + type + " subwidget");
57         }
58       }
59     }
60
61     var s = [];
62     s.push('<div class="mkws', type, ' mkws-team-', attrs._team, '"');
63     for (var name in attrs) {    
64       if (name !== '_team')
65         s.push(' ', name, '="', attrs[name], '"');
66     }
67     s.push('></div>');
68     return s.join('');
69   };
70
71   function expandValue(val) {
72     if (val.match(/^!param!/)) {
73       var param = val.replace(/^!param!/, '');
74       var optional = param.match(/^\?/);
75       if (optional) {
76         param = param.replace(/^\?/, ''); 
77       }
78       val = mkws.getParameterByName(param);
79       that.info("obtained val '" + val + "' from param '" + param + "'");
80       if (!val && !optional) {
81         alert("This page has a MasterKey widget that needs a val specified by the '" + param + "' parameter");
82       }
83     } else if (val.match(/^!path!/)) {
84       var index = val.replace(/^!path!/, '');
85       var path = window.location.pathname.split('/');
86       val = path[path.length - index];
87       that.info("obtained val '" + val + "' from path-component '" + index + "'");
88       if (!val) {
89         alert("This page has a MasterKey widget that needs a val specified by the path-component " + index);
90       }
91     } else if (val.match(/^!var!/)) {
92       var name = val.replace(/^!var!/, '');
93       val = window[name]; // It's ridiculous that this works
94       that.info("obtained val '" + val + "' from variable '" + name + "'");
95       if (!val) {
96         alert("This page has a MasterKey widget that needs a val specified by the '" + name + "' variable");
97       }
98     }
99     return val;
100   };
101
102   // Utility function for use by all widgets that can invoke autosearch.
103   that.autosearch = function() {
104     var that = this;
105     var query = this.config.autosearch;
106     if (query) {
107       // Should do this more elegantly with message passing
108       var widget = this.team.widget('query');
109       if (widget) { widget.node.val(query); }
110
111       this.team.queue("ready").subscribe(function() {
112         // Postpone search until the team is ready: configuration
113         // items are not yet set for Record subclass widgets that fill
114         // them in in the subclass, as widget.autosearch is called in
115         // the superclass, before the subclass fiddles with the
116         // configuration.
117         that.team.newSearch(that, query);
118       });
119     }
120   };
121
122   // Utility function for all widgets that want to hide in narrow windows
123   that.hideWhenNarrow = function() {
124     var that = this;
125     this.team.queue("resize-narrow").subscribe(function(n) {
126       that.node.hide();
127     });
128     this.team.queue("resize-wide").subscribe(function(n) {
129       that.node.show();
130     });
131   };
132
133
134   for (var i = 0; i < node.attributes.length; i++) {
135     var a = node.attributes[i];
136     var val = expandValue(a.value);
137     if (a.name === 'data-mkws-config') {
138       // Treat as a JSON fragment configuring just this widget
139       this.info(node + ": parsing config fragment '" + val + "'");
140       var data;
141       try {
142         data = $.parseJSON(val);
143         for (var key in data) {
144           this.info(node + ": adding config element " + key + "='" + data[key] + "'");
145           that.config[key] = data[key];
146         }
147       } catch (err) {
148         alert("Can't parse " + node + " data-mkws-config as JSON: " + val);
149       }
150     } else if (a.name.match (/^data-mkws-/)) {
151       var name = a.name.replace(/^data-mkws-/, '')
152       that.config[name] = val;
153       this.info(that + ": set data-mkws attribute " + name + "='" + val + "'");
154     } else if (!ignoreAttrs[a.name]) {
155       that.config[a.name] = val;
156       this.info(that + ": set regular attribute " + a.name + "='" + val + "'");
157     }
158   }
159
160   var fn = mkws.promotionFunction(type);
161   if (fn) {
162     fn.call(that);
163     this.info("made " + type + " widget(node=" + node + ")");
164   } else if (type.match(/-[Cc]ontainer-(narrow|wide)$/)) {
165     // Not really a widget: no need to log its lack of promotion
166   } else {
167     this.info("made UNPROMOTED widget(type=" + type + ", node=" + node + ")");
168   }
169
170   return that;
171 };