Quickstart

Step 1: Installation (After purchasing a license)

• Download the ZIP-file from the official download site
• Extract AppGiniHelper.min.js from the ZIP-file
  to hooks/AppGiniHelper.min.js

YOUR_WWW_ROOT
└── YOUR_APP_ROOT
    └── hooks
        └── AppGiniHelper.min.js

Step 2: Integration

• Open hooks/header-extras.php in your favourite code editor
  I recommend using VSCODE for various reasons
• Paste the following lines of code into hooks/header-extras.php and
• Save the file header-extras.php

<!-- file: hooks/header-extras.php -->
<!-- include library -->
<script src="<?=PREPEND_PATH?>hooks/AppGiniHelper.min.js?v=<?=time()?>"></script>

Step 3: Start coding

Common Changes

For common changes like Navigation Bar modifications you can start by placing a <script></script> block in hooks/header-extras.php and start coding there.

<?php

?>
<script src="hooks/AppGiniHelper.min.js"></script>
<script>
    var common = AppGiniHelper.getCommon();
    common.setTitle("<b>MY</b>App");
    common.setIcon("cog");
</script>

Reload your app in the browser (without cache) and check the top Navigation Bar.

You should see a different brand title and icon at the top-left.

See also: Common Changes

Modifications of Detail Views

For modifications of Detail Views I recommend creating a new javascript file hooks/TABLENAME-dv.js:

var dv = AppGiniHelper.DV;

// your code here

See also: Detail View

Tip

In a javascript file *.js you must not write <script></script> because the browser already knows this is Javascript.

Modifications of Table Views

For modifications of Table Views I recommend creating a new javascript file hooks/TABLENAME-tv.js:

// wait for document.ready...
jQuery(function() {

    // ...then we can start modifying Table View

    var tv = AppGiniHelper.TV;

    // your code here
});

See also: Common Changes

Important

For Table View modifications we have to wait until the table has been rendered ("lazy loading").

Tip

In a javascript file *.js you must not write <script></script> because the browser already knows this is Javascript.

Next Steps

• Common modifications
• Change Table View
• Change Detail View

Tips

Browser Cache problems

You can avoid some versioning-/caching-trouble by appending a dynamic parameter. This should force the browsers to load the current version of your scripts from server and not from your browser's local cache.

<script src="hooks/AppGiniHelper.min.js?v=<?=time()?>"></script>

Custom Pages

If you intend to create Custom Pages outside the main directory, for example in the hooks subdirectory, then you should change the <script>-include as follows (recommended):

<script src="<?=PREPEND_PATH?>hooks/AppGiniHelper.min.js"></script>

Fix

Note the prepended constant PREPEND_PATH: This constant should resolve problems finding the script even outside main directory.

Alternatively, you can always use a fully qualified URL (address)

<script src="http://localhost/PATH/TO/YOUR/APP/hooks/AppGiniHelper.min.js"></script>

Caution

Keep in mind that you will have to change the src-address when copying or moving your application to a different location. If, for example, you upload your app to a server called example.com, you will have to change src to something like this:

<script src="http://www.example.com/myApp/hooks/AppGiniHelper.min.js"></script>

See also

• Icons