Skip to content

Commit

Permalink
perf: [Wasm] Improve IsHitTestVisible
Browse files Browse the repository at this point in the history
  • Loading branch information
jeromelaban committed Mar 30, 2020
1 parent a967c22 commit 9f5968d
Show file tree
Hide file tree
Showing 8 changed files with 180 additions and 94 deletions.
13 changes: 10 additions & 3 deletions src/Uno.UI.Wasm/WasmScripts/Uno.UI.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -296,6 +296,8 @@ declare namespace Uno.UI {
*
*/
setElementTransformNative(pParams: number): boolean;
private setPointerEvents;
setPointerEventsNative(pParams: number): boolean;
/**
* Load the specified URL into a new tab or window
* @param url URL to load
Expand All @@ -322,7 +324,7 @@ declare namespace Uno.UI {
* @param eventName The name of the event
* @param onCapturePhase true means "on trickle down" (going down to target), false means "on bubble up" (bubbling back to ancestors). Default is false.
*/
registerEventOnView(elementId: number, eventName: string, onCapturePhase?: boolean, eventFilterName?: string, eventExtractorName?: string): string;
registerEventOnView(elementId: number, eventName: string, onCapturePhase: boolean, eventFilterId: number, eventExtractorId: number): string;
/**
* Add an event handler to a html element.
*
Expand Down Expand Up @@ -611,8 +613,8 @@ declare class WindowManagerRegisterEventOnViewParams {
HtmlId: number;
EventName: string;
OnCapturePhase: boolean;
EventFilterName: string;
EventExtractorName: string;
EventFilterId: number;
EventExtractorId: number;
static unmarshal(pData: number): WindowManagerRegisterEventOnViewParams;
}
declare class WindowManagerRegisterUIElementParams {
Expand Down Expand Up @@ -690,6 +692,11 @@ declare class WindowManagerSetNameParams {
Name: string;
static unmarshal(pData: number): WindowManagerSetNameParams;
}
declare class WindowManagerSetPointerEventsParams {
HtmlId: number;
Enabled: boolean;
static unmarshal(pData: number): WindowManagerSetPointerEventsParams;
}
declare class WindowManagerSetPropertyParams {
HtmlId: number;
Pairs_Length: number;
Expand Down
75 changes: 45 additions & 30 deletions src/Uno.UI.Wasm/WasmScripts/Uno.UI.js
Original file line number Diff line number Diff line change
Expand Up @@ -478,9 +478,11 @@ var Uno;
element.setAttribute("tabindex", contentDefinition.isFocusable ? "0" : "-1");
}
if (contentDefinition) {
let classes = element.classList.value;
for (const className of uiElementRegistration.classNames) {
element.classList.add(`uno-${className}`);
classes += " uno-" + className;
}
element.classList.value = classes;
}
// Add the html element to list of elements
this.allActiveElementsById[contentDefinition.id] = element;
Expand Down Expand Up @@ -795,6 +797,15 @@ var Uno;
this.setAsArranged(element);
return true;
}
setPointerEvents(htmlId, enabled) {
const element = this.getView(htmlId);
element.style.pointerEvents = enabled ? "auto" : "none";
}
setPointerEventsNative(pParams) {
const params = WindowManagerSetPointerEventsParams.unmarshal(pParams);
this.setPointerEvents(params.HtmlId, params.Enabled);
return true;
}
/**
* Load the specified URL into a new tab or window
* @param url URL to load
Expand Down Expand Up @@ -834,8 +845,8 @@ var Uno;
* @param eventName The name of the event
* @param onCapturePhase true means "on trickle down" (going down to target), false means "on bubble up" (bubbling back to ancestors). Default is false.
*/
registerEventOnView(elementId, eventName, onCapturePhase = false, eventFilterName, eventExtractorName) {
this.registerEventOnViewInternal(elementId, eventName, onCapturePhase, eventFilterName, eventExtractorName);
registerEventOnView(elementId, eventName, onCapturePhase = false, eventFilterId, eventExtractorId) {
this.registerEventOnViewInternal(elementId, eventName, onCapturePhase, eventFilterId, eventExtractorId);
return "ok";
}
/**
Expand All @@ -846,7 +857,7 @@ var Uno;
*/
registerEventOnViewNative(pParams) {
const params = WindowManagerRegisterEventOnViewParams.unmarshal(pParams);
this.registerEventOnViewInternal(params.HtmlId, params.EventName, params.OnCapturePhase, params.EventFilterName, params.EventExtractorName);
this.registerEventOnViewInternal(params.HtmlId, params.EventName, params.OnCapturePhase, params.EventFilterId, params.EventExtractorId);
return true;
}
/**
Expand All @@ -870,9 +881,9 @@ var Uno;
* @param eventName The name of the event
* @param onCapturePhase true means "on trickle down", false means "on bubble up". Default is false.
*/
registerEventOnViewInternal(elementId, eventName, onCapturePhase = false, eventFilterName, eventExtractorName) {
registerEventOnViewInternal(elementId, eventName, onCapturePhase = false, eventFilterId, eventExtractorId) {
const element = this.getView(elementId);
const eventExtractor = this.getEventExtractor(eventExtractorName);
const eventExtractor = this.getEventExtractor(eventExtractorId);
const eventHandler = (event) => {
const eventPayload = eventExtractor
? `${eventExtractor(event)}`
Expand Down Expand Up @@ -1061,23 +1072,26 @@ var Uno;
* Gets the event extractor function. See UIElement.HtmlEventExtractor
* @param eventExtractorName an event extractor name.
*/
getEventExtractor(eventExtractorName) {
if (eventExtractorName) {
switch (eventExtractorName) {
case "PointerEventExtractor":
getEventExtractor(eventExtractorId) {
if (eventExtractorId) {
//
// NOTE TO MAINTAINERS: Keep in sync with Windows.UI.Xaml.UIElement.HtmlEventExtractor
//
switch (eventExtractorId) {
case 1:
return this.pointerEventExtractor;
case "KeyboardEventExtractor":
case 3:
return this.keyboardEventExtractor;
case "TappedEventExtractor":
case 2:
return this.tappedEventExtractor;
case "FocusEventExtractor":
case 4:
return this.focusEventExtractor;
case "CustomEventDetailJsonExtractor":
case 6:
return this.customEventDetailExtractor;
case "CustomEventDetailStringExtractor":
case 5:
return this.customEventDetailStringExtractor;
}
throw `Event filter ${eventExtractorName} is not supported`;
throw `Event extractor ${eventExtractorId} is not supported`;
}
return null;
}
Expand Down Expand Up @@ -1882,22 +1896,10 @@ class WindowManagerRegisterEventOnViewParams {
ret.OnCapturePhase = Boolean(Module.getValue(pData + 8, "i32"));
}
{
var ptr = Module.getValue(pData + 12, "*");
if (ptr !== 0) {
ret.EventFilterName = String(Module.UTF8ToString(ptr));
}
else {
ret.EventFilterName = null;
}
ret.EventFilterId = Number(Module.getValue(pData + 12, "i32"));
}
{
var ptr = Module.getValue(pData + 16, "*");
if (ptr !== 0) {
ret.EventExtractorName = String(Module.UTF8ToString(ptr));
}
else {
ret.EventExtractorName = null;
}
ret.EventExtractorId = Number(Module.getValue(pData + 16, "i32"));
}
return ret;
}
Expand Down Expand Up @@ -2196,6 +2198,19 @@ class WindowManagerSetNameParams {
}
}
/* TSBindingsGenerator Generated code -- this code is regenerated on each build */
class WindowManagerSetPointerEventsParams {
static unmarshal(pData) {
let ret = new WindowManagerSetPointerEventsParams();
{
ret.HtmlId = Number(Module.getValue(pData + 0, "*"));
}
{
ret.Enabled = Boolean(Module.getValue(pData + 4, "i32"));
}
return ret;
}
}
/* TSBindingsGenerator Generated code -- this code is regenerated on each build */
class WindowManagerSetPropertyParams {
static unmarshal(pData) {
let ret = new WindowManagerSetPropertyParams();
Expand Down
56 changes: 39 additions & 17 deletions src/Uno.UI.Wasm/ts/WindowManager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -666,6 +666,18 @@ namespace Uno.UI {
return true;
}

private setPointerEvents(htmlId: number, enabled: boolean) {
const element = this.getView(htmlId);
element.style.pointerEvents = enabled ? "auto" : "none";
}

public setPointerEventsNative(pParams: number): boolean {
const params = WindowManagerSetPointerEventsParams.unmarshal(pParams);
this.setPointerEvents(params.HtmlId, params.Enabled);

return true;
}

/**
* Load the specified URL into a new tab or window
* @param url URL to load
Expand Down Expand Up @@ -715,10 +727,10 @@ namespace Uno.UI {
elementId: number,
eventName: string,
onCapturePhase: boolean = false,
eventFilterName?: string,
eventExtractorName?: string
eventFilterId: number,
eventExtractorId: number,
): string {
this.registerEventOnViewInternal(elementId, eventName, onCapturePhase, eventFilterName, eventExtractorName);
this.registerEventOnViewInternal(elementId, eventName, onCapturePhase, eventFilterId, eventExtractorId);
return "ok";
}

Expand All @@ -733,7 +745,13 @@ namespace Uno.UI {
): boolean {
const params = WindowManagerRegisterEventOnViewParams.unmarshal(pParams);

this.registerEventOnViewInternal(params.HtmlId, params.EventName, params.OnCapturePhase, params.EventFilterName, params.EventExtractorName);
this.registerEventOnViewInternal(
params.HtmlId,
params.EventName,
params.OnCapturePhase,
params.EventFilterId,
params.EventExtractorId);

return true;
}

Expand Down Expand Up @@ -771,11 +789,11 @@ namespace Uno.UI {
elementId: number,
eventName: string,
onCapturePhase: boolean = false,
eventFilterName?: string,
eventExtractorName?: string
eventFilterId: number,
eventExtractorId: number
): void {
const element = this.getView(elementId);
const eventExtractor = this.getEventExtractor(eventExtractorName);
const eventExtractor = this.getEventExtractor(eventExtractorId);
const eventHandler = (event: Event) => {
const eventPayload = eventExtractor
? `${eventExtractor(event)}`
Expand Down Expand Up @@ -995,30 +1013,34 @@ namespace Uno.UI {
* Gets the event extractor function. See UIElement.HtmlEventExtractor
* @param eventExtractorName an event extractor name.
*/
private getEventExtractor(eventExtractorName: string): (evt: Event) => string {
private getEventExtractor(eventExtractorId: number): (evt: Event) => string {

if (eventExtractorId) {
//
// NOTE TO MAINTAINERS: Keep in sync with Windows.UI.Xaml.UIElement.HtmlEventExtractor
//

if (eventExtractorName) {
switch (eventExtractorName) {
case "PointerEventExtractor":
switch (eventExtractorId) {
case 1:
return this.pointerEventExtractor;

case "KeyboardEventExtractor":
case 3:
return this.keyboardEventExtractor;

case "TappedEventExtractor":
case 2:
return this.tappedEventExtractor;

case "FocusEventExtractor":
case 4:
return this.focusEventExtractor;

case "CustomEventDetailJsonExtractor":
case 6:
return this.customEventDetailExtractor;

case "CustomEventDetailStringExtractor":
case 5:
return this.customEventDetailStringExtractor;
}

throw `Event filter ${eventExtractorName} is not supported`;
throw `Event extractor ${eventExtractorId} is not supported`;
}

return null;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ class WindowManagerRegisterEventOnViewParams
HtmlId : number;
EventName : string;
OnCapturePhase : boolean;
EventFilterName : string;
EventExtractorName : string;
EventFilterId : number;
EventExtractorId : number;
public static unmarshal(pData:number) : WindowManagerRegisterEventOnViewParams
{
let ret = new WindowManagerRegisterEventOnViewParams();
Expand All @@ -33,29 +33,11 @@ class WindowManagerRegisterEventOnViewParams
}

{
var ptr = Module.getValue(pData + 12, "*");
if(ptr !== 0)
{
ret.EventFilterName = String(Module.UTF8ToString(ptr));
}
else

{
ret.EventFilterName = null;
}
ret.EventFilterId = Number(Module.getValue(pData + 12, "i32"));
}

{
var ptr = Module.getValue(pData + 16, "*");
if(ptr !== 0)
{
ret.EventExtractorName = String(Module.UTF8ToString(ptr));
}
else

{
ret.EventExtractorName = null;
}
ret.EventExtractorId = Number(Module.getValue(pData + 16, "i32"));
}
return ret;
}
Expand Down
20 changes: 20 additions & 0 deletions src/Uno.UI.Wasm/tsBindings/WindowManagerSetPointerEventsParams.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
/* TSBindingsGenerator Generated code -- this code is regenerated on each build */
class WindowManagerSetPointerEventsParams
{
/* Pack=4 */
HtmlId : number;
Enabled : boolean;
public static unmarshal(pData:number) : WindowManagerSetPointerEventsParams
{
let ret = new WindowManagerSetPointerEventsParams();

{
ret.HtmlId = Number(Module.getValue(pData + 0, "*"));
}

{
ret.Enabled = Boolean(Module.getValue(pData + 4, "i32"));
}
return ret;
}
}
Loading

0 comments on commit 9f5968d

Please sign in to comment.