├── Html5UploadDemo ├── Views │ ├── _ViewStart.cshtml │ ├── Shared │ │ ├── Error.cshtml │ │ └── _Layout.cshtml │ └── Web.config ├── Global.asax ├── packages.config ├── Controllers │ └── FileController.cs ├── Content │ └── styles │ │ └── styles.css ├── Global.asax.cs ├── Web.Debug.config ├── Web.Release.config ├── Properties │ └── AssemblyInfo.cs ├── Web.config ├── Scripts │ ├── knockout-models.js │ ├── main.js │ ├── domReady.js │ ├── src │ │ └── html5Upload.js │ ├── require.js │ ├── knockout-2.1.0.js │ └── jquery-1.8.2.min.js ├── index.html └── Html5UploadDemo.csproj ├── packages └── repositories.config ├── .gitignore ├── license.txt ├── Html5Upload.sln └── README.md /Html5UploadDemo/Views/_ViewStart.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | Layout = "~/Views/Shared/_Layout.cshtml"; 3 | } -------------------------------------------------------------------------------- /Html5UploadDemo/Global.asax: -------------------------------------------------------------------------------- 1 | <%@ Application Codebehind="Global.asax.cs" Inherits="Html5UploadDemo.MvcApplication" Language="C#" %> 2 | -------------------------------------------------------------------------------- /packages/repositories.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /Html5UploadDemo/packages.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /Html5UploadDemo/Views/Shared/Error.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | Layout = null; 3 | } 4 | 5 | 6 | 7 | 8 | Error 9 | 10 | 11 |

12 | Sorry, an error occurred while processing your request. 13 |

