/**
 * Copyright (c) 2011 Nokia Corporation.
 */

var DEFAULT_LIST_ITEM_HEIGHT = 70
var ARRANGE_LIST_ITEM_HEIGHT = 60
var TABBAR_HORIZONTAL_HEIGHT = 40
var TABBAR_VERTICAL_HEIGHT = 60

var GRID_COLS_PER_SCREEN_HORIZONTAL = 4
var GRID_COLS_PER_SCREEN_VERTICAL = 3
var GRID_ROWS_PER_SCREEN_HORIZONTAL = 2
var GRID_ROWS_PER_SCREEN_VERTICAL = 4

var PLAYBACK_SLIDER_TIME = 10000

var HIGHLIGT_FONT_OPEN_HTML_TAG = "<span style=\"background-color:#4c8dcf\">"
var HIGHLIGT_FONT_CLOSE_HTML_TAG = "</span>"

var PARAGRAPH_LEFT_OPEN_HTML_TAG = "<p align=left>"
var PARAGRAPH_RIGHT_OPEN_HTML_TAG = "<p align=right>"

var PARAGRAPH_CLOSE_HTML_TAG ="</p>"

var LOREM_IPSUM_TEXT = "Lorem ipsum, dolor sit amet, consectetur adipisicing elit, sed do eiusmod "
                       + "tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,"
                       + "quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo "
                       + "consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse "
                       + "cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat "
                       + "non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. "

var START_VIEW_INFO_TEXT =
        "<h1>Start view</h1>"
        + "<p>This application suite demonstrates the appearance of various "
        + "Qt Quick Components and the basic flows as they are promoted by "
        + "the UI Guidelines for Symbian. For more project documentation, "
        + "please visit <a href=\"http://projects.developer.nokia.com/uivisualisation\">project page.</a>.</p>"
        + "<p>Each mini application focuses either on a set of UI components "
        + "or on a flow. You will find detailed information from the help file "
        + "within each mini application. As the mini applications are created "
        + "for demonstration purposes only, many UI items they contain only "
        + "have a limited functionality. The UI items can react to:</p>"
        + "<ul>"
        + "<li>Touch down</li>"
        + "<li>Leaving the UI element</li>"
        + "<li>Touch release</li>"
        + "</ul>"
        + "<p>The mini applications demonstrate left-to-right and right-to-left "
        + "layouts and dark and light themes (inverted and non-inverted themes). "
        + "These can be set via the buttons in the toolbar. These settings affect "
        + "all views of the application and changes require an automatic reload "
        + "of the main view.</p>"
        + "<p>There are currently a few known issues which require a fix. "
        + "Issues and fixes are documented on the project page.</p>";

var LISTITEMS_INFOTEXT =
        "<h1>List items</h1>"
        + "<p>This mini application shows a long list containing the most common "
        + "variations of a list item. They are shown in groups of three items and "
        + "separated with list headers. The list items can be disabled via the "
        + "“lock” icon in the toolbar. In a disabled state, the following items "
        + "are greyed out and no longer accessible:</p>"
        + "<ul>"
        + "<li>Check boxes</li>"
        + "<li>Switches</li>"
        + "<li>Radio buttons</li>"
        + "<li>Selectors</li>"
        + "<li>Drill downs</li>"
        + "</ul>"
        + "<p>Pressing the “lock” icon again will activate these items. The theme "
        + "is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to "
        + "right-to-left from the main view.</p>"
        + "<p>For more information on list items, please see the "
        + "Symbian Design Guidelines. </p>"

