Number of Small Forum Code Changes (TODO List Items)

In the past few days have I have done a lot of code cleanup work in various categories, including faster page loading and bug fixes:

  • Move countless inline style directives to external CSS stylesheets for key pages (faster page loading)
  • Fixed bug in member panel going between desktop and mobile (on desktop) by changing to a cookie-based javascript method.
  • Fixed bug when a user logs out and gets a "no permission" error because they were viewing a page only available to members. Now all logouts are redirected to the home page.
  • Fixes various bugs with alignments when changing screen sizes.
  • Lots of Bootstrap related changes on mobile and desktop.
  • Many fixes I cannot think of at the moment.
  • Updated forum staff groups (as we do at toward the end of most years), moving some inactive mods out of the mod group to make room for new mods who will be more active; and ditto for a long inactive admin (not coding for years) from the admin group.
  • Completed changed the User Profile pages (user information modal) and the menu for the UserCP (mobile and desktop).

MAJOR TODO:

  • Recall in early September we were forced by our hosting company to move to a server with another company. GWT indicates that something strange happened related to our Apache web server which causes a 302 redirect, somehow related to our SEO-friendly links. This seems to be related to some Apache2 configuration (perhaps a module or some configuration param) issue which I have not figured out so far. This error seems greatly responsible for our recent drop in search ranking and search referrals (related to Google searches).

REGULAR TODOS:

  • Continue to move inline CSS to external style sheets.
  • Fix mobile meta data.
  • Move responsive control code from jQuery to CSS.

NEW PROJECT:

  • Start on coding a new badging system for the forums.

Cheers.

2 Likes

In addition, today I made considerable changes for mobile:

  • Cleaned up many mobile pages by applying Bootstrap classes including all the edit, new reply and moderation pages.
  • Fixed fonts and formatting on mobile forum display pages.
  • Cleaned up mobile view by removing (hiding) all deleted threads and sticking threads when viewing on mobile.
  • Fixed a number of footers on mobile, changing the footer to a "Go Back" links which is useful when on mobile.
  • Fixed a lot of other things, but I cannot recall at the moment.

The mobile site is starting to look really good, so I encourage everyone to view the forums when mobile.

In the future, I plan for mobile:

  • Add a mini-editor tool bar for mobile, adding code tags and uploading attachments from mobile devices.
  • Add the thanks button to posts and also a newly designed thanks box to the bottom of the mobile posts.

Starting on a mini-toolbar for the mobile editor, I just added a code tag button to the showthread and newreply functions in mobile, using this JS code

<script>
String.prototype.insertAt = function(index, string) {
  return this.substr(0, index) + string + this.substr(index);
};

function makeBBCode(start, end) {
  var txtBox = document.getElementById("m-st");
  txtBox.value = txtBox.value
    .insertAt(txtBox.selectionEnd, end)
    .insertAt(txtBox.selectionStart, start);
}

</script>

HTML:

<div class="d-flex justify-content-between m-st-lt">
<span style="font-weight:bold;">Reply:</span>
<span>
<i onclick="makeBBCode('','

')"class="fas fa-code" style="margin-right:30px;padding-top:10px;">
</i>
</span>
</div>[/NOPARSE][/CODE]

Works fine. Just need to add more FA buttons and add NOPARSE wrappers for this.

Done... if I force NOPARSE with the CODE TAGs, there are no errors when there is BBCODE tags in the code being tagged; but this is the same problem in the desktop, so it's not a big deal.

So now I have a new way ahead (no need to use the legacy toolbar code from the desktop code) to make a mini-toolbar for the mobile editor, but the problem with this approach is that it is hard to select text on mobile (doable, but a pain).

I may consider installing MARKDOWN for this instead:

Markdown Ref: Markdown - Wikipedia

In the meantime, have added BBCODE tags on mobile for:

  • CODE
  • ICODE
  • QUOTE
  • NOPARSE

I think I will stop here unless anyone who uses mobile has any personal BBCODE tags to request.

Have Bootstrap'ied many, many mobile pages, especially editors, etc. Things are looking good and I'm getting board with cleaning up CSS and Bootstrap, but mobile is now looking much better, and since I use it a lot, that's important! Haha.

Maybe I'll start on the new badging system soon... I keep putting it off, doing housekeeping and code cleanup tasks first; but at some point in time, cleaning up CSS is getting mundane. The good news is that I'm getting REALLY good at it.

I look at my legacy code and think to myself "wow, I was such a terrible CSS coder back then!!!!!"

If I was not so busy making it happen, I could write a book or do use YT videos on this stuff!

I can do things in minutes that took hours years ago. My jQuery and CSS skills are really good. I've almost memorized half or more of the Bootstrap classes (give or take) and can code a lot of Bootstrap without references and cheatsheets at blazing speeds. Wooo Hoooo..... Mama' don't let your babies grow up to be coderrrrrrrs ...... LOL

I guess I need to master VueJS sooner than later; maybe I'll do the new badging system in Vue... maybe not!

Updates:

  • Updated headers for individual man pages on mobile.
  • Updated a number of footer on mobile pages.

TODO:

  • Change formatting and loading behavior of man page repositories (per OS) using Bootsrap Flex and/ or Grid classes.
  • Consider how to change loading behavior of large man-page sets using some lazy loading or AJAX loading method.
  • Change order of bbcode tag buttons in the desktop editors, moving less used buttons to the right. For example moving code tag buttons to the left and the indent and smiles to the far right.