all repos — artbound-python @ fef95b2561b4374a13a10ba4179a4af1f37e1752

A client-server reimplementation of the administration panel for ArtBound.

artbound_python/templates/index.html (view raw)

  1<!doctype html>
  2<html lang="it">
  3
  4<head>
  5    <meta charset="utf-8">
  6    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7    <meta name="description" content="Un modo semplice e veloce per gestire le fanart di ArtBound.">
  8    <meta name="author" content="BiRabittoh">
  9    <link rel="icon"
 10        href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>✏️</text></svg>">
 11    <title>ArtBound Panel</title>
 12    <link href="/static/ext/css/bootstrap.min.css" rel="stylesheet">
 13    <link href="/static/style.css" rel="stylesheet">
 14</head>
 15
 16<body>
 17    <a id="canvas-download" hidden></a>
 18    <main role="main">
 19        <section class="jumbotron text-center">
 20            <div class="container">
 21                <h1 class="jumbotron-heading">
 22                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
 23                        stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
 24                        class="feather feather-activity">
 25                        <polygon points="14 2 18 6 7 17 3 17 3 13 14 2"></polygon>
 26                        <line x1="3" y1="22" x2="21" y2="22"></line>
 27                    </svg>
 28                    ArtBound Panel</a>
 29                </h1>
 30                    <svg fill="white" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
 31                         width="15" height="15" viewBox="0 0 420.827 420.827"
 32                         xml:space="preserve">
 33                    <g><g><path d="M210.29,0C156,0,104.43,20.693,65.077,58.269C25.859,95.715,2.794,146.022,0.134,199.921
 34                                c-0.135,2.734,0.857,5.404,2.744,7.388c1.889,1.983,4.507,3.105,7.244,3.105h45.211c5.275,0,9.644-4.098,9.979-9.362
 35                                c4.871-76.214,68.553-135.914,144.979-135.914c80.105,0,145.275,65.171,145.275,145.276c0,80.105-65.17,145.276-145.275,145.276
 36                                c-18.109,0-35.772-3.287-52.501-9.771l17.366-15.425c2.686-2.354,3.912-5.964,3.217-9.468c-0.696-3.506-3.209-6.371-6.592-7.521
 37                                l-113-32.552c-3.387-1.149-7.122-0.407-9.81,1.948c-2.686,2.354-3.913,5.963-3.218,9.467L69.71,403.157
 38                                c0.696,3.505,3.209,6.372,6.591,7.521c3.383,1.147,7.122,0.408,9.81-1.946l18.599-16.298
 39                                c31.946,18.574,68.456,28.394,105.581,28.394c116.021,0,210.414-94.392,210.414-210.414C420.705,94.391,326.312,0,210.29,0z"/>
 40                            <path d="M195.112,237.9h118.5c2.757,0,5-2.242,5-5v-30c0-2.757-2.243-5-5-5h-83.5v-91c0-2.757-2.243-5-5-5h-30
 41                                c-2.757,0-5,2.243-5,5v126C190.112,235.658,192.355,237.9,195.112,237.9z"/></g></g></svg>
 42                    <a id="last-updated-link" href="#" class="lead" onclick="updateDb();"><?xml version="1.0" encoding="iso-8859-1"?>
 43                    {{ last_updated }}</a>
 44                <div id="month_div">
 45                    <label for="month_input" style="margin-right: 10px;">Scegli il mese: </label>
 46                    <input id="month_input" type="month" value="{{ current_month }}">
 47                    <a href="#" class="btn my-2 btn-go" onclick="handleAuthClick();" id="authorize_button" hidden>Vai</a>
 48                    <button class="btn btn-secondary my-2" onclick="getArtworks();" id="get_button">Ottieni</button>
 49                </div>
 50                <div id="controls" hidden>
 51                    <a href="#" class="btn btn-secondary my-2" onclick="selectAllNone(1);" id="selectall_button">✅</a>
 52                    <a href="#" class="btn btn-secondary my-2" onclick="selectAllNone(0);" id="selectnone_button">❎</a>
 53                    <input type="range" class="form-range" id="opacity_range" min="0" max="1" step="0.01" oninput="updateOpacity();" value="0.4">
 54                    <label for="opacity_range" class="form-label" id="opacity_label"></label>
 55                    <a href="#" class="btn btn-secondary my-2" onclick="saveAll();" id="saveall_button">💾</a>
 56                    <a href="#" class="btn btn-secondary my-2" onclick="saveAllIG();" id="saveallig_button">📷</a>
 57                </div>
 58            </div>
 59        </section>
 60        <div class="album py-5" id="main_container" hidden>
 61            <div class="container">
 62                <div class="row" id="content"></div>
 63                <div class="row">
 64                    <div class="col-md-12">
 65                        <a href="#" id="copy_button" onclick="navigator.clipboard.writeText(filename_h1.innerText);"
 66                            hidden>
 67                            <h1 id="filename" style="display: inline;"></h1>
 68                            <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em"
 69                                preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24">
 70                                <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
 71                                    stroke-width="2">
 72                                    <rect width="13" height="13" x="9" y="9" rx="2" ry="2" />
 73                                    <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
 74                                </g>
 75                            </svg>
 76                        </a>
 77                    </div>
 78                    <div id="canvas" class="col-md-12" hidden>
 79                        <canvas width="1080" height="1920" id="instagram-canvas"></canvas>
 80                    </div>
 81                </div>
 82            </div>
 83        </div>
 84    </main>
 85    <footer>
 86        <div class="container">
 87            <p>&copy; Earthbound Café, realizzato da <a href="mailto:andronacomarco@gmail.com">Marco Andronaco</a> (BiRabittoh).</p>
 88        </div>
 89    </footer>
 90    <template id="fanart-template">
 91        <div class="col-md-4 entry{| disabled |}" id="{| id |}" data-index="{| index |}">
 92            <div class="card mb-4 box-shadow my-card">
 93                <canvas class="card-img-top entry-img"
 94                    id="{| id |}" data-name="{| name |}"
 95                    data-content="{| content |}"
 96                    data-filename="{| filename |}"></canvas>
 97                <div class="card-body">
 98                    <a class="card-text" title="Clicca per copiare." onclick="navigator.clipboard.writeText(this.innerText);">{| filename |}</a>
 99                    <div class="d-flex justify-content-between align-items-center card-controls">
100                        <div class="btn-group">
101                            <button class="btn btn-sm btn-outline-secondary" onclick="moveUpDown('{| id |}', -1);">⬅️</button>
102                            <button class="btn btn-sm btn-outline-secondary" onclick="toggleEntry('{| id |}');">♻️</button>
103                            <button class="btn btn-sm btn-outline-secondary" onclick="toggleInvert('{| id |}', this);">⚪</button>
104                            <button class="btn btn-sm btn-outline-secondary" onclick="saveEntry('{| id |}');">💾</button>
105                            <button class="btn btn-sm btn-outline-secondary" onclick="saveEntryIG('{| id |}');">📷</button>
106                            <button class="btn btn-sm btn-outline-secondary" onclick="moveUpDown('{| id |}', 1);">➡️</button>
107                        </div>
108                    </div>
109                </div>
110            </div>
111        </div>
112    </template>
113    <script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.0/mustache.min.js"></script>
114    <script src="/static/ext/js/jquery-3.2.1.slim.min.js"></script>
115    <script src="/static/ext/js/bootstrap.min.js"></script>
116    <script src="/static/script.js"></script>
117</body>
118
119</html>