Find User here you can look for a user

Ape Apps Website Overhaul

Anyone who has been to the site over the last week has surely noticed the significant changes that have been occurring on a near hourly basis, as well as a whole host of issues and errors. This is because I have decided to do a complete overhaul of the Ape Apps website, bringing the design and functionality closer in line with other games, apps, and products in the Ape Apps ecosystem. And while the redesign is still not 100% complete, the site is now mostly functional again, so I thought I would take the time to go over what has changed (and why), what is new, and what is coming down the pike.

A few months ago, I created a new UI framework called ADL which consists of common fonts, styles, controls, toolbars, buttons, etc., allowing me to achieve a consistent cross-platform design with little to no effort on my part (except for the huge effort I went through up front). You can witness the framework live in most of my products, from My Colony to Ape Web Apps and the Ape Apps Launcher. The ADL framework is responsible for all of the fonts, styles, slide-out menus, dialogs, and all sorts of other control types that you will find across most of my current offerings, and it is now firmly embedded within the main Ape Apps website as well.

The primary benefits to using a common UI framework across the entire ecosystem, and indeed the reason why I've put so much time into developing it over the last few months, are to achieve a consistent design across the board, and for ease of maintenance going forward. Prior to the development of ADL, a major change in style or design would have to be be done for each app, game, and website individually. A massive undertaking, which is why most of my sites share no common design language at all. By migrating everything over to the shared framework, updates can be made across the entire ecosystem by modifying only the base ADL code. I consider this to be a massive bonus in terms of time savings and ease of maintenance.

In the months ahead, more and more Ape Apps software and services will be making the switch to the common UI framework as well, but once the migration is complete, updating everything will be easier than ever, which I am very much looking forward to.

Now, since I was already digging deep into the code for the website, I decided to start tinkering with other things that are not necessarily related to the ADL framework, but which I think will improve the overall site experience anyway. I am going to go over some of the larger changes, in no particular order. There are also minor change all over the place, which you will no doubt notice as you browse the site.

Although it's not active at the very moment of the writing (but it may be active by the time you read this), the site now has full support for both Dark and Light themes. I recently switched to a dark theme on my PC, which also happens to make many websites adopt a dark theme, including some Ape Apps sites like the Ape Market. This feature was lacking on this site though, and it almost looked jarring compared to other sites on the web. So now going forward, the site will be set to automatically adjust it's theme based on the user's device theme settings. The user will also be able to override this on their Edit Profile page, and force the site to use either a Light or Dark theme.

The layout of a user's posts on the forum has been updated. If you are on a non-mobile device (mobile screens to not have enough room), there is a new sidebar on posts displaying some information about the post author.


The main additions are the user reputation readout, and the achievements readout. The Reputation readout is an aggregate of all of the likes or dislikes a user has earned on their forum posts. If the aggregate is negative, it will show a thumbs down instead of up. Since this aggregate information is now being tracked, it can be used to take automatic administrative actions against a spammer, so if you notice spam in the forum before a mod or admin does, feel free to downvote them into oblivion. Note that the aggregate is only tabulated when a new vote is received. I didn't bother writing a function that scrolls through all 28k+ members of the forum to tabulate their reputation score. If you are curious as to what your current reputation score is, just up or down vote one of your own posts, and the server will calculate your rating.

The achievements section is simply linked to your achievements score on your Ape Apps Account. At some point in the not too distant future, you will be able to view all of your achievements right here on the site and compare your progress against other users. Until then, if you want to see your current achievements for all titles, you can find the information in the Ape Apps Launcher.

I have made improvements to the in-page display and rendering of attached Voxel Paint models (*.vpp files).


Aside from the updated layout, you will no doubt notice that the mouse-wheel zooming in/out of the models has been greatly improved. This was actually a pain to fix, as the browser by default does not allow you to override the default scrolling behavior of a page, for reasons unknown. Eventually what I had to end up doing, is watching for whenever a user's mouse pointer enters a .vpp model and then apply a special CSS style to the page that locks the height and hides all content outside of the viewport. You can see this in action by mousing over a vpp model and watching as the page scrollbar disappears.

