<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ImageBox.ascx.cs" Inherits="MTCUN.HtmlBox.ImageBox" %>



<%@ Register Src="../UserCol/Progress.ascx" TagName="Progress" TagPrefix="uc1" %>



<input id="SelectedType" type="hidden" runat="server" />
<input id="SelectedName" type="hidden" runat="server" />
<input id="SelectedDiv" type="hidden" runat="server" />
<input id="pos" type="hidden" runat="server" />

<div style="width: 600px; height: 30px;">
    <div style="float: left; width: 275px">
        <asp:TextBox ID="tbxNetFolder" runat="server" Width="266px" ReadOnly="True"></asp:TextBox>
    </div>
    <div style="float: left; width: 30px">
        <asp:ImageButton ID="ibnUp" runat="server" ImageAlign="AbsBottom" ImageUrl="utility/folder.up.gif" OnClick="ibnUp_Click" />
    </div>
    <div style="float: left; width: 30px">
        <asp:ImageButton ID="ibnNew" runat="server" ImageUrl="utility/newfolder.gif" OnClick="ibnNew_Click" />
    </div>
    <div style="float: left; width: 30px">
        <asp:ImageButton ID="ibnRefurbish" runat="server" ImageUrl="utility/refurbish.gif" OnClick="ibnRefurbish_Click" />
    </div>
    <div style="float: left;">
        <div id="Tools"></div>
    </div>
    <div style="float: right; width: 50px; margin-right:80px">
        <uc1:Progress ID="Progress1" runat="server" Width="50px" TextWidth="50px" />
    </div>
</div>



<div id="ImageBox" style="width: 600px; height: 400px;" onclick="ClearSelected();">
    <asp:DataList ID="DataList1" DataKeyField="Name" runat="server"
        RepeatColumns="5" RepeatDirection="Horizontal"
        OnEditCommand="DataList1_EditCommand" OnUpdateCommand="DataList1_UpdateCommand"
        OnSelectedIndexChanged="DataList1_SelectedIndexChanged"
        OnDeleteCommand="DataList1_DeleteCommand">

        <ItemTemplate>
            <asp:HiddenField ID="hfdType" Value='<%#Eval("Type")%> ' runat="server" />

            <div class="thumbnailborder">

                <%# ShowThumbnail((int)Eval("Type"), Eval("Name"),(int)Eval("Length"),Eval("Width"),Eval("Height"))%>

                <span id="spanName" class="titleHolder" onclick="onChangeName(this);event.cancelBubble=true" ondblclick="ondChangeName(this)" onmousemove="getTitle(this)">
                    <%#Eval("Name")%> 
                </span>

                <div id="divEditName" style="display: none" onclick="event.cancelBubble=true">
                    <asp:TextBox ID="tbxName" AutoPostBack="true" runat="server" Width="80px" CssClass="EditTextBox" Text='<%# System.IO.Path.GetFileNameWithoutExtension(Eval("Name").ToString())%>' OnTextChanged="tbxName_TextChanged"></asp:TextBox>
                </div>


                <div id="divDelete" style="float: left; width: 30px">
                    <asp:ImageButton ID="imgDelete" runat="server" ImageUrl="utility/delete.gif" CommandName="delete" CommandArgument='<%# Eval("Type") %>' ToolTip="删除" OnClientClick="return confirm('你确定执行删除操作？');" />
                </div>
            </div>



        </ItemTemplate>
    </asp:DataList>
</div>

<script type="text/javascript">
    function GetURL(path) {

        var obj = window.opener;
        if (obj != null && obj.Edit_Object != null) {
            obj.window.frames[0].document.execCommand("InsertImage", false, path);
        }
        else {
            if (obj != null && obj.urlbox_Object != null)
            { obj.urlbox_Object.value = path; obj.ShowImage(); }
            else
                alert("没有发现接收对象。");
        }
    }
</script>

