admin wysiwyg editor JSON save function

[imqqmi]

I've now updated the package json.zip. Please see:
http://www.WebsiteBaker.org/forum/index.php/topic,26111.0.html

Changes I've made:
- Added form token support
- Added tabs and loading just one wysiwyg editor

[imqqmi]

I guess you're right, maybe it will make it into the core one day I usually skip a few updates and apply them once a year or so. For me that's not too much trouble to apply these patches and possible adaptations to newer versions of WB. These little modifications can save me a huge slice of time and makes editing more fun

I'll look into the tabs stuff and one editor instance.

[dbs]

I know what you mean, it's only in firefox as far as I know. I've solved it by blurring the focus on the button after clicking on it Smiley I guess the button is not styled when it is in the focused state, could be a firefox specific bug. The download file has been updated.

Works perfect! 

You are right, one editor--instance should be enough.
I think the handmade changes for all other modules are too much for a normal user.
After every module-update or WB-upgrade the user must change all files again.
A global solution for WB and JSON-save would be better, but i don't know how.
This will not be implemented or supported by the WB-Developer, i think.

[imqqmi]

I know what you mean, it's only in firefox as far as I know. I've solved it by blurring the focus on the button after clicking on it I guess the button is not styled when it is in the focused state, could be a firefox specific bug. The download file has been updated.

About the save all function. I was thinking, it would actually be much better if the sections were tabbed and fck editor is only loaded once instead of one for each section. By clicking on different tabs would load the content dynamically or from hidden fields into the single fck editor.

But it will be confusing if some sections are loaded dynamically and others with a page reload. For consistency I'm inclined to leave it as is unless I'd change all section types (only the default). Unless save all works well, just before the page reloads all JSON compatible sections could be saved, then save the non JSON section using the page reload.

Steps:
1. Override all non JSON save buttons and run javascript function instead
2. Save all JSON sections
3. Record what current section is being edited (session var?)
4a If non JSON section: Save non JSON section through reload for the section that was being clicked on save. Warn user if there's other non JSON sections, changes may be lost.
4b If JSON section: save all except non JSON sections.
5. After page reload, retrieve last edited section and preselect section tab (might be done using session vars).

Something like that.

Then it may be a good thing to reintroduce form tokens.

Let me know what you think!

[dbs]

Looks good with image.

"ugly button" (in Firefox) means ... see attachements

[imqqmi]

Thanks dbs! Glad you like it!

Exactly my thoughts! I've already adapted this to contain a busy, success and failure image. Please see first post with download link.

I don't know what happens when the save button is clicked, it might be a css issue.

I might add a 'save all' option later.

Kind regards
Josha

[dbs]

Yeah! Now i see the green message.   
Disappears after few seconds.
No SyntaxError.

Very nice.

