AppWave UI Customization

From AppWave
Jump to: navigation, search

Go Up to Admin User Guide

Using the User Interface Theme option on the AppWave menu of the AppWave Administration page, you can customize existing themes to change the fonts and background colors of the interface. You can also package your own theme, consisting of a styles.css file and a directory of images that when implemented can replace the existing AppWave theme.

You can customize the following features of the private AppWave user interface:

  • Body
  • Header Logo
  • Navigation menu
  • Menu contents
  • Dashboards header, logo, contents, descriptions and icons
  • View of users
  • All icons

Customizing the AppWave User Interface Theme

User Interface Customization.png

  1. From the AppWave menu, select User Interface Theme.
  2. The text that displays in the orange box above is the .css file for the User Interface Theme select. In the case above, it’s the Default user interface theme.
  3. If you do not have access to the AppWave host file system to add a theme to the correct place in the AppWave installation directory, you can edit the .css file above to customize the user interface and then click Save.

Customize the Default Theme

You can edit the Default .css theme directly and then click Save. Otherwise you can download it to modify it locally and the upload and apply it.

Follow these steps if you want to modify the active theme and then upload it later from the host:

  1. Click the Download Theme button and download the Default.zip file containing the style folder with the theme.css files and the images folder.
  2. Click Add Theme to upload the Download.zip with your changes.
  3. Click Save.
  4. Press F5 to refresh the page you are viewing.

Add a new theme

If you have access to the AppWave host file system and want to add a new theme:

  1. Create two new directories for the customized files, Images and Styles.
  2. Change any of the images described in Replacing the Images in the AppWave Admin User Interface, and place the replacement images in the Images directory.
  3. Create a .zip file containing the Images and Styles directories. You can name the .zip file anything you like.
  4. Click Add Theme and locate the .zip file you just created that contains your new theme files. The new theme appears in the User Interface Theme list.
  5. From the User Interface Theme list, select your new theme and then click Apply Theme.

Note: If you have a custom theme selected, you can revert to the Default theme by clicking Remove Theme at the bottom of the User interface Customization page. However, if you change the default theme you cannot revert to it automatically in this fashion. You would need to undo the changes you previously made to the default theme.

Customizing the Format of the User Interface Theme

The following describes the elements of the .css file that you can customize. C:\Program Files\Embarcadero\AppWave\4.2\webapps\aaserver\style

These descriptions are presented in the following format:

Body

  • Image: N/A
  • Description: The Body style is the parent of all elements and also describes the background image.
  • CSS classes: .body

Header

  • Description: The Header element contains the logo and the navigation menu.
  • CSS classes: .header_wrapper , .hdr

  • Description: Main logo
  • CSS classes: .main_logo

Navigation Menu

  • Description: Navigation menu common style
  • CSS classes: .mininav_wrapper

Element Navigation Menu

  • Description: Navigation menu item
  • CSS classes: .mininav_wrapper a:link, .mininav_wrapper a:visited, .mininav_wrapper a:active, A:link, A:visited .menuBarItem

Welcome item on the navigation menu

  • Description: Welcome item in navigation menu
  • CSS classes: .menubox, .menuoption

Menu

  • Description: Main menu in the Admin user interface.
  • CSS classes: .content-rightpanel

Box for menu items

  • Description: Box for menu items
  • CSS classes: .content-rightpanel .moreinfo_box, .content-rightpanel .seealso_box, .content-rightpanel .customer_qoutes

Header box for menu items

  • Description: A description of the element.
  • CSS classes: .seealso_box h1

Menu items

  • Description: Menu items
  • CSS classes: .seealso_box .links, .archive .links, .moreinfo_box .links

Menu items link

  • Description: Menu items link
  • CSS classes: .archive .links a:link, .archive .links a:visited, .archive .links a:active, .moreinfo_box .links a:link, .moreinfo_box .links a:visited,
    .moreinfo_box .links a:active, .seealso_box .links a:link, .seealso_box .links a:visited, .seealso_box .links a:active

Welcome to Embarcadero AppWave Dashboard (welcome.spg)

  • Description: Dashboard page common style
  • CSS classes: .bodyText

Dashboard header

  • Description: Header for dashboard page
  • CSS classes: .bodyText h1

