[calendar] Added OBCalendar and OBMultiCalendar classes
authorDavid Baz Fayos <david.baz@openbravo.com>
Fri, 11 Jan 2013 00:58:29 +0100
changeset 19505 c64e1099f893
parent 19504 0846e40dec50
child 19506 3c91850c93e5
[calendar] Added OBCalendar and OBMultiCalendar classes
modules/org.openbravo.client.application/src/org/openbravo/client/application/ApplicationComponentProvider.java
modules/org.openbravo.client.application/web/org.openbravo.client.application/js/calendar/ob-calendar.js
modules/org.openbravo.client.application/web/org.openbravo.client.application/js/calendar/ob-multicalendar.js
modules/org.openbravo.client.application/web/org.openbravo.client.application/js/form/formitem/ob-formitem-calendar.js
modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-calendar-styles.css
modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-calendar-styles.js
modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-form-styles.css
modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-form-styles.js
--- a/modules/org.openbravo.client.application/src/org/openbravo/client/application/ApplicationComponentProvider.java	Fri Jan 11 00:55:36 2013 +0100
+++ b/modules/org.openbravo.client.application/src/org/openbravo/client/application/ApplicationComponentProvider.java	Fri Jan 11 00:58:29 2013 +0100
@@ -11,7 +11,7 @@
  * under the License.
  * The Original Code is Openbravo ERP.
  * The Initial Developer of the Original Code is Openbravo SLU
- * All portions are Copyright (C) 2010-2012 Openbravo SLU
+ * All portions are Copyright (C) 2010-2013 Openbravo SLU
  * All Rights Reserved.
  * Contributor(s):  ______________________________________.
  ************************************************************************
@@ -157,7 +157,9 @@
     globalResources.add(createStaticResource(
         "web/org.openbravo.client.application/js/main/ob-tab.js", false));
     globalResources.add(createStaticResource(
-        "web/org.openbravo.client.application/js/form/formitem/ob-formitem-calendar.js", true));
+        "web/org.openbravo.client.application/js/calendar/ob-calendar.js", true));
+    globalResources.add(createStaticResource(
+        "web/org.openbravo.client.application/js/calendar/ob-multicalendar.js", true));
     globalResources.add(createStaticResource(
         "web/org.openbravo.client.application/js/grid/ob-grid.js", false));
 
