Skip to content

Commit 98e407f

Browse files
committed
Merge pull request #8 from archaeron/example
Example
2 parents dc13bbc + e33508a commit 98e407f

File tree

7 files changed

+211
-3
lines changed

7 files changed

+211
-3
lines changed

.gitignore

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
!/.jscsrc
44
!/.jshintrc
55
!/.travis.yml
6-
/bower_components/
7-
/node_modules/
8-
/output/
6+
bower_components/
7+
node_modules/
8+
output/
99
/tmp/
10+
dist/

example/bower.json

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"name": "Halogen Ace Example",
3+
"version": "1.0.0",
4+
"moduleType": [
5+
"node"
6+
],
7+
"ignore": [
8+
"**/.*",
9+
"node_modules",
10+
"bower_components",
11+
"output"
12+
],
13+
"dependencies": {
14+
"purescript-console": "^0.1.0",
15+
"purescript-halogen": "~0.5.8",
16+
"purescript-ace-halogen": "0.4.0",
17+
"ace-builds": "~1.2.2"
18+
}
19+
}

example/gulpfile.js

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
2+
/* jshint node: true */
3+
"use strict";
4+
5+
var gulp = require("gulp");
6+
var purescript = require("gulp-purescript");
7+
var webpack = require("webpack-stream");
8+
9+
var sources = [
10+
"src/**/*.purs",
11+
"bower_components/purescript-*/src/**/*.purs"
12+
];
13+
14+
var foreigns = [
15+
"src/**/*.js",
16+
"bower_components/purescript-*/src/**/*.js"
17+
];
18+
19+
var ourSources =
20+
[sources[0], foreigns[0]]
21+
22+
gulp.task("make", function() {
23+
return purescript.psc({ src: sources, ffi: foreigns });
24+
});
25+
26+
gulp.task("prebundle", ["make"], function() {
27+
return purescript.pscBundle({
28+
src: "output/**/*.js",
29+
output: "dist/main.js",
30+
module: "Main",
31+
main: "Main"
32+
});
33+
});
34+
35+
// Watch Files For Changes
36+
gulp.task('type-watch', function() {
37+
gulp.watch(ourSources, ['make']);
38+
});
39+
40+
gulp.task('watch', function() {
41+
gulp.watch(ourSources, ['bundle']);
42+
});
43+
44+
gulp.task("bundle", ["prebundle"], function () {
45+
return gulp.src("dist/main.js")
46+
.pipe(webpack({
47+
resolve: { modulesDirectories: ["node_modules"] },
48+
output: { filename: "main.js" }
49+
}))
50+
.pipe(gulp.dest("dist"));
51+
});
52+
53+
gulp.task("psci", function() {
54+
return purescript.psci({ src: sources, ffi: foreigns })
55+
.pipe(gulp.dest("."));;
56+
});
57+
58+
gulp.task("default", ["bundle"]);

example/index.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<html>
2+
<head>
3+
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
4+
<link rel="stylesheet" href="styles/styles.css"/>
5+
</head>
6+
<body>
7+
<script src="bower_components/ace-builds/src-min/ace.js" type="text/javascript" charset="utf-8"></script>
8+
<script src="bower_components/ace-builds/src-min/mode-yaml.js" type="text/javascript" charset="utf-8"></script>
9+
<script src="bower_components/ace-builds/src-min/ext-language_tools.js" type="text/javascript" charset="utf-8"></script>
10+
11+
<script src="dist/main.js"></script>
12+
</body>
13+
</html>

example/package.json

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"name": "Halogen Ace Example",
3+
"license": "Apache 2.0",
4+
"repository": "",
5+
"private": true,
6+
"contributors": [ ],
7+
"main": "main.js",
8+
"scripts": {
9+
"postinstall": "bower install",
10+
"build": "gulp"
11+
},
12+
"devDependencies": {
13+
"bower": "^1.4.1",
14+
"gulp": "^3.8.11",
15+
"gulp-jscs": "^1.6.0",
16+
"gulp-jshint": "^1.11.2",
17+
"gulp-purescript": "^0.7.0",
18+
"purescript": "^0.7.6",
19+
"rimraf": "^2.4.1",
20+
"webpack-stream": "^2.0.0"
21+
},
22+
"dependencies": {
23+
"virtual-dom": "^2.0.1"
24+
}
25+
}

example/src/Main.purs

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
module Main where
2+
3+
import Prelude
4+
5+
import Ace.Editor as Editor
6+
import Ace.EditSession as Session
7+
import Ace.Halogen.Component (AceState (), AceQuery ())
8+
import qualified Ace.Halogen.Component as Ace
9+
10+
import Control.Monad.Aff (Aff (), runAff)
11+
import Control.Monad.Eff (Eff ())
12+
import Control.Monad.Eff.Class (MonadEff, liftEff)
13+
import Control.Monad.Eff.Exception (throwException)
14+
import Control.Plus (Plus)
15+
16+
import Data.Functor.Coproduct (Coproduct())
17+
import Data.Maybe (Maybe (..))
18+
19+
import Halogen
20+
import Halogen.Util (appendToBody, onLoad)
21+
import qualified Halogen.HTML.Indexed as H
22+
23+
-- Effects
24+
import Control.Monad.Eff.Random (RANDOM ())
25+
import Control.Monad.Eff.Ref (REF ())
26+
import Ace.Types (ACE ())
27+
import Data.Date (Now ())
28+
29+
30+
data Query a
31+
= UpdateText a
32+
33+
type State =
34+
{ text :: String
35+
}
36+
37+
initialState :: State
38+
initialState =
39+
{ text : "Name: Ace Editor"
40+
}
41+
42+
data AceSlot = AceSlot
43+
44+
instance eqAceSlot :: Eq AceSlot where
45+
eq AceSlot AceSlot = true
46+
47+
instance ordAceSlot :: Ord AceSlot where
48+
compare AceSlot AceSlot = EQ
49+
50+
51+
type StateP g = InstalledState State AceState Query AceQuery g AceSlot
52+
type QueryP = Coproduct Query (ChildF AceSlot AceQuery)
53+
type MainHtml g = ParentHTML AceState Query AceQuery g AceSlot
54+
type MainEffects = HalogenEffects (random :: RANDOM, now :: Now, ref :: REF, ace :: ACE)
55+
type MainAff = Aff MainEffects
56+
57+
ui :: Component (StateP MainAff) QueryP MainAff
58+
ui = parentComponent render eval
59+
where
60+
61+
render :: State -> MainHtml MainAff
62+
render state =
63+
H.div_
64+
[ H.slot AceSlot \_ ->
65+
{ component :
66+
Ace.aceComponent
67+
(\editor -> liftEff $ do
68+
session <- Editor.getSession editor
69+
Session.setMode "ace/mode/yaml" session
70+
Editor.setValue state.text Nothing editor
71+
pure unit
72+
)
73+
Nothing
74+
, initialState :
75+
{ key : Nothing, editor : Nothing }
76+
}
77+
, H.div_
78+
[ H.text state.text ]
79+
]
80+
81+
eval :: EvalParent Query State AceState Query AceQuery MainAff AceSlot
82+
eval (UpdateText next) = do
83+
pure next
84+
85+
main :: Eff MainEffects Unit
86+
main = runAff throwException (const (pure unit)) $ do
87+
app <- runUI ui (installedState initialState)
88+
onLoad $ appendToBody app.node

example/styles/styles.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.ace_editor
2+
{
3+
height: 400px;
4+
}

0 commit comments

Comments
 (0)