{
 "metadata": {
  "name": ""
 },
 "nbformat": 3,
 "nbformat_minor": 0,
 "worksheets": [
  {
   "cells": [
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "[Python para Desenvolvedores](http://ricardoduarte.github.io/python-para-desenvolvedores/#conteudo)\n",
      "===================================\n",
      "2ª edi\u00e7\u00e3o, revisada e ampliada\n",
      "-----------------------------------\n",
      "\n",
      "Cap\u00edtulo 31: MVC\n",
      "=============================\n",
      "_____________________________\n",
      "*Model-view-controller* (MVC) \u00e9 uma arquitetura de software que divide a aplica\u00e7\u00e3o em tr\u00eas partes distintas: o modelo de dados da aplica\u00e7\u00e3o, a interface com o usu\u00e1rio e a l\u00f3gica de controle.\n",
      "\n",
      "O objetivo \u00e9 obter um baixo acoplamento entre as tr\u00eas partes de forma que uma altera\u00e7\u00e3o em uma parte tenha pouco (ou nenhum) impacto nas outras partes.\n",
      "\n",
      "![Model View Controller](files/bpypd_diags27.png)\n",
      "\n",
      "A cria\u00e7\u00e3o da aplica\u00e7\u00e3o depende da defini\u00e7\u00e3o de tr\u00eas componentes:\n",
      "\n",
      "+ Modelo (*model*): encapsula os dados da aplica\u00e7\u00e3o e a l\u00f3gica de dom\u00ednio.\n",
      "+ Vis\u00e3o (*view*): recupera dados do modelo e apresenta ao usu\u00e1rio.\n",
      "+ Controlador (*controller*): recebe e reage a poss\u00edveis eventos, como intera\u00e7\u00f5es com o usu\u00e1rio e requisita altera\u00e7\u00f5es no modelo e na vis\u00e3o.\n",
      "\n",
      "Embora a arquitetura n\u00e3o determine formalmente a presen\u00e7a de um componente de persist\u00eancia, fica impl\u00edcito que este faz parte do componente modelo.\n",
      "\n",
      "O uso mais comum para o modelo MVC \u00e9 em aplica\u00e7\u00f5es *Web* baseadas em bancos de dados, que implementam as opera\u00e7\u00f5es b\u00e1sicas chamadas CRUD (*Create, Read, Update and Delete*).\n",
      "\n",
      "Existem v\u00e1rios frameworks para aumentar a produtividade na cria\u00e7\u00e3o de aplicativos seguindo o MVC, com recursos como:\n",
      "\n",
      "+ *Scripts* que automatizam as tarefas mais comuns de desenvolvimento.\n",
      "+ Gera\u00e7\u00e3o autom\u00e1tica de c\u00f3digo.\n",
      "+ Uso de ORM.\n",
      "+ Uso de [CSS](http://www.w3.org/Style/CSS/) (*Cascade Style Sheets*).\n",
      "+ Uso de AJAX (*Asynchronous Javascript And XML*).\n",
      "+ Modelos de aplica\u00e7\u00f5es.\n",
      "+ Uso de introspec\u00e7\u00e3o para obter informa\u00e7\u00f5es sobre as estruturas de dados e gerar formul\u00e1rios com campos com as caracter\u00edsticas correspondentes.\n",
      "+ Diversas op\u00e7\u00f5es pr\u00e9-configuradas com *defaults* adequados para a maioria das aplica\u00e7\u00f5es.\n",
      "\n",
      "Uma das maiores vantagens oferecidas pelo MVC \u00e9 que, ao separar a apresenta\u00e7\u00e3o da l\u00f3gica de aplica\u00e7\u00e3o, se torna mais f\u00e1cil dividir as tarefas de desenvolvimento e de design da interface em uma equipe.\n",
      "\n",
      "Exemplo:"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "\"\"\"\n",
      "Web com opera\u00e7\u00f5es CRUD\n",
      "\"\"\"\n",
      "\n",
      "# CherryPy\n",
      "import cherrypy\n",
      "\n",
      "# CherryTemplate\n",
      "import cherrytemplate\n",
      "\n",
      "# SQLAlchemy\n",
      "import sqlalchemy as sql\n",
      "\n",
      "# Conecta ao bando\n",
      "db = sql.create_engine('sqlite:///zoo.db')\n",
      "\n",
      "# Acesso aos metadados\n",
      "metadata = sql.MetaData(db)\n",
      "\n",
      "try:\n",
      "    # Carrega metadados da tabela\n",
      "    zoo = sql.Table('zoo', metadata, autoload=True)\n",
      "\n",
      "except:\n",
      "    # Define a estrutura da tabela zoo\n",
      "    zoo = sql.Table('zoo', metadata,\n",
      "        sql.Column('id', sql.Integer, primary_key=True),\n",
      "        sql.Column('nome', sql.String(100),\n",
      "            unique=True, nullable=False),\n",
      "        sql.Column('quantidade', sql.Integer, default=1),\n",
      "        sql.Column('obs', sql.String(200), default='')\n",
      "    )\n",
      "\n",
      "    # Cria a tabela\n",
      "    zoo.create()\n",
      "\n",
      "# Os nomes das colunas\n",
      "colunas = [col for col in zoo.columns.keys()]\n",
      "colunas.remove('id')\n",
      "\n",
      "\n",
      "class Root(object):\n",
      "    \"\"\"Raiz do site\"\"\"\n",
      "\n",
      "    @cherrypy.expose\n",
      "    def index(self, **args):\n",
      "        \"\"\"\n",
      "        Lista os registros\n",
      "        \"\"\"\n",
      "\n",
      "        msg = ''\n",
      "        op = args.get('op')\n",
      "        ident = int(args.get('ident', 0))\n",
      "        novo = {}\n",
      "\n",
      "        for coluna in colunas:\n",
      "            novo[coluna] = args.get(coluna)\n",
      "\n",
      "        if op == 'rem':\n",
      "\n",
      "            # Remove dados\n",
      "            rem = zoo.delete(zoo.c.id==ident)\n",
      "            rem.execute()\n",
      "            msg = 'registro removido.'\n",
      "\n",
      "        elif op == 'add':\n",
      "\n",
      "            novo = {}\n",
      "\n",
      "            for coluna in colunas:\n",
      "                novo[coluna] = args[coluna]\n",
      "\n",
      "            try:\n",
      "                # Insere dados\n",
      "                ins = zoo.insert()\n",
      "                ins.execute(novo)\n",
      "                msg = 'registro adicionado.'\n",
      "\n",
      "            except sql.exceptions.IntegrityError:\n",
      "                msg = 'registro existe.'\n",
      "\n",
      "        elif op == 'mod':\n",
      "\n",
      "            novo = {}\n",
      "\n",
      "            for coluna in colunas:\n",
      "                novo[coluna] = args[coluna]\n",
      "\n",
      "            try:\n",
      "                # Modifica dados\n",
      "                mod = zoo.update(zoo.c.id==ident)\n",
      "                mod.execute(novo)\n",
      "                msg = 'registro modificado.'\n",
      "\n",
      "            except sql.exceptions.IntegrityError:\n",
      "                msg = 'registro existe.'\n",
      "\n",
      "        # Seleciona dados\n",
      "        sel = zoo.select(order_by=zoo.c.nome)\n",
      "        rec = sel.execute()\n",
      "\n",
      "        # Gera a p\u00e1gina principal a partir do modelo \"index.html\"\n",
      "        return cherrytemplate.renderTemplate(file='index.html',\n",
      "            outputEncoding='utf-8')\n",
      "\n",
      "    @cherrypy.expose\n",
      "    def add(self):\n",
      "        \"\"\"\n",
      "        Cadastra novos registros\n",
      "        \"\"\"\n",
      "\n",
      "        # Gera a p\u00e1gina de registro novo a partir do modelo \"add.html\"\n",
      "        return cherrytemplate.renderTemplate(file='add.html',\n",
      "            outputEncoding='utf-8')\n",
      "\n",
      "    @cherrypy.expose\n",
      "    def rem(self, ident):\n",
      "        \"\"\"\n",
      "        Confirma a remo\u00e7\u00e3o de registros\n",
      "        \"\"\"\n",
      "\n",
      "        # Seleciona o registro\n",
      "        sel = zoo.select(zoo.c.id==ident)\n",
      "        rec = sel.execute()\n",
      "        res = rec.fetchone()\n",
      "\n",
      "        # Gera a p\u00e1gina de confirmar exclus\u00e3o a partir do modelo \"rem.html\"\n",
      "        return cherrytemplate.renderTemplate(file='rem.html',\n",
      "            outputEncoding='utf-8')\n",
      "\n",
      "    @cherrypy.expose\n",
      "    def mod(self, ident):\n",
      "        \"\"\"\n",
      "        Modifica registros\n",
      "        \"\"\"\n",
      "\n",
      "        # Seleciona o registro\n",
      "        sel = zoo.select(zoo.c.id==ident)\n",
      "        rec = sel.execute()\n",
      "        res = rec.fetchone()\n",
      "\n",
      "        # Gera a p\u00e1gina de altera\u00e7\u00e3o de registro a partir do modelo \"mod.html\"\n",
      "        return cherrytemplate.renderTemplate(file='mod.html',\n",
      "            outputEncoding='utf-8')\n",
      "\n",
      "\n",
      "# Inicia o servidor na porta 8080\n",
      "cherrypy.quickstart(Root())"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Modelo `index.html` (p\u00e1gina principal):"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "<py-include=\"header.html\">\n",
      "<table>\n",
      "<tr>\n",
      "<th></th>\n",
      "<py-for=\"coluna in colunas\">\n",
      "    <th><py-eval=\"coluna\"></th>\n",
      "</py-for>\n",
      "<th></th>\n",
      "<th></th>\n",
      "</tr>\n",
      "<py-for=\"i, campos in enumerate(rec.fetchall())\">\n",
      "    <tr>\n",
      "    <th><py-eval=\"unicode(i + 1)\"></th>\n",
      "    <py-for=\"coluna in colunas\">\n",
      "        <td><py-eval=\"unicode(campos[coluna])\"></td>\n",
      "    </py-for>\n",
      "    <td>\n",
      "    <a href=\"/mod?ident=<py-eval=\"unicode(campos['id'])\">\">modificar</a>\n",
      "    </td><td>\n",
      "    <a href=\"/rem?ident=<py-eval=\"unicode(campos['id'])\">\">remover</a>\n",
      "    </td>\n",
      "    </tr>\n",
      "</py-for>\n",
      "</table>\n",
      "<br />\n",
      "<form action=\"/add\" method=\"post\">\n",
      "    <input type=\"submit\" value=\" adicionar \" />\n",
      "</form>\n",
      "<p>\n",
      "<py-eval=\"msg\">\n",
      "</p>\n",
      "<py-include=\"footer.html\">"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Modelo `add.html` (p\u00e1gina de formul\u00e1rio para novos registros):"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "<py-include=\"header.html\">\n",
      "<form action=\"/?op=add\" method=\"post\">\n",
      "    <table>\n",
      "    <py-for=\"coluna in colunas\">\n",
      "        <tr><td>\n",
      "        <py-eval=\"coluna\">\n",
      "        </td><td>\n",
      "        <input type=\"text\" size=\"30\" name=\"<py-eval=\"coluna\">\" />\n",
      "        </td></tr>\n",
      "    </py-for>\n",
      "    </table>\n",
      "<br />\n",
      "<input type=\"submit\" value=\" salvar \" />\n",
      "</form>\n",
      "<br />\n",
      "[ <a href=\"/\">voltar</a> ]\n",
      "<py-include=\"footer.html\">"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Modelo `mod.html` (p\u00e1gina de formul\u00e1rio para altera\u00e7\u00e3o de registros):"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "<py-include=\"header.html\">\n",
      "<form action=\"/?op=mod&ident=<py-eval=\"unicode(res['id'])\">\" method=\"post\">\n",
      "    <table border=\"0\">\n",
      "    <py-for=\"coluna in colunas\">\n",
      "        <tr><th>\n",
      "        <py-eval=\"coluna\">\n",
      "        </th><td>\n",
      "        <input type=\"text\" size=\"30\" name=\"<py-eval=\"coluna\">\"\n",
      "        value=\"<py-eval=\"unicode(res[coluna])\">\" />\n",
      "        </td></tr>\n",
      "    </py-for>\n",
      "    </table>\n",
      "<br />\n",
      "<input type=\"submit\" value=\" salvar \" />\n",
      "</form>\n",
      "<br />\n",
      "[ <a href=\"/\">voltar</a> ]\n",
      "<py-include=\"footer.html\">"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Modelo `rem.html` (p\u00e1gina que pede confirma\u00e7\u00e3o para remo\u00e7\u00e3o de registros):"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "<py-include=\"header.html\">\n",
      "<table border=\"1\">\n",
      "<tr>\n",
      "<py-for=\"coluna in colunas\">\n",
      "    <th><py-eval=\"coluna\"></th>\n",
      "</py-for>\n",
      "</tr>\n",
      "<tr>\n",
      "<py-for=\"coluna in colunas\">\n",
      "    <td><py-eval=\"unicode(res[coluna])\"></td>\n",
      "</py-for>\n",
      "</tr>\n",
      "</table>\n",
      "<br />\n",
      "<form action=\"/?op=rem&ident=<py-eval=\"unicode(res['id'])\">\" method=\"post\">\n",
      "    <input type=\"submit\" value=\" remover \" />\n",
      "</form>\n",
      "<br />\n",
      "[ <a href=\"/\">voltar</a> ]\n",
      "<py-include=\"footer.html\">"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Modelo `header.html` (cabe\u00e7alho comum a todos os modelos):"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "<html>\n",
      "<head>\n",
      " <meta http-equiv=\"Content-Type\" content=\"text/html;charset=utf-8\" />\n",
      "<title>Zoo</title>\n",
      "<style type=\"text/css\">\n",
      "<!--\n",
      "body {\n",
      "    margin: 10;\n",
      "    padding: 10;\n",
      "    font: 80% Verdana, Lucida, sans-serif;\n",
      "    color: #333366;\n",
      "}\n",
      "h1 {\n",
      "    margin: 0;\n",
      "    padding: 0;\n",
      "    font: 200% Lucida, Verdana, sans-serif;\n",
      "}\n",
      "a {\n",
      "    color: #436976;\n",
      "    text-decoration: none;\n",
      "}\n",
      "a:hover {\n",
      "    background: #c4cded;\n",
      "    text-decoration: underline;\n",
      "}\n",
      "table {\n",
      "    margin: 1em 0em 1em 0em;\n",
      "    border-collapse: collapse;\n",
      "    border-left: 1px solid #858ba1;\n",
      "    border-bottom: 1px solid #858ba1;\n",
      "    font: 90% Verdana, Lucida, sans-serif;\n",
      "}\n",
      "table th {\n",
      "    padding: 0em 1em 0em 1em;\n",
      "    border-top: 1px solid #858ba1;\n",
      "    border-bottom: 1px solid #858ba1;\n",
      "    border-right: 1px solid #858ba1;\n",
      "    background: #c4cded;\n",
      "    font-weight: normal;\n",
      "}\n",
      "table td {\n",
      "    padding: 0em 1em 0em 1em;\n",
      "    border-top: 1px solid #858ba1;\n",
      "    border-right: 1px solid #858ba1;\n",
      "    text-align: center;\n",
      "}\n",
      "form {\n",
      "    margin: 0;\n",
      "    border: none;\n",
      "}\n",
      "input {\n",
      "    border: 1px solid #858ba1;\n",
      "    background-color: #c4cded;\n",
      "    vertical-align: middle;\n",
      "}\n",
      "-->\n",
      "</style>\n",
      "</head>\n",
      "<body>\n",
      "<h1>Zoo</h1>\n",
      "<br />"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Modelo `footer.html` (rodap\u00e9 comum a todos os modelos):"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "</body>\n",
      "</html>"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "P\u00e1gina principal:\n",
      "\n",
      "![P\u00e1gina principal de Zoo](files/zoo_pagina_principal.png)\n",
      "\n",
      "O *framework* MVC mais conhecido \u00e9 o Ruby On Rails, que ajudou a popularizar o MVC entre os desenvolvedores.\n",
      "\n",
      "Especificamente desenvolvidos em Python, existem os *frameworks* [Django](http://www.djangoproject.com/), [TurboGears](http://turbogears.org/) e [web2py](http://www.web2py.com/), entre outros."
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [],
     "language": "python",
     "metadata": {},
     "outputs": [
      {
       "html": [
        "<style>\n",
        "    @font-face {\n",
        "        font-family: \"Computer Modern\";\n",
        "        src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunss.otf');\n",
        "    }\n",
        "    div.cell{\n",
        "        width:800px;\n",
        "        margin-left:16% !important;\n",
        "        margin-right:auto;\n",
        "    }\n",
        "    h1 {\n",
        "        font-family: Helvetica, serif;\n",
        "    }\n",
        "    h4{\n",
        "        margin-top:12px;\n",
        "        margin-bottom: 3px;\n",
        "       }\n",
        "    div.text_cell_render{\n",
        "        font-family: Computer Modern, \"Helvetica Neue\", Arial, Helvetica, Geneva, sans-serif;\n",
        "        line-height: 145%;\n",
        "        font-size: 130%;\n",
        "        width:800px;\n",
        "        margin-left:auto;\n",
        "        margin-right:auto;\n",
        "    }\n",
        "    .CodeMirror{\n",
        "            font-family: \"Source Code Pro\", source-code-pro,Consolas, monospace;\n",
        "    }\n",
        "    .note{\n",
        "            border-bottom: 1px black dotted;\n",
        "    }\n",
        "    .prompt{\n",
        "        display: None;\n",
        "    }\n",
        "    .text_cell_render h5 {\n",
        "        font-weight: 300;\n",
        "        font-size: 16pt;\n",
        "        color: #4057A1;\n",
        "        font-style: italic;\n",
        "        margin-bottom: .5em;\n",
        "        margin-top: 0.5em;\n",
        "        display: block;\n",
        "    }\n",
        "    \n",
        "    .warning{\n",
        "        color: rgb( 240, 20, 20 )\n",
        "        }  \n",
        "</style>\n",
        "<script>\n",
        "    MathJax.Hub.Config({\n",
        "                        TeX: {\n",
        "                           extensions: [\"AMSmath.js\"]\n",
        "                           },\n",
        "                tex2jax: {\n",
        "                    inlineMath: [ ['$','$'], [\"\\\\(\",\"\\\\)\"] ],\n",
        "                    displayMath: [ ['$$','$$'], [\"\\\\[\",\"\\\\]\"] ]\n",
        "                },\n",
        "                displayAlign: 'center', // Change this to 'center' to center equations.\n",
        "                \"HTML-CSS\": {\n",
        "                    styles: {'.MathJax_Display': {\"margin\": 4}}\n",
        "                }\n",
        "        });\n",
        "</script>"
       ],
       "output_type": "pyout",
       "prompt_number": 1,
       "text": [
        "<IPython.core.display.HTML at 0x50f8f98>"
       ]
      }
     ],
     "prompt_number": 1
    }
   ],
   "metadata": {}
  }
 ]
}