Welcome to Inkbunny...
Allowed ratings
To view member-only content, create an account. ( Hide )
IBBB - an easy thumbnail bb code copier for InkBunny :)
« older newer »
Whippy
Whippy's Gallery (1598)

SuperFly Reply - A better reply box for InkBunny!

I could use some ECT

Medium (920px wide max)
Wide - use max window width - scroll to see page ⇅
Fit all of image in window
set default image size: small | medium | wide
Download (new tab)
page 1
page 2
page 3
by Whippy
IBBB - an easy thumbnail bb code copier for InkBunny :)
APP: YouTube List Maker
The Squirrel Wizard (Work in Progress)
+3
Last in pool
Here's a lil update to my handy dandy reply box for InkBunny ^_^



                                                                Features
============================================================================
*Stays on top of everything while letting you scroll the page
*Hilights the comment you are replying to
*Resizes by clicking the dragging the bar at the top
*a cute mascot character and "long text indicator" pose for the character
*a version without the mascot image
*easily moddable with CSS code (a guide is given below)
*Hotkey Escape hides the reply box when it's active




                                                        Browser compatibility
============================================================================
For waterfox 2020.03 current - Content Security Policy must be disabled somehow for this script to work :/  

In firefox, you can go to about:config and change:  security.csp.enable = false
Script seems to work fine in Chrome, waterfox classic, and vivaldi just fine with CSP enabled though!






                                                                  To Install
============================================================================
Requires tampermonkey, you can get it here: https://www.tampermonkey.net/
Try ViolentMonkey, it's working as of 9/7/2023: https://violentmonkey.github.io

Download SuperFly Reply: Open this page in a new tab.  It's where I dump my code :)

You can do a CTRL+F on your keyboard to search for files there.

The version with the mascot image is: IB Superfly Reply_4.3.user.js
The version with NO mascot image is: IB Superfly Reply_4.4.user.js

After saving the file, create a new script with violentmonkey.
Select all the default code in violentmonkey's editor and delete it.
Drag IB Superfly Reply.user.js into violentmonkey's editor and save.

Hope you guys enjoy this one as much as I do!




                                                         optional modifications:
============================================================================
To mod how SFR looks (an example is in the 3rd image) you'll need Stylus, an extension that lets you use CSS code to change how things look on a webpage. Download Stylus for chrome,firefox, or opera.

"
                                      Superfly Reply 4 Modding Guide
===============================================================

The parts of SuperFly Reply now have class names that you can use to change it's appearance:

.sfr.box            = container of all parts
.sfr.bg              = a div made to hold a background image
.sfr.resizer       = resizer bar at the top
.sfr.resizer.lite  = the resizer bar that lights up when you drag it
.sfr.controls      = black bar at the top with text widgets
.sfr.reply           = reply button
.sfr.text             = the large textarea that you type into
.sfr.mascot       = the squirrel that's chillaxing in the upper left corner
.sfr.mascot2     = the oncerned squirrel that appears when your comment is too long
.sfr.close          = close button

Usage:
You can easily modify these using Stylish (an addon/extention that you install) and a little CSS code.

Stylish for firefox: https://addons.mozilla.org/en-US/firefox/addon/stylish/
Stylish for Chrome:  https://chrome.google.com/webstore/detail/stylish/fjnbn...
Stylish for Opera:   https://addons.opera.com/en/extensions/details/stylish/

Click the Stylish icon > write new style > For inkbunny.net...
The you can paste in one of the examples below, then save / enable it to see the result:

If you don't like seeing Skippy the squirrel then you can use this to make him go away:
.sfr.mascot
,.sfr.mascot2{
Display:none !important;
}

or change the hilite color of the resizer bar:
.sfr.resizer.lite{
background-color:red !important;
}

the "!important" part makes sure that the CSS rule sticks.

Tips
---------------------------------------------------------------------------------------------
To fill a div with color and change it's opacity while keeping
the text's opacity use rgba(R,G,B,alpha), ie: rgba(0,0,0,.5)

To add other images without editing the javascript or creating
extra HTML code, use psuedo elements in CSS like so:
.sfr.mascot::before{
 content:'';
 background-image: url( 'URL or base64 code goes here' );
 }
the content:'' needs to be there for it to show.

http://www.w3schools.com/css/ was a great help in learning CSS and javascript!






                                                                       Change Log
============================================================================
"
7/19/2021, version 4.4:
The mascot version with skippy or sneezer in the left corner of the reply box only looked good on 1080p monitors but seemed too large on the 720p screen I was forced to work on. So I thought it would be easier for me and everyone else to remove the image and just keep it plain and simple looking.

