History | Log In     View a printable version of the current page.  
Issue Details (XML | Word | Printable)

Key: LPP-3852
Type: Bug Bug
Status: Closed Closed
Resolution: Fixed
Priority: P0 P0
Assignee: Unassigned
Reporter: Antun Karlovac
Votes: 0
Watchers: 1
Operations

If you were logged in you would be able to see more operations.
OpenLaszlo

Context menu doesn't work properly with transparent views.

Created: 04/Apr/07 03:21 PM   Updated: 02/Nov/07 08:41 AM
Component/s: LFC - Context Menu
Affects Version/s: 3.4
Fix Version/s: RingDing (4.1)

Time Tracking:
Not Specified

File Attachments: 1. File LPP-3852-complete.lzx (2 kb)
2. File LPP-3852-fail.lzx (0.6 kb)
3. File LPP-3852-workaround.lzx (0.7 kb)


Severity: Major
Fixed in Change#: 6,973
Runtime: N/A
Fix in hand: False


 Description  « Hide
A common pattern with the context menu is to layer a transparent view on top of a group of subviews that need to share the same right-click menu, e.g.

<canvas width="300" height="75" proxied="false">
    <view width="200" height="36" bgcolor="yellow"
          x="50" y="18">
        <method name="doChop">
            this.setBGColor(red);
        </method>

        <text valign="middle" fontsize="16">Carrots</text>

        <view name="contextmenuview" width="100%" height="100%">
            <handler name="oninit">
                var cm = new LzContextMenu();
                var item = cm.makeMenuItem("Chop", new LzDelegate(parent,"doChop"));
                cm.addItem(item);
                this.setContextMenu(cm);
            </handler>
        </view>
    </view>
</canvas>

However, in order to get contextmenuview to respond to the context menu, you have to give it a bgcolor. That will obscure the views beneath it. So you also have to give it both a bgcolor, and a very low opacity.

Here's the working example:

<canvas width="300" height="75" proxied="false">
    <view width="200" height="36" bgcolor="yellow"
          x="50" y="18">
        <method name="doChop">
            this.setBGColor(red);
        </method>

        <text valign="middle" fontsize="16">Carrots</text>

        <view name="contextmenuview" width="100%" height="100%"
              bgcolor="white" opacity="0.1">
            <handler name="oninit">
                var cm = new LzContextMenu();
                var item = cm.makeMenuItem("Chop", new LzDelegate(parent,"doChop"));
                cm.addItem(item);
                this.setContextMenu(cm);
            </handler>
        </view>
    </view>
</canvas>

This all seems very wrong. I can understand a view not responding to right-clicks if it is *invisible*, but if it's visible and happens to not have a bgcolor, it should certainly react to right-clicks.

 All   Comments   Work Log   Change History      Sort Order: Ascending order - Click to sort in descending order
Antun Karlovac - 08/May/07 03:03 PM
I should mention that both background colors and opacity are performance drains. (Bgcolors are not so much, though they do cost more than a resource). So forcing developers to have a bgcolor/transparent view for every right-clickable element does have some performance implications.

Henry Minsky - 29/Jul/07 10:29 AM
The issue is that the right-click context menu in Flash needs to attach to some movieclip which has the
desired position and size to cover the expected hit area.


