Skip to content

Commit dd7a355

Browse files
easafeeasafe
committed
Make events work
1 parent bbc3d57 commit dd7a355

File tree

8 files changed

+80
-57
lines changed

8 files changed

+80
-57
lines changed

‎examples/App/App.purs

+6-6
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,12 @@ update model = case _ of
2828
Update int → Just int :> []
2929

3030
view ∷ Model → Html Message
31-
view model = HE.text (show model)
32-
33-
-- HE.div "main"
34-
-- [ HE.text (show model)
35-
-- -- , HE.button [ HA.onClick Roll ] "Roll"
36-
-- ]
31+
view model =
32+
HE.div "main"
33+
[ HE.text "Dice roll:",
34+
HE.text (show model)
35+
, HE.button [ HA.onClick Roll ] "Roll"
36+
]
3737

3838
main ∷ Effect Unit
3939
main = FAN.mount "App"

‎spago.dhall

+2-1
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ You can edit this file as you like.
1313
, "arrays"
1414
, "bifunctors"
1515
, "console"
16+
, "debug"
1617
, "effect"
1718
, "either"
1819
, "exceptions"
@@ -26,8 +27,8 @@ You can edit this file as you like.
2627
, "prelude"
2728
, "random"
2829
, "refs"
29-
, "strings"
3030
, "spec"
31+
, "strings"
3132
, "tuples"
3233
, "typelevel-prelude"
3334
, "unsafe-coerce"

‎src/Flame/Native/Attribute/Event.js

+15-2
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,28 @@
11
let messageEventData = 5,
22
rawEventData = 6;
33

4+
//the global functions will be set at the native renderer
5+
function messageHandler(message) {
6+
return function() {
7+
return global.globalFlameUpdater(global.globalFlameEventWrapper(message))();
8+
}
9+
}
10+
11+
function rawMessageHandler(handler) {
12+
return function(event) {
13+
return global.globalFlameUpdater(handler(event)())();
14+
}
15+
}
16+
417
export function createEvent_(name) {
518
return function (message) {
6-
return [messageEventData, name, message];
19+
return [messageEventData, name, messageHandler(message)];
720
};
821
}
922

1023
export function createRawEvent_(name) {
1124
return function (handler) {
12-
return [rawEventData, name, handler];
25+
return [rawEventData, name, rawMessageHandler(handler)];
1326
};
1427
}
1528

‎src/Flame/Native/Attribute/Event.purs

+1-1
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ onScroll' ∷ ∀ message. ToRawEvent message
6464
onScroll' = createEventMessage "scroll"
6565

6666
onClick ∷ ∀ message. ToEvent message
67-
onClick = createEvent "click"
67+
onClick = createEvent "onPress"
6868

6969
onClick' ∷ ∀ message. ToRawEvent message
7070
onClick' = createEventMessage "click"

‎src/Flame/Native/Element.js

+43-38
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, {createElement } from 'react';
2-
import { View, Text } from 'react-native';
2+
import { View, Text, Button } from 'react-native';
33

44
let textNode = 1,
55
elementNode = 2,
@@ -43,6 +43,14 @@ export function createViewNode(nodeData) {
4343
};
4444
}
4545

