<!DOCTYPE html>
<html>


<!-- Mirrored from rolladvantage.com/tokenstamp/foundrywrapper.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 01 Dec 2021 13:42:57 GMT -->
<head>
    <script type="text/javascript">
        var RollAdvantage = {};
        RollAdvantage.InitRegister = [];
    </script>

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

    <!-- Begin Jekyll SEO tag v2.0.0 -->
<title>Token Stamp 2 - RollAdvantage</title>
<meta property="og:title" content="Token Stamp 2" />
<meta name="description" content="A RPG tool site with a table top token app and dice roller for table top role playing games.. RollAdvantage aims to provide tools and resources for table top role playing games. All the tools aim to be easy to use, fast and accessible on the fly, and optionally in-depth if possible in order to make a GM’s life easier." />
<meta property="og:description" content="A RPG tool site with a table top token app and dice roller for table top role playing games.. RollAdvantage aims to provide tools and resources for table top role playing games. All the tools aim to be easy to use, fast and accessible on the fly, and optionally in-depth if possible in order to make a GM’s life easier." />
<link rel="canonical" href="../../localhost_4000/tokenstamp/foundrywrapper.html" />
<meta property="og:url" content="http://localhost:4000/tokenstamp/foundrywrapper.html" />
<meta property="og:site_name" content="RollAdvantage" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@RollAdvantage" />
<script type="application/ld+json">
  {
    "@context": "http://schema.org",
    "@type": "WebPage",
    "headline": "Token Stamp 2",
    "description": "A RPG tool site with a table top token app and dice roller for table top role playing games.. RollAdvantage aims to provide tools and resources for table top role playing games. All the tools aim to be easy to use, fast and accessible on the fly, and optionally in-depth if possible in order to make a GM’s life easier.",
    "url": "http://localhost:4000/tokenstamp/foundrywrapper.html"
  }
</script>
<!-- End Jekyll SEO tag -->

    <link rel="apple-touch-icon" sizes="57x57" href="../assets/images/site/favicon/apple-icon-57x57.png" />
    <link rel="apple-touch-icon" sizes="60x60" href="../assets/images/site/favicon/apple-icon-60x60.png" />
    <link rel="apple-touch-icon" sizes="72x72" href="../assets/images/site/favicon/apple-icon-72x72.png" />
    <link rel="apple-touch-icon" sizes="76x76" href="../assets/images/site/favicon/apple-icon-76x76.png" />
    <link rel="apple-touch-icon" sizes="114x114" href="../assets/images/site/favicon/apple-icon-114x114.png" />
    <link rel="apple-touch-icon" sizes="120x120" href="../assets/images/site/favicon/apple-icon-120x120.png" />
    <link rel="apple-touch-icon" sizes="144x144" href="../assets/images/site/favicon/apple-icon-144x144.png" />
    <link rel="apple-touch-icon" sizes="152x152" href="../assets/images/site/favicon/apple-icon-152x152.png" />
    <link rel="apple-touch-icon" sizes="180x180" href="../assets/images/site/favicon/apple-icon-180x180.png" />
    <link rel="icon" type="image/png" sizes="192x192" href="../assets/images/site/favicon/android-icon-192x192.png" />
    <link rel="icon" type="image/png" sizes="32x32" href="../assets/images/site/favicon/favicon-32x32.png" />
    <link rel="icon" type="image/png" sizes="96x96" href="../assets/images/site/favicon/favicon-96x96.png" />
    <link rel="icon" type="image/png" sizes="16x16" href="../assets/images/site/favicon/favicon-16x16.png" />
    <link rel="manifest" href="../assets/images/site/favicon/manifest.json" />
    <meta name="msapplication-TileColor" content="#ffffff" />
    <meta name="msapplication-TileImage" content="/assets/images/site/favicon/ms-icon-144x144.png" />
    <meta name="theme-color" content="#ffffff" />

    <link type="text/css" rel="stylesheet" href="../assets/importer.css">

    <script>
    (function (i, s, o, g, r, a, m) {
        i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
            (i[r].q = i[r].q || []).push(arguments)
        }, i[r].l = 1 * new Date(); a = s.createElement(o),
        m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
    })(window, document, 'script', '../../www.google-analytics.com/analytics.js', 'ga');

    if (location.hostname != "localhost") {
        ga('create', 'UA-46823981-3', 'auto');
        ga('send', 'pageview');
    }
    else { 
        ga('set', 'sendHitTask', null);
    }

    function ga_linkClick(action, label) {
        ga('send', {hitType: 'event',eventCategory: 'link-click',eventAction: action,eventLabel: label});
    }
    function ga_singleTokenLinkClick(label, href) {
        ga_linkClick("single-token-click", label);
        window.open(href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=300');
    }
    function ga_tokenZip(label) {
        ga_linkClick("token-zip", label);
    }
    function ga_socialMediaShare(label) {
        ga_linkClick("social-media-share", label);
    }
</script>

    <script type="text/javascript" src="../assets/main.js"></script>
</head>

<body>
    <main id="site-content" class="">
        <style>
    body {
        font-size: 1em;
        padding: 0;
        margin: 0;
    }

    #site-content {
        padding: 0;
        margin: 0;
        max-width: 1212px;
    }

    .resources {
        height: 0;
    }
