From 1037f438ce89c48d3858cf917debdcc5986d9523 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ond=C5=99ej=20Hru=C5=A1ka?= <ondra@ondrovo.com>
Date: Sun, 29 Jul 2018 20:19:19 +0200
Subject: [PATCH] rudimentary export options

---
 app/Http/Controllers/TableController.php      |  35 ++++-
 app/Tables/BaseExporter.php                   | 125 ++++++++++++++++++
 app/Tables/CStructArrayExporter.php           | 118 +++++++++++++++++
 app/{Utils => Tables}/Column.php              |   6 +-
 app/Tables/CsvExporter.php                    |  52 ++++++++
 app/Tables/JsonExporter.php                   |  44 ++++++
 public/fonts/fa-dtbl-1-preview.html           | 113 +++++++++-------
 public/fonts/fa-dtbl-1.css                    |  49 +++----
 public/fonts/fa-dtbl-1.eot                    | Bin 9156 -> 9364 bytes
 public/fonts/fa-dtbl-1.svg                    |  56 ++++----
 public/fonts/fa-dtbl-1.ttf                    | Bin 8976 -> 9184 bytes
 public/fonts/fa-dtbl-1.woff2                  | Bin 4540 -> 4656 bytes
 resources/views/table/_panel-export.blade.php |  22 +++
 resources/views/table/view.blade.php          |   4 +-
 routes/web.php                                |   1 +
 15 files changed, 522 insertions(+), 103 deletions(-)
 create mode 100644 app/Tables/BaseExporter.php
 create mode 100644 app/Tables/CStructArrayExporter.php
 rename app/{Utils => Tables}/Column.php (96%)
 create mode 100644 app/Tables/CsvExporter.php
 create mode 100644 app/Tables/JsonExporter.php
 create mode 100644 resources/views/table/_panel-export.blade.php

diff --git a/app/Http/Controllers/TableController.php b/app/Http/Controllers/TableController.php
index 9de980e..535554f 100644
--- a/app/Http/Controllers/TableController.php
+++ b/app/Http/Controllers/TableController.php
@@ -6,10 +6,14 @@ use App\Models\Revision;
 use App\Models\Row;
 use App\Models\Table;
 use App\Models\User;
-use App\Utils\Column;
+use App\Tables\Column;
+use App\Tables\CStructArrayExporter;
+use App\Tables\CsvExporter;
+use App\Tables\JsonExporter;
 use Illuminate\Http\Request;
 use Illuminate\Validation\Rule;
 use MightyPork\Exceptions\NotApplicableException;
+use MightyPork\Utils\Utils;
 
 class TableController extends Controller
 {
@@ -258,4 +262,33 @@ class TableController extends Controller
             }
         }
     }
+
+    public function export(Request $request, User $user, string $table)
+    {
+        /** @var Table $tableModel */
+        $tableModel = $user->tables()->where('name', $table)->first();
+        if ($tableModel === null) abort(404, "No such table.");
+
+        $exporter = null;
+
+        switch ($request->get('format')) {
+            case 'json':
+                $exporter = new JsonExporter($tableModel);
+                break;
+
+            case 'csv':
+                $exporter = new CsvExporter($tableModel);
+                break;
+
+            case 'c':
+                $exporter = new CStructArrayExporter($tableModel);
+                break;
+
+            default:
+                abort(400, "Unspecified or unknown format.");
+        }
+
+        $dl = Utils::parseBool($request->get('dl', false));
+        $exporter->exportToBrowser($dl);
+    }
 }
diff --git a/app/Tables/BaseExporter.php b/app/Tables/BaseExporter.php
new file mode 100644
index 0000000..c5c949c
--- /dev/null
+++ b/app/Tables/BaseExporter.php
@@ -0,0 +1,125 @@
+<?php
+
+
+namespace App\Tables;
+
+
+use App\Models\Table;
+
+/**
+ * Table exporter base class
+ */
+abstract class BaseExporter
+{
+    /**
+     * @var Table the table to export
+     */
+    protected $table;
+
+    /**
+     * @var Column[] - parsed columns for the table
+     */
+    protected $columns;
+
+    /**
+     * @var bool - true if user wants download; can e.g. change mime type to text/plain if not
+     */
+    protected $wantDownload;
+
+    /**
+     * TODO export options from enabled columns, sorts, etc
+     *
+     * @param Table $table
+     */
+    public function __construct(Table $table)
+    {
+        $this->table = $table;
+        $this->columns = Column::columnsFromJson($table->revision->columns);
+    }
+
+    /**
+     * @return string - mime type for the downloaded file
+     */
+    protected abstract function getMimeType();
+
+    /**
+     * @return string - file extension for the downloaded file
+     */
+    protected abstract function getFileExtension();
+
+    /**
+     * @return string - file name without extension, by default the table name
+     */
+    protected function getFileBasename()
+    {
+        return $this->table->name;
+    }
+
+    /**
+     * Generate a response that appears as a file download to the browser
+     *
+     * @param bool $download - force download, otherwise the browser may show it in the window
+     */
+    public function exportToBrowser($download = true)
+    {
+        $this->wantDownload = $download;
+
+        $mimeType = $this->getMimeType();
+        $filename = $this->getFileBasename() . '.' . $this->getFileExtension();
+
+        ob_end_clean();
+
+        // Redirect output to a client’s web browser
+        header("Content-Type: $mimeType; charset=utf-8");
+
+        if ($download) {
+            header("Content-Disposition: attachment;filename=\"$filename\"");
+        }
+
+        // Cache headers
+        header('Cache-Control: max-age=0');
+        // IE9
+        header('Cache-Control: max-age=1');
+        // Other IE headers
+        header('Expires: Mon, 26 Jul 1997 05:00:00 GMT'); // Date in the past
+        header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT'); // always modified
+        header('Cache-Control: cache, must-revalidate'); // HTTP/1.1
+        header('Pragma: no-cache'); // HTTP/1.0
+
+        $this->writeDocument();
+        exit;
+    }
+
+    /**
+     * Generator that produces PHP arrays for all rows, fetched from the DB in given chunks.
+     *
+     * @param int $chunkSize - size of one chunk
+     * @return \Generator|array[]
+     */
+    protected function iterateRows($chunkSize = 1000)
+    {
+        $revision = $this->table->revision;
+
+        $count = $revision->rows()->count();
+
+        $start = 0;
+        while ($start < $count) {
+            $rows = $revision->rows()->offset($start)->limit($chunkSize)->get();
+
+            foreach ($rows as $row) {
+                $data = json_decode($row->data);
+
+                // column renaming, value formatting...
+
+                yield $data;
+            }
+
+            $start += $chunkSize;
+        }
+    }
+
+    /**
+     * Write the document to stdout ('php://output')
+     */
+    protected abstract function writeDocument();
+}
diff --git a/app/Tables/CStructArrayExporter.php b/app/Tables/CStructArrayExporter.php
new file mode 100644
index 0000000..d8055ca
--- /dev/null
+++ b/app/Tables/CStructArrayExporter.php
@@ -0,0 +1,118 @@
+<?php
+
+
+namespace App\Tables;
+
+
+class CStructArrayExporter extends BaseExporter
+{
+    /**
+     * @return string - mime type for the downloaded file
+     */
+    protected function getMimeType()
+    {
+        return  $this->wantDownload ? 'text/x-csrc' : 'text/plain';
+    }
+
+    /**
+     * @return string - file extension for the downloaded file
+     */
+    protected function getFileExtension()
+    {
+        return 'c';
+    }
+
+    private function cify($name)
+    {
+        $name = preg_replace('/[^a-z0-9_]/i', '_', $name);
+        if (ctype_digit($name[0])) {
+            $name = '_' . $name;
+        }
+        return $name;
+    }
+
+    /**
+     * Write the document to stdout ('php://output')
+     */
+    protected function writeDocument()
+    {
+        $fields = array_map(function (Column $c) {
+            $type = $c->type;
+            if ($type == 'string') {
+                $type = 'const char *';
+            }
+
+            $name = $this->cify($c->name);
+
+            return (object)['name' => $c->name, 'type' => $c->type, 'ctype' => $type, 'cname' => $name];
+        }, $this->columns);
+
+        $ctablename = $this->cify($this->table->name);
+
+        // preamble
+        echo "#include <stdbool.h>\n\n";
+
+        echo "struct " . $ctablename . " {\n";
+        foreach ($fields as $field) {
+            echo "    " . $field->ctype . " " . $field->cname . ";\n";
+        }
+        echo "};\n\n";
+
+        // Now the table itself
+        echo "const struct ".$ctablename.' tbl_'.$ctablename."[] = {\n";
+
+        $first = true;
+        foreach ($this->iterateRows() as $row) {
+            if ($first) {
+                $first = false;
+            } else {
+                echo ",\n";
+            }
+
+            echo "    {";
+
+            $firstf = true;
+            foreach ($fields as $field) {
+                if ($firstf) {
+                    $firstf = false;
+                } else {
+                    echo ", ";
+                }
+
+                $val = 0;
+                switch ($field->type) {
+                    case 'string':
+                        $val = "";
+                        break;
+
+                    case 'bool':
+                        $val = false;
+                        break;
+                }
+
+                if (isset($row->{$field->name})) {
+                    $val = $row->{$field->name};
+                }
+
+                // export to C format
+                switch ($field->type) {
+                    case 'string':
+                        echo '"' . addcslashes($val, "\0..\37!@\@\177..\377") . '"';
+                        break;
+
+                    case 'bool':
+                        echo (int)$val;
+                        break;
+
+                    case 'int':
+                    case 'float':
+                        echo $val;
+                        break;
+                }
+            }
+            echo "}";
+        }
+
+        echo "\n};\n";
+    }
+}
diff --git a/app/Utils/Column.php b/app/Tables/Column.php
similarity index 96%
rename from app/Utils/Column.php
rename to app/Tables/Column.php
index 6c172dc..a8c41a0 100644
--- a/app/Utils/Column.php
+++ b/app/Tables/Column.php
@@ -1,7 +1,7 @@
 <?php
 
 
