old-admin.html
1 {{> head }} 2 <section id="main" class="wrapper style2"> 3 <div id="admin_pane" class="inner"> 4 <header class="major special" style="padding-bottom: 0"> 5 <h1>Admin Page</h1> 6 </header> 7 {{^session}} 8 <form method="post" action="login"> 9 <div class="row gtr-uniform"> 10 <div class="col-6 col-12-xsmall"> 11 <input type="text" name="name" id="name" value="" placeholder="Name" required/> 12 </div> 13 <div class="col-6 col-12-xsmall"> 14 <input type="password" name="password" id="password" value="" placeholder="Password" required /> 15 </div> 16 <input type="text" name="honey" value="" style="display: none !important" tabindex="-1" autocomplete="off"/> 17 <div class="col-12"> 18 <ul class="actions"> 19 <li><input type="submit" value="Log in" /></li> 20 </ul> 21 </div> 22 </div> 23 </form> 24 {{/session}} 25 {{#session}} 26 <h2>Welcome, {{ member.profile.display_name }}</h2> 27 <ul id="admin_buttons" class="actions"> 28 <li><a class="button" href="#calendar">Events</a></li> 29 <li><a class="button" href="#food">Menu</a></li> 30 <li><a class="button" href="#finances">Finances</a></li> 31 </ul> 32 33 <section id="food" class="hidden"> 34 <form id="new_menu_item" method="post" action="{{ path }}menu" enctype="multipart/form-data"> 35 <div class="row gtr-uniform"> 36 <img id="menu_image" src="{{ static }}images/cred.png" /> 37 <div class="col-6 col-12-xsmall"> 38 <label for="img">Upload an image</label><br/> 39 <input type="file" id="img" name="img" accept="images/*" /> 40 </div> 41 <div class="col-4 col-12-xsmall"> 42 <input type="text" name="title" placeholder="Item name" required /> 43 </div> 44 <div class="col-4 col-12-xsmall"> 45 <input type="text" name="price" pattern="[0-9]+" placeholder="How many Credensos is this valued at?" /> 46 </div> 47 <div class="col-4 col-12-xsmall"> 48 <select name="category"> 49 <option value="food">Food</option> 50 <option value="drink">Drink</option> 51 <option value="other">Other</option> 52 </select> 53 </div> 54 <div class="col-12"> 55 <textarea name="content" rows=3 placeholder="Describe what you're offering or requesting" required></textarea> 56 </div> 57 <div class="col-12"> 58 <ul class="actions"> 59 <li><input type="submit" value="Post item" /></li> 60 </ul> 61 </div> 62 </div> 63 </form> 64 </section> 65 <section id="finances" class="hidden"> 66 <h3>Record cashflow</h3> 67 <form id="new_menu_item" method="post" action="{{ path }}finances" enctype="multipart/form-data"> 68 <div class="row gtr-uniform"> 69 <div class="col-4 col-12-xsmall"> 70 <input type="date" name="date" placeholder="Item name" required /> 71 </div> 72 <div class="col-4 col-12-xsmall"> 73 <input type="text" name="amount" pattern="[-0-9]+" placeholder="Donation value" required /> 74 </div> 75 <div class="col-4 col-12-xsmall"> 76 <input type="text" name="link" placeholder="Link to the donator's webpage" /> 77 </div> 78 <div class="col-12"> 79 <input type="text" name="description" placeholder="What is this about?" required /> 80 </div> 81 <div class="col-12"> 82 <ul class="actions"> 83 <li><input type="submit" value="Add record" /></li> 84 </ul> 85 </div> 86 </div> 87 </form> 88 </section> 89 <section id="calendar" class="hidden"> 90 {{>admin/events}} 91 </section> 92 93 {{/session}} 94 </div> 95 </section> 96 <script> 97 const buttons = document.querySelector('#admin_buttons') 98 99 const click = (e) => { 100 e.preventDefault() 101 const id = e.target.hash 102 document.querySelectorAll('#admin_pane section').forEach(section => { 103 section.classList.add('hidden') 104 }) 105 106 buttons.querySelectorAll('a').forEach(link => { 107 link.classList.remove('primary') 108 }) 109 110 document.querySelector(id).classList.remove('hidden') 111 buttons.querySelector(`[href='${id}']`).classList.add('primary') 112 } 113 114 buttons.querySelectorAll('a').forEach(link => { 115 link.addEventListener('click', click) 116 }) 117 118 const previewMenuImage = (e) => { 119 console.log('Previewing image') 120 const file = e.target.files[0] 121 122 if (file !== undefined) { 123 const img = document.getElementById('menu_image') 124 img.src = URL.createObjectURL(file) 125 img.alt = file.name 126 } 127 } 128 129 document.getElementById('img').addEventListener('change', previewMenuImage) 130 131 const menu_form = document.querySelector('#new_menu_item') 132 menu_form.addEventListener('submit', async (e) => { 133 window.location.hash = "" 134 const data = new FormData(nm_form) 135 const response = await fetch('market', { 136 method: "POST", 137 body: data 138 }) 139 140 window.location.reload() 141 }) 142 143 </script> 144 <style> 145 .hidden { 146 display: none; 147 } 148 149 #menu_image { 150 width: 100%; 151 max-width: 30em; 152 } 153 </style> 154 155 {{>foot}}