<script type="text/javascript">
    //<![CDATA[

    var LastImageDiv = false;
    function SelectedDiv(theDiv, type, name) {
        if (LastImageDiv) {
            LastImageDiv.style.border = "solid 1px #CCCCCC";
            LastImageDiv.style.padding = "0px";

            var divs = LastImageDiv.parentNode.getElementsByTagName("div");
            for (var i = 0; i < divs.length; i++) {
                if (divs[i].id.indexOf("divDelete") == 0) {
                    divs[i].style.display = 'none';
                }
                else if (divs[i].id.indexOf("divEditName") == 0) {
                    divs[i].style.display = "none";
                }
            }

            var spans = LastImageDiv.parentNode.getElementsByTagName("span");
            for (var i = 0; i < spans.length; i++) {
                if (spans[i].id.indexOf("spanName") == 0) {
                    spans[i].style.display = "inline";
                    spans[i].style.background = "";
                    spans[i].style.padding = "0px";
                    spans[i].style.color = "#000000";
                    break;
                }
            }
        }

        LastImageDiv = theDiv;
        theDiv.style.border = "solid 2px highlight";
        theDiv.style.padding = "0px";

        var divs = theDiv.parentNode.parentNode.getElementsByTagName("div");
        for (var i = 0; i < divs.length; i++) {

            //alert(divs[i].id);
            if (divs[i].id.indexOf("divDelete") == 0) {
                divs[i].style.display = "block";
                Change(divs[i]);
                break;
            }
        }

        var spans = LastImageDiv.parentNode.getElementsByTagName("span");
        for (var i = 0; i < spans.length; i++) {
            if (spans[i].id.indexOf("spanName") == 0) {
                spans[i].style.background = "highlight";
                spans[i].style.padding = "0px";
                spans[i].style.color = "#ffffff";
                break;
            }
        }

    }

    function Change(theDiv) {
        var obj = Tools;
        var x = getLeft(obj) + obj.offsetWidth;
        var y = getTop(obj) + obj.offsetHeight / 2;

        theDiv.style.left = x + "px";
        theDiv.style.top = y + "px";
        //alert(theDiv.id);
    }

    function getTop(e) {
        var t = e.offsetTop
        while (e = e.offsetParent) t += e.offsetTop;
        return t;
    }

    function getLeft(e) {
        var l = e.offsetLeft
        while (e = e.offsetParent) l += e.offsetLeft;
        return l;
    }

    function onChangeName(theSpan) {
        var edit = false;
        var divs = theSpan.parentNode.getElementsByTagName("div");

        if (!LastImageDiv) {
            for (var i = 0; i < divs.length; i++) {
                if (divs[i].id.indexOf("divImage") == 0) {
                    SelectedDiv(divs[i], 0, "");
                }
            }
            return;
        }

        for (var i = 0; i < divs.length; i++) {
            if (divs[i].id.indexOf("divImage") == 0) {
                if (LastImageDiv == divs[i]) {
                    edit = true;
                }
                else {
                    SelectedDiv(divs[i], 0, "");
                }
            }
        }

        if (edit) {
            for (var i = 0; i < divs.length; i++) {
                if (divs[i].id.indexOf("divEditName") == 0) {
                    theSpan.style.display = "none";
                    divs[i].style.display = "inline";
                    var input = divs[i].getElementsByTagName("input");
                    input[0].focus();


                    break;
                }
            }
        }
    }

    function setCaret(textbox, pos) {
        var r = textbox.createTextRange();
        r.collapse(true);
        r.moveStart('character', pos);
        r.select();
    }

    function getTitle(theSpan) {
        var divs = theSpan.parentNode.getElementsByTagName("div");
        for (var i = 0; i < divs.length; i++) {
            if (divs[i].id.indexOf("divImage") == 0) {
                theSpan.title = divs[i].title;
            }
        }
    }

    function ClearSelected() {
        if (LastImageDiv) {
            LastImageDiv.style.border = "solid 1px #CCCCCC";
            LastImageDiv.style.padding = "0px";

            var divs = LastImageDiv.parentNode.getElementsByTagName("div");
            for (var i = 0; i < divs.length; i++) {
                if (divs[i].id.indexOf("divDelete") == 0) {
                    divs[i].style.display = "none";
                }
                else if (divs[i].id.indexOf("divEditName") == 0) {
                    divs[i].style.display = "none";
                }
            }

            var spans = LastImageDiv.parentNode.getElementsByTagName("span");
            for (var i = 0; i < spans.length; i++) {
                if (spans[i].id.indexOf("spanName") == 0) {
                    spans[i].style.display = "inline";
                    spans[i].style.background = "";
                    spans[i].style.padding = "0px";
                    spans[i].style.color = "#000000";
                    break;
                }
            }
            LastImageDiv = false;
        }
    }

    function Reload(src) {
        alert(src);
        //location.reload();
    }
    //]]>
</script>


<div style="margin-top: 5px">
    <%--<iframe style="width: 100%; height: 50px" frameborder="0" id="myiframe" name="myiframe" runat="server"></iframe>--%>
    <asp:FileUpload ID="FileUpload1" runat="server" />
&nbsp;<asp:Button ID="btnUpFile" runat="server" OnClick="btnUpFile_Click" Text="上传" />
    <br />
</div>
