html Multiple file select and queue (add/delete) - javascript

What i want to do is to be able to select multiple files using the multiple attribute on tag but when starting to upload ( POST) each files will be uploaded individually + having the possibility to remove a file from the queue(this is what makes things even much harder, because adding files is not a problem since i can easily create another element but removing is impossible).
Now for security reasons its impossible to alter a file tag in html! so far what i have done is having a single file input and when selecting a file, a new element is created in its place so i am giving the illusion of a queue and then using jquery i upload each file individually! ( cant select multiple files at once but everything works)
I have found some flash plugins but i don't want to depend on more libraries, if it was a simple flash file no problem but most of those plugins need additional js files etc...
I would be happy to see a cross-browser solution. Again i know there are some flash plugins that can do this, but i am after a cleaner and simpler way maybe a single swf file or something ....
Thanks

Im pretty sure uploadify does all of this, and in a single simple small swf.

Related

Manipulating a HTML file input to dynamically add a link to the selected file WITHOUT uploading the file?

I am not sure if what I am asking is actually possible but let me try to explain. I am trying to allow users to link to a local file, from an internal web application. Instead of having to hard code every link, I was wondering if it was possible to manipulate a HTML file input so that the user could browse to the file they wanted to link to. I do not wish for the files to actually be uploaded anywhere since they are already on a local drive, it seems silly to duplicate them, and down the line this would lead to multiple duplications (the PDF's are per product, and the same product will be referenced on multiple occasions).
I am aware after some research that due to security reasons you are not able to obtain the file path of a selected file unless perhaps by the use of a temporary URL. See here. Unfortunately this seems to be a very temperamental solution and I can't seem to wrap my head around how it works.

Python http server uploading multiple files

I'm using the simplehttpwithupload.py script, which I have linked to below, to host a simple http server where people can upload files to me. Is there a way to modify the source code so that multiple files can be selected for upload at once? Such that when the select file dialog box comes up, users can ctrl/shift click and select several files which will then be uploaded.
https://www.dropbox.com/s/wshzyseignnz78x/simplehttpwithupload.py
Thanks
Is there a way to modify the source code so that multiple files can be selected for upload at once? Such that when the select file dialog box comes up, users can ctrl/shift click and select several files
I'm pretty sure there's not a simple way. Things may have improved, but when I looked into this a year or two ago, the only solution for exactly what you're looking for is Flash based. The problem is that the file selection dialog is on the client side and multiple file selection is not directly supported in the browser.
There is a JavaScript based solution for downloading multiple files, but it doesn't exactly match what you asked for. See Upload multiple files with a single file element for the explanation, and Multiple file uploader: Mootools version for a later, prettier version.
The main idea is:
you can only store file upload information in a file upload element (), you’ll always need to have one element per file to be uploaded.
it’s actually a relatively simple matter to conceal a file element once a file has been chosen, and add a new (empty) one in its place.
To apply the JavaScript solution to simplehttpwithupload.py, you'll have to rewrite the list_directory function.

Minifying dynamically loaded javascript whilst leaving it editable

So, I am using CodeIgniter to develop a website.
I noticed I had about ten javascript files all being loaded in my header even though they were not all being used on a given page.
As such I now pass an array to my header view which contains a list of the javascript files which need to be included. This way only the files I need on a given page are loaded.
I ran my site through a speed test, and although it is pretty fast it flagged up the numerous JS file loads and said to combine them into one file, and minify it.
I have my JS files as seperate files so I can use them as above, and also so if i want to edit my tabs js, I can easily find it in tabs.js
Combining all the javascripts into one file would remove the benefits above. Minifying them would make them a lot of effort to edit..
Is there a way of combining the JS files and minifying them when the server tries to load them, or any way to avoid the problems above?
Thanks

Calling javascript

I am setting up a site that relies on a lot of javascript items and i want to try and set it up so the pages only call what they need.
there are different types of functionality so i am goig to break them into their own js files to make it easy to use.
For example if there is a drag and drop functionality then i will include the js file for drag and drop. within that will be a generic call using a class to turn on the functionality. This way it is only used on a page that uses drag and drop.
This gets more compacted when i have ajax calls some are on change events on a select for example while others are on a button.
I could separate these into different files for each type perhaps.
my concern is if a call needs more parameters to be passed or a different url then where does this code go to make the call?
I don't really want to have code within the page itself if i can help it.
I would love to hear your thoughts on how to best set this up
RequireJS might be your answer:
RequireJS is a JavaScript file and module loader. It is optimized for
in-browser use, but it can be used in other JavaScript environments,
like Rhino and Node. Using a modular script loader like RequireJS will
improve the speed and quality of your code.
This sounds similar to what I'm doing, so here what I've done:
One central file that contains functions that are used pretty much everywhere.
A folder containing files that are used in several places, but aren't worth including everywhere.
A folder containing files that are only used on one page.
Then, simply include the necessary <script> tags and go!
Hmm, have you looked at existing frameworks http://speckyboy.com/2010/05/17/15-javascript-web-ui-libraries-frameworks-and-libraries/?

Tinymce compress other than tinyMCE_GZ.init

In continuation with the below post is there any way to take ahead the build.xml and add all the plugins such as table, save etc and compress it with the same build.xml file. Reason is to have one ant script file to compress all the files into one, not only the tinymce js files but also other project related files.
tinymce build script to compress all js files
I know the compressio is possible by declaring additional tinyMCE_GZ.init but why use two methods of the compression in same project. It would nice to have as described in above post using build.xml.
How does the plugin structure works it is possible to take everything in one file & still intantiate plugin, right now when I take out all the script tag from table plugin (i.e from table.htm) file I get javascript error even though the script tag is available into the parent html file from which table plugin is invoked..
I tried that, but i failed. I won't say it is impossible, but it will be pretty difficult to achieve. What i ended up doing is to use two compessing methods.

Categories