Difference between revisions of "Link"

From HSYCO
Jump to navigation Jump to search
 
(7 intermediate revisions by 2 users not shown)
Line 17: Line 17:
 
*'''position''': the object's position. Use the pixels or rows and columns coordinates format
 
*'''position''': the object's position. Use the pixels or rows and columns coordinates format
 
*'''color''':  the color of the button. It can assume any of the skin's color values (E.g. for the "blue" skin, the possible values are: b - blue; g - green; gr - gray; r - red; y - yellow; glass)
 
*'''color''':  the color of the button. It can assume any of the skin's color values (E.g. for the "blue" skin, the possible values are: b - blue; g - green; gr - gray; r - red; y - yellow; glass)
*'''page''': the name of the destination page associated to the button. It is possible to specify an absolute or relative URL in the '''page''' parameter. The tag will work as an <A HREF> tag, loading the new page. If the loaded page is an HSYCO menu, the '''back''' link will show up in the menu page, to reload the referrer page
+
*'''link''': the name of the destination page associated to the button. It is possible to specify an absolute or relative URL in the '''link''' parameter. The tag will work as an <A HREF> tag, loading the new page. If the URL is prefixed with "!", the page will open in a new tab or window. If the loaded page is an HSYCO menu, the '''back''' link will show up in the menu page, to reload the referrer page. It is also possible to use the special keywords "$__urlkey;" and "$__query;" that will be replaced with the URLKey and URL query string (if present, including the leading "?" character). You can also set this parameter to "back", "forward" or "logout". "back" moves back to the previous page in the pages navigation history, and can also close the current pop-up. "forward" moves forward in the pages navigation history. "logout" closes the session and reverts to the login page
 
*'''label''': the text label on the button. It can contain HTML tags
 
*'''label''': the text label on the button. It can contain HTML tags
  
 
== Syntax ==
 
== Syntax ==
  (link[!<id>] <pos>; <color>; <page>; <label>)
+
  (link[!<id>] <pos>; <color>; <link>; <label>)
 
   
 
   
  (linkmini[!<id>] <pos>; <color>; <page>; <label>)
+
  (linkmini[!<id>] <pos>; <color>; <link>; <label>)
 
   
 
   
  (linkmicro[!<id>] <pos>; <color>; <page>; <label>)
+
  (linkmicro[!<id>] <pos>; <color>; <link>; <label>)
 
   
 
   
  (dlink[!<id>] <pos>; <color>; <page>; <label>)
+
  (dlink[!<id>] <pos>; <color>; <link>; <label>)
  
 
E.g.
 
E.g.
Line 40: Line 40:
 
== UI Attributes ==
 
== UI Attributes ==
 
{{UI Object Attributes (Common)}}
 
{{UI Object Attributes (Common)}}
 +
{{UI Object Attributes (Label)}}
 
{{UI Object Attributes (Button)}}
 
{{UI Object Attributes (Button)}}
 +
{{UI Object Attributes (Link)}}

Latest revision as of 15:59, 21 December 2018

Note  For a description and a complete list of UI Objects, see UI Objects.

A button used to navigate to another page, a pop-up, or an external Web page. It has several colors (depending on the skin) and four different sizes:

  • link (standard size)
UI Object link.png
  • linkmini (medium size)
UI Object linkmini.png
  • linkmicro (small size)
UI Object linkmicro.png
  • dlink (big size)
UI Object dlink.png

For a custom image version, see ImageLink.

Parameters

  • id: the object's ID, used by UISets. Required
  • position: the object's position. Use the pixels or rows and columns coordinates format
  • color: the color of the button. It can assume any of the skin's color values (E.g. for the "blue" skin, the possible values are: b - blue; g - green; gr - gray; r - red; y - yellow; glass)
  • link: the name of the destination page associated to the button. It is possible to specify an absolute or relative URL in the link parameter. The tag will work as an <A HREF> tag, loading the new page. If the URL is prefixed with "!", the page will open in a new tab or window. If the loaded page is an HSYCO menu, the back link will show up in the menu page, to reload the referrer page. It is also possible to use the special keywords "$__urlkey;" and "$__query;" that will be replaced with the URLKey and URL query string (if present, including the leading "?" character). You can also set this parameter to "back", "forward" or "logout". "back" moves back to the previous page in the pages navigation history, and can also close the current pop-up. "forward" moves forward in the pages navigation history. "logout" closes the session and reverts to the login page
  • label: the text label on the button. It can contain HTML tags

Syntax

(link[!<id>] <pos>; <color>; <link>; <label>)

(linkmini[!<id>] <pos>; <color>; <link>; <label>)

(linkmicro[!<id>] <pos>; <color>; <link>; <label>)

(dlink[!<id>] <pos>; <color>; <link>; <label>)

E.g.

(link!link1 x10y20; r; page1; Page 1)

(linkmini r0c1; glass; http://www.hsyco.com; hsyco)

(linkmicro x0y100; gr; /hsycohsyco/office; HSYCO Office)

(dlink!dlink1 x10y10; b; page1; Larger text<br>with <b>HTML</b> tags)

UI Attributes

Common attributes

Name Value Description
pos x<x>y<y> Position specified as x/y coordinates. E.g. x-5y10
visible true Default. Show the object
false Hide the object
blink true | slow Blink the object at a slow speed
fast Blink the object at a fast speed
false Stop the blinking
opacity 0.0 ... 1.0 Object opacity from 0 (not visible) to 1 (fully visible)
rotation 0 ... 360 Object rotation in degrees. Images are rotated around the center point, all other objects are rotated around the top left corner

Label attributes

Name Value Description
label <string> Label's text. Can contain HTML tags
fontfamily <family name> A prioritized list of font family names
fontsize <size> Font size in pixels. E.g. 15px
fontcolor <CSS color> Font color
fontstyle normal Normal font style, default
italic Italic font style
oblique Oblique font style
fontweight normal Normal characters, default
bold Thick characters
bolder Thicker characters
lighter Lighter characters
100 ... 900 Defines from thin to thick characters. 400 is the same as normal, and 700 is the same as bold

Button attributes

Name Value Description
style red,green,blue... Set the button's style (color). Styles vary depending on the selected skin
enabled true Default. Enable the button
false Disable the button

Link attributes

Name Value Description
link <page id> Set the link to a specific page, so that when the button is clicked, the interface will navigate to that page (e.g. "menu")
<url> A url starting with http:, https:, ftp: or / (for a relative url). When the button is clicked, the browser will navigate to the specified url (e.g. "http://www.apple.com")

If the url string starts with ! the link will open in a new tab (e.g. "!http://google.com")