<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="themes/jquery/css/themes/default/jquery.mobile-1.4.5.min.css">
	<link rel="stylesheet" href="themes/home/css/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="themes/home/css/ui-box.css">
    <link rel="stylesheet" href="themes/home/css/ui-base.css">
    <link rel="stylesheet" href="themes/home/css/ui-color.css">
    <link rel="stylesheet" href="themes/home/css/icon.css">
    <link rel="stylesheet" href="themes/home/css/control.css">
    <link rel="stylesheet" href="themes/home/css/main.css">
	<script src="themes/jquery/js/jquery.js"></script>
	<script src="themes/jquery/js/jquery.mobile-1.4.5.min.js"></script>
	<script type="text/javascript">
	function openBrowse(){ 
		var ie=navigator.appName=="Microsoft Internet Explorer" ? true : false; 
		if(ie){ 
			document.getElementById("fileupload").click(); 
			document.getElementById("filename").value=document.getElementById("fileupload").value;
		}else{
			var a=document.createEvent("MouseEvents");//FF的处理 
			a.initEvent("click", true, true);  
			document.getElementById("fileupload").dispatchEvent(a); 
		} 
	}
	</script>
</head>
<body class="um-vp c-wh " ontouchstart>
	<div data-role="page" id="showpage" data-quicklinks="true" class="ub ub-ver " >
      <div data-role="header" id="header" data-position="fixed" data-fullscreen="true" data-tap-toggle="false" >
	  <div class="uh bc-text-head ub bc-head">
                <div class="nav-btn" id="nav-left" onClick="javascript:window.location='index.php?ac=<?php echo $ac;?>&fileurl=plugin&type=<?php echo $type;?>&father=<?php echo $father;?>'">
                    <div class="fa fa-angle-left fa-2x"></div>
                </div>
                <h1 class="ut ub-f1 ulev-3 ut-s tx-c" tabindex="0">文件上传</h1>
				
                <div class="nav-btn nav-bt" onClick="javascript:openBrowse();">
                    <div class="ub-img icon-add umw2 umh4"></div>
                </div>
				
       </div>
</div>
		<!-- /header -->
  <div data-role="content" id="content">
  <input data-role="none" id="fileupload" type="file" name="files[]" multiple style="display:none">
	<input type="hidden" id="filename"/>
	           <style>
	            .progressbar {
					width: 0px;
					height: 25px;
					margin - bottom: 20px;
					background:#006633;
				    color:#FFFFFF;
					font-size:14px;
					font-weight:bold;
				}
	          </style>
    <div class="progressbar" id="progressbar">
		<div id="progress-bar"></div>
	</div>
	<div id="h4txt" style="text-align:center;"><div id="error-bg"></div>支持批量上传，右上角选择添加内容！</div>
	<div class="ub ub-ver">
		<div id="files"></div>
    </div>
  </div>

</div><!-- /page -->
 <script type="text/javascript"> 
    window.onload = function(){ 
        var heg=document.getElementById("header").offsetHeight;
		var content=document.getElementById("content"); 
		content.style.cssText="margin-top:"+heg+"px;";
    }
</script> 
<!-- The jQuery UI widget factory, can be omitted if jQuery UI is already included -->
<script src="../template/default/upload/js/vendor/jquery.ui.widget.js"></script>
<!-- The Iframe Transport is required for browsers without support for XHR file uploads -->
<script src="../template/default/upload/js/jquery.iframe-transport.js"></script>
<!-- The basic File Upload plugin -->
<script src="../template/default/upload/js/jquery.fileupload.js"></script>
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
<script src="../template/default/upload/js/bootstrap.min.js"></script>
<script>
/*jslint unparam: true */
/*global window, $ */
$(function () {
    'use strict';
    // Change this to the location of your server-side upload handler:
    var url = window.location.hostname === 'blueimp.github.io' ?
                '' : '../upload/index.php?userid=<?php echo $_USER->id;?>';
    $('#fileupload').fileupload({
        url: url,
        dataType: 'json',
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
			//../data/uploadfile/<?php echo trim($_USER->id);?>/thumbnail/'+file.name+'
				var html='';
				//alert(file.name);
				html+='<ul class="ubb ub bc-border lis">';
			    html+='<li class="uh-app3 uw-app3 uc-a-app2 ub-img mar-ar1" style="background-image:url('+file.url.replace("/<?php echo trim($_USER->id);?>/","/<?php echo trim($_USER->id);?>/thumbnail/")+');"></li>';
			    html+='<li class="ub-f1 ub ub-ver">';
				html+='<div class="ub umar-t">';
				html+='<div class="ub ub-f1 ub-ac sc-text-active">'+file.name+'';
				html+='</div>';
				html+='<div class="ub ub-pe tx-r">';
				html+='<div class="t-gra-comm ufm1 ulev-2 umar-r">'+(file.size/1000)+'KB</div>';
				html+='<div class="ub-img praise uh-comm2 uw-comm2"></div>';
				html+='</div>';
				html+='</div>';
				if(file.type==''){
				html+='<div class="t-bla ulev-4 ub-f1 umar-t" style="color:#990000;">上传失败</div>';
				}else{
					html+='<div class="t-bla ulev-4 ub-f1 umar-t" style="color:#009900;">上传成功</div>';
				}
			    html+='</li>';
		        html+='</ul>';
				documentadd(file.name,file.url,file.size,file.type);
				$('<p>').html(html).appendTo('#files');
            });
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 0);
			$('#progressbar').css(
				'width',
				progress + '%'
			);
			$("#h4txt").hide();
			$("#progress-bar").text(progress + '%');
        }
    }).prop('disabled', !$.support.fileInput)
        .parent().addClass($.support.fileInput ? undefined : 'disabled');
});
	function documentadd(title,annex,content,type){
			if(type!=''){
				jQuery.ajax({
				  type: 'GET',
				  url: 'index.php?ac=<?php echo $ac;?>&fileurl=plugin&type=<?php echo $type;?>&do=add&view=save&title='+escape(title)+'&annex='+annex+'&content='+content+'&documentid=<?php echo $father;?>&'+new Date(),
				  success: function(data){
					  if(data=='false'){
						  return (false);
					  }else if(data=='true'){
						  return (true);
					  }
				  }
			   });
		   }
		}
</script>
  
</body>
</html>
