Open-ILS/web/reports/oils_rpt_widget.js

   1 oilsRptSetSubClass('oilsRptWidget', 'oilsRptObject');
   2 oilsRptWidget.OILS_RPT_TRANSFORM_WIDGET = 0;
   3 oilsRptWidget.OILS_RPT_OPERATION_WIDGET = 1;
   4
   5 function oilsRptWidget(args) {
   6         this.initWidget(args);
   7         this.dest = elem('input',{type:'text'});
   8 }
   9
  10 oilsRptWidget.prototype.initWidget = function(args) {
  11         if(!args) return;
  12         this.init();
  13         this.node       = args.node;
  14         this.type       = args.type;
  15         this.action = args.action;
  16         this.column     = args.column;
  17 }
  18
  19 oilsRptWidget.prototype.getValue = function() {
  20         return this.dest.value ;
  21 }
  22
  23 oilsRptWidget.prototype.draw = function() {
  24         appendClear(this.node, this.dest);
  25 }
  26
  27 /* ----------------------------------------------------------- */
  28
  29 /* multiple input boxes, no separate source, optional box labels */
  30 oilsRptSetSubClass('oilsRptMultiInputWidget', 'oilsRptWidget');
  31 function oilsRptMultiInputWidget(args) {
  32         this.initInputWidget(args);
  33 }
  34
  35 oilsRptMultiInputWidget.prototype.initInputWidget = function(args) {
  36         if(!args) return;
  37         this.initWidget(args);
  38         this.count = (args.count) ? args.count : 2;
  39         this.dest = [];
  40         for( var i = 0; i < this.count; i++ )
  41                 this.dest.push(elem('input',{type:'text',size:10}));
  42 }
  43
  44 oilsRptMultiInputWidget.prototype.getValue = function() {
  45         var vals = [];
  46         for( var i = 0; i < this.dest.length; i++ )
  47                 vals.push(this.dest[i].value);
  48         return vals;
  49 }
  50
  51 oilsRptMultiInputWidget.prototype.draw = function() {
  52         removeChildren(this.node);
  53         for( var i = 0; i < this.dest.length; i++ ) {
  54                 if( this.label )
  55                         this.node.appendChild(this.label[i]);
  56                 this.node.appendChild(this.dest[i]);
  57         }
  58 }
  59
  60 oilsRptMultiInputWidget.prototype.setLabels = function(labels) {
  61         this.labels = labels;
  62 }
  63
  64
  65
  66
  67 /* ----------------------------------------------------------- */
  68
  69 /* abstract class, multi-select output (dest),
  70         add and delete buttons, you provide intput */
  71 oilsRptSetSubClass('oilsRptMultiWidget', 'oilsRptWidget');
  72 function oilsRptMultiWidget(args) {
  73         this.initMultiWidget(args);
  74 }
  75
  76 oilsRptMultiWidget.prototype.initMultiWidget = function(args) {
  77         if(!args) return;
  78         this.initWidget(args);
  79         this.dest = elem('select',
  80                 {multiple:'multiple','class':'oils_rpt_small_info_selector'});
  81
  82         var obj = this;
  83
  84         this.addButton = elem('input',{type:'submit',value:"Add"})
  85         this.addButton.onclick = this.getSourceCollector();
  86         this.delButton = elem('input',{type:'submit',value:"Del"})
  87         this.delButton.onclick = function(){obj.removeSelected()};
  88 }
  89
  90 oilsRptMultiWidget.prototype.getValue = function() {
  91         var vals = [];
  92         for( var i = 0; i < this.dest.options.length; i++ )
  93                 vals.push(this.dest.options[i].value);
  94         return vals;
  95 }
  96
  97 oilsRptMultiWidget.prototype.removeSelected = function() {
  98         oilsDelSelectedItems(this.dest);
  99 }
 100
 101 oilsRptMultiWidget.prototype.addItem = function(name, val) {
 102         for( var i = 0; i < this.dest.options.length; i++ ) {
 103                 if( this.dest.options[i].value == val )
 104                         return;
 105         }
 106         insertSelectorVal(this.dest, -1, name, val);
 107 }
 108
 109 oilsRptMultiWidget.prototype.setSource = function(src) {
 110         this.source = src;
 111 }
 112
 113 oilsRptMultiWidget.prototype.drawMultiWidget = function() {
 114         appendClear(this.node, this.source);
 115         this.node.appendChild(elem('br'))
 116         this.node.appendChild(this.addButton);
 117         this.node.appendChild(this.delButton);
 118         this.node.appendChild(elem('br'))
 119         this.node.appendChild(this.dest);
 120 }
 121
 122
 123 /* ----------------------------------------------------------- */
 124
 125 /* single text box as source, multiwidget output (select) as dest */
 126 oilsRptSetSubClass('oilsRptInputMultiWidget', 'oilsRptMultiWidget');
 127 function oilsRptInputMultiWidget(args) {
 128         this.initInputMultiWidget(args);
 129 }
 130 oilsRptInputMultiWidget.prototype.initInputMultiWidget = function(args) {
 131         if(!args) return;
 132         this.initMultiWidget(args);
 133         this.setSource(elem('input',{type:'text'}));
 134 }
 135
 136 oilsRptInputMultiWidget.prototype.draw = function() {
 137         this.drawMultiWidget();
 138 }
 139
 140 oilsRptInputMultiWidget.prototype.getSourceCollector = function() {
 141         var obj = this;
 142         return function() {
 143                 obj.addItem(obj.source.value, obj.source.value);
 144         }
 145 }
 146
 147
 148 /* ----------------------------------------------------------- */
 149
 150 /* multi-select source */
 151 oilsRptSetSubClass('oilsRptSelectorMultiWidget', 'oilsRptMultiWidget');
 152 function oilsRptSelectorMultiWidget(args) {
 153         this.initSelectorMultiWidget(args);
 154 }
 155 oilsRptSelectorMultiWidget.prototype.initSelectorMultiWidget = function(args) {
 156         if(!args) return;
 157         this.initMultiWidget(args);
 158         this.setSource(
 159                 elem('select',{multiple:'multiple', 'class':'oils_rpt_small_info_selector'}));
 160 }
 161
 162 oilsRptSelectorMultiWidget.prototype.getSourceCollector = function() {
 163         var obj = this;
 164         return function() {
 165                 for( var i = 0; i < obj.source.options.length; i++ ) {
 166                         if( obj.source.options[i].selected )
 167                                 obj.addItem(obj.source.options[i].innerHTML,
 168                                         obj.source.options[i].value);
 169                 }
 170         }
 171 }
 172
 173 /* ----------------------------------------------------------- */
 174
 175 /* in process */
 176 oilsRptSetSubClass('oilsRptRemoteWidget', 'oilsRptSelectorMultiWidget');
 177 function oilsRptRemoteWidget(args) {
 178         this.initRemoteWidget(args);
 179 }
 180 oilsRptRemoteWidget.prototype.initRemoteWidget = function(args) {
 181         if(!args) return;
 182         this.initSelectorMultiWidget(args);
 183         this.selector = args.selector;
 184 }
 185
 186 oilsRptRemoteWidget.prototype.draw = function() {
 187         this.fetch();
 188         //this.draw();
 189 }
 190
 191 oilsRptRemoteWidget.prototype.setFetch = function(func) {
 192         this.fetch = func;
 193 }
 194
 195
 196 /* --------------------------------------------------------------------- */
 197
 198 /* custom my-orgs picker */
 199 function oilsRptMyOrgsWidget(node, orgid) {
 200         this.node = node;
 201         this.orgid = orgid;
 202 }
 203
 204 oilsRptMyOrgsWidget.prototype.draw = function() {
 205         var req = new Request(OILS_RPT_FETCH_ORG_FULL_PATH, this.orgid);
 206         var obj = this;
 207         req.callback(
 208                 function(r) { obj.drawWidget(r.getResultObject()); }
 209         );
 210         req.send();
 211 }
 212
 213 oilsRptMyOrgsWidget.prototype.drawWidget = function(orglist) {
 214         var sel = this.node;
 215         for( var i = 0; i < orglist.length; i++ ) {
 216                 var org = orglist[i];
 217                 var opt = insertSelectorVal( this.node, -1,
 218                         org.name(), org.id(), null, findOrgDepth(org) );
 219                 if( org.id() == this.orgid )
 220                         opt.selected = true;
 221         }
 222 }
 223
 224 oilsRptMyOrgsWidget.prototype.getValue = function() {
 225         return getSelectorVal(this.node);
 226 }
 227
 228 /* --------------------------------------------------------------------- */
 229
 230 /* custom all-orgs picker */
 231 oilsRptSetSubClass('oilsRptOrgMultiSelect','oilsRptSelectorMultiWidget');
 232 function oilsRptOrgMultiSelect(args) {
 233         this.initSelectorMultiWidget(args);
 234 }
 235 oilsRptOrgMultiSelect.prototype.draw = function(org) {
 236         if(!org) org = globalOrgTree;
 237         var opt = insertSelectorVal( this.source, -1,
 238                 org.shortname(), org.id(), null, findOrgDepth(org) );
 239         if( org.id() == oilsRptCurrentOrg )
 240                 opt.selected = true;
 241         if( org.children() ) {
 242                 for( var c = 0; c < org.children().length; c++ )
 243                         this.draw(org.children()[c]);
 244         }
 245         this.drawMultiWidget();
 246 }
 247
 248
 249 /* --------------------------------------------------------------------- */
 250 function oilsRptRelDatePicker(args) {
 251         this.node = args.node;
 252         this.relative = args.relative;
 253         this.div = DOM.oils_rpt_relative_date_picker.cloneNode(true);
 254 }
 255
 256 oilsRptRelDatePicker.prototype.draw = function() {
 257         this.node.appendChild(this.div);
 258         unHideMe(this.div);
 259 }
 260
 261 oilsRptRelDatePicker.prototype.getValue = function() {
 262         var str =
 263                 getSelectorVal($n(this.div, 'count')) +
 264                 getSelectorVal($n(this.div,'type'));
 265         if( this.relative ) str = '-'+str;
 266         return str;
 267 }
 268 /* --------------------------------------------------------------------- */
 269
 270
 271
 272
 273
 274
 275
 276
 277 /* --------------------------------------------------------------------- */
 278 /* --------------------------------------------------------------------- */
 279
 280
 281
 282
 283 /* ---------------------------------------------------------------------
 284         Represents a set of value, an inputWidget collects data and a
 285         multi-select displays the data and allows the user to remove items
 286         --------------------------------------------------------------------- */
 287 function oilsRptSetWidget(args) {
 288         this.node = args.node;
 289         this.inputWidget = new args.inputWidget(args);
 290         this.dest = elem('select',
 291                 {multiple:'multiple','class':'oils_rpt_small_info_selector'});
 292 }
 293
 294 oilsRptSetWidget.prototype.draw = function() {
 295
 296         this.addButton = elem('input',{type:'submit',value:"Add"})
 297         this.delButton = elem('input',{type:'submit',value:"Del"})
 298
 299         var obj = this;
 300         this.addButton.onclick = function() {
 301                 obj.addDisplayItems(obj.inputWidget.getDisplayValue());
 302         }
 303
 304         this.delButton.onclick = function(){obj.removeSelected()};
 305
 306         removeChildren(this.node);
 307         this.inputWidget.draw();
 308         this.node.appendChild(elem('br'))
 309         this.node.appendChild(this.addButton);
 310         this.node.appendChild(this.delButton);
 311         this.node.appendChild(elem('br'))
 312         this.node.appendChild(this.dest);
 313 }
 314
 315 oilsRptSetWidget.prototype.addDisplayItems = function(list) {
 316         if( list.constructor != Array ) list = [list];
 317         for(var i = 0; i < list.length; i++) {
 318                 var item = list[i];
 319
 320                 /* no dupes */
 321                 var exists = false;
 322                 iterate(this.dest.options,
 323                         function(o){if(o.getAttribute('value') == item.value) {exists = true; return;}});
 324                 if(exists) continue;
 325
 326                 _debug('Inserting SetWidget values ' + js2JSON(item));
 327                 insertSelectorVal(this.dest, -1, item.label, item.value);
 328         }
 329 }
 330
 331 oilsRptSetWidget.prototype.removeSelected = function() {
 332         oilsDelSelectedItems(this.dest);
 333 }
 334
 335 oilsRptSetWidget.prototype.getValue = function() {
 336         return getSelectedSet(this.dest);
 337 }
 338
 339
 340 /* ---------------------------------------------------------------------
 341         represents a widget that has start and end values.  start and end
 342         are gather from start/end widgets
 343         --------------------------------------------------------------------- */
 344 function oilsRptBetweenWidget(args) {
 345         this.node = args.node;
 346         this.startWidget = new args.startWidget(args);
 347         this.endWidget = new args.endWidget(args);
 348 }
 349 oilsRptBetweenWidget.prototype.draw = function() {
 350         removeChildren(this.node);
 351         this.startWidget.draw();
 352         this.endWidget.draw();
 353 }
 354 oilsRptBetweenWidget.prototype.getValue = function() {
 355         return [
 356                 this.startWidget.getValue(),
 357                 this.endWidget.getValue()
 358         ];
 359 }
 360
 361
 362 /* ---------------------------------------------------------------------
 363         the most basic text input widget
 364         --------------------------------------------------------------------- */
 365 function oilsRptTextWidget(args) {
 366         this.node = args.node;
 367         this.dest = elem('input',{type:'text',size:12});
 368 }
 369 oilsRptTextWidget.prototype.draw = function() {
 370         this.node.appendChild(this.dest);
 371 }
 372
 373 /* returns the "real" value for the widget */
 374 oilsRptTextWidget.prototype.getValue = function() {
 375         return this.dest.value;
 376 }
 377
 378 /* returns the label and "real" value for the widget */
 379 oilsRptTextWidget.prototype.getDisplayValue = function() {
 380         return { label : this.getValue(), value : this.getValue() };
 381 }
 382
 383
 384 /* --------------------------------------------------------------------- */
 385
 386 function oilsRptCalWidget(args) {
 387         this.node = args.node;
 388         this.calFormat = args.calFormat;
 389         this.input = elem('input',{type:'text',size:12});
 390
 391         if( args.inputSize ) {
 392                 this.input.setAttribute('size',args.inputSize);
 393                 this.input.setAttribute('maxlength',args.inputSize);
 394         }
 395 }
 396
 397 oilsRptCalWidget.prototype.draw = function() {
 398         this.button = DOM.generic_calendar_button.cloneNode(true);
 399         this.button.id = oilsNextId();
 400         this.input.id = oilsNextId();
 401
 402         this.node.appendChild(this.button);
 403         this.node.appendChild(this.input);
 404         unHideMe(this.button);
 405
 406         _debug('making calendar widget with format ' + this.calFormat);
 407
 408         Calendar.setup({
 409                 inputField      : this.input.id,
 410                 ifFormat                : this.calFormat,
 411                 button          : this.button.id,
 412                 align                   : "Tl",
 413                 singleClick     : true
 414         });
 415 }
 416
 417 oilsRptCalWidget.prototype.getValue = function() {
 418         return this.input.value;
 419 }
 420
 421 oilsRptCalWidget.prototype.getDisplayValue = function() {
 422         return { label : this.getValue(), value : this.getValue() };
 423 }
 424
 425
 426
 427