<%@ Page Language="c#" %>
<%@ Register Namespace="CuteWebUI" Assembly="CuteWebUI.AjaxUploader" TagPrefix="CuteWebUI" %>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head runat="server">
    <title>Start Uploading Manually - v4 compatibility</title>
    <link rel="stylesheet" href="demo.css" type="text/css" />

    <script runat="server">
        void InsertMsg(string msg)
        {
            ListBoxEvents.Items.Insert(0, msg);
            ListBoxEvents.SelectedIndex = 0;
        }

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            SubmitButton.Attributes["onclick"] = "return submitbutton_click()";
        }

        void ButtonPostBack_Click(object sender, EventArgs e)
        {
            InsertMsg("You clicked a PostBack Button.");
        }

        void SubmitButton_Click(object sender, EventArgs e)
        {
            InsertMsg("You clicked the Submit Button.");
            InsertMsg("You have uploaded " + Attachments1.Items.Count + " file(s).");
        }

        void Uploader_FileUploaded(object sender, UploaderEventArgs args)
        {
            InsertMsg("File uploaded! " + args.FileName + ", " + args.FileSize + " bytes.");
        }
    </script>
</head>
<body>
    <form id="Form1" method="post" runat="server">
        <div class="content">
            <a class="backlink" href="Default.aspx">&#8592; v4 compatibility demos</a>
            <h2>Start Uploading Manually</h2>
            <p>Queue files without uploading, then start the transfer from your own submit button.</p>

            <div class="note">
                This is the v4 pattern that depends on the <strong>client-side</strong> API -
                <code>getqueuecount()</code> and <code>startupload()</code> on the element, plus the
                <code>CuteWebUI_AjaxUploader_OnPostback()</code> hook. None of it existed in v5
                before 5.3.2: the page compiled and rendered, then failed at runtime with
                "getqueuecount is not a function". A .NET API diff cannot catch that, because the
                missing surface is JavaScript.
            </div>

            <div class="panel">
                <CuteWebUI:UploadAttachments runat="server" ID="Attachments1"
                    InsertText="Browse Files (Max 1M)"
                    ManualStartUpload="true"
                    MultipleFilesUpload="true"
                    OnFileUploaded="Uploader_FileUploaded">
                    <ValidateOption MaxSizeKB="1024" />
                </CuteWebUI:UploadAttachments>

                <p>
                    <asp:Button ID="SubmitButton" Text="Submit" runat="server"
                        OnClick="SubmitButton_Click" />
                </p>
            </div>

            <div class="panel">
                <p>Server Trace:</p>
                <asp:ListBox runat="server" ID="ListBoxEvents" />
                <p>
                    <asp:Button ID="ButtonPostBack" Text="This is a PostBack button" runat="server"
                        OnClick="ButtonPostBack_Click" />
                </p>
            </div>
        </div>
    </form>

    <script type="text/javascript">
        var fileuploaded = false;

        // Unchanged from the v4 sample.
        function submitbutton_click() {
            var uploadobj = document.getElementById('<%=Attachments1.ClientID %>');
            if (fileuploaded)
                return true;
            if (uploadobj.getqueuecount() > 0) {
                uploadobj.startupload();
            }
            else {
                alert("Please browse files for uploading");
            }
            return false;
        }

        // v4 called this instead of posting back automatically; returning false
        // suppressed the postback so the page could submit on its own terms.
        function CuteWebUI_AjaxUploader_OnPostback() {
            fileuploaded = true;
            document.getElementById('<%=SubmitButton.ClientID %>').click();
            return false;
        }
    </script>
</body>
</html>
