开发学院服务器云计算 Perl 和 Amazon 云,第 5 部分:了解完整 mod_per... 阅读

Perl 和 Amazon 云,第 5 部分:了解完整 mod_perl 站点的模板

 2010-02-04 00:00:00 来源:WEB开发网   
核心提示: upload.tmpl现在,我们将了解一个优秀的模板,Perl 和 Amazon 云,第 5 部分:了解完整 mod_perl 站点的模板(2),它集合了 JavaScript、HTML 和 Template Toolkit 语言,如果这还不能让 Web 设计师激动不已的话

upload.tmpl

现在,我们将了解一个优秀的模板,它集合了 JavaScript、HTML 和 Template Toolkit 语言。如果这还不能让 Web 设计师激动不已的话,那么我不知道还有什么能够拥有这种魔力。

清单 2. 足以让 Web 设计人员激动不已的 upload.tmpl

<html> 
 <head> 
  <title>Upload Page For [% username %]</title> 
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
  <script src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js" 
         type="text/javascript"></script> 
 </head> 
 
 <body> 
 <script language="JavaScript"> 
function OnSubmitForm() 
{ 
 var form = $('uploader'); 
 var file = form['file']; 
 var ct  = form['Content-Type']; 
 var name = form['name'].value; 
 
 if (!name || name.length < 1) 
 { 
 alert("Sorry, you can't upload without a name."); 
 return false; 
 } 
 
 var filename = ''+$F(file); 
 var f = filename.toLowerCase(); // always compare against the lowercase version 
 
 if (!navigator['mimeTypes']) 
 { 
 alert("Sorry, your browser can't tell us what type of file you're uploading."); 
 return false; 
 } 
 
 var type = $A(navigator.mimeTypes).detect(function(m) 
 { 
 // does any of the suffixes match? 
 return m.type.length > 3 && m.type.match('/') && 
  $A(m.suffixes.split(',')).detect(function(suffix) 
 { 
  return f.match('\.' + suffix.toLowerCase() + '$'); 
 }); 
 }); 
 
 if (!type || !type['type']) 
 { 
 type = { type : prompt("Enter your own MIME type, we couldn't find one through 
             the browser", "image/jpeg") }; 
 } 
 
 if (type && type['type']) 
 { 
 ct.value = type.type; 
 
 // fix up the redirect if we're about to submit 
 var sar = form['success_action_redirect']; 
 
 sar.value = sar.value + escape(name); 
 return true; 
 } 
 
 alert("Sorry, we don't know the type for file " + filename); 
 return false; 
} 
</script> 
<h1>Hi, [% username %]</h1> 
  <form id="uploader" action="https://images.share.lifelogs.com.s3.amazonaws.com/" 
     method="post" enctype="multipart/form-data" > 
   <input type="hidden" name="key" value="${filename}"> 
   <input type="hidden" name="AWSAccessKeyId" value="[% env.AWS_KEY %]"> 
   <input type="hidden" name="acl" value="public-read"> 
   <input type="hidden" name="success_action_redirect" 
       value="http://share.lifelogs.com/s3uploaded?user=[% username %]&name="> 
   <input type="hidden" name="policy" value="[% policy %]"> 
   <input type="hidden" name="Content-Type" value="image/jpeg"> 
   <input type="hidden" name="signature" value="[% signature %]"> 
   Select File to upload to S3: 
   <input name="file" type="file"> 
   <br> 
   Enter a Name: 
   <input name="name" type="text"> 
   <br> 
   <input type="submit" value="Upload File to S3"> 
  </form> 
  <form id="adder" action="/urluploaded" method="post" enctype="multipart/form-data"> 
   <input type="hidden" name="user" value="[% username %]"> 
   Enter a URL: 
   <input name="url" type="text"> 
   <br> 
   Enter a Name: 
   <input name="name" type="text"> 
   <br> 
   <input type="submit" value="Add URL"> 
  </form> 
 </body> 
</html> 

上一页  1 2 3 4 5 6  下一页

Tags:Perl Amazon 部分

编辑录入:爽爽 [复制链接] [打 印]
[]
  • 好
  • 好的评价 如果觉得好,就请您
      0%(0)
  • 差
  • 差的评价 如果觉得差,就请您
      0%(0)
赞助商链接