[UserJs] Code/Formatting Tools in Quick-Reply

[UserJs] Code/Formatting Tools in Quick-Reply

A little userjs that adds formatting tools (b,i,u,list,url,sub,font,color etc...) in quickreply. See <> screenshots.

Script also supports keyboard shortcuts. Press [Ctrl] key ^{dont hold it down} then press the shortcut key.
Example: to activate Bold(B), press Ctrl then press B

There is also a Reselect text feature. If you dont like that, open the script and set AutoReSelect to 0.

Download: Code Tools in Quick Reply

note: the smilies button isn't working yet ...

ah !
hey. Can you edit it a bit, for it to integrate with my quick-edit script ?
Like placing a function that will patch a textarea, in window.opera
http://my.opera.com/community/forums/findpost.pl?id=1945901
Then I'll edit mine

Originally posted by xErath:

Can you edit it a bit, for it to integrate with my quick-edit script ?

Done!

Thx Guys!!
Great Scripts!

Fos Spanish Forums, we have to add one more line, changing "community" by "espanol", now works well!
When the Smiles will fix!¿?

Well,
now there is another user that no needs to make this change... maybe it just in my case...

Originally posted by AyushJ:

Done!

I'll look at it sunday or monday

Download v1.1: Code tools/buttons in QuickReply


Smilies !
More Sizes,Fonts and Colors in the list.

Wonderfull! Macanudo!

Jajajaja!!
Really faster!!
Thx!


PD: Wow!! Thanks for fixing about the spanish & all forums!

Awesome!
Was missing such thing.

Download v1.1.1 Formatting tools in Quick Reply and in "Write Comment" of blogs

Ok. It's done.
Check my quick-edit script,
http://my.opera.com/community/forums/topic.dml?id=172834&t=1176763697&page=3#comment1945901
but before AyushJ you need to do some changes.
Compare with this version.
myopera-community-format-quickreply.js

Download v1.2: Code buttons in QuickReply/ Comments/ PM Reply/ Quick Edit


----------------------------------------------------------------

Originally posted by xErath:

Compare with this version.myopera-community-format-quickreply.js

why this :

from- createElement("div")
  to- createElement("t_div")
 !important   on all styles ??

from- tDiv.style.width=TxtArea.offsetWidth+"px"
  to- width:100%!important

