Update class name in subscriptions folder list after saving folder properties

Thomas Bruederli

2014-01-14 7c28d45c8e9a448002595d26ca5cf88726b47123

 program/js/app.js

@@ -198,22 +198,23 @@
            multiselect:true, multiexpand:true, draggable:true, keyboard:true,
            column_movable:this.env.col_movable, dblclick_time:this.dblclick_time
            });
          this.message_list.row_init = function(o){ p.init_message_row(o); };
          this.message_list.addEventListener('dblclick', function(o){ p.msglist_dbl_click(o); });
          this.message_list.addEventListener('click', function(o){ p.msglist_click(o); });
          this.message_list.addEventListener('keypress', function(o){ p.msglist_keypress(o); });
          this.message_list.addEventListener('select', function(o){ p.msglist_select(o); });
          this.message_list.addEventListener('dragstart', function(o){ p.drag_start(o); });
          this.message_list.addEventListener('dragmove', function(e){ p.drag_move(e); });
          this.message_list.addEventListener('dragend', function(e){ p.drag_end(e); });
          this.message_list.addEventListener('expandcollapse', function(e){ p.msglist_expand(e); });
          this.message_list.addEventListener('column_replace', function(e){ p.msglist_set_coltypes(e); });
          this.message_list.addEventListener('listupdate', function(e){ p.triggerEvent('listupdate', e); });
          this.message_list
            .addEventListener('initrow', function(o) { p.init_message_row(o); })
            .addEventListener('dblclick', function(o) { p.msglist_dbl_click(o); })
            .addEventListener('click', function(o) { p.msglist_click(o); })
            .addEventListener('keypress', function(o) { p.msglist_keypress(o); })
            .addEventListener('select', function(o) { p.msglist_select(o); })
            .addEventListener('dragstart', function(o) { p.drag_start(o); })
            .addEventListener('dragmove', function(e) { p.drag_move(e); })
            .addEventListener('dragend', function(e) { p.drag_end(e); })
            .addEventListener('expandcollapse', function(o) { p.msglist_expand(o); })
            .addEventListener('column_replace', function(o) { p.msglist_set_coltypes(o); })
            .addEventListener('listupdate', function(o) { p.triggerEvent('listupdate', o); })
            .init();

          document.onmouseup = function(e){ return p.doc_mouse_up(e); };
          this.gui_objects.messagelist.parentNode.onmousedown = function(e){ return p.click_on_list(e); };

          this.message_list.init();
          this.enable_command('toggle_status', 'toggle_flag', 'sort', true);

          // load messages
@@ -313,9 +314,11 @@
        if (this.gui_objects.contactslist) {
          this.contact_list = new rcube_list_widget(this.gui_objects.contactslist,
            { multiselect:true, draggable:false, keyboard:false });
          this.contact_list.addEventListener('select', function(o){ ref.compose_recipient_select(o); });
          this.contact_list.addEventListener('dblclick', function(o){ ref.compose_add_recipient('to'); });
          this.contact_list.init();
          this.contact_list
            .addEventListener('initrow', function(o) { p.triggerEvent('insertrow', { cid:o.uid, row:o }); })
            .addEventListener('select', function(o) { ref.compose_recipient_select(o); })
            .addEventListener('dblclick', function(o) { ref.compose_add_recipient('to'); })
            .init();
        }

        if (this.gui_objects.addressbookslist) {
@@ -352,13 +355,14 @@
        if (this.gui_objects.contactslist) {
          this.contact_list = new rcube_list_widget(this.gui_objects.contactslist,
            {multiselect:true, draggable:this.gui_objects.folderlist?true:false, keyboard:true});
          this.contact_list.row_init = function(row){ p.triggerEvent('insertrow', { cid:row.uid, row:row }); };
          this.contact_list.addEventListener('keypress', function(o){ p.contactlist_keypress(o); });
          this.contact_list.addEventListener('select', function(o){ p.contactlist_select(o); });
          this.contact_list.addEventListener('dragstart', function(o){ p.drag_start(o); });
          this.contact_list.addEventListener('dragmove', function(e){ p.drag_move(e); });
          this.contact_list.addEventListener('dragend', function(e){ p.drag_end(e); });
          this.contact_list.init();
          this.contact_list
            .addEventListener('initrow', function(o) { p.triggerEvent('insertrow', { cid:o.uid, row:o }); })
            .addEventListener('keypress', function(o) { p.contactlist_keypress(o); })
            .addEventListener('select', function(o) { p.contactlist_select(o); })
            .addEventListener('dragstart', function(o) { p.drag_start(o); })
            .addEventListener('dragmove', function(e) { p.drag_move(e); })
            .addEventListener('dragend', function(e) { p.drag_end(e); })
            .init();

          if (this.env.cid)
            this.contact_list.highlight_row(this.env.cid);
@@ -415,35 +419,39 @@
        }

        if (this.gui_objects.identitieslist) {
          this.identity_list = new rcube_list_widget(this.gui_objects.identitieslist, {multiselect:false, draggable:false, keyboard:false});
          this.identity_list.addEventListener('select', function(o){ p.identity_select(o); });
          this.identity_list.init();
          this.identity_list.focus();
          this.identity_list = new rcube_list_widget(this.gui_objects.identitieslist,
            {multiselect:false, draggable:false, keyboard:false});
          this.identity_list
            .addEventListener('select', function(o) { p.identity_select(o); })
            .init()
            .focus();

          if (this.env.iid)
            this.identity_list.highlight_row(this.env.iid);
        }
        else if (this.gui_objects.sectionslist) {
          this.sections_list = new rcube_list_widget(this.gui_objects.sectionslist, {multiselect:false, draggable:false, keyboard:false});
          this.sections_list.addEventListener('select', function(o){ p.section_select(o); });
          this.sections_list.init();
          this.sections_list.focus();
          this.sections_list
            .addEventListener('select', function(o) { p.section_select(o); })
            .init()
            .focus();
        }
        else if (this.gui_objects.subscriptionlist) {
          this.init_subscription_list();
        }
        else if (this.gui_objects.responseslist) {
          this.responses_list = new rcube_list_widget(this.gui_objects.responseslist, {multiselect:false, draggable:false, keyboard:false});
          this.responses_list.addEventListener('select', function(list) {
            var win, id = list.get_single_selection();
            p.enable_command('delete', !!id && $.inArray(id, p.env.readonly_responses) < 0);
            if (id && (win = p.get_frame_window(p.env.contentframe))) {
              p.set_busy(true);
              p.location_href({ _action:'edit-response', _key:id, _framed:1 }, win);
            }
          });
          this.responses_list.init();
          this.responses_list.focus();
          this.responses_list
            .addEventListener('select', function(list) {
              var win, id = list.get_single_selection();
              p.enable_command('delete', !!id && $.inArray(id, p.env.readonly_responses) < 0);
              if (id && (win = p.get_frame_window(p.env.contentframe))) {
                p.set_busy(true);
                p.location_href({ _action:'edit-response', _key:id, _framed:1 }, win);
              }
            })
            .init()
            .focus();
        }

        break;
@@ -509,11 +517,12 @@
          id_prefix: 'rcmli',
          id_encode: this.html_identifier_encode,
          id_decode: this.html_identifier_decode,
          check_droptarget: function(node){ return !node.virtual && ref.check_droptarget(node.id) }
          check_droptarget: function(node) { return !node.virtual && ref.check_droptarget(node.id) }
        });
        this.treelist.addEventListener('collapse', function(node){ ref.folder_collapsed(node) });
        this.treelist.addEventListener('expand', function(node){ ref.folder_collapsed(node) });
        this.treelist.addEventListener('select', function(node){ ref.triggerEvent('selectfolder', { folder:node.id, prefix:'rcmli' }) });
        this.treelist
          .addEventListener('collapse', function(node) { ref.folder_collapsed(node) })
          .addEventListener('expand', function(node) { ref.folder_collapsed(node) })
          .addEventListener('select', function(node) { ref.triggerEvent('selectfolder', { folder:node.id, prefix:'rcmli' }) });
      }
    }

@@ -842,14 +851,14 @@
      case 'move':
      case 'moveto': // deprecated
        if (this.task == 'mail')
          this.move_messages(props);
          this.move_messages(props, obj);
        else if (this.task == 'addressbook')
          this.move_contacts(props);
        break;

      case 'copy':
        if (this.task == 'mail')
          this.copy_messages(props);
          this.copy_messages(props, obj);
        else if (this.task == 'addressbook')
          this.copy_contacts(props);
        break;