14 | 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Build and Object Folders 2 | bin/ 3 | obj/ 4 | Obj/ 5 | 6 | #User Specific Files 7 | *.user 8 | *.suo 9 | *.userprefs 10 | *.pidb 11 | 12 | 13 | #Resource Caches 14 | _ReSharper.* 15 | *.sln.cache 16 | 17 | #Upgrade Report Files 18 | _UpgradeReport_Files/ 19 | 20 | #Nuget 21 | packages/** 22 | !packages/repositories.config 23 | /IAmMec.Web/logs/*.log 24 | 25 | # CloudService Package 26 | csx/ -------------------------------------------------------------------------------- /Html5UploadDemo/Views/Shared/_Layout.cshtml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | @ViewBag.Title 6 | 7 | 8 | 9 | 10 | 11 | 12 | @RenderBody() 13 | 14 | 15 | -------------------------------------------------------------------------------- /Html5UploadDemo/Controllers/FileController.cs: -------------------------------------------------------------------------------- 1 | using System.Web; 2 | using System.Web.Mvc; 3 | 4 | namespace Html5UploadDemo.Controllers 5 | { 6 | public class FileController : Controller 7 | { 8 | public ActionResult Upload(HttpPostedFileBase file) 9 | { 10 | return Json(new 11 | { 12 | Success = true, 13 | FileName = file.FileName, 14 | FileSize = file.ContentLength 15 | }, JsonRequestBehavior.AllowGet); 16 | } 17 | 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /Html5UploadDemo/Content/styles/styles.css: -------------------------------------------------------------------------------- 1 | body { font-family: sans-serif; font-size: 14px; line-height: 1.6em; } 2 | .body { width: 800px; margin: 10px auto; } 3 | 4 | /* Upload image dialog */ 5 | .uploadimage-dragndrop { border: 2px dashed #DDD; margin: 20px 0; padding: 50px 20px; text-align: center; color: #DDD; } 6 | .uploadimage-text { font-size: 32px; margin-bottom: 20px; } 7 | .uploadimage-input { margin: 20px 0; } 8 | .uploadimage-upload { background: #EEE; margin: 4px 0; } 9 | .uploadimage-uploadcompleted { background: #d1f4ac; } 10 | .uploadimage-fileinfo { padding: 5px; font-size: 11px; position: relative; } 11 | .uploadimage-progresspct { position: absolute; top: 5px; right: 5px; } 12 | .uploadimage-progress { background: #999; } 13 | .uploadimage-progressbar { background: maroon; height: 2px; } 14 | .uploadimage-totalprogress { background: #999; } 15 | .uploadimage-totalprogressbar { background: #107EC2; height: 6px; } 16 | 17 | .description { margin: 40px 0; } -------------------------------------------------------------------------------- /license.txt: -------------------------------------------------------------------------------- 1 | Copyright 2014 Devbridge Group and other contributors 2 | http://www.devbridge.com/sourcery/components/drag-and-drop-uploader/ 3 | 4 | Permission is hereby granted, free of charge, to any person obtaining 5 | a copy of this software and associated documentation files (the 6 | "Software"), to deal in the Software without restriction, including 7 | without limitation the rights to use, copy, modify, merge, publish, 8 | distribute, sublicense, and/or sell copies of the Software, and to 9 | permit persons to whom the Software is furnished to do so, subject to 10 | the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be 13 | included in all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 16 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 17 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 18 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE 19 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 20 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 21 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -------------------------------------------------------------------------------- /Html5Upload.sln: -------------------------------------------------------------------------------- 1 | 2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio 2012 4 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Html5UploadDemo", "Html5UploadDemo\Html5UploadDemo.csproj", "{C4D1CC8C-E3B1-4371-A71C-0BA22658C8C7}" 5 | EndProject 6 | Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Items", "Solution Items", "{28DF863F-1455-4237-9198-6991685B9736}" 7 | ProjectSection(SolutionItems) = preProject 8 | README.md = README.md 9 | EndProjectSection 10 | EndProject 11 | Global 12 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 13 | Debug|Any CPU = Debug|Any CPU 14 | Release|Any CPU = Release|Any CPU 15 | EndGlobalSection 16 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 17 | {C4D1CC8C-E3B1-4371-A71C-0BA22658C8C7}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 18 | {C4D1CC8C-E3B1-4371-A71C-0BA22658C8C7}.Debug|Any CPU.Build.0 = Debug|Any CPU 19 | {C4D1CC8C-E3B1-4371-A71C-0BA22658C8C7}.Release|Any CPU.ActiveCfg = Release|Any CPU 20 | {C4D1CC8C-E3B1-4371-A71C-0BA22658C8C7}.Release|Any CPU.Build.0 = Release|Any CPU 21 | EndGlobalSection 22 | GlobalSection(SolutionProperties) = preSolution 23 | HideSolutionNode = FALSE 24 | EndGlobalSection 25 | EndGlobal 26 | -------------------------------------------------------------------------------- /Html5UploadDemo/Global.asax.cs: -------------------------------------------------------------------------------- 1 | using System.Web.Mvc; 2 | using System.Web.Routing; 3 | 4 | namespace Html5UploadDemo 5 | { 6 | // Note: For instructions on enabling IIS6 or IIS7 classic mode, 7 | // visit http://go.microsoft.com/?LinkId=9394801 8 | 9 | public class MvcApplication : System.Web.HttpApplication 10 | { 11 | public static void RegisterGlobalFilters(GlobalFilterCollection filters) 12 | { 13 | filters.Add(new HandleErrorAttribute()); 14 | } 15 | 16 | public static void RegisterRoutes(RouteCollection routes) 17 | { 18 | routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); 19 | routes.IgnoreRoute("{resource}.html"); 20 | 21 | routes.MapRoute( 22 | "Default", // Route name 23 | "file/upload", // URL with parameters 24 | new { controller = "File", action = "Upload", id = UrlParameter.Optional } // Parameter defaults 25 | ); 26 | 27 | } 28 | 29 | protected void Application_Start() 30 | { 31 | //AreaRegistration.RegisterAllAreas(); 32 | 33 | //RegisterGlobalFilters(GlobalFilters.Filters); 34 | RegisterRoutes(RouteTable.Routes); 35 | } 36 | } 37 | } -------------------------------------------------------------------------------- /Html5UploadDemo/Web.Debug.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 17 | 18 | 29 | 30 | -------------------------------------------------------------------------------- /Html5UploadDemo/Web.Release.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 17 | 18 | 19 | 30 | 31 | -------------------------------------------------------------------------------- /Html5UploadDemo/Properties/AssemblyInfo.cs: -------------------------------------------------------------------------------- 1 | using System.Reflection; 2 | using System.Runtime.CompilerServices; 3 | using System.Runtime.InteropServices; 4 | 5 | // General Information about an assembly is controlled through the following 6 | // set of attributes. Change these attribute values to modify the information 7 | // associated with an assembly. 8 | [assembly: AssemblyTitle("Html5UploadDemo")] 9 | [assembly: AssemblyDescription("")] 10 | [assembly: AssemblyConfiguration("")] 11 | [assembly: AssemblyCompany("")] 12 | [assembly: AssemblyProduct("Html5UploadDemo")] 13 | [assembly: AssemblyCopyright("Copyright © 2012")] 14 | [assembly: AssemblyTrademark("")] 15 | [assembly: AssemblyCulture("")] 16 | 17 | // Setting ComVisible to false makes the types in this assembly not visible 18 | // to COM components. If you need to access a type in this assembly from 19 | // COM, set the ComVisible attribute to true on that type. 20 | [assembly: ComVisible(false)] 21 | 22 | // The following GUID is for the ID of the typelib if this project is exposed to COM 23 | [assembly: Guid("26c33285-b6b7-437a-8e7e-2f218516fcb7")] 24 | 25 | // Version information for an assembly consists of the following four values: 26 | // 27 | // Major Version 28 | // Minor Version 29 | // Build Number 30 | // Revision 31 | // 32 | // You can specify all the values or you can default the Revision and Build Numbers 33 | // by using the '*' as shown below: 34 | [assembly: AssemblyVersion("1.0.0.0")] 35 | [assembly: AssemblyFileVersion("1.0.0.0")] 36 | -------------------------------------------------------------------------------- /Html5UploadDemo/Web.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /Html5UploadDemo/Scripts/knockout-models.js: -------------------------------------------------------------------------------- 1 | /*jslint browser:true*/ 2 | /*global define*/ 3 | 4 | define(['knockout'], function (ko) { 5 | 'use strict'; 6 | 7 | function trimTrailingZeros(number) { 8 | return number.toFixed(1).replace(/\.0+$/, ''); 9 | } 10 | 11 | function formatFileSize(sizeInBytes) { 12 | var kiloByte = 1024, 13 | megaByte = Math.pow(kiloByte, 2), 14 | gigaByte = Math.pow(kiloByte, 3); 15 | 16 | if (sizeInBytes < kiloByte) { 17 | return sizeInBytes + ' B'; 18 | } 19 | 20 | if (sizeInBytes < megaByte) { 21 | return trimTrailingZeros(sizeInBytes / kiloByte) + ' kB'; 22 | } 23 | 24 | if (sizeInBytes < gigaByte) { 25 | return trimTrailingZeros(sizeInBytes / megaByte) + ' MB'; 26 | } 27 | 28 | return trimTrailingZeros(sizeInBytes / gigaByte) + ' GB'; 29 | } 30 | 31 | return { 32 | UploadsViewModel: function () { 33 | this.uploads = ko.observableArray([]); 34 | this.showTotalProgress = ko.observable(); 35 | this.uploadSpeedFormatted = ko.observable(); 36 | this.timeRemainingFormatted = ko.observable(); 37 | this.totalProgress = ko.observable(); 38 | }, 39 | 40 | FileViewModel: function (file) { 41 | this.file = file; 42 | this.uploadProgress = ko.observable(0); 43 | this.uploadCompleted = ko.observable(false); 44 | this.uploadSpeedFormatted = ko.observable(); 45 | this.fileName = file.fileName; 46 | this.fileSizeFormated = formatFileSize(file.fileSize); 47 | }, 48 | 49 | applyBindings: function (model, context) { 50 | ko.applyBindings(model, context); 51 | } 52 | }; 53 | 54 | }); 55 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # HTML5 AJAX File Uploader Module 2 | ================================ 3 | 4 | **This module abstracts HTML5 file and drag and drop API and manages file upload process** 5 | 6 | * Free, open source (MIT license) 7 | * Pure JavaScript - works with any web framework 8 | * Small & lightweight 9 | * No dependencies 10 | 11 | Samples on how to use module and create custom user interface for file uploads are available. 12 | 13 | ## Demos 14 | 15 | * [HTML5 Drag & Drop Ajax File Uploader](https://www.devbridge.com/sourcery/components/drag-and-drop-uploader/) 16 | 17 | ## Usage 18 | 19 | html5Upload.initialize({ 20 | // URL that handles uploaded files 21 | uploadUrl: '/file/upload', 22 | 23 | // HTML element on which files should be dropped (optional) 24 | dropContainer: document.getElementById('dragndropimage'), 25 | 26 | // HTML file input element that allows to select files (optional) 27 | inputField: document.getElementById('upload-input'), 28 | 29 | // Key for the file data (optional, default: 'file') 30 | key: 'File', 31 | 32 | // Additional data submitted with file (optional) 33 | data: { ProjectId: 1, ProjectName: 'Demo' }, 34 | 35 | // Maximum number of simultaneous uploads 36 | // Other uploads will be added to uploads queue (optional) 37 | maxSimultaneousUploads: 2, 38 | 39 | // Callback for each dropped or selected file 40 | // It receives one argument, add callbacks 41 | // by passing events map object: file.on({ ... }) 42 | onFileAdded: function (file) { 43 | 44 | var fileModel = new models.FileViewModel(file); 45 | uploadsModel.uploads.push(fileModel); 46 | 47 | file.on({ 48 | // Called after received response from the server 49 | onCompleted: function (response) { 50 | fileModel.uploadCompleted(true); 51 | }, 52 | // Called during upload progress, first parameter 53 | // is decimal value from 0 to 100. 54 | onProgress: function (progress, fileSize, uploadedBytes) { 55 | fileModel.uploadProgress(parseInt(progress, 10)); 56 | } 57 | }); 58 | } 59 | }); 60 | 61 | 62 | ## Support 63 | 64 | IE10+, Firefox 15+, Chrome 22+, Safari 6+, Opera 12+ 65 | 66 | ## Authors 67 | 68 | Tomas Kirda / [@tkirda](https://twitter.com/tkirda) 69 | -------------------------------------------------------------------------------- /Html5UploadDemo/Scripts/main.js: -------------------------------------------------------------------------------- 1 | /*global require, alert*/ 2 | /*jslint browser:true*/ 3 | 4 | require.config({ 5 | paths: { 6 | knockout: '/scripts/knockout-2.1.0' 7 | } 8 | }); 9 | 10 | require(['src/html5Upload', 'domReady', 'knockout-models'], function (html5Upload, domReady, models) { 11 | 'use strict'; 12 | 13 | domReady(function () { 14 | if (html5Upload.fileApiSupported()) { 15 | 16 | var context = document.getElementById('upload-liveuploads'), 17 | uploadsModel = new models.UploadsViewModel(); 18 | 19 | html5Upload.initialize({ 20 | // URL that handles uploaded files 21 | uploadUrl: '/file/upload', 22 | 23 | // HTML element on which files should be dropped (optional) 24 | dropContainer: document.getElementById('dragndropimage'), 25 | 26 | // HTML file input element that allows to select files (optional) 27 | inputField: document.getElementById('upload-input'), 28 | 29 | // Key for the file data (optional, default: 'file') 30 | key: 'File', 31 | 32 | // Additional data submitted with file (optional) 33 | data: { ProjectId: 1, ProjectName: 'Demo' }, 34 | 35 | // Maximum number of simultaneous uploads 36 | // Other uploads will be added to uploads queue (optional) 37 | maxSimultaneousUploads: 2, 38 | 39 | // Callback for each dropped or selected file 40 | // It receives one argument, add callbacks 41 | // by passing events map object: file.on({ ... }) 42 | onFileAdded: function (file) { 43 | 44 | var fileModel = new models.FileViewModel(file); 45 | uploadsModel.uploads.push(fileModel); 46 | 47 | file.on({ 48 | // Called after received response from the server 49 | onCompleted: function (response) { 50 | fileModel.uploadCompleted(true); 51 | }, 52 | 53 | // Called during upload progress, first parameter 54 | // is decimal value from 0 to 100. 55 | onProgress: function (progress, fileSize, uploadedBytes) { 56 | fileModel.uploadProgress(parseInt(progress, 10)); 57 | } 58 | }); 59 | } 60 | }); 61 | 62 | models.applyBindings(uploadsModel, context); 63 | } 64 | }); 65 | }); 66 | -------------------------------------------------------------------------------- /Html5UploadDemo/Views/Web.config: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 |
7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 39 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /Html5UploadDemo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | HTML5 Upload Demo 5 | 6 | 7 | 8 |
9 |
10 |

