Better interface for file downloads and uploads from a web page? - html

I have what seems like a typical usage scenario for users downloading, editing and uploading a document from a web page.
User clicks a link to download a document
User edits downloaded file
User saves the file
User goes back to the web page and uploads the new file with the changes
The problem is that downloaded files are typically saved in a temporary directory, so it can be difficult to find the file after it is saved. The application is for very non-technical users, and I can already imagine the problems with saved files being lost or the wrong versions being uploaded.
Is there a better way? Things I've thought about:
Using Google Docs or something similar.
Problems: forcing users to use new
application with less features,
importing legacy content, setting up
accounts for everyone to edit a
file.
Using WebDAV to serve the files. Not sure how this would work exactly, but seems like it should be possible
Some kind of Flash or Java app that manages downloads and uploads. Not sure if these even exist.
User education :)
If it matters, the files will be mostly Word and Powerpoint documents.

Actually, despite the fact that you have more flexibility with AJAX in developing application, the problem of uploading multiple files is not solved yet.
To the thoughts you've mentioned in your question:
Google Docs:
Online apps like Google docs are certainly appealing for certain use cases. However, if you'd like to upload Word and Powerpoint slides, you don't want the content to be changed once you've uploaded the document. The problem is that Google Docs uses its own data format and therefore changes some of the formats. If you go for an online app, I'd go for a Document Management Solution. I'm sure there are plenty (even free ones) out there; however, I didn't use any on them yet.
WebDAV It is possible and seems to me like the best solution. You can embed WebDav like any directory. Documents are locked until a user releases the document. Unfortunately, you don't have a web front end to manage the files or administer access restrictions.
It
Flash or Java app They do exist, for sure. I'd prefer Flash over Java since Flash Apps still run smoother within a browser. I would definitely not use a rich application, even if it is a Java Web Start app that can be downloaded and opens in a separate window. More and more, users seem to accept browser based web applications. Which brings me to point 4:
User education You can educate them, sure. But in the end you want them to want to use the system. Most often, users get easily used to a tool. However, if they don't like the tool, they're not going to use it.

Clear instructions to save to their desktop is a start. Then clear instructions to go to the desktop to re-up it. I've not run across an online MSWord viewer/editor or whatever format the file is, but I'm sure they exist, now that Google Docs and a few other online versions of MSOffice exist.

I would make sure that there are easy to follow instructions, plus a tutorial somewhere else (perhaps with a video too) to guide users through the process.

Related

Why are file:// paths always treated as cross-domain?

Why can't a local page like
file:///C:/index.html
Send a request for a resource
file:///C:/data.json
This is prevented because it's a cross origin request, but in what way is that cross origin? I don't understand why this is a vulnerability / prevented. It just seems like a massive pain when I want to whip up a quick utility for something in JavaScript/HTML and I can't run it without uploading to to a server somewhere because of this seemingly arbitrary restriction.
HTML files are expected to be "safe". Tricking people into saving an HTML document to their hard drive and then opening it is not difficult (Here, just open the HTML file attached to this email would cause many email clients to automatically safe it to a tmp directory and open it in the default application).
If JavaScript in that file had permission to read any file on the disk, then users would be extremely vulnerable.
It's the same reason that software like Microsoft Word prompts before allowing macros to run.
It protects you from malicious HTML files reading from your hard drive.
On a real server, you are (hopefully) not serving arbitrary files, but on your local machine, you could very easily trick users into loading whatever you want.
Browsers are set up with security measures to make sure that ordinary users won't be at increased risk. Imagine that I'm a malicious website and I have you download something to your filesystem that looks, to you, like a regular website. Imagine that downloaded HTML can access other parts of your file system and then send that data to me through AJAX or perhaps another piece of executable code on the filesystem that came with this package. To a regular user this might look like a regular website that just "opened up a little weird but I still got it to work." If the browser prevents that, they're safer.
It's possible to turn these flags off (as in here: How to launch html using Chrome at "--allow-file-access-from-files" mode?), but that's more for knowledgeable users ("power users"), and probably comes with some kind of warning about how your browsing session isn't secure.
For the kind of scenarios you're talking about, you should be able to spin up a local HTTP server of some sort - perhaps using Python, Ruby, or node.js (I imagine node.js would be an attractive option for testing javascript base apps).

Accessing OneDrive as a StorageFolder from the local storage

I have been developing one Windows Store app for Win 8.1. Is there a way to access the user's OneDrive which is already synced on the hard drive? I need to access it as a StorageFolder. Similarly to KnownFolders and all the libraries. The reason behind that is that I am doing something like a gallery app that displays thumbnails of videos and pictures. When the users decides the app shows the media in full size and if it is a video, it is played. The app counts on the fact that OneDrive automatically syncs all the data, so it does need to be retrieved via the Live SDK API. If I use REST, it will be just too slow. Do you know if there is a way to achieve the mentioned approach effectively or maybe some alternative?
I have been researching extensively, but with no avail.
Thank you!
All the best,
Rosko
As Nate mentioned, you gain access to the folder through the FolderPicker API. There's no direct way to obtain the StorageFolder for that location.
Once you get that StorageFolder and enumerate contents, the extra piece you want to know about is the StorageFile.isAvailable API, as well as StorageFile.getThumbnailAsync/getScaledImageAsThumbnailAsync. The isAvailable flag is what tells you whether a file has actually been downloaded/synced, because the user might have indicated "online only" for any files.
I write about this a bit in Chapter 11 of my free ebook Programming Windows Store Apps with HTML, CSS, and JavaScript, 2nd Edition (page 575, pages 593-597), including a table about how OneDrive availability works with metered networks. This includes using thumbnails.
There's also a talk from //build 2013 on this, "What New in Working with Files" by Marc Wautier, http://channel9.msdn.com/events/Build/2013/2-119. Should answer your OneDrive questions.