var TOOLBARS_INFOTEXT =
        "<h1>Toolbars</h1>"
        + "<p>There are 3 different sets of Toolbars available:</p>"
        + "<ul>"
        + "<li>Toolbar with icons</li>"
        + "<li>Toolbar with text in buttons</li>"
        + "<li>Toolbar with grouped buttons"
        + "<ul type=circle>"
        + "<li>Buttons with icons</li> "
        + "<li>Buttons with text</li> "
        + "</ul>"
        + "</li>"
        + "</ul>"
        + "<p>The toolbar selection can be accessed via the tab bar. Change the toolbar "
        + "layout by selecting one item from the list (radio button group). The setting "
        + "for each tab is stored for as long as you stay within the mini application. "
        + "As soon as you step back to the main view, all selections are reset in all tabs.</p>"
        + "<p>The icon of a button should not change as a result of the selection in order "
        + "to avoid any confusion about the current state and the state into which the "
        + "application enters after the button press. In case the state change cannot "
        + "be described as a simple on/off action, you should consider using a combination "
        + "of push buttons.</p>"
        + "<p>NOTE: This setup is artificial and created only for demonstration purposes. "
        + "You should never change the toolbar of a view during runtime in a real application.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to "
        + "right-to-left on the main view.</p>"
        + "<p>For more information on toolbars, please see the Symbian Design Guidelines. </p>"

var BUTTONS_INFOTEXT =
        "<h1>Buttons</h1>"
        + "<p>Normal buttons trigger an information banner. </p>"
        + "<p>In case a button should indicate a state change, use the latch down metaphor. "
        + "The icon of the button should not change as a result of the selection in order "
        + "to avoid any confusion about the current state and the state into which the "
        + "application enters after the button press. In case the state change cannot "
        + "be described as a simple on/off action, you should consider using a combination "
        + "of push buttons instead.</p>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on buttons, please see the Symbian Design Guidelines. </p>"

var DRILLDOWN_INFOTEXT =
        "<h1>Drill down</h1>"
        + "<p>This example shows a deep hierarchy based on lists and selections. The lowermost "
        + "hierarchy level may contain information about a single item and processing options "
        + "for it, or a list of items which show information only. </p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on drill down and other view navigation options, "
        + "please see the Symbian Design Guidelines. </p>"

var TABS_INFOTEXT =
        "<h1>Tabs</h1>"
        + "<p>Tabs are used to offer a fast access into different categories. "
        + "Usually the tabs of the higher navigation levels are not shown anymore in the "
        + "lower levels of the tab’s navigation hierarchy. This is due to two reasons: </p>"
        + "<p>1. To avoid a jump from one tab’s navigation hierarchy under another tab’s navigation "
        + "hierarchy (otherwise the back navigation path would not work logically).</p>"
        + "<p>2. To provide more space for actual content in the screen real estate, "
        + "especially in landscape orientation.</p>"
        + "<p>However, this allows using a different set of tabs in lower hierarchy levels. "
        + "It avoids double rows of tabs and thus saves precious available screen real estate.</p>"
        + "<p>Note that the tabs do not show any text in landscape orientation.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on tabs, please see the Symbian Design Guidelines. </p>"

var STICKYTABS_INFOTEXT =
        "<h1>Sticky tabs</h1>"
        + "<p>Sticky tabs are used for offering a fast access to important categories which "
        + "should be featured throughout the entire application. This structure has to be "
        + "designed very carefully to ensure that the back navigation path is always correct "
        + "and logical, meaning that the Back button always moves up in the current navigation "
        + "hierarchy,  backtracking each move of the user. For this reason it is forbidden "
        + "to change automatically between the “tab silos” (i.e., to jump from one tab’s "
        + "navigation hierarchy under another tab’s navigation hierarchy).</p>"
        + "<p>Another issue that one should keep in mind when using sticky tabs is that the "
        + "tabs constantly occupy a substantial part of the screen, especially in landscape orientation.</p>"
        + "<p>Pressing one tab always opens the highest level of that tab hierarchy, no matter "
        + "if the user has been visiting this tab before or not.</p>"
        + "<p>Note that the tabs do not show any text in landscape orientation.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. "
        + "It can be set to right-to-left on the main view.</p>"
        + "<p>For more information on tab, please see the Symbian Design Guidelines. </p>"

