Customization of the web GUI

One of the new features in version 1.3.0 is to support ‘self-service’ customization. In the past it was possible to customize the old native GUI but it was a lot of work so it was only offered to users who committed to a certain number of licenses. With the new web-based GUI, the customization becomes so easy that I think it makes sense to open it up and allow everyone to do it.

For the customization to work, you’ll first need to rename the web GUI executable. As an example I would rename it to s3backup_1.0. Then create a file named s3backup-config.json in the same directory as the executable like this:

{
    "product_version": "1.0",
    "product_name": "S3Backup",
    "product_full_name": "S3Backup",
    "product_website": "https://s3backup.com/product",
    "company_name": "S3Backup LLC",
    "company_website": "https://s3backup.com",
    "service_description": "An S3 backup tool based on Lock-Free Deduplication",
    "configuration_directory": "s3backup",
    "configuration_file": "s3backup.json",
    "log_file": "s3backup.log",
    "password_variable": "S3BACKUP_PASS",
    "storages": "disk s3"
}

Here is the explanation of each key:

  • product_version: the version displayed on the dashboard page
  • product_name: the short name of the customized software
  • product_full_name: the full name; may contain spaces
  • product_website: the url to the product website
  • company_name: the name of your company
  • company_website: the url to the company website
  • service_description: the description for the Windows service
  • configuration_directory: the directory where the configuration file is stored; defaults to duplicacy-web; note that a leading . will be added
  • configuration_file: the name of the configuration file; defaults to duplicacy.json
  • log_file: the name of the main log file; defaults to duplicacy_web.log
  • password_variable: the environment variable that holds the master password; defaults to `DWE_PASSWORD’
  • storages: the storage backends that will be supported and shown (options are disk sftp s3 b2 gcd azure gdrive onedrive swift webdav dropbox)

Now you need to create a directory named icons under the same directory as the executable, and make the following icons:

  • product-icon.png: the program icon shown in the top left corner on every page
  • state_free.png or state_free.ico: the icon shown in the system tray icon (or the menu bar) when there are no active schedules
  • state_busy_1.png or state_busy_1.ico: the icon to show when there are active schedules
  • state_busy_2.png or state_busy_2.ico: for animation (to spin the icon) when there are running schedules; can be the identical to state_busy_1 in which case there is no animation
  • state_busy_3.png or state_busy_3.ico: similar to state_busy_2
  • state_busy_4.png or state_busy_4.ico: similar to state_busy_3

Note that for Windows the icon files state_* should have the .ico extension; on other platforms .png should be used.

That is it – now run the renamed executable you’ll see the customized version up and running!

6 Likes

Hello
I have it quite clear to customize it as an application.
You could be a little more detailed as we should install duplication as a service in windows in a personalized way and have no problems in future updates.
How do we install the service?
Thank you

Run the web GUI with the -install-service option to install the service:

\path\to\duplicacy_web_win_x64_1.3.0.exe -install-service

and -uninstall-service to uninstall the service:

\path\to\duplicacy_web_win_x64_1.3.0.exe -uninstall-service

Normally you want to do this from your own installer.

I’ve playing around with this, and everything worked fine (icons, texts), except the product-icon.png.

I tried in several ways (png, ico) and the original icon still appears, pointing to “http://127.0.0.1:3875/assets/img/product-icon.png

The file name should be product-icon.png, not product-icon.ico, placed under icons.

The link is right. assets/img/product-icon.png is supposed to be replaced by this file.

Check ~/.duplicacy-web/logs/duplicacy_web.log. There should be a log file if the file can’t be loaded for some reason.

Or maybe your browser needs a hard refresh.

I know, that’s exactly what I did:

icons

No errors, just a lot of lines like:

...
127.0.0.1:51410 GET /assets/img/product-icon.png
127.0.0.1:51414 GET /assets/img/product-icon.png
127.0.0.1:51412 GET /assets/img/product-icon.png
127.0.0.1:51414 GET /assets/img/product-icon.png
...

Maybe I didn’t explain it well: there is no error in the interface, just the default icon remains: duplicacy-32

I cleared the browser cache and the application cache. Same result.

Which icon are you referring to, the one on the browser tab or the one on the top of the left-side navigation menu?

The one on the top of the left-side navigation menu.

I right clicked on it to obtain the url I showed above:

http://127.0.0.1:3875/assets/img/product-icon.png

I can confirm that only the Windows version has this issue. It turned out to be a bug in the data bundling library that had been fixed but my Windows build machine was still using an old version.

I uploaded a new version: https://acrosync.com/duplicacy-web/duplicacy_web_installer_win64_1.3.1.exe. Can you test it?

1 Like

Worked perfectly. Thanks!

Windows + Service + Customize
I need a guide, please.

Did you run into any specific problem?

My steps:

  • I have installed duplicacy 1.3.1 over windows 10 without enable “install as service”
  • I did customization steps.
  • I ran command to install service.
    Then the app installed run but the service is not installed.

The command to install the service should be:

Rcbackup_1.0.exe -install-service