1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
5 <title>Uploader Template</title>
7 <link rel="stylesheet" type="text/css" href="../../../framework/fss/css/fss-reset-global.css" />
8 <link rel="stylesheet" type="text/css" href="../../../framework/fss/css/fss-base-global.css" />
9 <link rel="stylesheet" type="text/css" href="../../../framework/fss/css/fss-text.css" />
10 <link rel="stylesheet" type="text/css" href="../../../framework/fss/css/fss-layout.css" />
11 <link rel="stylesheet" type="text/css" href="../css/Uploader.css" />
13 <!-- Fluid and jQuery Dependencies -->
14 <script type="text/javascript" src="../../../lib/jquery/core/js/jquery.js"></script>
15 <script type="text/javascript" src="../../../lib/jquery/ui/js/jquery.ui.core.js"></script>
16 <script type="text/javascript" src="../../../framework/core/js/jquery.keyboard-a11y.js"></script>
17 <script type="text/javascript" src="../../../lib/jquery/plugins/scrollTo/js/jquery.scrollTo.js"></script>
18 <script type="text/javascript" src="../../../lib/swfobject/js/swfobject.js"></script>
19 <script type="text/javascript" src="../../../lib/swfupload/js/swfupload.js"></script>
20 <script type="text/javascript" src="../../../framework/core/js/Fluid.js"></script>
21 <script type="text/javascript" src="../../../framework/core/js/FluidDocument.js"></script>
22 <script type="text/javascript" src="../../../framework/core/js/FluidView.js"></script>
23 <script type="text/javascript" src="../../../framework/core/js/DataBinding.js"></script>
24 <script type="text/javascript" src="../../../framework/core/js/FluidIoC.js"></script>
25 <script type="text/javascript" src="../../../framework/enhancement/js/ProgressiveEnhancement.js"></script>
27 <!-- Uploader dependencies -->
28 <script type="text/javascript" src="../js/Uploader.js"></script>
29 <script type="text/javascript" src="../js/FileQueue.js"></script>
30 <script type="text/javascript" src="../../progress/js/Progress.js"></script>
31 <script type="text/javascript" src="../js/FileQueueView.js"></script>
32 <script type="text/javascript" src="../js/ErrorPanel.js"></script>
33 <script type="text/javascript" src="../js/FlashUploaderSupport.js"></script>
34 <script type="text/javascript" src="../js/Flash9UploaderSupport.js"></script>
35 <script type="text/javascript" src="../js/HTML5UploaderSupport.js"></script>
36 <script type="text/javascript" src="../js/DemoUploadManager.js"></script>
37 <script type="text/javascript" src="../js/MimeTypeExtensions.js"></script>
42 <!-- Basic upload controls, used when JavaScript is unavailable -->
43 <form method="post" enctype="multipart/form-data" class="fl-progEnhance-basic">
44 <p>Use the Browse button to add a file, and the Save button to upload it.</p>
45 <input name="fileData" type="file" />
46 <input class="fl-uploader-basic-save" type="submit" value="Save"/>
49 <!-- Uploader container -->
50 <form class="flc-uploader fl-uploader fl-progEnhance-enhanced" method="get" enctype="multipart/form-data">
52 <!-- File Queue, which is split up into two separate tables: one for the header and body -->
53 <table class="fl-uploader-header">
55 <th class="fl-uploader-file-name">File Name</th>
56 <th class="fl-uploader-file-size">Size</th>
57 <th class="fl-uploader-file-actions"></th>
61 <!-- File Queue body, which is the default container for the FileQueueView component -->
62 <table summary="The list of files" class="flc-uploader-queue fl-uploader-queue">
63 <caption>File Upload Queue:</caption>
65 <!-- Template for file row -->
66 <tr class="flc-uploader-file-tmplt flc-uploader-file">
67 <td class="flc-uploader-file-name fl-uploader-file-name">File Name Placeholder</td>
68 <td class="flc-uploader-file-size fl-uploader-file-size">0 KB</td>
69 <td class="fl-uploader-file-actions">
70 <button type="button" class="flc-uploader-file-action" tabindex="-1"></button>
74 <!-- Template for error info row -->
75 <tr class="flc-uploader-file-error-tmplt fl-uploader-file-error">
76 <td colspan="3" class="flc-uploader-file-error"></td>
81 <!-- File progress bar template, used to generate progress bars for each file in the queue -->
82 <div class="flc-uploader-file-progressor-tmplt fl-uploader-file-progress"></div>
84 <!-- Initial instructions -->
85 <div class="flc-uploader-browse-instructions fl-uploader-browse-instructions">
86 Choose <em>Browse files</em> to add files to the queue.
89 <!-- Status footer -->
90 <div class="flc-uploader-queue-footer fl-uploader-queue-footer fl-clearfix">
91 <div class="fl-force-left">
92 <div class="flc-uploader-total-progress-text fl-uploader-total-progress-text">
95 <div class="flc-uploader-upload-limit-text"></div>
97 <div class="fl-text-align-right fl-force-right">
98 <span class="flc-uploader-button-browse fl-uploader-browse">
99 <span class="flc-uploader-button-browse-text">Browse files</span>
102 <!-- Total progress bar -->
103 <div class="flc-uploader-total-progress fl-uploader-total-progress-okay"></div>
104 <div class="flc-uploader-errorsPanel fl-uploader-errorsPanel">
105 <div class="fl-uploader-errorsPanel-header"><span class="flc-uploader-errorPanel-header">Warnings:</span></div>
107 <!-- The markup for each error section will be rendered into these containers. -->
108 <div class="flc-uploader-errorPanel-section-fileSize"></div>
109 <div class="flc-uploader-errorPanel-section-numFiles"></div>
111 <!-- Error section template.-->
112 <div class="flc-uploader-errorPanel-section-tmplt fl-uploader-hidden-templates">
113 <div class="fl-container-flex">
114 <div class="flc-uploader-errorPanel-section-title fl-uploader-errorPanel-section-title fl-force-left">
115 x files were too y and were not added to the queue.
117 <button type="button" class="flc-uploader-errorPanel-section-removeButton fl-uploader-errorPanel-section-removeButton fl-force-right">
118 <span class="flc-uploader-erroredButton-text fl-uploader-hidden">Remove error</span>
122 <div class="fl-container-flex">
123 <div class="flc-uploader-errorPanel-section-details fl-uploader-errorPanel-section-details">
124 <p>The following files were not added:</p>
125 <p class="flc-uploader-errorPanel-section-files">file_1, file_2, file_3, file_4, file_5 </p>
128 <div class="fl-container-flex">
129 <button type="button" class="flc-uploader-errorPanel-section-toggleDetails fl-uploader-errorPanel-section-toggleDetails">Hide this list</button>
135 <!-- Upload buttons -->
136 <div class="fl-uploader-buttons">
137 <button type="button" class="flc-uploader-button-pause fl-uploader-button-stop fl-uploader-hidden">Stop Upload</button>
138 <button type="button" class="flc-uploader-button-upload fl-uploader-button-upload fl-uploader-dim">Upload</button>
141 <div class="flc-uploader-status-region fl-offScreen-hidden"></div>
144 <script type="text/javascript">
145 var myUploader = fluid.uploader(".flc-uploader", {