var SCROLLING_INFOTEXT =
        "<h1>Indicative scrollbar and interactive scrollbar</h1>"
        + "<p>The overlay indicator is displayed only when an interactive scrollbar is used, "
        + "i.e. when the content can be positioned with the scrollbar handle in addition to "
        + "flicking or panning.</p>"
        + "<p>The overlay indicator always displays the name of the topmost sub-list (as it "
        + "is shown in the sub-view header).</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on scrolling, please see the Symbian Design Guidelines. </p>"

var TOOLBARTABS_INFOTEXT =
        "<h1>Toolbar tabs</h1>"
        + "<p>Toolbar tabs (toolbar with a push button group) should be used to apply filters "
        + "to otherwise identical content, for example: “Show all”, “Show new” and "
        + "“Show favorites”. Therefore the items in the views should be very similar. "
        + "Do not use the toolbar tabs and a tab bar in one view.</p>"
        + "<p>The toolbar tab should not be inherited to a lower hierarchy level.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to "
        + "right-to-left on the main view.</p>"
        + "<p>For more information on toolbars, please see the Symbian Design Guidelines. </p>"

var DELETEMULTIPLE_INFOTEXT =
        "<h1>Delete multiple</h1>"
        + "<p>The actual delete flow is started via the toolbar. Note that it opens a new "
        + "subtask view, which contains only two tool buttons in the toolbar – one for "
        + "proceeding with the action and one for cancelling it. There is no back button. "
        + "In the subtask view, it is possible to dim the button used for proceeding until "
        + "one item has been selected. Subtask views do not have a tab bar, and they do not "
        + "usually have a header either in order to increase the available screen real estate.</p>"
        + "<p>Delete multiple subtask view has no “Back” button, which makes it similar to a Dialog.</p>"
        + "<p>Since this flow is describing a delete routine, it is important to show a "
        + "confirmation dialog. Deleting is seen as something what erases files which cannot "
        + "be restored. In case items are just taken away from a list (for example, a link is "
        + "removed), but the file as such stays in the device, the action should be called as "
        + "“remove” instead.</p>"
        + "<p>Applying an action to multiple items is very similar to the “Delete multiple” "
        + "flow. The confirmation dialog should only be used in case the action would cause:</p>"
        + "<ul>"
        + "<li>Deletion of files</li>"
        + "<li>Money transaction</li>"
        + "<li>Long waiting periods</li>"
        + "<li>Blocking the use of the entire device</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on deleting, please see the Symbian Design Guidelines. </p>"

var WIZARD_INFOTEXT =
        "<h1>Wizard</h1>"
        + "<p>The wizard layout is a rare exception in the sense that it has two back navigation "
        + "paths. </p>"
        + "<p>The toolbar icon for the first navigation path is placed in the left corner of the "
        + "toolbar, allowing a back navigation inside the wizard flow. In the middle of the "
        + "toolbar there is a tool button which allows forward navigation. The toolbar icon "
        + "for the second back navigation path is placed in the right corner of the toolbar, "
        + "enabling the user to leave the entire wizard flow and to return to the view from where "
        + "the wizard was initiated. Since the first wizard view does not allow any back navigation "
        + "inside the wizard, but only allows leaving the entire wizard flow, the first wizard "
        + "view does not contain any “Back” icon.</p>"
        + "<p>The label of the tool button used for forward navigation changes from “Continue” "
        + "to “Finish” in the last view of the wizard layout.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on wizards, please see the Symbian Design Guidelines. </p>"


var DIRECTTEXT_INFOTEXT =
        "<h1>Text - direct</h1>"
        + "<p>With direct text, the text can be changed just by touching the related text input "
        + "field. This mode is recommended especially for forms and settings. See also “Text - safe”.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left on "
        + "the main view.</p>"
        + "<p>For more information on text fields and text areas, please see the Symbian "
        + "Design Guidelines. </p>"

