{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Mesh widgets\n",
    "\n",
    "In order to control interactive plots, sometimes we need to vary certain parameters which depend on the mesh. Therefore, mesh object has several widgets, which can be used for that purpose.\n",
    "\n",
    "The mesh we are going to use as an example is:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [],
   "source": [
    "import discretisedfield as df\n",
    "\n",
    "p1 = (0, 0, 0)\n",
    "p2 = (100e-9, 50e-9, 20e-9)\n",
    "n = (20, 10, 4)\n",
    "\n",
    "region = df.Region(p1=p1, p2=p2)\n",
    "mesh = df.Mesh(region=region, n=n)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Slider\n",
    "\n",
    "Slider widget allows us to navigate through the coordinates of the mesh along the certain axis. For instance, if we want to \"slide through\" the x-axis, the widget is:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "970366e1d2ef473ca7322cbef6552a0c",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "SelectionSlider(description='x (nm)', index=10, options=((2.5, 2.5e-09), (7.5, 7.500000000000001e-09), (12.5, …"
      ]
     },
     "execution_count": 2,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.slider(\"x\")"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "The minimum value of the slider is the x-coordinate of the cell with the minimum coordinates, whereas the maximum value is the x-coordinate of the last cell along the x-direction. The steps on the slider correspond to the distance between cells.\n",
    "\n",
    "Widget description is generated by default, and can be changed by passing `description` argument."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "ea6d660faf0a443e8bb793abe0f17c70",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "SelectionSlider(description='my slider', index=10, options=((2.5, 2.5e-09), (7.5, 7.500000000000001e-09), (12.…"
      ]
     },
     "execution_count": 3,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.slider(\"x\", description=\"my slider\")"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Similar to plots, we can change the multiplier:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "3cbe650085eb4d89bec57470258442e5",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "SelectionSlider(description='x (pm)', index=10, options=((2500.0, 2.5e-09), (7500.0, 7.500000000000001e-09), (…"
      ]
     },
     "execution_count": 4,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.slider(\"x\", multiplier=1e-12)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "We now get the values in picometers and the units are shown in the widget description.\n",
    "\n",
    "Slider is based on [ipywidgets.SelectionSlider](https://ipywidgets.readthedocs.io/en/latest/examples/Widget%20List.html#SelectionSlider), so any keyword arguments accepted by it can be passed."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "f09a581d5b564567b75f278c2119b412",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "SelectionSlider(description='x (nm)', index=10, options=((2.5, 2.5e-09), (7.5, 7.500000000000001e-09), (12.5, …"
      ]
     },
     "execution_count": 5,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.slider(\"x\", orientation=\"vertical\")"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Axis selector\n",
    "\n",
    "A simple widget, which allows us to select the axis we want can be obtained as:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "bc8877e511814a98882c3824d6c9f90f",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "Dropdown(description='axis', index=2, options=('x', 'y', 'z'), value='z')"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.axis_selector()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "By default, a dropdown menu is returned where we can select x, y, or z axis. Instead of a dropdown menu, we can ask for radio buttons, by passing `widget='radiobuttons'`."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "1f29d7fe16854a569e7d7e6520053862",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "RadioButtons(description='axis', index=2, options=('x', 'y', 'z'), value='z')"
      ]
     },
     "execution_count": 7,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.axis_selector(widget=\"radiobuttons\")"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "The description of the widget, similar to slider, can be changed using `description` string."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "89327e59c93c43d2a7b32a3435e02126",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "Dropdown(description='my selector', index=2, options=('x', 'y', 'z'), value='z')"
      ]
     },
     "execution_count": 8,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "mesh.axis_selector(description=\"my selector\")"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3 (ipykernel)",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.10.12"
  },
  "widgets": {
   "application/vnd.jupyter.widget-state+json": {
    "state": {
     "0663188f69464738b72edb51f1e3d218": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "SelectionSliderModel",
      "state": {
       "_options_labels": [
        "2.5",
        "7.5",
        "12.5",
        "17.5",
        "22.5",
        "27.5",
        "32.5",
        "37.5",
        "42.5",
        "47.5",
        "52.5",
        "57.5",
        "62.5",
        "67.5",
        "72.5",
        "77.5",
        "82.5",
        "87.5",
        "92.5",
        "97.5"
       ],
       "description": "my slider",
       "index": 10,
       "layout": "IPY_MODEL_a5190dcfef954b67a3f760865e147ac7",
       "style": "IPY_MODEL_472700fb0e5d4420aebb1e48ff13d1fa"
      }
     },
     "1a679ced93cc495cb969c645a48de557": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "1ab576489c524af99108858e00ec379d": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "2972b7202fa740328e06715fe46bf7e8": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "SelectionSliderModel",
      "state": {
       "_options_labels": [
        "2.5",
        "7.5",
        "12.5",
        "17.5",
        "22.5",
        "27.5",
        "32.5",
        "37.5",
        "42.5",
        "47.5",
        "52.5",
        "57.5",
        "62.5",
        "67.5",
        "72.5",
        "77.5",
        "82.5",
        "87.5",
        "92.5",
        "97.5"
       ],
       "description": "x (nm)",
       "index": 10,
       "layout": "IPY_MODEL_9cfe7172d5f44679bd617c6d3c41b6fa",
       "style": "IPY_MODEL_e33880be0f80481b917dd27b3c4bf868"
      }
     },
     "2b6a1990d5f540f8923aefa975d3d82f": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "2cf609ca54804509a26d505102414653": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "SelectionSliderModel",
      "state": {
       "_options_labels": [
        "2.5",
        "7.5",
        "12.5",
        "17.5",
        "22.5",
        "27.5",
        "32.5",
        "37.5",
        "42.5",
        "47.5",
        "52.5",
        "57.5",
        "62.5",
        "67.5",
        "72.5",
        "77.5",
        "82.5",
        "87.5",
        "92.5",
        "97.5"
       ],
       "description": "x (nm)",
       "index": 10,
       "layout": "IPY_MODEL_9ccd0847ab5c49fa9e0e2ce8df59adc9",
       "orientation": "vertical",
       "style": "IPY_MODEL_4e38cda84d5c49a69c00b97ff8edd71a"
      }
     },
     "472700fb0e5d4420aebb1e48ff13d1fa": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "4e38cda84d5c49a69c00b97ff8edd71a": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "515cbee5788b44e8ab31decd8b937c84": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "SelectionSliderModel",
      "state": {
       "_options_labels": [
        "2500.0",
        "7500.0",
        "12500.0",
        "17500.0",
        "22500.0",
        "27500.0",
        "32500.0",
        "37500.0",
        "42500.0",
        "47500.0",
        "52500.0",
        "57500.0",
        "62500.0",
        "67500.0",
        "72500.0",
        "77500.0",
        "82500.0",
        "87500.0",
        "92500.0",
        "97500.0"
       ],
       "description": "x (pm)",
       "index": 10,
       "layout": "IPY_MODEL_e03a8b3603e34b15af08b8b24a0ac6ea",
       "style": "IPY_MODEL_9f668acb2da549fb840d89f61a936114"
      }
     },
     "566b4c6ca8f741839ebc1b4e25ea5244": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "6e48db4bf7844f5a9988b4bf70afbb0b": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "7fe4b4c885b743d9b95572998adbe95c": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DropdownModel",
      "state": {
       "_options_labels": [
        "x",
        "y",
        "z"
       ],
       "description": "my selector",
       "index": 2,
       "layout": "IPY_MODEL_6e48db4bf7844f5a9988b4bf70afbb0b",
       "style": "IPY_MODEL_2b6a1990d5f540f8923aefa975d3d82f"
      }
     },
     "9ccd0847ab5c49fa9e0e2ce8df59adc9": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "9cfe7172d5f44679bd617c6d3c41b6fa": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "9f668acb2da549fb840d89f61a936114": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "a5190dcfef954b67a3f760865e147ac7": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "e03a8b3603e34b15af08b8b24a0ac6ea": {
      "model_module": "@jupyter-widgets/base",
      "model_module_version": "1.2.0",
      "model_name": "LayoutModel",
      "state": {}
     },
     "e231d87e837f4e67a048d9bf8cc94b69": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "e33880be0f80481b917dd27b3c4bf868": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DescriptionStyleModel",
      "state": {
       "description_width": ""
      }
     },
     "e3bfb1715b524e928028699e533527b9": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "DropdownModel",
      "state": {
       "_options_labels": [
        "x",
        "y",
        "z"
       ],
       "description": "axis",
       "index": 2,
       "layout": "IPY_MODEL_1ab576489c524af99108858e00ec379d",
       "style": "IPY_MODEL_1a679ced93cc495cb969c645a48de557"
      }
     },
     "e99e1ecd26cd467bab948e5c4cd87730": {
      "model_module": "@jupyter-widgets/controls",
      "model_module_version": "1.5.0",
      "model_name": "RadioButtonsModel",
      "state": {
       "_options_labels": [
        "x",
        "y",
        "z"
       ],
       "description": "axis",
       "index": 2,
       "layout": "IPY_MODEL_566b4c6ca8f741839ebc1b4e25ea5244",
       "style": "IPY_MODEL_e231d87e837f4e67a048d9bf8cc94b69"
      }
     }
    },
    "version_major": 2,
    "version_minor": 0
   }
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}