plh_edit_in_place : edit your article directly from the front end

planeth · 2012-04-05 10:33:51

This is my attempt to answer the need for a front-end editing capability.
The plugin relies massively on AJAX and is tightly coupled with cbe_frontauth for all the autorization / loggin facilities.
2012-04_17 : plh_edit_in_place is now authorization plugin agnostic.
The sole requirement is front side loggin to admin and check function to populate $txp_user global variable

Regarding privilege management the plugin will perform the same check as txp admin regarding posting, editing articles.
If a connected user does not have the right to post or edit nothing will show.
If creating an new article without publish rights, article will be created with a pending status and according error message will show.

You will need jQuery version 1.7.

Summary and version details

This a development version.
Body of article can be edited on a single article page.
2012-04_17 edit :
Article can be added from article list page

List of features

Database update/save on the fly for body in article.
2012-04_17 edit :
Article post from front side

Plugin requirements

Textpattern 4.4.1
PHP 5.2 minimum (thanks to Gocom)
Plugin dependency : any plugin providing front side admin login and authentication check
jQuery 1.7

installation

Edit first line of plugin to give your admin relative path (this one is shaky !!! to be tested)
Make sure jQuery is called in your page (right before </body> is the best)

Tags

2012-04_17 edit :
<txp:plh_frontedit_body /> is now single tag

<txp:plh_frontedit_body />

(name) = list of name of valid user optionnal
~~list of name to check~~

(level) = list of privilege level optionnal
~~list of privilege levels to check~~

~~used as a wrapper around <txp:body />~~

use inside authentication check tag
ex:

<txp:cbe_frontauth_protect>
    <txp:plh_frontedit_body />
<txp:else />
    <txp:body />
</txp:cbe_frontauth_protect>

If the logged-in user has authorization on the article being displayed, the article body will be wrapped inside a <div contenteditable>
A click on the article will toggle the view of code to be edited along with save/cancel buttons.

<txp:plh_frontadd_article />
In this plugin version this is a single tag

To be used only in an article_list context.
The plugin will find out the section in which the tag is used or default to default section if nothing is found.
Same for category but you can override this behavior by setting the category attribute to the category of your choice.

As the plugin is meant to simplify content creating and editing, a lot of option are set by default :
** textile is set according to prefs. You can override this with textile attribute
** comments on or is set according to prefs
** status is set to live except for author without publishing rights
** publish date is now

If you want a more detailed control on how user can create an article you should consider using mem_public_article

By default this tag will output a button “add”. Click will show the form.
If you prefer having the form directly shown (on a special page maybe) set the attribute add_button to 0. You may want to set a redirection on form success to the article list page. Use redirect attribute.

In this plugin version the form default to title and body input.
Title may be omitted by setting title attribute to 0.
In this case you may want a mean to access title less content for editing purpose. Use the plh_messy_url tag at any place you find useful.

ex :

<txp:cbe_frontauth_protect>
	<txp:plh_frontadd_article />
</txp:cbe_frontauth_protect>

<txp:plh_messy_url />
Will ouptut a link of the form : http://my-site.com/index.php?id=xxx

<txp:plh_frontedit_js />

Mandatory
This tag must be present after the call to jQuery library

download
2012-04-05 14:50 version 0.2
2012-04-17 10:10 version 0.3

Feel free to test, break (specially security problem) and report !

Further development include :

custom_field, keywords, … on the fly editing and creating.

* add article capability on an article_list page

Last edited by planeth (2012-04-17 08:09:07)

CeBe · 2012-04-05 11:36:29

You did it !
Chapeau bas

planeth · 2012-04-05 12:26:06

Hi Claire,

it’s still very rough around the edges but thanks anyway !

planeth · 2012-04-06 17:36:43

I’ll be on my snowboard for the next 10 days.
So don’t expect anything new before !

whaleen · 2012-04-13 07:17:31

Ooh la la!

planeth · 2012-04-17 07:26:00

Back to code !
This new version bring some changes :

authorization plugin agnostic
new article add tag

See the details in the first post

hilaryaq · 2012-08-24 15:17:33

Fab plugin I just can’t seem to make it work!

Is the admin link the link to textpattern for the edit plugin instructions?

Does <txp:plh_frontedit_js /> go into the head tag where I also insert the jquery links? Does it need jquery and jquery.min?

Sorry for the questions, it does look great would love to figure it out, thanks!!

planeth · 2012-08-24 17:15:51

Hi Hilaryaq ,

Is the admin link the link to textpattern for the edit plugin instructions

I’m not sure of your question so i’m gonna try my best !!!
After installing the plugin, you need to edit it and verify that the first line reflect your admin path (relative).
You’ll find all the instructions in my post above as there is no help at the moment.

Does <txp:plh_frontedit_js /> go into the head tag where I also insert the jquery links? Does it need jquery and jquery.min

If you insert your jquery link in the head tag, you may also insert <txp:plh_frontedit_js /> right after it.
Just FYI it is best as a performance point of vue to push all these calls to external links at the end of the html body so the page can start to render without waiting for everything to be loaded.
You need either jquery or jquery.min it’s up to you.
Consider jquery.min better for production.

The development has been on hold as txp4.5 was changing quite a few thing.
Now that I see that this plugin has some “fans” I may kick myself to try to write a production version.

hilaryaq · 2012-08-24 17:23:36

admin path being the path to textpattern?

Basically when clicked the area does seem editable, but the save link never appears..

Last edited by hilaryaq (2012-08-24 17:24:27)

hilaryaq · 2012-08-24 19:32:38

Ah.. can’t believe google adsense code breaks jquery: http://forum.jquery.com/topic/google-adsense-javascript-breaks-ajax-transitions

Did what you said put them before /body jquery working, at least I’m that far!! ;)

hilaryaq · 2012-08-24 19:57:42

It works perfectly..thank you SO much!! This is the first time someone wrote a proper plugin for both members login thanks to cbe_frontauth, and paired with your plugin they work perfectly for member sites..

THANK YOU!!!!!!

hilaryaq · 2012-09-10 15:00:31

So, I have tried to style this so that the box with content when clicked to edit, doesn’t stretch the entire width of the page (being cut off by both the right col and the end of page right), it seems it loads before the css, and when I insert the jquery code to let the document load first clicking to edit doesn’t work..

I also want to have this extend to custom fields, excerpt etc.. if I put some funding together would you be able to program and extend this plugin as required? I would be happy to release the updated code back into the community also, but I would think it’s worth some incentive to do it too since I’m really interested in it! Let me know!

Textpattern CMS

Textpattern CMS support forum

#1 2012-04-05 10:33:51