Share My Creation [Web] Support Ticketing System

Current version: 1.02
Status: Released
Price: $150

What's new?
  1. Changes in firebird.example - DbToolPath to set path of isql, UseScript, ScriptFile
  2. Changes in postgresql.example - DbToolPath to set path of createdb
  3. Updated firebird.sql script file
  4. Fix issue creating tables for Firebird, articles table must be created after topics table
  5. Fix search engine on top of page for Firebird to support case-insensitive keyword search
  1. WYSIWYG editor, using summernote plugin
  2. Toast message, using toastr plugin, replacing the ugly javascript alert
  3. SessionStorage is used to show toast message after page reload
  4. Email notification added for client registration and ticket status changes by staff or client
  5. HTML file generated for previewing emails instead of sending actual email
  6. Bug fixed in JavaScript document ready calling functions in wrong order (Ajax/event loop issue)
  7. Bug fixed in SQLite, missing "server" tag in build configuration causing unexpected database closed
  8. Bug fixed in SQLite message table created date (DatabaseBuilder)
  9. Add size to some text fields in tables like tickets, messages and articles (no affects to SQLite database)
  10. Disable/Enable cascading drop-down lists when selecting equipments (Type->Brand->Model)
  11. Some code cleanup and renaming
  12. Some modification in database config example file
  13. Missing additional jars for Velocity library 2.01 has been uploaded under B4J (shortcut back to version 1.00)
  14. Moved some js files to plugins folder
  15. Minor UI changes in login forms (client and staff)
  16. Updated jQuery validation to validate maxlength of some name and description fields
  17. jQuery validation also validate WYSIWYG editor which has default text even the content is empty
  18. Limit client from deleting their attachments (Error message toast and page reloads)
  1. Based on Web API Server Template version 2.08 (improved version)
  2. Supporting databases: SQLite, MySQL/MariaDB, Firebird 3+, PostgreSQL and MS SQL Server 2019
  3. DatabaseBuilder and DatabaseConnector classes (more powerful than MiniORM)
  4. Separate config files e.g sqlite.ini for different database engine (in addition to existing config.ini)
  5. More organized and reusable code (DRY principle)
  6. More user-friendly logs and debug experience (click the colourful log to jump to the correct verb method)
  7. Display date and time based on client side local timezone using JavaScript if database time is save as UTC (can be disabled)
  8. Improved jQuery Uploader with confirmation dialog (prevent user accidentally delete or download an attachment)
  9. Uploaded attachment retain it's original file name and file is organized with subfolders according to upload date and time
  10. API version changed from v2 to v1 (Try clear browser cache due to updated JavaScript if you have run previous version before)
  11. Comment link to export project as zip file using WinRAR (like B4XPages project)

Preview
Click to zoom
Click to zoom


Demo Video

FAQs
  1. Server: jServer (For production, it is a compiled jar to run on Linux or Windows VPS)
  2. Backend: Powered by EndsMeet framework and Web API Template 2 which produces JSON format REST API. Business logic coded with B4J.
  3. Database: MySQL, SQL Server, PostgreSQL, Firebird and SQLite. No additional SQL knowledge required for specific database since queries are handled by DatabaseBuilder class. Same code works for all databases.
  4. Template: AdminLTE3 (Bootstrap 4) powered by Velocity Template Engine works perfectly on mobile or desktop browser.
  5. File Uploader: jquery-uploader with nice image viewer.
  6. Security: Session and password hashing. SQL prepared statements to prevent SQL injection.
  7. Email: SMTP with jNet library for new ticket creation, client registration, reset and change password.
  8. Knowledge: Skills in web development are not required unless you want to modify the frontend.
  9. SEO: Pretty URL routes
  1. Not PHP, .NET, Python
  2. No drag-and-drop tool for front-end web UI included
  3. No B4X UI Views
  4. Not a low code/no code app generator
  5. No ABM, BANano, BVAD3, SithasoDaisy
  6. No Vue, Angular, ReactJS
  7. Not PWA
  8. No NPM, Composer or package.json
  9. No obfuscated JavaScript or CSS
  10. No virtual environment or docker
  11. Not working in shared hosting
  12. No cookie, localstorage and JWT used
  13. Web API is not suitable for B4A or B4i clients*
  14. Not multilanguage such as Italian, only English.
* I decided to remove the complexity of JWT and only focus on server session (stateful). However, it is possible to support mobile clients (stateless) with some modification but this is out of the scope of this project.
  1. This is the first complete web app for Ticketing System in the forum ever made.
  2. It is powered by EndsMeet, a web development framework with libraries build from the ground up such as Web API template and Velocity library.
  3. You don't want to use PHP or C# but choose B4X as your backend programming language hosted on the high performance jServer powered by Jetty.
  4. You want to use a simple yet powerful template engine, Velocity.
  5. Frontend is based on the most popular AdminLTE dashboard template.
  6. You want to write simple B4X code that work with 5 most popular database engines.
  7. You want to start developing with the lightweight SQLite and migrate to other database engine such as MySQL, SQL Server, Firebird or PostgreSQL in the future.
  8. You plan to build a REST API server which can be reused for your mobile or desktop apps.
  9. You want to learn how to build a front-end that provide good user interface and experience (UI/UX) for desktop and mobile users.
  10. You want to know how to manage login sessions or restrict user access in jServer web app.
  11. You want to know how to use SMTP or jNET library for sending email during user registration, activation, change password and reset password.
  12. You can modify this project to build app for e-commerce, inventory, e-learning, ERP, CRM, project management, data collection, dashboard, etc.