var SAFETEXT_INFOTEXT =
        "<h1>Text - safe</h1>"
        + "<p>The first view of this mini application demonstrates safe text, i.e., text that "
        + "does not allow any direct editing. Editing has to be done in a separate view; you can "
        + "access it via the Edit icon in the toolbar. Safe text is designed to display related "
        + "(but still editable) information, or to prevent the user from making changes hastily. "
        + "This layout is recommended for showing information which is unlikely to be changed "
        + "(from the device) or to be used in cases where the user can change just some part of "
        + "the information. In either case it is beneficial to evaluate the “editing” with a "
        + "special power tool and to move it to a secondary level for editing.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on text fields and text areas, please see the Symbian "
        + "Design Guidelines. </p>"

var INFOBANNER_INFOTEXT =
        "<h1>Info banner</h1>"
        + "<p>Info banners should be restricted to three lines of text in portrait orientation, "
        + "resulting in 2+ lines in landscape orientation. Touching the info banner evokes the "
        + "related action and dismisses the banner.  After timeout, the banner disappears. "
        + "Please note that the info banner can only be used locally, i.e., it can only be "
        + "displayed within your application.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light "
        + "(inverted) from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on info banners, please see the Symbian Design Guidelines. </p>"

var HEADERBUTTON_INFOTEXT =
        "<h1>View header with a button</h1>"
        + "<p>View header can be made interactive by including a button in it. The button in "
        + "the header should be used to change between different states or representations "
        + "of otherwise identical information; for example, change between reading and editing "
        + "state or flip between list and map representation of certain points-of-interests.</p>"
        + "<p>It is possible to change the content of the toolbar when flipping the page.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "on the main view.</p>"
        + "<p>For more information on headers, please see the Symbian Design Guidelines. </p>"

var IMAGECONTROL_INFOTEXT =
        "<h1>Zooming</h1>"
        + "<p>Image control mini application enables you to manipulate the image size in three "
        + "different ways:</p>"
        + "<p>1. Use the functions offered in the toolbar.</p>"
        + "<p>2. Pinch in and pinch out.</p>"
        + "<p>3. Double-tap.</p>"
        + "<p>The logic is as follows:</p>"
        + "<ul>"
        + "<li>When the application opens, the image is scaled to fit the screen.</li>"
        + "<li>If the user zooms in or zooms out and the image doeas not fit the screen, "
        + "a double-tap rescales the image to fit the screen. If the image fits the screen, "
        + "a double-tap enlarges the image to predefined scale. In this case it is the maximum size.</li>"
        + "</ul>"

var TUMBLERS_INFOTEXT =
        "<h1>Tumblers</h1>"
        + "<p>Tumblers are accessed via selector drums. The selectors may show the current value. "
        + "The selector drums can have an interdependency, e.g. the amount of days in day "
        + "selector may depend on the selected month. Selector drums can loop or be non-looping. "
        + "Looping and non-looping drums can be mixed. .</p>"
        + "<p>Tumblers should be used in case there are:</p>"
        + "<ul>"
        + "<li>Multiple slots to fill.</li>"
        + "<li>Predefined values.</li>"
        + "</ul>"
        + "<p>A single drum usually is not superior to a sub-view list. Also time and date pickers "
        + "might rather choose a calendar view or text input, rather than a tumbler.</p>"
        + "<p>Please note that the single drum looping might be better done with a list. "
        + "The single drum example is only for visual representation purposes and for comparison "
        + "with a list.</p>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left from the main view.</p>"
        + "<p>For more information on tumblers, please see the Symbian Design Guidelines. </p>"

var SLIDERS_INFOTEXT =
        "<h1>Sliders</h1>"
        + "<p>This mini application shows different variations of a slider. The tooltip indicates "
        + "the current value. ‘Refresh’ re-starts the Custom slider. Sliders do not mirror for "
        + "right-to-left reading languages, since they are a mathematical representation which "
        + "is unified among reading directions. </p>"
        + "<p>The sliders are:</p>"
        + "<ul>"
        + "<li>Basic slider with tooltip.</li>"
        + "<li>Slider with buttons and with tooltip.</li>"
        + "<li>Slider with counters (count-up and count-down), but without tooltip.</li>"
        + "<li>Slider with colour fill of the slider rail on the left from the handle, with tooltip.</li>"
        + "<li>Custom slider for indicating the current position (handle and blue slider rail fill "
        +" for already played content) and data loaded ahead of the current position (green slider "
        + "rail fill), with tooltip.</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>For more information on sliders, please see the Symbian Design Guidelines. </p>"

