LzTrackClass

LzTrackClass
Prev	Services	Next

Name

LzTrackClass — Enables tracking mouse events over a group of views.

Synopsis

JavaScript: LzTrackClass
Type: Class
Access: public
Topic: LFC.Services
Declared in: WEB-INF/lps/lfc/services/LzTrack.lzs

Description

This service helps tracking the mouse over a number of views, as in common when implementing menus and drag-and-drop behaviors. When the mouse is down, standard view events such as ondragin and ondragout are only sent to the view which received the onmousedown events. When views are registered using the LzTrack service, they will receive events independent of the mouse button state.

In using LzTrack, views register with a particular group. Activation of that group is typically triggered by a user event. When a group is active, the LzTrack service will events to views in the active group, whenever the mouse position enters (ontrackover), leaves (ontrackout) or when the mouse button goes up (ontrackup).

Example: a simple color picker

This simple color picker displays its color in a rectangle, then when the mouse is down over the colored rectangle, a series of colors are displayed (as displayed below). While the mouse is down, the user may move the mouse across the color choices. When the mouse button goes up over a color, that color is selected and the color menu disappears.

The code below defines the class "colorspot" which represents a tracked view. This class handles visual state changes triggered by the track events and sends an event to its parent when a new color is selected. LzTrack.register is called by oninit to add the instance of the view to its group. The group name is defined as an attribute of the class, but simply bound to an attribute of the parent. For simple menu tracking, it is typical for a set of sibling views to share the same track group; however, tracked views that share the same trackgroup may be anywhere in view hierarchy.

Example 17. Using LzTrack to build a color chooser

 <canvas height="60">
   <class name="colorspot" clickable="true"
     width="22" height="22" bgcolor="0x000000">
     <attribute name="mycolor"/>
 
     <attribute name="trackgroup" type="string" value="${parent.trackgroup}"/>
     <view name="spot" bgcolor="${parent.mycolor}"
         x="2" y="2" width="18" height="18"/>
 <handler name="oninit">
         LzTrack.register(this, this.trackgroup);
     </handler>
     <handler name="onmousetrackover">
         setAttribute('bgcolor', 0xdedede); // hilite: gray
     </handler>
 
     <handler name="onmousetrackout">
         setAttribute('bgcolor', 0x000000); // normal: black
     </handler>
     <handler name="onmousetrackup">
         parent.onnewcolor.sendEvent(this.spot.bgcolor);
     </handler>
   </class>
 
   <view bgcolor="0x0000ff" width="20" height="20"
       onmousedown="this.colorpicker.setVisible(true); LzTrack.activate('mymenu');"
       onmouseup="this.colorpicker.setVisible(false); LzTrack.deactivate('mymenu');">
     <view name="colorpicker" visible="false" x="10" y="10">
       <attribute name="trackgroup" value="mymenu" type="string"/>
       <handler name="onnewcolor" args="newcolor">
           parent.setAttribute('bgcolor', newcolor);
       </handler>
 
       <simplelayout axis="x"/>
       <colorspot mycolor="0x0000ff"/>
       <colorspot mycolor="0x00ff00"/>
       <colorspot mycolor="0xffff00"/>
       <colorspot mycolor="0xff0000"/>
       <colorspot mycolor="0x00ffff"/>
 
     </view>
   </view>
   <text>Click on the square, then release the mouse button to select a new color.</text>
   <simplelayout axis="y" spacing="20"/>
 </canvas>

Superclass Chain

LzTrackClass

Known Subclasses

Details

Properties (5)

__LZactivegroups: private var __LZactivegroups = null;
__LZmouseupDel: private var __LZmouseupDel = null;
__LZoptimizeforaxis: private var __LZoptimizeforaxis = x;
__LZreg: private var __LZreg = { ... };
__LZtrackDel: private var __LZtrackDel = null;

Methods (11)

activate(): public function activate(group : String);

activate tracking for a particular group. Any number of groups can be tracked simultaneously. This is useful for tracking mechanisms like menus.
deactivate(): public function deactivate(group);

deactivate tracking for the currently active group
initialize(): public function initialize();
__LZdestroyitem(): private function __LZdestroyitem(v);

called when a registered view is destroyed. We need to remove it from all track groups, so we don't leak memory
__LZfindTopmost(): private function __LZfindTopmost(vlist);
__LZmouseup(): private function __LZmouseup();
__LZtopview(): private function __LZtopview(a, b);
__LZtrack(): private function __LZtrack();
__LZtrackgroup(): private function __LZtrackgroup(group, hitlist);
register(): public function register(v : LzView, group : String);

register a view to be tracked for a particular track group
unregister(): public function unregister(v, group);

JavaScript Synopsis

public LzTrackClass {

private var __LZactivegroups = null;

private var __LZmouseupDel = null;

private var __LZoptimizeforaxis = x;

private var __LZreg = { ... };

private var __LZtrackDel = null;

prototype public function activate (group : String);

prototype public function deactivate (group);

prototype public function initialize ();

prototype private function __LZdestroyitem (v);

prototype private function __LZfindTopmost (vlist);

prototype private function __LZmouseup ();

prototype private function __LZtopview (a, b);

prototype private function __LZtrack ();

prototype private function __LZtrackgroup (group, hitlist);

prototype public function register (v : LzView, group : String);

prototype public function unregister (v, group);

}

Copyright © 2002-2007 Laszlo Systems, Inc. All Rights Reserved. Unauthorized use, duplication or distribution is strictly prohibited. This is the proprietary information of Laszlo Systems, Inc. Use is subject to license terms.