play2048.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "    <div class=\"bk-root\">\n",
       "        <a href=\"https://bokeh.pydata.org\" target=\"_blank\" class=\"bk-logo bk-logo-small bk-logo-notebook\"></a>\n",
       "        <span id=\"1001\">Loading BokehJS ...</span>\n",
       "    </div>"
      ]
     },
     "metadata": {},
     "output_type": "execute_result"
    },
    {
     "data": {},
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "import itertools\n",
    "from ipywidgets import interact, Button, IntText, GridBox, Layout, VBox, HBox, HTML, Output, Label\n",
    "from IPython.display import display\n",
    "from bokeh.io import push_notebook, show, output_notebook\n",
    "from bokeh.layouts import row, column, layout\n",
    "from bokeh.models import CategoricalColorMapper, ColumnDataSource, Text\n",
    "from bokeh.plotting import figure, output_file\n",
    "from grid import Grid\n",
    "output_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "scrolled": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "\n",
       "\n",
       "\n",
       "\n",
       "\n",
       "  <div class=\"bk-root\" id=\"2421db77-2bdc-4bcd-940b-c15d047b432a\"></div>\n"
      ]
     },
     "metadata": {},
     "output_type": "execute_result"
    },
    {
     "data": {},
     "metadata": {
      "application/vnd.bokehjs_exec.v0+json": {
       "id": "1006"
      }
     },
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "GridBox(children=(Button(description='Up', layout=Layout(grid_area='btn_up', width='auto'), style=ButtonStyle(…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Game Over\n",
      "Re-run this cell to start again.\n"
     ]
    }
   ],
   "source": [
    "g = Grid(4, 4)\n",
    "\n",
    "line_width = 10\n",
    "line_color = '#B8AD9A'  # the same for plot outline and rectangles border\n",
    "\n",
    "p = figure(tools='', title=f\"Score: {g.score}\", plot_width=400, plot_height=400, \n",
    "           x_range=(-0.5, 3.5), y_range=(3.5, -0.5))\n",
    "\n",
    "# make the graph look more like a game board\n",
    "line_width = 10\n",
    "line_color = '#B8AD9A'\n",
    "p.outline_line_width = line_width\n",
    "p.outline_line_color = line_color\n",
    "p.xgrid.grid_line_color = p.ygrid.grid_line_color = None\n",
    "p.title.align = 'right'\n",
    "p.title.text_font_size = '1.5em'\n",
    "p.axis.visible = False\n",
    "\n",
    "\n",
    "color_dict = {0: '#D7D7D7', 2: '#ECE3AF', 4: '#E0D1A1', 8: '#D3B486', 16: '#F0AB79', 32: '#F18231',\n",
    "              64: '#F73B0C', 128: '#DAD083', 256: '#D6C01E', 512: '#D4E80F', 1024: '#A3D829',\n",
    "              2048: '#30D55A', 4096: '#B356E5', 8192: '#37E5E7', 16384: '#5117EA', 32768: '#C13695',\n",
    "              65536: '#468A9C', 131072: '#9C4657'}\n",
    "coord_pairs = [i for i in itertools.product(range(4), range(4))]\n",
    "x, y = zip(*coord_pairs)\n",
    "\n",
    "def update_source():\n",
    "    g.spawn()\n",
    "    vals = [g.to_numpy()[c] for c in coord_pairs]\n",
    "    tile_colors = [color_dict[v] for v in vals]\n",
    "    text_colors = ['black' if v != 0 else '#D7D7D7' for v in vals]  # make zero values invisible\n",
    "    return dict(x=y, y=x, vals=vals, tile_colors=tile_colors, text_colors=text_colors)\n",
    "\n",
    "# initial state of the data source\n",
    "source = ColumnDataSource(update_source())\n",
    "\n",
    "# draw tiles\n",
    "p.rect(x='x', y='y', source=source, width=1, height=1, line_width=line_width,\n",
    "       line_color=line_color, fill_color='tile_colors')\n",
    "\n",
    "# add text\n",
    "p.text(x='x', y='y', source=source, text='vals', text_align='center', \n",
    "       text_color='text_colors')\n",
    "\n",
    "# this updates the grid object based on the direction of the calling button, then recreates the datasource\n",
    "def on_button_clicked(b):\n",
    "    direction = b.description.lower()\n",
    "    if g.slide(direction):  # if the move generated any change on the grid -> update source\n",
    "        source.data = update_source()\n",
    "        p.title.text = f\"Score: {g.score}\"\n",
    "        push_notebook()\n",
    "        if g.game_over():\n",
    "            print(\"Game Over\")\n",
    "            print(\"Re-run this cell to start again.\")\n",
    "            \n",
    "show(p, notebook_handle=True)\n",
    "\n",
    "# create action buttons\n",
    "btn_up  = Button(description='Up', layout=Layout(width='auto', grid_area='btn_up'))\n",
    "btn_left = Button(description='Left', layout=Layout(width='auto', grid_area='btn_left'))\n",
    "btn_right = Button(description='Right', layout=Layout(width='auto', grid_area='btn_right'))\n",
    "btn_down  = Button(description='Down', layout=Layout(width='auto', grid_area='btn_down'))\n",
    "\n",
    "# link buttons to function\n",
    "for button in [btn_up, btn_right, btn_down, btn_left]:\n",
    "    button.on_click(on_button_clicked)\n",
    "\n",
    "# arrange controls in a grid box\n",
    "gbox = GridBox(children=[btn_up, btn_left, btn_right, btn_down], layout=Layout(\n",
    "            width='25%',\n",
    "            grid_template_rows='auto',\n",
    "            grid_template_columns='auto',\n",
    "            grid_template_areas='''\n",
    "            \". btn_up btn_up .\"\n",
    "            \"btn_left btn_left btn_right btn_right\"\n",
    "            \". btn_down btn_down .\"\n",
    "            '''\n",
    "        ))\n",
    "display(gbox)"
   ]
  }
 ],
 "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.7.1"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 2
}