From 10c6ddb61a9bd65c6c509a64d57185ec3b5bc9dd Mon Sep 17 00:00:00 2001 From: Andreas Schaafsma Date: Fri, 14 Jan 2022 18:23:19 +0000 Subject: [PATCH] added backup source for future ref --- app/srcbak/App.css | 8 +++++ app/srcbak/App.hx | 33 +++++++++++++++++++ app/srcbak/Dom.hx | 16 ++++++++++ app/srcbak/Root.hx | 53 +++++++++++++++++++++++++++++++ app/srcbak/bundles/MyBundle.hx | 12 +++++++ app/srcbak/com/Foo.css | 14 ++++++++ app/srcbak/com/Foo.hx | 27 ++++++++++++++++ app/srcbak/com/Foo2.hx | 23 ++++++++++++++ app/srcbak/com/bug.png | Bin 0 -> 774 bytes app/srcbak/components/Header.css | 0 app/srcbak/components/Header.hx | 20 ++++++++++++ app/srcbak/config.json | 4 +++ 12 files changed, 210 insertions(+) create mode 100644 app/srcbak/App.css create mode 100644 app/srcbak/App.hx create mode 100644 app/srcbak/Dom.hx create mode 100644 app/srcbak/Root.hx create mode 100644 app/srcbak/bundles/MyBundle.hx create mode 100644 app/srcbak/com/Foo.css create mode 100644 app/srcbak/com/Foo.hx create mode 100644 app/srcbak/com/Foo2.hx create mode 100644 app/srcbak/com/bug.png create mode 100644 app/srcbak/components/Header.css create mode 100644 app/srcbak/components/Header.hx create mode 100644 app/srcbak/config.json diff --git a/app/srcbak/App.css b/app/srcbak/App.css new file mode 100644 index 0000000..595c765 --- /dev/null +++ b/app/srcbak/App.css @@ -0,0 +1,8 @@ +body { + font-family: Arial; + margin: 0; +} + +h1 { + margin: 10px; +} diff --git a/app/srcbak/App.hx b/app/srcbak/App.hx new file mode 100644 index 0000000..f07af47 --- /dev/null +++ b/app/srcbak/App.hx @@ -0,0 +1,33 @@ +import react.ReactMacro.jsx; +import Webpack.*; +import Root; + + +class App { + static var STYLES = require('./App.css'); + + static public function main() { + new App(); + } + + public function new() { + var root = createRoot(); + + var rootComponent = react.ReactDOM.render(jsx(' + + '), root); + + #if debug + ReactHMR.autoRefresh(rootComponent); + #end + } + + function createRoot() { + var current = js.Browser.document.getElementById('root'); + if (current != null) return current; + current = Dom.div(); + current.id = 'root'; + Dom.body().appendChild(current); + return current; + } +} diff --git a/app/srcbak/Dom.hx b/app/srcbak/Dom.hx new file mode 100644 index 0000000..9585552 --- /dev/null +++ b/app/srcbak/Dom.hx @@ -0,0 +1,16 @@ +class Dom { + static var TEMP = js.Browser.document.createDivElement(); + + inline static public function div() { + return js.Browser.document.createDivElement(); + } + + inline static public function html(html: String) { + TEMP.innerHTML = html; + return TEMP.firstElementChild; + } + + inline static public function body() { + return js.Browser.document.body; + } +} diff --git a/app/srcbak/Root.hx b/app/srcbak/Root.hx new file mode 100644 index 0000000..3f58418 --- /dev/null +++ b/app/srcbak/Root.hx @@ -0,0 +1,53 @@ +import com.Foo; +import components.Header; +import react.ReactMacro.jsx; +import react.ReactComponent; +import react.router.Route; + +typedef RootState = { + route: String, + ?component: react.React.CreateElementType +} + +class Root extends react.ReactComponentOfState { + + public function new() { + super(); + state = { route:'' }; + } + + override function componentDidMount() { + switch (state.route) { + default: + Webpack.load(Foo).then(function(_) { + setState(cast { component:Foo }); + }); + } + } + function yeet(){ + //state.route="yeet"; + //trace(this.props.location.pathname); + trace(state); + } + + override function render() { + return jsx(' +
+
+

Hello Haxe + Webpack + React

+ ${renderContent()} +
+ '); + } + + function renderContent() { + if (state.component == null) + return jsx(' + Loading... + '); + else + return jsx(' + + '); + } +} diff --git a/app/srcbak/bundles/MyBundle.hx b/app/srcbak/bundles/MyBundle.hx new file mode 100644 index 0000000..24ed933 --- /dev/null +++ b/app/srcbak/bundles/MyBundle.hx @@ -0,0 +1,12 @@ +import react.ReactComponent; +import react.router.Route.RouteRenderProps; + +@:expose('default') +class MyBundle extends ReactComponentOfProps { + // If you want to execute code when this bundle is _first_ loaded: + public static function onLoad() { + // ... + } + + // ... +} \ No newline at end of file diff --git a/app/srcbak/com/Foo.css b/app/srcbak/com/Foo.css new file mode 100644 index 0000000..2bce033 --- /dev/null +++ b/app/srcbak/com/Foo.css @@ -0,0 +1,14 @@ +.foo { + margin: 10px; + padding: 10px; + background: #eee; +} + +.foo .yeah { + margin-top: 20px; +} + +.foo .yeah p { + margin: 0; + border-bottom: solid 1px red; +} \ No newline at end of file diff --git a/app/srcbak/com/Foo.hx b/app/srcbak/com/Foo.hx new file mode 100644 index 0000000..d8d7ea4 --- /dev/null +++ b/app/srcbak/com/Foo.hx @@ -0,0 +1,27 @@ +package com; + +import react.ReactComponent; +import react.ReactMacro.jsx; +import Webpack.*; + +class Foo extends ReactComponent { + + static var STYLES = require('./Foo.css'); + static var IMG = require('./bug.png'); + static var CONFIG = require('../config.json'); + + public function yeet(){ + trace(state); + } + + override function render() { + return jsx(' +
+ ${CONFIG.hello}! +

${CONFIG.yeet}!

+
+ Let\'s do some HRM guys
+
+ '); + } +} diff --git a/app/srcbak/com/Foo2.hx b/app/srcbak/com/Foo2.hx new file mode 100644 index 0000000..60006e6 --- /dev/null +++ b/app/srcbak/com/Foo2.hx @@ -0,0 +1,23 @@ +package com; + +import react.ReactComponent; +import react.ReactMacro.jsx; +import Webpack.*; + +class Foo2 extends ReactComponent { + + static var STYLES = require('./Foo.css'); + static var IMG = require('./bug.png'); + static var CONFIG = require('../config.json'); + + + override function render() { + return jsx(' +
+ ${CONFIG.hello}! +
+ Let\'s do some HRM guys
+
+ '); + } +} diff --git a/app/srcbak/com/bug.png b/app/srcbak/com/bug.png new file mode 100644 index 0000000000000000000000000000000000000000..2d5fb90ec6ee08f53947e0266a87b03f75893446 GIT binary patch literal 774 zcmV+h1Nr=kP) zlgUq0Q544c8(ae&UR$8ps&snq6^bPY3v3xAmMW74Di$h~GCH6E3TaYs2#6A<7K*gC z777H71_Wa;(dfp+g-drPCSWu)#PInZi72LJ;o?i~$-U=y&UbQ89Dul3%3P+Axkzc* zbH-y;QF=hR{qLItf%ci2_&e5wNo0gnVatG?ul6Zw=o$I9Ljfn*ic3`U?>IfEim3g{ zujU&$-hy6wn;w(xme|zJm;lWJxtTFfM)q0`kX!Vu0+d${$}LCddK1<^htTe-fUYL3 zB`SdNsZD>RgvLj1<^@h6_+cDRK2Brcr2~>%$*5S)hyV33PV^teac3%|4lz@8p4?)5 z?t5o^?q+%^%)Yygo~I^U4VR!bTnWuE35hcWrfCDR3q+sxJ79e7Fg`&)RCqLA^2^y^ z0laVfadW90_Fz8Brm|r47sB^u1VgI>kanj)Z4`zMSfHlm8>CwXa$JVM`$2RrmZB-3 zN10m-!;BvH*Br3V8t`DH7m`jf#2upVDXl{5ff18_pzCPK1Zu$$CKKvd8FGeFf)+K<|x33pc7P&S#3GZT4mEw;nr(Ze*F z3&*?-4U-lm*#tber5 z%S_ceqB`b3ko6r~BbvDwdohTvP(3a(pq{x#T$yQsu#OKwEe}KuH^Mh@nxg_(Nw136 zq#a^3xNBke)In+!?qk3%4wB69{pF`Tzg`07*qoM6N<$ Eg55P&8UO$Q literal 0 HcmV?d00001 diff --git a/app/srcbak/components/Header.css b/app/srcbak/components/Header.css new file mode 100644 index 0000000..e69de29 diff --git a/app/srcbak/components/Header.hx b/app/srcbak/components/Header.hx new file mode 100644 index 0000000..e8b8963 --- /dev/null +++ b/app/srcbak/components/Header.hx @@ -0,0 +1,20 @@ +package components; + +import react.ReactMacro.jsx; +import react.ReactComponent; +import Webpack.*; + +class Header extends ReactComponent{ + static var STYLES = require('./Header.css'); + public function yeet(){ + trace(props); + props.foo(); + } + override function render() { + return jsx(' +
+ +
+ '); + } +} \ No newline at end of file diff --git a/app/srcbak/config.json b/app/srcbak/config.json new file mode 100644 index 0000000..bc5024e --- /dev/null +++ b/app/srcbak/config.json @@ -0,0 +1,4 @@ +{ + "hello": "This is an asynchronous module" , + "yeet": "yote" +}