my in context editor...

[biznuge]

Hi All,

Check out In-Context Editing (http://www.ampdesign.co.uk/incontext/)

A better example (http://www.ampdesign.co.uk/tempo/)

I'm currently having a bang at some ajax, so thought it might be nice to allow my users the chance to use in context editing, whereby they are able to edit their infromation "in situ" in a page in my CMS that resembles the page as the user/editor might see it on the finished site.

This is a very preliminary sketch of the idea at the moment, and the code is pretty filthy to be honest, but I'm started from scratch, and am currently trying to include as many nice touches as possible to make it feel as much like a REAL word processing app as possible.

All feedback would be welcome, as well as any nods in the right direction of AJAX connection pooling. My last attempt went pretty badly wrong...


Cheers all! :krazy:

[biznuge]

*bump* lots of views, no comments... :cowbell:

[mucho]

where is the "save" button?

[biznuge]

are you taking the mick? :whistle:

[mucho]

LOL, not really. I`m just trying to figure out a practical application. I understand the concept, but I would try and make it a more practical example. No save button, ok, but the results should be shown on a different site, for example.

[biznuge]

check out http://www.ampdesign.co.uk/tempo/ basically just dropped the code in there and it worked. slight styling issues to iron out, but this is the kind of project i think this could be good for.

[mucho]

ok, i see your point. this actually very useful. how do you plan on making it not accessible to everyone?

[evildrummer]

very cool, I like the ability to add in HTML asell. One thing I would do is stop the entry of javascript, and also when typing it sticks to same height and so you get a vertical slider, but when you click off its all normal

[biznuge]

@mucho... Sorry to bang on mate, but I thought I'd better explain it a bit better earlier in the thread. :wt:

@evildrummer... Cheers mate. Ithis is still a long way off resembling anything finished. Works properly in IE6.0, resizing the textareas to fit using an "overflow:visible" but it doesn't seem to work in IE7.0, FF, Safari, or Opera.

Next I'm gonna have a look at introducing a javascript delay when user is focused on the textarea, in order to dynamically resize the fields. This shopuld then give abetter in context view across the range of browsers...:skull:

Any one got any ideas about AJAX connection pooling. Still need some more decent research material...:book:

[biznuge]

@evildrummer... Sick thing is I hadn't even tried typing in any HTML yet...
:smirk: :hugegrin: :thumb: :drool: :beer:
Just stuck me a big fat H1 in my field of vision.....

[Digitalosophy]

@evildrummer... Sick thing is I hadn't even tried typing in any HTML yet...
:smirk: :hugegrin: :thumb: :drool: :beer:
Just stuck me a big fat H1 in my field of vision.....

html works I just tryed it. It's ok not very user friendly though.

edit: wait it doesn't save, if I refresh it goes back to the original text :puzzled:

[puppy]

also, I could not edit http://www.ampdesign.co.uk/tempo/about.gif line

[jamiehunter]

If implemented properly this could be really cool. Reminds me of this Flash CMS component:

http://www.flashloaded.com/flashcomponents/fcms/

Keep it up, it's looking good!

[biznuge]

@digitalosophy... lmfao...

@puppy... roflmfao...

@ALL... I think maybe my conceptualisation of the finished product is pretty hard to actualise in a short example like this, but at the moment, at work, I use a large £30,000 per PROCESSOR licensed, ORACLE based, CMS called mediasurface, which has attached to it a client called morello. I've seen this kind of context editing, where the user is able to actually view the page under editing conditions, so that they can see how their finished product will look as it is coming together actually on the page in front of them.

Might not implement this, but at least it's getting me used to a little more DOM scripting than I'm used to, so everyones a winner!!!=)

[JPAG]

I really love it, and I got a coding-pal to do it for my website! Thanks for a GREAT editing-idea! :)

-JPAG

[biznuge]

No problem. Glad you like it!

post a link to it in use if you can...:thumb:

[biznuge]

incidentally, has anyone tried putting in an HTML element that introduces extra line formatting, such as a paragraph or heading tag.

In IE6.0 if you do this, then click off the form, then click back again, it picks up extra line breaks (which are then interpreted as "<br/>" tags), which increase the positioning of the element under test through successive clicks...

Bummer eh...:ne: