Assets
All aspects of the rXg captive portal web application may take advantage of assets that are loaded over HTTP. You may add an arbitrary number of static web assets (e.g., HTML pages, images, etc.) to a rXg captive portal. Static HTML assets should be placed within the base portal directory (CONTROLLER_NAME/). Static image assets should be placed within the CONTROLLER_NAME/images/directory.
Static HTML assets may be included from within embedded ruby files using the following syntax:
<%= portal_static_path 'YOURFILE.html' %>
Rendering a referenced static HTML asset takes longer than rendering directly from embedded ruby. However, externalized static HTML may make the captive portal more maintainable. For example, an operator may choose to place all portal presentation conditionals within.erb files and all bare text within .htmlfiles.
For example, if the operator wished to display different messages depending on whether the end-user is logged in, the following might be a part of a embedded ruby file:
<% if logged_in %>
<%= portal_static_path 'logged_in_message.html' %>
<% else %>
<%= portal_static_path 'not_logged_in_message.html' %>
<% end %>
Static image assets may be placed inside embedded ruby files using<%= portal_image_tag 'YOURFILE.jpg' %>
. Static HTML assets may also reference static image assets using the HTML <img /> tag. Operators may also use CSS to incorporate images by setting the background-imageproperty of any element.
For example, let us assume that the operator wishes to incorporate an image called example.jpg. The first step is to copy the example.jpg file into the CONTROLLER_NAME/images/directory. To incorporate the image directly into an embedded ruby file, the following code would be placed into a layout or view:
<%= portal_image_tag 'example.jpg' %>
Alternatively, the operator may choose to incorporate the image via CSS. To accomplish this, the operator must include a named element into the embedded ruby (or a reference static HTML asset). For example, incorporate the following <div into the embedded ruby:
<div id=someUniqueName />
Then edit the CONTROLLER_NAME/CONTROLLER_NAME.css.scss.erb file and add the following:
div#someUniqueName {
width: 320px;
height: 240px;
background-image: url(<%= portal_asset_data_uri 'example.jpg' %>);
}
The result will be an image that appears where the <div>tag is placed. Images that are referenced from the stylesheets are precompiled and integrated into the stylesheet resulting in a significant performance improvement. Use stylesheet images to when possible in order to maximize portal performance.
Files that the operator wants to make available for download should be placed into the static directory within the portal files. The files can then be accessed via https://fqdn.of.rxg/static/portal/custom/yourfile.ext. Note that fqnd.of.rxg should be changed to the domain name that resolves to your system, and "custom" is the controller name of the custom portal.
For example placing an image file named logo.png into the static directory of a custom portal allows anyone to access that file by going to https://fqdn.of.rxg/static/portal/access/logo.png (in this case the custom portal controller is access).
We can view our image by going to https://fqdn.of.rxg/static/portal/access/logo.png, results in the below image.