Dashboard header picture

  • Description: Picture for header dashboard
  • CSS classes: .pageTitle_icon, img

Dashboard description

  • Description: Dashboard description
  • CSS classes: .wizard_desc, .image_holder, p, .std

Dashboard elements

  • Description: Dashboard elements common class
  • CSS classes: .wizard

Dashboard element image

  • Description: Dashboard element image
  • CSS classes: .wizard_icon, .wizard A, .wizard_icon img

Dashboard element header

  • Description: Dashboard element header
  • CSS classes: .wizard A, A:link, A:visited

Dashboard element description

  • Description: Dashboard element description
  • CSS classes: .image_holder, p, .std, .wizard span

Dashboard element description image

  • Description: Image for dashboard element description
  • CSS classes: .wizard_top_icon, img

Dashboard element tips

  • Description: Dashboard element tips
  • CSS classes: .wizard_tips

Dashboard element tips item

  • Description: Dashboard element tips item
  • CSS classes: .wizard_item

Users (viewUsers.spg)

  • Description: Common style for this page
  • CSS classes: .bodyText

Users header

  • Description: Style for header
  • CSS classes: .bodyText h1

Users form search

  • Description: Style for search form
  • CSS classes: .searchPad

Users form search label

  • Description: Style for search form label
  • CSS classes: .filterLabel

Users results table

  • Description: Style for users results table
  • CSS classes: .downloads_table

Replacing the Images in the AppWave Admin User Interface

The following describes the images that you can replace with your own. C:\Program Files\Embarcadero\AppWave\4.2\webapps\aaserver\images

These descriptions are presented in the following format and images in the same area are grouped according to the page they appear on when applicable.

