Manual
Installation
Download Ethenis Framework, extract the package and copy all the files into the webpage main folder. Once finished, you should see the following layout:├── content │ └── main.php ├── js │ └── ethenis.js ├── {} config ├── index.php └── .htaccess
Ethenis uses an .htaccess file with rewrite rules, therefore, ensure your apache server is configured to read .htaccess files and mod_rewrite is enabled.
Configure Web Layout
The web layout will be set in the config file. With it it's possible to modify the animations duration, the paths the website will manage, and the menu elements.Example:
{ "fadeAnimationDuration" : 300, "scrollAnimationDuration" : 100, "content" : { "" : ["home.html", "Home"], "info" : ["info.html", "Info", false], "/^man\/\d*$/" : ["man.php"] }, "404": "404.html" }
- fadeAnimationDuration: the time in milliseconds for the fade animation between page change.
- scrollAnimationDuration: the time in milliseconds for the "scrollToTop" animation before page change.
- content: the content that will be public and its corresponding path.
Content entry format:
"<path>" : ["<file-name>[.html|.php]", "<link-string>"]
"<path>" : ["<file-name>[.html|.php]", "<link-string>", false]
→ The link won't be added to the navigation menu.
"<path-pattern>" : ["<file-name>[.html|.php]"]
→ The link won't be added to the navigation menu.
Set the main content template
All the page design will be supported by an html file template, which will define the content that will remain static in the page. This content will be defined in the main.php file.Example
<html> <head>...</head> <body> <header class="with-shadow"></header> <nav> <{ link-template }> <span style="margin: 5px"> <{ link-text }> </span> <{ /link-template }> </nav> <{ content }> </body> </html>
<{ link-template }> [html]<{ link-text }>[html] <{ /link-template }>
→ It indicates where to place the link elemeents and the template to follow.
<{ content }>
→ It indicates where to place the corresponding content.
Insert content files
The html content to be inserted with each path must be specified inside the content directory, inside its corresponding file, as it was previously specified in the config file.The PHP and JavaScript code inside those files will also be executed.
To change the page title you have to add the following script to the content file:
<script> document.title = "<content-title>"; </script>
Ethenis PHP functions
Ethenis::get_config()
→ Returns the configuration values as an array.Ethenis::get_config_json()
→ Returns the configuration values as json string.Ethenis::get_path()
→ Returns the actual path.
Ethenis JavaScript functions
__ETHENIS.config
→ Stores ethenis' configuration.__ETHENIS.loadPage(path)
→ Loads a specific page__ETHENIS.reloadContent()
→ Forces ethenis to reload the main content.__ETHENIS.loadLinks(element | [elements])
→ Configures the passed<a>
elements to be handled by ethenis. Alternatively you can set the class__eth-link
to the desired<a>
elements and ethenis will automatically handle them on load.__ETHENIS.onLoad = functionRef
→ Where functionRef is a function. Sets the action to be executed every time new content is loaded.__ETHENIS.onLoadOnce = functionRef
→ Where functionRef is a function. Sets the action to be executed only after the current content is loaded.__ETHENIS.onPageChange = functionRef
→ Where functionRef is a function. Sets the action to be executed only when the current page is left.