HTML5 Ajax Uploader Demo

11 |
12 | 13 |
14 |
Drag images here
15 |
Or, if you prefer...
16 |
17 | 18 |
19 |
20 | 21 |
22 | 23 |
24 |

RequireJS, Knockout and Uploader Harmony

25 |

26 | Scripts are loaded using module loader RequireJS. This demo 27 | demonstrates how to use html5 ajax uploader and knockout to customize UI for uploads. 28 |

29 | 30 |

Show me the code

31 | 32 |
33 | 34 | 57 | 58 | 59 | 60 | 61 |
62 | 63 | 64 | -------------------------------------------------------------------------------- /Html5UploadDemo/Scripts/domReady.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @license RequireJS domReady 2.0.1 Copyright (c) 2010-2012, The Dojo Foundation All Rights Reserved. 3 | * Available via the MIT or new BSD license. 4 | * see: http://github.com/requirejs/domReady for details 5 | */ 6 | /*jslint */ 7 | /*global require: false, define: false, requirejs: false, 8 | window: false, clearInterval: false, document: false, 9 | self: false, setInterval: false */ 10 | 11 | 12 | define(function () { 13 | 'use strict'; 14 | 15 | var isTop, testDiv, scrollIntervalId, 16 | isBrowser = typeof window !== "undefined" && window.document, 17 | isPageLoaded = !isBrowser, 18 | doc = isBrowser ? document : null, 19 | readyCalls = []; 20 | 21 | function runCallbacks(callbacks) { 22 | var i; 23 | for (i = 0; i < callbacks.length; i += 1) { 24 | callbacks[i](doc); 25 | } 26 | } 27 | 28 | function callReady() { 29 | var callbacks = readyCalls; 30 | 31 | if (isPageLoaded) { 32 | //Call the DOM ready callbacks 33 | if (callbacks.length) { 34 | readyCalls = []; 35 | runCallbacks(callbacks); 36 | } 37 | } 38 | } 39 | 40 | /** 41 | * Sets the page as loaded. 42 | */ 43 | function pageLoaded() { 44 | if (!isPageLoaded) { 45 | isPageLoaded = true; 46 | if (scrollIntervalId) { 47 | clearInterval(scrollIntervalId); 48 | } 49 | 50 | callReady(); 51 | } 52 | } 53 | 54 | if (isBrowser) { 55 | if (document.addEventListener) { 56 | //Standards. Hooray! Assumption here that if standards based, 57 | //it knows about DOMContentLoaded. 58 | document.addEventListener("DOMContentLoaded", pageLoaded, false); 59 | window.addEventListener("load", pageLoaded, false); 60 | } else if (window.attachEvent) { 61 | window.attachEvent("onload", pageLoaded); 62 | 63 | testDiv = document.createElement('div'); 64 | try { 65 | isTop = window.frameElement === null; 66 | } catch (e) {} 67 | 68 | //DOMContentLoaded approximation that uses a doScroll, as found by 69 | //Diego Perini: http://javascript.nwbox.com/IEContentLoaded/, 70 | //but modified by other contributors, including jdalton 71 | if (testDiv.doScroll && isTop && window.external) { 72 | scrollIntervalId = setInterval(function () { 73 | try { 74 | testDiv.doScroll(); 75 | pageLoaded(); 76 | } catch (e) {} 77 | }, 30); 78 | } 79 | } 80 | 81 | //Check if document already complete, and if so, just trigger page load 82 | //listeners. Latest webkit browsers also use "interactive", and 83 | //will fire the onDOMContentLoaded before "interactive" but not after 84 | //entering "interactive" or "complete". More details: 85 | //http://dev.w3.org/html5/spec/the-end.html#the-end 86 | //http://stackoverflow.com/questions/3665561/document-readystate-of-interactive-vs-ondomcontentloaded 87 | //Hmm, this is more complicated on further use, see "firing too early" 88 | //bug: https://github.com/requirejs/domReady/issues/1 89 | //so removing the || document.readyState === "interactive" test. 90 | //There is still a window.onload binding that should get fired if 91 | //DOMContentLoaded is missed. 92 | if (document.readyState === "complete") { 93 | pageLoaded(); 94 | } 95 | } 96 | 97 | /** START OF PUBLIC API **/ 98 | 99 | /** 100 | * Registers a callback for DOM ready. If DOM is already ready, the 101 | * callback is called immediately. 102 | * @param {Function} callback 103 | */ 104 | function domReady(callback) { 105 | if (isPageLoaded) { 106 | callback(doc); 107 | } else { 108 | readyCalls.push(callback); 109 | } 110 | return domReady; 111 | } 112 | 113 | domReady.version = '2.0.1'; 114 | 115 | /** 116 | * Loader Plugin API method 117 | */ 118 | domReady.load = function (name, req, onLoad, config) { 119 | if (config.isBuild) { 120 | onLoad(null); 121 | } else { 122 | domReady(onLoad); 123 | } 124 | }; 125 | 126 | /** END OF PUBLIC API **/ 127 | 128 | return domReady; 129 | }); 130 | -------------------------------------------------------------------------------- /Html5UploadDemo/Html5UploadDemo.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Debug 6 | AnyCPU 7 | 8 | 9 | 2.0 10 | {C4D1CC8C-E3B1-4371-A71C-0BA22658C8C7} 11 | {E53F8FEA-EAE0-44A6-8774-FFD645390401};{349c5851-65df-11da-9384-00065b846f21};{fae04ec0-301f-11d3-bf4b-00c04f79efbc} 12 | Library 13 | Properties 14 | Html5UploadDemo 15 | Html5UploadDemo 16 | v4.0 17 | false 18 | true 19 | 20 | 21 | 22 | 23 | 24 | 25 | true 26 | full 27 | false 28 | bin\ 29 | DEBUG;TRACE 30 | prompt 31 | 4 32 | 33 | 34 | pdbonly 35 | true 36 | bin\ 37 | TRACE 38 | prompt 39 | 4 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | True 64 | ..\packages\Microsoft.Web.Infrastructure.1.0.0.0\lib\net40\Microsoft.Web.Infrastructure.dll 65 | 66 | 67 | True 68 | ..\packages\Microsoft.AspNet.WebPages.1.0.20105.408\lib\net40\System.Web.Helpers.dll 69 | 70 | 71 | True 72 | ..\packages\Microsoft.AspNet.Mvc.3.0.20105.1\lib\net40\System.Web.Mvc.dll 73 | 74 | 75 | ..\packages\Microsoft.AspNet.Providers.Core.1.0\lib\net40\System.Web.Providers.dll 76 | 77 | 78 | True 79 | ..\packages\Microsoft.AspNet.Razor.1.0.20105.408\lib\net40\System.Web.Razor.dll 80 | 81 | 82 | True 83 | ..\packages\Microsoft.AspNet.WebPages.1.0.20105.408\lib\net40\System.Web.WebPages.dll 84 | 85 | 86 | True 87 | ..\packages\Microsoft.AspNet.WebPages.1.0.20105.408\lib\net40\System.Web.WebPages.Deployment.dll 88 | 89 | 90 | True 91 | ..\packages\Microsoft.AspNet.WebPages.1.0.20105.408\lib\net40\System.Web.WebPages.Razor.dll 92 | 93 | 94 | 95 | 96 | 97 | Global.asax 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | jquery-1.8.2.js 108 | 109 | 110 | 111 | 112 | 113 | jquery-1.8.2.js 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | Web.config 122 | 123 | 124 | Web.config 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 10.0 134 | $(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion) 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | True 147 | True 148 | 0 149 | / 150 | http://localhost:3071/ 151 | False 152 | False 153 | 154 | 155 | False 156 | 157 | 158 | 159 | 160 | 166 | -------------------------------------------------------------------------------- /Html5UploadDemo/Scripts/src/html5Upload.js: -------------------------------------------------------------------------------- 1 | /*jslint unparam: true, browser: true, devel: true */ 2 | /*global define*/ 3 | 4 | define(function () { 5 | 'use strict'; 6 | 7 | var module = {}, 8 | noop = function () { }, 9 | console = window.console || { log: noop }, 10 | supportsFileApi; 11 | 12 | // Upload manager constructor: 13 | function UploadManager(options) { 14 | var self = this; 15 | self.dropContainer = options.dropContainer; 16 | self.inputField = options.inputField; 17 | self.uploadsQueue = []; 18 | self.activeUploads = 0; 19 | self.data = options.data; 20 | self.key = options.key; 21 | self.maxSimultaneousUploads = options.maxSimultaneousUploads || -1; 22 | self.onFileAdded = options.onFileAdded || noop; 23 | self.uploadUrl = options.uploadUrl; 24 | self.onFileAddedProxy = function (upload) { 25 | console.log('Event: onFileAdded, file: ' + upload.fileName); 26 | self.onFileAdded(upload); 27 | }; 28 | 29 | self.initialize(); 30 | } 31 | 32 | // FileUpload proxy class: 33 | function FileUpload(file) { 34 | var self = this; 35 | 36 | self.file = file; 37 | self.fileName = file.name; 38 | self.fileSize = file.size; 39 | self.uploadSize = file.size; 40 | self.uploadedBytes = 0; 41 | self.eventHandlers = {}; 42 | self.events = { 43 | onProgress: function (fileSize, uploadedBytes) { 44 | var progress = uploadedBytes / fileSize * 100; 45 | console.log('Event: upload onProgress, progress = ' + progress + ', fileSize = ' + fileSize + ', uploadedBytes = ' + uploadedBytes); 46 | (self.eventHandlers.onProgress || noop)(progress, fileSize, uploadedBytes); 47 | }, 48 | onStart: function () { 49 | console.log('Event: upload onStart'); 50 | (self.eventHandlers.onStart || noop)(); 51 | }, 52 | onCompleted: function (data) { 53 | console.log('Event: upload onCompleted, data = ' + data); 54 | file = null; 55 | (self.eventHandlers.onCompleted || noop)(data); 56 | } 57 | }; 58 | } 59 | 60 | FileUpload.prototype = { 61 | on: function (eventHandlers) { 62 | this.eventHandlers = eventHandlers; 63 | } 64 | }; 65 | 66 | UploadManager.prototype = { 67 | 68 | initialize: function () { 69 | console.log('Initializing upload manager'); 70 | var manager = this, 71 | dropContainer = manager.dropContainer, 72 | inputField = manager.inputField, 73 | cancelEvent = function (e) { 74 | e.preventDefault(); 75 | e.stopPropagation(); 76 | }, 77 | dragOverOnClass = function(e){ 78 | cancelEvent(e); 79 | dropContainer.classList.add('drag-over'); 80 | }, 81 | dragOverOffClass = function(e){ 82 | cancelEvent(e); 83 | dropContainer.classList.remove('drag-over'); 84 | }; 85 | 86 | if (dropContainer) { 87 | /* 88 | * Original code 89 | manager.on(dropContainer, 'dragover', cancelEvent); 90 | manager.on(dropContainer, 'dragenter', cancelEvent); 91 | manager.on(dropContainer, 'drop', function (e) { 92 | cancelEvent(e); 93 | manager.processFiles(e.dataTransfer.files); 94 | }); 95 | */ 96 | 97 | manager.on(dropContainer, 'dragenter', dragOverOnClass); 98 | manager.on(dropContainer, 'dragover', dragOverOnClass); 99 | manager.on(dropContainer, 'dragleave', dragOverOffClass); 100 | manager.on(dropContainer, 'drop', function (e) { 101 | cancelEvent(e); 102 | dragOverOffClass(e); 103 | manager.processFiles(e.dataTransfer.files); 104 | }); 105 | } 106 | 107 | if (inputField) { 108 | manager.on(inputField, 'change', function () { 109 | manager.processFiles(this.files); 110 | }); 111 | } 112 | }, 113 | 114 | processFiles: function (files) { 115 | console.log('Processing files: ' + files.length); 116 | var manager = this, 117 | len = files.length, 118 | file, 119 | upload, 120 | i; 121 | 122 | for (i = 0; i < len; i += 1) { 123 | file = files[i]; 124 | if (file.size === 0) { 125 | alert('Files with files size zero cannot be uploaded or multiple file uploads are not supported by your browser'); 126 | break; 127 | } 128 | 129 | upload = new FileUpload(file); 130 | manager.uploadFile(upload); 131 | } 132 | }, 133 | 134 | uploadFile: function (upload) { 135 | var manager = this; 136 | 137 | manager.onFileAdded(upload); 138 | 139 | // Queue upload if maximum simultaneous uploads reached: 140 | if (manager.activeUploads === manager.maxSimultaneousUploads) { 141 | console.log('Queue upload: ' + upload.fileName); 142 | manager.uploadsQueue.push(upload); 143 | return; 144 | } 145 | 146 | manager.ajaxUpload(upload); 147 | }, 148 | 149 | ajaxUpload: function (upload) { 150 | var manager = this, 151 | xhr, 152 | formData, 153 | fileName, 154 | file = upload.file, 155 | prop, 156 | data = manager.data, 157 | key = manager.key || 'file'; 158 | 159 | console.log('Beging upload: ' + upload.fileName); 160 | manager.activeUploads += 1; 161 | 162 | xhr = new window.XMLHttpRequest(); 163 | formData = new window.FormData(); 164 | fileName = file.name; 165 | 166 | xhr.open('POST', manager.uploadUrl); 167 | xhr.setRequestHeader('Accept', 'application/json, text/javascript', '*/*'); 168 | 169 | // Triggered when upload starts: 170 | xhr.upload.onloadstart = function () { 171 | // File size is not reported during start! 172 | console.log('Upload started: ' + fileName); 173 | upload.events.onStart(); 174 | }; 175 | 176 | // Triggered many times during upload: 177 | xhr.upload.onprogress = function (event) { 178 | if (!event.lengthComputable) { 179 | return; 180 | } 181 | 182 | // Update file size because it might be bigger than reported by the fileSize: 183 | upload.events.onProgress(event.total, event.loaded); 184 | }; 185 | 186 | // Triggered when upload is completed: 187 | xhr.onload = function (event) { 188 | console.log('Upload completed: ' + fileName); 189 | 190 | // Reduce number of active uploads: 191 | manager.activeUploads -= 1; 192 | 193 | upload.events.onCompleted(event.target.responseText); 194 | 195 | // Check if there are any uploads left in a queue: 196 | if (manager.uploadsQueue.length) { 197 | manager.ajaxUpload(manager.uploadsQueue.shift()); 198 | } 199 | }; 200 | 201 | // Triggered when upload fails: 202 | xhr.onerror = function () { 203 | console.log('Upload failed: ', upload.fileName); 204 | }; 205 | 206 | // Append additional data if provided: 207 | if (data) { 208 | for (prop in data) { 209 | if (data.hasOwnProperty(prop)) { 210 | console.log('Adding data: ' + prop + ' = ' + data[prop]); 211 | formData.append(prop, data[prop]); 212 | } 213 | } 214 | } 215 | 216 | // Append file data: 217 | formData.append(key, file); 218 | 219 | // Initiate upload: 220 | xhr.send(formData); 221 | }, 222 | 223 | // Event handlers: 224 | on: function (element, eventName, handler) { 225 | if (!element) { 226 | return; 227 | } 228 | if (element.addEventListener) { 229 | element.addEventListener(eventName, handler, false); 230 | } else if (element.attachEvent) { 231 | element.attachEvent('on' + eventName, handler); 232 | } else { 233 | element['on' + eventName] = handler; 234 | } 235 | } 236 | }; 237 | 238 | module.fileApiSupported = function () { 239 | if (typeof supportsFileApi !== 'boolean') { 240 | var input = document.createElement("input"); 241 | input.setAttribute("type", "file"); 242 | supportsFileApi = !!input.files; 243 | } 244 | 245 | return supportsFileApi; 246 | }; 247 | 248 | module.initialize = function (options) { 249 | return new UploadManager(options); 250 | }; 251 | 252 | return module; 253 | }); 254 | -------------------------------------------------------------------------------- /Html5UploadDemo/Scripts/require.js: -------------------------------------------------------------------------------- 1 | /* 2 | RequireJS 2.1.1 Copyright (c) 2010-2012, The Dojo Foundation All Rights Reserved. 3 | Available via the MIT or new BSD license. 4 | see: http://github.com/jrburke/requirejs for details 5 | */ 6 | var requirejs,require,define; 7 | (function(W){function D(b){return M.call(b)==="[object Function]"}function E(b){return M.call(b)==="[object Array]"}function t(b,c){if(b){var d;for(d=0;d-1;d-=1)if(b[d]&&c(b[d],d,b))break}}function A(b,c){for(var d in b)if(b.hasOwnProperty(d)&&c(b[d],d))break}function O(b,c,d,g){c&&A(c,function(c,j){if(d||!F.call(b,j))g&&typeof c!=="string"?(b[j]||(b[j]={}),O(b[j],c,d,g)):b[j]=c});return b}function r(b,c){return function(){return c.apply(b, 8 | arguments)}}function X(b){if(!b)return b;var c=W;t(b.split("."),function(b){c=c[b]});return c}function G(b,c,d,g){c=Error(c+"\nhttp://requirejs.org/docs/errors.html#"+b);c.requireType=b;c.requireModules=g;if(d)c.originalError=d;return c}function ba(){if(H&&H.readyState==="interactive")return H;N(document.getElementsByTagName("script"),function(b){if(b.readyState==="interactive")return H=b});return H}var g,s,u,y,q,B,H,I,Y,Z,ca=/(\/\*([\s\S]*?)\*\/|([^:]|^)\/\/(.*)$)/mg,da=/[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g, 9 | $=/\.js$/,ea=/^\.\//;s=Object.prototype;var M=s.toString,F=s.hasOwnProperty,fa=Array.prototype.splice,v=!!(typeof window!=="undefined"&&navigator&&document),aa=!v&&typeof importScripts!=="undefined",ga=v&&navigator.platform==="PLAYSTATION 3"?/^complete$/:/^(complete|loaded)$/,R=typeof opera!=="undefined"&&opera.toString()==="[object Opera]",w={},n={},P=[],J=!1;if(typeof define==="undefined"){if(typeof requirejs!=="undefined"){if(D(requirejs))return;n=requirejs;requirejs=void 0}typeof require!=="undefined"&& 10 | !D(require)&&(n=require,require=void 0);g=requirejs=function(b,c,d,p){var i,j="_";!E(b)&&typeof b!=="string"&&(i=b,E(c)?(b=c,c=d,d=p):b=[]);if(i&&i.context)j=i.context;(p=w[j])||(p=w[j]=g.s.newContext(j));i&&p.configure(i);return p.require(b,c,d)};g.config=function(b){return g(b)};g.nextTick=typeof setTimeout!=="undefined"?function(b){setTimeout(b,4)}:function(b){b()};require||(require=g);g.version="2.1.1";g.jsExtRegExp=/^\/|:|\?|\.js$/;g.isBrowser=v;s=g.s={contexts:w,newContext:function(b){function c(a, 11 | f,x){var e,m,b,c,d,h,i,g=f&&f.split("/");e=g;var j=k.map,l=j&&j["*"];if(a&&a.charAt(0)===".")if(f){e=k.pkgs[f]?g=[f]:g.slice(0,g.length-1);f=a=e.concat(a.split("/"));for(e=0;f[e];e+=1)if(m=f[e],m===".")f.splice(e,1),e-=1;else if(m==="..")if(e===1&&(f[2]===".."||f[0]===".."))break;else e>0&&(f.splice(e-1,2),e-=2);e=k.pkgs[f=a[0]];a=a.join("/");e&&a===f+"/"+e.main&&(a=f)}else a.indexOf("./")===0&&(a=a.substring(2));if(x&&(g||l)&&j){f=a.split("/");for(e=f.length;e>0;e-=1){b=f.slice(0,e).join("/");if(g)for(m= 12 | g.length;m>0;m-=1)if(x=j[g.slice(0,m).join("/")])if(x=x[b]){c=x;d=e;break}if(c)break;!h&&l&&l[b]&&(h=l[b],i=e)}!c&&h&&(c=h,d=i);c&&(f.splice(0,d,c),a=f.join("/"))}return a}function d(a){v&&t(document.getElementsByTagName("script"),function(f){if(f.getAttribute("data-requiremodule")===a&&f.getAttribute("data-requirecontext")===h.contextName)return f.parentNode.removeChild(f),!0})}function p(a){var f=k.paths[a];if(f&&E(f)&&f.length>1)return d(a),f.shift(),h.require.undef(a),h.require([a]),!0}function i(a){var f, 13 | b=a?a.indexOf("!"):-1;b>-1&&(f=a.substring(0,b),a=a.substring(b+1,a.length));return[f,a]}function j(a,f,b,e){var m,K,d=null,g=f?f.name:null,j=a,l=!0,k="";a||(l=!1,a="_@r"+(M+=1));a=i(a);d=a[0];a=a[1];d&&(d=c(d,g,e),K=o[d]);a&&(d?k=K&&K.normalize?K.normalize(a,function(a){return c(a,g,e)}):c(a,g,e):(k=c(a,g,e),a=i(k),d=a[0],k=a[1],b=!0,m=h.nameToUrl(k)));b=d&&!K&&!b?"_unnormalized"+(N+=1):"";return{prefix:d,name:k,parentMap:f,unnormalized:!!b,url:m,originalName:j,isDefine:l,id:(d?d+"!"+k:k)+b}}function n(a){var f= 14 | a.id,b=l[f];b||(b=l[f]=new h.Module(a));return b}function q(a,f,b){var e=a.id,m=l[e];if(F.call(o,e)&&(!m||m.defineEmitComplete))f==="defined"&&b(o[e]);else n(a).on(f,b)}function z(a,f){var b=a.requireModules,e=!1;if(f)f(a);else if(t(b,function(f){if(f=l[f])f.error=a,f.events.error&&(e=!0,f.emit("error",a))}),!e)g.onError(a)}function s(){P.length&&(fa.apply(C,[C.length-1,0].concat(P)),P=[])}function u(a,f,b){var e=a.map.id;a.error?a.emit("error",a.error):(f[e]=!0,t(a.depMaps,function(e,c){var d=e.id, 15 | g=l[d];g&&!a.depMatched[c]&&!b[d]&&(f[d]?(a.defineDep(c,o[d]),a.check()):u(g,f,b))}),b[e]=!0)}function w(){var a,f,b,e,m=(b=k.waitSeconds*1E3)&&h.startTime+b<(new Date).getTime(),c=[],g=[],i=!1,j=!0;if(!S){S=!0;A(l,function(b){a=b.map;f=a.id;if(b.enabled&&(a.isDefine||g.push(b),!b.error))if(!b.inited&&m)p(f)?i=e=!0:(c.push(f),d(f));else if(!b.inited&&b.fetched&&a.isDefine&&(i=!0,!a.prefix))return j=!1});if(m&&c.length)return b=G("timeout","Load timeout for modules: "+c,null,c),b.contextName=h.contextName, 16 | z(b);j&&t(g,function(a){u(a,{},{})});if((!m||e)&&i)if((v||aa)&&!T)T=setTimeout(function(){T=0;w()},50);S=!1}}function y(a){n(j(a[0],null,!0)).init(a[1],a[2])}function B(a){var a=a.currentTarget||a.srcElement,b=h.onScriptLoad;a.detachEvent&&!R?a.detachEvent("onreadystatechange",b):a.removeEventListener("load",b,!1);b=h.onScriptError;a.detachEvent&&!R||a.removeEventListener("error",b,!1);return{node:a,id:a&&a.getAttribute("data-requiremodule")}}function I(){var a;for(s();C.length;)if(a=C.shift(),a[0]=== 17 | null)return z(G("mismatch","Mismatched anonymous define() module: "+a[a.length-1]));else y(a)}var S,U,h,L,T,k={waitSeconds:7,baseUrl:"./",paths:{},pkgs:{},shim:{},map:{},config:{}},l={},V={},C=[],o={},Q={},M=1,N=1;L={require:function(a){return a.require?a.require:a.require=h.makeRequire(a.map)},exports:function(a){a.usingExports=!0;if(a.map.isDefine)return a.exports?a.exports:a.exports=o[a.map.id]={}},module:function(a){return a.module?a.module:a.module={id:a.map.id,uri:a.map.url,config:function(){return k.config&& 18 | k.config[a.map.id]||{}},exports:o[a.map.id]}}};U=function(a){this.events=V[a.id]||{};this.map=a;this.shim=k.shim[a.id];this.depExports=[];this.depMaps=[];this.depMatched=[];this.pluginMaps={};this.depCount=0};U.prototype={init:function(a,b,c,e){e=e||{};if(!this.inited){this.factory=b;if(c)this.on("error",c);else this.events.error&&(c=r(this,function(a){this.emit("error",a)}));this.depMaps=a&&a.slice(0);this.errback=c;this.inited=!0;this.ignore=e.ignore;e.enabled||this.enabled?this.enable():this.check()}}, 19 | defineDep:function(a,b){this.depMatched[a]||(this.depMatched[a]=!0,this.depCount-=1,this.depExports[a]=b)},fetch:function(){if(!this.fetched){this.fetched=!0;h.startTime=(new Date).getTime();var a=this.map;if(this.shim)h.makeRequire(this.map,{enableBuildCallback:!0})(this.shim.deps||[],r(this,function(){return a.prefix?this.callPlugin():this.load()}));else return a.prefix?this.callPlugin():this.load()}},load:function(){var a=this.map.url;Q[a]||(Q[a]=!0,h.load(this.map.id,a))},check:function(){if(this.enabled&& 20 | !this.enabling){var a,b,c=this.map.id;b=this.depExports;var e=this.exports,m=this.factory;if(this.inited)if(this.error)this.emit("error",this.error);else{if(!this.defining){this.defining=!0;if(this.depCount<1&&!this.defined){if(D(m)){if(this.events.error)try{e=h.execCb(c,m,b,e)}catch(d){a=d}else e=h.execCb(c,m,b,e);if(this.map.isDefine)if((b=this.module)&&b.exports!==void 0&&b.exports!==this.exports)e=b.exports;else if(e===void 0&&this.usingExports)e=this.exports;if(a)return a.requireMap=this.map, 21 | a.requireModules=[this.map.id],a.requireType="define",z(this.error=a)}else e=m;this.exports=e;if(this.map.isDefine&&!this.ignore&&(o[c]=e,g.onResourceLoad))g.onResourceLoad(h,this.map,this.depMaps);delete l[c];this.defined=!0}this.defining=!1;if(this.defined&&!this.defineEmitted)this.defineEmitted=!0,this.emit("defined",this.exports),this.defineEmitComplete=!0}}else this.fetch()}},callPlugin:function(){var a=this.map,b=a.id,d=j(a.prefix);this.depMaps.push(d);q(d,"defined",r(this,function(e){var m, 22 | d;d=this.map.name;var x=this.map.parentMap?this.map.parentMap.name:null,i=h.makeRequire(a.parentMap,{enableBuildCallback:!0,skipMap:!0});if(this.map.unnormalized){if(e.normalize&&(d=e.normalize(d,function(a){return c(a,x,!0)})||""),e=j(a.prefix+"!"+d,this.map.parentMap),q(e,"defined",r(this,function(a){this.init([],function(){return a},null,{enabled:!0,ignore:!0})})),d=l[e.id]){this.depMaps.push(e);if(this.events.error)d.on("error",r(this,function(a){this.emit("error",a)}));d.enable()}}else m=r(this, 23 | function(a){this.init([],function(){return a},null,{enabled:!0})}),m.error=r(this,function(a){this.inited=!0;this.error=a;a.requireModules=[b];A(l,function(a){a.map.id.indexOf(b+"_unnormalized")===0&&delete l[a.map.id]});z(a)}),m.fromText=r(this,function(b,e){var f=a.name,c=j(f),d=J;e&&(b=e);d&&(J=!1);n(c);try{g.exec(b)}catch(x){throw Error("fromText eval for "+f+" failed: "+x);}d&&(J=!0);this.depMaps.push(c);h.completeLoad(f);i([f],m)}),e.load(a.name,i,m,k)}));h.enable(d,this);this.pluginMaps[d.id]= 24 | d},enable:function(){this.enabling=this.enabled=!0;t(this.depMaps,r(this,function(a,b){var c,e;if(typeof a==="string"){a=j(a,this.map.isDefine?this.map:this.map.parentMap,!1,!this.skipMap);this.depMaps[b]=a;if(c=L[a.id]){this.depExports[b]=c(this);return}this.depCount+=1;q(a,"defined",r(this,function(a){this.defineDep(b,a);this.check()}));this.errback&&q(a,"error",this.errback)}c=a.id;e=l[c];!L[c]&&e&&!e.enabled&&h.enable(a,this)}));A(this.pluginMaps,r(this,function(a){var b=l[a.id];b&&!b.enabled&& 25 | h.enable(a,this)}));this.enabling=!1;this.check()},on:function(a,b){var c=this.events[a];c||(c=this.events[a]=[]);c.push(b)},emit:function(a,b){t(this.events[a],function(a){a(b)});a==="error"&&delete this.events[a]}};h={config:k,contextName:b,registry:l,defined:o,urlFetched:Q,defQueue:C,Module:U,makeModuleMap:j,nextTick:g.nextTick,configure:function(a){a.baseUrl&&a.baseUrl.charAt(a.baseUrl.length-1)!=="/"&&(a.baseUrl+="/");var b=k.pkgs,c=k.shim,e={paths:!0,config:!0,map:!0};A(a,function(a,b){e[b]? 26 | b==="map"?O(k[b],a,!0,!0):O(k[b],a,!0):k[b]=a});if(a.shim)A(a.shim,function(a,b){E(a)&&(a={deps:a});if(a.exports&&!a.exportsFn)a.exportsFn=h.makeShimExports(a);c[b]=a}),k.shim=c;if(a.packages)t(a.packages,function(a){a=typeof a==="string"?{name:a}:a;b[a.name]={name:a.name,location:a.location||a.name,main:(a.main||"main").replace(ea,"").replace($,"")}}),k.pkgs=b;A(l,function(a,b){if(!a.inited&&!a.map.unnormalized)a.map=j(b)});if(a.deps||a.callback)h.require(a.deps||[],a.callback)},makeShimExports:function(a){return function(){var b; 27 | a.init&&(b=a.init.apply(W,arguments));return b||X(a.exports)}},makeRequire:function(a,f){function d(e,c,i){var k,p;if(f.enableBuildCallback&&c&&D(c))c.__requireJsBuild=!0;if(typeof e==="string"){if(D(c))return z(G("requireargs","Invalid require call"),i);if(a&&L[e])return L[e](l[a.id]);if(g.get)return g.get(h,e,a);k=j(e,a,!1,!0);k=k.id;return!F.call(o,k)?z(G("notloaded",'Module name "'+k+'" has not been loaded yet for context: '+b+(a?"":". Use require([])"))):o[k]}I();h.nextTick(function(){I();p= 28 | n(j(null,a));p.skipMap=f.skipMap;p.init(e,c,i,{enabled:!0});w()});return d}f=f||{};O(d,{isBrowser:v,toUrl:function(b){var d=b.lastIndexOf("."),f=null;d!==-1&&(f=b.substring(d,b.length),b=b.substring(0,d));return h.nameToUrl(c(b,a&&a.id,!0),f)},defined:function(b){b=j(b,a,!1,!0).id;return F.call(o,b)},specified:function(b){b=j(b,a,!1,!0).id;return F.call(o,b)||F.call(l,b)}});if(!a)d.undef=function(b){s();var c=j(b,a,!0),d=l[b];delete o[b];delete Q[c.url];delete V[b];if(d){if(d.events.defined)V[b]= 29 | d.events;delete l[b]}};return d},enable:function(a){l[a.id]&&n(a).enable()},completeLoad:function(a){var b,c,d=k.shim[a]||{},g=d.exports;for(s();C.length;){c=C.shift();if(c[0]===null){c[0]=a;if(b)break;b=!0}else c[0]===a&&(b=!0);y(c)}c=l[a];if(!b&&!o[a]&&c&&!c.inited)if(k.enforceDefine&&(!g||!X(g)))if(p(a))return;else return z(G("nodefine","No define call for "+a,null,[a]));else y([a,d.deps||[],d.exportsFn]);w()},nameToUrl:function(a,b){var c,d,i,h,j,l;if(g.jsExtRegExp.test(a))h=a+(b||"");else{c= 30 | k.paths;d=k.pkgs;h=a.split("/");for(j=h.length;j>0;j-=1)if(l=h.slice(0,j).join("/"),i=d[l],l=c[l]){E(l)&&(l=l[0]);h.splice(0,j,l);break}else if(i){c=a===i.name?i.location+"/"+i.main:i.location;h.splice(0,j,c);break}h=h.join("/");h+=b||(/\?/.test(h)?"":".js");h=(h.charAt(0)==="/"||h.match(/^[\w\+\.\-]+:/)?"":k.baseUrl)+h}return k.urlArgs?h+((h.indexOf("?")===-1?"?":"&")+k.urlArgs):h},load:function(a,b){g.load(h,a,b)},execCb:function(a,b,c,d){return b.apply(d,c)},onScriptLoad:function(a){if(a.type=== 31 | "load"||ga.test((a.currentTarget||a.srcElement).readyState))H=null,a=B(a),h.completeLoad(a.id)},onScriptError:function(a){var b=B(a);if(!p(b.id))return z(G("scripterror","Script error",a,[b.id]))}};h.require=h.makeRequire();return h}};g({});t(["toUrl","undef","defined","specified"],function(b){g[b]=function(){var c=w._;return c.require[b].apply(c,arguments)}});if(v&&(u=s.head=document.getElementsByTagName("head")[0],y=document.getElementsByTagName("base")[0]))u=s.head=y.parentNode;g.onError=function(b){throw b; 32 | };g.load=function(b,c,d){var g=b&&b.config||{},i;if(v)return i=g.xhtml?document.createElementNS("http://www.w3.org/1999/xhtml","html:script"):document.createElement("script"),i.type=g.scriptType||"text/javascript",i.charset="utf-8",i.async=!0,i.setAttribute("data-requirecontext",b.contextName),i.setAttribute("data-requiremodule",c),i.attachEvent&&!(i.attachEvent.toString&&i.attachEvent.toString().indexOf("[native code")<0)&&!R?(J=!0,i.attachEvent("onreadystatechange",b.onScriptLoad)):(i.addEventListener("load", 33 | b.onScriptLoad,!1),i.addEventListener("error",b.onScriptError,!1)),i.src=d,I=i,y?u.insertBefore(i,y):u.appendChild(i),I=null,i;else aa&&(importScripts(d),b.completeLoad(c))};v&&N(document.getElementsByTagName("script"),function(b){if(!u)u=b.parentNode;if(q=b.getAttribute("data-main")){if(!n.baseUrl)B=q.split("/"),Y=B.pop(),Z=B.length?B.join("/")+"/":"./",n.baseUrl=Z,q=Y;q=q.replace($,"");n.deps=n.deps?n.deps.concat(q):[q];return!0}});define=function(b,c,d){var g,i;typeof b!=="string"&&(d=c,c=b,b= 34 | null);E(c)||(d=c,c=[]);!c.length&&D(d)&&d.length&&(d.toString().replace(ca,"").replace(da,function(b,d){c.push(d)}),c=(d.length===1?["require"]:["require","exports","module"]).concat(c));if(J&&(g=I||ba()))b||(b=g.getAttribute("data-requiremodule")),i=w[g.getAttribute("data-requirecontext")];(i?i.defQueue:P).push([b,c,d])};define.amd={jQuery:!0};g.exec=function(b){return eval(b)};g(n)}})(this); 35 | -------------------------------------------------------------------------------- /Html5UploadDemo/Scripts/knockout-2.1.0.js: -------------------------------------------------------------------------------- 1 | // Knockout JavaScript library v2.1.0 2 | // (c) Steven Sanderson - http://knockoutjs.com/ 3 | // License: MIT (http://www.opensource.org/licenses/mit-license.php) 4 | 5 | (function(window,document,navigator,undefined){ 6 | function m(w){throw w;}var n=void 0,p=!0,s=null,t=!1;function A(w){return function(){return w}};function E(w){function B(b,c,d){d&&c!==a.k.r(b)&&a.k.S(b,c);c!==a.k.r(b)&&a.a.va(b,"change")}var a="undefined"!==typeof w?w:{};a.b=function(b,c){for(var d=b.split("."),f=a,g=0;g",c[0];);return 4a.a.j(c,b[e])&&c.push(b[e]);return c},T:function(a,b){for(var a=a||[],c=[], 9 | e=0,f=a.length;ea.length?t:a.substring(0,b.length)===b},eb:function(a,b){for(var c="return ("+a+")",e=0;e",""]||!d.indexOf("",""]||(!d.indexOf("",""]||[0,"",""];b="ignored
"+d[1]+b+d[2]+"
";for("function"==typeof window.innerShiv?c.appendChild(window.innerShiv(b)):c.innerHTML=b;d[0]--;)c=c.lastChild;c=a.a.L(c.lastChild.childNodes)}return c}; 24 | a.a.Y=function(b,c){a.a.ga(b);if(c!==s&&c!==n)if("string"!=typeof c&&(c=c.toString()),"undefined"!=typeof jQuery)jQuery(b).html(c);else for(var d=a.a.pa(c),f=0;f"},Va:function(a,b){var c=d[a];c===n&&m(Error("Couldn't find any memo with ID "+a+". Perhaps it's already been unmemoized."));try{return c.apply(s,b||[]),p}finally{delete d[a]}},Wa:function(b,d){var e=[];c(b,e);for(var h=0,j=e.length;hc;c++)b=b();return b})};a.toJSON=function(b,c,e){b=a.Ta(b);return a.a.sa(b,c,e)}})();a.b("toJS",a.Ta);a.b("toJSON",a.toJSON);(function(){a.k={r:function(b){switch(a.a.o(b)){case "option":return b.__ko__hasDomDataOptionValue__===p?a.a.f.get(b,a.c.options.oa):b.getAttribute("value");case "select":return 0<=b.selectedIndex?a.k.r(b.options[b.selectedIndex]):n;default:return b.value}},S:function(b,c){switch(a.a.o(b)){case "option":switch(typeof c){case "string":a.a.f.set(b,a.c.options.oa, 39 | n);"__ko__hasDomDataOptionValue__"in b&&delete b.__ko__hasDomDataOptionValue__;b.value=c;break;default:a.a.f.set(b,a.c.options.oa,c),b.__ko__hasDomDataOptionValue__=p,b.value="number"===typeof c?c:""}break;case "select":for(var d=b.options.length-1;0<=d;d--)if(a.k.r(b.options[d])==c){b.selectedIndex=d;break}break;default:if(c===s||c===n)c="";b.value=c}}}})();a.b("selectExtensions",a.k);a.b("selectExtensions.readValue",a.k.r);a.b("selectExtensions.writeValue",a.k.S);a.g=function(){function b(a,b){for(var d= 40 | s;a!=d;)d=a,a=a.replace(c,function(a,c){return b[c]});return a}var c=/\@ko_token_(\d+)\@/g,d=/^[\_$a-z][\_$a-z0-9]*(\[.*?\])*(\.[\_$a-z][\_$a-z0-9]*(\[.*?\])*)*$/i,f=["true","false"];return{D:[],W:function(c){var e=a.a.w(c);if(3>e.length)return[];"{"===e.charAt(0)&&(e=e.substring(1,e.length-1));for(var c=[],d=s,f,k=0;k$/: 45 | /^\s*ko\s+(.*\:.*)\s*$/,h=g?/^<\!--\s*\/ko\s*--\>$/:/^\s*\/ko\s*$/,j={ul:p,ol:p};a.e={C:{},childNodes:function(a){return b(a)?d(a):a.childNodes},ha:function(c){if(b(c))for(var c=a.e.childNodes(c),e=0,d=c.length;e"),t))}};a.c.uniqueName.gb=0;a.c.checked={init:function(b,c,d){a.a.n(b,"click",function(){var f;if("checkbox"==b.type)f=b.checked;else if("radio"==b.type&&b.checked)f=b.value;else return;var g=c();"checkbox"==b.type&&a.a.d(g)instanceof Array?(f=a.a.j(a.a.d(g),b.value), 62 | b.checked&&0>f?g.push(b.value):!b.checked&&0<=f&&g.splice(f,1)):a.g.$(g,d,"checked",f,p)});"radio"==b.type&&!b.name&&a.c.uniqueName.init(b,A(p))},update:function(b,c){var d=a.a.d(c());"checkbox"==b.type?b.checked=d instanceof Array?0<=a.a.j(d,b.value):d:"radio"==b.type&&(b.checked=b.value==d)}};var F={"class":"className","for":"htmlFor"};a.c.attr={update:function(b,c){var d=a.a.d(c())||{},f;for(f in d)if("string"==typeof f){var g=a.a.d(d[f]),e=g===t||g===s||g===n;e&&b.removeAttribute(f);8>=a.a.ja&& 63 | f in F?(f=F[f],e?b.removeAttribute(f):b[f]=g):e||b.setAttribute(f,g.toString())}}};a.c.hasfocus={init:function(b,c,d){function f(b){var e=c();a.g.$(e,d,"hasfocus",b,p)}a.a.n(b,"focus",function(){f(p)});a.a.n(b,"focusin",function(){f(p)});a.a.n(b,"blur",function(){f(t)});a.a.n(b,"focusout",function(){f(t)})},update:function(b,c){var d=a.a.d(c());d?b.focus():b.blur();a.a.va(b,d?"focusin":"focusout")}};a.c["with"]={p:function(b){return function(){var c=b();return{"if":c,data:c,templateEngine:a.q.K}}}, 64 | init:function(b,c){return a.c.template.init(b,a.c["with"].p(c))},update:function(b,c,d,f,g){return a.c.template.update(b,a.c["with"].p(c),d,f,g)}};a.g.D["with"]=t;a.e.C["with"]=p;a.c["if"]={p:function(b){return function(){return{"if":b(),templateEngine:a.q.K}}},init:function(b,c){return a.c.template.init(b,a.c["if"].p(c))},update:function(b,c,d,f,g){return a.c.template.update(b,a.c["if"].p(c),d,f,g)}};a.g.D["if"]=t;a.e.C["if"]=p;a.c.ifnot={p:function(b){return function(){return{ifnot:b(),templateEngine:a.q.K}}}, 65 | init:function(b,c){return a.c.template.init(b,a.c.ifnot.p(c))},update:function(b,c,d,f,g){return a.c.template.update(b,a.c.ifnot.p(c),d,f,g)}};a.g.D.ifnot=t;a.e.C.ifnot=p;a.c.foreach={p:function(b){return function(){var c=a.a.d(b());return!c||"number"==typeof c.length?{foreach:c,templateEngine:a.q.K}:{foreach:c.data,includeDestroyed:c.includeDestroyed,afterAdd:c.afterAdd,beforeRemove:c.beforeRemove,afterRender:c.afterRender,templateEngine:a.q.K}}},init:function(b,c){return a.c.template.init(b,a.c.foreach.p(c))}, 66 | update:function(b,c,d,f,g){return a.c.template.update(b,a.c.foreach.p(c),d,f,g)}};a.g.D.foreach=t;a.e.C.foreach=p;a.t=function(){};a.t.prototype.renderTemplateSource=function(){m(Error("Override renderTemplateSource"))};a.t.prototype.createJavaScriptEvaluatorBlock=function(){m(Error("Override createJavaScriptEvaluatorBlock"))};a.t.prototype.makeTemplateSource=function(b,c){if("string"==typeof b){var c=c||document,d=c.getElementById(b);d||m(Error("Cannot find template with ID "+b));return new a.l.i(d)}if(1== 67 | b.nodeType||8==b.nodeType)return new a.l.M(b);m(Error("Unknown template type: "+b))};a.t.prototype.renderTemplate=function(a,c,d,f){return this.renderTemplateSource(this.makeTemplateSource(a,f),c,d)};a.t.prototype.isTemplateRewritten=function(a,c){return this.allowTemplateRewriting===t||!(c&&c!=document)&&this.V&&this.V[a]?p:this.makeTemplateSource(a,c).data("isRewritten")};a.t.prototype.rewriteTemplate=function(a,c,d){var f=this.makeTemplateSource(a,d),c=c(f.text());f.text(c);f.data("isRewritten", 68 | p);!(d&&d!=document)&&"string"==typeof a&&(this.V=this.V||{},this.V[a]=p)};a.b("templateEngine",a.t);a.Z=function(){function b(b,c,e){for(var b=a.g.W(b),d=a.g.D,j=0;j/g;return{mb:function(b,c,e){c.isTemplateRewritten(b,e)||c.rewriteTemplate(b,function(b){return a.Z.zb(b,c)},e)},zb:function(a,g){return a.replace(c,function(a,c,d,f,i,l,q){return b(q,c,g)}).replace(d,function(a,c){return b(c,"<\!-- ko --\>",g)})},Za:function(b){return a.s.na(function(c, 70 | e){c.nextSibling&&a.ya(c.nextSibling,b,e)})}}}();a.b("templateRewriting",a.Z);a.b("templateRewriting.applyMemoizedBindingsToNextSibling",a.Z.Za);(function(){a.l={};a.l.i=function(a){this.i=a};a.l.i.prototype.text=function(){var b=a.a.o(this.i),b="script"===b?"text":"textarea"===b?"value":"innerHTML";if(0==arguments.length)return this.i[b];var c=arguments[0];"innerHTML"===b?a.a.Y(this.i,c):this.i[b]=c};a.l.i.prototype.data=function(b){if(1===arguments.length)return a.a.f.get(this.i,"templateSourceData_"+ 71 | b);a.a.f.set(this.i,"templateSourceData_"+b,arguments[1])};a.l.M=function(a){this.i=a};a.l.M.prototype=new a.l.i;a.l.M.prototype.text=function(){if(0==arguments.length){var b=a.a.f.get(this.i,"__ko_anon_template__")||{};b.ua===n&&b.da&&(b.ua=b.da.innerHTML);return b.ua}a.a.f.set(this.i,"__ko_anon_template__",{ua:arguments[0]})};a.l.i.prototype.nodes=function(){if(0==arguments.length)return(a.a.f.get(this.i,"__ko_anon_template__")||{}).da;a.a.f.set(this.i,"__ko_anon_template__",{da:arguments[0]})}; 72 | a.b("templateSources",a.l);a.b("templateSources.domElement",a.l.i);a.b("templateSources.anonymousTemplate",a.l.M)})();(function(){function b(b,c,d){for(var f,c=a.e.nextSibling(c);b&&(f=b)!==c;)b=a.e.nextSibling(f),(1===f.nodeType||8===f.nodeType)&&d(f)}function c(c,d){if(c.length){var f=c[0],g=c[c.length-1];b(f,g,function(b){a.xa(d,b)});b(f,g,function(b){a.s.Wa(b,[d])})}}function d(a){return a.nodeType?a:0a.a.ja)&&b.nodes?b.nodes():s; 83 | if(c)return a.a.L(c.cloneNode(p).childNodes);b=b.text();return a.a.pa(b)};a.q.K=new a.q;a.ra(a.q.K);a.b("nativeTemplateEngine",a.q);(function(){a.ma=function(){var a=this.vb=function(){if("undefined"==typeof jQuery||!jQuery.tmpl)return 0;try{if(0<=jQuery.tmpl.tag.tmpl.open.toString().indexOf("__"))return 2}catch(a){}return 1}();this.renderTemplateSource=function(b,f,g){g=g||{};2>a&&m(Error("Your version of jQuery.tmpl is too old. Please upgrade to jQuery.tmpl 1.0.0pre or later."));var e=b.data("precompiled"); 84 | e||(e=b.text()||"",e=jQuery.template(s,"{{ko_with $item.koBindingContext}}"+e+"{{/ko_with}}"),b.data("precompiled",e));b=[f.$data];f=jQuery.extend({koBindingContext:f},g.templateOptions);f=jQuery.tmpl(e,b,f);f.appendTo(document.createElement("div"));jQuery.fragments={};return f};this.createJavaScriptEvaluatorBlock=function(a){return"{{ko_code ((function() { return "+a+" })()) }}"};this.addTemplate=function(a,b){document.write("