File protocol to get directory listing

I hope you can help me.
I am writing a desktop program that will run in a web browser (in HTML/CSS/javascript in case that wasn't clear). It will be entirely disconnected from the internet and obtain files and data using only FILE protocol. My question is: how can you obtain a listing of the contents of a directory referenced this way?
I've been searching for months and really turned up almost nothing! Maybe I just don't know how to search but there doesn't seem to be much information about how browsers actually deal with File protocol.
For example, when you open a directory in Chrome, it gives you a nice table with hyperlinks of all the parent directory's children. However, when you look at the source code, it's as if Chrome just magically knew exactly what files were in the directory. I feel that if I could understand how it knew that, maybe I'd be able to get somewhere...
Also, I am open to other ideas about how to get a directory listing. I've read about being able to do it with php but it requires running a server. Does anyone know if it is possible to run php code with File protocol rather than HTTP?
Thanks for reading this far and truely any information that could remove me from this standstill is appreciated!
Web Apps do not have access to the user's file system so you will not be able to do what the chrome file browser does with a web app. I believe chrome is using some sort of native code to do this.
I would recommend trying something a little more on the native-side. A chrome app will let you use html, css, javascript while also allowing you access to the file system. https://developer.chrome.com/apps/app_storage#filesystem
Another alternative is you could write some sort of native java application. That would allow you to read/write all the files you want.

simple way to quickly edit my website

here's my website:
www.newportclassic.com
do you know of any free, easy to use, content management systems, that will allow me to simply edit the text on my site without having to download the file, open the file, edit the code, save the file, upload the file ???????
I know of a few CMS's that have done well, here are two of them.
Wordpress - free - http://wordpress.org/ - 3.0 is coming soon
Perch - paid - http://grabaperch.com/ - very light and easy
Wikipedia has a very good list of content management systems broken down by language and cost (open source/proprietary) and DBMS. Most of the ones I've used/evaluated in the past have been .NET based, such as DotNetNuke. Pretty much any CMS will give you the ability to edit your HTML without changing any files on your web server. If you're going for simplicity, the Wikipedia list has several that use a flat file instead of a database, so I would start there: http://en.wikipedia.org/wiki/List_of_content_management_systems#File_.2F_Flat_file
As an alternative to installing a CMS on your server, you might be interested in a service like CushyCMS. It allows you to specify what parts of your page are editable by setting an appropriate class in each editable div tag. Then to edit the contents of those div blocks, you log in to the CushyCMS site and make your changes right there. CushyCMS connects via FTP to the server for you and updates the HTML page.
You can use emacs -- it has a mode (tramp) where you can open, edit and save remote files as if they were on your local machine. This makes it really easy to edit files on a webserver.
haven't used it myself but i've heard Surreal CMS is quite good and easy to setup. Here's a tutorial to get you started.
In terms of user friendliness zimplit is hard to beat.
Try their demo.
You can literally edit your website with a wysiwyg interface inside your browser.
Refinery HQ is probably the easiest way to create, edit and update your website. You can upload images and files as you describe in your question.
You can also connect it to your own domain (it's a hosted service). So you'd be able to hook the site you create up to newportclassic.com

What is the best client side browser library to upload multiple files over http?

What is the best client side http library to upload multiple files? If it can handle directories that's a huge bonus. I'm looking for something that is open source or free. I'm looking for something like FTP, but that works over http, through the browser. Uploading multiple files through a normal HTML 4.x form is a bit of a hassle when it comes to uploading more than 5-6 files.
Feel free to share your personal experiences.
Uploadify is also another great multiple file uploader. It was built off of SWFUpload and they added new features to it.
Some of the features that I have found most helpful are:
The user can upload all the files at once using ctrl + clicking on all of
the files
As the files are being downloaded a queue is displayed which
shows the files being downloaded including a completeion bar.
As files are completed they are removed from the queue
It also allows you to specify which file types the user is
able to download (they can only see the ones you choose)
I'd recommend something like SWFUpload for that. It's main feature is its support for progress bars, but it also allows for queuing files which is particularly handy (this is actually the second time I've recommended it today).
Just to make sure other options are documented (SWFUpload is great) - another good solution is FancyUpload2.
You could use a Java based solution. I've been using JumpLoader on one of my web pages and haven't had any problems with it. It can also upload directories, which other solutions mentioned here do not support.
Another option that I have used before is uploading and then extracting ZIP files. I have used PEAR::Archive_Zip to extract. Requires more knowledge on the user's side, but supports directories and unlimited files (depending on the memory alloted to PHP).
Take a look at jquery-html5-upload it doesn't require Flash, and has a sexy jQuery API.