Commit eaa17d9c authored by Sumit Sahrawat's avatar Sumit Sahrawat

Fix examples: Suggestions by @gibiansky

parent 4afec8b0
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 2, "execution_count": 1,
"metadata": { "metadata": {
"collapsed": true "collapsed": true
}, },
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 5, "execution_count": 2,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -391,15 +391,7 @@ ...@@ -391,15 +391,7 @@
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
"outputs": [ "outputs": [],
{
"data": {
"text/plain": []
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [ "source": [
"-- Create new Box and FlexBox\n", "-- Create new Box and FlexBox\n",
"box <- mkBox\n", "box <- mkBox\n",
...@@ -415,7 +407,7 @@ ...@@ -415,7 +407,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 8, "execution_count": 4,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -454,7 +446,160 @@ ...@@ -454,7 +446,160 @@
"\n", "\n",
"+ `Box` is always horizontal, whereas `FlexBox` has a configurable `Orientation`.\n", "+ `Box` is always horizontal, whereas `FlexBox` has a configurable `Orientation`.\n",
"+ `FlexBox` is flexible, and the flexibility is determined by its `Flex` field (0 to 2).\n", "+ `FlexBox` is flexible, and the flexibility is determined by its `Flex` field (0 to 2).\n",
"+ `FlexBox` also has explicit `Pack` and `Align` fields." "+ `FlexBox` also has explicit `Pack` and `Align` fields.\n",
"\n",
"Let's see these differences in action:"
]
},
{
"cell_type": "code",
"execution_count": 5,
"metadata": {
"collapsed": false,
"scrolled": true
},
"outputs": [
{
"data": {
"text/html": [
"<style>/*\n",
"Custom IHaskell CSS.\n",
"*/\n",
"\n",
"/* Styles used for the Hoogle display in the pager */\n",
".hoogle-doc {\n",
" display: block;\n",
" padding-bottom: 1.3em;\n",
" padding-left: 0.4em;\n",
"}\n",
".hoogle-code {\n",
" display: block;\n",
" font-family: monospace;\n",
" white-space: pre;\n",
"}\n",
".hoogle-text {\n",
" display: block;\n",
"}\n",
".hoogle-name {\n",
" color: green;\n",
" font-weight: bold;\n",
"}\n",
".hoogle-head {\n",
" font-weight: bold;\n",
"}\n",
".hoogle-sub {\n",
" display: block;\n",
" margin-left: 0.4em;\n",
"}\n",
".hoogle-package {\n",
" font-weight: bold;\n",
" font-style: italic;\n",
"}\n",
".hoogle-module {\n",
" font-weight: bold;\n",
"}\n",
".hoogle-class {\n",
" font-weight: bold;\n",
"}\n",
"\n",
"/* Styles used for basic displays */\n",
".get-type {\n",
" color: green;\n",
" font-weight: bold;\n",
" font-family: monospace;\n",
" display: block;\n",
" white-space: pre-wrap;\n",
"}\n",
"\n",
".show-type {\n",
" color: green;\n",
" font-weight: bold;\n",
" font-family: monospace;\n",
" margin-left: 1em;\n",
"}\n",
"\n",
".mono {\n",
" font-family: monospace;\n",
" display: block;\n",
"}\n",
"\n",
".err-msg {\n",
" color: red;\n",
" font-style: italic;\n",
" font-family: monospace;\n",
" white-space: pre;\n",
" display: block;\n",
"}\n",
"\n",
"#unshowable {\n",
" color: red;\n",
" font-weight: bold;\n",
"}\n",
"\n",
".err-msg.in.collapse {\n",
" padding-top: 0.7em;\n",
"}\n",
"\n",
"/* Code that will get highlighted before it is highlighted */\n",
".highlight-code {\n",
" white-space: pre;\n",
" font-family: monospace;\n",
"}\n",
"\n",
"/* Hlint styles */\n",
".suggestion-warning { \n",
" font-weight: bold;\n",
" color: rgb(200, 130, 0);\n",
"}\n",
".suggestion-error { \n",
" font-weight: bold;\n",
" color: red;\n",
"}\n",
".suggestion-name {\n",
" font-weight: bold;\n",
"}\n",
"</style><span class='err-msg'>No instance for (Data.Vinyl.Lens.RElem 'Orientation '[] (Data.Vinyl.TypeLevel.RIndex 'Orientation '[])) arising from a use of ‘setField’<br/>In the expression: setField box SOrientation VerticalOrientation<br/>In an equation for ‘it’: it = setField box SOrientation VerticalOrientation</span>"
],
"text/plain": [
"No instance for (Data.Vinyl.Lens.RElem 'Orientation '[] (Data.Vinyl.TypeLevel.RIndex 'Orientation '[])) arising from a use of ‘setField’\n",
"In the expression: setField box SOrientation VerticalOrientation\n",
"In an equation for ‘it’: it = setField box SOrientation VerticalOrientation"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"-- Trying to set orientation for Boxes\n",
"setField box SOrientation VerticalOrientation"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"The errors means that the widget doesn't possess the `Orientation` property."
]
},
{
"cell_type": "code",
"execution_count": 6,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"text/plain": []
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"-- Trying to set orientation for FlexBox\n",
"setField flx SOrientation VerticalOrientation"
] ]
}, },
{ {
...@@ -473,7 +618,7 @@ ...@@ -473,7 +618,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 9, "execution_count": 7,
"metadata": { "metadata": {
"collapsed": true "collapsed": true
}, },
...@@ -492,7 +637,7 @@ ...@@ -492,7 +637,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 13, "execution_count": 8,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -503,61 +648,6 @@ ...@@ -503,61 +648,6 @@
}, },
"metadata": {}, "metadata": {},
"output_type": "display_data" "output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
} }
], ],
"source": [ "source": [
...@@ -576,7 +666,7 @@ ...@@ -576,7 +666,7 @@
"cell_type": "markdown", "cell_type": "markdown",
"metadata": {}, "metadata": {},
"source": [ "source": [
"Both the widgets are similar, the only difference is in the orientation. `Accordion` is vertical, whereas `TabWidget` is horizontal." "Both the widgets are similar, the only major difference is in the orientation. `Accordion` is vertical, whereas `TabWidget` is horizontal."
] ]
} }
], ],
......
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 29, "execution_count": 3,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 30, "execution_count": 4,
"metadata": { "metadata": {
"collapsed": true "collapsed": true
}, },
...@@ -119,7 +119,7 @@ ...@@ -119,7 +119,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 31, "execution_count": 5,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -131,7 +131,7 @@ ...@@ -131,7 +131,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 32, "execution_count": 6,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -166,7 +166,7 @@ ...@@ -166,7 +166,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 33, "execution_count": 7,
"metadata": { "metadata": {
"collapsed": true "collapsed": true
}, },
...@@ -178,7 +178,7 @@ ...@@ -178,7 +178,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 34, "execution_count": 8,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 3, "execution_count": 1,
"metadata": { "metadata": {
"collapsed": false, "collapsed": false,
"scrolled": true "scrolled": true
...@@ -806,7 +806,7 @@ ...@@ -806,7 +806,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 7, "execution_count": 2,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
"cell_type": "code", "cell_type": "code",
"execution_count": 2, "execution_count": 2,
"metadata": { "metadata": {
"collapsed": true "collapsed": false
}, },
"outputs": [], "outputs": [],
"source": [ "source": [
...@@ -70,9 +70,16 @@ ...@@ -70,9 +70,16 @@
"setField tgbs SOptions (OptionLabels [\"line\", \"point\"])" "setField tgbs SOptions (OptionLabels [\"line\", \"point\"])"
] ]
}, },
{
"cell_type": "markdown",
"metadata": {},
"source": [
"The cell below requires `Chart` and `Chart-cairo` to be installed."
]
},
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 7, "execution_count": 4,
"metadata": { "metadata": {
"collapsed": false, "collapsed": false,
"scrolled": true "scrolled": true
...@@ -125,91 +132,20 @@ ...@@ -125,91 +132,20 @@
" \n", " \n",
"-- Add event handlers to make widgets work\n", "-- Add event handlers to make widgets work\n",
"setField msel SSelectionHandler refresh\n", "setField msel SSelectionHandler refresh\n",
"setField tgbs SSelectionHandler refresh" "setField tgbs SSelectionHandler refresh\n",
"\n",
"-- Set initial value, and trigger event to show initial plot\n",
"setField msel SSelectedLabels [\"sin\"]\n",
"triggerSelection msel"
] ]
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 8, "execution_count": 5,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
"outputs": [ "outputs": [
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{
"data": {},
"metadata": {},
"output_type": "display_data"
},
{ {
"data": {}, "data": {},
"metadata": {}, "metadata": {},
......
...@@ -315,7 +315,15 @@ ...@@ -315,7 +315,15 @@
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
"outputs": [], "outputs": [
{
"data": {
"text/plain": []
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [ "source": [
"-- Set some html string\n", "-- Set some html string\n",
"setField html SStringValue \"<b>Bold</b>\"" "setField html SStringValue \"<b>Bold</b>\""
...@@ -330,17 +338,8 @@ ...@@ -330,17 +338,8 @@
"outputs": [], "outputs": [],
"source": [ "source": [
"-- Set some latex string\n", "-- Set some latex string\n",
"setField latex SStringValue \"$x + y$\"" "setField latex SStringValue \"$x + y$\"\n",
] "\n",
},
{
"cell_type": "code",
"execution_count": 7,
"metadata": {
"collapsed": true
},
"outputs": [],
"source": [
"-- The default width of LatexWidget is somewhat small\n", "-- The default width of LatexWidget is somewhat small\n",
"setField latex SWidth 400" "setField latex SWidth 400"
] ]
...@@ -354,7 +353,7 @@ ...@@ -354,7 +353,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 8, "execution_count": 7,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -380,7 +379,7 @@ ...@@ -380,7 +379,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 9, "execution_count": 8,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -392,7 +391,7 @@ ...@@ -392,7 +391,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 10, "execution_count": 9,
"metadata": { "metadata": {
"collapsed": false, "collapsed": false,
"scrolled": true "scrolled": true
...@@ -420,7 +419,7 @@ ...@@ -420,7 +419,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 11, "execution_count": 10,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -454,7 +453,7 @@ ...@@ -454,7 +453,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 12, "execution_count": 11,
"metadata": { "metadata": {
"collapsed": true "collapsed": true
}, },
...@@ -477,7 +476,7 @@ ...@@ -477,7 +476,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 13, "execution_count": 12,
"metadata": { "metadata": {
"collapsed": true "collapsed": true
}, },
...@@ -538,7 +537,7 @@ ...@@ -538,7 +537,7 @@
}, },
{ {
"cell_type": "code", "cell_type": "code",
"execution_count": 14, "execution_count": 13,
"metadata": { "metadata": {
"collapsed": false "collapsed": false
}, },
...@@ -566,6 +565,25 @@ ...@@ -566,6 +565,25 @@
"source": [ "source": [
"The `TextArea` doesn't have a `SubmitHandler`, but does have a `ChangeHandler`. It is best used to display large amounts of text." "The `TextArea` doesn't have a `SubmitHandler`, but does have a `ChangeHandler`. It is best used to display large amounts of text."
] ]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"We can re-display the widgets (nobody likes to scroll needlessly):"
]
},
{
"cell_type": "code",
"execution_count": 14,
"metadata": {
"collapsed": true
},
"outputs": [],
"source": [
"text\n",
"area"
]
} }
], ],
"metadata": { "metadata": {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment