Background Color Change

[Ebony]

BETA FEATURES UPDATED.

Hey there, K/Ebony here with my newly "finished" plugin. Here's the dealio:

Plugin Library Link:

www.proboards.com/library/plugins/item/1311


What it does:
Adds buttons hidden in a div that shows on hover. The buttons change the color of the body or wrapper of the forum to whichever color is associated with the button clicked. There is also a "remove background" button that sets it back to the default forum color. (ie- white on the regular PB theme). There are also buttons that let you decide which corner (top left or top right) the div appears in.


Additional Features
-Choose background color for the div
-Choose background colors for the [body/wrapper] to change to
-Sets and calls a user key to keep users' settings across computers and such
-Sets and calls a cookie when not logged in.
-Transitions from the current color to whatever you choose, to make the change smoother.
-Allows you to decide whether the body or wrapper changes color.
-There are now buttons that let you change the colors to animated ones (they go from the chosen color to the default color and back again over and over again)
-You can now change what each button says on it :3
-USERS THEMSELVES can now choose which corner the div is in (which changes the border, too, so it looks okay ouo)
-And you can change the color of the border itself.

Bugs
-If you are away from the page for a while, the animated background won't change when you click the buttons. I'm not sure why that is, but it seems to be something with clearing the interval. Reloading makes it work again


Testing Areas:
My Plugin Forum - BETA VERSION + Set to body
My (very messy and dead) Forum - Set to wrapper

BETA TESTING
The top one of the "testing areas" place is currently undertaking some HUGE testing and such.
Here are the new things:
-Cookies area looks exactly the same as on the other site
-logged in version is COMPLETELY DIFFERENT!
* Users click a button to bring up a dialog allowing them to change all the settings on their own!

This means that they can change:
-Left or right corner
-Body or wrapper
-The buttons' colors
-The buttons' names
-Transition times for the backgrounds (currently not working???)
-Div color
-Div border color

Beta Shots below- and here's the beta file: Background Change Beta 5.pbp (7.09 KB)

I think that's it! Thanks everyone.

-K

Attachments:

Background Change.pbp (3.66 KB)

[Ebony]

Main

Beta

3.3.2 -Users themselves can change what corner the Div appears in. 3.2.2 -Cut down some of the code. 3.2.1 -You can now change the color of the border around the div. 3.1.1 -You can change what corner (top left or top right) that the div appears in 3.0.1 -Fixed a variable error causing the fourth color to not animate after you change a page (was ex and not el). 3.0.0 -Fixed some cookies bugs that I didn't realize were happening -Added ability to change what each button says (also have those values in an array) -Deleted many lines of the code 2.1.0 -Added animations -Put color values into an array instead of being individual variables -Added ability to change transition speed for static colors Version 1.1.0 -You can now change whether the body or wrapper changes using the radio buttons.

1.0.1 -Actual forum members can choose EVERYTHING, instead of the admin choosing most things. 1.0.2 -Code has been annotated. Enjoy. -Also, removed the corpse of a variable I was testing. The gears are much happier now. -If the Div is black, the text now becomes white, and vice versa. 1.1.2 -Fixed issues involving a broken plugin if users have not previously set the key. On rollover of the broken bit you'll get an alert saying what to do. Will edit later, probably

[Ebony]

BETA IDEAS SHEET


This mostly insignificant comment has been hijacked by the poster themselves to make it more significant. 

Toodles!

[P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓]

May 10, 2016 4:54:24 GMT -8 Ebony said:

Hey P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓

You can now decide in the plugin settings whether the body or wrapper get set

still no animations

[Ebony]

May 10, 2016 15:23:24 GMT -8 P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ said:

May 10, 2016 4:54:24 GMT -8 Ebony said:

Hey P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓

You can now decide in the plugin settings whether the body or wrapper get set

still no animations

Sadly, I haven't gotten the opacity animation up and working again. I'll get on that right away ^^

[P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓]

lol

[Ebony]

May 10, 2016 15:25:30 GMT -8 P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ said:

lol

Okay! So!
I have an idea that would work but it's going to take a bit to get it all set up.
Basically, instead of editing the opacity (because that screws up the whole forum, sadly), instead, it'd animate to the chosen color(say, blue), and then back to the default color for the forum (say, white).
So, it'll animate from blue to white.