^^i dont think this is better because then the toolbar can be larger than textarea(if the container's width is bigger than txtarea) and it will not look good but i fixed this for your script..

"div.fpost "+t1+">img {width:22px!important;height:22px!important;margin-right:0!important}"+

why dont you just pass the extra styles in 3rd argument like:
AddCodeTools(xx,xx,{Styles:"div.fpost ...."})


btw.. nice suggestion of preloading images

new Image().src = base+curr;

but you script will not preload the images because the function will get called AFTER you click on smilies button...


----------------------------------------------------------------


Download v1.2: Code buttons in QuickReply/ Comments/ PM Reply/ Quick Edit

Originally posted by AyushJ:

^^i dont think this is better because then the toolbar can be larger than textarea(if the container's width is bigger than txtarea) and it will not look good but i fixed this for your script..

Because I was having trouble with the forums stylesheet. IF you can use div and keep the toolbar displaying ok, then good

Originally posted by AyushJ:

why dont you just pass the extra styles in 3rd argument like:AddCodeTools(xx,xx,{Styles:"div.fpost ...."})

because you lacked documentation

Originally posted by AyushJ:

but you script will not preload the images because the function will get called AFTER you click on smilies button...

thanks for noticing.


I addded the function to the window.opera object and used a wrapper function to prevent global scope symbol polution, which is a good policy when writing scripts.

Nice!

Hm, one thing: it doesn't align with the comments-box on eg. desktop blog (bottom).

Originally posted by xErath:

and used a wrapper function to prevent global scope symbol polution

i didn't use the wrapper function ^{(function(){ .. })()} because there are no variabled/named functions defined outside the AddCodeTools function(which is now in window.opera object).

Originally posted by GeekK:

Hm, one thing: it doesn't align with the comments-box on eg. desktop blog (bottom).

Try v1.2.1. Now the script uses data: URls instead of loading the images from my.opera.com .

Download v1.2.1

Nice work. One more thing that could be converted to data uri is the bg image:

t1+"{ border-top:1px solid #A8A8A8;background : #DADADA url(/community/graphics/blogform/bg.gif) repeat-x scroll left top } " +

@AyushJ: any reason you don't put direct links to the files? Why http://snipurl.com/QuickReply_Tools instead of http://files.myopera.com/AyushJ/scripts/Format%20tools%20for%20QuickReply.js ? Just curious.

Originally posted by fearphage:

One more thing that could be converted to data uri is the bg image

The size of image is only 283 bytes ..

Originally posted by fearphage:

any reason you don't put direct links to the files?

Yes. I can then 1)Change the name/location of file(target) and check the number of hits on the link.

Originally posted by AyushJ:

The size of image is only 283 bytes

It does take time to make the request and received the reply but I'll fix it in mine. Thanks again.

Originally posted by fearphage:

It does take time to make the request and received the reply

OK.Done- Now the script uses data: url for bgimage if UseDataURLs is 1.

I found a couple of typos that pollute the error console, but nothing major. I don't know the line numbers because the code has been altered.

• Message: Unexpected end of file
  Error: missing '}' to close the style tag
  Where: Near the end, in the last 5-6 lines
  

  div.OperaEditTools{width: '+BlogComm.offsetWidth+'px;'}

  changed to

  div.OperaEditTools{width: '+BlogComm.offsetWidth+'px;}'}

  
  
  
• Message: Invalid value for property: color
  Error: assigning the word 'color' to an element's style.color
  Fix: Make it skip the first iteration
  Where: In the loop where font elements are created
  

  Font = {COLOR:['COLOR','black','sky blue',...]}
  
  for (var iX in Font) {
    ...
    for (var iXX = 0, curr=Font[iX], cOpt; iXX < curr.length; iXX++) {
      ...
      if(coloring)cOpt.style.color = curr[iXX].replace(/\W/,'');

  changed to

  if(coloring && iXX)cOpt.style.color = curr[iXX].replace(/\W/,'');

Originally posted by fearphage:

I found a couple of typos that pollute the error console

The error console is always buggy for me..e.g. If i use Clear button and reopen the Error console, all errors reappear and it never shows errors of my.opera.com pages !!! If i create a simple userjs :
var ff=gg

then the error console doesn't show this error in my.opera.com pages but if i load e.g google.com then i can see the error:

JavaScript - http://www.google.com/
User Javascript thread
Error:
name: ReferenceError
message: Statement on line 8: Reference to undefined variable: gg
Backtrace:
  Line 8 of User JS script 
    var ff = gg;

anyway, thanks for reporting the errors !

Nice script.

I don't normally use the formatting toolbar, but it's nice to have it there in case I want it.

BTW: Spaces in the file name are not necessarily a good thing. Granted it isn't a big issue, because the file name can be easily edited with underscores instead of spaces when saving the script, but it's at least something to consider.

Originally posted by AyushJ:

it never shows errors of my.opera.com pages

Remove my.opera and preferably all others from here opera:config#UserPrefs|ErrorConsoleFilter.

Originally posted by d.i.z.:

Remove my.opera and preferably all others from here opera:config#UserPrefs|ErrorConsoleFilter.

Now i can see the errors Thanks

Spaces in the file name are not necessarily a good thing.

I will update the name in the next version (if i made one).


just noticed that this topic is currently #1 in [Most spotlighted topics] .

another thing, you didn't update the scripts internal version number.

Just one thing:
after having opened the smileys and closing them again, the toolbar is left this way, namely with the three drop-down selectors now moved downwards on a separate line...

See image here:
Quick Reply After Smileys Closed Again.png

No problem here

I checked it out!
It's your "Google Translation in tooltip[mf]" script, which is interfering...

There is also another interference with "ospell.js", inasmuch the button from "Ospell" at the lower right corner is not considered when the lower border of the text field moves downwards during the display of the smileys...
Nothing really earnest however, just for the beauty!
UserJavascript Interferences

Originally posted by HaJotKE:

It's your "Google Translation in tooltip[mf]" script, which is interfering...

Are you sure ? This script works fine with google_translation js for me

Originally posted by HaJotKE:

There is also another interference with "ospell.js"

The button is controlled by OSpell script, i cant fix it

Originally posted by AyushJ:

Are you sure ? This script works fine with google_translation js for me

I have cross checked it, and it's reproducible...

But I am using other scripts too...
If I knew where to look and whatfor, I could help...

Here is my listing of currently active UserJavascripts:

1_ospell_preferences.js
auto-copy.js
Format tools for QuickReply.js
highlighter.js
mathml.js
operapedia.js
ops.js
ospell.js
scroller.js
syntax-highlighting.js
Thread title & genealogy before quick reply.js
xml-tree.user.js

With google-translation.js removed, everything is fine!

// ==UserScript==
// @name Google Translation in tooltip[mf]
// @author Ayush
// ==/UserScript==

As this problem still annoys me and it's clearly reproducible we should check the differences in our installations, please.

Having the above mentioned 'Userscript' "Google Translation in tooltip[mf]" installed the dislocation is always happening, having it removed, it never happens...

My script "Format tools for QuickReply.js" is version 1.2.1!
I am on Windows 2000 Professional here.

[EDIT]
It's additionally triggered by some third 'Userscript' however, because if I remove all except those two, the effect doesn't show...

Found: it's "ospell.js"!
All others have no influence!

Now I have removed it, and your both 'Userscripts' are compliant...
What can be done?
Could you have a look into "ospell.js", please!
I am now using version 1.0 beta 27, together with "a_ospell_prefs.js" version 1003 (also only now).
a-ospell_prefs.js
ospell.js

I will also write a PM to *d.i.z.* and *sombria*...
M/B they are colliding because they are doing virtually the same: translating...
Although I didn't use Google in Ospell...

I've removed for now "Google Translation in tooltip[mf]".
But there still remain these button displacements...

HaJotKe: I downloaded those attached files to userjs folder and removed every script except formatting-tools and google-translation and still no problem here.

I'll add now here all those files I have in my UserJS - folder.
To make sure we are using the identical versions...
Thread title & genealogy before QuickReply.js Format tools for QuickReply.js Google-translation.js

Together with the two from above, I always get this odd behavior...
It happens for the first time after the closing of the Smileys again, and from then on always...

BTW:
OPERA Version 9.20
Build 8771
Platform Win32
System Windows 2000

yes.i can reproduce the problem now. Problem Fixed:, download the Google-translation again.

Ah, finally...
I really began thinking I am dreaming all this...
Yes, it's working fine now! Thanks a lot!

Now the only thing remaining is, that the 'Ospell' button should also follow...

Originally posted by HaJotKE:

Now the only thing remaining is, that the 'Ospell' button should also follow...

Redownload.

Wow, that's great...

Working perfectly here, AFAICS!
Thank you sooooooooo much, *AyushJ*!

Originally posted by HaJotKE:

Now the only thing remaining is, that the 'Ospell' button should also follow...

Yep, happens sometimes.
We do not monitor if size or position of textarea changes - it's only positioned on focus.

It might be fixed/changed though.

Download Formatting tools in quick reply v1.2.2 -

• 6 new smilies in the list - :domo: -
  
• Option to show smilies list automatically on page load
  
• some minor fixes
  

I like the penguin 'smiley'...

You should add

// @exclude */xml/*

to the header. It causes an error on the rss links. You may not see the error if you have the email client enabled.

Ok. I changed - document.forms.quickform to document.forms&&document.forms.quickform

This script does not appear to work with Kestrel (Opera 9.5a)

@Saddle Magic: Try it now..