4/4/2020, version 4.3:  
Fixed broken code.
Added a function to scroll reply comment to the middle of the screen.
Handicap - now requires Content Security Policy to be disabled for InkBunny for the script to even work in waterfox (but not other browsers as far as I know). Not happy about this, but there's no other way to make it work without doing this :/

1/26/2017, version 4.0:
*SFR is now ready to be used when the page is shown. You no longer have to wait for it load completely. ^___^
*Changed the mascot to Skippy, because he's so darn cuuuuuuute!
*Modified the height a lil bit on the textarea, some pixels were showing through on the bottom.

Keywords
male 1,190,926, cub 274,572, squirrel 30,789, animaniacs 3,775, update 676, skippy 647, programming 117, reply 21, javascript 18, chillaxing 10, scripting 3, superfly reply 1, ib mods 1, ib modifications 1, replybox 1
Details
Type: Picture/Pinup
Published: 8 years ago
Rating: General

MD5 Hash for Page 1... Show Find Identical Posts [?]
Stats
855 views
14 favorites
27 comments

BBCode Tags Show [?]
 
Meiji
8 years ago
Love the art you always do to annotate these :P
Whippy
8 years ago
Thanks ^^ It's actually pretty fun making it look a lil different with each update hehe! :D
yohancool
8 years ago
Sorry for all this messages, I go stop, if you want😦
Whippy
8 years ago
Huh? Naw, it's fine, really! I was just using it as an example because it was one of the most recent messages and it wasn't too 'raunchy' like some of the other messages on my non-G-rated art ^///^ I wanted a clean comment to go with this 'clean' submission :)
yohancool
8 years ago
Ok, I'm happy *hug for you* ^_^
Whippy
8 years ago
*snuggles on* :D
yohancool
8 years ago
^_^
Meiji
8 years ago
Blocked 4ever!


Whippy
8 years ago
Hey you! Get that cat tongue off mah skreeeen!
Meiji
8 years ago
You know you love it
lavilovi
8 years ago
Oooooooooo Yes. This is awesome. I've always hated having to scroll back up to the comment to make sure I'd not forgotten something in my reply!
Whippy
8 years ago
:D Oh god, that bothered me a lot too! Had to fix it ^.^ Hope you find this as useful as I have XD
RollerCoasterViper59
8 years ago
I'd love skippy on the side of my dash board X3
Whippy
8 years ago
It would be awesome to have a Skippy plushie ^^ Prolly have to put velcro on his butt to make him stay put though ^///^
RollerCoasterViper59
8 years ago
I ment on my ib page, but I'd like a plushie too X3
Whippy
8 years ago
Oh lol! Well that's easy enough to do with a lil CSS magic ^^
RollerCoasterViper59
8 years ago
kool
Whippy
8 years ago
See? Pretty easy hehe ^^
Just paste all that code into a new Stylish style, give it a name, and save. :)

Of course, you might want to get rid of the skippy that's already in SFR, so you could put this into that stylish style:
"
.sfr.mascot {
display:none !important;
}

And that should hide it :P
RollerCoasterViper59
8 years ago
where would I save it to?
Whippy
8 years ago
Anywhere, it doesn't matter. The main thing is to copy what's inside of it and paste it into a new stylish style. Once you save the style, it will appear on any IB page you have open.
MichaelJBear
8 years ago
Héhé love it ... was using the ',version', with Sneezer ... but the Skippy one won my heart
Whippy
8 years ago
^__^ Yay! Everyone needs a warm little squirrel around their home during the winter :D
KonekoWolfBoy
7 years, 11 months ago
How do I get rid of Skippy the Squirrel? I see instructions on what to add or remove, but where exactly do I go to get rid of him?
Whippy
7 years, 11 months ago
It's a CSS script. You need to install the Stylish extension first, then click "write new style", and select "for inkbunny.net...". In the script editor that pops up, paste this code:
" .sfr.mascot, .sfr.mascot2{ Display:none !important;}

Give it a name and save it. Then squirrel go bye bye :)

And you can get stylish for firefox here: https://addons.mozilla.org/en-US/firefox/addon/stylish/
Or for chrome and variants here: https://chrome.google.com/webstore/detail/stylish/fjnbn...
Whippy
7 years, 11 months ago
If you want to manually delete the code for it without using stylish to hide it, you can also edit the .js file in greasemonkey:
You'll need to delete everything from here:
"     // append cute squirrel ^.^
    skippy = document.createElement('div');

to here:
" box.appendChild(skippy2);


That's the code for the actual image and positioning.
soggymaster
7 years, 4 months ago
If this posts, submissions work!
Whippy
7 years, 4 months ago
Submissions do work! :P Thank you!
New Comment:
Move reply box to top
Log in or create an account to comment.