I wonder if we ought to have a special transparent movieclip that belongs to a view( actually the view's sprite) which is specially for attaching the context menu to. That would avoid the overhead of a separate view. Currently the
hack is to look for a background movieclip, but that does not seem to work here, because we haven't got
any notion of a transparent background color.


Max Carlson - 22/Oct/07 08:42 PM
After trying may other things, I decided the best thing to do is to re/use the existing backgroundcolor movieclip. Here's an updated testcase that covers everything:

<canvas height="500" proxied="false">
    <view width="200" height="36" bgcolor="yellow"
          x="100" y="18" opacity=".7">
        <method name="doChop">
            this.sendToBack();
        </method>
        <method name="setbg">
            this.setBGColor(0x00ff00);
        </method>
        <method name="clearbg">
            this.setBGColor(null);
        </method>

        <text valign="middle" fontsize="16">Back</text>

            <handler name="oninit">
                var cm = new LzContextMenu();
                var item = cm.makeMenuItem("To back", new LzDelegate(this,"doChop"));
                cm.addItem(item);
                var item = cm.makeMenuItem("Set bgcolor", new LzDelegate(this,"setbg"));
                cm.addItem(item);
                var item = cm.makeMenuItem("Clear bgcolor", new LzDelegate(this,"clearbg"));
                cm.addItem(item);
                this.setContextMenu(cm);
            </handler>
    </view>
    <view width="100" height="36" opacity=".7"
          x="50" y="18">
        <method name="doFront">
            this.sendToBack();
        </method>
        <method name="setbg">
            this.setBGColor(0xff00ff);
        </method>
        <method name="clearbg">
            this.setBGColor(null);
        </method>

        <text valign="middle" fontsize="16">Front</text>

            <handler name="oninit">
                var cm = new LzContextMenu();
                var item = cm.makeMenuItem("To back", new LzDelegate(this,"doFront"));
                cm.addItem(item);
                var item = cm.makeMenuItem("Set bgcolor", new LzDelegate(this,"setbg"));
                cm.addItem(item);
                var item = cm.makeMenuItem("Clear bgcolor", new LzDelegate(this,"clearbg"));
                cm.addItem(item);
                this.setContextMenu(cm);
            </handler>
    </view>
</canvas>


You should be able to do any combination of "To back", "Set bgcolor" or "Clear bgcolor" with the upcoming changeset.

Max Carlson - 23/Oct/07 12:22 PM
Author: max
Date: 2007-10-23 12:21:10 -0700 (Tue, 23 Oct 2007)
New Revision: 6973

Modified:
   openlaszlo/trunk/WEB-INF/lps/lfc/kernel/swf/LzSprite.as
Log:
Change 20071022-maxcarlson-k by maxcarlson@plastik on 2007-10-22 20:30:29 PDT
    in /Users/maxcarlson/openlaszlo/trunk
    for http://svn.openlaszlo.org/openlaszlo/trunk

Summary: Fix context menus to work without bgcolor set

New Features:

Bugs Fixed: LPP-3852 - Context menu doesn't work properly with transparent views

Technical Reviewer: promanik
QA Reviewer: jcrowley
Doc Reviewer: (pending)

Documentation:

Release Notes:

Details: Remove extra assignments of width/height/x/y.

In setBGColor() if the bgcolor was set for a context menu, reset its alpha to the correct value and allow opacity to be applied. If clearing the bgcolor, don't remove the movieclip and don't allow opacity to be applied.

In setOpacity() set the bgcolor alpha if not set by the context menu and overridden by the context menu.

In changeOrder() store and restore the current alpha value of the bgcolor movieclip.

In setContextMenu() always add a bgcolor view, and set its alpha to 0 to hide it if no bgcolor is currently set.
    

Tests: See LPP-3852.



Modified: openlaszlo/trunk/WEB-INF/lps/lfc/kernel/swf/LzSprite.as
===================================================================
--- openlaszlo/trunk/WEB-INF/lps/lfc/kernel/swf/LzSprite.as 2007-10-23 19:09:37 UTC (rev 6972)
+++ openlaszlo/trunk/WEB-INF/lps/lfc/kernel/swf/LzSprite.as 2007-10-23 19:21:10 UTC (rev 6973)
@@ -154,11 +154,6 @@
 // when it has the focus. (see LzFocus for more details)
 LzSprite.prototype.focusable = false;
 
-LzSprite.prototype.width = null;
-LzSprite.prototype.height = null;
-LzSprite.prototype.x = 0;
-LzSprite.prototype.y = 0;
-
 LzSprite.prototype.visible = true;
 
 LzSprite.prototype.opacity = 1;
@@ -460,9 +455,20 @@
         }
         this.bgcolor = Number(bgc);
         this.applyBG();
+ if (this._bgcolorhidden) {
+ this.__LZbgRef._alpha = this.opacity * 100;
+ // overriding context menu color so opacity setting works
+ this._bgcolorshown = true;
+ }
     } else {
- this.bgcolor = null;
- this.removeBG();
+ if (this._bgcolorhidden) {
+ this.__LZbgRef._alpha = 0;
+ //opacity setting should not work
+ this._bgcolorshown = false;
+ } else {
+ this.bgcolor = null;
+ this.removeBG();
+ }
     }
 }
 
@@ -629,7 +635,8 @@
     if (this.__LZmovieClipRef)
         this.__LZmovieClipRef._alpha = 100*v;
 
- if (this.__LZbgRef)
+ // set the bgcolor alpha if not set by the context menu and overridden by the context menu
+ if (this.__LZbgRef && (this._bgcolorhidden != true && this._bgcolorshown != true))
          this.__LZbgRef._alpha = 100*v;
 
     //@event onopacity: Sent when a view changes its opacity
@@ -1139,9 +1146,9 @@
     //Debug.write('got attachPoint', cVMv);
 
     var reback = cSprite.__LZisBackgrounded;
- var menu = null;
     if (reback) {
- menu = cSprite.__LZbgRef.menu;
+ var menu = cSprite.__LZbgRef.menu;
+ var al = cSprite.__LZbgRef._alpha;
     }
     cSprite.removeBG();
     while (cSprite.__LZdepth + next < dl.length && cSprite.__LZdepth+next >= 0 ){
@@ -1169,15 +1176,18 @@
 
         if ( nv.__LZisBackgrounded ){
             var menu2 = nv.__LZbgRef.menu;
+ var al2 = nv.__LZbgRef._alpha;
             nv.removeBG();
             nv.applyBG();
             nv.__LZbgRef.menu = menu2;
+ nv.__LZbgRef._alpha = al2;
         }
     }
 
     if ( reback ){
         cSprite.applyBG();
         cSprite.__LZbgRef.menu = menu;
+ cSprite.__LZbgRef._alpha = al;
     }
     return true;
 }
@@ -1548,16 +1558,15 @@
       }
     }
 
- var mc = this.getMCRef();
     // [todo hqm 01-24-07] SWF-specific
     var mb = this.__LZbgRef;
- // If there's no movieclip attached, use the background clip.
- if (mc != null) {
- mc.menu = cmenu;
+ if (mb == null) {
+ this.setBGColor(0xffffff);
+ var mb = this.__LZbgRef;
+ mb._alpha = 0;
     }
- if (mb != null) {
- mb.menu = cmenu;
- }
+ this._bgcolorhidden = true;
+ mb.menu = cmenu;
 
     if (mb == null && mc == null) {
       if ($debug) Debug.warn("LzView.setContextMenu: cannot set menu on view %w, it has no foreground or background movieclip", this.owner);


_______________________________________________
Laszlo-checkins mailing list
Laszlo-checkins@openlaszlo.org
http://www.openlaszlo.org/mailman/listinfo/laszlo-checkins

Steve O'Sullivan - 02/Nov/07 08:41 AM
Verified and closed in trunk r7083.