@@ -293,6 +295,10 @@
     globalResources.add(createStyleSheetResource(
         "web/org.openbravo.userinterface.smartclient/openbravo/skins/"
             + KernelConstants.SKIN_PARAMETER
+            + "/org.openbravo.client.application/ob-calendar-styles.css", false));
+    globalResources.add(createStyleSheetResource(
+        "web/org.openbravo.userinterface.smartclient/openbravo/skins/"
+            + KernelConstants.SKIN_PARAMETER
             + "/org.openbravo.client.application/ob-grid-styles.css", false));
     globalResources.add(createStyleSheetResource(
         "web/org.openbravo.userinterface.smartclient/openbravo/skins/"
@@ -343,6 +349,10 @@
     globalResources.add(createStaticResource(
         "web/org.openbravo.userinterface.smartclient/openbravo/skins/"
             + KernelConstants.SKIN_PARAMETER
+            + "/org.openbravo.client.application/ob-calendar-styles.js", false));
+    globalResources.add(createStaticResource(
+        "web/org.openbravo.userinterface.smartclient/openbravo/skins/"
+            + KernelConstants.SKIN_PARAMETER
             + "/org.openbravo.client.application/ob-grid-styles.js", false));
     globalResources.add(createStaticResource(
         "web/org.openbravo.userinterface.smartclient/openbravo/skins/"
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/modules/org.openbravo.client.application/web/org.openbravo.client.application/js/calendar/ob-calendar.js	Fri Jan 11 00:58:29 2013 +0100
@@ -0,0 +1,322 @@
+/*
+ *************************************************************************
+ * The contents of this file are subject to the Openbravo  Public  License
+ * Version  1.1  (the  "License"),  being   the  Mozilla   Public  License
+ * Version 1.1  with a permitted attribution clause; you may not  use. this
+ * file except in compliance with the License. You  may  obtain  a copy of
+ * the License at http://www.openbravo.com/legal/license.html
+ * Software distributed under the License  is  distributed  on  an "AS IS"
+ * basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
+ * License for the specific  language  governing  rights  and  limitations
+ * under the License.
+ * The Original Code is Openbravo ERP.
+ * The Initial Developer of the Original Code is Openbravo SLU
+ * All portions are Copyright (C) 2013 Openbravo SLU
+ * All Rights Reserved.
+ * Contributor(s):  ______________________________________.
+ ************************************************************************
+ */
+
+
+// == OBCalendar_EventDialogBridge ==
+// Hack to allow the OBCalendar open its own full customizable EventDialog (OBEventEditor)
+isc.ClassFactory.defineClass('OBCalendar_EventDialogBridge', isc.Window);
+
+isc.OBCalendar_EventDialogBridge.addProperties({
+  show: function () {
+    this.Super('show', arguments);
+
+    var calendar = this.calendar,
+        currentStart = this.currentStart,
+        currentEnd = this.currentEnd,
+        event = this.event;
+
+    if (calendar.OBEventEditor) {
+      calendar.OBEventEditor.setProperties({
+        calendar: calendar,
+        currentStart: currentStart,
+        currentEnd: currentEnd,
+        event: event
+      });
+      calendar.OBEventEditor.initComponents();
+      calendar.OBEventEditor.show();
+      this.closeClick();
+    }
+  }
+});
+
+// == OBCalendar_EventDialogBridge ==
+// Hack to allow calendar TabSet style personalization
+isc.ClassFactory.defineClass('OBCalendarTabSet', isc.TabSet);
+
+// == OBClientClassCanvasItem ==
+// Extends Calendar, with some customizations (most of them styling related)
+isc.ClassFactory.defineClass('OBCalendar', isc.Calendar);
+
+
+isc.OBCalendar.addProperties({
+  autoFetchData: true,
+  initWidget: function () {
+    var calendar = this,
+        multiCalendar = this.multiCalendar;
+
+    this.eventWindowStyle = OB.Styles.OBCalendar.eventWindowStyle;
+    this.datePickerButtonDefaults.src = OB.Styles.OBCalendar.datePickerButton.src;
+    this.datePickerButtonDefaults.width = OB.Styles.OBCalendar.datePickerButton.width;
+    this.datePickerButtonDefaults.height = OB.Styles.OBCalendar.datePickerButton.height;
+    this.previousButtonDefaults.src = OB.Styles.OBCalendar.previousButton.src;
+    this.previousButtonDefaults.width = OB.Styles.OBCalendar.previousButton.width;
+    this.previousButtonDefaults.height = OB.Styles.OBCalendar.previousButton.height;
+    this.nextButtonDefaults.src = OB.Styles.OBCalendar.nextButton.src;
+    this.nextButtonDefaults.width = OB.Styles.OBCalendar.nextButton.width;
+    this.nextButtonDefaults.height = OB.Styles.OBCalendar.nextButton.height;
+    this.controlsBarDefaults.layoutTopMargin = OB.Styles.OBCalendar.controlsTopMarging;
+
+    this.mainViewDefaults._constructor = isc.OBCalendarTabSet;
+    this.eventDialogDefaults._constructor = isc.OBCalendar_EventDialogBridge;
+    this.eventDialogDefaults.calendar = this;
+
+    if (!this.eventIdField) {
+      this.eventIdField = 'eventId';
+    }
+    if (typeof this.showAddEventControl === 'undefined') {
+      this.showAddEventControl = true;
+    }
+    if (typeof this.showDatePickerControl === 'undefined') {
+      this.showDatePickerControl = true;
+    }
+    if (this.OBEventEditorClass) {
+      this.OBEventEditor = isc[this.OBEventEditorClass].create({});
+    }
+
+    this.dataSource = OB.Datasource.create({
+      dataURL: this.dataSourceProps.dataURL,
+      fields: [{
+        name: this.eventIdField,
+        primaryKey: true
+      }, {
+        name: this.nameField
+      }, {
+        name: this.descriptionField
+      }, {
+        name: this.startDateField,
+        type: "datetime"
+      }, {
+        name: this.endDateField,
+        type: "datetime"
+      }],
+
+      // these are read extra from the server with the events
+      additionalProperties: this.dataSourceProps.additionalProperties,
+
+      transformRequest: function (dsRequest) {
+        dsRequest.params = dsRequest.params || {};
+        dsRequest.params._extraProperties = this.additionalProperties;
+        dsRequest.willHandleError = true;
+
+        return this.Super('transformRequest', arguments);
+      },
+      transformResponse: function (dsResponse, dsRequest, data) {
+        var showDSAlert, records = data && data.response && data.response.data,
+            i;
+
+        showDSAlert = function (text) {
+          isc.warn(text, function () {
+            return true;
+          }, {
+            icon: '[SKINIMG]Dialog/error.png',
+            title: OB.I18N.getLabel('OBUIAPP_Error')
+          });
+        };
+
+        // handle error
+        if (data && data.response && data.response.error) {
+          showDSAlert(data.response.error.message);
+          calendar.filterData();
+        } else if (data && data.response && data.response.errors) {
+          showDSAlert(JSON.stringify(data.response.errors));
+          calendar.filterData();
+        } else {
+          if (records && multiCalendar && multiCalendar.showCustomEventsBgColor) {
+            for (i = 0; i < records.getLength(); i++) {
+              records[i].eventWindowStyle = multiCalendar.eventStyles[records[i][calendar.legendIdField]] + ' ' + OB.Styles.OBCalendar.eventWindowStyle;
+            }
+          }
+        }
+        return this.Super('transformResponse', arguments);
+      },
+
+      // override the addData, updateData and removeData to wrap
+      // the calendar callback to prevent adding events in cased
+      // of errors
+      addData: function (newRecord, callback, requestProperties) {
+        var newCallBack = function (dsResponse, data, dsRequest) {
+            // don't call if there is an error
+            if (dsResponse.status < 0) {
+              return;
+            }
+            callback(dsResponse, data, dsRequest);
+            };
+        return this.Super('addData', [newRecord, newCallBack, requestProperties]);
+      },
+      updateData: function (updatedRecord, callback, requestProperties) {
+        var newCallBack = function (dsResponse, data, dsRequest) {
+            // don't call if there is an error
+            if (dsResponse.status < 0) {
+              return;
+            }
+            callback(dsResponse, data, dsRequest);
+            };
+        return this.Super('updateData', [updatedRecord, newCallBack, requestProperties]);
+      },
+      removeData: function (recordKeys, callback, requestProperties) {
+        var newCallBack = function (dsResponse, data, dsRequest) {
+            // don't call if there is an error
+            if (dsResponse.status < 0) {
+              return;
+            }
+            callback(dsResponse, data, dsRequest);
+            };
+        return this.Super('removeData', [recordKeys, newCallBack, requestProperties]);
+      }
+    });
+    this.Super('initWidget', arguments);
+    this.controlsBar.reorderMember(4, 1); // Moves the 'next' button to the second position
+    this.controlsBar.reorderMember(2, 4); // Moves the 'displayed date' to last position
+    if (this.defaultViewName && ((this.showDayView !== false && this.showWeekView !== false) || (this.showDayView !== false && this.showMonthView !== false) || (this.showWeekView !== false && this.showMonthView !== false))) {
+      this.setCurrentViewName(this.defaultViewName);
+    }
+    if (!this.showAddEventControl) {
+      this.addEventButton.hide();
+    }
+    if (!this.showDatePickerControl) {
+      this.datePickerButton.hide();
+    }
+
+    if (this.showDayView !== false) {
+      this.dayView.baseStyle = OB.Styles.OBCalendar.dayView_baseStyle;
+    }
+    if (this.showWeekView !== false) {
+      this.weekView.baseStyle = OB.Styles.OBCalendar.weekView_baseStyle;
+      this.weekView.headerBaseStyle = OB.Styles.OBCalendar.weekView_headerBaseStyle;
+    }
+    if (this.showMonthView !== false) {
+      this.monthView.baseStyle = OB.Styles.OBCalendar.monthView_baseStyle;
+      this.monthView.headerBaseStyle = OB.Styles.OBCalendar.monthView_headerBaseStyle;
+    }
+  },
+
+  eventResized: function (newDate, event) {
+    return this.Super('eventResized', arguments);
+  },
+  eventRemoved: function (event) {
+    return this.Super('eventRemoved', arguments);
+  },
+  eventMoved: function (newDate, event) {
+    return this.Super('eventMoved', arguments);
+  },
+  showOBEventDialog: function () {
+    var dialog = isc.OBPopup.create({});
+    dialog.show();
+  },
+
+  getCriteria: function (criteria) {
+    var startTime, endTime, legend, i, orPart = {
+      operator: 'or',
+      criteria: []
+    };
+
+    if (this.month === 0) {
+      startTime = new Date(this.year - 1, 11, 23, 0, 0, 0);
+    } else {
+      startTime = new Date(this.year, this.month - 1, 23, 0, 0, 0);
+    }
+
+    if (!criteria || !criteria.operator) {
+      criteria = {
+        _constructor: "AdvancedCriteria",
+        operator: "and"
+      };
+    }
+    criteria.criteria = criteria.criteria || [];
+
+    // add the date criteria
+    if (this.month === 11) {
+      endTime = new Date(this.year + 1, 0, 7, 0, 0, 0);
+    } else {
+      endTime = new Date(this.year, this.month + 1, 7, 0, 0, 0);
+    }
+    criteria.criteria.push({
+      fieldName: this.startDateField,
+      operator: "greaterOrEqual",
+      value: startTime
+    });
+    criteria.criteria.push({
+      fieldName: this.endDateField,
+      operator: "lessThan",
+      value: endTime
+    });
+
+    if (this.multiCalendar) {
+      legend = this.multiCalendar.leftControls.getLegendValueMap();
+      for (i = 0; i < legend.getLength(); i++) {
+        if (legend[i].checked) {
+          orPart.criteria.push({
+            fieldName: this.legendIdField,
+            operator: 'equals',
+            value: legend[i].id
+          });
+        }
+      }
+      // some dummy value to force an empty resultset
+      if (orPart.criteria.getLength() === 0) {
+        orPart.criteria.push({
+          fieldName: this.legendIdField,
+          operator: 'equals',
+          value: new Date().getTime().toString()
+        });
+      }
+      criteria.criteria.push(orPart);
+    }
+
+    // always force a reload
+    criteria.criteria.push(isc.OBRestDataSource.getDummyCriterion());
+
+    return criteria;
+  },
+
+  fetchData: function (criteria, callback, request) {
+    return this.Super('fetchData', [this.getCriteria(criteria), callback, request]);
+  },
+
+  filterData: function (criteria) {
+    return this.Super('filterData', [this.getCriteria(criteria)]);
+  },
+
+  // read the dates for the current month
+  dateChanged: function () {
+    if (this.multiCalendar) {
+      this.multiCalendar.leftControls.dateChooser.setData(this.chosenDate);
+    }
+
+    // no change
+    if (this.month === this.prevMonth) {
+      return;
+    }
+
+    this.prevMonth = this.month;
+    this.filterData();
+  },
+
+  addEvent: function (startDate, endDate, name, description, otherFields, ignoreDataChanged) {
+    var i, legend = this.multiCalendar.leftControls.getLegendValueMap();
+    otherFields = otherFields || {};
+
+    // solve bug that otherwise time fields are not passed in
+    startDate.logicalDate = false;
+    endDate.logicalDate = false;
+
+    return this.Super('addEvent', [startDate, endDate, name, description, otherFields, ignoreDataChanged]);
+  }
+
+});
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/modules/org.openbravo.client.application/web/org.openbravo.client.application/js/calendar/ob-multicalendar.js	Fri Jan 11 00:58:29 2013 +0100
@@ -0,0 +1,347 @@
+/*
+ *************************************************************************
+ * The contents of this file are subject to the Openbravo  Public  License
+ * Version  1.1  (the  "License"),  being   the  Mozilla   Public  License
+ * Version 1.1  with a permitted attribution clause; you may not  use. this
+ * file except in compliance with the License. You  may  obtain  a copy of
+ * the License at http://www.openbravo.com/legal/license.html
+ * Software distributed under the License  is  distributed  on  an "AS IS"
+ * basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
+ * License for the specific  language  governing  rights  and  limitations
+ * under the License.
+ * The Original Code is Openbravo ERP.
+ * The Initial Developer of the Original Code is Openbravo SLU
+ * All portions are Copyright (C) 2013 Openbravo SLU
+ * All Rights Reserved.
+ * Contributor(s):  ______________________________________.
+ ************************************************************************
+ */
+
+isc.ClassFactory.defineClass('OBMultiCalendar', isc.HLayout);
+
+isc.ClassFactory.defineClass('OBMultiCalendarLeftControls', isc.VLayout);
+
+isc.ClassFactory.defineClass('OBMultiCalendarCalendar', isc.OBCalendar);
+
+isc.ClassFactory.defineClass('OBMultiCalendarLegend', isc.VLayout);
+
+isc.ClassFactory.defineClass('OBMultiCalendarLegendElement', isc.HLayout);
+
+isc.OBMultiCalendarLegendElement.addProperties({
+  height: 20,
+  width: 162,
+  color: null,
+  name: null,
+  id: null,
+  checked: true,
+  overflow: 'hidden',
+  initWidget: function () {
+    var checkbox, color, name;
+    this.Super('initWidget', arguments);
+    if (this.checked === 'true') {
+      this.checked = true;
+    }
+    if (this.checked === 'false') {
+      this.checked = false;
+    }
+    OB.Utilities.Style.addRule('.bgColor_' + this.color, 'background-color: ' + OB.Utilities.getRGBAStringFromOBColor(this.color) + ';' + 'color: ' + (OB.Utilities.getBrightFromOBColor(this.color) > 125 ? 'black' : 'white'));
+    checkbox = isc.DynamicForm.create({
+      width: 20,
+      checked: this.checked,
+      fields: [{
+        height: 16,
+        width: 20,
+        showTitle: false,
+        value: this.checked,
+        changed: function (form, item, value) {
+          var calendarData = form.parentElement.multiCalendar.calendarData,
+              i;
+          this.Super('changed', arguments);
+          for (i = 0; i < calendarData.calendars.length; i++) {
+            if (calendarData.calendars[i].id === form.parentElement.id) {
+              calendarData.calendars[i].checked = value;
+            }
+          }
+          form.parentElement.multiCalendar.refreshCalendar();
+        },
+        type: 'checkbox'
+      }]
+    });
+    color = isc.Layout.create({
+      width: 15,
+      height: 18,
+      styleName: 'OBMultiCalendarLegendElementColor',
+      backgroundColor: OB.Utilities.getRGBAStringFromOBColor(this.color)
+    });
+    name = isc.Label.create({
+      height: 10,
+      width: 118,
+      styleName: 'OBMultiCalendarLegendElementName',
+      contents: this.name
+    });
+    this.addMembers([checkbox, color, name]);
+  }
+});
+
+isc.OBMultiCalendarLegend.addProperties({
+  // height: '*',
+  overflow: 'auto',
+  membersMargin: 5,
+
+  initWidget: function () {
+    this.multiCalendar.OBMultiCalendarLegend = this;
+    this.Super('initWidget', arguments);
+  },
+
+  updateMembers: function (newMembers) {
+    var i;
+    if (this.members) {
+      for (i = this.members.length - 1; i > -1; i--) {
+        this.members[i].destroy();
+      }
+    }
+    this.multiCalendar.eventStyles = {};
+
+    for (i = 0; i < newMembers.length; i++) {
+      this.addMember(isc.OBMultiCalendarLegendElement.create({
+        multiCalendar: this.multiCalendar,
+        color: newMembers[i].color,
+        name: newMembers[i].name,
+        id: newMembers[i].id,
+        checked: newMembers[i].checked
+      }));
+      this.multiCalendar.eventStyles[newMembers[i].id] = 'bgColor_' + newMembers[i].color;
+    }
+
+    if (this.multiCalendar.leftControls) {
+      // initialized so refresh
+      this.multiCalendar.refreshCalendar();
+    }
+  }
+});
+
+isc.OBMultiCalendarLeftControls.addProperties({
+  width: '200',
+  height: '100%',
+  layoutLeftMargin: 10,
+  layoutRightMargin: 10,
+  layoutTopMargin: 10,
+  membersMargin: 5,
+  defaultLayoutAlign: 'center',
+  filter: null,
+  dateChooser: null,
+  legend: null,
+  getFilterValueMap: function () {
+    var filterObj = {},
+        calendarData = this.multiCalendar.calendarData,
+        i;
+    for (i = 0; i < calendarData.filters.length; i++) {
+      filterObj[calendarData.filters[i].id] = calendarData.filters[i].name;
+    }
+    return filterObj;
+  },
+  getLegendValueMap: function () {
+    var calendarData = this.multiCalendar.calendarData,
+        legendArray = [],
+        i;
+    for (i = 0; i < calendarData.calendars.length; i++) {
+      if (calendarData.hasFilter === false || calendarData.calendars[i].filterId === this.filter.getValue('filter')) {
+        legendArray.push(calendarData.calendars[i]);
+      }
+    }
+    return legendArray;
+  },
+  initWidget: function () {
+    var button, label, legend, leftControls = this;
+    this.Super('initWidget', arguments);
+    if (this.multiCalendar.calendarData.hasFilter) {
+      this.filter = isc.DynamicForm.create({
+        fields: [{
+          name: 'filter',
+          title: leftControls.multiCalendar.filterName,
+          type: 'comboBox',
+          valueMap: leftControls.getFilterValueMap(),
+          value: leftControls.multiCalendar.calendarData.currentFilter,
+          width: 180,
+          titleOrientation: 'top',
+          required: true,
+          changed: function (form, item, value) {
+            this.Super('changed', arguments);
+            leftControls.multiCalendar.calendarData.currentFilter = value;
+            leftControls.legend.updateMembers(leftControls.getLegendValueMap());
+          },
+
+          cellStyle: OB.Styles.OBFormField.DefaultComboBox.cellStyle,
+          titleStyle: OB.Styles.OBFormField.DefaultComboBox.titleStyle,
+          textBoxStyle: OB.Styles.OBFormField.DefaultComboBox.textBoxStyle,
+          pendingTextBoxStyle: OB.Styles.OBFormField.DefaultComboBox.pendingTextBoxStyle,
+          controlStyle: OB.Styles.OBFormField.DefaultComboBox.controlStyle,
+          pickListBaseStyle: OB.Styles.OBFormField.DefaultComboBox.pickListBaseStyle,
+          pickListTallBaseStyle: OB.Styles.OBFormField.DefaultComboBox.pickListTallBaseStyle,
+          pickerIconStyle: OB.Styles.OBFormField.DefaultComboBox.pickerIconStyle,
+          pickerIconSrc: OB.Styles.OBFormField.DefaultComboBox.pickerIconSrc,
+          height: OB.Styles.OBFormField.DefaultComboBox.height,
+          pickerIconWidth: OB.Styles.OBFormField.DefaultComboBox.pickerIconWidth,
+          // fixes issue https://issues.openbravo.com/view.php?id=15105
+          pickListCellHeight: OB.Styles.OBFormField.DefaultComboBox.quickRunPickListCellHeight,
+          recentPropertyName: this.recentPropertyName,
+          pickListProperties: {
+            textMatchStyle: 'substring',
+            selectionType: 'single',
+            bodyStyleName: OB.Styles.OBFormField.DefaultComboBox.pickListProperties.bodyStyleName
+          },
+          pickListHeaderHeight: 0
+        }]
+      });
+    } else {
+      this.filter = isc.VLayout.create({
+        height: 8
+      });
+    }
+    button = isc.OBLinkButtonItem.create({
+      width: 180,
+      title: '[ Create Event ]',
+      click: function () {
+        leftControls.multiCalendar.calendar.addEventButton.click();
+      }
+    });
+    this.dateChooser = isc.OBDateChooser.create({
+      autoHide: false,
+      showCancelButton: false,
+      firstDayOfWeek: this.multiCalendar.firstDayOfWeek,
+      dataChanged: function (param) {
+        this.parentElement.multiCalendar.calendar.setChosenDate(this.getData());
+        this.parentElement.multiCalendar.calendar.setCurrentViewName('day');
+      }
+    });
+    label = isc.Label.create({
+      height: 10,
+      contents: this.multiCalendar.legendName + ' :'
+    });
+    this.legend = isc.OBMultiCalendarLegend.create({
+      multiCalendar: this.multiCalendar
+    });
+    this.legend.updateMembers(leftControls.getLegendValueMap());
+    this.addMembers([this.filter]);
+    if (this.multiCalendar.canCreateEvents) {
+      this.addMembers([button]);
+    }
+    this.addMembers([this.dateChooser, label, this.legend]);
+  }
+});
+
+isc.OBMultiCalendar.addProperties({
+  width: '100%',
+  height: '100%',
+  filterName: 'Filter',
+  legendName: 'Legend',
+  defaultViewName: null,
+  calendarData: null,
+  showLeftControls: true,
+  showCustomEventsBgColor: true,
+
+  parseCalendarData: function (calendarData) {
+    var i;
+    if (calendarData.filters) {
+      calendarData.hasFilter = true;
+    } else {
+      calendarData.hasFilter = false;
+    }
+    for (i = 0; i < calendarData.calendars.length; i++) {
+      if (typeof calendarData.calendars[i].checked === 'undefined') {
+        calendarData.calendars[i].checked = true;
+      }
+      if (typeof calendarData.calendars[i].color === 'undefined') {
+        calendarData.calendars[i].color = OB.Utilities.generateOBColor(
+        null, null, null, 100, calendarData.calendars[i].id);
+      }
+    }
+    return calendarData;
+  },
+  setLoading: function (value) {
+    if (value !== false) {
+      if (this.members[1]) {
+        this.members[1].hide();
+      }
+      if (this.members[2]) {
+        this.members[2].hide();
+      }
+      if (this.members[0]) {
+        this.members[0].show();
+      }
+    } else {
+      if (this.members[0]) {
+        this.members[0].hide();
+      }
+      if (this.members[1]) {
+        this.members[1].show();
+      }
+      if (this.members[2]) {
+        this.members[2].show();
+      }
+    }
+  },
+  initComponents: function () {
+    var callback, i, me = this;
+    for (i = this.members.length - 1; i > -1; i--) {
+      this.members[i].destroy();
+    }
+    if (this.calendarProps.firstDayOfWeek) {
+      this.firstDayOfWeek = this.calendarProps.firstDayOfWeek;
+    } else {
+      this.firstDayOfWeek = 1;
+    }
+    if (this.calendarProps.filterName) {
+      this.filterName = this.calendarProps.filterName;
+    }
+    if (this.calendarProps.legendName) {
+      this.legendName = this.calendarProps.legendName;
+    }
+    if (typeof this.calendarProps.showLeftControls !== 'undefined') {
+      this.showLeftControls = this.calendarProps.showLeftControls;
+    }
+    if (typeof this.calendarProps.showCustomEventsBgColor !== 'undefined') {
+      this.showCustomEventsBgColor = this.calendarProps.showCustomEventsBgColor;
+    }
+    if (typeof this.calendarProps.canCreateEvents !== 'undefined') {
+      this.canCreateEvents = this.calendarProps.canCreateEvents;
+    } else {
+      this.showCustomEventsBgColor = true;
+    }
+    this.addMembers([OB.Utilities.createLoadingLayout()]);
+    callback = function (rpcResponse, data, rpcRequest) {
+      me.calendarData = me.parseCalendarData(data);
+      me.drawComponents();
+    };
+    OB.RemoteCallManager.call(this.calendarProps.calendarDataActionHandler, {
+      action: 'calendarData'
+    }, {}, callback);
+  },
+
+  initWidget: function () {
+    this.initComponents();
+    this.Super('initWidget', arguments);
+  },
+  drawComponents: function () {
+    this.leftControls = isc.OBMultiCalendarLeftControls.create({
+      multiCalendar: this
+    });
+    this.calendar = isc.OBMultiCalendarCalendar.create(isc.addProperties(this.calendarProps, {
+      multiCalendar: this
+    }));
+    this.setLoading(false);
+    if (this.showLeftControls) {
+      this.addMembers([this.leftControls]);
+    }
+    this.addMembers([isc.VLayout.create({
+      members: [this.calendar]
+    })]);
+    this.refreshCalendar();
+  },
+
+  refreshCalendar: function () {
+    if (this.calendar) {
+      this.calendar.filterData();
+    }
+  }
+});
\ No newline at end of file
--- a/modules/org.openbravo.client.application/web/org.openbravo.client.application/js/form/formitem/ob-formitem-calendar.js	Fri Jan 11 00:55:36 2013 +0100
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,57 +0,0 @@
-/*
- *************************************************************************
- * The contents of this file are subject to the Openbravo  Public  License
- * Version  1.1  (the  "License"),  being   the  Mozilla   Public  License
- * Version 1.1  with a permitted attribution clause; you may not  use. this
- * file except in compliance with the License. You  may  obtain  a copy of
- * the License at http://www.openbravo.com/legal/license.html
- * Software distributed under the License  is  distributed  on  an "AS IS"
- * basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
- * License for the specific  language  governing  rights  and  limitations
- * under the License.
- * The Original Code is Openbravo ERP.
- * The Initial Developer of the Original Code is Openbravo SLU
- * All portions are Copyright (C) 2012 Openbravo SLU
- * All Rights Reserved.
- * Contributor(s):  ______________________________________.
- ************************************************************************
- */
-
-// == OBClientClassCanvasItem ==
-// Extends Calendar, with some customizations (most of them styling related)
-isc.ClassFactory.defineClass('OBCalendar', isc.Calendar);
-
-isc.ClassFactory.defineClass('OBCalendarTabSet', isc.TabSet);
-
-
-isc.OBCalendar.addProperties({
-  initWidget: function () {
-    this.firstDayOfWeek = 1;
-    this.eventWindowStyle = OB.Styles.OBCalendar.eventWindowStyle;
-    this.datePickerButtonDefaults.src = OB.Styles.OBCalendar.datePickerButton.src;
-    this.datePickerButtonDefaults.width = OB.Styles.OBCalendar.datePickerButton.width;
-    this.datePickerButtonDefaults.height = OB.Styles.OBCalendar.datePickerButton.height;
-    this.previousButtonDefaults.src = OB.Styles.OBCalendar.previousButton.src;
-    this.previousButtonDefaults.width = OB.Styles.OBCalendar.previousButton.width;
-    this.previousButtonDefaults.height = OB.Styles.OBCalendar.previousButton.height;
-    this.nextButtonDefaults.src = OB.Styles.OBCalendar.nextButton.src;
-    this.nextButtonDefaults.width = OB.Styles.OBCalendar.nextButton.width;
-    this.nextButtonDefaults.height = OB.Styles.OBCalendar.nextButton.height;
-    this.controlsBarDefaults.layoutTopMargin = OB.Styles.OBCalendar.controlsTopMarging;
-    this.mainViewDefaults._constructor = isc.OBCalendarTabSet;
-    this.Super('initWidget', arguments);
-    this.controlsBar.reorderMember(4, 1); // Moves the 'next' button to the second position
-    this.controlsBar.reorderMember(2, 4); // Moves the 'displayed date' to last position
-    if (this.showDayView !== false) {
-      this.dayView.baseStyle = OB.Styles.OBCalendar.dayView_baseStyle;
-    }
-    if (this.showWeekView !== false) {
-      this.weekView.baseStyle = OB.Styles.OBCalendar.weekView_baseStyle;
-      this.weekView.headerBaseStyle = OB.Styles.OBCalendar.weekView_headerBaseStyle;
-    }
-    if (this.showMonthView !== false) {
-      this.monthView.baseStyle = OB.Styles.OBCalendar.monthView_baseStyle;
-      this.monthView.headerBaseStyle = OB.Styles.OBCalendar.monthView_headerBaseStyle;
-    }
-  }
-});
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-calendar-styles.css	Fri Jan 11 00:58:29 2013 +0100
@@ -0,0 +1,93 @@
+/*
+ *************************************************************************
+ * The contents of this file are subject to the Openbravo  Public  License
+ * Version  1.1  (the  "License"),  being   the  Mozilla   Public  License
+ * Version 1.1  with a permitted attribution clause; you may not  use this
+ * file except in compliance with the License. You  may  obtain  a copy of
+ * the License at http://www.openbravo.com/legal/license.html
+ * Software distributed under the License  is  distributed  on  an "AS IS"
+ * basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
+ * License for the specific  language  governing  rights  and  limitations
+ * under the License.
+ * The Original Code is Openbravo ERP.
+ * The Initial Developer of the Original Code is Openbravo SLU
+ * All portions are Copyright (C) 2013 Openbravo SLU
+ * All Rights Reserved.
+ * Contributor(s):  ______________________________________.
+ ************************************************************************
+*/
+
+.OBEventWindowHeader {
+  font-family: Verdana,Bitstream Vera Sans,sans-serif;
+  font-weight: bold;
+  font-size: 9px;
+  background-color: #FFE1C0;
+}
+
+.OBEventWindowBody {
+  font-family: Verdana,Bitstream Vera Sans,sans-serif;
+  font-size: 9px;
+  background-color: #FFE1C0;
+}
+
+.OBCalendarLegendElementColor {
+  margin: 3px 0px 0px 0px;
+}
+.OBCalendarLegendElementTitle {
+  padding: 4px 0px 0px 5px;
+}
+
+.OBCalendarGridCell {
+  border: 1px solid #cdd7bb;
+  border-width: 0px 1px 1px 0px;
+  font-family: arial, sans-serif;
+  font-size: 11px;
+}
+
+.OBCalendarGridCellWorkday {
+  border: 1px solid #cdd7bb;
+  border-width: 0px 1px 1px 0px;
+  font-family: arial, sans-serif;
+  font-size: 11px;
+}
+.OBCalendarGridCellDark {
+  border: 1px solid #cdd7bb;
+  border-width: 0px 1px 1px 0px;
+  font-family: arial, sans-serif;
+  font-size: 11px;
+}
+.OBCalendarGridCellDisabled {
+  border: 1px solid #cdd7bb;
+  border-width: 0px 1px 1px 0px;
+  font-family: arial, sans-serif;
+  font-size: 11px;
+  background-color: #F5F5F5;
+}
+
+.OBCalendarGridHeaderCell {
+  font-size: 11px;
+  font-family: 'lucida sans', sans-serif;
+  font-weight: bold;
+  border: 1px solid #BBBFB6;
+  border-width: 0px 1px 0px 0px;
+  text-align: center;
+  background-image: url(./images/grid/gridHeader_bg.png);
+}
+
+.OBCalendarGridHeaderCellOver {
+  font-size: 11px;
+  font-family: 'lucida sans', sans-serif;
+  font-weight: bold;
+  border: 1px solid #BBBFB6;
+  border-width: 0px 1px 0px 0px;
+  text-align: center;
+  background-image: url(./images/grid/gridHeader_bg_Over.png);
+}
+
+.OBMultiCalendarLegendElementColor {
+  margin: 3px 0px 0px 0px;
+}
+
+.OBMultiCalendarLegendElementName {
+  padding: 4px 0px 0px 5px;
+}
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-calendar-styles.js	Fri Jan 11 00:58:29 2013 +0100
@@ -0,0 +1,88 @@
+/*
+ *************************************************************************
+ * The contents of this file are subject to the Openbravo  Public  License
+ * Version  1.1  (the  "License"),  being   the  Mozilla   Public  License
+ * Version 1.1  with a permitted attribution clause; you may not  use this
+ * file except in compliance with the License. You  may  obtain  a copy of
+ * the License at http://www.openbravo.com/legal/license.html
+ * Software distributed under the License  is  distributed  on  an "AS IS"
+ * basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
+ * License for the specific  language  governing  rights  and  limitations
+ * under the License.
+ * The Original Code is Openbravo ERP.
+ * The Initial Developer of the Original Code is Openbravo SLU
+ * All portions are Copyright (C) 2013 Openbravo SLU
+ * All Rights Reserved.
+ * Contributor(s):  ______________________________________.
+ ************************************************************************
+ */
+
+isc.OBCalendarTabSet.addProperties({
+  tabBarProperties: {
+    simpleTabBaseStyle: 'OBTabBarButtonMain',
+    paneContainerClassName: 'OBTabSetMainContainer',
+    buttonConstructor: isc.OBTabBarButton,
+
+    buttonProperties: {
+      // prevent the orange hats
+      customState: 'Inactive',
+
+      src: '',
+      capSize: 14,
+      titleStyle: 'OBTabBarButtonMainTitle'
+    }
+  },
+  tabBarPosition: 'top',
+  tabBarAlign: 'left',
+  width: '100%',
+  height: '100%',
+  overflow: 'hidden',
+
+  showTabPicker: false,
+
+  // get rid of the margin around the content of a pane
+  paneMargin: 0,
+  paneContainerMargin: 0,
+  paneContainerPadding: 0,
+  showPaneContainerEdges: false,
+
+  useSimpleTabs: true,
+  tabBarThickness: 30,
+  styleName: 'OBTabSetMain',
+  simpleTabBaseStyle: 'OBTabBarButtonMain',
+  paneContainerClassName: 'OBTabSetMainContainer',
+
+  scrollerSrc: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/tab/tabBarButtonMain_OverflowIcon.png',
+  pickerButtonSrc: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/tab/tabBarButtonMain_OverflowIconPicker.png'
+});
+
+OB.Styles.OBCalendar = {
+  controlsTopMarging: 6,
+  eventWindowStyle: 'OBEventWindow',
+  datePickerButton: {
+    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/form/date_control.png',
+    width: 21,
+    height: 21
+  },
+  addEventButton: {
+    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/form/add_icon.png',
+    // It doesn't exist yet
+    width: 21,
+    height: 21
+  },
+  previousButton: {
+    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/statusbar/iconButton-previous.png',
+    width: 20,
+    height: 20
+  },
+  nextButton: {
+    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/statusbar/iconButton-next.png',
+    width: 20,
+    height: 20
+  },
+  dayView_baseStyle: 'OBCalendarGridCell',
+  weekView_baseStyle: 'OBCalendarGridCell',
+  weekView_headerBaseStyle: 'OBCalendarGridHeaderCell',
+  monthView_baseStyle: 'OBCalendarGridCell',
+  monthView_headerBaseStyle: 'OBCalendarGridHeaderCell'
+};
\ No newline at end of file
--- a/modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-form-styles.css	Fri Jan 11 00:55:36 2013 +0100
+++ b/modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-form-styles.css	Fri Jan 11 00:58:29 2013 +0100
@@ -11,7 +11,7 @@
  * under the License.
  * The Original Code is Openbravo ERP.
  * The Initial Developer of the Original Code is Openbravo SLU
- * All portions are Copyright (C) 2010-2012 Openbravo SLU
+ * All portions are Copyright (C) 2010-2013 Openbravo SLU
  * All Rights Reserved.
  * Contributor(s):  ______________________________________.
  ************************************************************************
@@ -28,7 +28,6 @@
  * SectionItem Button
  * Dialog
  * Note section
- * Calendar Item
 =======================================================================*/
 
 /*=======================================================================
@@ -880,75 +879,4 @@
 
 a.OBNoteListGridDelete:hover {
   text-decoration: underline;
-}
-
-/*=======================================================================
- * Calendar Item
-=======================================================================*/
-
-.OBEventWindowHeader {
-  font-family: Verdana,Bitstream Vera Sans,sans-serif;
-  font-weight: bold;
-  font-size: 9px;
-  background-color: #FFE1C0;
-}
-
-.OBEventWindowBody {
-  font-family: Verdana,Bitstream Vera Sans,sans-serif;
-  font-size: 9px;
-  background-color: #FFE1C0;
-}
-
-.OBCalendarLegendElementColor {
-  margin: 3px 0px 0px 0px;
-}
-.OBCalendarLegendElementTitle {
-  padding: 4px 0px 0px 5px;
-}
-
-.OBCalendarGridCell {
-  border: 1px solid #cdd7bb;
-  border-width: 0px 1px 1px 0px;
-  font-family: arial, sans-serif;
-  font-size: 11px;
-}
-
-.OBCalendarGridCellWorkday {
-  border: 1px solid #cdd7bb;
-  border-width: 0px 1px 1px 0px;
-  font-family: arial, sans-serif;
-  font-size: 11px;
-}
-.OBCalendarGridCellDark {
-  border: 1px solid #cdd7bb;
-  border-width: 0px 1px 1px 0px;
-  font-family: arial, sans-serif;
-  font-size: 11px;
-}
-.OBCalendarGridCellDisabled {
-  border: 1px solid #cdd7bb;
-  border-width: 0px 1px 1px 0px;
-  font-family: arial, sans-serif;
-  font-size: 11px;
-  background-color: #F5F5F5;
-}
-
-.OBCalendarGridHeaderCell {
-  font-size: 11px;
-  font-family: 'lucida sans', sans-serif;
-  font-weight: bold;
-  border: 1px solid #BBBFB6;
-  border-width: 0px 1px 0px 0px;
-  text-align: center;
-  background-image: url(./images/grid/gridHeader_bg.png);
-}
-
-.OBCalendarGridHeaderCellOver {
-  font-size: 11px;
-  font-family: 'lucida sans', sans-serif;
-  font-weight: bold;
-  border: 1px solid #BBBFB6;
-  border-width: 0px 1px 0px 0px;
-  text-align: center;
-  background-image: url(./images/grid/gridHeader_bg_Over.png);
-}
+}
\ No newline at end of file
--- a/modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-form-styles.js	Fri Jan 11 00:55:36 2013 +0100
+++ b/modules/org.openbravo.client.application/web/org.openbravo.userinterface.smartclient/openbravo/skins/Default/org.openbravo.client.application/ob-form-styles.js	Fri Jan 11 00:58:29 2013 +0100
@@ -11,7 +11,7 @@
  * under the License.
  * The Original Code is Openbravo ERP.
  * The Initial Developer of the Original Code is Openbravo SLU
- * All portions are Copyright (C) 2010-2012 Openbravo SLU
+ * All portions are Copyright (C) 2010-2013 Openbravo SLU
  * All Rights Reserved.
  * Contributor(s):  ______________________________________.
  ************************************************************************
@@ -24,7 +24,6 @@
  * 3) SectionItem Button Styles
  * 3) Attachments Styles
  * 4) Image Popup Styles
