<!DOCTYPE html>
<html>
<head>
<meta name="generator" content="HTML Tidy for HTML5 for Linux version 5.6.0">
<meta charset="UTF-8">
<link rel="stylesheet" href="../theme/materialize.min.css">
<link rel="stylesheet" href="../theme/custom.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title id="header-title">__MAIN_TITLE__</title>
<link rel="icon" type="image/svg" href="../img/v-cercle.svg">
<script>
// URL drawn horizontally or vertically, or not be drawn.
const URL_ORIENTATION = "__URL_ORIENTATION__";
const IMAGE_PLACEHOLDER = "./logo_g.png"
</script>
</head>
<body>
<header>
<nav>
<!-- language dropdown -->
<ul id="language_dropdown" class="dropdown-content">
__LANGUAGE_DROPDOWN_MENU__
</ul>
<div class="nav-wrapper cyan darken-2">
<a id="title-center" href="#" class="brand-logo center hide-on-med-and-down" style="display: block;">
<img width="60" height="60" style="vertical-align:middle;" src="../img/v-cercle.svg"/>
<span style="vertical-align:middle; display:inline;">__MAIN_TITLE__</span>
</a>
<div class="brand-logo left">
<a href="#" data-target="nav-mobile" class="sidenav-trigger valign-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-menu-2" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="white" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<line x1="4" y1="6" x2="20" y2="6" />
<line x1="4" y1="12" x2="20" y2="12" />
<line x1="4" y1="18" x2="20" y2="18" />
</svg>
<p> __MAIN_TITLE__</p>
</a>
</div>
<!-- menu -->
<ul class="right hide-on-med-and-down">
<li class="active">
<a href="index.html">__HOME__</a>
</li>
<li>
<a href="questions.html">__HELP__</a>
</li>
<li>
<a href="licence.html">__LICENSE__</a>
</li>
<li>
<a class="dropdown-trigger" href="#!" data-target="language_dropdown">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-world" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2c3e50" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<circle cx="12" cy="12" r="9" />
<line x1="3.6" y1="9" x2="20.4" y2="9" />
<line x1="3.6" y1="15" x2="20.4" y2="15" />
<path d="M11.5 3a17 17 0 0 0 0 18" />
<path d="M12.5 3a17 17 0 0 1 0 18" />
</svg>
__LANGUAGE_DROPDOWN_MENU_LABEL__
</a>
</li>
</ul>
</div>
</nav>
<ul id="nav-mobile" class="sidenav">
<li class="active">
<a href="index.html">__HOME__</a>
</li>
<li>
<a href="questions.html">__HELP__</a>
</li>
<li>
<a href="licence.html">__LICENSE__</a>
</li>
<li>
<a href="#!">Lang: __LANGUAGE_DROPDOWN_MENU_LABEL__</a>
<ul class="langs">
__LANGUAGE_DROPDOWN_MENU__
</ul>
</li>
</ul>
</header>
<div class="container">
<div class="row">
<div class="col xl6 l6 m10 s12 offset-m1">
<h3>__MAIN_PAGE_PARAGRAPH_TITLE__</h3>
<p>__MAIN_PAGE_PARAGRAPH__</p>
<p>__MAIN_PAGE_LIST_INTRO__</p>
<ul>
<li style="list-style-type: initial;">__MAIN_PAGE_LIST_PUBKEY__</li>
<li style="list-style-type: initial;">__MAIN_PAGE_LIST_TEXT__</li>
<li style="list-style-type: initial;">__MAIN_PAGE_LIST_IMAGE__</li>
</ul>
<img class="responsive-img" src="./example_vignette.png" alt="Vignette example: Make a donation to vignette !">
</div>
<div class="col xl6 l6 m10 s12 offset-m1">
<h5>__MAIN_PAGE_FORM_TITLE__</h5>
<form id="formulaire" onsubmit="createVignette(event)" name="formulaire">
<fieldset class="z-depth-2">
<!--onsubmit="createVignette(event)"-->
<div class="input-field">
<label title="__FORM_HELP_TRANSFORM_G1__"
for="title">__FORM_TITLE__</label> <input type="text" id="title" name="title"><br>
</div>
<div class="input-field">
<label title="__FORM_HELP_CHECKSUM__" for="pubkey">__PUBKEY__</label> <input type=
"text" id="pubkey" name="pubkey"><br>
</div>
<div class="input-field">
<label title="__FORM_HELP_TRANSFORM_G1__"
for="infos">__INFORMATION__</label>
<textarea class="materialize-textarea" type="textarea" style="height: 120px;" id=
"infos" name="infos"></textarea>
</div>
<div class="file-field input-field">
<div class="btn">
<input type="file" id="image" name="image" accept=
".JPG, .JPEG, .jpg, .jpeg, .png, .PNG" title="__MAIN_PAGE_FORM_RECOMMEND_IMAGE_SIZE__">__IMAGE__</input>
</div>
<div class="file-path-wrapper">
<input class="file-path validate" type="text" id="display-file-path">
</div>
</div>
<div class="input-field">
<label><input type="checkbox" id="logo" name="is_logo"><span>__MAIN_PAGE_FORM_DISPLAY_G1_LOGO__</span></label><br>
</div>
<div class="input-field">
<label><input type="checkbox" id="biz_card" name="is_biz_card"><span>__MAIN_PAGE_FORM_BUSINESS_CARD__</span></label><br>
</div>
<br>
<div class="input-field">
<select name="card_number" id="card_number">
<option value="1">1</option>
<option value="2">2</option>
<option value="4">4</option>
<option value="9">9</option>
<option value="16">16</option>
</select>
<label>
__MAIN_PAGE_FORM_CARD_NUMBER__
</label>
</div>
<div class="input-field">
<button class="btn waves-effect waves-light" type="submit" name="action">__GENERATE__</button>
</div>
</fieldset>
</form>
</div>
</div>
<div class="row">
<div class="col s12 card-panel cyan lighten-2" id="imageCanvas" style="display: none;">
<!-- invisible assets for canvas generation-->
<div id="vignetteQrCode" style="display: none"></div><img src="none" id="temp_image" style=
"display: none"> <img src="./logo_g.png" id="logo_g_png" style="display: none">
<!-- buttons -->
<div id="vignette_buttons" class="col s12 m4 l3" style=
"margin-top: max(5px, 5%); margin-bottom: max(5px, 5%); display: flex; flex-wrap: wrap; align-content: center;">
<a id="download" download="vignette.png" class="waves-effect waves-light btn"
style="margin: auto; margin-top: max(5px, 5%); margin-bottom: max(5px, 5%);">
__MAIN_PAGE_BTN_DOWNLOAD__
</a>
<a id="print" class="waves-effect waves-light btn" style=
"margin: auto; margin-top: max(5px, 5%); margin-bottom: max(5px, 5%);">
__MAIN_PAGE_BTN_PRINT__
</a>
<a id="copy" class="waves-effect waves-light btn" style=
"margin: auto; margin-top: max(5px, 5%); margin-bottom: max(5px, 5%);">
__MAIN_PAGE_BTN_SEND_DONATION__
</a>
</div><!-- canvas -->
<div class="col s12 m8 l9">
<canvas id="vignette_canvas"></canvas>
</div>
</div>
</div>
<script src="../theme/materialize.min.js"></script>
<script src="../scr/checksum.js"></script>
<script src="../scr/qrcode.js"></script>
<script>
//---- allow side-navigation for mobiles ----
let options;
document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.sidenav');
var instances = M.Sidenav.init(elems, options);
//---- enable theming for select form input ----
var elems2 = document.querySelectorAll('select');
console.log(elems2)
var instances2 = M.FormSelect.init(elems2, options);
//---- enable dropdown language menus ----
var elems3 = document.querySelectorAll('.dropdown-trigger');
var instances3 = M.Dropdown.init(elems3, options)
});
</script>
<script src="strings.js"></script>
<script src="../scr/main.js"></script>
</div>
</body>
</html>