[2.2.1] Change how forums look with Em-8ER Forums Dashboard™ addon!

Xeevis

Max Kahuna
Max Kahuna
Forum Tech
Jul 26, 2016
105
541
93
www.emberbot.com
#1
Considerable amount of forum-goers expressed concerns about how these forums look and behave.

Major concerns:
  • Signatures get in the way (and disabling them all is an overkill for some)
  • White text on dark background is uncomfortable to read
  • Cross-fading background images are munching on CPU/batteries and/or are distracting
  • And more ...
Possible solutions:
  1. Adjust current theme
    • Pros: Easy to do
    • Cons: Affects everyone and finding the glove that fits everybody is hard, updates to theme would need to be hand-merged.
  2. Add several themes
    • Pros: Gives selection of different themes for users to pick from
    • Cons: Time consuming maintenance (all themes would need to be hand-merged and updated)
  3. Client-side userscript (addon)
    • Pros: Client-side, per-user customization, everyone has full power to customize the entire site, no maintenance issues
    • Cons: Browser compatibility
I went with number 3,
So meet Em-8ER Forums Dashboard!



Features:

  • Fully customizable: Since the code is client side, it's open for modification. You can change appearance of any element on the forums. (You can ask for coding help if necessary :cool:)
  • Background states: Slideshow (default), Disabled, Static Image, Random Image
  • Collapse signatures: Large signatures will be partially hidden and will expand to full size after click.
  • Message font and background color changing (with several popular preset styles)
  • Reusing existing XenForo classes for native look and slim code
  • Settings persist in a browser
  • Autoupdater to new script versions
Installation:
  1. Install Tampermonkey addon for your browser (Desktop Firefox/Chromium)
    • For Firefox on Desktop you can use GreaseMonkey addon
    • For Firefox on Android you can use Unified Script Injector addon
    • (You should be able to use any UserScript addon as long as it supports GM API and ES6 template literals)
  2. Go to EFD repository and hit install

  3. Extension will ask for confirmation so just hit install the second time (before installing any user scripts you should always check the source code for malicious code, but you can take my word that this one is safe :cool:)
  4. All set! Now you can just go to https://forums.em8er.com and use one of 2 places to access configuration dialog

    Logged in users can use User Panel:


    Otherwise link is also available at the bottom of the page:
Known issues:
  • When translucent background is used, collapsed signatures aren't faded
  • Browser might need to be hard refreshed (ctrl + shift + r) to make EFD configuration window show.
Change log:
2.2.1 - Fixed "tweaks" checkbox
2.2 - Added optional various tweaks based on popular suggestions
  • Home button on top navigation links to main site em8er.com instead of forums
  • Replaced scaled-down logo with black background with properly sized logo with transparent background
  • Fixed styling of pager on devtracker + added pager at the bottom of the devtracker page
2.1 - Changed supported domain from old emberthegame.com to new em8er.com (script will no longer work on older domain)
2.0 - Rewritten from scratch to achieve cross-platform GM compatibility
  • Now supports daddy GreaseMonkey on Firefox Desktop
  • Now supports Unified Script Injector on Firefox Mobile
  • Dropped GM_registerMenuCommand and menu item in favor of on-page elements
  • Minor bug and consistency fixes
1.3 - Added translucent option to background color, fixed fade effect on default background, fixed config dialog not loading properly when closed/reopened without reload
1.2.1 - Fixed collapsed signature fade effect to mimic background color
1.2 - Improved signature collapsing, will now display 3 rows with rest faded to hidden. Clicking the faded area will reveal entire signature. Short signatures are exempted from collapsing.
1.1 - Implemented support for presets. Added Discord and Firefall forums color presets

Roadmap:
  • Improve background styles (+ stretch goals)
    • Slideshow - Allow to set duration and speed (+ change implementation from JS to CSS transitions with better performance)
    • Static image - Allow to select which image to show (+ support custom URLs)
    • Random - Allow to specify interval when change occurs (+ prevent repeating)

Hope this helps, let me know if it works for you, if you faced issues or would like to see something added.
 
Last edited:

Xeevis

Max Kahuna
Max Kahuna
Forum Tech
Jul 26, 2016
105
541
93
www.emberbot.com
#11
pretty sure there's an option to hide signatures in individual preferences no?
Yes but that will disable them completely. EFD will hide them, but still allows you to show them on case-by-case basis. I plan to improve it so signatures show for like 2 lines and 3rd line will be fading into nothingness with option to fully expand on click so small signatures display in full while big sigs with a lot of text or images will show only partially. Implemented.

 
Last edited:
Jul 27, 2016
412
472
63
#13
Yes but that will disable them completely. EFD will hide them, but still allows you to show them on case-by-case basis. I plan to improve it so signatures show for like 2 lines and 3rd line will be fading into nothingness with option to fully expand on click so small signatures display in full while big sigs with a lot of text or images will show only partially.

Oh okay, I thought you were trying to avoid disabling them across the whole forum for everyone but still allow people to choose if they wanted them to show. (does that make sense?) Gotcha. Okay, that's the best of both worlds then.
 
Jul 27, 2016
84
65
18
#14
Awesome work.

Out of curiosity, would it be possible to add these features to the forums by changing the forums source-code instead of using an addon?
 

Xeevis

Max Kahuna
Max Kahuna
Forum Tech
Jul 26, 2016
105
541
93
www.emberbot.com
#15
Update 1.2
  • Improved signature collapsing, will now display 3 rows with rest gradually faded to hidden. Clicking the faded area will reveal the entire signature. Short signatures are exempted from collapsing.
 
Likes: Mizogin

Xeevis

Max Kahuna
Max Kahuna
Forum Tech
Jul 26, 2016
105
541
93
www.emberbot.com
#16
Awesome work.

Out of curiosity, would it be possible to add these features to the forums by changing the forums source-code instead of using an addon?
The thing is, more you customize something, the more work it is to update it. Both XenForo and theme are being updated regularly by their respective creators and we can get those updates for free* and with no time invested. If we were to start making changes to them, then every update would need to be merged in manually (so edits aren't overwritten). This becomes hard to maintain as theme needs to be updated to work with recent versions of XenForo and many edits eventually lead to deadlock (being stuck at certain version because upgrade path is too complex and prone to errors).

As far as functionality is concerned, Ember forums are fine the way they are. This is really just cosmetic stuff and this is what user scripts were designed for, give every user full power to make all the changes he wants. You can change any style on these forums with 1 line of code. Any server-side implementation would be incredibly limited in comparison.