@@ -1411,8 +1420,6 @@

  this.drag_start = function(list)
  {
    var model = this.task == 'mail' ? this.env.mailboxes : this.env.contactfolders;

    this.drag_active = true;

    if (this.preview_timer)
@@ -2612,10 +2619,12 @@
  };

  // copy selected messages to the specified mailbox
  this.copy_messages = function(mbox)
  this.copy_messages = function(mbox, obj)
  {
    if (mbox && typeof mbox === 'object')
      mbox = mbox.id;
    else if (!mbox)
      return this.folder_selector(obj, function(folder) { ref.command('copy', folder); });

    // exit if current or no mailbox specified
    if (!mbox || mbox == this.env.mailbox)
@@ -2632,10 +2641,12 @@
  };

  // move selected messages to the specified mailbox
  this.move_messages = function(mbox)
  this.move_messages = function(mbox, obj)
  {
    if (mbox && typeof mbox === 'object')
      mbox = mbox.id;
    else if (!mbox)
      return this.folder_selector(obj, function(folder) { ref.command('move', folder); });

    // exit if current or no mailbox specified
    if (!mbox || mbox == this.env.mailbox)
@@ -3596,16 +3607,18 @@
  {
    var rc;

    if (!this.env.draft_id && id && (rc = this.opener())) {
      // refresh the drafts folder in opener window
      if (rc.env.task == 'mail' && rc.env.action == '' && rc.env.mailbox == this.env.drafts_mailbox)
        rc.command('checkmail');
    if (id && id != this.env.draft_id) {
      if (rc = this.opener()) {
        // refresh the drafts folder in opener window
        if (rc.env.task == 'mail' && rc.env.action == '' && rc.env.mailbox == this.env.drafts_mailbox)
          rc.command('checkmail');
      }

      this.env.draft_id = id;
      $("input[name='_draft_saveid']").val(id);

      this.remove_compose_data(this.env.compose_id);
    }

    this.env.draft_id = id;
    $("input[name='_draft_saveid']").val(id);

    this.remove_compose_data(this.env.compose_id);
  };

  this.auto_save_start = function()
@@ -5035,6 +5048,7 @@
  {
    var key = 'G'+prop.source+prop.id;
    if (this.treelist.remove(key)) {
      this.triggerEvent('group_delete', { source:prop.source, id:prop.id });
      delete this.env.contactfolders[key];
      delete this.env.contactgroups[key];
    }
@@ -5612,14 +5626,15 @@

    this.subscription_list = new rcube_list_widget(this.gui_objects.subscriptionlist,
      {multiselect:false, draggable:true, keyboard:false, toggleselect:true});
    this.subscription_list.addEventListener('select', function(o){ p.subscription_select(o); });
    this.subscription_list.addEventListener('dragstart', function(o){ p.drag_active = true; });
    this.subscription_list.addEventListener('dragend', function(o){ p.subscription_move_folder(o); });
    this.subscription_list.row_init = function (row) {
      row.obj.onmouseover = function() { p.focus_subscription(row.id); };
      row.obj.onmouseout = function() { p.unfocus_subscription(row.id); };
    };
    this.subscription_list.init();
    this.subscription_list
      .addEventListener('select', function(o){ p.subscription_select(o); })
      .addEventListener('dragstart', function(o){ p.drag_active = true; })
      .addEventListener('dragend', function(o){ p.subscription_move_folder(o); })
      .addEventListener('initrow', function (row) {
        row.obj.onmouseover = function() { p.focus_subscription(row.id); };
        row.obj.onmouseout = function() { p.unfocus_subscription(row.id); };
      })
      .init();

    $('#mailboxroot')
      .mouseover(function(){ p.focus_subscription(this.id); })
@@ -5819,8 +5834,11 @@
  // replace an existing table row with a new folder line (with subfolders)
  this.replace_folder_row = function(oldfolder, newfolder, display_name, is_protected, class_name)
  {
    if (!this.gui_objects.subscriptionlist)
    if (!this.gui_objects.subscriptionlist) {
      if (this.is_framed)
        return parent.rcmail.replace_folder_row(oldfolder, newfolder, display_name, is_protected, class_name);
      return false;
    }

    var i, n, len, name, dispname, oldrow, tmprow, row, level,
      tbody = this.gui_objects.subscriptionlist.tBodies[0],
@@ -5830,6 +5848,13 @@
      subscribed = $('input[name="_subscribed[]"]', $('#'+id)).prop('checked'),
      // find subfolders of renamed folder
      list = this.get_subfolders(oldfolder);

    // no renaming, only update class_name
    if (oldfolder == newfolder) {
      $('#'+id).attr('class', class_name || '');
      this.subscription_list.focus();
      return;
    }

    // replace an existing table row
    this._remove_folder_row(id);
@@ -6447,6 +6472,12 @@
    this.env.quota_content = content;
  };

  // update trash folder state
  this.set_trash_count = function(count)
  {
    this[(count ? 'un' : '') + 'mark_folder'](this.env.trash_mailbox, 'empty', '', true);
  };

  // update the mailboxlist
  this.set_unread_count = function(mbox, count, set_title, mark)
  {
@@ -6551,6 +6582,105 @@
    $(elem).removeClass('hide-headers').addClass('show-headers');
    $(this.gui_objects.all_headers_row).hide();
    elem.onclick = function() { rcmail.command('show-headers', '', elem); };
  };

  // create folder selector popup, position and display it
  this.folder_selector = function(obj, callback)
  {
    var container = this.folder_selector_element;

    if (!container) {
      var rows = [],
        delim = this.env.delimiter,
        ul = $('<ul class="toolbarmenu iconized">'),
        li = document.createElement('li'),
        link = document.createElement('a'),
        span = document.createElement('span');

      container = $('<div id="folder-selector" class="popupmenu"></div>');
      link.href = '#';
      link.className = 'icon';

      // loop over sorted folders list
      $.each(this.env.mailboxes_list, function() {
        var tmp, n = 0, s = 0,
          folder = ref.env.mailboxes[this],
          id = folder.id,
          a = link.cloneNode(false), row = li.cloneNode(false);

        if (folder.virtual)
          a.className += ' virtual';
        else {
          a.className += ' active';
          a.onclick = function() { container.hide().data('callback')(folder.id); };
        }

        if (folder['class'])
          a.className += ' ' + folder['class'];

        // calculate/set indentation level
        while ((s = id.indexOf(delim, s)) >= 0) {
          n++; s++;
        }
        a.style.paddingLeft =  n ? (n * 16) + 'px' : 0;

        // add folder name element
        tmp = span.cloneNode(false);
        $(tmp).text(folder.name);
        a.appendChild(tmp);

        row.appendChild(a);
        rows.push(row);
      });

      ul.append(rows).appendTo(container);

      // temporarily show element to calculate its size
      container.css({left: '-1000px', top: '-1000px'})
        .appendTo($('body')).show();

      // set max-height if the list is long
      if (rows.length > 10)
        container.css('max-height', $('li', container)[0].offsetHeight * 10 + 9)

      // hide selector on click out of selector element
      var fn = function(e) { if (e.target != container.get(0)) container.hide(); };
      $(document.body).on('mouseup', fn);
      $('iframe').contents().on('mouseup', fn)
        .load(function(e) { try { $(this).contents().on('mouseup', fn); } catch(e) {}; });

      this.folder_selector_element = container;
    }

    // position menu on the screen
    this.element_position(container, obj);

    container.show().data('callback', callback);
  };

  // position a menu element on the screen in relation to other object
  this.element_position = function(element, obj)
  {
    var obj = $(obj), win = $(window),
      width = obj.width(),
      height = obj.height(),
      win_height = win.height(),
      elem_height = $(element).height(),
      elem_width = $(element).width(),
      pos = obj.offset(),
      top = pos.top,
      left = pos.left + width;

    if (top + elem_height > win_height) {
      top -= elem_height - height;
      if (top < 0)
        top = Math.max(0, (win_height - elem_height) / 2);
    }

    if (left + elem_width > win.width())
      left -= elem_width + width;

    element.css({left: left + 'px', top: top + 'px'});
  };


@@ -6822,6 +6952,16 @@

      case 'refresh':
      case 'check-recent':
        // update message flags
        $.each(this.env.recent_flags || {}, function(uid, flags) {
          ref.set_message(uid, 'deleted', flags.deleted);
          ref.set_message(uid, 'replied', flags.answered);
          ref.set_message(uid, 'unread', !flags.seen);
          ref.set_message(uid, 'forwarded', flags.forwarded);
          ref.set_message(uid, 'flagged', flags.flagged);
        });
        delete this.env.recent_flags;

      case 'getunread':
      case 'search':
        this.env.qsearch = null;
@@ -7145,13 +7285,18 @@

    if (this.gui_objects.mailboxlist)
      params._folderlist = 1;
    if (this.gui_objects.messagelist)
      params._list = 1;
    if (this.gui_objects.quotadisplay)
      params._quota = 1;
    if (this.env.search_request)
      params._search = this.env.search_request;

    if (this.gui_objects.messagelist) {
      params._list = 1;

      // message uids for flag updates check
      params._uids = $.map(this.message_list.rows, function(row, uid) { return uid; }).join(',');
    }

    return params;
  };