Logo Description CSS and spg file Area
aaserver/images/logo_new.gif Company Logo Logo
aaserver/images/Products16.png Picture top of menu with inscription APPWAVE #menuProductsAdministration Menu
MANAGE APPS #menuProductsAdministration Menu
aaserver/images/UpdateProductCatalog16.png Dashboard #menuUpdateProductCatalog Menu
Version Updates #menuUpdateProductCatalog Menu
aaserver/images/UsersGroups16.png MANAGE USERS & GROUPS #menuUsersAdministration Menu
aaserver/images/EditRemoveUsers16.png Users / License Assignments / Assignment named users #menuViewEditUsers / #menuLicenseAssignments Menu
Users #menuViewEditUsers Menu
License Assignments #menuLicenseAssignments Menu
Assignment named users viewFolder.spg?id=<folderID> View Folder
aaserver/images/EditRemoveGroups16.png Groups #menuEditRemoveGroups Menu
Connected Users #menuConnectedUsers Menu
Assignment concurrent users viewFolder.spg?id=<folderID> View Folder
aaserver/images/LDAP16.png LDAP #menuEditRemoveGroups Menu
aaserver/images/Folders.gif MANAGE FOLDERS #menuFoldersAdministration Menu
aaserver/images/folder.gif All Apps, All Access, Communications, Database Tools, and Developer Tools #menuFolderView Menu
aaserver/images/ViewRemoveConfigurations16.png App Folders #menuFoldersView Menu
aaserver/images/ViewProducts16.png App Inventory #menuViewProducts Menu
Moderate Reviews #menuProductReviews Menu
Banners Management #bannersManagement Menu
Email Direct Marketing #edmConfig Menu
aaserver/images/CachingProgress16.png Download Progress #menuUpdateProductCatalog Menu
aaserver/images/Licenses16.png MANAGE LICENSES #menuMainLicenses Menu
aaserver/images/CurrentLicenses16.png License Inventory #menuLicenses Menu
License Automation #menuLicenseAutomation Menu
aaserver/images/ConfigurationManagement16.png SYSTEM MANAGEMENT #menuMainSysParam Menu
aaserver/images/ViewRemoveConfigurations16.png Service Status #menuParamSystem Menu
System Properties #menuParamSystem Menu
Streaming Service #menuParamStreaming Menu
Backup License Server #menuParamSystem Menu
aaserver/images/Reports16.gif Reports #menuReporting / #menuParamStatistics Menu
aaserver/images/Overlay-ok.gif service online welcome.spg Dashboard
Service status OK serverStatus.spg Service Status
aaserver/images/Overlay-block.gif Service block welcome.spg Dashboard
Service status not available serverStatus.spg Service Status
aaserver/images/Overlay-Warning.gif Service warning welcome.spg Dashboard
Service status warning serverStatus.spg Service Status
aaserver/icons/Icon_AllAccess_32.png Download AppWave Browser welcome.spg Dashboard
aaserver/images/App-info.gif Section is available welcome.spg Dashboard
aaserver/images/ViewRemoveConfigurations.png Main picture for App Folders viewAllFolders.spg App Folders
Service Status welcome.spg Dashboard
Manage mastering plugins welcome.spg Dashboard
Main picture for Edit Folder editFolder.spg?id=<folderID> Edit Folder
Reservations for concurrent licenses licenseAssignments.spg License Assignments
Reservations for workstation licenses licenseAssignments.spg License Assignments
Main picture for Reservations reservations.spg and workstationReservations.spg Reservations and Workstation Reservations
Main picture for System Properties smtp.spg System Properties Email
Main picture for View Folder viewFolder.spg?id=<folderID> View Folder
aaserver/images/EmbarcaderoLicense.png Set up licenses welcome.spg Dashboard
aaserver/images/App-block.gif Section is not available welcome.spg Dashboard
aaserver/images/download1.gif Download applications welcome.spg Dashboard
aaserver/images/LDAP.png Import LDAP users and groups welcome.spg Dashboard
aaserver/images/App-warn.gif Warning section welcome.spg Dashboard
aaserver/images/EditRemoveUsers.png Change admin password / Named licenses management welcome.spg Dashboard
Named licenses management licenseAssignments.spg License Assignments
Streamed app report statisticsMain.spg Reports
aaserver/images/UpdateProductCatalog.png Update application catalog configuration welcome.spg Dashboard
Main picture for Version Updates updateProductCatalog.spg Version Updates
Main picture for Streaming Service streamingDashboard.spg Streaming Service
aaserver/images/App-ok.gif Configured sucessful welcome.spg Dashboard
AppWave Backup Setup welcome.spg?backupServerSetup=1 Dashboard
AppWave Backup Setup welcome.spg?backupServerSetup=1 Dashboard
aaserver/images/Computer.gif Manage disk space welcome.spg Dashboard
aaserver/images/Disc-Ok.gif Show Disk Space Ok welcome.spg Dashboard
aaserver/images/Disc-Warn.gif Show Disk Space warning welcome.spg Dashboard
aaserver/images/Disc-Info.gif Show Disk Space Info welcome.spg Dashboard
aaserver/images/backupServer.gif Set up backup license server welcome.spg Dashboard
Main picture for AppWave Backup Setup welcome.spg?backupServerSetup=1 AppWave Backup Setup
Configure the backup license server welcome.spg?backupServerSetup=1 AppWave Backup Setup
Set AppWave as backup license server welcome.spg?backupServerSetup=1 AppWave Backup Setup
aaserver/images/ViewProducts.png Main picture for Welcome to Embarcadero AppWave Dashboard welcome.spg Dashboard
Main picture for Moderate Reviews searchReviews.spg Moderate Reviews
Main picture for Banners Management bannersManagement.spg Banners Management
Main picture for Email Direct Marketing edmConfig.spg Email Direct Marketing
Main picture for App Inventory tools.spg App Inventory
Main picture for Third Party Licenses 3rdPartyLics.spg Third Party Licenses
Main picture for Auto Activation Licenses 3rdPartyLics.spg?scope=autoActivation Auto Activation Licenses
Main picture for Service Status serverStatus.spg Service Status
aaserver/images/EditRemoveUsers.png Main picture for Users Section viewUsers.spg User
Main picture for License Assignments licenseAssignments.spg License Assignments
aaserver/images/user.png User in list viewUsers.spg User
User icon concurrentUsers.spg, namedUsers.spg, workstationPermissions.spg Concurent Users, Named Users, and Workstation Permissions
aaserver/images/edit.gif Edit user viewUsers.spg User
Edit Banner bannersManagement.spg Banners Management
Edit entry 3rdPartyLics.spg Third Party Licenses
Edit entry concurrentUsers.spg, namedUsers.spg, workstationPermissions.spg Concurent Users, Named Users, and Workstation Permissions
Edit entry reservations.spg and workstationReservations.spg Reservations and Workstation Reservations
Edit entry 3rdPartyLics.spg?scope=autoActivation Auto Activation Licenses
aaserver/images/EditRemoveUsers.png Main picture for Users Section viewUser.spg?id=<userID> View User
aaserver/images/group.png Member of group picture viewUser.spg?id=<userID> View User
aaserver/images/ConfigurationManagement16.png Folders owner picture viewUser.spg?id=<userID> View User
aaserver/images/CurrentLicenses16.png Licenses viewUser.spg?id=<userID> View User
aaserver/images/CreateGroups16.png Add Groups / Add Folders editUser.spg?embtUsrId=<userID> Edit User
aaserver/images/destroy.gif Remove All editUser.spg?embtUsrId=<userID> Edit User
Delete binaries tools.spg App Inventory
Delete entry concurrentUsers.spg, namedUsers.spg, workstationPermissions.spg Concurent Users, Named Users, and Workstation Permissions
Delete entry reservations.spg and workstationReservations.spg Reservations and Workstation Reservations
aaserver/images/CreateGroups.png Main picture for Create Group editUserGroup.spg Create Group
Main picture for Concurent Users concurrentUsers.spg, namedUsers.spg, workstationPermissions.spg Concurent Users, Named Users, and Workstation Permissions
Add Concurrent Users main Picture addLicenseUsers.spg?licenseType=Concurrent&targetId=<userID>&targetType=USER Add Concurrent Users
Main picture for Connected Users connectedUsers.spg Connected Users
aserver/images/cancel.gif Permissions Deny addLicenseUsers.spg?licenseType=Concurrent&targetId=<userID>&targetType=USER Add Concurrent Users
Reject Review searchReviews.spg Moderate Reviews
Permissions deny concurrentUsers.spg, namedUsers.spg, workstationPermissions.spg Concurent Users, Named Users, and Workstation Permissions
aaserver/images/action_check.gif Permissions Allow addLicenseUsers.spg?licenseType=Concurrent&targetId=<userID>&targetType=USER Add Concurrent Users
Inactive state tools.spg App Inventory
Permissions allow concurrentUsers.spg, namedUsers.spg, workstationPermissions.spg Concurent Users, Named Users, and Workstation Permissions
aaserver/images/RetrieveLicense16.png Add Licenses addLicenseUsers.spg?licenseType=Concurrent&targetId=<userID>&targetType=USER Add Concurrent Users
aaserver/images/CreateUsers.png Add Named Users addLicenseUsers.spg?licenseType=Named&targetId=<userID>&targetType=USER Add Named Users main Picture
Import Users userImport.spg Main picture for Import Users Section
Create User editUser.spg Main picture for Create User Section
aaserver/images/EditRemoveGroups.png Main picture for Manage Groups viewUserGroups.spg Manage Groups
Concurrent licenses management / Permissions for concurrent licenses licenseAssignments.spg License Assignments
aaserver/images/LDAP.png Main picture for LDAP Users & Groups ldapImport.spg LDAP Users & Groups
aaserver/images/warning20.png Warning message .warningMessages li / ViewFolder.spg?id=<folderID> View Folder
Folder Status Warning .warningMessages li / viewAllFolders.spg App Folder
App internet available .warningMessages li App Inventory
No backup license server configured. .warningMessages li / requestLicense.spg Retrieve License
aaserver/images/expand_text.png View all aplication viewFolder.spg?id=<folderID> View Folder
aaserver/images/collapse_text.png Close the detail applications viewFolder.spg?id=<folderID> View Folder
aaserver/images/check20.gif Folder status OK viewAllFolders.spg App Folders
aaserver/images/check.png App available tools.spg App Inventory
aaserver/images/wrench.gif Build configure tools.spg App inventory
aaserver/images/error20.png Not streamed on any service tools.spg App inventory
aaserver/images/stream.png Start streaming tools.spg App inventory
aaserver/images/unstream.png Stop streaming tools.spg App inventory
aaserver/images/info20.png Inprogress publish/unpublish tools.spg App inventory
aaserver/images/download_start.gif Resume download tools.spg App inventory
aaserver/images/download_pause.gif Pause download tools.spg App inventory
aaserver/images/download_stop.gif Stop download tools.spg App inventory
aaserver/images/download.png Download App tools.spg App inventory
aaserver/images/upload.png Upload App tools.spg App inventory
aaserver/images/download_disabled.png Download disable tools.spg App inventory
aaserver/images/icon_expand_all.gif Expand list app for customizing updateProductCatalog.spg Version Updates
aaserver/images/icon_collapse_all.gif Collapse list app for customizing updateProductCatalog.spg Version Updates
aaserver/images/img_select_all.gif Select all updateProductCatalog.spg Version Updates
Select all iplist.spg Valid IPs
aaserver/images/img_select_none.gif Select none updateProductCatalog.spg Version Updates
Select none iplist.spg Valid IPs
aaserver/images/Web-ok.png Test connection to appwave.embarcadero.com is successful updateProductCatalog.spg Version Updates
aaserver/images/Web-block.png Cannot establish connection updateProductCatalog.spg Version Updates
aaserver/images/CachingProgress.png Main picture for Download History downloadApplications.spg Download History
Main picture for Publishing Progress publishingProgress.spg Publishing Progress
aaserver/images/thumb_up.gif Like review searchReviews.spg Moderate Reviews
aaserver/images/thumb_down.gif Dislike review searchReviews.spg Moderate Reviews
aaserver/images/action_delete.gif Delete forever searchReviews.spg Moderate Reviews
Delete notification notifications.spg Notifications
aaserver/images/stars1.gif Rating 1 star searchReviews.spg Moderate Reviews
aaserver/images/stars2.gif Rating 2 stars searchReviews.spg Moderate Reviews
aaserver/images/stars3.gif Rating 3 stars searchReviews.spg Moderate Reviews
aaserver/images/stars4.gif Rating 4 stars searchReviews.spg Moderate Reviews
aaserver/images/stars5.gif Rating 5 stars searchReviews.spg Moderate Reviews
aaserver/images/CurrentLicenses.png Main picture for License Inventory licenses.spg License Inventory
Main picture for License Files viewLicenses.spg 'License Files
Valid IPs for concurrent licenses licenseAssignments.spg License Assignments
Main picture for Valid IPs iplist.spg Valid IPs
Main picture for Set Up License welcome.spg?license=1 Set Up Licenses
aaserver/images/RetrieveLicense.png Main picture for Retrieve License requestLicense.spg Retrieve License
Main picture for Set trial owner requestTrialLicense.spg Set Trial Owner
Retrieve licenses welcome.spg?license=1 Set Up Licenses
Set trial owner welcome.spg?license=1 Set Up Licenses
aaserver/images/workstation.png Workstation licenses management licenseAssignments.spg License Assignments
Permissions for workstation licenses (concurrent only) licenseAssignments.spg License Assignments
aaserver/images/action_add.gif Add new IP iplist.spg Valid Ips
Add smtp.spg System Properties Email
aaserver/images/EmbarcaderoLicense16.png Embarcadero license connectedUsers.spg Connected Users
aaserver/images/ImportLicensesNew.png Manual import licenses welcome.spg?license=1 Set Up Licenses
aaserver/images/emailAdding.gif Add new email smtp.spg System Properties Email
aaserver/images/start_green_rnd.png Start streaming streamingDashboard.spg Streaming Service
aaserver/images/stop_red_rnd.png Stop streaming streamingDashboard.spg Streaming Service
aaserver/images/Reports.gif Main picture for Reports statisticsMain.spg Reports
License app report statisticsMain.spg Reports
aaserver/images/Notifications.png Main picture for Notification notifications.spg Notifications
aaserver/images/double_check.gif Mark all as read notifications.spg Notifications
aaserver/images/double_X.gif Delete all notifications.spg Notifications
aaserver/images/gtk-delete.png View deleted notifications.spg Notifications
aaserver/images/StartWatching.gif Mark as read notifications.spg Notifications
aaserver/images/appwave-overview.jpg Banner in home page home.spg Home Page
aaserver/images/body_bg.gif Background image body / home.spg Background

See Also