I have a Codepen thing working here:

This thing

There's a comment in the JS section that says what to do but I'll just go ahead and say it:
Clicking the "Eh?" button will start two intervals, one that changes the color to grey every second and one that changes it back to the default (black) every two. Clicking any of the other three buttons (reset, bg1 and bg2) will clear the intervals and set the color to whatever they're supposed to set it to.

Not sure how else to do it at the moment, but I'll likely have time later to see what I can do.

[P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓]

May 11, 2016 10:40:58 GMT -8 Ebony said:

May 10, 2016 15:25:30 GMT -8 P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ said:

lol

Okay! So!
I have an idea that would work but it's going to take a bit to get it all set up.
Basically, instead of editing the opacity (because that screws up the whole forum, sadly), instead, it'd animate to the chosen color(say, blue), and then back to the default color for the forum (say, white).
So, it'll animate from blue to white.

I have a Codepen thing working here:

This thing

There's a comment in the JS section that says what to do but I'll just go ahead and say it:
Clicking the "Eh?" button will start two intervals, one that changes the color to grey every second and one that changes it back to the default (black) every two. Clicking any of the other three buttons (reset, bg1 and bg2) will clear the intervals and set the color to whatever they're supposed to set it to.

Not sure how else to do it at the moment, but I'll likely have time later to see what I can do.

Seems decent

[Ebony]

Did something else- Instead of setting two functions with a setInterval, I did this (in the Codepen, that is):


var anim2=0;
var an=function(){
 anim2+=1;
 if(anim2%2==0){
     $('#dib').animate({
       backgroundColor:ek
     },'fast')
   }else{
 $('#dib').animate({
   backgroundColor: inh
 },'fast')
}
 $('#ani').html(anim2);
};

$('#animate').click(function(){
 anim=setInterval(an, 1000);
});
The #ani is a <p> element I put in just so I can watch the numbers go up, btw
But does that seem better? Eliminates the issue of the two functions somehow getting out of wack, which happened when I flipped to a different page and then flipped back.

[Ebony]

So I'mma just
Rewrite the entire code
Because I got some ideas to make it more streamlined and less lines
So, ah, this is going to be a while.

[P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓]

May 12, 2016 6:52:37 GMT -8 Ebony said:

So I'mma just
Rewrite the entire code
Because I got some ideas to make it more streamlined and less lines
So, ah, this is going to be a while.

Perfect, now you gotta change the animated color based on choices.

[Ebony]

So I'm having an issue with the cookies part.
I've got everything animating, and the key is working great!
But what the issue is with the cookies is this(I'll write it in greentext because that makes life easier):


>Go to site
>Click one of the animated colors
>Color sets as the background, animates, blah
> Go to a different page
> Animation continues to work
> Change the color again (Blue's not my style, how 'bout black?)
> Switch back to page color was set to blue
> Instead of black background, we have a blue one
>Rage quit


No clue what the problem is :/
Any ideas?
It may be with how the cookie is set, but I'm not sure. It worked before...
Also, now the static ones are doing the same thing.

I'll attach the glitchy file here.
Warning- it's prolly super messy lol
Trying to cut things down has proven more difficult than I thought

Attachments:

Background Change.pbp (3.12 KB)

[Ebony]

Neeeeeeevermind I figured out the problem.
//facepalms
I had the cookie path set as path='/' when it should have just been path=/, without quotations.
Changing it seems to have fixed the issue.

In a bit I'll update the main thread with the new file ouo'

[P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓]

May 20, 2016 9:35:17 GMT -8 Ebony said:

Neeeeeeevermind I figured out the problem.
//facepalms
I had the cookie path set as path='/' when it should have just been path=/, without quotations.
Changing it seems to have fixed the issue.

In a bit I'll update the main thread with the new file ouo'

Your avatar  s me

[Ebony]

May 20, 2016 13:36:11 GMT -8 P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ said:

May 20, 2016 9:35:17 GMT -8 Ebony said:

Neeeeeeevermind I figured out the problem.
//facepalms
I had the cookie path set as path='/' when it should have just been path=/, without quotations.
Changing it seems to have fixed the issue.

In a bit I'll update the main thread with the new file ouo'

Your avatar  s me

Pffffffft
Really? I think it's cute X3