WebGraphicalMaintenanceMain_Help
Combine images and buttons for items you're selling or renting to patrons through WebTrac
Use the WebTrac Graphical Maintenance screen to design layers and add buttons to your WebTrac site. Graphical Maintenance allows you to combine images and buttons for items you're selling or renting to patrons through WebTrac. For Example: WebTrac patrons can view your campground(s), select the desired campsite, and reserve it online. You sell event tickets online. You allow patrons to view your event seating sections and purchase a ticket for the seat they desire. Typically, a background image is used (i.e., of your campground or concert venue, etc…) and buttons are placed on it that link back to the items within RecTrac.
It is helpful to have multiple layers and use Switch Buttons to navigate between layers. For Example: The first layer might show an area map with your two campgrounds. Patrons begin by selecting a campground and then viewing the site availability within it (opening another layer for each campground). Similarly, with event ticketing your first layer might be the entire concert venue with the event seating sections labeled. Patrons click on a seating section to view the available seats within a given section (opening another layer for that seating section) for this event.
Before you proceed: You MUST have the images needed for the layers and/or buttons stored on your RecTrac Server. With the default installation location this path would be \VSI3\RecTrac\WebServer\GUI\images\ and might include subfolder(s).
Example Theatre Venue
Below is an example theater venue. Purchase Buttons were placed over the individual seat numbers to make them clickable.
Example Campground
Below is an example campground. The background image already included site numbers and site icons. So, Invisible Purchase buttons (without a background or border color) were placed over the individual site numbers. A Switch button labled "Click Here to See Marina Slips" switches between campground and marina slip reservations.
The screen includes the following: A Layer Tree listing the layers created for WebTrac, buttons for managing those layers, a preview of your layer with a right-click menu for managing buttons.
Layer Tree
The Layer Tree displays the layers created for WebTrac, if any. Parent layers display on the first level and child layers on secondary layers. Click in the tree to select a layer.
Beneath the Layer Tree are the following buttons:
Buttons
Click 10.3 to 3.1 Conversion to open the WebTrac Graphical Conversion screen. If you upgraded to RecTrac 3.1 from VSI's legacy RecTrac 10.3 program, then you can use this conversion program to bring your existing WebTrac Graphical screens into 3.1.
Note: This button only displays when 10.3 conversion data is present within you database, and that conversion flag has not been cleared.
Click Refresh to reload the layers and buttons on this screen.
Click Add Parent Layer to open the Information screen where you can add a new parent layer.
Click Add Child Layer to open the Information screen where you can add a new child layer to the selected parent layer.
Click Update Layer to open the Information screen where you can update the selected layer.
Click Delete Layer and a confirmation message displays "Are you sure you want to delete this layer and all items associated with it? Deleting this layer will delete layers below it. Are you sure you want to continue?" Click Yes to delete the layer. Click No to cancel.
Click More • Export to continue to the File Maintenance Export screen where you can select records in the DataGrid to export. The export creates an XML file that can be viewed/saved from the Document Center.
The export/import process provides an easy way to move records between RecTrac databases, if necessary.
Click Done to save your changes and exit this screen.
Right-Click Menu 1
Within the Layer preview area, you can right-click anywhere to manage your buttons.
Click Add a Button to open the Web Graphical Button - Add screen where you can define the attributes of your new button. You can create Information (display information), Purchase (buy an item), and Switch (navigate between layers) buttons.
Click Select All Buttons to select all of the buttons on this layer. Select all buttons for copying/moving buttons, and pasting attributes between buttons.
Click Deselect All Buttons to deselect all of the buttons on this layer.
Right-Click Menu 2
Highlight a button and the border displays with a red outline. Right-click to open a second menu.
Click Change This Button to open the Web Graphical Button - Add screen where you can define the attributes of your new button.
Click Delete Selected Buttons and a confirmation message displays "Are you sure you want to delete this record?" Click Yes to delete the button. Click No to cancel.
Click Clone This Button to open the Web Graphical Button - Clone screen where you can define the attributes of your new button.
Applies to Click Bulk Clone to open the Web Graphical Bulk Clone screen where you can define the buttons you will clone in bulk.
Click Copy Button to copy the attributes of this button and then refer to the Paste menu that follows.
Expand Paste to open a second tier of this menu. After copying the attributes of a button, you can paste the styles or dimensions to other buttons. This enables you to establish the styling for just one button and then paste it to many buttons. Handy when you have many rows of buttons for event seats, campsites, or other