Share My Creation [Web] Support Ticketing System

Current version: 1.03
Status: Released
Price: $150

What's new?

Spoiler: Version 1.03

1. Performance improvement when querying for tickets using vw_tickets view.
   This view is automatically created if it does not exist in old database.
2. Many new functions in DatabaseBuilder class such as IfNull, Create2, setSelect2, SelectFromView, ViewExists and ViewExists2.
3. Added "Delete Ticket" button for Staff ticket view.
4. Some enhancements in User Login page.
5. Some changes in JavaScripts files.
6. Updated firebird.example to use MaxPoolSize=0 by default
7. Updated firebird.sql script file to create vw_tickets view

Spoiler: Version 1.02

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

Spoiler: Version 1.01

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)

Spoiler: Version 1.00

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

Demo Video

Spoiler: v1.03 (Client Login)

Spoiler: v1.03 (Create Ticket)

Spoiler: v1.03 (Create Article)

Spoiler: Demo

Spoiler: Staff

Spoiler: Client

FAQs

Spoiler: About this project

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

Spoiler: What this project is not about

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.

Spoiler: Why you should get this source code?

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!

Spoiler: Sample Code

Private Sub GetClients
    ' #Version = v1
    ' #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
        HRM.ResponseCode = 422
        HRM.ResponseError = "Error execute query"
    End Try
    DB.Close
    ReturnApiResponse
End Sub

 

[aeric]

Colourful Logs! ?

 

[aeric]

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.

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]

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]

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.

 

[aeric]

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]

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.

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

 

[aeric]

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

 

[aeric]

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.

 

[aeric]

New videos

Spoiler: v1.03 (Client Login)

Spoiler: v1.03 (Create Ticket)

Spoiler: v1.03 (Create Article)

 

[aeric]

Version 1.03 is now released!

What's new?

1. Performance improvement when querying for tickets using vw_tickets view.
   This view is automatically created if it does not exist in old database.
2. Many new functions in DatabaseBuilder class such as IfNull, Create2, setSelect2, SelectFromView, ViewExists and ViewExists2.
3. Added "Delete Ticket" button for Staff ticket view.
4. Some enhancements in User Login page.
5. Some changes in JavaScripts files.
6. Updated firebird.example to use MaxPoolSize=0 by default
7. Updated firebird.sql script file to create vw_tickets view

 

[aeric]

The query for Tickets is a bit slow due to joining of 10 tables and reading the ticket_descriptions column which contains very long text.
I have experience this in my production which use SQLite as the database.

One way to improve the performance is to skip the ticket_descriptions column when listing all the rows in search query.
This will be updated in next version.

For members who purchased the source code, you can try commented line #458 in GetTickets sub and #757 in GetTicketsSortedBy sub of TicketsController class (version 1.03).

'Columns.Add("ticket_descriptions")

 

[aeric]

Just for sharing.
Even though you can, but it is not a good idea to store image as base64 text in database especially SQLite (inserted from WYSIWYG editor).
Total db size: 3.8MB
One image size: 2.9MB

This is just an example. The photo was captured and uploaded from mobile without resizing.

Now I know why the page load was slow.

The solution is always upload image as attachment. It will improve user experience.

 

[aeric]

A small update for Velocity.b4xlib library point to a new version of velocity-engine-core-2.4.jar that was released recently.