{
 "metadata": {
  "cell_tags": [
   [
    "<None>",
    null
   ]
  ],
  "name": ""
 },
 "nbformat": 3,
 "nbformat_minor": 0,
 "worksheets": [
  {
   "cells": [
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "from IPython.html import widgets # Widget definitions\n",
      "from IPython.display import display # Used to display widgets in the notebook"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 1
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "Parent/Child Relationships"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "To display widget A inside widget B, widget A must be a child of widget B.  With IPython widgets, the widgets are instances that live in the back-end (usally Python).  There can be multiple views displayed in the front-end that represent one widget in the backend.  Each view can be displayed at a different time.  Only one instance of any particular model can be child of another.  In other words, *widget A* cannot have *widget B* listed twice in it's children list.\n",
      "\n",
      "Widgets that can contain other widgets have a `children` property.  This property can be set via a kwarg in the widget's constructor or after construction.  Calling display on an object with children automatically displays those children too (as seen below)."
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "floatrange = widgets.FloatSliderWidget()\n",
      "string = widgets.TextBoxWidget(value='hi')\n",
      "container = widgets.ContainerWidget(children=[floatrange, string])\n",
      "\n",
      "display(container) # Displays the `container` and all of it's children."
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 2
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Children can also be added to parents after the parent has been displayed.  The parent is responsible for rendering its children."
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "container = widgets.ContainerWidget()\n",
      "display(container)\n",
      "\n",
      "intrange = widgets.IntSliderWidget()\n",
      "container.children=[intrange]\n"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 3
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "Visibility"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Sometimes it's necessary to hide/show widget views in place, without having to redisplay the widget views.  The `visibility` property of widgets can be used to hide/show widgets that have already been displayed (as seen below)."
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "string = widgets.LatexWidget(value=\"Hello World!\")\n",
      "display(string) "
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 4
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "string.visible=False"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 5
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "string.visible=True"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 6
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "In the example below, a form is rendered which conditionally displays widgets depending on the state of other widgets.  Try toggling the student checkbox."
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "form = widgets.ContainerWidget()\n",
      "first = widgets.TextBoxWidget(description=\"First Name:\")\n",
      "last = widgets.TextBoxWidget(description=\"Last Name:\")\n",
      "\n",
      "student = widgets.CheckBoxWidget(description=\"Student:\", value=False)\n",
      "school_info = widgets.ContainerWidget(visible=False, children=[\n",
      "    widgets.TextBoxWidget(description=\"School:\"),\n",
      "    widgets.IntTextWidget(description=\"Grade:\", min=0, max=12)\n",
      "    ])\n",
      "\n",
      "pet = widgets.TextBoxWidget(description=\"Pet's Name:\")\n",
      "form.children = [first, last, student, school_info, pet]\n",
      "display(form)\n",
      "\n",
      "def on_student_toggle(name, value):\n",
      "    if value:\n",
      "        school_info.visible = True\n",
      "    else:\n",
      "        school_info.visible = False\n",
      "student.on_trait_change(on_student_toggle, 'value')\n"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 7
    }
   ],
   "metadata": {}
  }
 ]
}