I noticed on the server that the site had a lot of "orphaned" conversations. That might not be the right word, but I am referring to conversations that have only one user in them, because all other participants have left the conversation. To address this, the server will be automatically clearing these old conversations out if 1) they have only one participant, and 2) they have been inactive for six months. Also, to make it easier for a user to determine if they are the only person remaining in a conversation, conversations now prominently display their active participants on the top of the page. Users will also see this lovely notice at the bottom of the screen in this scenario.


Hashtags work on the site again. When I first developed the site, it had support for creating #hashtags, but when I started adding more support for different BB Code tags, tags that specified hex color codes were killing the hastag system. I solved this by simply requiring hashtags to have 7 or more characters, which gets past the hex color problem (colors like #ff0000 will not be parsed), and also could avoid spammy short tags. Of course, the hashtag system itself is somewhat pointless, but it always bugged me that I had to disable it to support hex colors.

Speaking of BB Code, I have expanded the BB Code compatibility to add a few tags that were available on my old RP Forums website.
The box2 tag is similar to the original box tag, except it allows you to specify both a background color and a border using CSS. Here is the code used to make this box:
[box2 color="#f44336" border="4px solid #b71c1c"][color=white]CONTENT HERE[/color][/box2]
The gradbox is a little more complicated to use, but not overly so. In this box, you create a gradient background by specifying direction, the colors you want to use, and the box border. Below is the code used to make this box:
[gradbox d="to right" c="#2196F3, #0D47A1, #1A237E" b="2px solid white"][color=white]CONTENT HERE[/color][/gradbox]
The imgbox is fairly simple to use, it's just a box with a background image url specified. Here is the code to create this box:
[imgbox=https://backgroundbag.com/backgrounds/6.jpg][color=white]CONTENT HERE[/color][/imgbox]
Now, the imgbox is nice, but it can be hard to read text on top of an image like that, so you would probably want to put your text inside of another container box. For that, there is one new box available called the glassbox, which has a frosted glass background when placed inside of an imgbox.
Text just sitting on top of an image can be hard to read.
A glassbox can help make things look better by creating a frosted glass background on top of your image. The only problem - it doesn't work on Firefox. Here is the code to make the glassbox:
[glassbox]CONTENT HERE[/glassbox]
There is also a new undocumented div tag that basically lets you create a new div element with any CSS styling that you want, but since you can use it for evil by doing something like this, I will probably end up disabling it, although it could also be used to make some really cool layouts for posts 😳

Also, keep in mind that all boxes can be nested, floated, and placed within other tags to create pretty much any layout you could possibly need for your post. Be sure to check out the full BB Code Reference for details.

Also in the coming days, I am adding an option on the site to get your site notifications instantly through the Ape Apps Launcher. Presently whenever you get a new conversation or a private message or there is a reply to a topic you are subscribed to, the forum will send you an email. Soon, you will also be able to get the notification instantly on your desktop if you have the Ape Apps Launcher installed. This will be an opt-in feature, and is also going to require an update to the Launcher. I am also adding the ability to reply to private messages directly from within the Launcher.

So anyway, that was a nice look at some of the new features available now or soon on the website. Please let me know what you think, and what features you would like to see added in the future. Writing this site from scratch has been a huge undertaking over the last several years, but it's now a mostly full featured forum, blog, wiki, comic page, podcast server, and more, with more capabilities coming all the time!
Welcome
Ape Apps, LLC is an independent software development company founded in 2010 by Brandon Stecklein. Over the years, Ape Apps has published over 400 apps and games across various platforms. You can get in touch with Brandon on Twitter or by leaving a post on his wall @bastecklein
App of the Day