Make the New Welcome Screen in Delphi Usable

Why is it that when companies have a good thing, they have to go mess it up by changing its design? I've seen this in many different industries but since change happens so much more quickly in software, I seem to be annoyed much more often with changes in user interface. Of course, there are glaring examples like the ribbon in the Office products and the Windows 8 start screen (which I actually liked when using it on a tablet).

But today I'm talking about the Welcome screen in Delphi XE8 and newer. Way back in Delphi 2005 or 2007 (I forget when exactly), a new welcome screen was displayed when Delphi started and provided a nice collection of resources and helpful links to documentation. One of the features of this new interface was an editable list of favorite projects that could be put into "favorite groups" and made for a nice, quick link to lots of different projects. The font was small and it utilized the space pretty well. I used it a lot and since I work on lots of small projects, this was very useful.

I've recently upgraded to the latest version of Delphi and have found this useful interface has been completely revamped with a big banner ad and large-font shortcuts with big icons to things I can already get to with a few keyboard strokes. Yes, there's still a list of favorite projects, but you can't create groups any more and the scrollable region for them is so small that with the number of projects I work on, it's practically useless.

Why is this better???

Fortunately, the welcome screen is written in HTML and easily found in the Welcomepage folder of your Delphi installation. (Your Delphi is installed, by default, under C:\Program Files (x86)\Embarcadero\Studio\<BDS-Version>). As has been mentioned elsewhere, it's pretty easy to remove the banner (why we have to have advertisements inside our development tool is beyond me) so that was the obvious first step. But I wanted to go further. I have no need for the links to create a new project or the links to the tutorials. I can get to those easily enough. For my day-to-day work, I need quick access to the projects I'm working on.

So I cut it down to two lists: Favorite Projects and Recent Projects. I still like the old interface better--and I briefly tried copying the welcomepage from an older version, but it crashed violently, so didn't spend much time going down that path.

Here's a step-by-step list of how you can modify the Welcome Screen in your installation of Delphi, but first a disclaimer: Be sure and make a backup of your welcome page before you begin (I mention this in the steps below, but emphasize it here as well). Also, it really helps to understand HTML and CSS when editing these files in case things look a little different in your installation. These steps are mostly for Delphi 10 Seattle and the XE8 version is a little different. Also, you might be reading this using a newer version of Delphi and the file may have changed again (I would count on it). On the other hand, it's just the start screen and Delphi functions fine without it.

1. First, locate the welcome page. As I mentioned above, the root folder for the welcome page files is simply Welcomepage under your Delphi installation. The "default.htm" file in this root folder is, to my knowledge not used. Instead, choose the 2-character abbreviation for your installed language and find the file there. For example, I use the English version of Delphi so found my copy of the welcome page for Delphi 10 Seattle in C:\Program Files (x86)\Embarcadero\Studio\17.0\Welcomepage\en.
2. Make a backup of the file so if you mess anything up, you can always easily recover by going back to it.
3. Now, pull up your favorite HTML editor, but there might be a catch. If you installed Delphi in the default folder, it's under Program Files (x86) and can only be edited by the administrator account. There's a trick used by Windows to prevent side-stepping this with some editors that even if you run as Administrator, it is only editing a "shadow copy" of the file. It's weird to me, but I just ended up using Notepad as it seems to save the right file. If you were smart and didn't install Delphi under Program Files, then you don't have to worry about this.
4. Remove the banner ad. Find the <div> tag with id="topbanner" and delete everything until the matching <\div> tag. I removed 10 lines in mine. Now with the banner ad removed, there's no use keeping the Javascript around that spends time getting it online. So look for the function, tryShowOnlineBanners(). You should find the definition and the place where it is called in that same file--it's not defined or used externally. That function calls another function, showOnlineBanners() and you can remove that as well. I deleted 25 more lines.
5. Now it's time to get rid of the new projects and tutorials short cuts. In XE8, the Favorites are across the bottom, in Delphi 10 Seattle, it's between the new projects (on top) and tutorials (on bottom). In Delphi 10 Seattle's Welcome page, look for <div class="section"> tags that contain "Projects" and "Tutorials" and remove those sections of the HTML (but not the one in the middle that contains "Favorite Projects"). In Delphi XE8's welcome page, do the same thing but realize the <div> tags may be in a different place. New projects call the Javascript function newProject() but it's in an external file, so it's best to leave it alone. The tutorials call the local Javascript function, doStartTotorial() so that can go (isn't it fun cutting out code?).
6. With Delphi up, you can look at the welcome screen and even make changes on the fly, right-click, and Refresh to see your changes instantly. After the last edit, you'll notice the Favorite Projects is a small scrolling box in the top of left column of the page with nothing below it. So we need to adjust the height. Looking at the HTML, you'll see the Favorite Projects and Recent Projects sections with a few different CSS classes in use. You'd think this is where we need to modify things, but it turns out some Javascript further down the page overwrites the heights dynamically. In the resizePanels() function, the height property of the favorite-projects class is decreased by 388 whereas the recent-projects height is only decreased by 44. Let's use 44 in both cases so they're the same height.
7. We're close but there's a bunch of space at the bottom. It turns out there's an extra box down there (with an id of "load_html") we aren't using the same way anymore. It's height is adjusted in the setFrameHeight() function. I found changing the reduction in the height property from 184 down to 70 filled the screen nicely.

Hopefully, nothing got messed up too badly and you have a nice clean list of projects that you can quickly get to rather than scrolling through a tiny box or hunting through folders if it scrolled off the recent projects list. Let me know in the comments if you found something different or if I skipped a step. Also, feel free to drop me a line of thanks either in the comments or on the contact page of my site, CorneliusConcepts.com if this helped you work more efficiently!