I would like to see an option for the user and the admin to turn on an alert before you leave any page with a post field to ask if you want to leave the page.
Nothing like a little data loss to get someone going ... Github seems to do a really good job retaining data even when the back button is pressed. I'd assume they are using some data fields on the JS side to save and track things.
Anyway could do a simple confirm box as a start.
I have people "lose posts" a lot on my forum. I'm 99% certain the reason is the "Someone posted while you were typing" warning. Unfortunately that warning shows up below the preview that is returned. So if you're on a phone or tablet with a limited display you see the post you just made (actually the preview of it) and not the warning box. Since most people have it set to return to the post they made they never realize their post didn't go through and they move on, close their browser, etc. and the post is lost.
Even without the leave page warning I think there should be consideration of moving the error box above the post preview when there is a posting error so that it's actually visible and doesn't look at casual glance like the post went through as normal. It's especially prone to fool people when they enter long replies, which are the most annoying ones to lose.
Good point
@scripple .. maybe remove the preview in case of errors? (I think I added it (or I was in favour of adding it), but if that brings this kind of problems I feel removing is an option to consider.)
I like the idea of being warned of losing what I have typed in. ;)
Though I think draft is already useful for the stated case.
Not showing the preview when there are errors would probably be a good thing.
As to drafts, I think it should not be the only mechanism. Especially since I've had it not save drafts in the very case I mentioned. I'm not quite sure what the draft logic is about when it saves it and when it deletes it. I seem to get a lot of drafts hanging around of posts that were successfully posted. Thankfully the delete after x days option cleans them up eventually.
Happens with my board too.
What about overlaying (with CSS, so it works on the darned mobile browsers!) the warning over the preview?
I did some quick looks at options here. Sorry not on the original request but in the area around the post error messages discussed after that.
Since we generally have jquery UI enabled on the post screen, its a simple matter to grab the existing error box and use .dialog to show a modal error popup. I did that and it works as expected, it gabs that error div and displays it in a confirmation dialog that is positioned on top of the preview div.
As I played with that a bit I found it a bit annoying as it just adds another click you have to go through to clear the "popup" modal window to get back to the post to fix it. Also the errors on preview are done via ajax and errors on post are done when you are kicked back to the post page for some reason. So what I'm saying is on preview I don't think the popup buys you anything much.
On the issue
@scripple reported, when you select Post with something that creates an error (notably someone else posted you may bla bla) you are returned to the post page and shown the preview. I can (and did) add a modal confirmation popup over that preview window so the error was very evident, and we could add the confirmation options as Eliana suggested as well.
But thinking about it, to me, the best thing may be to simply not show the preview when you are getting "bounced" back to the post page, but only when you actually hit "preview". At this point the notice is top center and you can choose to do what you want at that point. Could also simply use a named anchor on the error box and just scroll to that.
Anyway, just thoughts, we could go in a couple of directions here but and wanted to get some others thoughts.
Not a bad idea. Why not playtest it here? I'm not sure if you have any metrics set up (though you really should!) but you could at least get some anecdotal evidence.
I like the idea of not showing the preview when bounced back. The page will obviously be different that way and the error will be at the top as you say.
for 1.0.4 I removed the preview call when coming from a post2 error (error after you hit the post button). Also added a JS scroll so the error box is at the top of page, should make it evident there was an issue.
Isn't this what the "drafts" functionality is for? Can we just add autosave to the drafts system as one types, similar to how Google Docs operates? Then, when you close the page and re-open it, it just loads from the latest saved draft.
A simple JS pop-up confirmation should suffice if the draft is still in the process of saving, again similar to how Google Docs works.
window.addEventListener("beforeunload", function (e) {
var msg = "You haven't saved your changes";
e.returnValue = msg; // Gecko and Trident
return msg; // Gecko and WebKit
});
Source: https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload
EDIT: Do we already have an auto-save function for drafts?
Drafts can (admin setting) be auto-saved on "lost-focus" of the text area.
The autoloading of the draft is something I suggested a while ago (can't find the discussion as usual), I think it would be very cool!
We should be able to use the "input" event and a timeout to fire auto-saving of the draft everytime a character is inputted to the text area (with a delay timeout of 2-3 seconds), instead of just on loss of focus.
https://developer.mozilla.org/en-US/docs/Web/Events/input
Drafts do save on a timer (if the text has been altered) and lost focus of the editor window (if the admin has drafts enabled and autosave enabled as well.)
I'm not sure having a setting for autosave on/off is needed, should just be on to avoid confusion, but thats what I did :P
Anyway when this specific error occurred, the saved draft should have been available, but this issue was that it really did appear like you had successfully posted. Really was a usability issue, type in a longish post, hit post, it appeared like you had returned to the thread and were viewing your new post, when in fact you were looking at the preview and the post error box was off screen. It was not until later when you would return to the thread to catch up that you may realize your post was not there.
Yes autoload of a draft, or a popup that one was found, do you want to recover it, may be pretty cool.
I forgot about the time... ::)
Save on char typed looks a bit... expensive. Yes, the average user may not type that fast, but on certain systems (somehow old) just the presence of the editor may make the typing a not so nice experience, if on top of that we add several ajax calls it may quickly become a mess.
One additional (and hopefully cheap) option could be to use local storage:
http://diveintohtml5.info/storage.html
there it would be pretty easy to save the typed text and represent it in case of unexpected exit (maybe less easy to detect the unexpected exit, but that's probably part of the game :P).
So the fix here is making the preview page most instantly recognisable? Perhaps move the warning dialog to the top of the page, above the preview, and maybe add a "Message Preview" header or similar above the preview body?
But with a timeout, it should be less expensive than saving on a regular period, since it would only commit an AJAX call once the user has paused or finished typing.
Only scenario where I can see server-side drafts being superior to this is if you're quickly whisked away from your current browser and want to continue with your post on another; for example, if you've begun typing on your desktop but need to dash and the auto-save feature will sync your post to the server, which can then be picked up on your mobile device, as per
@Spuds' suggestion of an info box appearing to ask if you'd like to load your latest draft for that particular topic.
Basically yes that was the fix, I think it was done in 1.0.4 ... So now when you hit post, and there is an error (the someone else posted while you were typing thing), it does not return you to a preview page but just shows the error notice and of course the editor with your text. The only way you see preview now is if you hit preview.
I looked at leaving the preview in place and adjusting the error box position, or even using a modal error box, but there were other useability issues which I can't recall right now ... sometimes my mind retains as well as a sieve.
Quite a bit related in some ways. http://custom.simplemachines.org/mods/index.php?mod=3256