var DIALOGS_INFOTEXT =
        "<h1>Dialogs</h1>"
        + "<p>This mini app demonstrates various dialog variants and should cover most of the dialog "
        + "use cases. Note that the selection dialog does not have any buttons except for an ‘x’ in "
        + "the title to dismiss the dialog</p>"
        + "<p>In case the dialog returns a value which should be displayed to the user (i.e., a setting), "
        + "it is recommended to use a selector for accessing the dialog. </p>"
        + "<p>Selection dialogs should be used for more than 2 options or in case the options text is "
        + "too long for a button.</p>"
        + "<p>In case the user has to scroll the dialog, it might be worth considering to use a sub-view "
        + "instead. One example of this is the ‘Dialog in a view’.</p>"
        + "<p>The mini app covers the following standard dialogs:</p>"
        + "<ul>"
        + "<li>Query dialog.</li>"
        + "<li>Information dialog.</li>"
        + "<li>Progress dialog.</li>"
        + "<li>Input dialog</li>"
        + "<li>Selection dialog, with selector showing title and value.</li>"
        + "<li>Selection dialog, with selector showing only the value but no title.</li>"
        + "<li>Dialog in a view opens a new view and no Dialog component as such. The selector shows "
        + "title and value.</li>"
        + "<li>Scrollable dialog with selector showing title and value.</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default. It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left from "
        + "the main view.</p>"
        + "<p>For more information on dialogs, please see the Symbian Design Guidelines. </p>"

var TABBARS_INFOTEXT =
        "<h1>Tab bars</h1>"
        + "<p>This mini app shows all the possible Tab bar variations. Note that tab bars may look "
        + "different in portrait and landscape orientation. </p>"
        + "<p>In case the tabs are a combination of icons and text, the text will only show in "
        + "portrait orientation. Note that the space for text becomes small with four tabs. "
        + "This might cause challenges when trying to localise it. </p>"
        + "<p>The following tab bar variations are possible:</p>"
        + "<ul>"
        + "<li>2 tabs with icons and text in portrait and icons only landscape.</li>"
        + "<li>3 tabs with icons and text in portrait and icons only landscape.</li>"
        + "<li>4 tabs with icons and text in portrait and icons only landscape.</li>"
        + "<li>2 tabs with icons only in portrait and landscape.</li>"
        + "<li>3 tabs with icons only in portrait and landscape.</li>"
        + "<li>4 tabs with icons only in portrait and landscape.</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "from the main view.</p>"
        + "<p>For more information on tab bars, please see the Symbian Design Guidelines. </p>"

var MENUS_INFOTEXT =
        "<h1>Menus</h1>"
        + "<p>Menus can be either: </p>"
        + "<ul>"
        + "<li>View menu, opened via toolbar.</li>"
        + "<li>Object menu, opened via long press on the specific item.</li>"
        + "</ul>"
        + "<p>The object menu may vary for each item, whereas the view menu just contains items "
        + "which affect the entire view.</p>"
        + "<p>However, it is also possible to have no object menu at all for an item.</p>"
        + "<p>This example contains the following menus:</p>"
        + "<ul>"
        + "<li>Object menu for item 1.</li>"
        + "<li>Object menu for item 2; note that the actions are different than for item 1.</li>"
        + "<li>An item with no object menu.</li>"
        + "<li>View menu, which contains an  information item and a view menu item.</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "from the main view.</p>"
        + "<p>For more information on menus, please see the Symbian Design Guidelines. </p>"

