Hi Alex,
I'm with you. Don't like setTimeOut. But I needed in Jewel in at least 3
scenearios. I'd love to change it sometime in the future, but for now don't
know how.
I think the actual ways to defer something are:
-setTimeOut
-setInterval
-requestAnimationFrame

the first one is in SWF, so the solution is cross SWF/JS, although if we
add other targets, maybe will require changes.
the second seems to be the worse.
the latest seems the actual way to do things in JS, but I tried and didn't
work for me, and I suppose we'll need to abstract it to something usable in
SWF and future targets.

My concrete case in the three ocassions is when I instantiate a component
and add a class name to make the component animate  (transition) through
CSS. For example Alert, DateField and ComboBox popups components and then
add a class ".open" in CSS, so we need at least 300-400ms so the transition
can play.

Any other way to do it would be good to know in order to upgrade this
implementations.

Thanks

Carlos





El jue., 13 sept. 2018 a las 22:20, Alex Harui (<[email protected]>)
escribió:

> I didn't see anywhere in the article where it guaranteed that both up and
> click are sequential in the queue.  Sharing the heap isn't the issue here.
>
> I'm still surprised the fix isn't to not dispatch ITEM_CLICK on MouseUp.
>   UP doesn't guarantee CLICK, IMO.  You could mouse down in one renderer
> and mouse up in another renderer.  In some interaction models that does
> change selection, but I don't think CLICK is the right semantic.
>
> Further, I would like to discourage use of setTimeout in the framework.
> The framework has little control over the behavior of application event
> handlers.  With many browsers having immediate screen updates (as opposed
> to Flash's deferred rendering), postponing work with setTimeout can result
> in unexpected behavior, and can result in callLater "wars" where more and
> more code has to keep deferring work with setTimeout because some lower
> layer also used setTimeout.  Deferring work should be the option of the
> application developer as much as possible.
>
> My 2 cents,
> -Alex
>
> On 9/13/18, 11:36 AM, "Harbs" <[email protected]> wrote:
>
>     I once read that the way setTimeout works is that it’s added to the
> next event loop. That would mean that both mouseup and click would be
> executed in the current event loop and the setTimout would be delayed to
> the next one (i..e between 4ms and 10ms later).
>
>     I can’t find the article at the moment, but my understanding is that
> this is a safe way to guarantee later execution in all browsers.
>
>     The MDN doc has a decent explanation.[1] Both mouseup and click would
> be on the same heap.
>
>     Harbs
>
>     [1]
> https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FJavaScript%2FEventLoop&amp;data=02%7C01%7Caharui%40adobe.com%7C576c9eb8f72f4456b8de08d619a7e21e%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636724606177243994&amp;sdata=k2OOBE6%2BB6q53vlxPSHkm6ZUfqKhGlEmhS54Xj%2FWNDU%3D&amp;reserved=0
>     > On Sep 13, 2018, at 6:54 PM, Alex Harui <[email protected]>
> wrote:
>     >
>     > Is setTimeout guaranteed to run after the CLICK event?
>     >
>     > On 9/13/18, 6:14 AM, "[email protected] <mailto:[email protected]>" <
> [email protected] <mailto:[email protected]>> wrote:
>     >
>     >    This is an automated email from the ASF dual-hosted git
> repository.
>     >
>     >    harbs pushed a commit to branch develop
>     >    in repository
> https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgitbox.apache.org%2Frepos%2Fasf%2Froyale-asjs.git&amp;data=02%7C01%7Caharui%40adobe.com%7C576c9eb8f72f4456b8de08d619a7e21e%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636724606177243994&amp;sdata=tl2ADaUxtE4RW1eYucJAULvVhoibVGWfCqzfXidCF6E%3D&amp;reserved=0
> <
> https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgitbox.apache.org%2Frepos%2Fasf%2Froyale-asjs.git&amp;data=02%7C01%7Caharui%40adobe.com%7C576c9eb8f72f4456b8de08d619a7e21e%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636724606177243994&amp;sdata=tl2ADaUxtE4RW1eYucJAULvVhoibVGWfCqzfXidCF6E%3D&amp;reserved=0
> >
>     >
>     >
>     >    The following commit(s) were added to refs/heads/develop by this
> push:
>     >         new e1ec25e  I think this fixes Menu
>     >    e1ec25e is described below
>     >
>     >    commit e1ec25e0d8b1e59bfbb1e3d0cf856fe9dfb4dc5e
>     >    Author: Harbs <[email protected] <mailto:[email protected]>>
>     >    AuthorDate: Thu Sep 13 16:14:03 2018 +0300
>     >
>     >        I think this fixes Menu
>     >    ---
>     >     .../projects/Basic/src/main/resources/defaults.css |  1 +
>     >     .../controllers/ItemRendererMouseController.as     |  1 -
>     >     .../controllers/MenuSelectionMouseController.as    | 33
> ++++++++++++++--------
>     >     3 files changed, 23 insertions(+), 12 deletions(-)
>     >
>     >    diff --git
> a/frameworks/projects/Basic/src/main/resources/defaults.css
> b/frameworks/projects/Basic/src/main/resources/defaults.css
>     >    index f88da20..15cb4e6 100644
>     >    --- a/frameworks/projects/Basic/src/main/resources/defaults.css
>     >    +++ b/frameworks/projects/Basic/src/main/resources/defaults.css
>     >    @@ -545,6 +545,7 @@ Panel
>     >           IBeadModel:
> ClassReference("org.apache.royale.html.beads.models.PanelModel");
>     >           IBeadView:
> ClassReference("org.apache.royale.html.beads.PanelView");
>     >           IPanelLayout:
> ClassReference("org.apache.royale.html.beads.layouts.VerticalFlexLayout");
>     >    +      IPanelContentArea:
> ClassReference("org.apache.royale.html.Container");
>     >
>     >           background-color: #FFFFFF;
>     >           border: 1px solid #333333
>     >    diff --git
> a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/ItemRendererMouseController.as
> b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/ItemRendererMouseController.as
>     >    index f408a71..6073264 100644
>     >    ---
> a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/ItemRendererMouseController.as
>     >    +++
> b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/ItemRendererMouseController.as
>     >    @@ -92,7 +92,6 @@ COMPILE::JS {
>     >                                   goog.events.listen(element,
> goog.events.EventType.MOUSEOUT, this.handleMouseOut);
>     >                                   goog.events.listen(element,
> goog.events.EventType.MOUSEDOWN, this.handleMouseDown);
>     >                                   goog.events.listen(element,
> goog.events.EventType.CLICK, this.handleMouseUp);
>     >    -                goog.events.listen(element,
> goog.events.EventType.MOUSEUP, this.handleMouseUp);
>     >                           }
>     >                   }
>     >
>     >    diff --git
> a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/MenuSelectionMouseController.as
> b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/MenuSelectionMouseController.as
>     >    index 5f986bb..6a09a52 100644
>     >    ---
> a/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/MenuSelectionMouseController.as
>     >    +++
> b/frameworks/projects/Basic/src/main/royale/org/apache/royale/html/beads/controllers/MenuSelectionMouseController.as
>     >    @@ -127,6 +127,8 @@ package
> org.apache.royale.html.beads.controllers
>     >                    *  @playerversion Flash 10.2
>     >                    *  @playerversion AIR 2.6
>     >                    *  @productversion Royale 0.9
>     >    +         *  @royaleignorecoercion org.apache.royale.core.UIBase
>     >    +         *  @royaleignorecoercion org.apache.royale.core.IUIBase
>     >                    */
>     >                   protected function hideOpenMenus():void
>     >                   {
>     >    @@ -137,8 +139,9 @@ package
> org.apache.royale.html.beads.controllers
>     >                                   if (menu.parent != null) {
>     >                                           var
> controller:MenuSelectionMouseController =
> menu.getBeadByType(MenuSelectionMouseController) as
> MenuSelectionMouseController;
>     >
>  controller.removeClickOutHandler(menu);
>     >    -                    var host:IPopUpHost =
> UIUtils.findPopUpHost(_strand as IUIBase);
>     >    -
> host.popUpParent.removeElement(menu);
>     >    +                    var host:IPopUpHost =
> UIUtils.findPopUpHost(menu as IUIBase);
>     >    +                                      if(host)
>     >    +
> host.popUpParent.removeElement(menu);
>     >                                   }
>     >                           }
>     >                           MenuModel.clearMenuList();
>     >    @@ -163,6 +166,8 @@ package
> org.apache.royale.html.beads.controllers
>     >                    *  @playerversion Flash 10.2
>     >                    *  @playerversion AIR 2.6
>     >                    *  @productversion Royale 0.9
>     >    +         *  @royaleignorecoercion org.apache.royale.core.IUIBase
>     >    +         *  @royaleignorecoercion
> org.apache.royale.events.IEventDispatcher
>     >                    */
>     >                   public function
> removeClickOutHandler(menu:Object):void
>     >                   {
>     >    @@ -191,23 +196,29 @@ package
> org.apache.royale.html.beads.controllers
>     >
>     >                   /**
>     >              * @royaleignorecoercion HTMLElement
>     >    +               * @royaleignorecoercion
> org.apache.royale.core.IUIBase
>     >                    * @private
>     >                    */
>     >                   COMPILE::JS
>     >                   protected function
> hideMenu_internal(event:BrowserEvent):void
>     >                   {
>     >                 var menu:IMenu = _strand as IMenu;
>     >    +                      var menuElem:HTMLElement = (_strand as
> IUIBase).element as HTMLElement;
>     >    +                      var menuBarElement:HTMLElement;
>     >                 if (menu.parentMenuBar)
>     >                 {
>     >    -                var menuBarElement:HTMLElement =
> (menu.parentMenuBar as IUIBase).element as HTMLElement;
>     >    -                var target:HTMLElement = event.target as
> HTMLElement;
>     >    -                while (target != null)
>     >    -                {
>     >    -                    if (target == menuBarElement) return;
>     >    -                    target = target.parentNode as HTMLElement;
>     >    -                }
>     >    -            }
>     >    -                      hideOpenMenus();
>     >    +                menuBarElement = (menu.parentMenuBar as
> IUIBase).element as HTMLElement;
>     >    +                      }
>     >    +                      var target:HTMLElement = event.target as
> HTMLElement;
>     >    +                      while (target != null)
>     >    +                      {
>     >    +                              var comp:IUIBase =
> target["royale_wrapper"];
>     >    +                              if(comp && (comp is IMenu || comp
> == menu.parentMenuBar) ) return;
>     >    +                              // if (target == menuElem ||
> (menuBarElement && target == menuBarElement) ) return;
>     >    +                              target = target.parentNode as
> HTMLElement;
>     >    +                      }
>     >    +
>     >    +                      setTimeout(hideOpenMenus);
>     >                   }
>     >           }
>     >     }
>     >    \ No newline at end of file
>
>
>
>

-- 
Carlos Rovira
http://about.me/carlosrovira

Reply via email to