46+
export function createButtonNode(nodeData) {
47+
return function(text) {
48+
let props = fromNodeData(nodeData)
49+
50+
return createElement(Button, { title: text, ...props });
51+
}
52+
}
53+
4654
export function createDatalessElementNode(tag) {
4755
return function (potentialChildren) {
4856
let children = potentialChildren,
@@ -176,51 +184,48 @@ function asSvg(elements) {
176184
}
177185

178186
function fromNodeData(allData) {
179-
let nodeData = {};
187+
let nodeData;
188+
189+
if (allData !== undefined) {
190+
nodeData = {};
180191

181-
if (allData !== undefined)
182192
for (let data of allData) {
183193
let dataOne = data[1];
184194
//[0] also always contain the data type
185195
switch (data[0]) {
186-
case styleData:
187-
if (nodeData.styles === undefined)
188-
nodeData.styles = {};
189-
190-
for (let key in dataOne)
191-
nodeData.styles[key] = dataOne[key];
192-
break;
193-
case classData:
194-
if (nodeData.classes === undefined)
195-
nodeData.classes = [];
196-
197-
nodeData.classes = nodeData.classes.concat(dataOne);
198-
break;
199-
case propertyData:
200-
if (nodeData.properties === undefined)
201-
nodeData.properties = {};
202-
203-
nodeData.properties[dataOne] = data[2];
204-
break;
205-
case attributeData:
206-
if (nodeData.attributes === undefined)
207-
nodeData.attributes = {};
208-
209-
nodeData.attributes[dataOne] = data[2];
210-
break;
211-
case keyData:
212-
nodeData.key = dataOne;
213-
break;
196+
// case styleData:
197+
// if (nodeData.styles === undefined)
198+
// nodeData.styles = {};
199+
200+
// for (let key in dataOne)
201+
// nodeData.styles[key] = dataOne[key];
202+
// break;
203+
// case classData:
204+
// if (nodeData.classes === undefined)
205+
// nodeData.classes = [];
206+
207+
// nodeData.classes = nodeData.classes.concat(dataOne);
208+
// break;
209+
// case propertyData:
210+
// if (nodeData.properties === undefined)
211+
// nodeData.properties = {};
212+
213+
// nodeData.properties[dataOne] = data[2];
214+
// break;
215+
// case attributeData:
216+
// if (nodeData.attributes === undefined)
217+
// nodeData.attributes = {};
218+
219+
// nodeData.attributes[dataOne] = data[2];
220+
// break;
221+
// case keyData:
222+
// nodeData.key = dataOne;
223+
// break;
214224
default:
215-
if (nodeData.events === undefined)
216-
nodeData.events = {};
217-
218-
if (nodeData.events[dataOne] === undefined)
219-
nodeData.events[dataOne] = [];
220-
221-
nodeData.events[dataOne].push(data[2]);
225+
nodeData[dataOne] = data[2];
222226
}
223227
}
228+
}
224229

225230
return nodeData;
226231
}

‎src/Flame/Native/Element.purs

+3-2
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ type NodeRenderer arg =
5151

5252
foreign import createElementNode ∷ ∀ message. Tag → Array (NodeData message) → Array (Html message) → Html message
5353
foreign import createViewNode ∷ ∀ message. Array (NodeData message) → Array (Html message) → Html message
54+
foreign import createButtonNode ∷ ∀ message. Array (NodeData message) → String -> Html message
5455
foreign import createDatalessElementNode ∷ ∀ message. Tag → Array (Html message) → Html message
5556
foreign import createSingleElementNode ∷ ∀ message. Tag → Array (NodeData message) → Html message
5657

@@ -245,8 +246,8 @@ body_ = createElement_ "body"
245246
body' ∷ ∀ a h. ToHtml' a h
246247
body' = createElement' "body"
247248

248-
button ∷ ∀ a b h. ToHtml a b h
249-
button = createElement "button"
249+
250+
button = createButtonNode
250251

251252
button_ ∷ ∀ b h. ToHtml_ b h
252253
button_ = createElement_ "button"

‎src/Flame/Renderer/Internal/Native.js

+9-7
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,19 @@ import { AppRegistry } from 'react-native';
33

44
//as far as I can tell we need this because for class based components react expects a class type and not an instance
55
let reactWrapper = { app : undefined },
6-
flameEventWrapper, flameGlobalUpdater, initialMarkup, initialState;
6+
initialMarkup,
7+
initialState;
8+
9+
//needed so we can run events as it is
10+
global.globalFlameEventWrapper = undefined;
11+
global.globalFlameUpdater = undefined;
712

813
export function start_(eventWrapper, updater, name, markup, state) {
914
initialMarkup = markup;
1015
initialState = state;
11-
flameGlobalUpdater = updater;
12-
flameEventWrapper = eventWrapper;
16+
17+
global.globalFlameEventWrapper = eventWrapper;
18+
global.globalFlameUpdater = updater;
1319

1420
AppRegistry.registerComponent(name, function () {
1521
return N;
@@ -23,17 +29,13 @@ export function resume_(wrapper, view, model) {
2329
};
2430

2531
class N extends Component {
26-
eventWrapper;
27-
flameUpdater;
2832
flameMarkup;
2933

3034
constructor() {
3135
super();
3236

3337
this.flameMarkup = initialMarkup;
3438
this.state = initialState;
35-
this.flameUpdater = flameGlobalUpdater;
36-
this.eventWrapper = flameEventWrapper;
3739

3840
reactWrapper.app = this;
3941
}

‎src/Flame/Renderer/Internal/Native.purs

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import Effect (Effect)
88
import Effect.Uncurried (EffectFn3, EffectFn5)
99
import Effect.Uncurried as EU
1010
import Flame.Types (Html)
11+
import Debug
1112

1213
-- | Events that are messages rather than callbacks need to be wrapped from the FFI
1314
type MessageWrapper message = message → Maybe message

0 commit comments

Comments
 (0)