Geogebra.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "![alt text](https://github.com/callysto/callysto-sample-notebooks/blob/master/notebooks/images/Callysto_Notebook-Banner_Top_06.06.18.jpg?raw=true)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Including Geogebra applications\n",
    "\n",
    "Geogebra is an exciting application for doing geometry, albegra, and other mathematical exercises online. You access it here: https://www.geogebra.org/\n",
    "\n",
    "This notebook is not a tutorial on Geogebra; you'll need to figure that out yourself. \n",
    "\n",
    "However, once you know how to make a Geogebra application, you can then include it into a Jupyter notebook.  \n",
    "\n",
    "First step is to use the geogebra.org website to create your app, then export it (download it) as a .ggb file. \n",
    "\n",
    "Second step is to upload it onto the Jupyter hub, using the \"upload\" on the hub menu.\n",
    "\n",
    "Third, you set up some initialization in your Jupyter notebook, that looks like this:\n",
    "```\n",
    "%%html\n",
    "<script src=\"https://cdn.geogebra.org/apps/deployggb.js\"></script>\n",
    "```\n",
    "\n",
    "Forth, you now read in the file (in this case, names geo-test.ggb) into a cell in the Jupyter notebook, like this:\n",
    "```\n",
    "%%html\n",
    "<div id=\"ggb-point\"></div>\n",
    "\n",
    "<script>\n",
    "  var ggbApp = new GGBApplet({\n",
    "      \"height\": 400,\n",
    "      \"showToolBar\": false,\n",
    "      \"showMenuBar\": false,\n",
    "      \"showAlgebraInput\": false,\n",
    "      \"showResetIcon\": true,\n",
    "      \"enableLabelDrags\": false,\n",
    "      \"enableRightClick\": false,\n",
    "      \"enableShiftDragZoom\": true,\n",
    "      \"useBrowserForJS\": false,\n",
    "      \"filename\": \"geo-test.ggb\"\n",
    "  }, 'ggb-point');\n",
    "\n",
    "  ggbApp.inject();\n",
    "</script>\n",
    "```\n",
    "\n",
    "You now will have a working Geogebra application running inside the Jupyter notebook. Note in the commands above, there are a bunch of true/false options for turning on and off various features in the Geogebra application. You can experiment with these until you get the right collection of options desired.\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Example 1\n",
    "\n",
    "First, we do the setup. Note the following is a \"code\" cell, not markdown. "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "<script src=\"https://cdn.geogebra.org/apps/deployggb.js\"></script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "%%html\n",
    "<script src=\"https://cdn.geogebra.org/apps/deployggb.js\"></script>"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Next we load in the Geogebra app with the following code. Note the local file name here is geo-test.ggb. You will have to use the name of your file to get it to load. "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {
    "scrolled": true
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<div id=\"ggb-point\"></div>\n",
       "\n",
       "<script>\n",
       "  var ggbApp = new GGBApplet({\n",
       "      \"height\": 400,\n",
       "      \"showToolBar\": false,\n",
       "      \"showMenuBar\": false,\n",
       "      \"showAlgebraInput\": false,\n",
       "      \"showResetIcon\": true,\n",
       "      \"enableLabelDrags\": false,\n",
       "      \"enableRightClick\": false,\n",
       "      \"enableShiftDragZoom\": true,\n",
       "      \"useBrowserForJS\": false,\n",
       "      \"filename\": \"geo-test.ggb\"\n",
       "  }, 'ggb-point');\n",
       "\n",
       "  ggbApp.inject();\n",
       "</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "%%html\n",
    "\n",
    "<div id=\"ggb-point\"></div>\n",
    "\n",
    "<script>\n",
    "  var ggbApp = new GGBApplet({\n",
    "      \"height\": 400,\n",
    "      \"showToolBar\": false,\n",
    "      \"showMenuBar\": false,\n",
    "      \"showAlgebraInput\": false,\n",
    "      \"showResetIcon\": true,\n",
    "      \"enableLabelDrags\": false,\n",
    "      \"enableRightClick\": false,\n",
    "      \"enableShiftDragZoom\": true,\n",
    "      \"useBrowserForJS\": false,\n",
    "      \"filename\": \"geo-test.ggb\"\n",
    "  }, 'ggb-point');\n",
    "\n",
    "  ggbApp.inject();\n",
    "</script>"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "![alt text](https://github.com/callysto/callysto-sample-notebooks/blob/master/notebooks/images/Callysto_Notebook-Banners_Bottom_06.06.18.jpg?raw=true)"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "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.6.5"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 2
}