#Code Configuration
Directory structure:
###zconfigs\config.js
###
This file contains the settings for your GQL/Message Server address and Port. The code contained in here tries to self-configure the GQL/Message Server, and should work properly in most cases, but you can override the values if necessary.
////////////////////////////////
//
// config
//
////////////////////////////////
//
// Some code requires a certain version of SambaPOS
// this will let the code decide how certain functions are called
// For example, GQL Authorization was added in .61+ so if the version
// set here is less than that, the Auth function will be bypassed
// However, if the version set here is less than that and you
// are running .61+, all GQL functions will fail,
// because GQL REQUIRES Auth in .61+
//
var SambaPOS = '5.1.62';
//
// If you have a PHP-enabed site, set this to true
// this will tell the code to try to use a Local IP lookup
// which is contained in the file: /zjs/lib/ipinfo.php
// Setting this to false will tell the code to use a Remote IP lookup service
// This applies to User Authorization Bypass by IP address
//
var PHP = true;
// derive Server information from Address Bar
var webHost = location.hostname; // myServer.com
var webPort = location.port; // blank assumes port 80
var webPath = location.pathname; // might be like /app/mysite/blah
var webParm = location.search; // things after '?', like ?module=customer_display
var webProto = location.protocol; // usually http: or https:
var webUrl = webProto + '//' + webHost + (location.port ? ':'+location.port : '') + webPath;
// Message Server
var msgsrv = webHost;
// GraphQL server
var GQLhost = msgsrv;
var GQLport = '9000'; // generally, this is the only parameter that might need to change
var GQLpath = '/api/graphql/';
var GQLurl = webProto + '//' + GQLhost + ':' + GQLport + GQLpath;
// SIGNALR server
var SIGNALRhost = msgsrv;
var SIGNALRport = GQLport;
var SIGNALRpath = '/signalr';
var SIGNALRhubs = '/signalr/hubs/';
var SIGNALRurl = webProto + '//' + SIGNALRhost + ':' + SIGNALRport + SIGNALRpath;
var SIGNALRhub = webProto + '//' + SIGNALRhost + ':' + SIGNALRport + SIGNALRhubs;
...
###zconfigs\config_auth.js
###
This configuration file contains variables that you need to set for GraphQL Authentication. In particular, you need to set the GQLclientId
to match the Application Identifier that you configure in SambaPOS.
// this Application has access to ALL functions, INCLUDING Remote Connections
var GQLclientId = 'GQLModulesRemote'; // Client Id (Identifier) needs to match in SambaPOS Users > Application
var GQLsecret = 'GQLMsecret'; // Secret Key (optional) when Application configured to use Secret Key
var GQLappUserName = ''; // UserName needs to match in SambaPOS Users > User List
var GQLappPassword = ''; // Password needs to match in SambaPOS Users > User List
var GQLdeviceId = '';
###zconfigs\config_modules.js
###
This file allows you to configure which Modules are available. If you don’t want to provide access to certain modules, either comment out the line, or delete it. It also contains Module-specific settings that you might need to configure to match your SambaPOS Configuration.
////////////////////////////////
//
// config_modules
//
////////////////////////////////
// you can change the location of the Modules and set this variabe to match
var modulePath = 'modules/';
// control which Modules are available, and the order in which they appear on the Main Menu
var availableModules = [];
availableModules.push('Customer Display');
availableModules.push('Kitchen Display');
availableModules.push('Ticket Explorer');
availableModules.push('POS');
availableModules.push('CHAT');
availableModules.push('Timeclock');
// availableModules.push('Time Clock');
availableModules.push('Timeclock Policies');
// availableModules.push('Punch Editor');
availableModules.push('Task Editor');
availableModules.push('Reports');
###zcss\sambapos.css
###
The main Style Sheet used to control how everything looks.
/* Basic Style*/
* { margin:0; padding:0;}
html, body { height: 100%; width:100%; border-collapse:collapse; }
body {
font-family:Tahoma,Verdana,Consolas;
font-size:20px;
color:#AA5555;
background-color:#363636;
}
a,a.visited {
color:#FF5500;
text-decoration:none;
}
... etc ...
##Modules
Each Module has it’s own folder containing an index.html
file, and a module.js
file. The HTML file is pure HTML. These act as “templates” that are updated by Javascript. The JS file contains code that is applicable to that particular Module. To further secure access to only particular Modules, you can delete module folders so that the code for those modules does not exist. Here is an example of the Customer Display Module HTML file …
###customer_display\index.html
###
<div id="containerMain">
<div id="CD_CustomerDisplay">
<div id="CD_ticketHeader"></div>
<div id="CD_ticketTotalValue"></div>
<div id="CD_ticketDiscounts"></div>
<div id="CD_orders"></div>
<div id="CD_idle"></div>
</div>
</div>
###zjs\core.js
###
This file is where the BULK of the code is, and contains only Javascript. If you want to modify how the code works, this is where most of your edits will be done.
////////////////////////////////
//
// core
//
////////////////////////////////
function loadMODULE(modscreen) {
spu.refreshMoments();
if (inSambaPOS) {
// if the page is running inside SambaPOS HTML Viewer Widget
// get rid of Top and Bottom bars
spu.hideHeader();
}
//URLmodule = urlParm["module"];
//URLmodule = (URLmodule ? URLmodule.toString().toLower() : '');
spu.consoleLog('loadMODULE(modscreen) ... modscreen:"'+modscreen + '" URLmodule:"'+URLmodule + '" current mod:"'+module+'"');
modscreen = (URLmodule ? URLmodule : modscreen);
spu.consoleLog('loadMODULE(modscreen) ... modscreen:"'+modscreen + '" URLmodule:"'+URLmodule + '" current mod:"'+module+'"');
module = '';
for (var m=0; m<availableModules.length; m++) {
var mod = availableModules[m].replace(/ /g,'_').toLowerCase();
if (mod == modscreen) {
module = modscreen;
break;
}
}
module = (modscreen=='main_menu' ? modscreen : module);