{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 1,
   "id": "9c637d02-c7c6-4950-b2b5-7e8fe3148350",
   "metadata": {},
   "outputs": [],
   "source": [
    "import remi.gui as gui\n",
    "from remi import start, App\n",
    "from threading import Timer, Thread\n",
    "import re"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "id": "c838e89f-cd30-44d4-a984-b64f018c695d",
   "metadata": {},
   "outputs": [],
   "source": [
    "remiport = 8085"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "id": "96d858c6-acde-44f1-92f9-417f5617bc28",
   "metadata": {},
   "outputs": [],
   "source": [
    "class MyApp(App):\n",
    "    def __init__(self, *args):\n",
    "        super(MyApp, self).__init__(*args)\n",
    "    \n",
    "    def _net_interface_ip(self):\n",
    "        ip = super()._net_interface_ip()\n",
    "        return ip + f\"/proxy/{remiport}\"\n",
    "    \n",
    "    def _overload(self, data, **kwargs):\n",
    "        if \"filename\" in kwargs:\n",
    "            filename = kwargs['filename']\n",
    "        else:\n",
    "            return data\n",
    "        paths = self.all_paths()\n",
    "        for pattern in paths.keys():\n",
    "            if ( filename.endswith(\".css\") or filename.endswith(\".html\") or filename.endswith(\".js\") or filename.endswith(\"internal\") ):\n",
    "                if type(data) == str:\n",
    "                    data = re.sub(f\"/{pattern}:\", f\"/proxy/{remiport}/{pattern}:\", data)\n",
    "                else:\n",
    "                    data = re.sub(f\"/{pattern}:\", f\"/proxy/{remiport}/{pattern}:\", data.decode()).encode()\n",
    "        return data\n",
    "\n",
    "    def _process_all(self, func, **kwargs):\n",
    "        print(kwargs)\n",
    "        kwargs.update({\"overload\": self._overload})\n",
    "        super()._process_all(func, **kwargs)\n",
    "\n",
    "    def main(self):\n",
    "        #creating a container VBox type, vertical\n",
    "        wid = gui.VBox(width=300, height=200)\n",
    "\n",
    "        #creating a text label\n",
    "        self.lbl = gui.Label('Hello', width='80%', height='50%')\n",
    "\n",
    "        #a button for simple interaction\n",
    "        bt = gui.Button('Press me!', width=200, height=30)\n",
    "\n",
    "        #setting up the listener for the click event\n",
    "        bt.onclick.connect(self.on_button_pressed)\n",
    "        \n",
    "        #adding the widgets to the main container\n",
    "        wid.append(self.lbl)\n",
    "        wid.append(bt)\n",
    "\n",
    "        # returning the root widget\n",
    "        return wid\n",
    "\n",
    "    # listener function\n",
    "    def on_button_pressed(self, emitter):\n",
    "        # print(\"button pressed\")\n",
    "        self.lbl.set_text('Hello World!')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "id": "a3ccabe9-a77e-45bc-bc2a-8632685a44be",
   "metadata": {},
   "outputs": [
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "remi.server      INFO     Started httpserver http://127.0.0.1:8085/\n"
     ]
    }
   ],
   "source": [
    "myRemi = Thread(target=start, \n",
    "                         args=(MyApp,),\n",
    "                         kwargs={'address':'127.0.0.1', \n",
    "                                 'port':remiport, \n",
    "                                 'multiple_instance':True,\n",
    "                                 'enable_file_cache':True, \n",
    "                                 'update_interval':0.5, \n",
    "                                 'start_browser':False})\n",
    "myRemi.start()  "
   ]
  },
  {
   "cell_type": "markdown",
   "id": "0dbd2b0e-85cc-481d-80e1-5df01037d302",
   "metadata": {},
   "source": [
    "http://127.0.0.1:8888/proxy/8085/"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "id": "1c89e4b0-3a23-4484-8dc7-f3b538eb97f9",
   "metadata": {},
   "outputs": [],
   "source": [
    "from IPython.display import IFrame"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "id": "21abcb80-3780-4c36-b82d-c0f6b781d649",
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "        <iframe\n",
       "            width=\"100%\"\n",
       "            height=\"250px\"\n",
       "            src=\"http://localhost:8888/proxy/8085/\"\n",
       "            frameborder=\"0\"\n",
       "            allowfullscreen\n",
       "            \n",
       "        ></iframe>\n",
       "        "
      ],
      "text/plain": [
       "<IPython.lib.display.IFrame at 0x2bc71035bb0>"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "remi.request     INFO     built UI (path=/)\n",
      "127.0.0.1 - - [24/Nov/2021 17:05:29] \"GET / HTTP/1.1\" 200 -\n"
     ]
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "{}\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "remi.server.ws   INFO     connection established: ('127.0.0.1', 49261)\n",
      "remi.server.ws   INFO     handshake complete\n"
     ]
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "{}\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "127.0.0.1 - - [24/Nov/2021 17:09:26] \"GET / HTTP/1.1\" 200 -\n",
      "remi.server.ws   INFO     connection established: ('127.0.0.1', 49323)\n",
      "remi.server.ws   INFO     handshake complete\n"
     ]
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "{}\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "127.0.0.1 - - [24/Nov/2021 17:09:43] \"GET / HTTP/1.1\" 200 -\n",
      "remi.server.ws   INFO     connection established: ('127.0.0.1', 49348)\n",
      "remi.server.ws   INFO     handshake complete\n"
     ]
    }
   ],
   "source": [
    "IFrame(src=\"http://localhost:8888/proxy/8085/\",width=\"100%\",height=\"250px\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a8d32fac-2a27-44a0-b3a3-8256e124c685",
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "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.9.6"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}