- * 5) Calendar Styles
  =======================================================================*/
 
 /* =====================================================================
@@ -561,78 +560,4 @@
   height: 50,
   width: 450,
   align: 'center'
-});
-
-/* =====================================================================
-  * Calendar Styles
-  =======================================================================*/
-
-isc.OBCalendarTabSet.addProperties({
-  tabBarProperties: {
-    simpleTabBaseStyle: 'OBTabBarButtonMain',
-    paneContainerClassName: 'OBTabSetMainContainer',
-    buttonConstructor: isc.OBTabBarButton,
-
-    buttonProperties: {
-      // prevent the orange hats
-      customState: 'Inactive',
-
-      src: '',
-      capSize: 14,
-      titleStyle: 'OBTabBarButtonMainTitle'
-    }
-  },
-  tabBarPosition: 'top',
-  tabBarAlign: 'left',
-  width: '100%',
-  height: '100%',
-  overflow: 'hidden',
-
-  showTabPicker: false,
-
-  // get rid of the margin around the content of a pane
-  paneMargin: 0,
-  paneContainerMargin: 0,
-  paneContainerPadding: 0,
-  showPaneContainerEdges: false,
-
-  useSimpleTabs: true,
-  tabBarThickness: 30,
-  styleName: 'OBTabSetMain',
-  simpleTabBaseStyle: 'OBTabBarButtonMain',
-  paneContainerClassName: 'OBTabSetMainContainer',
-
-  scrollerSrc: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/tab/tabBarButtonMain_OverflowIcon.png',
-  pickerButtonSrc: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/tab/tabBarButtonMain_OverflowIconPicker.png'
-});
-
-OB.Styles.OBCalendar = {
-  controlsTopMarging: 6,
-  eventWindowStyle: 'OBEventWindow',
-  datePickerButton: {
-    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/form/date_control.png',
-    width: 21,
-    height: 21
-  },
-  addEventButton: {
-    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/form/add_icon.png',
-    // It doesn't exist yet
-    width: 21,
-    height: 21
-  },
-  previousButton: {
-    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/statusbar/iconButton-previous.png',
-    width: 20,
-    height: 20
-  },
-  nextButton: {
-    src: OB.Styles.skinsPath + 'Default/org.openbravo.client.application/images/statusbar/iconButton-next.png',
-    width: 20,
-    height: 20
-  },
-  dayView_baseStyle: 'OBCalendarGridCell',
-  weekView_baseStyle: 'OBCalendarGridCell',
-  weekView_headerBaseStyle: 'OBCalendarGridHeaderCell',
-  monthView_baseStyle: 'OBCalendarGridCell',
-  monthView_headerBaseStyle: 'OBCalendarGridHeaderCell'
-};
\ No newline at end of file
+});
\ No newline at end of file