var PROGRESS_INFOTEXT =
        "<h1>Progress indicators</h1>"
        + "<p>This mini app shows:</p>"
        + "<ul>"
        + "<li>Indeterminate progress indicators, in case the progress duration is short "
        + "and not predictable.</li>"
        + "<li>Determinate progress indicators, in case the progress duration is predictable; "
        + "if the progress time is not predictable, ‘work units’ should be used.</li>"
        + "</ul>"
        + "<p>Indeterminate progress indicators are usually used: </p>"
        + "<ul>"
        + "<li>While downloading or updating a list item or an image.</li>"
        + "<li>In a dialog for short term progress.</li>"
        + "</ul>"
        + "<p>Determinate progress indicators are mainly used: </p>"
        + "<ul>"
        + "<li>While downloading or updating several files which are combined into one process. </li>"
        + "<li>In a dialog for long term progress.</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left from "
        + "the main view.</p>"
        + "<p>For more information on progress indicators, please see the Symbian Design Guidelines. </p>"

var TIME_INFOTEXT =
        "<h1>Time stamps</h1>"
        + "<p>Time stamps are used to: </p>"
        + "<ul>"
        + "<li>Indicate the time log entry of a single item in its own view, e.g. an e-mail.</li>"
        + "<li>Sort items according to their time log entry, e.g. with sub-list headers.</li>"
        + "<li>Indicate the time log entries of items in a list; this will allow sorting also "
        + "according to other sorting hierarchies than time.</li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left "
        + "from the main view.</p>"
        + "<p>For more information on time stamps, please see the Symbian Design Guidelines. </p>"


var EMPTYCONTENT_INFOTEXT =
        "<h1>Empty content</h1>"
        + "<p>The application should always explicitly state that there is no content available "
        + "in case the view is empty (shown in all 4 examples). This will prevent the user from "
        + "perceiving the application as broken.</p>"
        + "<p>In addition, sample content is beneficial as it helps the user to create new "
        + "material when trying out the application. In most cases even “meaningless samples” "
        + "are helpful to get familiar with the application. This mini app uses sample place "
        + "holder text “lorem ipsum” (shown in the last 2 examples).</p>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left from "
        + "the main view.</p>"
        + "<p>For more information on scrolling, please see the Symbian Design Guidelines. </p>"

var SEARCH_INFOTEXT =
        "<h1>Search</h1>"
        + "<p>Search can be divided into 2 main categories:</p>"
        + "<ul>"
        + "<li><p>Progressive search, which shows the search hits immediately (e.g. if the content "
        + "is already in the phone)."
        + "<ul type=circle>"
        + "<li>Search on top of existing results, i.e. reduce the amount of items of a list.</li> "
        + "<li>Search with a blank result area and fill it according to the search hits.</li> "
        + "<li>Add additional filters, like time, location, or other tags.</li> "
        + "</ul></p></li>"
        + "<li><p>Non-progressive search, which shows the search results after the entire search "
        + "string has been sent (e.g. to a server)."
        + "<ul type=circle>"
        + "<li>Start from a blank screen and show all results.</li> "
        + "<li>Search inside a document and direct the user to the next hit.</li> "
        + "</ul></p></li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left from "
        + "the main view.</p>"
        + "<p>For more information on search, please see the Symbian Design Guidelines. </p>"

var ARRANGE_INFOTEXT =
        "<h1>Arrange items</h1>"
        + "<p>This mini app shows different ways of arranging multiple items. It covers: </p>"
        + "<ul>"
        + "<li>Layouts."
        + "<ul type=circle>"
        + "<li>Grids.</li> "
        + "<li>Lists.</li> "
        + "</ul></li>"
        + "<li>Sorting only.</li>"
        + "<li>Sorting and deleting. </li>"
        + "</ul>"
        + "<p>The theme is dark (non-inverted) by default, It can be changed to light (inverted) "
        + "from the main view.</p>"
        + "<p>Reading direction is left-to-right by default. It can be set to right-to-left from "
        + "the main view.</p>"
        + "<p>For more information on arranging, please see the Symbian Design Guidelines. </p>"


// End of file.