Then, get this source code at a very low price while it last!
Return JSON response using MiniORM:
Private Sub GetClients
    ' #Version = v2
    ' #Desc = List all clients
    Try
        If UserAuthorize(Array As String("staff")) = False Then
            ReturnHtmlPageAuthorizationRequired
            Return
        End If

        DB.Table = "tbl_clients"
        DB.Query
        HRM.ResponseCode = 200
        HRM.ResponseData = DB.Results
    Catch
        LogError(LastException.Message)
        HRM.ResponseCode = 422
        HRM.ResponseError = "Error execute query"
    End Try
    DB.Close
    ReturnApiResponse
End Sub
View on Github
 
Last edited:

aeric

Expert
Licensed User
Longtime User
With MiniORM or DatabaseBuilder class, the varchar column such as message_body is set to length of 255 by default if the size is not specified.

You can ALTER the table schema by increasing the size of the column manually if it is in production.

If you are setting up the system before production, you need to modify the CreateDatabase sub.
B4X:
DB.Columns.Add(DB.CreateORMColumn2(CreateMap("Name": "message_body", "Size": 1000)))

This will allow you to insert longer text up to 1000 characters.

This is also applies to other fields such as Ticket Descriptions for database other than SQLite.
 

aeric

Expert
Licensed User
Longtime User
Version 1.01 beta #2 has been released with some improvement.

What's New:
  1. Custom column size for articles, tickets, messages and logs tables title/subject set to 500 characters and descriptions set to 1000 characters
  2. jQuery validate (maxlength) for above corresponding fields have been updated
  3. Minor changes in login forms (client and staff)
 

aeric

Expert
Licensed User
Longtime User
I realized 1000 characters length is not enough if someone is adding an image using the WYSIWYG editor. I will put 5000 as default in the release.
Probably in production, use something like 300,000 chars. Adjust the database to suit your case.

However, it is better to upload big image as attachment instead of using the ticket description field.

If you are using SQLite then no need to predefine the text column size. The JQuery validation to check the chars limit can also be removed.
 
Last edited:

aeric

Expert
Licensed User
Longtime User
Version 1.01 is now released!

What's new?
  1. WYSIWYG editor, using summernote plugin
  2. Toast message, using toastr plugin, replacing the ugly javascript alert
  3. SessionStorage is used to show toast message after page reload
  4. Email notification added for client registration and ticket status changes by staff or client
  5. HTML file generated for previewing emails instead of sending actual email
  6. Bug fixed in JavaScript document ready calling functions in wrong order (Ajax/event loop issue)
  7. Bug fixed in SQLite, missing "server" tag in build configuration causing unexpected database closed
  8. Bug fixed in SQLite message table created date (DatabaseBuilder)
  9. Add size to some text fields in tables like tickets, messages and articles (no affects to SQLite database)
  10. Disable/Enable cascading drop-down lists when selecting equipments (Type->Brand->Model)
  11. Some code cleanup and renaming
  12. Some modification in database config example file
  13. Missing additional jars for Velocity library 2.01 has been uploaded under B4J (shortcut back to version 1.00)
  14. Moved some js files to plugins folder
  15. Minor UI changes in login forms (client and staff)
  16. Updated jQuery validation to validate maxlength of some name and description fields
  17. jQuery validation also validate WYSIWYG editor which has default text even the content is empty
  18. Limit client from deleting their attachments (Error message toast and page reloads)
This update will be available to members who purchased version 1.00 or earlier.
 

aeric

Expert
Licensed User
Longtime User
SupportController
Version 1.00
This library is optional. It is a replacement of WebApiController library but in b4xlib format instead of jar and xml files.

The code is copied from ArticlesController. It is like duplicating the class but you don't need to copy+paste and renaming the file.
Currently you need to Find+Replace the word CONTROLLER inside this class to new Controller's name.

1721929983519.png


1721930633846.png


Members who have purchased the source code can find this library name SupportController.b4xlib inside B4J Additional library folder.
 

aeric

Expert
Licensed User
Longtime User
Version 1.02 is now released!

What's new?
  1. Changes in firebird.example - DbToolPath to set path of isql, UseScript, ScriptFile
  2. Changes in postgresql.example - DbToolPath to set path of createdb
  3. Updated firebird.sql script file
  4. Fix issue creating tables for Firebird, articles table must be created after topics table
  5. Fix search engine on top of page for Firebird to support case-insensitive keyword search
 
Last edited:

aeric

Expert
Licensed User
Longtime User
SupportController
Version 1.01
This library is optional.

It is a replacement of WebApiController library specially made for Support Ticketing System project but in b4xlib format instead of jar and xml files.
The code is modified from ArticlesController for creating additional controller class.

What's New:
It is now added with Code Snippets (19 snippets). You are no longer need to Find+Replace the word CONTROLLER.

The library is available in the Additional library folder shared in Google Drive.
 
Top