Next things could be:
- instead message - a green symbol (it's more international)
- a button for "save all"
- the save-button looks ugly after click

[imqqmi]

Thanks dbs! I see, when you've turned on php error reporting the saveJSON.php outputs those notices which will break the json code and an illegal character is detected. I've removed the offending lines which contained the non defined variables (it's code coming from an application I've been working on).

The original link is updated, with the console.log lines still in tact:
http://www.jmbfoto.nl/wysiwyg.zip

It should be fixed now Please let me know.

Josha

[dbs]

Ok, "nothing happens" was wrong. It saved the changes, but i don't saw a success-something, only the firebug-SyntaxError.

With the new modify.php:

Code Select Expand

<br />
<b>Notice</b>:  Undefined variable: tid in <b>...\modules\wysiwyg\saveJSON.php</b> on line <b>78</b><br />
<br />
<b>Notice</b>:  Undefined variable: formData in <b>...\modules\wysiwyg\saveJSON.php</b> on line <b>79</b><br />
{"success":"true","success1":"Save succesful.","id":null,"name":null}

A test with 3 sections and hit 3x "save" will save all 3 sections.
It works. 

Something in green/red for every action would be nice.
The SyntaxError is still there.

[imqqmi]

I've checked with an older version WB 2.8.2 and it worked immediately when I uploaded the 2 files. Very strange it isn't working in your situation. Is it a clean install of WB or is it heavily modified/added lots of modules or changes to jquery? I used the installed version (1.7.x I believe).

[imqqmi]

Could you please send me the html source of the page you're trying to edit? The source html when you hit ctrl+u in firefox. I might locate the problem there.

Here's a changed modify.php with some console.log added to see what is going on:
http://www.jmbfoto.nl/modify.zip

Let me know what firebug reports, if the contents of the fck editor returns anything. And what the saveJSON.php returns (probably the home page html).

Thanks!

[dbs]

WB Rev. 1638 = WB 2.8.3 SP1
Yes, both files are uploaded.
Have added section_anchor, changed language to english, multi_tab disabled ... but nothing helps.

[imqqmi]

thanks for trying!

did you upload both files?

I've used version 2.83 sp1, please make sure you're using that version.

unexpected character usually means that the form that was sent is empty and saveJSON.php redirects to the home page.

let me know if the above suggestions work, thanks!

josha

[dbs]

Hi, have tested local with WB Portable (Rev. 1638).
It works only with FCK-Editor?
After Save-button-click nothing happens, but Firebug says:
SyntaxError: JSON.parse: unexpected character (in jquery-min.js)

[imqqmi]

Hi dbs!

There are 2 changed files and needs to be placed in /modules/wysiwyg folder.
http://www.jmbfoto.nl/wysiwyg.zip

A bit about the code:
In modify.php I've added jquery/javascript code to handle the sending of the form data. I've changed a bit in the form to make the save button not to submit by itself but start a javascript function. I've made sure that the section_id is added to the function the javascript is calling so that multiple sections sends the corresponding form data and report back (for this I added a div with id=message[section_id]).

The content of the fck editor field is requested and passed to content[section_id] hidden field. When this is sent through json the response of saveJSON.php will determine what will happen.
If it returns an error (success=false) the error message normally displayed by save.php is returned and displayed in the div id=message[section_id]. It's turned red and will not disappear.

When success=true is returned the save is complete and is reported in a green color. After 5 seconds it will fade so that a new click on the save button will indicate another successful save (otherwise there's no telling if it is just stuck or saved successfully).  It can be made more fanciful by replacing the text with symbols (running circle could indicate it is processing, checkmark = ok, X = not ok + error message.

I'm also considering, now that it can dynamically save the content, to add a save all button. maybe even when you hit any of the save buttons it saves everything on the page (all wysiwyg sections, the other section types like news can be changed into json but those I use less often).

Let me know if you find it useful!

Regards
Josha

[dbs]

Hi, i'm very interested for testing your code.
Page-reloads are sooo retro. *g*

[imqqmi]

Ok, solved it!

I just commented out the lines below from save.php in wysiwyg module:

Code Select Expand


if (!$admin->checkFTAN()) {
//$admin->print_header();
throwjsonerror($MESSAGE['GENERIC_SECURITY_ACCESS']);
//$admin->print_error($MESSAGE['GENERIC_SECURITY_ACCESS'], ADMIN_URL.'/pages/modify.php?page_id='.$page_id);
}


I know it's less secure but I don't mind that too much. Maybe there's another way to implement this with dynamic save on a page (without a page reload).

[imqqmi]

-- edit --

I've now added code and wrapper to a new package called json.zip. Please see this thread:
http://www.WebsiteBaker.org/forum/index.php/topic,26111.0.html

-- edit --
This modification to the wysiwyg editor allows you to save using JSON without reloading the page. This will save a lot of time waiting for the section to be saved and sent back to the modify page. This will also prevent you from accidentally loosing edits to other sections on the same page as the page doesn't reload.

Let me know if you like it!

Install instructions:
1. Download the file below
2. extract the contents to the /modules/wysiwyg folder

It will replace modify.php and add images and saveJSON.php

Please not that this will remove form tokens security. If securiry of cross script hijacking is a concern to you please don't install this modification. Use at your own risk.

This is not fully tested yet, please consider this beta material.

http://www.jmbfoto.nl/wysiwyg.zip

-- original message --

I'm trying to add a feature to save the wysiwyg contents dynamically using jquery JSON. So far I've managed to get the data saved from a page with a single section. When I use more than one section I can save only once with one section. All subsequent saves will result in an error (Security risk! Access denied!).

I understand that this has to do with a form token being incorrect. Before I get into the guts of the wb framework, is there anyone who knows a quick way to disable this security feature? I'm not too worried about getting hacked while I'm logged in.

I wanted to add the JSON save feature as I spend a lot of time with editing/saving multiple sections. I keep forgetting that the page reloads upon each save throwing away all the edits in other sections. Saving using JSON is so much faster as a page reload is not necessary, it also saves bandwidth.

If only I can get around the security issue. My guess is that a token should be possible for each form allowing it to be used multiple times. In effect that defeats the token feature for the most part so that's why I was thinking to just disable it.

I also often open multiple pages for editing (hold down control and click the pages in the admin/pages section) and copying back and forth and found that this security business has blocked this unfortunately. I can imagine this is good for a 'change your password' form but not really for the general editor pages.

If the admins (or anyone else) are interested in the code I'm happy to provide it.

Thanks for any help you might provide!

Kind regards
Josha