Attachments: start using fineuploader.com to upload attachments to messages.
[citadel.git] / webcit / static / t / edit / message / attachments_pane.html
index d4824078cb02b4b33520b1457e61adce961ce79c..b74ce35093087f01387b306694bab46f50827396 100644 (file)
@@ -1,4 +1,80 @@
+
 <div align="right">
 <div align="right">
+
+<a href="javascript:hide_attachments_form();">
+    <?_("Close window")>&nbsp;<img src="static/webcit_icons/closewindow.gif" border="0"></div>
+</a>
+<h2><img src="static/webcit_icons/essen/16x16/attachement.png">&nbsp;<?_("Attachments:")></h2>
+<ul><?ITERATE("MSG:ATTACHNAMES", ="edit_message_section_attach_select")></ul>
+
+<!-- Fine Uploader JS
+====================================================================== -->
+<!--script src="/fineuploader.js"></script-->
+<script type="text/javascript">
+function createUploader()
+{
+    var uploader = new qq.FineUploader(
+       {
+           callbacks: {
+               "onComplete": update_attachment_count,
+               "delete": update_attachment_count
+           },
+           element: document.getElementById('fine-uploader'),
+           request: {
+               endpoint: 'upload_attachment?nonce=<?NONCE>&template=edit_message_upl_att'
+           },
+           deleteFile: {
+               enabled: true,
+               forceConfirm: true,
+               endpoint: 'remove_attachment?nonce=<?NONCE>&template=edit_message_upl_att'
+           }
+       });
+}
+
+  window.onload = createUploader;
+</script>
+
+<!-- Fine Uploader CSS
+====================================================================== -->
+<!--link href="/fineuploader.css" rel="stylesheet"-->
+
+<!-- Fine Uploader DOM Element
+====================================================================== -->
+<div id="fine-uploader"></div>
+
+<!-- Fine Uploader template
+====================================================================== -->
+<script type="text/template" id="qq-template">
+  <div class="qq-uploader-selector qq-uploader">
+    <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
+      <span>Drop files here to upload</span>
+    </div>
+    <div class="qq-upload-button-selector qq-upload-button">
+      <div>Upload a file</div>
+    </div>
+    <span class="qq-drop-processing-selector qq-drop-processing">
+      <span>Processing dropped files...</span>
+      <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
+    </span>
+    <ul class="qq-upload-list-selector qq-upload-list">
+      <li>
+        <div class="qq-progress-bar-container-selector">
+          <div class="qq-progress-bar-selector qq-progress-bar"></div>
+        </div>
+        <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
+        <span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
+        <span class="qq-upload-file-selector qq-upload-file"></span>
+        <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
+        <span class="qq-upload-size-selector qq-upload-size"></span>
+        <a class="qq-upload-cancel-selector qq-upload-cancel" href="#">Cancel</a>
+        <a class="qq-upload-retry-selector qq-upload-retry" href="#">Retry</a>
+        <a class="qq-upload-delete-selector qq-upload-delete" href="#">Delete</a>
+        <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
+      </li>
+    </ul>
+  </div>
+</script>
+<!--
        <a href="javascript:hide_attachments_form();">
                <?_("Close window")>&nbsp;<img src="static/webcit_icons/closewindow.gif" border="0"></div>
        </a>
        <a href="javascript:hide_attachments_form();">
                <?_("Close window")>&nbsp;<img src="static/webcit_icons/closewindow.gif" border="0"></div>
        </a>
                        <?_("Upload")>&nbsp;<img src="static/webcit_icons/throbber.gif" border="0">
                </div>
        </form>
                        <?_("Upload")>&nbsp;<img src="static/webcit_icons/throbber.gif" border="0">
                </div>
        </form>
+
+-->
+
+<!--
+=================
+$("fileupload").observe("change",handleupload);
+
+function handleupload( e )
+{
+var el = e.findElement();
+new Ajax.Request("backend.php?uploadfile=1",{"method":"post","postBody":el.files[0],"onSuccess":returnupload});
+}
+
+backend.php
+=====================
+if(isset($_GET['uploadfile']))
+{
+$uploaded_file = file_get_contents("php://input");
+file_put_contents("/tmp/myfilename",$uploaded_file);
+} 
+
+!-->