Results 1 to 8 of 8

Thread: single-click vs double-click dilemma

  1. #1
    Banned
    Join Date
    Nov 2007
    Location
    Germany
    Posts
    101

    Default single-click vs double-click dilemma

    I have an event happening for a single-click, and I have a different event happening for double-click.

    Single-click: load preview of email message

    Double-click: load message view in different window

    The issue is that in order for a double-click to occurr, a single-click happens... twice.

    The current solution has been to put a timeout on the single-click and cancel it if the double-click is detected.

    Question 1: What is the timeout on a double-click event to occur? If I single-click really slowly, it won't take place, for example.


    Question 2: Is there a better way to solve this than to use a timeout?

  2. #2
    Sencha Developer
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,516

    Default

    I don't actually have an answer for your question... but I wonder if maybe inverting your logic might solve this.

    Rather than worrying about the timeout on a double-click, maybe you ought to think about how to control the single-click's timeout (e.g. - setting the single-click timeout to 1 second would prevent that event from firing multiple times if the user clicked repeated over 1 second).

    Again, I don't actually know how to do it, but I thought I'd throw it out there. I'll look around and see if I can think of something.

  3. #3
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996

    Default

    I haven't seen the timeout used in this regard. I have seen where you modify the click by using shift, alt, cntrl keys for example to alter the behavior.

  4. #4
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246

    Default

    I think it is a bad design to assign handlers to both click and dblclick.

    But it is not impossible:
    Code:
    el.on({
    	click: {
    		fn: function() {
    			if (el.stopClickEvent) {
    				el.stopClickEvent = false;
    			} else {
    				alert('click');
    			}
    		},
    		buffer: 250
    	},
    	dblclick: function() {
    		el.stopClickEvent = true;
    		alert('dblclick');
    	}
    });
    (assuming the mouse double-click timeout isn't set higher than 250ms)

  5. #5

    Default

    Yeah it is certainly bad UI design, but unfortunately M$ has made it more or less expected behavior

  6. #6
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364

    Default

    Quote Originally Posted by Condor View Post
    I think it is a bad design to assign handlers to both click and dblclick.
    how so? Click to select, dbl click to open.

  7. #7
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246

    Default

    OK, let me rephrase that:
    Code:
    I think it is a bad design to assign interactive handlers to both click and dblclick.
    (in you case it is no problem that both click and dblclick events fire)

  8. #8
    Banned
    Join Date
    Nov 2007
    Location
    Germany
    Posts
    101

    Default

    Well, I'll share what my current solution looks like so anyone interested can contribute from there. I got it working by trial and error on the timeout value and the one I picked seems to work, but it may be too agressive. I didn't want to spend forever on it though.

    PHP Code:

    this
    .singleClick = function(grid,rowIndex,e) {
        var 
    preview Ext.getCmp('previewPanel');
        if (!
    preview.isVisible()) { return false; }
        
    click_id window.setTimeout(function() {
            GLOBAL.
    singleClickUpdateID = []; // reset when timeout gets called
            
    var record grid.getStore().getAt(rowIndex); // get the record
            
    preview.load({
                
    url'/mailbox/thread.html',
                
    text'Loading ...',
                
    params: { idrecord.get('id') },
                
    scriptstrue
                
    });
        }, 
    500);
        GLOBAL.
    singleClickUpdateID.push(click_id);
    }

    this.doubleClick = function(grid,rowIndex,e) {
        GLOBAL.
    singleClickUpdateID.each(function(s) { window.clearTimeout(s) });
        GLOBAL.
    singleClickUpdateID = []; //reset when double click is detected
        
    var record grid.getStore().getAt(rowIndex); // get the record
        
    ... other code to load the message view ...
        });
      }; 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •