web:config

tips and tricks for the interwebs

for heavy duty posters

, , , , , ,

I present you with a new script to enhance user experience on my.opera, dubbed Scribit.

The script provides the user the hability to edit all his/her forum posts, blog posts and comments, dev.opera comments and widget discussion's page comments without the need of opening a new webpage with the edit form. The script will create a inline editor, that will replace the original post, or comment, so the user can edit it inplace, therefore making editions much more pleasant and quick. The script also displays a inline toolbar with all the available formatting commands used to produce bbcode. The toolbar is not only displayed in the inline editor, but also in the already existing reply boxes in the forums, blogs and at dev.opera.

This script initially only worked for forum posts and was very simple. I coded version 2.0, to submit to the User Javascript contest but by influence of the others the script never got to the juri's inbox. Oh well...

Screenshot with default setup (standard skin)

Screenshot of Quick Edit link

Screenshot of post quick editing (Oxygen skin)

Instructions
The following keyboard shortcuts are supported in the inline editor, producing bbcode formating. Press Ctrl plus any of the following keys:
  • b - bold
  • i - italic
  • u - underline
  • s - strikethrough
  • p - preformatted code
  • t - insert unordered list
  • l - align text to the left
  • g - center text
  • r - align text to the right
  • j - justify text
  • m - insert image
  • h - create hyperlink
  • e - insert email link
  • f - attach file
  • q - format text as quote
  • w - whisper text
  • ENTER - submit post
Later on, I'll make these easier customizable.

The script's configuration has sensible defaults. The entire UI is drawn using the current Opera skin, therefore providing an extra integration with the browser. Note however, that some skin bugs might be releaved. This script was succcessfully tested with Opera's default skin, and some other popular skins.
You can tweak the editor's behavior, although you need to edit the script itself.

This script does a daily new version check, warning the user of the new script version. You can disable this feature though. Check the configuration kCheckForNewVersion.

This entire script was done by me from scratch. The version check code was imported from the myopera-enhancements script, also made by me, and Robin Zalek. I recomend you to check it out. cool
http://my.opera.com/xErath/blog/2009/02/10/my-opera-community-enhancements

Credit also for AyushJ's quick-reply script for some inspiration. wizard
http://my.opera.com/community/forums/topic.dml?id=185091

Many thanks to Lars Kleinschmidt as well for testing and feedback. wink

However, the script has much to catch up. The roadmap is:
  • finishing html editing support yikes
  • supporting html to bbcode convertion and back on the fly
  • adding a 'remove formatting button', trivial for html, hard for bbcode knight
  • removing all prompt boxes and replacing them with proper floating
  • menus providing the user input suggestions, like listing his/her files when the attach button is pressed.
  • replacing the default new blog post, new form thread, and new dev opera article
  • making a lovely UI to edit configurations

Etimology: Scribit derives from scribe spock

Download the script from:
xerath-myopera-scribit.js
Future versions will be announced here, and the script will notify the user of the new version.

For the geeks
Script documentation is available at, generated using JSDoc:
scribit-documentation.zip

All text strings stored by this script are properly grouped to ease the script's localization. Currently, the suported languages are english and portuguese. Other users are encouraged to contribute. The language is autodetected and will match your UI language, but this can be overriden by setting the kPreferedLanguage configuration variable. If the UI language is not supported, english will be used.

Translations code chunk:
var translations = {
    en:{//plain english 
        L_SUBMIT: 'Submit',
        L_CANCEL: 'Cancel',
        L_QUICK_EDIT: 'Quick edit',
        L_QUICK_EDIT_LINK_TOOLTIP: 'Quick edit this post using inline editor',
        L_ERROR_ON_LOAD: 'Error loading post from server',
        L_LOADING_DATA_STATUS_MSG: 'Loading data from server...',
        L_POST_NOT_CHANGED_NOTIF: 'Post not changed (to quit press Cancel)',
        L_SUBMITTING: 'Submitting...',
        L_ERROR: a'Error',
        ...

Have fun! cheers

typical disclaimergallery crawler

Comments

CharlieBAMAToNE Tuesday, February 17, 2009 4:28:46 AM

This is fantastic! up What about Tamil's smilies that are added in the enhancements script?

Not sure if this is known, but the dropdown menu text is hard to read: http://files.myopera.com/BAMAToNE/files/xerath-myopera-scribit.jpg -

Tamil Tuesday, February 17, 2009 4:38:19 AM

http://files.myopera.com/Tamil/Smilies/Cool2.gif -
Can you add an option to merge formatting & content?

Currently, we have to scroll to see smilies at bottom. Can you make smilies to occupy entire text area width similar to this?

FataL Tuesday, February 17, 2009 6:45:01 AM

up

serious Tuesday, February 17, 2009 7:13:37 AM

aw, doesn't look good with kawii sad Now I'll have to search another skin cool as that, as your script is so awesome and I surely will keep it ^^


PS: using opera 10 valentine edition qt4 build here

PPS: what skin variable sets the background color for the tabs? in kawii (and many other skins) it is white with wite buttons -> text not readable. I just made a quick workaround in your script by adding style="color:black" to the buttons, but this surely can be set somehow in the skin.

Kyle Bakerkyleabaker Tuesday, February 17, 2009 10:51:18 AM

Nice work!

Rafald.i.z. Tuesday, February 17, 2009 11:28:06 AM

Looks nice and works seamlessly.

Just having similar issue to others. With c00 skin text is unreadable.

Rafald.i.z. Tuesday, February 17, 2009 11:54:28 AM

BTW. The file http://files.myopera.com/xErath/scribit/scribit-documentation.zip must be rather weirdly packed cause TC shows now files in there :/

João EirasxErath Tuesday, February 17, 2009 12:11:39 PM

Originally posted by BAMAToNE:

Not sure if this is known, but the dropdown menu text is hard to read:


Are you using the standard skin or a customizedd version? Works just fine here with both kestrel and peregrine. Black text on white background.

Originally posted by Tamil:

Can you add an option to merge formatting & content?


Well, those are dropdown menus. I can make them wider, or even resizable.

Originally posted by serious:

aw, doesn't look good with kawii

Originally posted by d.i.z.:

With c00 skin text is unreadable.


Set kEnableToolbarFancyStyling to false, or switch skin.
Tabs use colors -o-skin("Pagebar Button Skin") and -o-skin("Tab Button Skin.selected")
Menus use text color -o-skin("Help Tooltip Skin")
These work ok in most of the skins I tested: native, standard, ibis, oxygen.
I'm not a designer nor photoshop geek so I couldn't build my own custom skin for the editor, therefore I opted using the browser skin, with the option to disable it.

Originally posted by kyleabaker:

Nice work!

Thank you smile

Originally posted by d.i.z.:

BTW. The file http://files.myopera.com/xErath/scribit/scribit-documentation.zip must be rather weirdly packed cause TC shows now files in there :/

**shrugs**.. no files here as well. i'll fix it when I get home..


serious Tuesday, February 17, 2009 12:11:50 PM

@d.i.z.: you just have to click the ".." entry about 5 times. the path is: "/../../../../../home/jce/operastuff/userjs/js_docs_out/" ^^

Rafald.i.z. Tuesday, February 17, 2009 12:33:16 PM

Originally posted by serious:

you just have to click the ".." entry about 5 times. the path is: "/../../../../../home/jce/operastuff/userjs/js_docs_out/" ^^


Well, seems like TC does not allow me to get up the hierarchy. I see two items with ".." but both navigate out of the zip.
I could use 7zip probably but it's not that important to me right now. smile

Originally posted by xErath:

Tabs use colors -o-skin("Pagebar Button Skin") and -o-skin("Tab Button Skin.selected")


Then maybe there is some bug in Opera because Tab Button Skin.selected color in c00 skin is defined as black. I've even trying different other values for -o-skin and neither changed color of the text (Opera 10).

Rafald.i.z. Tuesday, February 17, 2009 12:49:23 PM

CharlieBAMAToNE Tuesday, February 17, 2009 2:27:25 PM

Originally posted by xErath:

Are you using the standard skin or a customized version? Works just fine here with both kestrel and peregrine. Black text on white background.

Negative. "Opera Standard" with no color scheme in latest snapshot (1285).

João EirasxErath Tuesday, February 17, 2009 8:10:50 PM

Originally posted by serious:

@d.i.z.: you just have to click the ".." entry about 5 times. the path is: "/../../../../../home/jce/operastuff/userjs/js_docs_out/" ^^


faint

Originally posted by BAMAToNE:

Negative. "Opera Standard" with no color scheme in latest snapshot (1285).


It seems it's the bug diz is telling.

GeekK Tuesday, February 17, 2009 9:40:05 PM

bigeyes Wow. Thank you. Works good, except the 'bug' mentioned.

Kyle Bakerkyleabaker Tuesday, February 17, 2009 10:26:15 PM

I love how the tabs make use of the current theme! That's amazing! Other than the color issue bug, it's working great! It's going to be a most used script for me!

Also, in the Content tab, clicking cancel doesn't cancel as it should when you click the Whisper button. wink

Cyro Wednesday, February 18, 2009 1:24:36 AM

That's pretty good and yay for Portuguese!

João EirasxErath Wednesday, February 18, 2009 1:48:07 AM

Originally posted by kyleabaker:

Also, in the Content tab, clicking cancel doesn't cancel as it should when you click the Whisper button. wink


You mean, having the empty tags afterwards ? That's by design.

@all, if the skin issue is affecting you and you don't want to switch skin set the following to false
var kEnableToolbarFancyStyling = false;

Also, if you don't like the fullblown tabbar you can disable it by setting the following to false
var kMultipleEditorTabs = true;

Artur „Jurgi” JurgawkaJurgi Thursday, February 19, 2009 4:00:33 PM

Some notes. Tamil has once published similar UserJS (my.opera-quick-reply), buy without quick edit. But my.opera-quick-reply has added some nice emoticons, it would be great to add them also to this invention (preferably under another button).
http://files.myopera.com/Tamil/Smilies/Happy.gif -

Currently both of them are working together, but it look strange. I hope the new one will take place of old good my.opera-quick-reply.

What's more would be nice? Uploading files onto account, with catalog choosing. And possibility to edit also header (intro) of an blog entry, currently only main part is loaded. And then it wouls be really PERFECT. Great job, anyway, I love it.
http://files.myopera.com/Tamil/Smilies/Applause.gif -

dude09 Thursday, February 19, 2009 4:05:59 PM

Nice!!! Thank you. bigsmile

PLnet Thursday, February 19, 2009 5:24:00 PM

Wondering how to turn it on... I'm using My.Opera with russian interface, and no new controls appear here in the comment field?

MetalRaise Thursday, February 19, 2009 7:54:09 PM

I've translated it to German.

scribit_german_translation.txt

Artur „Jurgi” JurgawkaJurgi Thursday, February 19, 2009 8:45:53 PM

Unfortunatelly, one bad bug. Typing national (Polish) letters (AltGr+letter) also bring up formatting and content functions, thus making it impossible to write anything. Example: ę

Pierrera-mon Thursday, February 19, 2009 11:06:42 PM

I've translated it to French.

scribit_french_translation.txt

KarenNerak Thursday, February 19, 2009 11:30:25 PM

This is flippin' badass. Thank you so much for sharing it with us! happy

João EirasxErath Friday, February 20, 2009 12:15:51 AM

@Jurgi, thanks for the bug reports. I'll look over it during the weekend

@all, thanks for the comments and translations smile

MetalRaise Friday, February 20, 2009 12:04:23 PM

I've just made a small change to the translation of L_IS_CONNECTED.
(The text file from my comment above is still valid and contains the updated translation.)

Rafald.i.z. Tuesday, March 10, 2009 10:16:48 PM

Originally posted by d.i.z.:

Yeah, bug: http://files.myopera.com/d.i.z./bugs/oskin.html
EDIT: bug DSK-247053


...and fixed (in latest build)

Artur „Jurgi” JurgawkaJurgi Tuesday, March 31, 2009 9:12:55 AM

@xErath — anything done with the bug I've reported?

(And I still hope for adding Tamil's QuickReply smilies)

S a msamfresco Sunday, June 21, 2009 6:08:33 AM

hi!! mmhh i noticed a problem sad

The script doesn't work in the new My Opera (banana release).

The structure of the html changed a little bit, maybe that's the reason.

I like it!! Very useful when formatting text and adding images!

João EirasxErath Monday, June 22, 2009 1:02:51 AM

Hello everyone.
I posted an update, changelog inside script.
You'll get nagged with the auto-update notification wink

S a msamfresco Monday, June 22, 2009 2:34:05 AM

Wow! So quick! Thank Youuuu! happy

I'll download it when I get back home! smile

Rafald.i.z. Monday, June 22, 2009 12:07:11 PM

I suppose not a lot of Polish people use this script because it has problems that makes it unusable.
When pressing shortcut for one of the many polish letters, the formatting options are triggered.
Happens for: ę, ś, ł

I write them by pressing right alt+e/s/l

CharlieBAMAToNE Monday, June 22, 2009 2:54:33 PM

Great! Except..

Maybe I'm going crazy, but... The link in the original post still goes to 2.02 from Feb., and I haven't been notified by any auto-update in the script. So where's the new version?

João EirasxErath Monday, June 22, 2009 4:38:53 PM

Originally posted by d.i.z.:

I write them by pressing right alt+e/s/l


It's fixed!

Originally posted by BAMAToNE:

Maybe I'm going crazy, but... The link in the original post still goes to 2.02 from Feb.,


doh fixed.. I uploaded it to the wrong folder... p

Artur „Jurgi” JurgawkaJurgi Monday, June 22, 2009 9:05:44 PM

I've downloaded it again and… it's still old version:

* Copyright (c) 2008, João Eiras
* All rights reserved.


Also file comparison shows, that it's identical to old version?

Artur „Jurgi” JurgawkaJurgi Monday, June 22, 2009 9:49:50 PM

OK, it perhaps needes some time? Now I've got notification and everything seems to work fine. Big Thanks! And for Tamil's emos! http://files.myopera.com/Tamil/Smilies/Cheers.gif -

S a msamfresco Tuesday, June 23, 2009 12:59:47 AM

cry I can't make it work!!

What can I be doing wrong? I'm using Opera Beta 1589 (Opera Unite).

Don JacksonOakdaleFTL Tuesday, June 23, 2009 9:00:40 PM

…update caught me by surprise! I clicked the link, instead of right-clicking for Save Linked Content As… (No harm done, of course: Copy/Pasted it to an editor and saved from there.)
This is still a highly functional, well-implemented add-on.http://files.myopera.com/Tamil/Smilies/Applause.gif -
Thanks!

João EirasxErath Tuesday, June 23, 2009 10:37:29 PM

Originally posted by samfresco:

cry I can't make it work!!


You need to be more detailed. Above you told it did not work with the new my.opera release. Does that mean that the script works partially but buggy, or does not work at all ?
Have you properly downloaded the script to the right folder ?

S a msamfresco Wednesday, June 24, 2009 4:47:31 AM

Hi!! I'm very very sorry!! sad

It was me. I don't know how, but in the override.ini file inside Opera profile there was this:

[my.opera.com]
User Prefs|Ignore Target=0
User Prefs|Target Destination=0
User Prefs|Ignore Unrequested Popups=1
User Prefs|Force Encoding
User Prefs|Local CSS File=C:\Archivos de programa\Opera\styles\user.css
User Prefs|Allow script to raise window=1
User Prefs|Allow script to lower window=1
User Prefs|User JavaScript=0
User Prefs|Always Load User JavaScript=0
User Agent|Spoof UserAgent ID=1

[Overrides]
my.opera.com


So, there is
User Javascript=0


I deleted the override entry for my.opera.com and that fixed it!!

ColinCCVo Thursday, August 27, 2009 10:59:57 AM

Originally posted by samfresco:

I deleted the override entry for my.opera.com and that fixed it!!

idea

I didn't delete anything. Instead, I changed the relevant User JavaScript values from 0 to 1.
But, hey! Thanks for the tip - I couldn't get the thing to work before - it works great now.http://files.myopera.com/Tamil/Smilies/ThumbsUp.gif - banana


BTW:
Just wondering if there might be any way to hook into a few more fonts. Like, some I have installed or can copy to a directory for the purpose. ?????

Øzikzakatak Sunday, September 20, 2009 1:19:10 AM

i do NOT want to upgrade but every time i load a opera forum page an upgrade spam pop up is sooooooo annoying please how do i stop the upgrade spam.

João EirasxErath Sunday, September 20, 2009 10:23:49 PM

Originally posted by zikzakatak:

i do NOT want to upgrade


Why not ? The upgrade has bug fixes, so you should be using it

Originally posted by zikzakatak:

i do NOT want to upgrade but every time i load a opera forum page an upgrade spam pop up


There is only one daily check.

Originally posted by zikzakatak:

how do i stop the upgrade spam.


Search for
var kCheckForNewVersion = true;
and replace true with false, like
var kCheckForNewVersion = false;


I probably should make an external preferences file.

Øzikzakatak Monday, September 21, 2009 11:53:30 PM

thanx a lot...


well i dont want to upgrad now.


but also is not daily check every time i load any page on my opera the message pop up...after a while very annoying.

thanx again.

Sami Serolaserola Tuesday, February 16, 2010 7:14:20 AM

Sami Serolaserola Wednesday, February 24, 2010 12:43:00 PM

Any chance to get this work on 'reply to PM' like Tamil's formatting tool does?

EDIT: That was fast yikes Thank you smile

EDIT: yikes And also available for new PM posts bigsmile

Don JacksonOakdaleFTL Friday, February 26, 2010 4:50:31 AM

Øzikzakatak Friday, February 26, 2010 4:57:10 AM

Write a comment

New comments have been disabled for this post.