-namespace App\Utils;
+namespace App\Tables;
 
 
 use JsonSerializable;
@@ -27,6 +27,10 @@ class Column implements JsonSerializable
 
     public static function columnsFromJson($columns)
     {
+        if (is_string($columns)) {
+            $columns = json_decode($columns);
+        }
+
         return array_map(function ($x) {
             return new Column($x);
         }, $columns);
diff --git a/app/Tables/CsvExporter.php b/app/Tables/CsvExporter.php
new file mode 100644
index 0000000..fc5ad7a
--- /dev/null
+++ b/app/Tables/CsvExporter.php
@@ -0,0 +1,52 @@
+<?php
+
+
+namespace App\Tables;
+
+
+class CsvExporter extends BaseExporter
+{
+    /**
+     * @return string - mime type for the downloaded file
+     */
+    protected function getMimeType()
+    {
+        return $this->wantDownload ? 'text/csv' : 'text/plain';
+    }
+
+    /**
+     * @return string - file extension for the downloaded file
+     */
+    protected function getFileExtension()
+    {
+        return 'csv';
+    }
+
+    /**
+     * Write the document to stdout ('php://output')
+     */
+    protected function writeDocument()
+    {
+        $handle = fopen('php://output', 'w');
+
+        $columnNames = array_map(function (Column $c) {
+            return $c->title;
+        }, $this->columns);
+
+        fputcsv($handle, $columnNames);
+
+        foreach ($this->iterateRows() as $row) {
+            $items = [];
+            foreach ($this->columns as $column) {
+                if (isset($row->{$column->name})) {
+                    $items[] = $row->{$column->name};
+                } else {
+                    $items[] = null;
+                }
+            }
+            fputcsv($handle, $items);
+        }
+
+        fclose($handle);
+    }
+}
diff --git a/app/Tables/JsonExporter.php b/app/Tables/JsonExporter.php
new file mode 100644
index 0000000..f95bbfe
--- /dev/null
+++ b/app/Tables/JsonExporter.php
@@ -0,0 +1,44 @@
+<?php
+
+
+namespace App\Tables;
+
+
+class JsonExporter extends BaseExporter
+{
+    /**
+     * @return string - mime type for the downloaded file
+     */
+    protected function getMimeType()
+    {
+        return 'application/json';
+    }
+
+    /**
+     * @return string - file extension for the downloaded file
+     */
+    protected function getFileExtension()
+    {
+        return 'json';
+    }
+
+    /**
+     * Write the document to stdout ('php://output')
+     */
+    protected function writeDocument()
+    {
+        echo "[\n";
+
+        $first = true;
+        foreach ($this->iterateRows() as $row) {
+            if ($first) {
+                $first = false;
+            } else {
+                echo ",\n";
+            }
+            echo json_encode($row, JSON_UNESCAPED_UNICODE|JSON_UNESCAPED_SLASHES);
+        }
+
+        echo "\n]\n";
+    }
+}
diff --git a/public/fonts/fa-dtbl-1-preview.html b/public/fonts/fa-dtbl-1-preview.html
index 237ed4b..c171c3a 100644
--- a/public/fonts/fa-dtbl-1-preview.html
+++ b/public/fonts/fa-dtbl-1-preview.html
@@ -165,6 +165,7 @@
 .fa-calendar:before,
 .fa-code-fork:before,
 .fa-comment:before,
+.fa-download:before,
 .fa-eye:before,
 .fa-facebook-square:before,
 .fa-floppy-o:before,
@@ -207,30 +208,31 @@
 .fa-calendar:before { content: "\f101"; }
 .fa-code-fork:before { content: "\f102"; }
 .fa-comment:before { content: "\f103"; }
-.fa-eye:before { content: "\f104"; }
-.fa-facebook-square:before { content: "\f105"; }
-.fa-floppy-o:before { content: "\f106"; }
-.fa-github:before { content: "\f107"; }
-.fa-globe:before { content: "\f108"; }
-.fa-google:before { content: "\f109"; }
-.fa-history:before { content: "\f10a"; }
-.fa-home:before { content: "\f10b"; }
-.fa-inbox:before { content: "\f10c"; }
-.fa-key-modern:before { content: "\f10d"; }
-.fa-link:before { content: "\f10e"; }
-.fa-pencil:before { content: "\f10f"; }
-.fa-question-circle:before { content: "\f110"; }
-.fa-sign-in:before { content: "\f111"; }
-.fa-sign-out:before { content: "\f112"; }
-.fa-star:before { content: "\f113"; }
-.fa-star-o:before { content: "\f114"; }
-.fa-table:before { content: "\f115"; }
-.fa-th-list:before { content: "\f116"; }
-.fa-user:before { content: "\f117"; }
-.fa-user-circle-o:before { content: "\f118"; }
-.fa-user-plus:before { content: "\f119"; }
-.fa-users:before { content: "\f11a"; }
-.fa-wrench:before { content: "\f11b"; }
+.fa-download:before { content: "\f104"; }
+.fa-eye:before { content: "\f105"; }
+.fa-facebook-square:before { content: "\f106"; }
+.fa-floppy-o:before { content: "\f107"; }
+.fa-github:before { content: "\f108"; }
+.fa-globe:before { content: "\f109"; }
+.fa-google:before { content: "\f10a"; }
+.fa-history:before { content: "\f10b"; }
+.fa-home:before { content: "\f10c"; }
+.fa-inbox:before { content: "\f10d"; }
+.fa-key-modern:before { content: "\f10e"; }
+.fa-link:before { content: "\f10f"; }
+.fa-pencil:before { content: "\f110"; }
+.fa-question-circle:before { content: "\f111"; }
+.fa-sign-in:before { content: "\f112"; }
+.fa-sign-out:before { content: "\f113"; }
+.fa-star:before { content: "\f114"; }
+.fa-star-o:before { content: "\f115"; }
+.fa-table:before { content: "\f116"; }
+.fa-th-list:before { content: "\f117"; }
+.fa-user:before { content: "\f118"; }
+.fa-user-circle-o:before { content: "\f119"; }
+.fa-user-plus:before { content: "\f11a"; }
+.fa-users:before { content: "\f11b"; }
+.fa-wrench:before { content: "\f11c"; }
     </style>
 
     <!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
@@ -246,7 +248,7 @@
   <body class="characters-off">
     <div id="page" class="container">
       <header>
-        <h1>fa-dtbl-1 contains 28 glyphs:</h1>
+        <h1>fa-dtbl-1 contains 29 glyphs:</h1>
         <a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a>
       </header>
 
@@ -304,6 +306,19 @@
         </div>
       </div>
       
+      <div class="glyph">
+        <div class="preview-glyphs">
+          <span class="step size-12"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span>
+        </div>
+        <div class="preview-scale">
+          <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
+        </div>
+        <div class="usage">
+          <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-download" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf104;" />
+        </div>
+      </div>
+      
       <div class="glyph">
         <div class="preview-glyphs">
           <span class="step size-12"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span>
@@ -313,7 +328,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-eye" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf104;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf105;" />
         </div>
       </div>
       
@@ -326,7 +341,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-facebook-square" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf105;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf106;" />
         </div>
       </div>
       
@@ -340,7 +355,7 @@
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-floppy-o" />
        <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-save" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf106;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf107;" />
         </div>
       </div>
       
@@ -353,7 +368,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-github" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf107;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf108;" />
         </div>
       </div>
       
@@ -366,7 +381,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-globe" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf108;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf109;" />
         </div>
       </div>
       
@@ -379,7 +394,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-google" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf109;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10a;" />
         </div>
       </div>
       
@@ -392,7 +407,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-history" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10a;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10b;" />
         </div>
       </div>
       
@@ -405,7 +420,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-home" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10b;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10c;" />
         </div>
       </div>
       
@@ -418,7 +433,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-inbox" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10c;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10d;" />
         </div>
       </div>
       
@@ -431,7 +446,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-key-modern" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10d;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10e;" />
         </div>
       </div>
       
@@ -444,7 +459,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-link" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10e;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10f;" />
         </div>
       </div>
       
@@ -457,7 +472,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-pencil" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10f;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf110;" />
         </div>
       </div>
       
@@ -470,7 +485,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-question-circle" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf110;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf111;" />
         </div>
       </div>
       
@@ -483,7 +498,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sign-in" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf111;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf112;" />
         </div>
       </div>
       
@@ -496,7 +511,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sign-out" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf112;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf113;" />
         </div>
       </div>
       
@@ -509,7 +524,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-star" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf113;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf114;" />
         </div>
       </div>
       
@@ -522,7 +537,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-star-o" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf114;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf115;" />
         </div>
       </div>
       
@@ -535,7 +550,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-table" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf115;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf116;" />
         </div>
       </div>
       
@@ -548,7 +563,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-th-list" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf116;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf117;" />
         </div>
       </div>
       
@@ -561,7 +576,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf117;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf118;" />
         </div>
       </div>
       
@@ -574,7 +589,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user-circle-o" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf118;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf119;" />
         </div>
       </div>
       
@@ -587,7 +602,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user-plus" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf119;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11a;" />
         </div>
       </div>
       
@@ -600,7 +615,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-users" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11a;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11b;" />
         </div>
       </div>
       
@@ -613,7 +628,7 @@
         </div>
         <div class="usage">
           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-wrench" />
-          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11b;" />
+          <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11c;" />
         </div>
       </div>
       
diff --git a/public/fonts/fa-dtbl-1.css b/public/fonts/fa-dtbl-1.css
index f9433b7..134b96f 100644
--- a/public/fonts/fa-dtbl-1.css
+++ b/public/fonts/fa-dtbl-1.css
@@ -42,27 +42,28 @@
 .fa-calendar::before { content: "\f101"; }
 .fa-code-fork::before { content: "\f102"; }
 .fa-comment::before { content: "\f103"; }
-.fa-eye::before { content: "\f104"; }
-.fa-facebook-square::before { content: "\f105"; }
-.fa-floppy-o::before, .fa-save::before { content: "\f106"; }
-.fa-github::before { content: "\f107"; }
-.fa-globe::before { content: "\f108"; }
-.fa-google::before { content: "\f109"; }
-.fa-history::before { content: "\f10a"; }
-.fa-home::before { content: "\f10b"; }
-.fa-inbox::before { content: "\f10c"; }
-.fa-key-modern::before { content: "\f10d"; }
-.fa-link::before { content: "\f10e"; }
-.fa-pencil::before { content: "\f10f"; }
-.fa-question-circle::before { content: "\f110"; }
-.fa-sign-in::before { content: "\f111"; }
-.fa-sign-out::before { content: "\f112"; }
-.fa-star::before { content: "\f113"; }
-.fa-star-o::before { content: "\f114"; }
-.fa-table::before { content: "\f115"; }
-.fa-th-list::before { content: "\f116"; }
-.fa-user::before { content: "\f117"; }
-.fa-user-circle-o::before { content: "\f118"; }
-.fa-user-plus::before { content: "\f119"; }
-.fa-users::before { content: "\f11a"; }
-.fa-wrench::before { content: "\f11b"; }
+.fa-download::before { content: "\f104"; }
+.fa-eye::before { content: "\f105"; }
+.fa-facebook-square::before { content: "\f106"; }
+.fa-floppy-o::before, .fa-save::before { content: "\f107"; }
+.fa-github::before { content: "\f108"; }
+.fa-globe::before { content: "\f109"; }
+.fa-google::before { content: "\f10a"; }
+.fa-history::before { content: "\f10b"; }
+.fa-home::before { content: "\f10c"; }
+.fa-inbox::before { content: "\f10d"; }
+.fa-key-modern::before { content: "\f10e"; }
+.fa-link::before { content: "\f10f"; }
+.fa-pencil::before { content: "\f110"; }
+.fa-question-circle::before { content: "\f111"; }
+.fa-sign-in::before { content: "\f112"; }
+.fa-sign-out::before { content: "\f113"; }
+.fa-star::before { content: "\f114"; }
+.fa-star-o::before { content: "\f115"; }
+.fa-table::before { content: "\f116"; }
+.fa-th-list::before { content: "\f117"; }
+.fa-user::before { content: "\f118"; }
+.fa-user-circle-o::before { content: "\f119"; }
+.fa-user-plus::before { content: "\f11a"; }
+.fa-users::before { content: "\f11b"; }
+.fa-wrench::before { content: "\f11c"; }
diff --git a/public/fonts/fa-dtbl-1.eot b/public/fonts/fa-dtbl-1.eot
index 39d233d6e3618a95874f7767cac96fa0af82f212..30831906aafe49935c8aa70ebcbe124b42646a3a 100644
GIT binary patch
delta 638
zcmYLFPiRtc9RL2F&)<9MYJ2Le9&YnJ-P1`FGv{P8_6~z+mx7=TI<%K=6Q)yC)`CEx
zD2br#*&zrP9d;<#AuEC;gzOr2>LMf^Vgwz#ba?iC(g?m^etiCYzdye1bM^DqdH|qT
zv(B>KUA<XT@02&+0r=Yh;Jt9^bY!)&xeq{A5U(b)TK@aUXdi${Ah(p<F8N@d%>h`d
zsIwbdG2icl1@leB{6^-+`trA%pHS}rh%4zeE#+}FUZK{-j-`<}TH|~;%Z)gY&X#sQ
zlwU#+3H$`y&g7EX`sb_@2i!-znALXjP#}w_#}WIswCviG;zKLIcnJ5;=X1r<fvWWY
z<P>_AfuIY!sqcEP4kvztgF^z~>#a9e4&VMS!{C9MP97Kly-k9X(jX}j7Yv&|lSjt%
zsBp?8fTh#=2(v)E`b8$e(29PKc|g1k(K17(Us%8rvpi!9)&m-#kLXV>#1(kTFY&K!
zPFvo#ZwGtVam`V8{201C)ID;tQDGmmW!9WaD-?jkwUclbPZCvR>h?qqUzgyfeo0nl
zglO!Hbj%Z3AX3CbJRG5NkSMcA4wQ&zRFEQ8P@;+wCD>Sd@z5VN6px3<m%DRM=c=R=
ziW~2R2}5<poQ67~3PPBGA`%c40^vO~^RI}{XbqB>ug0+$VQS1!T`tlZn+lSas3@YL
nHrzJt1d;S@S!Kw${#Fj#_*CxtRwk#V^q%}tf9^kS|9|+u#<Y?)

delta 429
zcmbQ@dBmOdh%y6%z(iJamYb{p{-5a3R?qW}fkEjD0|SGMf3Ut$!iDTr3=E7BKz>4U
zZeqbBe$oF73``b4F|XvZ5(NfpmV5>V<`$qlOL}5)!T<jZ%s~BbfP9YhoXWIAQ&!&q
z%Aa9ikerc`nwTOc9P$DvcL#{gGJpbn6WQf~W{Cj#DjB&Y6+7y+8PtISJAeWWIr+(n
zX^#>^fCh8``A)fs6$K21j4nWVpaU2b@)C1XXBJOjWnhp^0ord}kY8N#$mRPf1_s3i
zKs7!Lj6hXD{QvLjoALZMUm3XBfdUK+*PC0v!RY^Q|NY}&U<0Y-U|?ckn0$m$T~z_B
zQ-M*Kfghv}Bn}h-sc~S?0|_v&u<1<}V6tbFo*ckrGkF42FQfEkIc8Hv!v##&m>pPz
zSUXscuo<y+v7KNSVqeDoiX(($6Q=;DALjzD8g3?T6Ye(dZ#*?Tz;M~z!ZMX*^G(hK
bNk)aqR>}^OYm~JnuU9@ixmZP<3*k-x&Yx~o

diff --git a/public/fonts/fa-dtbl-1.svg b/public/fonts/fa-dtbl-1.svg
index dbd2c25..d2153ea 100644
--- a/public/fonts/fa-dtbl-1.svg
+++ b/public/fonts/fa-dtbl-1.svg
@@ -5,7 +5,7 @@
 -->
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
 <metadata>
-Created by FontForge 20170805 at Sun Jul 29 16:55:50 2018
+Created by FontForge 20170805 at Sun Jul 29 20:18:03 2018
  By ondra
 The Fork Awesome font is licensed under the SIL OFL 1.1 (http://scripts.sil.org/OFL). Fork Awesome is a fork based of off Font Awesome 4.7.0 by Dave Gandy. More info on licenses at https://forkawesome.github.io
 </metadata>
@@ -22,7 +22,7 @@ The Fork Awesome font is licensed under the SIL OFL 1.1 (http://scripts.sil.org/
     bbox="-0.14014 -256.168 2048 1536.01"
     underline-thickness="89.6"
     underline-position="-179.2"
-    unicode-range="U+0020-F11B"
+    unicode-range="U+0020-F11C"
   />
     <missing-glyph />
     <glyph glyph-name="space" unicode=" " horiz-adv-x="200" 
@@ -43,91 +43,95 @@ c-3 -361 -259 -441 -429 -495c-159 -50 -211 -74 -211 -171v-26c57 -33 96 -95 96 -1
 c51 25 105 42 154 57c186 59 292 103 294 312c-57 33 -96 95 -96 166c0 106 86 192 192 192s192 -86 192 -192z" />
     <glyph glyph-name="comment" unicode="&#xf103;" horiz-adv-x="1792" 
 d="M1792 640c0 -354 -401 -640 -896 -640c-49 0 -98 3 -145 8c-131 -116 -287 -198 -460 -242c-36 -10 -75 -17 -114 -22c-22 -2 -43 14 -48 38v1c-5 25 12 40 27 58c63 71 135 131 182 298c-206 117 -338 298 -338 501c0 353 401 640 896 640s896 -286 896 -640z" />
-    <glyph glyph-name="eye" unicode="&#xf104;" horiz-adv-x="1792" 
+    <glyph glyph-name="download" unicode="&#xf104;" horiz-adv-x="1664" 
+d="M1280 192c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1536 192c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1664 416v-320c0 -53 -43 -96 -96 -96h-1472c-53 0 -96 43 -96 96v320c0 53 43 96 96 96h465l135 -136
+c37 -36 85 -56 136 -56s99 20 136 56l136 136h464c53 0 96 -43 96 -96zM1339 985c10 -24 5 -52 -14 -70l-448 -448c-12 -13 -29 -19 -45 -19s-33 6 -45 19l-448 448c-19 18 -24 46 -14 70c10 23 33 39 59 39h256v448c0 35 29 64 64 64h256c35 0 64 -29 64 -64v-448h256
+c26 0 49 -16 59 -39z" />
+    <glyph glyph-name="eye" unicode="&#xf105;" horiz-adv-x="1792" 
 d="M1664 576c-95 147 -225 273 -381 353c40 -68 61 -146 61 -225c0 -247 -201 -448 -448 -448s-448 201 -448 448c0 79 21 157 61 225c-156 -80 -286 -206 -381 -353c171 -264 447 -448 768 -448s597 184 768 448zM944 960c0 26 -22 48 -48 48c-167 0 -304 -137 -304 -304
 c0 -26 22 -48 48 -48s48 22 48 48c0 114 94 208 208 208c26 0 48 22 48 48zM1792 576c0 -25 -8 -48 -20 -69c-184 -303 -521 -507 -876 -507s-692 205 -876 507c-12 21 -20 44 -20 69s8 48 20 69c184 302 521 507 876 507s692 -205 876 -507c12 -21 20 -44 20 -69z" />
-    <glyph glyph-name="facebook-square" unicode="&#xf105;" 
+    <glyph glyph-name="facebook-square" unicode="&#xf106;" 
 d="M1248 1408c159 0 288 -129 288 -288v-960c0 -159 -129 -288 -288 -288h-188v595h199l30 232h-229v148c0 67 18 112 115 112l122 1v207c-21 3 -94 9 -178 9c-177 0 -299 -108 -299 -306v-171h-200v-232h200v-595h-532c-159 0 -288 129 -288 288v960c0 159 129 288 288 288
 h960z" />
-    <glyph glyph-name="floppy-o" unicode="&#xf106;" 
+    <glyph glyph-name="floppy-o" unicode="&#xf107;" 
 d="M384 0h768v384h-768v-384zM1280 0h128v896c0 19 -17 60 -30 73l-281 281c-14 14 -53 30 -73 30v-416c0 -53 -43 -96 -96 -96h-576c-53 0 -96 43 -96 96v416h-128v-1280h128v416c0 53 43 96 96 96h832c53 0 96 -43 96 -96v-416zM896 928v320c0 17 -15 32 -32 32h-192
 c-17 0 -32 -15 -32 -32v-320c0 -17 15 -32 32 -32h192c17 0 32 15 32 32zM1536 896v-928c0 -53 -43 -96 -96 -96h-1344c-53 0 -96 43 -96 96v1344c0 53 43 96 96 96h928c53 0 126 -30 164 -68l280 -280c38 -38 68 -111 68 -164z" />
-    <glyph glyph-name="github" unicode="&#xf107;" 
+    <glyph glyph-name="github" unicode="&#xf108;" 
 d="M768 1408c424 0 768 -344 768 -768c0 -339 -220 -627 -525 -729c-39 -7 -53 17 -53 37c0 25 1 108 1 211c0 72 -24 118 -52 142c171 19 351 84 351 379c0 84 -30 152 -79 206c8 20 34 98 -8 204c-64 20 -211 -79 -211 -79c-61 17 -127 26 -192 26s-131 -9 -192 -26
 c0 0 -147 99 -211 79c-42 -106 -16 -184 -8 -204c-49 -54 -79 -122 -79 -206c0 -294 179 -360 350 -379c-22 -20 -42 -54 -49 -103c-44 -20 -156 -54 -223 64c-42 73 -118 79 -118 79c-75 1 -5 -47 -5 -47c50 -23 85 -112 85 -112c45 -137 259 -91 259 -91
 c0 -64 1 -124 1 -143c0 -20 -14 -44 -53 -37c-305 102 -525 390 -525 729c0 424 344 768 768 768zM291 305c-2 -4 -8 -5 -13 -2c-6 3 -9 8 -7 12c2 3 7 4 13 2c6 -3 9 -8 7 -12zM322 271c-4 -4 -11 -2 -16 3c-5 6 -6 13 -2 16c4 4 11 2 16 -3c5 -6 6 -13 2 -16zM352 226
 c-4 -3 -12 0 -17 7s-5 15 0 18c5 4 13 1 17 -6c5 -7 5 -15 0 -19zM394 184c-4 -5 -13 -4 -20 3c-7 6 -9 15 -4 19c4 5 13 4 20 -3c6 -6 8 -15 4 -19zM451 159c-2 -6 -11 -9 -19 -6c-9 2 -15 9 -13 15s11 9 19 7c9 -3 15 -10 13 -16zM514 154c0 -6 -7 -11 -16 -11
 c-10 -1 -17 4 -17 11c0 6 7 11 16 11c9 1 17 -4 17 -11zM572 164c1 -6 -5 -12 -14 -14s-17 2 -18 8c-1 7 5 13 14 15c9 1 17 -3 18 -9z" />
-    <glyph glyph-name="globe" unicode="&#xf108;" 
+    <glyph glyph-name="globe" unicode="&#xf109;" 
 d="M768 1404c424 0 768 -344 768 -768s-344 -768 -768 -768s-768 344 -768 768s344 768 768 768zM737 1186v0c-18 0 -40 -7 -58 -7c-27 0 -61 12 -81 0s-18 -37 -27 -55s-28 -34 -28 -54s19 -36 28 -54s2 -47 27 -54s54 36 81 54s69 32 81 54s0 36 0 54s16 39 0 55
 c-5 5 -14 7 -23 7zM491 1178h-6s-44 -8 -76 -13c-136 -92 -261 -300 -278 -464c23 -12 46 -22 60 -36c27 -27 83 -27 88 -56s-24 -62 -33 -80s-31 -31 -27 -54s36 -36 54 -54s37 -22 54 -54s20 -98 27 -135c9 -47 23 -85 44 -118c27 -19 72 -44 102 -58c10 28 10 93 16 122
 c7 37 13 109 27 135s19 19 28 28s18 15 28 28s17 34 26 52s30 31 26 53s-36 37 -54 55s-29 39 -55 54s-73 18 -101 25s-127 12 -129 13c-2 0 -1 -6 -7 2s-2 39 -2 57s11 34 24 66c13 18 5 10 25 24c10 9 43 -44 57 -44s-3 91 6 100c36 36 128 98 128 136s-37 36 -55 54
 s-46 -30 -111 -30s76 103 85 112s23 17 27 27s0 18 0 27s12 22 8 25c-2 1 -4 1 -6 1zM1212 1096c-62 -8 -139 -10 -182 -26c-45 -17 -54 -36 -81 -54s-67 -28 -81 -54s0 -54 0 -81s-26 -68 0 -82s55 37 82 55s63 64 81 54s6 -7 0 -27s-51 -41 -52 -81s102 -73 68 -126
 s-188 46 -232 17s-19 -54 -28 -81s-37 -52 -27 -81s52 -34 81 -54s81 -56 82 -58s20 -99 27 -135c14 -73 -27 -199 76 -231c31 14 78 41 106 60c13 34 24 72 35 94c22 44 71 123 80 161s0 37 0 55s7 30 0 54s-36 54 -54 81s-34 64 -54 81s-46 18 -54 27s-4 8 -4 13
 s-4 7 5 14s34 8 54 0s36 -36 54 -54s25 -51 54 -54s54 36 81 54c25 17 52 56 76 55c-12 131 -98 312 -193 404z" />
-    <glyph glyph-name="google" unicode="&#xf109;" horiz-adv-x="1505" 
+    <glyph glyph-name="google" unicode="&#xf10a;" horiz-adv-x="1505" 
 d="M768 750h725c7 -39 12 -77 12 -128c0 -438 -294 -750 -737 -750c-425 0 -768 343 -768 768s343 768 768 768c207 0 381 -76 515 -201l-209 -201c-57 55 -157 119 -306 119c-262 0 -476 -217 -476 -485s214 -485 476 -485c304 0 418 218 436 331h-436v264z" />
-    <glyph glyph-name="history" unicode="&#xf10a;" 
+    <glyph glyph-name="history" unicode="&#xf10b;" 
 d="M1536 640c0 -423 -345 -768 -768 -768c-229 0 -445 101 -591 277c-10 13 -9 32 2 43l137 138c7 6 16 9 25 9c9 -1 18 -5 23 -12c98 -127 245 -199 404 -199c282 0 512 230 512 512s-230 512 -512 512c-131 0 -255 -50 -348 -137l137 -138c19 -18 24 -46 14 -69
 c-10 -24 -33 -40 -59 -40h-448c-35 0 -64 29 -64 64v448c0 26 16 49 40 59c23 10 51 5 69 -14l130 -129c141 133 332 212 529 212c423 0 768 -345 768 -768zM896 928v-448c0 -18 -14 -32 -32 -32h-320c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h224v352c0 18 14 32 32 32h64
 c18 0 32 -14 32 -32z" />
-    <glyph glyph-name="home" unicode="&#xf10b;" horiz-adv-x="1612" 
+    <glyph glyph-name="home" unicode="&#xf10c;" horiz-adv-x="1612" 
 d="M1382 544v-480c0 -35 -29 -64 -64 -64h-384v384h-256v-384h-384c-35 0 -64 29 -64 64v480c0 2 1 4 1 6l575 474l575 -474c1 -2 1 -4 1 -6zM1605 613l-62 -74c-5 -6 -13 -10 -21 -11h-3c-8 0 -15 2 -21 7l-692 577l-692 -577c-7 -5 -15 -8 -24 -7c-8 1 -16 5 -21 11
 l-62 74c-11 13 -9 34 4 45l719 599c42 35 110 35 152 0l244 -204v195c0 18 14 32 32 32h192c18 0 32 -14 32 -32v-408l219 -182c13 -11 15 -32 4 -45z" />
-    <glyph glyph-name="inbox" unicode="&#xf10c;" 
+    <glyph glyph-name="inbox" unicode="&#xf10d;" 
 d="M1023 576h316c-2 5 -3 11 -5 16l-212 496h-708l-212 -496c-2 -5 -3 -11 -5 -16h316l95 -192h320zM1536 546v-482c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v482c0 36 11 89 25 123l238 552c14 33 54 59 89 59h832c35 0 75 -26 89 -59l238 -552
 c14 -34 25 -87 25 -123z" />
-    <glyph glyph-name="key-modern" unicode="&#xf10d;" horiz-adv-x="1792" 
+    <glyph glyph-name="key-modern" unicode="&#xf10e;" horiz-adv-x="1792" 
 d="M546 1536v0c139 1 278 -52 383 -158c142 -141 187 -343 137 -525l726 -726v-319c0 -35 -29 -64 -64 -64h-300l-45 45l135 226l-46 45l-225 -135l-45 46l134 225l-45 45l-225 -134l-46 45l135 225l-45 46l-243 -139l-186 186c-182 -50 -382 -5 -524 136
 c-211 212 -209 556 4 770c107 106 246 159 385 160zM405 1290v0c-41 0 -82 -16 -113 -47c-63 -63 -63 -163 0 -226s164 -63 227 0s63 163 0 226c-31 31 -73 47 -114 47z" />
-    <glyph glyph-name="link" unicode="&#xf10e;" horiz-adv-x="1632" 
+    <glyph glyph-name="link" unicode="&#xf10f;" horiz-adv-x="1632" 
 d="M1440 320c0 26 -10 50 -28 68l-208 208c-18 18 -43 28 -68 28c-29 0 -52 -11 -72 -32c33 -33 72 -61 72 -112c0 -53 -43 -96 -96 -96c-51 0 -79 39 -112 72c-21 -20 -33 -43 -33 -73c0 -25 10 -50 28 -68l206 -207c18 -18 43 -27 68 -27s50 9 68 26l147 146
 c18 18 28 42 28 67zM737 1025c0 25 -10 50 -28 68l-206 207c-18 18 -43 28 -68 28s-50 -10 -68 -27l-147 -146c-18 -18 -28 -42 -28 -67c0 -26 10 -50 28 -68l208 -208c18 -18 43 -27 68 -27c29 0 52 10 72 31c-33 33 -72 61 -72 112c0 53 43 96 96 96c51 0 79 -39 112 -72
 c21 20 33 43 33 73zM1632 320c0 -76 -31 -150 -85 -203l-147 -146c-54 -54 -127 -83 -203 -83c-77 0 -150 30 -204 85l-206 207c-54 54 -83 127 -83 203c0 79 32 154 88 209l-88 88c-55 -56 -129 -88 -208 -88c-76 0 -150 30 -204 84l-208 208c-55 55 -84 127 -84 204
 c0 76 31 150 85 203l147 146c54 54 127 83 203 83c77 0 150 -30 204 -85l206 -207c54 -54 83 -127 83 -203c0 -79 -32 -154 -88 -209l88 -88c55 56 129 88 208 88c76 0 150 -30 204 -84l208 -208c55 -55 84 -127 84 -204z" />
-    <glyph glyph-name="pencil" unicode="&#xf10f;" horiz-adv-x="1515" 
+    <glyph glyph-name="pencil" unicode="&#xf110;" horiz-adv-x="1515" 
 d="M363 0l91 91l-235 235l-91 -91v-107h128v-128h107zM886 928c0 13 -9 22 -22 22c-6 0 -12 -2 -17 -7l-542 -542c-5 -5 -7 -11 -7 -17c0 -13 9 -22 22 -22c6 0 12 2 17 7l542 542c5 5 7 11 7 17zM832 1120l416 -416l-832 -832h-416v416zM1515 1024c0 -34 -14 -67 -37 -90
 l-166 -166l-416 416l166 165c23 24 56 38 90 38s67 -14 91 -38l235 -234c23 -24 37 -57 37 -91z" />
-    <glyph glyph-name="question-circle" unicode="&#xf110;" 
+    <glyph glyph-name="question-circle" unicode="&#xf111;" 
 d="M896 160v192c0 18 -14 32 -32 32h-192c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h192c18 0 32 14 32 32zM1152 832c0 183 -192 320 -364 320c-163 0 -285 -70 -371 -213c-9 -14 -5 -32 8 -42l132 -100c5 -4 12 -6 19 -6c9 0 19 4 25 12c47 60 67 78 86 92
 c17 12 50 24 86 24c64 0 123 -41 123 -85c0 -52 -27 -78 -88 -106c-71 -32 -168 -115 -168 -212v-36c0 -18 14 -32 32 -32h192c18 0 32 14 32 32c0 23 29 72 76 99c76 43 180 101 180 253zM1536 640c0 -424 -344 -768 -768 -768s-768 344 -768 768s344 768 768 768
 s768 -344 768 -768z" />
-    <glyph glyph-name="sign-in" unicode="&#xf111;" 
+    <glyph glyph-name="sign-in" unicode="&#xf112;" 
 d="M1184 640c0 -17 -7 -33 -19 -45l-544 -544c-12 -12 -28 -19 -45 -19c-35 0 -64 29 -64 64v288h-448c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h448v288c0 35 29 64 64 64c17 0 33 -7 45 -19l544 -544c12 -12 19 -28 19 -45zM1536 992v-704c0 -159 -129 -288 -288 -288
 h-320c-17 0 -32 15 -32 32c0 28 -13 96 32 96h320c88 0 160 72 160 160v704c0 88 -72 160 -160 160h-288c-25 0 -64 -5 -64 32c0 28 -13 96 32 96h320c159 0 288 -129 288 -288z" />
-    <glyph glyph-name="sign-out" unicode="&#xf112;" horiz-adv-x="1568" 
+    <glyph glyph-name="sign-out" unicode="&#xf113;" horiz-adv-x="1568" 
 d="M640 96c0 -28 13 -96 -32 -96h-320c-159 0 -288 129 -288 288v704c0 159 129 288 288 288h320c17 0 32 -15 32 -32c0 -28 13 -96 -32 -96h-320c-88 0 -160 -72 -160 -160v-704c0 -88 72 -160 160 -160h288c25 0 64 5 64 -32zM1568 640c0 -17 -7 -33 -19 -45l-544 -544
 c-12 -12 -28 -19 -45 -19c-35 0 -64 29 -64 64v288h-448c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h448v288c0 35 29 64 64 64c17 0 33 -7 45 -19l544 -544c12 -12 19 -28 19 -45z" />
-    <glyph glyph-name="star" unicode="&#xf113;" horiz-adv-x="1664" 
+    <glyph glyph-name="star" unicode="&#xf114;" horiz-adv-x="1664" 
 d="M1664 889c0 -18 -13 -35 -26 -48l-363 -354l86 -500c1 -7 1 -13 1 -20c0 -26 -12 -50 -41 -50c-14 0 -28 5 -40 12l-449 236l-449 -236c-13 -7 -26 -12 -40 -12c-29 0 -42 24 -42 50c0 7 1 13 2 20l86 500l-364 354c-12 13 -25 30 -25 48c0 30 31 42 56 46l502 73
 l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" />
-    <glyph glyph-name="star-o" unicode="&#xf114;" horiz-adv-x="1664" 
+    <glyph glyph-name="star-o" unicode="&#xf115;" horiz-adv-x="1664" 
 d="M1137 532l306 297l-422 62l-189 382l-189 -382l-422 -62l306 -297l-73 -421l378 199l377 -199zM1664 889c0 -18 -13 -35 -26 -48l-363 -354l86 -500c1 -7 1 -13 1 -20c0 -27 -12 -50 -41 -50c-14 0 -28 5 -40 12l-449 236l-449 -236c-13 -7 -26 -12 -40 -12
 c-29 0 -42 24 -42 50c0 7 1 13 2 20l86 500l-364 354c-12 13 -25 30 -25 48c0 30 31 42 56 46l502 73l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" />
-    <glyph glyph-name="table" unicode="&#xf115;" horiz-adv-x="1664" 
+    <glyph glyph-name="table" unicode="&#xf116;" horiz-adv-x="1664" 
 d="M512 160v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM512 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 160v192c0 18 -14 32 -32 32h-320
 c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM512 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192
 c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1536 160v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32z
 M1536 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1536 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1664 1248v-1088c0 -88 -72 -160 -160 -160
 h-1344c-88 0 -160 72 -160 160v1088c0 88 72 160 160 160h1344c88 0 160 -72 160 -160z" />
-    <glyph glyph-name="th-list" unicode="&#xf116;" horiz-adv-x="1792" 
+    <glyph glyph-name="th-list" unicode="&#xf117;" horiz-adv-x="1792" 
 d="M512 288v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM512 800v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM1792 288v-192c0 -53 -43 -96 -96 -96h-960
 c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h960c53 0 96 -43 96 -96zM512 1312v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM1792 800v-192c0 -53 -43 -96 -96 -96h-960c-53 0 -96 43 -96 96v192c0 53 43 96 96 96
 h960c53 0 96 -43 96 -96zM1792 1312v-192c0 -53 -43 -96 -96 -96h-960c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h960c53 0 96 -43 96 -96z" />
-    <glyph glyph-name="user" unicode="&#xf117;" horiz-adv-x="1280" 
+    <glyph glyph-name="user" unicode="&#xf118;" horiz-adv-x="1280" 
 d="M1280 137c0 -146 -96 -265 -213 -265h-854c-117 0 -213 119 -213 265c0 263 65 567 327 567c81 -79 191 -128 313 -128s232 49 313 128c262 0 327 -304 327 -567zM1024 1024c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384z" />
-    <glyph glyph-name="user-circle-o" unicode="&#xf118;" horiz-adv-x="1792" 
+    <glyph glyph-name="user-circle-o" unicode="&#xf119;" horiz-adv-x="1792" 
 d="M896 1536c495 0 896 -401 896 -896c0 -492 -399 -896 -896 -896c-496 0 -896 403 -896 896c0 495 401 896 896 896zM1515 185c93 128 149 285 149 455c0 423 -345 768 -768 768s-768 -345 -768 -768c0 -170 56 -327 149 -455c36 179 123 327 306 327
 c81 -79 191 -128 313 -128s232 49 313 128c183 0 270 -148 306 -327zM1280 832c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384z" />
-    <glyph glyph-name="user-plus" unicode="&#xf119;" horiz-adv-x="2048" 
+    <glyph glyph-name="user-plus" unicode="&#xf11a;" horiz-adv-x="2048" 
 d="M704 640c-212 0 -384 172 -384 384s172 384 384 384s384 -172 384 -384s-172 -384 -384 -384zM1664 512h352c17 0 32 -15 32 -32v-192c0 -17 -15 -32 -32 -32h-352v-352c0 -17 -15 -32 -32 -32h-192c-17 0 -32 15 -32 32v352h-352c-17 0 -32 15 -32 32v192
 c0 17 15 32 32 32h352v352c0 17 15 32 32 32h192c17 0 32 -15 32 -32v-352zM928 288c0 -70 58 -128 128 -128h256v-238c-49 -36 -111 -50 -171 -50h-874c-160 0 -267 96 -267 259c0 226 53 573 346 573c16 0 27 -7 39 -17c98 -75 193 -122 319 -122s221 47 319 122
 c12 10 23 17 39 17c85 0 160 -32 217 -96h-223c-70 0 -128 -58 -128 -128v-192z" />
-    <glyph glyph-name="users" unicode="&#xf11a;" horiz-adv-x="1920" 
+    <glyph glyph-name="users" unicode="&#xf11b;" horiz-adv-x="1920" 
 d="M593 640c-104 -3 -198 -48 -265 -128h-134c-100 0 -194 48 -194 159c0 81 -3 353 124 353c21 0 125 -85 260 -85c46 0 90 8 133 23c-3 -22 -5 -44 -5 -66c0 -91 29 -181 81 -256zM1664 3c0 -162 -107 -259 -267 -259h-874c-160 0 -267 97 -267 259c0 226 53 573 346 573
 c34 0 158 -139 358 -139s324 139 358 139c293 0 346 -347 346 -573zM640 1280c0 -141 -115 -256 -256 -256s-256 115 -256 256s115 256 256 256s256 -115 256 -256zM1344 896c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384zM1920 671
 c0 -111 -94 -159 -194 -159h-134c-67 80 -161 125 -265 128c52 75 81 165 81 256c0 22 -2 44 -5 66c43 -15 87 -23 133 -23c135 0 239 85 260 85c127 0 124 -272 124 -353zM1792 1280c0 -141 -115 -256 -256 -256s-256 115 -256 256s115 256 256 256s256 -115 256 -256z" />
-    <glyph glyph-name="wrench" unicode="&#xf11b;" horiz-adv-x="1641" 
+    <glyph glyph-name="wrench" unicode="&#xf11c;" horiz-adv-x="1641" 
 d="M363 64c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1007 484l-682 -682c-23 -23 -56 -37 -90 -37s-67 14 -91 37l-106 108c-24 23 -38 56 -38 90s14 67 38 91l681 681c52 -131 157 -236 288 -288zM1641 919c0 -33 -12 -74 -23 -106
 c-63 -178 -234 -301 -423 -301c-247 0 -448 201 -448 448s201 448 448 448c73 0 168 -22 229 -63c10 -7 16 -16 16 -28c0 -11 -7 -22 -16 -28l-293 -169v-224l193 -107c33 19 265 165 285 165s32 -15 32 -35z" />
   </font>
diff --git a/public/fonts/fa-dtbl-1.ttf b/public/fonts/fa-dtbl-1.ttf
index e30cf85594c0d0e06bc932d125e2d7e5c139f5da..24830b531e66aa14f105ac91c097220181020f5d 100644
GIT binary patch
delta 599
zcmXv~UuaTs6h7yw_g-~tU3FHXoA<h|cQS~XbFx{x55r&(1w|Ve<jp@5rc+dEL7>ne
zAA;6yJp_Y#+C#w}G9hS$^ye+YUg||?^bn(m-g@alJF^DoaQMFOeCPbmZzHyMt_lbM
zgHQtlT#UsopI>jRyaMpOC)R!8(y3sgy|M#<ON0~2yjJ{vbhrn=M2TBS-l%wC)>r^A
z)JZokYvp3EN0Y#}OPF8I-O4O}yZwRmHh^m>o7PfJd*cOZ9m;Svo33g{9&lb7<{)A$
zo3E_Bc@BQU^axnb6_Q%!Q{F}c?h&5PYimU);XLUP!roOapMG54FaeAxw12i(C|CAX
zZ4W?7QO{!kI681wf8xG26#WfWj%)y5?=<88D$|T_;xs4rJ4O90dT>&|igW1Jw=l}E
zHT?_TM|UH`OyT4+0~o@Fr^b?LpB-a2*`J)km3Wq4;9r_;=AwDW0+x>Ty7i&;$H0|=
z&frAjqv4UUYCKrQ)>r@zhTtTep-V%u#5$b8!)g~CtWT8WDIpX-Ego|Q=THnf(a9kz
z`B9!GvabZ4!-5zzfgF<M5K>ZXN0dLR5{W4I`R>ftOdZ=wr2ASJ?W(r0t*efzf)GHE
zT?j52A+UYm`5)-*w)#%;*CP~+Fz)H9c00B_<9=+pWZBhK8wp-JfujCaR2dx687W}q
YQ-zzWxq_C`C!}}!FX_1D@I#yNzmiFeFaQ7m

delta 390
zcmaFhKEbV?fsuiMftR6yftew|%`L>YWi!t^1_q@sKv5b0V11*63)!m}7#Jgf{DkD(
z#DYisqW>8fm@I%|Udd%83JlgP`3wxqEkJpe^u*$V|Nns|F(|zO@;TCTD$@>4S$zX2
ze};iUaz;jKVv3k>$P1v{9UwN#$VjbE<eSJY4>U{!D4>#&TT-z@n?W7O-vQ(|<m4wO
zraejw0UFQ&<U8diRunK4GP(fefev6$$V<#komo7Am4QJv1!%u@L4I+`BbV=|7#I{6
z0M+<_JqPsQ|G%qm#`D{JW#DE9YGYuy-rV{PLNm2~o5X0&t^ii4Fxie#mQinV45K}x
z^yE2=Hk0o#_A*Lu&SElUG+e-RjoE=kh_!?D2%8aG7uyMTA@*hLuQ)<DHgO7Y`f)Dc
zs^MnhHsNmL{>D?o1N86a3(QklHmh<bNHQu+Zc}oYd_qZU@^7WXllLo&bHVIy{RRL&
CKWKRX

diff --git a/public/fonts/fa-dtbl-1.woff2 b/public/fonts/fa-dtbl-1.woff2
index 65eea528bfd006d2c1bb120fc81121c906b30181..49d56af72df677834974ee71e58021512fe9ce91 100644
GIT binary patch
literal 4656
zcmV-063^{-Pew8T0RR9101_|&4FCWD03+Z401?>$0RR9100000000000000000000
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

literal 4540
zcmV;t5ku~GPew8T0RR9101><Z4FCWD03#3p01;#W0RR9100000000000000000000
z0000#Mn+Uk90p(jf=UPk5eN#i7^qweLI43a0we>000bZfh&u;@OdGBoBN4Wfw4#Zq
znEVC)>VP-wGP(v|Fc!fZ!RFX77&2wo_r$-7HX?(@hCV`LpXB~P+x&OI5q&lo3=3Hk
z)2}$sitjKm3NU(+zzWP&t7}<AvHiIp?J`+Zf_ShwAr(yyi2u1g=NQ&vNn)rrn_xYE
zl?~?9r20^*hk-)^!vHDu$7+Al#<oLu959RkBr8qFZMWBbF_Uxo$U;T_ASr<w0LrAm
zX|GL5`U&BO0NZ4|Yv|3tpDSHwvjxNyj6Gp1OpSbbdw(zQ|I004a+E!4x0nJ@iYN@Q
zP)RZ6-7OFb2`FTz&eogi5OIU|+ow7q38`mzwi6F}Xc?5wMHih3X!}sMgJ^pK08$GV
zwjp%?OD%05E{+oekoiCZz-QwR0N@LKW~>AXky8LD&@ce~5dpxBXsZ(|!4}DDF##@M
z9|$tdG!hbthGF5mcLYcf$h9L5vW^7c9F0b<rC=WzuDg5<J5(bC2m&cJMN5qE`7Z-{
zMByW$5^=d|ps_@ve2v7ICs<E+3GX@p&~iHPYZ+@Euwd{S3JFshV-ix%0zyt0wqQ6e
zVhBpNAOVgXXeuMqs!(!h3C8^e?mB_!^{*p10hW<LY7ciQ&r`~jN<-*88b{EV;~f^}
z9mtXjfP*JP=+0mS1(Fh^k}VgWh|T0O%DGHV0dC-^2aSo$0<gQKyk!I1w5_@=&4j4i
zT$g1TVEeWoB!rMexF-vs>^zxUNr+mg4>kc-6+T=I(wj5YKeFb;ec>4TT_m=c&{d^*
zbYFD@EoGXHLD}z5P)LXn^+6M0%%Y5sovBZZ%%mY%Q4EPmOn|7I67zSGv-GrmhBfG>
ze_2hNzgE-uGX)3PB0x<jTa7nw-bz9cu$-ppn0ZXfUHc?dcsHtc8Bv1|+pm?vJD``X
zuw2sFebK&E^4_@adjhf(vny6?2%u~JHAqaZi7N{_|NcTmIS{ZYf49#5^Azt|c+FTz
zo|V@Zb?X)rVBiSdh)o2^K9qq65&ap6f_o3Td8b9~t@O%Z_BX9fjq$dkCi^t%LC-=3
zWw1id;oj^Fxaz3q<eTi%(pfahS3EvC5RG}I9q7_ZAtVx#Zw|=<I4?sQ75>_5G1a`I
z@k3nafQazN+s)5)J&m6UPd@SpbzC=@EbqDf_McA(@#v$r0Q^VdYmjtgoRpW&Cf%oL
z<9R1MY43~FuW`6i49AacRDuLoKXyxn5oRWb*4pLySL<yZlj(Z8k(P2fr}eP&dDo#F
z?W%5ziljighc^r*ob?G_(~cxv5#ii&>1zF4J_y`$kpKDjq<DJE=UG{lzZSC~QY>bV
zLKu2Zm5m!y-ob+?;iPb;P=v%0PiFz(F+sq{FDotg5i^|G(qTl+Nk9!-6ng>Q<PzWi
zP|5d8oBf>qv;C8uwQJuMC0*BX5{~Z!L9pVsTpY)VQZ9dT+>#Woo)==z%g4Sw)O7P$
z_bc(>oyC+Ft}Lt!p}H|tsLn>R>FUdF5JZo16jkTIaXh!D0J>S8SL1qHhwQ`)bS*}d
z^Hw1+lVyr~n;TW*R`VNPF>PkCn^YSlj?FKq>A_RWQ8V2M74qh`$MsG*Moen5{Q(=m
zajXne)k@#?3Z=Qpqkt@&Io&liCxK{c&MYV8rIMLAH)4<L<J#IzH*cxl)Ev;GpJT33
zb#-bS(GufoUL0CHg?qCTw+~)pNui5&ZFV9J@0jm=;9D~IRU@u<m{O<Q7EF@ZB2O40
zqK~=3Y36~`^wO2k3sakc$MpcSC(US%RZ{ci<b_#)<Q%2)PHS@8e>9Efw1yEwVj3K*
zuqi#Jt_$!H`cYMXo{t7_EP`lamIGjxo|`pB&udmJ`z>vZxeK$m^&J)*MokhON~$)i
z<sR4FO@@4P+uSnI_SX(`E64@*y%}vgw@P;Q=s7wUTxoc0mR~i+^{el~Dwvu*K6~s9
zHg61fQYaR)SY;C4NMaRAi;7pGnp{k^^SPXJQEVcqwhO>O4mts)McG}Z)KqI`jOy=B
z+*8m;Mhq*VboKPWG3Z7<9XW6nd%FMd1J>9P1Nsdc-EZV@hh;qRk#*Cw*{9kmvZ6-Y
zw%DvppQ04Ify)aY+kYSjo`sN{+uRvN=Fc?k<?FpJEjD(_u3I)=xD+U51S}SqOkB(V
z#plOuazSHW5$!;YU!FgFFO-px)Z?r3FY_9pcQ}>R9RhDdv`%kWp20~?04u&s8KzCu
zD0o_X6_7k$!|d@enKUE9^>rfiat)non}oB$ahX2>8QaM(7=t-y%f9wsrqIVku_52R
z?h%-2b*m@YNp{lh_6|04)^<eSF?K@o?pz^e+8XDGUTeFKnRwl`6T^U>b<HVwGpvWd
zyfNw}`<W9c?9a7VI<J77?A{X|Bj3Je{MgvBF84%k-O9#cNYn2}PzQJ9Xlv{1=yB3+
ziYMgZQC~#x6Zm%TZCn`G$sVqh+X(QBT*6>5NEu*1kAW*?;JrO@rKNF=0OX>)30AA5
zSoHyvgwn^{z&gcH6r?@?he5=89O#2^5QSAeS%8Eq<x-u|=>b@dNtvTP1eDDM95*_d
zH3Mj%N>5i60Ldg#n;|2dB33u>ieVfCcxg?r5^FugB@QN^a_iKqlm&+n|65bzgWKiS
z(Cp|$(IIt=N;`67cjH<EJC*G7Ul&&R8z}Geprs9h%>9;O6gHsbWyta^?~>B!f9#;e
zaVa{oelQX^3|mDW6V{Ag#k47Y$s1P`?4xxw&w2K8YkK8@cgwdxElPDhy*Ex%V>wI^
zV+i7~MN@NcT<6o)|L4Cs-`vt7WDfT!d-hCmcaWU&ES5a?AtweTC}!Qi?9RLFG3%b<
z1^^j2%n6w^n`zS~Q_tb%kLLX4_wfGWh=&OlIQ3}k^fjv&ZvFew-#PA95wJb!2*kGB
zd4raEdoO*<@0OWl)ICGD4QODKR9anBw_tSCN~-l-fGY+xr&lP`hdR8x9HDxUzPGJ0
z^!6Igd<~laFk@XOiNV6%sA((mGN`FcS+mZRnHN;lZ`7f>(3<=bpFi7}FT+OnJ0!vY
zh8B}f))X_$3>!YJwhCrk>gPC0UORB3QsMEb^jKwO;l_@RKW-*-;vlCY1S)Z|bKS#?
zp!r|V^crY6P2p{eLxL7AK9sj~W~Hucrg6MaYy0F`V0QdFt-BwAsQcLXyYG&(1qk;z
z$wHrx;cs4p^!?-vt7{s-;QhaxWHTp_DzQ&<LGir><br#}kxe?gKs?sIh>Yh{yWODC
ziQT*N&Qv9=;d3VXEZvgoJJ5GqHW`dHDTR9-dg0f3Q$(D^m%l92)AdRQwfbOJi*9q*
zBwI)ETbok2&k-V=5^<nu&wC{TLQ)ur_~XRT;?4+CEhGhfaumuc3ujPN`1DjwkF?Kq
z-9=8aINVm<3DWke8dT!T!HXgW|DPq)(Km&J+uOuO`$4gmJm5RY?k<kCkF5wK3q3r$
ztU~Us&p{{bv3R0)BKMJIWp$=(;7m*Rs19won@_6<Ndih1nH(?kNiJy&P5Eau8BNH%
z667NL?gY`aO;ZAuOaw!N`uIh+2vZ##;R5>)@$+Uj!#L_0xSn5N$3<V+pQ}B7b*0$c
z+iMm_CL~a=mHjUMefsZ-6Am_AZL;2EBxC_i`3nY?CMOn4vU2x<0rQQpSl^mu#WwZ)
z#+EvUY5I&V{_DDwvU4@2+N0VTGqgufCnQiyZTa4$#8}H8eNNEjJtCc`M?T7Mv&mLp
zNsd^wLTu^nrFHhqVsWQ|$wFSa#JMGFvw;n^I1vmPdZjudH>v1U^9hVQVJ~%<2X~z?
zOKuiX=gGX!1)tyk_uD_fh@M?n_jigQ<_)Dm!_adte{U{GUqn-OoYLFxeCY)M$nnn5
z+0R3}VnviFw(HJoHb_ID4*t?+{9Id;<QLL@;X;ft_kRDk-@fi_?`?Db?`*r??(BUt
z^YG#J5OLB0#Ut4(&AYaC^~#*LaiyiLmuR~`K`25fnd8(chfID;`eSQYEnjAm@!J<3
zc`4<|WscsHTf$_A7cOx8@=(yzAq)MNhkC(qv+|p}CHzgmtK965B|F<}$<BQ%I5R0<
zm*32Z=A4{;(3joB0u4n)PoBgj8f>=Eif&I&R<)mBHH-FC|Fe3v3ZuHa%l0_c3G3G@
zCtkl!Jw&a0@;C`1pu08~#m~jHqF}_5^;!9Et>+&aTPmtJf?29~x|eEDnzB#Gl=n|-
z$HfPEe6HIz^tJo^7v8B>&9G$Lc_0m4rjiB(NL4zKq^F&+Yp4={ir5&%yoR&X%y<Bv
z`ix7hQ1eR=cLK@jh-4@g?@nOV3)ao#y?2qQBJo_H7PELRtvBl45?qfAcenJOr!`zm
z(zFNRr#m+oXL<yi-={eLlxbuDh?5zTN%z6B_0dPCJn#TpFlC+PPxGI?V_AW=Q4w}Z
zx>ompM%&GmZO%3Qyn6}8Gg}FM%bs@3`g08$xd7Ki`Fd~#^sFh2w!18gX;E%byp3AS
z&hE0z0kkmVp1iyuuK;)q*9kiMcO^BBOUP)pHa0bbfB+&4rW0T%hB}?d3;Jz<#`HNa
zU(QKCuzz+sPN&ZuAx-w;)tt1(IcwUa^M@Dz|7FG0#Umykpy3r?<nq|0SAlnawdrQO
zoz!n^lFAr^Vewp6CUz_4*UT-xh#y>2Z&@(Iq9!Wc#|2cV%M#-%L!;dWWokM!dm6y0
z2D!E7>Tfwb0<G1KS5Iuu9;wYVPA1aAO!BDsSkDB%St;ln^MaX{dJC{I2b-N0D<7t6
zlTUAhK*OwP8AdP$3)sLq9Ys@|U$O-4q&D6z#h+1-#>|o0?Dp!3c3eAdmR~}wXMB`N
zo)$(-w$}NLgZf~V4&LYHyPG#Bs8yA94LL*9x=ouxj2#`<W`%mj4QP9^Vb0H-!Xl?i
zj(w4S3EJfBsgGM!G%<<E#{hWkUSObR4;_c+irob5I&F!eF!HZ{8W_?9@{J2bXCMIh
ztG@hRw^`5Eyl1fK@Xzs-uIE2~Fo3WISdIdCDH=?|V86hDDwHk`vJ!L_L`6qHb>eTk
z4nWu>T%+Tnhy?96Uz_1_5r>THIboPJeTrC;G_&DB@vxYjL8C5S2e}$7LEL~ZP$^yq
zQ!oIang=`bUU?STz{?0Q(K#{-1iD_vAQ=55<G{oeG7SV+84)vTanHYq?u^jsJ_osL
z7mM7p$S?QZ<xd{iwZA+BT0^6B9NGEca{yOD&qYi>RjX8-BGF22M~YD}futCd^&+YO
zB3q@BOSY72EN1rItq0us+0{S+BGBGLtPaeWIK5!)r9dObJ0b<e7&%3%=V3PX`T)|&
z)CsIO_*^xCRf4X$CC#-pGKytoh}H#fgWA`)3s}`o*9`kAT0Q<p=3h|H=);zd5z~hL
zf_>MDE2wsLtOK&#6O5!@A_|=6OLacZ0as}rfz#Rn!<eg95X&zDtSs-h58(N#PY{p*
z_6VK*RD5|6#4t?pY~}!2T{PQx?$!o2^Fkxn*PgO5GSU$5DQ$Cu28Cb$IT)@S#YA<O
zrhN*48OYfI4VPjo`6Dl2eo0V}b~-K$vN1%=NRTIAXfqN+x_BGAgRx_CL3k0+#E9*|
z1kAFwjv|A!4vhGTq3iSwdN}tU63>(g+ye*IFrY?a*GU)3zvey8S{8l5dl0CMy0p$3
zo-sTxAik^<Fv@_-0snztXK)+d`>QC)imK^`Y1xkJ`3RBRxbxu2i#H!4V!r$?_u~*k
zR>5?F{P>jfaTqOa%ql1Loz_`X?otRDtrIs+v#i})I*O$>%xx_0j8LvNMu~g?64S$g
zhS|&_XG1Yz<pbEcz$kO56~t@WsKHOr^D(Scp+`*0HEGEPG?tGFpok%ktQj*O0!}{Q
anS6P$_rWBlHOM{1kdRI}s&j{0J^%m}NSM+9

diff --git a/resources/views/table/_panel-export.blade.php b/resources/views/table/_panel-export.blade.php
new file mode 100644
index 0000000..4048146
--- /dev/null
+++ b/resources/views/table/_panel-export.blade.php
@@ -0,0 +1,22 @@
+<b>Export presets:</b>
+
+<ul class="mt-2">
+  @foreach([
+    'json' => 'JSON array of objects',
+    'csv' => 'CSV table',
+    'c' => 'C structs array',
+  ] as $type => $title)
+
+  <li><a href="{{ route('table.export', [
+    'user' => $table->owner->name,
+    'table' => $table->name,
+    'format' => $type
+  ]) }}">{{ $title }}</a> – <a href="{{ route('table.export', [
+    'user' => $table->owner->name,
+    'table' => $table->name,
+    'format' => $type,
+    'dl' => 1
+  ]) }}">@icon(fa-download px-1, Download)</a>
+
+    @endforeach
+</ul>
diff --git a/resources/views/table/view.blade.php b/resources/views/table/view.blade.php
index 5f517f0..ec2ae45 100644
--- a/resources/views/table/view.blade.php
+++ b/resources/views/table/view.blade.php
@@ -35,14 +35,14 @@
     </div>
 
     <div class="tab-pane container" id="infobox-export" role="tabpanel" aria-labelledby="infobox-export-tab">
-      Export … coming soon
+      @include('table._panel-export')
     </div>
 
   </div>{{-- End of tab panels wrapper --}}
 
   {{-- Right column with menu --}}
   <div class="col-md-2 border-left order-md-2 order-0 mb-md-0 mb-2">
-    <div class="nav flex-md-column flex-row nav-pills pt-1" role="tablist"
+    <div class="nav flex-md-column flex-row nav-pills pt-1 pb-1" role="tablist"
          aria-label="Tabs for the table info box" id="infobox-tab">
 
       <a class="nav-link active" data-toggle="pill" role="tab" aria-selected="true"
diff --git a/routes/web.php b/routes/web.php
index f834649..e4b7471 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -62,3 +62,4 @@ Route::group(['middleware' => 'auth'], function () {
 // Table resource - located at the end to work as a fallback
 Route::get('@{user}', 'ProfileController@view')->name('profile.view');
 Route::get('@{user}/{table}', 'TableController@view')->name('table.view');
+Route::get('@{user}/{table}/export', 'TableController@export')->name('table.export');