[ Index ]

PHP Cross Reference of vtigercrm-6.1.0

title

Body

[close]

/layouts/vlayout/modules/Calendar/resources/ -> CalendarView.js (source)

   1  /*+***********************************************************************************
   2   * The contents of this file are subject to the vtiger CRM Public License Version 1.0
   3   * ("License"); You may not use this file except in compliance with the License
   4   * The Original Code is:  vtiger CRM Open Source
   5   * The Initial Developer of the Original Code is vtiger.
   6   * Portions created by vtiger are Copyright (C) vtiger.
   7   * All Rights Reserved.
   8   *************************************************************************************/
   9  
  10  
  11  jQuery.Class("Calendar_CalendarView_Js",{
  12  
  13      currentInstance : false,
  14  
  15      getInstanceByView : function(){
  16          var view = jQuery('#currentView').val();
  17          var jsFileName = view+'View';
  18          var moduleClassName = view+"_"+jsFileName+"_Js";
  19          if(typeof window[moduleClassName] != 'undefined'){
  20              var instance = new window[moduleClassName]();
  21          } else {
  22              instance = new Calendar_CalendarView_Js();
  23          }
  24          return instance;
  25      },
  26  
  27      initiateCalendarFeeds : function() {
  28          Calendar_CalendarView_Js.currentInstance.performCalendarFeedIntiate();
  29      }
  30  },{
  31  
  32      calendarView : false,
  33      calendarCreateView : false,
  34      //Hold the conditions for a hour format
  35      hourFormatConditionMapping : false,
  36  
  37      //Hold the saved values of calendar settings
  38      calendarSavedSettings : false,
  39  
  40      CalendarSettingsContainer : false,
  41  
  42      weekDaysArray : {Sunday : 0,Monday : 1, Tuesday : 2, Wednesday : 3,Thursday : 4, Friday : 5, Saturday : 6},
  43  
  44      calendarfeedDS : {},
  45  
  46      getCalendarView : function() {
  47          if(this.calendarView == false) {
  48              this.calendarView = jQuery('#calendarview');
  49          }
  50          return this.calendarView;
  51      },
  52  
  53      getCalendarSettingsForm : function() {
  54          return this.CalendarSettingsContainer;
  55      },
  56  
  57      getCalendarCreateView : function() {
  58          var thisInstance = this;
  59          var aDeferred = jQuery.Deferred();
  60  
  61          if(this.calendarCreateView !== false) {
  62              aDeferred.resolve(this.calendarCreateView.clone(true,true));
  63              return aDeferred.promise();
  64          }
  65          var progressInstance = jQuery.progressIndicator();
  66          this.loadCalendarCreateView().then(
  67              function(data){
  68                  progressInstance.hide();
  69                  thisInstance.calendarCreateView = data;
  70                  aDeferred.resolve(data.clone(true,true));
  71              },
  72              function(){
  73                  progressInstance.hide();
  74              }
  75          );
  76          return aDeferred.promise();
  77      },
  78  
  79      loadCalendarCreateView : function() {
  80          var aDeferred  = jQuery.Deferred();
  81          var quickCreateCalendarElement = jQuery('#quickCreateModules').find('[data-name="Calendar"]');
  82          var url = quickCreateCalendarElement.data('url');
  83          var name = quickCreateCalendarElement.data('name');
  84  
  85          var headerInstance = new Vtiger_Header_Js();
  86          headerInstance.getQuickCreateForm(url,name).then(
  87              function(data){
  88                  aDeferred.resolve(jQuery(data));
  89              },
  90              function(){
  91                  aDeferred.reject();
  92              }
  93          );
  94          return aDeferred.promise();
  95      },
  96  
  97      fetchCalendarFeed : function(feedcheckbox) {
  98  		function toDateString(date) {
  99              var d = date.getDate();
 100              var m = date.getMonth() +1;
 101              var y = date.getFullYear();
 102  
 103              d = (d <= 9)? ("0"+d) : d;
 104              m = (m <= 9)? ("0"+m) : m;
 105              return y + "-" + m + "-" + d;
 106          }
 107  
 108          var type = feedcheckbox.data('calendar-sourcekey');
 109          this.calendarfeedDS[type] = function(start, end, callback) {
 110              if(feedcheckbox.not(':checked').length > 0) {
 111                  callback([]);
 112                  return;
 113              }
 114              feedcheckbox.attr('disabled', true);
 115              var params = {
 116                  module: 'Calendar',
 117                  action: 'Feed',
 118                  start: toDateString(start),
 119                  end: toDateString(end),
 120                  type: feedcheckbox.data('calendar-feed'),
 121                  fieldname: feedcheckbox.data('calendar-fieldname'),
 122                  userid : feedcheckbox.data('calendar-userid'),
 123                  color : feedcheckbox.data('calendar-feed-color'),
 124                  textColor : feedcheckbox.data('calendar-feed-textcolor')
 125              }
 126              var customData = feedcheckbox.data('customData');
 127              if( customData != undefined) {
 128                  params = jQuery.extend(params, customData);
 129              }
 130  
 131              AppConnector.request(params).then(function(events){
 132                  callback(events);
 133                  feedcheckbox.attr('disabled', false).attr('checked', true);
 134              },
 135              function(error){
 136                  //To send empty events if error occurs
 137                  callback([]);
 138              });
 139          }
 140  
 141          this.getCalendarView().fullCalendar('addEventSource', this.calendarfeedDS[type]);
 142      },
 143  
 144      fetchAllCalendarFeeds : function(calendarfeedidx) {
 145          var thisInstance = this;
 146          var calendarfeeds = jQuery('[data-calendar-feed]');
 147  
 148          //TODO : see if you get all the feeds in one request
 149          calendarfeeds.each(function(index,element){
 150              var feedcheckbox = jQuery(element);
 151              var    disabledOnes = app.cacheGet('calendar.feeds.disabled',[]);
 152              if (disabledOnes.indexOf(feedcheckbox.data('calendar-sourcekey')) == -1) {
 153                  feedcheckbox.attr('checked',true);
 154              }
 155              thisInstance.fetchCalendarFeed(feedcheckbox);
 156          });
 157      },
 158      
 159      allocateColorsForAllActivityTypes : function() {
 160          var calendarfeeds = jQuery('[data-calendar-feed]');
 161          calendarfeeds.each(function(index,element){
 162              var feedUserElement = jQuery(element);
 163              var feedUserLabel = feedUserElement.closest('.addedCalendars').find('.label')
 164              var color = feedUserElement.data('calendar-feed-color');
 165              var feedModule = feedUserElement.data('calendar-feed');
 166              var feedFieldName = feedUserElement.data('calendar-feed-fieldname');
 167              var sourcekey = feedModule+'_'+feedFieldName;
 168              if(color == '' || typeof color == 'undefined') {
 169                  color = app.cacheGet(sourcekey);
 170                  if(color != null) {
 171                  } else {
 172                      color = '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6);
 173                      app.cacheSet(sourcekey, color);
 174                  }
 175                  feedUserElement.data('calendar-feed-color',color);
 176                  feedUserLabel.css({'background-color':color});
 177              }
 178              var colorContrast = app.getColorContrast(color.slice(1));
 179              if(colorContrast == 'light') {
 180                  var textColor = 'black'
 181              } else {
 182                  textColor = 'white'
 183              }
 184              feedUserElement.data('calendar-feed-textcolor',textColor);
 185              feedUserLabel.css({'color':textColor});
 186          });
 187  
 188      },
 189      
 190      performCalendarFeedIntiate : function() {
 191          this.allocateColorsForAllActivityTypes();
 192          this.registerCalendarFeedChange();
 193          this.fetchAllCalendarFeeds();
 194          this.registerEventForEditUserCalendar();
 195          this.registerEventForDeleteUserCalendar();
 196      },
 197  
 198      registerCalendarFeedChange : function() {
 199          var thisInstance = this;
 200          jQuery('#calendarview-feeds').on('change', '[data-calendar-feed]', function(e){
 201              var currentTarget = $(e.currentTarget);
 202              var type = currentTarget.data('calendar-sourcekey');
 203              if(currentTarget.is(':checked')) {
 204                  // NOTE: We are getting cache data fresh - as it shared between browser tabs
 205                  var disabledOnes = app.cacheGet('calendar.feeds.disabled',[]);
 206                  // http://stackoverflow.com/a/3596096
 207                  disabledOnes = jQuery.grep(disabledOnes, function(value){return value != type;});
 208                  app.cacheSet('calendar.feeds.disabled', disabledOnes);
 209  
 210                  if(!thisInstance.calendarfeedDS[type]){
 211                      thisInstance.fetchAllCalendarFeeds();
 212                  }
 213                  thisInstance.getCalendarView().fullCalendar('addEventSource', thisInstance.calendarfeedDS[type]);
 214              } else {
 215                  // NOTE: We are getting cache data fresh - as it shared between browser tabs
 216                  var disabledOnes = app.cacheGet('calendar.feeds.disabled',[]);
 217                  if (disabledOnes.indexOf(type) == -1) disabledOnes.push(type);
 218                  app.cacheSet('calendar.feeds.disabled', disabledOnes);
 219  
 220                  thisInstance.getCalendarView().fullCalendar('removeEventSource', thisInstance.calendarfeedDS[type]);
 221              }
 222          });
 223      },
 224  
 225      dayClick : function(date, allDay, jsEvent, view){
 226          var thisInstance = this;
 227          this.getCalendarCreateView().then(function(data){
 228              if(data.length <= 0) {
 229                  return;
 230              }
 231              var dateFormat = data.find('[name="date_start"]').data('dateFormat');
 232  
 233              var startDateInstance = Date.parse(date);
 234              var startDateString = app.getDateInVtigerFormat(dateFormat,startDateInstance);
 235              var startTimeString = startDateInstance.toString('hh:mm tt');
 236  
 237              var endDateInstance = Date.parse(date);
 238              if(data.find('[name="activitytype"]').val() == 'Call'){
 239                  var defaulCallDuration = data.find('[name="defaultCallDuration"]').val();
 240                  endDateInstance.addMinutes(defaulCallDuration);
 241              } else {
 242                  var defaultOtherEventDuration = data.find('[name="defaultOtherEventDuration"]').val();
 243                  endDateInstance.addMinutes(defaultOtherEventDuration);
 244              }
 245              var endDateString = app.getDateInVtigerFormat(dateFormat,endDateInstance);
 246              var endTimeString = endDateInstance.toString('hh:mm tt');
 247  
 248              data.find('[name="date_start"]').val(startDateString);
 249              data.find('[name="due_date"]').val(endDateString);
 250  
 251              data.find('[name="time_start"]').val(startTimeString);
 252              data.find('[name="time_end"]').val(endTimeString);
 253  
 254              var headerInstance = new Vtiger_Header_Js();
 255              headerInstance.handleQuickCreateData(data, {callbackFunction:function(data){
 256                      thisInstance.addCalendarEvent(data.result);
 257              }});
 258          });
 259  
 260      },
 261  
 262      addCallMeetingIcons : function(event,element) {
 263          var activityType = event.activitytype;
 264          if(activityType == 'undefined') return;
 265          //imgContainer is event time div in week and day view and fc-event-inner in month view
 266          var imgContainer = element.find('.fc-event-head').length ? element.find('.fc-event-time') : element.find('div.fc-event-inner');
 267          if(activityType == 'Call')
 268              imgContainer.prepend('&nbsp<img width="13px" title="(call)" alt="(call)" src="layouts/vlayout/skins/images/Call_white.png">&nbsp');
 269          if(activityType == 'Meeting')
 270              imgContainer.prepend('&nbsp<img width="14px" title="(meeting)" alt="(meeting)" src="layouts/vlayout/skins/images/Meeting_white.png">&nbsp');
 271      },
 272  
 273  
 274      /**
 275       *Function : strikes out events and tasks with status Held and Completed
 276       */
 277      strikeoutCompletedEventsTasks : function(event,element,view) {
 278          var activityType = event.activitytype;
 279          var title = '',titleStriked = '',target = '';
 280          var status = event.status;
 281          if(activityType === 'Task') {
 282              if(status === 'Completed') {
 283                  title = event.title;
 284                  titleStriked = title.strike();
 285                  target = element.find('.fc-event-title');
 286                  target.html(titleStriked);
 287              }
 288          }
 289          else {
 290              //Item redered is an event
 291              if(status === 'Held') {
 292                  //Full calendar places title along with time for small duration events
 293                  if(!element.find('.fc-event-title').length) {
 294                      target = element.find('.fc-event-time');
 295                      title = target.html();
 296                      titleStriked = title.strike();
 297                  }
 298                  else {
 299                      title = event.title;
 300                      titleStriked = title.strike();
 301                      target = element.find('.fc-event-title');
 302                  }
 303                  target.html(titleStriked);
 304              }
 305          }
 306      },
 307  
 308      registerEventDelete : function(targetElement,calEvent) {
 309          var thisInstance = this;
 310          var recordId = calEvent.id;
 311          targetElement.find('.delete').click(function(e){
 312              var message = app.vtranslate('LBL_DELETE_CONFIRMATION');
 313              Vtiger_Helper_Js.showConfirmationBox({'message' : message}).then(
 314              function(e) {
 315                  //Confirmed to delete
 316                   var params = {
 317                          "module": "Calendar",
 318                          "action": "DeleteAjax",
 319                          "record": recordId
 320                      }
 321                  AppConnector.request(params).then(function(data){
 322                     if(data.success) {
 323                          thisInstance.getCalendarView().fullCalendar('removeEvents', calEvent.id);
 324                          var param = {text:app.vtranslate('JS_RECORD_DELETED')};
 325                          Vtiger_Helper_Js.showMessage(param);
 326                      } else {
 327                          var  params = {
 328                              text : app.vtranslate('JS_NO_DELETE_PERMISSION')
 329                          }
 330                          Vtiger_Helper_Js.showPnotify(params);
 331                      }
 332                      
 333                  });
 334              },
 335              function(error, err){
 336                  e.preventDefault();
 337                  return false;
 338              });  
 339          });
 340      },
 341  
 342      registerCalendar : function(customConfig) {
 343          var thisInstance = this;
 344          var calendarview = this.getCalendarView();
 345  
 346          //User preferred default view
 347          var userDefaultActivityView = jQuery('#activity_view').val();
 348          if(userDefaultActivityView == 'Today'){
 349              userDefaultActivityView ='agendaDay';
 350          }else if(userDefaultActivityView == 'This Week'){
 351              userDefaultActivityView ='agendaWeek';
 352          }else{
 353              userDefaultActivityView ='month';
 354          }
 355  
 356          //Default time format
 357          var userDefaultTimeFormat = jQuery('#time_format').val();
 358          if(userDefaultTimeFormat == 24){
 359              userDefaultTimeFormat = 'H(:mm)';
 360          } else {
 361              userDefaultTimeFormat = 'h(:mm)tt';
 362          }
 363  
 364          //Default first day of the week
 365          var defaultFirstDay = jQuery('#start_day').val();
 366          var convertedFirstDay = thisInstance.weekDaysArray[defaultFirstDay];
 367  
 368          //Default first hour of the day
 369          var defaultFirstHour = jQuery('#start_hour').val();
 370          var explodedTime = defaultFirstHour.split(':');
 371          defaultFirstHour = explodedTime['0'];
 372          
 373          //Date format in agenda view must respect user preference
 374          var dateFormat = jQuery('#date_format').val();
 375          //Converting to fullcalendar accepting date format
 376          monthPos = dateFormat.search("mm");
 377          datePos = dateFormat.search("dd");
 378          if(monthPos < datePos)
 379              dateFormat = "M/d";
 380          else
 381              dateFormat = "d/M";
 382          
 383          var config = {
 384              header: {
 385                  left: 'month,agendaWeek,agendaDay',
 386                  center: 'title today',
 387                  right: 'prev,next'
 388              },
 389              columnFormat: {
 390                  month: 'ddd',
 391                  week: 'ddd '+dateFormat,
 392                  day: 'dddd '+dateFormat
 393              },
 394              height: 600,
 395              timeFormat:userDefaultTimeFormat+'{ - '+userDefaultTimeFormat+'}',
 396              axisFormat: userDefaultTimeFormat,
 397              firstHour : defaultFirstHour,
 398              firstDay : convertedFirstDay,
 399              defaultView: userDefaultActivityView,
 400              editable: true,
 401              slotMinutes : 15,
 402              defaultEventMinutes : 0,
 403  
 404              monthNames: [app.vtranslate('LBL_JANUARY'),app.vtranslate('LBL_FEBRUARY'),app.vtranslate('LBL_MARCH'),
 405                  app.vtranslate('LBL_APRIL'),app.vtranslate('LBL_MAY'),app.vtranslate('LBL_JUNE'),app.vtranslate('LBL_JULY'),
 406                  app.vtranslate('LBL_AUGUST'),app.vtranslate('LBL_SEPTEMBER'), app.vtranslate('LBL_OCTOBER'),
 407                  app.vtranslate('LBL_NOVEMBER'), app.vtranslate('LBL_DECEMBER') ],
 408  
 409              monthNamesShort: [app.vtranslate('LBL_JAN'),app.vtranslate('LBL_FEB'),app.vtranslate('LBL_MAR'),
 410                  app.vtranslate('LBL_APR'),app.vtranslate('LBL_MAY'),app.vtranslate('LBL_JUN'),app.vtranslate('LBL_JUL'),
 411                  app.vtranslate('LBL_AUG'),app.vtranslate('LBL_SEP'),app.vtranslate('LBL_OCT'),app.vtranslate('LBL_NOV'),
 412                  app.vtranslate('LBL_DEC')],
 413  
 414              dayNames: [ app.vtranslate('LBL_SUNDAY'), app.vtranslate('LBL_MONDAY'), app.vtranslate('LBL_TUESDAY'),
 415                  app.vtranslate('LBL_WEDNESDAY'), app.vtranslate('LBL_THURSDAY'), app.vtranslate('LBL_FRIDAY'),
 416                  app.vtranslate('LBL_SATURDAY')],
 417  
 418              dayNamesShort: [ app.vtranslate('LBL_SUN'), app.vtranslate('LBL_MON'), app.vtranslate('LBL_TUE'),
 419                  app.vtranslate('LBL_WED'), app.vtranslate('LBL_THU'), app.vtranslate('LBL_FRI'),
 420                  app.vtranslate('LBL_SAT')],
 421  
 422              buttonText: {
 423                  today: app.vtranslate('LBL_TODAY'),
 424                  month: app.vtranslate('LBL_MONTH'),
 425                  week: app.vtranslate('LBL_WEEK'),
 426                  day: app.vtranslate('LBL_DAY')
 427              },
 428              allDayText : app.vtranslate('LBL_ALL_DAY'),
 429  
 430              dayClick : function(date, allDay, jsEvent, view){thisInstance.dayClick(date, allDay, jsEvent, view);},
 431  
 432             eventAfterRender : function(event,element,view){
 433                                          thisInstance.addCallMeetingIcons(event,element);
 434                                          thisInstance.strikeoutCompletedEventsTasks(event,element,view);
 435                                          /*
 436                                           *Setting calendar view height to large value for week and day view to
 437                                           *avoid loss of display when more number of allday tasks are available
 438                                           **/
 439                                          if(view.name === 'agendaWeek' || view.name === 'agendaDay') {
 440                                              var allDayDiv = jQuery('.fc-view-'+view.name).find('.fc-agenda-divider').prev();
 441                                              if(allDayDiv.height() > 350) view.setHeight(600000);
 442                                          }
 443             },
 444  
 445             eventResize : function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view){
 446                 if(event.module != 'Calendar' && event.module != 'Events'){
 447                     revertFunc();
 448                     return;
 449                 }
 450                  var params = {
 451                      module : 'Calendar',
 452                      action : 'DragDropAjax',
 453                      mode : 'updateDeltaOnResize',
 454                      id : event.id,
 455                      activitytype : event.activitytype,
 456                      dayDelta : dayDelta,
 457                      minuteDelta : minuteDelta,
 458                      view : view.name
 459                  }
 460                  AppConnector.request(params).then(function(data){
 461                      var response = JSON.parse(data);
 462                      if(!response['result'].ispermitted){
 463                          Vtiger_Helper_Js.showPnotify(app.vtranslate('JS_NO_EDIT_PERMISSION'));
 464                          revertFunc();
 465                      }
 466                      if(response['result'].error)
 467                          revertFunc();
 468                  });
 469             },
 470  
 471             eventDrop : function( event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view ) {
 472                      if(event.module != 'Calendar' && event.module != 'Events'){
 473                          revertFunc();
 474                          return;
 475                      }
 476                      if((allDay && event.activitytype != 'Task') || (!allDay && event.activitytype === 'Task')){
 477                          revertFunc();
 478                          return;
 479                      }
 480                      var params = {
 481                          module : 'Calendar',
 482                          action : 'DragDropAjax',
 483                          mode : 'updateDeltaOnDrop',
 484                          id : event.id,
 485                          activitytype : event.activitytype,
 486                          dayDelta : dayDelta,
 487                          minuteDelta : minuteDelta,
 488                          view : view.name
 489                      }
 490                      AppConnector.request(params).then(function(data){
 491                          var response = JSON.parse(data);
 492                          if(!response['result'].ispermitted){
 493                              Vtiger_Helper_Js.showPnotify(app.vtranslate('JS_NO_EDIT_PERMISSION'));
 494                              revertFunc();
 495                          }
 496                      });
 497              },
 498              
 499              eventMouseover : function(calEvent, jsEvent, view) {
 500                  jQuery(this).css('z-index', '10');
 501                  var targetElement = jQuery(this).find('.fc-event-time');
 502                  var trashElement = jQuery(this).find('a.delete');
 503                  if(!trashElement.length) {
 504                      if(!targetElement.length) {
 505                          targetElement = jQuery(this).find('.fc-event-title');
 506                              targetElement.append('<a class="delete" style="position:absolute;right:1px;" href="javascript:void(0)"><i class="icon-trash icon-white"></i></a>'); 
 507                      }
 508                      else {
 509                          if(view.name == 'month') targetElement = jQuery(this).find('.fc-event-inner');
 510                          targetElement.append('<a class="delete" style="position:absolute;right:1px;" href="javascript:void(0)"><i class="icon-trash icon-white"></i></a>');                    
 511                      }
 512                      thisInstance.registerEventDelete(targetElement,calEvent);
 513                  }
 514                  else {
 515                      trashElement.removeClass('hide');
 516                  }
 517              },
 518  
 519              eventMouseout : function(calEvent, jsEvent, view) {
 520                  jQuery(this).css('z-index', '8');
 521                  jQuery(this).find('.delete').addClass('hide');
 522              }
 523          }
 524          if(typeof customConfig != 'undefined'){
 525              config = jQuery.extend(config,customConfig);
 526          }
 527          calendarview.fullCalendar(config);
 528  
 529          //To create custom button to create event or task
 530          jQuery('<span class="pull-left"><button class="btn addButton">'+ app.vtranslate('LBL_ADD_EVENT_TASK') +'</button></span>')
 531                  .prependTo(calendarview.find('.fc-header .fc-header-right')).on('click', 'button', function(e){
 532                      thisInstance.getCalendarCreateView().then(function(data){
 533                          var headerInstance = new Vtiger_Header_Js();
 534                          headerInstance.handleQuickCreateData(data,{callbackFunction:function(data){
 535                                  thisInstance.addCalendarEvent(data.result);
 536                          }});
 537                      });
 538  
 539                  })
 540          jQuery('<span class="pull-right marginLeft5px"><button class="btn"><i id="calendarSettings" class="icon-cog"></i></button></span>')
 541          .prependTo(calendarview.find('.fc-header .fc-header-right')).on('click', 'button', function(e){
 542              var params = {
 543                  module : 'Calendar',
 544                  view : 'Calendar',
 545                  mode : 'Settings'
 546              }
 547              var progressIndicatorInstance = jQuery.progressIndicator({
 548                  });
 549              AppConnector.request(params).then(function(data){
 550                  var callBack = function(data){
 551                      thisInstance.CalendarSettingsContainer = jQuery(data);
 552                      app.showScrollBar(jQuery('div[name="contents"]',data), {'height':'400px'});
 553                      //register all select2 Elements
 554                      app.showSelect2ElementView(jQuery(data).find('select.select2'));
 555  
 556                      progressIndicatorInstance.hide();
 557                      thisInstance.hourFormatConditionMapping = jQuery('input[name="timeFormatOptions"]',data).data('value');
 558                      thisInstance.changeStartHourValuesEvent();
 559                      thisInstance.changeCalendarSharingType(data);
 560                  }
 561                  app.showModalWindow({'data':data,'cb':callBack});
 562              });
 563  
 564          })
 565  
 566      },
 567  
 568      changeCalendarSharingType : function(data) {
 569          var selectedUsersContainer = app.getSelect2ElementFromSelect(jQuery('#selectedUsers',data));
 570          if(jQuery('#selectedUsers').is(':checked')){
 571              selectedUsersContainer.attr('style','display:block;width:90%;');
 572          }
 573          jQuery('[name="sharedtype"]').on('change',function(e) {
 574              var sharingType = jQuery(e.currentTarget).data('sharingtype');
 575  
 576              if(sharingType == 'selectedusers') {
 577                  selectedUsersContainer.show();
 578                  selectedUsersContainer.attr('style','display:block;width:90%;');
 579              } else {
 580                  selectedUsersContainer.hide();
 581              }
 582          });
 583      },
 584  
 585      changeStartHourValuesEvent : function(e){
 586          var form = this.getCalendarSettingsForm();
 587          var thisInstance = this;
 588          form.on('click','input[name="hour_format"]',function(e){
 589              var hourFormatVal = jQuery(e.currentTarget).val();
 590              var startHourElement = jQuery('select[name="start_hour"]',form);
 591              var conditionSelected = startHourElement.val();
 592              var list = thisInstance.hourFormatConditionMapping['hour_format'][hourFormatVal]['start_hour'];
 593              var options = '';
 594              for(var key in list) {
 595                  //IE Browser consider the prototype properties also, it should consider has own properties only.
 596                  if(list.hasOwnProperty(key)) {
 597                      var conditionValue = list[key];
 598                      options += '<option value="'+key+'"';
 599                      if(key == conditionSelected){
 600                          options += ' selected="selected" ';
 601                      }
 602                      options += '>'+conditionValue+'</option>';
 603                  }
 604              }
 605              startHourElement.html(options).trigger("change");
 606          });
 607  
 608  
 609      },
 610  
 611      isAllowedToAddCalendarEvent : function (calendarDetails) {
 612          var activityType = calendarDetails.activitytype.value;
 613          if(activityType == 'Calendar'  && jQuery('[data-calendar-feed="Calendar"]').is(':checked')) {
 614              return true;
 615          } else if(jQuery('[data-calendar-feed="Events"]').is(':checked')){
 616              return true;
 617          } else {
 618              return false;
 619          }
 620      },
 621      addCalendarEvent : function(calendarDetails) {
 622          //If type is not shown then dont render the created event
 623          var isAllowed = this.isAllowedToAddCalendarEvent(calendarDetails);
 624          if(isAllowed == false) return;
 625  
 626          var eventObject = {};
 627          eventObject.id = calendarDetails._recordId;
 628          eventObject.title = calendarDetails.subject.display_value;
 629          var startDate = Date.parse(calendarDetails.date_start.calendar_display_value);
 630          eventObject.start = startDate.toString();
 631          var endDate = Date.parse(calendarDetails.due_date.calendar_display_value);
 632          var assignedUserId = calendarDetails.assigned_user_id.value;
 633          eventObject.end = endDate.toString();
 634          eventObject.url = 'index.php?module=Calendar&view=Detail&record='+calendarDetails._recordId;
 635          if(calendarDetails.activitytype.value == 'Task'){
 636              var color = jQuery('[data-calendar-feed="Calendar"]').data('calendar-feed-color');
 637              var textColor = jQuery('[data-calendar-feed="Calendar"]').data('calendar-feed-textcolor');
 638              eventObject.allDay = true;
 639              eventObject.activitytype = calendarDetails.activitytype.value;
 640              eventObject.status = calendarDetails.taskstatus.value;
 641          }else{
 642              var userElement = jQuery('[data-calendar-userid='+assignedUserId+']');
 643              if(userElement.length > 0) {
 644                  var color = jQuery('[data-calendar-userid='+assignedUserId+']').data('calendar-feed-color');
 645                  var textColor = jQuery('[data-calendar-userid='+assignedUserId+']').data('calendar-feed-textcolor');
 646              } else {
 647                  var color = jQuery('[data-calendar-feed="Events"]').data('calendar-feed-color');
 648                  var textColor = jQuery('[data-calendar-feed="Events"]').data('calendar-feed-textcolor');
 649              }
 650              
 651              eventObject.activitytype = calendarDetails.activitytype.value;
 652              eventObject.status = calendarDetails.eventstatus.value;
 653              eventObject.allDay = false;
 654          }
 655          eventObject.color = color;
 656          eventObject.textColor = textColor;
 657          this.getCalendarView().fullCalendar('renderEvent',eventObject);
 658      },
 659  
 660      restoreActivityTypesWidgetState : function() {
 661          var key = 'Calendar_sideBar_LBL_ACTIVITY_TYPES';
 662          var value = app.cacheGet(key);
 663          var widgetContainer = jQuery("#Calendar_sideBar_LBL_ACTIVITY_TYPES");
 664          if(value == 0){
 665              Vtiger_Index_Js.loadWidgets(widgetContainer,false);
 666          }
 667          else{
 668              Vtiger_Index_Js.loadWidgets(widgetContainer);
 669          }
 670      },
 671      
 672      /**
 673       * Function to register event for add calendar view
 674       */
 675      registerEventForAddCalendarView : function() {
 676          var thisInstance = this;
 677          jQuery('[data-label="LBL_ADDED_CALENDARS"],[data-label="LBL_ACTIVITY_TYPES"]').find('.addCalendarView').click(function(e) {
 678              //To stop the accordion default behaviour when click on add icon
 679              e.stopPropagation();
 680              var currentTarget = jQuery(e.currentTarget);
 681              if(jQuery('#calendarview-feeds').find('.invisibleCalendarViews').val() == 'true') {
 682                  thisInstance.showAddUserCalendarModal(currentTarget);
 683              } else {
 684                  Vtiger_Helper_Js.showPnotify({text: app.vtranslate('JS_NO_CALENDAR_VIEWS_TO_ADD')});
 685              }
 686          });
 687      },
 688      
 689      /**
 690       * Function to register event for delete user calendar
 691       */
 692      registerEventForDeleteUserCalendar : function() {
 693          var thisInstance = this;
 694          var calendarView = jQuery('#calendarview-feeds');
 695          calendarView.find('.deleteCalendarView').on('click', function(e) {
 696              e.preventDefault();
 697              var currentTarget = jQuery(e.currentTarget);
 698              var feedcheckbox = currentTarget.closest('.addedCalendars').find('[data-calendar-feed]');
 699              var message = app.vtranslate('JS_CALENDAR_VIEW_DELETE_CONFIRMATION');
 700              Vtiger_Helper_Js.showConfirmationBox({'message' : message}).then(function(data) {
 701                  thisInstance.deleteCalendarView(feedcheckbox).then(function() {
 702                          var params = {
 703                              text: app.vtranslate('JS_CALENDAR_VIEW_DELETED_SUCCESSFULLY'),
 704                              type: 'info'
 705                          };
 706                          Vtiger_Helper_Js.showPnotify(params);
 707                      });
 708                  },
 709                  function(error, err){
 710                  }
 711              );
 712          })
 713      },
 714      
 715      /**
 716       * Function used to delete calendar view
 717       */
 718      deleteCalendarView : function(feedcheckbox) {
 719          var aDeferred = jQuery.Deferred();
 720          var thisInstance = this;
 721          var params = {
 722              module: 'Calendar',
 723              action: 'CalendarUserActions',
 724              mode : 'deleteCalendarView',
 725              viewmodule : feedcheckbox.data('calendar-feed'),
 726              viewfieldname : feedcheckbox.data('calendar-fieldname'),
 727              viewfieldlabel : feedcheckbox.data('calendar-fieldlabel')
 728          }
 729          
 730          AppConnector.request(params).then(function(response) {
 731              var result = response['result'];
 732              
 733              feedcheckbox.closest('.addedCalendars').remove();
 734              //After delete user reset accodion height to auto
 735              thisInstance.resetAccordionHeight();
 736              //Remove the events of deleted user in shared calendar feed
 737              thisInstance.getCalendarView().fullCalendar('removeEventSource', thisInstance.calendarfeedDS[feedcheckbox.data('calendar-sourcekey')]);
 738              
 739              //Update the adding and editing users list in hidden modal
 740              var userSelectElement = jQuery('#calendarview-feeds').find('[name="usersCalendarList"]');
 741              userSelectElement.append('<option value="'+result['viewfieldname']+'" data-viewmodule="'+result['viewmodule']+'">'+result['viewfieldlabel']+'</option>');
 742              var editUserSelectElement = jQuery('#calendarview-feeds').find('[name="editingUsersList"]');
 743              editUserSelectElement.find('option[value="'+result['viewfieldname']+'"]').remove();
 744              jQuery('#calendarview-feeds').find('.invisibleCalendarViews').val('true');
 745              
 746              aDeferred.resolve();
 747          },
 748          function(error){
 749              aDeferred.reject();
 750          });
 751          
 752          return aDeferred.promise();
 753      },
 754      
 755      resetAccordionHeight : function() {
 756          var accordionContainer = jQuery('[name="calendarViewTypes"]').parent();
 757          if(accordionContainer.hasClass('in')) {
 758              accordionContainer.css('height', 'auto');
 759          }
 760      },
 761      
 762      /**
 763       * Function to register event for edit user calendar color
 764       */
 765      registerEventForEditUserCalendar : function() {
 766          var thisInstance = this;
 767          var parentElement = jQuery('#calendarview-feeds');
 768          parentElement.on('click', '.editCalendarColor', function(e) {
 769              e.preventDefault();
 770              var currentTarget = jQuery(e.currentTarget);
 771              var addedCalendarEle = currentTarget.closest('.addedCalendars');
 772              var feedUserEle = addedCalendarEle.find('[data-calendar-feed]');
 773              var editCalendarViewsList = jQuery('#calendarview-feeds').find('.editCalendarViewsList');
 774              var selectElement = editCalendarViewsList.find('[name="editingUsersList"]');
 775              selectElement.find('option:selected').removeAttr('selected');
 776              selectElement.find('option[value="'+feedUserEle.data('calendar-fieldname')+'"]').attr('selected', true);
 777              thisInstance.showAddUserCalendarModal(currentTarget);
 778          })
 779      },
 780      
 781      /**
 782       * Function to show add calendar modal
 783       */
 784      showAddUserCalendarModal : function(currentEle) {
 785          var thisInstance = this;
 786          var addCalendarModal = jQuery('#calendarview-feeds').find('.addViewsToCalendar');
 787          var clonedContainer = addCalendarModal.clone(true, true);
 788  
 789          var callBackFunction = function(data) {
 790              data.find('.addViewsToCalendar').removeClass('hide');
 791              var selectedUserColor = data.find('.selectedUserColor');
 792              var selectedUser = data.find('.selectedUser');
 793              var selectedViewModule = data.find('.selectedViewModule');
 794              var addCalendarViewsList = data.find('.addCalendarViewsList');
 795              var editCalendarViewsList = data.find('.editCalendarViewsList');
 796              
 797              //check its edit mode or add mode, show modal respective to that mode
 798              if(currentEle.hasClass('editCalendarColor')) {
 799                  addCalendarViewsList.addClass('hide');
 800                  editCalendarViewsList.removeClass('hide');
 801                  data.find('.modal-header h3').text(app.vtranslate('JS_EDIT_CALENDAR'));
 802                  data.find('.userCalendarMode').val('edit');
 803                  //on change of calendar view, color picker should update with that calendar view color
 804                  thisInstance.registerViewsListChangeEvent(data);
 805                  
 806                  var addedCalendarEle = currentEle.closest('.addedCalendars');
 807                  var feedUserEle = addedCalendarEle.find('[data-calendar-feed]');
 808                  selectedUserColor.val(feedUserEle.data('calendar-feed-color'));
 809                  //color picker params for edit calendar view color
 810                  var customParams = {
 811                      color : feedUserEle.data('calendar-feed-color')
 812                  };
 813              } else {
 814                  addCalendarViewsList.removeClass('hide');
 815                  editCalendarViewsList.addClass('hide');
 816                  data.find('.userCalendarMode').val('add');
 817                  //while adding new calendar view set the random color to the color picker
 818                  var randomColor = '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6);
 819                  selectedUserColor.val(randomColor);
 820                  //color picker params for add calendar view
 821                  var customParams = {
 822                      color : randomColor
 823                  };
 824              }
 825              
 826              //register color picker
 827              var params = {
 828                  flat : true,
 829                  onChange : function(hsb, hex, rgb) {
 830                      var selectedColor = '#'+hex;
 831                      selectedUserColor.val(selectedColor);
 832                  }
 833              };
 834              if(typeof customParams != 'undefined'){
 835                  params = jQuery.extend(params,customParams);
 836              }
 837              data.find('.calendarColorPicker').ColorPicker(params);
 838              
 839              //save the user calendar with color
 840              data.find('[name="saveButton"]').click(function(e) {
 841                  if(currentEle.hasClass('addCalendarView')) {
 842                      var selectElement = data.find('select[name="usersCalendarList"]');
 843                  } else {
 844                      var selectElement = data.find('select[name="editingUsersList"]');
 845                  }
 846                  selectedUser.val(selectElement.val()).attr('data-username', selectElement.find('option:selected').text());
 847                  selectedViewModule.val(selectElement.find('option:selected').data('viewmodule'));
 848                  thisInstance.saveUserCalendar(data, currentEle);
 849                  
 850              });
 851          }
 852          
 853          app.showModalWindow(clonedContainer,function(data) {
 854              if(typeof callBackFunction == 'function') {
 855                  callBackFunction(data);
 856              }
 857          }, {'width':'1000px'});
 858      },
 859      
 860      /**
 861       * Function to register change event for users list select element in edit user calendar modal
 862       */
 863      registerViewsListChangeEvent : function(data) {
 864          var parentElement = jQuery('#calendarview-feeds');
 865          var selectElement = data.find('[name="editingUsersList"]');
 866          var selectedUserColor = data.find('.selectedUserColor');
 867          var selectedViewModule = data.find('.selectedViewModule');
 868          
 869          //on change of edit user, update color picker with the selected user color
 870          selectElement.on('change', function() {
 871              var selectedOption = selectElement.find('option:selected');
 872              var fieldName = selectedOption.val();
 873              var userColor = jQuery('[data-calendar-fieldname="'+fieldName+'"]', parentElement).data('calendar-feed-color');
 874              selectedUserColor.val(userColor);
 875              selectedViewModule.val(selectedOption.data('viewmodule'));
 876              data.find('.calendarColorPicker').ColorPickerSetColor(userColor);
 877          });
 878      },
 879      
 880      /**
 881       * Function to save added user calendar
 882       */
 883      saveUserCalendar : function(data, currentEle) {
 884          var thisInstance = this;
 885          var userColor = data.find('.selectedUserColor').val();
 886          var fieldName = data.find('.selectedUser').val();
 887          var moduleName = data.find('.selectedViewModule').val();
 888          var userName = data.find('.selectedUser').data('username');
 889          var params = {
 890              module: 'Calendar',
 891              action: 'CalendarUserActions',
 892              mode : 'addCalendarView',
 893              viewmodule : moduleName,
 894              viewfieldname : fieldName,
 895              viewColor : userColor
 896          };
 897          
 898          AppConnector.request(params).then(function() {
 899              app.hideModalWindow();
 900              
 901              var parentElement = jQuery('#calendarview-feeds');
 902              var colorContrast = app.getColorContrast(userColor.slice(1));
 903              if(colorContrast == 'light') {
 904                  var textColor = 'black'
 905              } else {
 906                  textColor = 'white'
 907              }
 908              
 909              if(data.find('.userCalendarMode').val() == 'edit') {
 910                  var feedUserEle = jQuery('[data-calendar-fieldname="'+fieldName+'"]', parentElement);
 911                  
 912                  feedUserEle.data('calendar-feed-color',userColor).data('calendar-feed-textcolor',textColor);
 913                  feedUserEle.closest('.addedCalendars').find('.label').css({'background-color':userColor,'color':textColor});
 914                  
 915                  thisInstance.getCalendarView().fullCalendar('removeEventSource', thisInstance.calendarfeedDS[feedUserEle.data('calendar-sourcekey')]);
 916                  thisInstance.fetchCalendarFeed(feedUserEle);
 917                  
 918                  //notification message
 919                  var message = app.vtranslate('JS_CALENDAR_VIEW_COLOR_UPDATED_SUCCESSFULLY');
 920              } else {
 921                  var labelModal = jQuery('.labelModal', parentElement);
 922                  var clonedContainer = labelModal.clone(true, true);
 923                  var labelView = clonedContainer.find('label');
 924                  feedUserEle = labelView.find('[type="checkbox"]');
 925                  feedUserEle.attr('checked', 'checked');
 926                  feedUserEle.attr('data-calendar-sourcekey', fieldName).attr('data-calendar-feed', moduleName).attr('data-calendar-feed-color',userColor)
 927                          .attr('data-calendar-feed-textcolor',textColor).attr('data-calendar-fieldname',fieldName).attr('data-calendar-fieldlabel', userName);
 928                  feedUserEle.closest('.addedCalendars').find('.label').css({'background-color':userColor,'color':textColor}).text(userName);
 929                  parentElement.append(labelView);
 930                  
 931                  //After add activityType reset accodion height to auto
 932                  thisInstance.resetAccordionHeight();
 933                  
 934                  thisInstance.fetchCalendarFeed(feedUserEle);
 935                  
 936                  //Update the adding and editing users list in hidden modal
 937                  var userSelectElement = jQuery('#calendarview-feeds').find('[name="usersCalendarList"]');
 938                  userSelectElement.find('option[value="'+fieldName+'"]').remove();
 939                  
 940                  if(userSelectElement.find('option').length <= 0) {
 941                      jQuery('#calendarview-feeds').find('.invisibleCalendarViews').val('false');
 942                  }
 943                  
 944                  var editUserSelectElement = jQuery('#calendarview-feeds').find('[name="editingUsersList"]');
 945                  editUserSelectElement.append('<option value="'+fieldName+'" data-viewmodule="'+moduleName+'">'+userName+'</option>');
 946                  
 947                  //notification message
 948                  var message = app.vtranslate('JS_CALENDAR_VIEW_ADDED_SUCCESSFULLY');
 949              }
 950              
 951              //show notification after add or edit user
 952              var params = {
 953                  text: message,
 954                  type: 'info'
 955              };
 956              Vtiger_Helper_Js.showPnotify(params);
 957          },
 958          function(error){
 959              
 960          });
 961          
 962      },
 963      
 964      registerEvents : function() {
 965          this.registerCalendar();
 966          this.restoreActivityTypesWidgetState();
 967          //register event for add calendar view
 968          this.registerEventForAddCalendarView();
 969          return this;
 970      }
 971  });
 972  
 973  jQuery(document).ready(function() {
 974      var instance = Calendar_CalendarView_Js.getInstanceByView();
 975      instance.registerEvents()
 976      Calendar_CalendarView_Js.currentInstance = instance;
 977  })


Generated: Fri Nov 28 20:08:37 2014 Cross-referenced by PHPXref 0.7.1