<% if @ext == 'pdf' %>
    <%= render partial: 'archives/viewer' %>
<% else %>
<html lang="<%= I18n.locale.to_s%>" style="margin: 0em; padding: 0em; width: 100%; height: 100%; overflow: hidden; background-color: rgb(230, 230, 230);">
<head>
    <meta name="viewport" content="width=device-width, minimum-scale=0.1">
    <title><%=@filename%></title>
    <%= stylesheet_link_tag "archive/download_file.css" %>
</head>
<body>
    <h1 style="display: none;"><%=@filename%></h1>
    <% if @ext != "png" && @ext != "jpg" && @ext != "bmp" %>
        <object data="<%=@url%>" height="100%" type="application/<%=@ext%>" width="100%">
            <iframe height="100%" src="<%=@url%>" title="<%=@filename%>" width="100%"></iframe>
            <img alt="<%=@filename%>" src="<%=@url%>">
        </object>
    <% else %>
        <img alt="<%=@filename%>" src="<%=@url%>">
        <script type="text/javascript">
            var img = document.getElementsByTagName('img')[0];
            var width = img.width;
            var height = img.height;
            window.innerWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
            window.innerHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
            var window_width = window.innerWidth;
            var window_height = window.innerHeight;
            var zoom_in_cursor,zoom_out_cursor;
            var IE_ver = 11;
            if(navigator.userAgent.search("MSIE") != -1){
                IE_ver = Number(navigator.userAgent.split("MSIE")[1].split(";")[0]);
            }
            if(IE_ver <= 8){
                img.style.marginTop = "-"+img.height/2+"px";
                img.style.marginLeft = "-"+img.width/2+"px";
            }else{
                img.style.transform= "translate(-50%, -50%)";
                img.style["-ms-transform"]= "translate(-50%, -50%)";
                img.style["-moz-transform"]= "translate(-50%, -50%)";
            }
            if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) {
                zoom_in_cursor =  'url("/assets/archive/zoomin.cur"), auto';
                zoom_out_cursor =  'url("/assets/archive/zoomout.cur"), auto';
            }else{
                zoom_in_cursor =  'zoom-in';
                zoom_out_cursor =  'zoom-out';
            }
            if(height > window_height && (height / width) > (window_height / window_width) ){
                img.height = window_height;
                img.width = window_height / height * width;
                img.style.cursor = zoom_in_cursor;
                if(IE_ver <= 8){
                    img.style.marginTop = "-"+img.height/2+"px";
                    img.style.marginLeft = "-"+img.width/2+"px";
                }
                img.onclick=function(e){
                    var event = e || window.event;
                    if(img.style.cursor == zoom_in_cursor){
                        var cursor_x = event.clientX;
                        var cursor_y = event.clientY;
                        img.height = height;
                        img.width = width;
                        img.style.cursor = zoom_out_cursor;
                        document.getElementsByTagName('html')[0].style.overflow = "";
                        img.style.transform= "none";
                        img.style["-ms-transform"]= "none";
                        img.style["-moz-transform"]= "none";
                        img.style.top= "0";
                        img.style.left= "0";
                        if(IE_ver <= 8){
                            img.style.marginTop = "0";
                            img.style.marginLeft = "0";
                        }
                        window.scroll(
                          (((cursor_x - (window_width - window_height / height * width)/2) * height / window_height) - window_width / 2),
                          ((cursor_y * height / window_height) - window_height / 2)
                        );
                    }else{
                        img.height = window_height;
                        img.width = window_height / height * width;
                        img.style.cursor = zoom_in_cursor;
                        document.getElementsByTagName('html')[0].style.overflow = "hidden";
                        if(IE_ver <= 8){
                            img.style.marginTop = "-"+img.height/2+"px";
                            img.style.marginLeft = "-"+img.width/2+"px";
                        }else{
                            img.style.transform= "translate(-50%, -50%)";
                            img.style["-ms-transform"]= "translate(-50%, -50%)";
                            img.style["-moz-transform"]= "translate(-50%, -50%)";
                        }
                        img.style.top= "50%";
                        img.style.left= "50%";
                        window.scroll(0, 0);
                    }
                };
            }else if(width > window_width){
                img.width = window_width;
                img.height = window_width / width * height;
                img.style.cursor = zoom_in_cursor;
                if(IE_ver <= 8){
                    img.style.marginTop = "-"+img.height/2+"px";
                    img.style.marginLeft = "-"+img.width/2+"px";
                }
                img.onclick=function(e){
                    var event = e || window.event;
                    if(img.style.cursor == zoom_in_cursor){
                        var cursor_x = event.clientX;
                        var cursor_y = event.clientY;
                        img.height = height;
                        img.width = width;
                        img.style.cursor = zoom_out_cursor;
                        document.getElementsByTagName('html')[0].style.overflow = "";
                        img.style.transform= "none";
                        img.style["-ms-transform"]= "none";
                        img.style["-moz-transform"]= "none";
                        img.style.top= "0";
                        img.style.left= "0";
                        if(IE_ver <= 8){
                            img.style.marginTop = "0";
                            img.style.marginLeft = "0";
                        }
                        window.scroll( ((cursor_x * height / window_height) - window_width / 2),
                            (((cursor_y - (window_height - window_width / width * height)/2) * height / window_height) - window_height / 2)
                        );
                    }else{
                        img.width = window_width;
                        img.height = window_width / width * height;
                        img.style.cursor = zoom_in_cursor;
                        document.getElementsByTagName('html')[0].style.overflow = "hidden";
                        if(IE_ver <= 8){
                            img.style.marginTop = "-"+img.height/2+"px";
                            img.style.marginLeft = "-"+img.width/2+"px";
                        }else{
                            img.style.transform= "translate(-50%, -50%)";
                            img.style["-ms-transform"]= "translate(-50%, -50%)";
                            img.style["-moz-transform"]= "translate(-50%, -50%)";
                        }
                        img.style.top= "50%";
                        img.style.left= "50%";
                        window.scroll(0, 0);
                    }
                };
            }
        </script>
    <% end %>
</body>
</html>
<% end %>