Hi Charles,

Sounds like this should go into roundcube without discussion... Have you commited this already or is there a reason to keep this as a separate patch?

Regards,

Mark

Charles McNulty wrote:

Here's a pretty simple patch for doing the drag over a folder thing.

The other thing it does is keeps track of whether the "folder" portion of the screen or the "mail" portion of the screen has the "focus" and changes the color accordingly.

For example if you've clicked on the Inbox folder, the folder will be colored red. If you then select a message, the Inbox folder will now be highlighted in grey and the message you've selected will be red. If you click back on to the Inbox folder, the message you've selected will turn grey and "Inbox" will turn back red.

If you go back to the message list, select a message and drag it over the folder list, the folder's will turn red as your mouse hovers over them.

I've tested this a little, but of course it could always use more testing. Please let me know your thoughts on this patch.

-Charles

---

Index: program/js/app.js

--- program/js/app.js (revision 274) +++ program/js/app.js (working copy) @@ -244,7 +244,6 @@ // load body click event document.onmousedown = function(){ return rcube_webmail_client.reset_click(); }; document.onkeydown = function(e){ return rcube_webmail_client.key_pressed(e, msg_list_frame); };

• // flag object as complete this.loaded = true;

@@ -285,6 +284,14 @@ } }

• if (this.gui_objects.mailboxlist) {

•  var s_mbox = String(this.env.mailbox).toLowerCase().replace(this.mbox_expression, '');
  

•  var mbox_li = document.getElementById('rcmbx'+s_mbox);
  

•  if (mbox_li) 
  

•    this.set_classname(mbox_li, 'unfocused', true);
  

• }
• this.in_message_list = true; e.cancelBubble = true; };

@@ -1161,9 +1168,10 @@ // onmouseup handler for mailboxlist item this.mbox_mouse_up = function(mbox) {

• if (this.drag_active)

• if (this.drag_active){

•  this.unfocus_mailbox(mbox);
   this.command('moveto', mbox);
  

• else

• } else this.command('list', mbox);

  return false;

@@ -1529,8 +1537,7 @@ if (this.env.search_request) add_url += '&_search='+this.env.search_request;

• if (this.env.mailbox!=mbox)

•  this.select_mailbox(mbox);
  

• this.select_mailbox(mbox);

  // load message list remotely if (this.gui_objects.messagelist)

@@ -1634,7 +1641,26 @@ return true; };

• this.focus_mailbox = function(mbox) {
• if (this.gui_objects.mailboxlist && this.drag_active) {

•  var s_mbox = String(mbox).toLowerCase().replace(this.mbox_expression, '');
  

•  var mbox_li = document.getElementById('rcmbx'+s_mbox);
  

•  if (mbox_li) 
  

•    this.set_classname(mbox_li, 'selected', true);
  

• }
• }
• this.unfocus_mailbox = function(mbox) {
• if (this.gui_objects.mailboxlist && this.drag_active) {

•  var s_mbox = String(mbox).toLowerCase().replace(this.mbox_expression, '');
  

•  var mbox_li = document.getElementById('rcmbx'+s_mbox);
  

•  if (mbox_li)
  

•    this.set_classname(mbox_li, 'selected', false);
  

• }
• }
• // move selected messages to the specified mailbox this.move_messages = function(mbox) {

@@ -2199,7 +2225,6 @@ highlight.removeAttribute('id'); //highlight.removeAttribute('class'); this.set_classname(highlight, 'selected', false);

•      this.set_classname(highlight, 'unfocused', false);
       }
  
     if (next)
  

@@ -2990,7 +3015,7 @@ // mark a mailbox as selected and set environment variable this.select_mailbox = function(mbox) {

• if (this.gui_objects.mailboxlist)

• if (this.gui_objects.mailboxlist ) { var item, reg, text_obj; var s_current = this.env.mailbox.toLowerCase().replace(this.mbox_expression, '');

@@ -3003,8 +3028,10 @@ if (current_li) { this.set_classname(current_li, 'selected', false); this.set_classname(current_li, 'unfocused', false);

•    }
  

•  if (mbox_li)
  

•  }
  

•  if (mbox_li || this.env.mailbox == mbox)
  

•    this.set_classname(mbox_li, 'unfocused', false);
     this.set_classname(mbox_li, 'selected', true);
   }
  
  

Index: program/steps/mail/func.inc

--- program/steps/mail/func.inc (revision 274) +++ program/steps/mail/func.inc (working copy) @@ -216,6 +216,8 @@

 $out .= sprintf('<li id="rcmbx%s" class="mailbox %s %s%s%s"><a href="%s&_mbox=%s"'.
                 ' onclick="return %s.command(\'list\',\'%s\')"'.

•                ' onmouseover="return %s.focus_mailbox(\'%s\')"' .            
  

•                ' onmouseout="return %s.unfocus_mailbox(\'%s\')"' .
                 ' onmouseup="return %s.mbox_mouse_up(\'%s\')"%s>%s</a>',
                 $folder_css,
                 $class_name,
  

@@ -227,7 +229,12 @@ $JS_OBJECT_NAME, addslashes($folder['id']), $JS_OBJECT_NAME,

•                addslashes($folder['id']),               
  

•                $JS_OBJECT_NAME,
  

•                addslashes($folder['id']),              
  

•                $JS_OBJECT_NAME,
                 addslashes($folder['id']),
  

•                $title,
                 rep_specialchars_output($foldername, 'html', 'all'));
  
  

Index: skins/default/mail.css

--- skins/default/mail.css (revision 274) +++ skins/default/mail.css (working copy) @@ -266,7 +266,7 @@

#mailboxlist li.selected {

• background-color: #929292;

• background-color: #CC3333; border-bottom: 1px solid #898989;

}

@@ -276,7 +276,18 @@ font-weight: bold; }

+#mailboxlist li.unfocused +{

• background-color: #929292;
• border-bottom: 1px solid #898989;

+}

+#mailboxlist li.unfocused a +{

• color: #FFF;
• font-weight: bold;

+}

/* styles for nested folders */ #mailboxlist ul { list-style: none;