extend templates/layout.pug

block content
    -
        if (data)
            var message = data.message
        data = data == null ? {} : data;

    .container
        .row
            .col.s12
                .row
                    .col.s12
                        .center
                            h2.flow-text Authentication Challenge
                        
                            .row
                                .col.s12
                                    ul.tabs
                                        li.tab.s6
                                            a(href="#qr-code-tab") QR Code
                                        li.tab.s6
                                            a(href="#text-output-tab") Text
                                #qr-code-tab.col.s12
                                    p.flow-text Scan QR Code
                                    a.copy-to-clipboard(data-clipboard-text=challenge)
                                        img.responsive-img(src=qrCode, alt="")
                                #text-output-tab.col.s12
                                    p.flow-text 
                                        small Please sign
                                        br
                                        span(style="word-wrap:anywhere")= challenge.message
                                        br
                                        small with the private key from the derivation path
                                        br
                                        span(style="word-wrap:anywhere")= challenge.derivationPath
                                        br
                                        small belonging to 
                                        br
                                        span(style="word-wrap:anywhere")= challenge.xpub

                            .row
                                .col.s12
                                    a.btn-flat.copy-to-clipboard(data-clipboard-text=challenge) copy challenge to clipboard
                            .row
                                .col.s12
                                    form(action="/account/authenticate/signed", method="post")
                                        input(type="hidden", name="id", value=challenge.id)
                                        button.btn-flat.blue-text(type="submit") signed on seperate device
                        form(action="/account/authenticate/response" method="POST")
                            input(type="hidden", name="id", value=challenge.id)
                            input(type="hidden", name="xpub", value=challenge.xpub)
                            input(type="hidden", name="message", value=challenge.message)
                            input(type="hidden", name="derivationPath", value=challenge.derivationPath)
                            
                            input(type="hidden", name="request[signature]", value=challenge.request.signature)
                            input(type="hidden", name="request[signatureDerivationPath]", value=challenge.request.signatureDerivationPath)
                            .row
                                <label for="signature">Signature:</label>
                                <input id="signature" type="text" name="response[signature]" value="#{signature}"/>
                            .row
                                <div class="col s12 center">
                                    //- <button  class="btn waves-effect waves-light" v-on:click="attemptLogin">Log In</button>
                                    <button class="btn blue waves-effect waves-light" type="submit" name="action">Respond
                                    </button>
                                </div>
                    //- p.center
                        a.center(href="/reset-password") forgot password
            .col.s12

//- block additionalScripts
    script
        include js/copy-to-clipboard.js