<%@language = "javascript"%>
<% /*
     $Revision$
     $Id$

    File:               pda/BijlagenSignature.asp
    Description:        Laat een (hand)tekening zetten en sla die op als png
    Parameters:
        key             ALG_RUIMTE_KEY of ...
        Module          "ALG" of "CNT" of ...
        Kenmerk_key     ALG_KENMERK_KEY of ...

        DoDelete        optioneel: bestandsnaam om te verwijderen
        Reado           optioneel: readonly
    Context:            Automatisch bij flexkenmerk type 'F' en dimensie 'xxx'
    Note:               Met TAMPER bescherming!
                        Dit bestand levert GEEN html pagina op,
                        maar een HTML segment die in een mobile pagina in te voegen is
*/ %>

<!-- #include file="../Shared/common.inc" -->
<!-- #include file="./mobile.inc" -->
<!-- #include file="./iface.inc" -->
<!-- #include file="../Shared/flexfiles.inc" -->

<%
protectQS.verify(); // tamper check

// key of folder wordt doorgegeven
var pKey = getQParamInt("key", -1);
var pNiveau = getQParamSafe("niveau", "");
var pModule = getQParamSafe("module");
var pKenmerk_key = getQParamInt("kenmerk_key", -1);
var pMobile = getQParamInt("mobile", 0);

var transitParam = buildTransitParam(["key", "module", "niveau", "kenmerk_key", "encrypt", "extFilter", "pregexp", "reado", "multi", "tmpfolder"]);

params = flexProps(pModule, pKey, String(pKenmerk_key), pNiveau);

__Log("Zoeken bestanden onder " + params.AttachPath);

if (params.extFilter != "xxx")
{
    abort_with_warning("INTERNAL ERROR:\nExtfilter not xxx");
}

%>
    <script>
        function sig_submit()
        {
            var data = {};
            <% protectRequest.dataToken("data"); %>

            if (signaturePad.isEmpty())
            {
                $.post("<%=protectQS.create(rooturl + "/APPL/Shared/base64_png_save.asp?action=delete"+transitParam)%>",
                        data,
                        McltCallbackAndThen(uploadDone), "json");
            }
            else
            {
                data.data = signaturePad.toDataURL();
                $.post("<%=protectQS.create(rooturl + "/APPL/Shared/base64_png_save.asp?action=insert"+transitParam)%>",
                        data,
                        McltCallbackAndThen(uploadDone), "json");
            }
        }
        function sig_clear()
        {
            signaturePad.clear();
        }
        function sig_cancel()
        {
            mobile.changePage();
        }

        function uploadDone(json)
        {
            var btn = $signatureButton.get(0); // HTML variant van jQuery veld
            var aantal = (json.fullPath ? 1 : 0);

            $signatureButton.attr("nBijlagen", aantal);

            // Sla de naam op in het hidden field met het name attribuut zodat we de naam ook in de kenmerk-tabel opslaan
            $("[name=" + btn.id + "]").val(json.safefilename || "");

            $("#" + $signatureButton.attr("aria-controls")).attr("src", json.fullPath || "");

            if (save_url) {
                $.post(save_url, { flexVal: json.safefilename || "" }); // DIRECT opslaan in de database
            }

            var return_data = { cnt: aantal,
                                fileName: json.safefilename || "",
                                fullPath: json.fullPath || ""
                              };
            window.return_data = return_data;
            mobile.changePage();
        }

        function sig_init()
        {
            var wrapper = document.getElementById("signature-pad");
            var canvas = wrapper.querySelector("canvas");

            // Adjust canvas coordinate space taking into account pixel ratio,
            // to make it look crisp on mobile devices.
            // This also causes canvas to be cleared.
            function resizeCanvas() {
                var ratio =  window.devicePixelRatio || 1;
                var canvas_container = $(".signature-pad--body")[0];
                canvas.width = canvas_container.clientWidth * ratio;
                canvas.height = canvas_container.clientHeight * ratio;
                canvas.getContext("2d").scale(ratio, ratio);
            }

            window.onresize = delayed(200, resizeCanvas);
            resizeCanvas();

            window.signaturePad = new SignaturePad(canvas, { });
        }

        // jQuery Mobile zet een rare height op de #page-signature na een resize/pageChange,
        // dus moeten we even 200ms wachten zodat het canvas de juiste afmetingen krijgt.
        $(function() { setTimeout(sig_init, 200); });

    </script>
    <div id="signature-pad" class="signature-pad">
        <div class="signature-pad--body">
          <canvas></canvas>
        </div>
        <div class="signature-pad--footer">
<%
    CONTROLGROUP_START();
        BUTTON(L("lcl_filedelete"), { click: "sig_clear()",   icon: "fa-trash-alt" });
        BUTTON(L("lcl_submit"),     { click: "sig_submit()",  icon: "fa-fclt-save" });
        BUTTON(L("lcl_cancel"),     { click: "sig_cancel()",  icon: "fa-fclt-cancel" });
    CONTROLGROUP_END();
%>
        </div>
    </div>
<% ASPPAGE_END(); %>
