Customization

myDBR offers a wide variety of options to customize the look and feel of the application.

Customize the Main Screen

The Main Screen offers a starting point for report launching.

Customizable items include:

Top header / dashboard
Fully customizable using user/main_top.html file. Can include dynamic content (complete reports, included image reports, etc.)
Sidebar
Meant for the company logo/general greeting area. Fully customizable.
Notifications
For short-term notifications for users. It can be set inside the application without changing any files.
Report categorization
In addition to folders, myDBR can categorize reports/folders within one folder. User-selectable colors.

Customize the report

Suppose you want to customize the report header and the footer. In that case, you can do it by changing the content of the user directory. Files in the directory are:

interface/themes
Stylesheet defining the UI elements throughout the application.
user/reportheader.html
The default report header can include a reference to a company logo/text one wishes to have in the report header. This can be overriden in OEM version to show custom icon based on user/organization
user/defaults.php
Override the myDBR's default values originally defined in defaults.php
user/userstyle.css
Stylesheet to override/define own styles used in the application.
user/extension_init.php
Extension initialization for the user's extension's setting.

Customize the Top header/dashboard

The main view's top header (the dashboard) can include report content / single report elements like charts or any HTML / JavaScript you want. The content to be shown will be placed in the user/main_top.html file.

To include a full report in the dashboard, you can use a predefined embed_url-JavaScript call which will take the report URL as a parameter. When a report is embedded, add &embed=2 to the URL so that only the report content is embedded.

<script>
  embed_url("http://myserver.com/mydbr/report.php?r=59&m=45&h=84410e9a181a9f93ca85b1a1811351c415f1be85&embed=3");
</script>

If you want to just include images, you can get them directly using img-tag Use getchart-parameter to choose which image to show. If the report just includes one image, use getchart=1.

<img src="report.php?r=496&amp;u1=1&amp;m=60&amp;h=83e484f935d7b1d02d1fa07ca1b280a7ef9e1062&amp;getchart=1" style="width:320px;height:150px;" alt="first" />

You can use the localization featured if you want to include different content in a different language. To do this, put #{DASHBOARD} into the user/main_top.html, and define the desired content in the localization at top banner.

Customize the PDF output

You can include your own logo in PDF output by adding the following lines to the user/defaults.php

$mydbr_defaults['export']['pdf']['logo'] = 'filename.jpg'; // where filename.jpg is an image in user/images
$mydbr_defaults['export']['pdf']['logo_width'] = xx; // where xx is the logo width in pixels

Using CSS for customization

myDBR allows report customization with your own CSS. Options for CSS customization include:

  • Creating your own theme
  • Adding own CSS definitions to user/userstyle.css
  • Adding CSS inside a report

Creating your own theme

myDBR offers UI customization with themes. A theme is a CSS definition that defines UI elements for all myDBR layouts. Creating a new CSS file in the interface/themes makes it available as a theme in the myDBR. To create a new theme, use the existing ones as a basis.

Adding own CSS definitions to user/userstyle.css

The file user/userstyle.css defines commonly used styles often shared with multiple reports. These can be result set, row, column, and etc. styles.

A report with reportID (r parameter in URL) has a DIV with classes "content report_519". "content" is shared with all reports, "report_XXX" class allows styling an individual report in userstyle.css.

OEM customization

OEM customization allows you to white-label myDBR as your own solution. Branding allows you to add/replace myDBR logos/texts with your own.

The application logo, application name, visibility of the header, and the footer can be controlled from the Environmental settings. Additionally, with an OEM license, many of the customizable objects have additional 'oem_*' classes so you can style them with CSS.

Customizing OEM login screen

In addition to login notifications and userstyle.css, one can add HTML/JavaScript to the OEM login screen by modifying the user/oem/login_bg.html and google_login_bg.html files. The content of these files is inserted into div with class oem_login_bg into the login screens.

Customizing OEM favicons

You can customize the application's favicons by overriding the default icons defined in defaults.php $mydbr_defaults['oem']['favicons']

Definitions:

/* Create new link-headers  */
$mydbr_defaults['oem']['favicons']['icons'] = array(
  array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-iphone.png'),
  array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-ipad.png', 'sizes' => '152x152'),
  array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-ipad-retina.png', 'sizes' => '167x167'),
  array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-iphone-retina.png', 'sizes' => '180x180'),
  array('type' => 'image/x-icon', 'rel' => 'shortcut icon', 'href' => 'oem-favicon.ico'),
);
Will create favicon headers like:
<link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-iphone.png">
<link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-ipad.png" sizes="152x152">
<link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-ipad-retina.png" sizes="167x167">
<link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-iphone-retina.png" sizes="180x180">
<link rel="shortcut icon" type="image/x-icon" href="oem-favicon.ico">

Using a custom Main Screen for users

When a custom Main Screen for user is defined, user will be redirected to a report instead of the standard Main Screen. myDBR uses a procedure (not a report), defined in $mydbr_defaults['mainview']['alternate_mainview_dispatcher_proc'], sp_mydbr_mainview_proc_get by default. The procedure takes two parameters: the loginname and the authentication. You can define one custom Main Screen for all users, or a custom Main Screen for each user or user group. The procedure should return the reportID used as a custom Main Screen.

A sample procedure returning one custom Main Screen for all could look like this (1234 being the report_id for the custom Main Screen):

CREATE PROCEDURE sp_mydbr_mainview_proc_get(
inLogin varchar(30), 
inAuth int
)
BEGIN

select 1234;

END

For a custom Main Screen for different users or groups, use the inLogin and inAuth and create your own logic. For this, you can use the myDBR internal tables (mydbr_userlogin, mydbr_groupsusers, and mydbr_groups).

To enable the custom Main Screen, use following $mydbr_defaults['mainview'] entries from user/defaults.php

  • $mydbr_defaults['mainview']['use_alternate'] = true Toggles the custom Main Screen on
  • $mydbr_defaults['mainview']['cache_alternate'] = false By default, myDBR caches the URL to the custom Main Screen for minor performance gain. During the development, you can turn off the caching to see the changes taking effect. Remove this entry when you are done.

Using a custom logo in the left corner of the report page

if you have a Single-Sign on login and want to show custom logo in the left corner of the report page depending on the user's organization, do following.

  • $mydbr_defaults['reportheader_logo']['enabled'] = false; Toggles myDBR to use the logo routine from user/reportheader_image.php
  • $mydbr_defaults['reportheader_logo']['param'] = 'in_SSO_OrganizationID'; Define which automatic parameter the Reportheader_image::get_image()'s first paramerer gets. You can customize the function to include the logic for custom logo