</style>


<section class="resources">
    <section id="foundry-data-export"></section>
    <img id="drop-image" />
    <section id="templates">
        <script id="token-stamp-maker-template" type="text/html">
            <div id="token-stamp-maker">
                {{#if isLoading}}
                <div class="overlay global">
                    <span class="label">Loading...</span>
                </div>
                {{/if}}
                <div class="top-function-bar">
                    {{#each optionSelections:pos}}
                    <div class="option-selector">
                        <div class="button toggle-button" on-click="toggleOptionSelector:{{pos}}">
                            <img draggable="false" ondragstart="return false" src="{{selectedOptionImage}}" />
                        </div>
                        <div class="scroll-container {{showOptions ? 'expanded' : 'collapsed'}}">
                            <div class="options">
                                {{#each options}}
                                <div class="button option {{id == selectedOptionId ? 'selected' : ''}}" on-click="selectOption:{{pos}}, {{id}}">
                                    <div class="image">
                                        <img draggable="false" ondragstart="return false" src="{{image}}" title="{{name}}" />
                                    </div>
                                </div>
                                {{/each}}
                            </div>
                        </div>
                    </div>
                    {{/each}}
                    <div class="colour-control-container border-tint button">
                        <div class="colour-control" value="#B79A75">
                        </div>
                        <div class="label">
                            Border Tint
                        </div>
                    </div>
                    <div class="colour-control-container  background-colour button">
                        <div class="colour-control" value="#4F4236">
                        </div>
                        <div class="label">
                            Background Colour
                        </div>
                    </div>
                    <div class="colour-control-container text-colour button">
                        <div class="colour-control" value="#FfCc33">
                        </div>
                        <div class="label">
                            Text Colour
                        </div>
                    </div>
                    <div class="button" on-click="buttonClick:addText">Add Textbox</div>
                    <div class="number-input">
                        <div class="label">Scale</div>
                        <input type="number" value="{{outputScale}}" placeholder="Output Scale" step="0.05" min="0" max="5">
                        <div class="number-input">
                            <div class="input-increase" on-click="adjustOutputScale:{{0.1}}">+</div>
                            <div class="input-decrease" on-click="adjustOutputScale:{{-0.1}}">-</div>
                        </div>
                    </div>
                    <div class="number-input">
                        <div class="label">Border Opacity:</div>
                        <input type="number" value="{{borderOpacity}}" placeholder="Border Opacity" step="0.05" min="0" max="1">
                        <div class="number-input">
                            <div class="input-increase" on-click="adjustBorderOpacity:{{0.1}}">+</div>
                            <div class="input-decrease" on-click="adjustBorderOpacity:{{-0.1}}">-</div>
                        </div>
                    </div>
                    <div class="number-input">
                        <div class="label">Overlay Opacity:</div>
                        <input type="number" value="{{overlayOpacity}}" placeholder="Overlay Opacity" step="0.05" min="0" max="1">
                        <div class="number-input">
                            <div class="input-increase" on-click="adjustOverlayOpacity:{{0.1}}">+</div>
                            <div class="input-decrease" on-click="adjustOverlayOpacity:{{-0.1}}">-</div>
                        </div>
                    </div>
                    <div class="colour-control-container overlay-tint button">
                        <div class="colour-control" value="#C82A2A">
                        </div>
                        <div class="label">
                            Overlay Tint
                        </div>
                    </div>
                </div>
                <div class="workspace-container">
                    <div class="workspace">
                        {{#if isBatchModeOn}}
                        <div class="overlay batch">
                            <div>
                                <div class="label">- Batch Mode -</div>
                                <div class="label">Drop multiple images here</div>
                                <div class="label">To start stamping click "Start Batch Stamping"</div>
                            </div>
                            <div class="batch-images">
                                {{#each batchImageUrls}}
                                <img draggable="false" ondragstart="return false" src="{{this}}" />
                                {{/each}}
                            </div>
                        </div>
                        {{/if}}

                        {{#if errorMessage}}
                        <div class="error-alert">
                            <span class="label">{{errorMessage}}</span>
                        </div>
                        {{/if}}
                        {{#if showStartMessage}}
                        <div class="overlay">
                            <span class="label">Drop image here to start.</span>
                        </div>
                        {{/if}}
                        <canvas id="editor-canvas"></canvas>
                    </div>
                    <div class="side-function-bar">
                        <canvas id="preview-canvas"></canvas>
                        <div class="information">
                            <p><a href="/rpg-tools/how-to-use-our-token-stamp.html" onClick="ga_linkClick('misc', 'token-stamp-help');">How to use Token Stamp 2</a></p>
                            <p><a href="/rpg-tools/how-to-use-custom-borders.html" onClick="ga_linkClick('misc', 'custom-border-help');">Custom Borders!</a></p>
                            <p>Version: {{version}}</p>
                            <p>Tweet us! <a href="https://twitter.com/RollAdvantage" onClick="ga_linkClick('social-media', 'twitter');">@RollAdvantage</a></p>
                        </div>
                        <div class="button-container">
                            <div class="button choose-file {{isBatchModeOn ? "disabled" : ""}}" on-click="buttonClick:chooseFile">Choose Image<input type="file" style="visibility: hidden;width: 0;" decorator="imageFileDialog" /></div>
                            {{#if isFoundryMode}}
                            {{#if canFoundryUpload}}
                            <div class="button upload foundry-import" on-click="buttonClick:foundryImport">Import Token</div>
                            {{/if}}
                            <div class="button upload foundry-import" on-click="buttonClick:foundryImgurImport">Import Token via Imgur</div>
                            {{/if}}
                            <div class="button clear" on-click="buttonClick:clear">Clear Workspace</div>
                            <div class="button reset {{isBatchModeOn ? "disabled" : ""}}" on-click="buttonClick:reset">Reset Position</div>
                            <div class="dual-button custom-border">
                                <div class="button long" on-click="buttonClick:setCustomBorder">Set Custom Border<input type="file" style="visibility: hidden;width: 0;" decorator="customBorderFileDialog" /></div>
                                {{#if isCustomBorderSet}}
                                <div class="button short" on-click="buttonClick:clearCustomBorder"><i class="fa fa-times"></i></div>
                                {{/if}}
                            </div>
                            <div class="dual-button custom-mask">
                                <div class="button long" on-click="buttonClick:setCustomMask">Set Custom Mask<input type="file" style="visibility: hidden;width: 0;" decorator="customMaskFileDialog" /></div>
                                {{#if isCustomMaskSet}}
                                <div class="button short" on-click="buttonClick:clearCustomMask"><i class="fa fa-times"></i></div>
                                {{/if}}
                            </div>
                            {{#if !isFoundryMode}}
                            <div class="button" on-click="buttonClick:batchModeToggle">{{isBatchModeOn ? "Disable" : "Enable"}} Batch Mode</div>
                            {{#if isBatchModeOn}}
                            <div class="button" on-click="buttonClick:startBatchProcess">Start Batch Stamping</div>
                            {{/if}}
                            {{/if}}
                        </div>
                    </div>
                </div>
            </div>
        </script>
    </section>
</section>

<script type="text/javascript" src="../assets/tokenstampLibs.js"></script>
<script type="text/javascript" src="../assets/tokenstamp2.js"></script>
    </main>
    <script type="text/javascript">
        $(document).ready(function () {
            for (var x = 0; x < RollAdvantage.InitRegister.length; x++) {
                RollAdvantage.InitRegister[x]();
            }
        });
    </script>
</body>


<!-- Mirrored from rolladvantage.com/tokenstamp/foundrywrapper.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 01 Dec 2021 13:42:59 GMT -->
</html>
