Commit acb46d75 by Mac Stephens

Implement Request Demo form with shared navbar/footer, conditional validation,…

Implement Request Demo form with shared navbar/footer, conditional validation, and improved email formatting/newline handling
parent 95b15d71
...@@ -22,7 +22,7 @@ type ...@@ -22,7 +22,7 @@ type
procedure LoadConfig(loadedProc: TProc<Boolean>); procedure LoadConfig(loadedProc: TProc<Boolean>);
public public
const clientVersion = '1.0.0'; const clientVersion = '1.0.1';
procedure InitApp(readyProc: TProc); procedure InitApp(readyProc: TProc);
procedure SetClientConfig(callback: TVersionCheckCallback); procedure SetClientConfig(callback: TVersionCheckCallback);
end; end;
......
program emSystemsWebsite; program emSystemsWebsite;
{$R *.dres} {$R *.dres}
uses uses
......
...@@ -14,15 +14,15 @@ const ...@@ -14,15 +14,15 @@ const
'<div class="em-navbar-wrap">' + '<div class="em-navbar-wrap">' +
' <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top shadow py-1 py-lg-2">' + ' <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top shadow py-1 py-lg-2">' +
' <div class="container-fluid container-main">' + ' <div class="container-fluid container-main">' +
' <a class="navbar-brand em-brand" href="#FHome">' + ' <a class="navbar-brand em-brand me-auto" href="#FHome">' +
' <img src="images/EM_Logo_2c66a0.png" alt="EM_Logo" style="max-height: 50px;">' + ' <img src="images/EM_Logo_2c66a0.png" alt="EM_Logo"">' +
' </a>' + ' </a>' +
' <button class="navbar-toggler navbar-toggler-sm" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"' + ' <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"' +
' aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">' + ' aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">' +
' <span class="navbar-toggler-icon"></span>' + ' <span class="navbar-toggler-icon"></span>' +
' </button>' + ' </button>' +
' <div class="collapse navbar-collapse" id="navbarNav">' + ' <div class="collapse navbar-collapse" id="navbarNav">' +
' <ul class="navbar-nav ms-auto">' + ' <ul class="navbar-nav ms-auto gap-lg-3">' +
' <li class="nav-item"><a class="nav-link" href="#FHome">Home</a></li>' + ' <li class="nav-item"><a class="nav-link" href="#FHome">Home</a></li>' +
' <li class="nav-item"><a class="nav-link" href="#FAboutUs">About Us</a></li>' + ' <li class="nav-item"><a class="nav-link" href="#FAboutUs">About Us</a></li>' +
' <li class="nav-item dropdown">' + ' <li class="nav-item dropdown">' +
......
<div id="site_nav"></div> <div class="d-flex flex-column min-vh-100">
<div id="site_nav"></div>
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="hero-section-aboutus bg-dark text-white text-center"> <div class="hero-section-aboutus bg-dark text-white text-center">
<img src="images/niagara.jpg" alt="Our Story Image" class="img-fluid hero-image-aboutus"> <img src="images/niagara.jpg" alt="Our Story Image" class="img-fluid hero-image-aboutus">
<div class="hero-overlay-aboutus"> <div class="hero-overlay-aboutus">
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-md-8 col-lg-6"> <!-- Adjust the column sizes as needed --> <div class="col-md-8 col-lg-6"> <!-- Adjust the column sizes as needed -->
<div class="text-wrapper-aboutus mx-auto p-3 p-md-5 rounded shadow"> <div class="text-wrapper-aboutus mx-auto p-3 p-md-5 rounded shadow">
<h2>Our Story</h2> <h2>Our Story</h2>
<p class="fs-6"> <p class="fs-6">
EM Systems was established in the early 1990s as a software development group. Over the last EM Systems was established in the early 1990s as a software development group. Over the last
two decades, EM Systems have developed a vast array of custom software applications for a variety of two decades, EM Systems have developed a vast array of custom software applications for a variety of
industries with a primary focus on the Public Safety and Healthcare fields. Currently, over 75 industries with a primary focus on the Public Safety and Healthcare fields. Currently, over 75
organizations across New York State rely on EM Systems applications to meet the needs of their organizations across New York State rely on EM Systems applications to meet the needs of their
communities and communities and
customers. EM Systems prides itself in its ability to create custom software solutions to meet the customers. EM Systems prides itself in its ability to create custom software solutions to meet the
specific needs of specific needs of
our customers. Our goal is to create software which facilitates and enhances current business practices our customers. Our goal is to create software which facilitates and enhances current business practices
in a in a
reliable and efficient manner. Not only do we offer expert software development knowledge and skills but reliable and efficient manner. Not only do we offer expert software development knowledge and skills but
we are also experienced in understanding and improving efficiency in current business processes and we are also experienced in understanding and improving efficiency in current business processes and
practice. practice.
</p> </p>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div>
<div id="site_footer"></div> <div id="site_footer"></div>
</div>
...@@ -9,7 +9,7 @@ uses ...@@ -9,7 +9,7 @@ uses
XData.Web.Connection, XData.Web.Client, Data.DB, Utils, XData.Web.Connection, XData.Web.Client, Data.DB, Utils,
XData.Web.JsonDataset, XData.Web.Dataset, Vcl.Grids, XData.Web.JsonDataset, XData.Web.Dataset, Vcl.Grids,
WEBLib.DBCtrls, WEBLib.DB, WEBLib.Grids, WEBLib.CDS, WEBLib.REST, WEBLib.DBCtrls, WEBLib.DB, WEBLib.Grids, WEBLib.CDS, WEBLib.REST,
WEBLib.WebTools, System.NetEncoding, WEBLib.RegularExpressions, WEBLib.WebTools, System.NetEncoding, WebLib.RegularExpressions,
WEBLib.Toast, XData.Web.Request, XData.Web.Response; WEBLib.Toast, XData.Web.Request, XData.Web.Response;
type type
......
<div id="site_nav"></div> <div class="d-flex flex-column min-vh-100">
<div id="site_nav"></div>
<!-- HERO SECTION --> <!-- HERO SECTION -->
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="page-hero-section bg-dark text-white text-center"> <div class="page-hero-section bg-dark text-white text-center">
<img src="images\computer_code.jpg" alt="Hero Image" class="img-fluid hero-image"> <img src="images\computer_code.jpg" alt="Hero Image" class="img-fluid hero-image">
<div class="hero-overlay d-flex justify-content-center align-items-center"> <div class="hero-overlay d-flex justify-content-center align-items-center">
<div class="text-wrapper"> <div class="text-wrapper">
<h1 class="display-4">Custom Software</h1> <h1 class="display-4">Custom Software</h1>
</div>
</div>
</div> </div>
</div> </div>
</div>
</div>
<!--MAIN CONTAINER--> <!--MAIN CONTAINER-->
<div class="container-main"> <div class="container-main">
<div class="learn-boxes py-5"> <div class="learn-boxes py-5">
<!-- CUSTOM SOFTWARE BOX 1 --> <!-- CUSTOM SOFTWARE BOX 1 -->
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<div class="col-md-12"> <div class="col-md-12">
<div class="p-3 text-center"> <div class="p-3 text-center">
<h2>AutoPark</h2> <h2>AutoPark</h2>
<p class="mx-auto" style="max-width: 850px;">AutoPark is our parking ticket management system. It streamlines and coordinates the process and procedures of managing a parking area. From parking tags, tickets and bills to payments and appeals, this solution has it all when it comes to parking management.</p> <p class="mx-auto" style="max-width: 850px;">AutoPark is our parking ticket management system. It streamlines and coordinates the process and procedures of managing a parking area. From parking tags, tickets and bills to payments and appeals, this solution has it all when it comes to parking management.</p>
</div>
</div>
</div> </div>
</div> <!-- CUSTOM SOFTWARE BOX 2 -->
</div> <div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded">
<!-- CUSTOM SOFTWARE BOX 2 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded"> <div class="p-3 text-center">
<div class="col-md-12"> <h2>Document Scanning Tools</h2>
<div class="p-3 text-center"> <p class="mx-auto" style="max-width: 850px;">Scan and transmit paper documents with ease. This software provides an easy way to scan and organize paper documents and send them electronically to a variety of configurable destinations including HL7, FTPS, HTTPS, CIFS and more.</p>
<h2>Document Scanning Tools</h2> </div>
<p class="mx-auto" style="max-width: 850px;">Scan and transmit paper documents with ease. This software provides an easy way to scan and organize paper documents and send them electronically to a variety of configurable destinations including HL7, FTPS, HTTPS, CIFS and more.</p> </div>
</div> </div>
</div> <!-- CUSTOM SOFTWARE BOX 3 -->
</div> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<!-- CUSTOM SOFTWARE BOX 3 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="p-3 text-center">
<div class="col-md-12"> <h2>Document Management System</h2>
<div class="p-3 text-center"> <p class="mx-auto" style="max-width: 850px;">Very easily scan and store all of your paper documents securely and safely and retrieve any of them instantly at any time. This software can save countless hours for document imaging projects and can be customized to fit specific needs.</p>
<h2>Document Management System</h2> </div>
<p class="mx-auto" style="max-width: 850px;">Very easily scan and store all of your paper documents securely and safely and retrieve any of them instantly at any time. This software can save countless hours for document imaging projects and can be customized to fit specific needs.</p> </div>
</div> </div>
</div> <!-- CUSTOM SOFTWARE BOX 4 -->
</div> <div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded">
<!-- CUSTOM SOFTWARE BOX 4 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded"> <div class="p-3 text-center">
<div class="col-md-12"> <h2>Pawn Shop Pro</h2>
<div class="p-3 text-center"> <p class="mx-auto" style="max-width: 850px;">This is a pawn shop management system that will simplify record keeping, billing, and inventory management. If there is something specific that you need for your pawn shop the software can be modified to suit your needs.</p>
<h2>Pawn Shop Pro</h2> </div>
<p class="mx-auto" style="max-width: 850px;">This is a pawn shop management system that will simplify record keeping, billing, and inventory management. If there is something specific that you need for your pawn shop the software can be modified to suit your needs.</p> </div>
</div> </div>
</div> <!-- CUSTOM SOFTWARE BOX 5 -->
</div> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<!-- CUSTOM SOFTWARE BOX 5 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="p-3 text-center">
<div class="col-md-12"> <h2>Employee Time Tracking</h2>
<div class="p-3 text-center"> <p class="mx-auto" style="max-width: 850px;">This software is an easy and useful way to track customers, projects, tasks, and resources over time and create reports from this information.</p>
<h2>Employee Time Tracking</h2> </div>
<p class="mx-auto" style="max-width: 850px;">This software is an easy and useful way to track customers, projects, tasks, and resources over time and create reports from this information.</p> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div id="site_footer"></div> <div id="site_footer"></div>
</div>
<div id="site_nav"></div> <div class="d-flex flex-column min-vh-100">
<div id="site_nav"></div>
<!-- HERO SECTION --> <!-- HERO SECTION -->
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="hero-section bg-dark text-white text-center"> <div class="hero-section bg-dark text-white text-center">
<img src="images\table_with_computers.jpg" alt="Hero Image" class="img-fluid hero-image"> <img src="images\table_with_computers.jpg" alt="Hero Image" class="img-fluid hero-image">
<div class="hero-overlay d-flex justify-content-center align-items-center"> <div class="hero-overlay d-flex justify-content-center align-items-center">
<div class="text-wrapper"> <div class="text-wrapper">
<h1 class="display-4">Custom Software, Comprehensive Support</h1> <h1 class="display-4">Custom Software, Comprehensive Support</h1>
<!-- Constrain only the paragraph width --> <!-- Constrain only the paragraph width -->
<div class="mx-auto" style="max-width: 540px;"> <div class="mx-auto" style="max-width: 540px;">
<p class="lead fs-3 mb-0">Real connections. Reliable support. Software made for you.</p> <p class="lead fs-3 mb-0">Real connections. Reliable support. Software made for you.</p>
</div> </div>
<!-- Button sits outside the max-width block --> <!-- Button sits outside the max-width block -->
<div class="mt-5"> <div class="mt-5">
<button type="button" <button type="button"
id="btn_demo" id="btn_demo"
class="btn btn-lg rounded-pill fw-semibold text-white shadow px-4 px-sm-5 py-2"> class="btn btn-lg rounded-pill fw-semibold text-white shadow px-4 px-sm-5 py-2"
Request a Demo onclick="window.location.hash='#FRequestDemo';">
</button> Request a Demo
</button>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<!--MAIN CONTAINER--> <!--MAIN CONTAINER-->
<div class="container-main"> <div class="container-main">
<!-- LEARN BOXES --> <!-- LEARN BOXES -->
<div class="learn-boxes"> <div class="learn-boxes">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<div class="col-md-6"> <div class="col-md-6">
<img src="images\honeycomb-new.png" alt="Logistics Image" class="img-fluid rounded"> <img src="images\honeycomb-new.png" alt="Logistics Image" class="img-fluid rounded">
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="p-3 text-center"> <div class="p-3 text-center">
<h2>Integrated Public Safety Software</h2> <h2>Integrated Public Safety Software</h2>
<p>EM Systems maintains a full suite of proven integrated systems that can be tailored to fit the specific needs of your organization. Seeking to move from an older outdated, or more expensive solution? Facilitate a smooth transition and don’t lose a thing. Ask us about data conversion and training programs.</p> <p>EM Systems maintains a full suite of proven integrated systems that can be tailored to fit the specific needs of your organization. Seeking to move from an older outdated, or more expensive solution? Facilitate a smooth transition and don’t lose a thing. Ask us about data conversion and training programs.</p>
<a href="#FPublicSafety" id="publicsafetylearn" class="btn btn-primary btn-black">Learn More</a> <a href="#FPublicSafety" id="publicsafetylearn" class="btn btn-primary btn-black">Learn More</a>
</div>
</div>
</div> </div>
</div> <div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded flex-md-row-reverse">
</div> <div class="col-md-6">
<div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded flex-md-row-reverse"> <img src="images\bookshelves.jpg" alt="Storage Image" class="img-fluid rounded">
<div class="col-md-6"> </div>
<img src="images\bookshelves.jpg" alt="Storage Image" class="img-fluid rounded"> <div class="col-md-6">
</div> <div class="p-3 text-center">
<div class="col-md-6"> <h2>Records Management Notification System</h2>
<div class="p-3 text-center"> <p>EM Systems has several new records and information management systems which incorporate modern paradigms in the field. Thinking of integrating electronic medical records with public safety systems? We can help. Feel free to contact us any time.</p>
<h2>Records Management Notification System</h2> <a href="#FRecordsManagement" id="recordsmanagementlearn" class="btn btn-primary btn-black">Learn More</a>
<p>EM Systems has several new records and information management systems which incorporate modern paradigms in the field. Thinking of integrating electronic medical records with public safety systems? We can help. Feel free to contact us any time.</p> </div>
<a href="#FRecordsManagement" id="recordsmanagementlearn" class="btn btn-primary btn-black">Learn More</a> </div>
</div> </div>
</div> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
</div> <div class="col-md-6">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <img src="images\laptop.jpg" alt="Computer Image" class="img-fluid rounded">
<div class="col-md-6"> </div>
<img src="images\laptop.jpg" alt="Computer Image" class="img-fluid rounded"> <div class="col-md-6">
</div> <div class="p-3 text-center">
<div class="col-md-6"> <h2>Custom Software Development</h2>
<div class="p-3 text-center"> <p>EM Systems has great talent when it comes to working with customers to develop software solutions designed and tailored to their specific needs. Over the years we have created hundreds of custom solutions that have worked wonders for our customers.</p>
<h2>Custom Software Development</h2> <a href="#FCustomSoftware" id="customsoftwarelearn" class="btn btn-primary btn-black">Learn More</a>
<p>EM Systems has great talent when it comes to working with customers to develop software solutions designed and tailored to their specific needs. Over the years we have created hundreds of custom solutions that have worked wonders for our customers.</p> </div>
<a href="#FCustomSoftware" id="customsoftwarelearn" class="btn btn-primary btn-black">Learn More</a> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div id="site_footer"></div> <div id="site_footer"></div>
</div>
<div id="site_nav"></div> <div class="d-flex flex-column min-vh-100">
<div id="site_nav"></div>
<!-- HERO SECTION --> <!-- HERO SECTION -->
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="page-hero-section bg-dark text-white text-center"> <div class="page-hero-section bg-dark text-white text-center">
<img src="images\computer_code.jpg" alt="Hero Image" class="img-fluid hero-image"> <img src="images\computer_code.jpg" alt="Hero Image" class="img-fluid hero-image">
<div class="hero-overlay d-flex justify-content-center align-items-center"> <div class="hero-overlay d-flex justify-content-center align-items-center">
<div class="text-wrapper"> <div class="text-wrapper">
<h1 class="display-4">Integrated Public Safety</h1> <h1 class="display-4">Integrated Public Safety</h1>
</div>
</div>
</div> </div>
</div> </div>
</div>
</div>
<!--MAIN CONTAINER--> <!--MAIN CONTAINER-->
<div class="container-main"> <div class="container-main">
<div class="learn-boxes py-5"> <div class="learn-boxes py-5">
<!-- PUBLIC SAFETY BOX 1 --> <!-- PUBLIC SAFETY BOX 1 -->
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<div class="col-md-12"> <div class="col-md-12">
<div class="p-3"> <div class="p-3">
<div class="text-center"> <div class="text-center">
<h2>Computer Aided Dispatch</h2> <h2>Computer Aided Dispatch</h2>
<p class="mx-auto" style="max-width: 850px;">EM Systems’ CAD program is designed for use by an unlimited number of police, fire, and emergency medical <p class="mx-auto" style="max-width: 850px;">EM Systems’ CAD program is designed for use by an unlimited number of police, fire, and emergency medical
services (EMS) agencies in a single or multi-agency environment. The system provides complaint and incident services (EMS) agencies in a single or multi-agency environment. The system provides complaint and incident
mapping, real-time tracking of vehicles, field communications, and alerts to potential hazards at an mapping, real-time tracking of vehicles, field communications, and alerts to potential hazards at an
address.</p> address.</p>
</div>
<div class="container">
<h3 class="text-center">System Features</h3>
<div class="row justify-content-center">
<div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;">
<ul class="text-start">
<li>Real-time Call Taking / Dispatching</li>
<li>Complaint and Incident Mapping</li>
<li>911 Interface</li>
<li>Field Communications</li>
</ul>
</div> </div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing --> <div class="container">
<ul> <h3 class="text-center">System Features</h3>
<li>Messaging and Bulletin Boards</li> <div class="row justify-content-center">
<li>Alerts and Hazards Notification</li> <div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;">
<li>Supports Silent Dispatch</li> <ul class="text-start">
<li>Integration with LEMS</li> <li>Real-time Call Taking / Dispatching</li>
</ul> <li>Complaint and Incident Mapping</li>
<li>911 Interface</li>
<li>Field Communications</li>
</ul>
</div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul>
<li>Messaging and Bulletin Boards</li>
<li>Alerts and Hazards Notification</li>
<li>Supports Silent Dispatch</li>
<li>Integration with LEMS</li>
</ul>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <!-- PUBLIC SAFETY BOX 2 -->
</div> <div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded">
<!-- PUBLIC SAFETY BOX 2 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded"> <div class="p-3">
<div class="col-md-12"> <div class="text-center">
<div class="p-3"> <h2>Record Management System</h2>
<div class="text-center"> <p class="mx-auto" style="max-width: 850px;">Our Records Management System (RMS) is a powerful menu-driven database system than can be used to track
<h2>Record Management System</h2> everything from arrest / booking information to court records (e.g., orders of protection, summons, etc.),
<p class="mx-auto" style="max-width: 850px;">Our Records Management System (RMS) is a powerful menu-driven database system than can be used to track and personnel information (e.g., training, promotions, etc.). The system provides for enhanced patrol,
everything from arrest / booking information to court records (e.g., orders of protection, summons, etc.), investigative, and administrative processes and provides a wealth of valuable analysis information. Users
and personnel information (e.g., training, promotions, etc.). The system provides for enhanced patrol, can create reports based on data from any field in the software to help prevent and solve crimes, allocate
investigative, and administrative processes and provides a wealth of valuable analysis information. Users resources, and much more.</p>
can create reports based on data from any field in the software to help prevent and solve crimes, allocate
resources, and much more.</p>
</div>
<div class="container">
<h3 class="text-center">System Features</h3>
<div class="row justify-content-center">
<div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul class="text-start">
<li>Master Name including detailed data on persons, addresses, vehicles, etc.</li>
<li>Tracking incident activity
</li>
<li>Search and audit capabilities
</li>
<li>Investigations / case management
</li>
</ul>
</div> </div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing --> <div class="container">
<ul> <h3 class="text-center">System Features</h3>
<li>Crime analysis</li> <div class="row justify-content-center">
<li>Personnel information / management <div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
</li> <ul class="text-start">
<li>Narrative with spell check <li>Master Name including detailed data on persons, addresses, vehicles, etc.</li>
</li> <li>Tracking incident activity
<li>Reporting capabilities </li>
</li> <li>Search and audit capabilities
</ul> </li>
<li>Investigations / case management
</li>
</ul>
</div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul>
<li>Crime analysis</li>
<li>Personnel information / management
</li>
<li>Narrative with spell check
</li>
<li>Reporting capabilities
</li>
</ul>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <!-- PUBLIC SAFETY BOX 3 -->
</div> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<!-- PUBLIC SAFETY BOX 3 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="p-3">
<div class="col-md-12"> <div class="text-center">
<div class="p-3"> <h2>Mobile Data System</h2>
<div class="text-center"> <p class="mx-auto" style="max-width: 850px;">The Mobile Data System (MDS) we created provides multi-agency mobile data communications interoperability.
<h2>Mobile Data System</h2> The system provides mobile users the ability to perform onsite data checks, including plate checks, driver
<p class="mx-auto" style="max-width: 850px;">The Mobile Data System (MDS) we created provides multi-agency mobile data communications interoperability. checks, vehicle data checks, and name checks. The system also provides detailed information on the
The system provides mobile users the ability to perform onsite data checks, including plate checks, driver complaint, allows the user to view all units and their status, and enables the user to send and receive
checks, vehicle data checks, and name checks. The system also provides detailed information on the messages from other users.</p>
complaint, allows the user to view all units and their status, and enables the user to send and receive
messages from other users.</p>
</div>
<div class="container">
<h3 class="text-center">System Features</h3>
<div class="row justify-content-center">
<div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul class="text-start">
<li>Wireless multi-agency interoperable data communications of real-time dispatch and complaint
information
</li>
<li>Onsite data checks (including name, plate, driver, vehicle, warrants)
</li>
<li>Police reporting module to enter information into RMS from the field
</li>
</ul>
</div> </div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing --> <div class="container">
<ul> <h3 class="text-center">System Features</h3>
<li>View all available units and their status <div class="row justify-content-center">
</li> <div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<li>Send and receive messages from other units / agencies</li> <ul class="text-start">
<li>Supports AirCard and / or Packet Radio Modem RF Technology</li> <li>Wireless multi-agency interoperable data communications of real-time dispatch and complaint
<li>Dispatch link (complaint and status updates)</li> information
</ul> </li>
<li>Onsite data checks (including name, plate, driver, vehicle, warrants)
</li>
<li>Police reporting module to enter information into RMS from the field
</li>
</ul>
</div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul>
<li>View all available units and their status
</li>
<li>Send and receive messages from other units / agencies</li>
<li>Supports AirCard and / or Packet Radio Modem RF Technology</li>
<li>Dispatch link (complaint and status updates)</li>
</ul>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <!-- PUBLIC SAFETY BOX 4 -->
</div> <div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded">
<!-- PUBLIC SAFETY BOX 4 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded"> <div class="p-3">
<div class="col-md-12"> <div class="text-center">
<div class="p-3"> <h2>Automated Vehicle Location System</h2>
<div class="text-center"> <p class="mx-auto" style="max-width: 850px;">Our AVL System is a real-time automatic vehicle location system used to pinpoint the location of equipped
<h2>Automated Vehicle Location System</h2> vehicles and track their movement. The system allows you to visually see the location of units in the field,
<p class="mx-auto" style="max-width: 850px;">Our AVL System is a real-time automatic vehicle location system used to pinpoint the location of equipped enhance dispatch operations, and increase officer safety.</p>
vehicles and track their movement. The system allows you to visually see the location of units in the field,
enhance dispatch operations, and increase officer safety.</p>
</div>
<div class="container">
<h3 class="text-center">System Features</h3>
<div class="row justify-content-center">
<div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul class="text-start">
<li>Real-time GPS Vehicle Tracking</li>
<li>Mapping Application for Dispatch and Mobile</li>
</ul>
</div> </div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing --> <div class="container">
<ul> <h3 class="text-center">System Features</h3>
<li>XML-based Communications</li> <div class="row justify-content-center">
<li>Complaint and Crime Mapping</li> <div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
</ul> <ul class="text-start">
<li>Real-time GPS Vehicle Tracking</li>
<li>Mapping Application for Dispatch and Mobile</li>
</ul>
</div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul>
<li>XML-based Communications</li>
<li>Complaint and Crime Mapping</li>
</ul>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <!-- PUBLIC SAFETY BOX 5 -->
</div> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<!-- PUBLIC SAFETY BOX 5 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="p-3">
<div class="col-md-12"> <div class="text-center">
<div class="p-3"> <h2>Jail Management System</h2>
<div class="text-center"> <p class="mx-auto" style="max-width: 850px;">EM Systems’ Jail Management System (JMS) is designed to effectively assist in the management of a
<h2>Jail Management System</h2> detention
<p class="mx-auto" style="max-width: 850px;">EM Systems’ Jail Management System (JMS) is designed to effectively assist in the management of a facility of any size. The system can operate independently or as a component of EM Systems’ Law
detention Enforcement
facility of any size. The system can operate independently or as a component of EM Systems’ Law Management System (LEMS). It can also be integrated with other justice information systems from
Enforcement third-party
Management System (LEMS). It can also be integrated with other justice information systems from vendors. As with all EM Systems’ software, the JMS can be customized to meet the unique needs of your
third-party agency.</p>
vendors. As with all EM Systems’ software, the JMS can be customized to meet the unique needs of your
agency.</p>
</div>
<div class="container">
<h3 class="text-center">System Features</h3>
<div class="row justify-content-center">
<div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul class="text-start">
<li>Facilitates booking procedures</li>
<li>Access to historical data</li>
<li>Medical and suicide screening</li>
<li>Release date calculations and processing</li>
</ul>
</div> </div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing --> <div class="container">
<ul> <h3 class="text-center">System Features</h3>
<li>Property and custody management</li> <div class="row justify-content-center">
<li>Powerful search capabilities</li> <div class="col-sm-6 col-md-auto mb-2 border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<li>Automated reporting</li> <ul class="text-start">
</ul> <li>Facilitates booking procedures</li>
<li>Access to historical data</li>
<li>Medical and suicide screening</li>
<li>Release date calculations and processing</li>
</ul>
</div>
<div class="col-sm-6 col-md-auto text-md-start border-top pt-3" style="max-width: 250px;"> <!-- Set max-width and use Bootstrap's sizing -->
<ul>
<li>Property and custody management</li>
<li>Powerful search capabilities</li>
<li>Automated reporting</li>
</ul>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div id="site_footer"></div> <div id="site_footer"></div>
</div>
<div id="site_nav"></div> <div class="d-flex flex-column min-vh-100">
<div id="site_nav"></div>
<!-- HERO SECTION --> <!-- HERO SECTION -->
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="page-hero-section bg-dark text-white text-center" id="FRecordsManagement" tabindex="-1"> <div class="page-hero-section bg-dark text-white text-center" id="FRecordsManagement" tabindex="-1">
<img src="images\computer_code.jpg" alt="Hero Image" class="img-fluid hero-image"> <img src="images\computer_code.jpg" alt="Hero Image" class="img-fluid hero-image">
<div class="hero-overlay d-flex justify-content-center align-items-center"> <div class="hero-overlay d-flex justify-content-center align-items-center">
<div class="text-wrapper"> <div class="text-wrapper">
<h1 class="display-4">Records Management Notification System</h1> <h1 class="display-4">Records Management Notification System</h1>
</div>
</div>
</div> </div>
</div> </div>
</div>
</div>
<!--MAIN CONTAINER--> <!--MAIN CONTAINER-->
<div class="container-main"> <div class="container-main">
<div class="learn-boxes py-5"> <div class="learn-boxes py-5">
<!-- RECORDS MANAGEMENT BOX 1 --> <!-- RECORDS MANAGEMENT BOX 1 -->
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<div class="col-md-12"> <div class="col-md-12">
<div class="p-3 text-center"> <div class="p-3 text-center">
<h2>Records Retention Notification</h2> <h2>Records Retention Notification</h2>
<p class="mx-auto" style="max-width: 850px;">Emergent.MD is an easy-to-use, full-featured, state-of-the-art Electronic Medical Records System. It works <p class="mx-auto" style="max-width: 850px;">Emergent.MD is an easy-to-use, full-featured, state-of-the-art Electronic Medical Records System. It works
with just about any practice. It interfaces with your existing Practice Management System. And, we’ll tailor with just about any practice. It interfaces with your existing Practice Management System. And, we’ll tailor
it to fit your unique workflow requirements. It will improve efficiency and save money for your practice. it to fit your unique workflow requirements. It will improve efficiency and save money for your practice.
</p> </p>
</div>
</div>
</div> </div>
</div> <!-- RECORDS MANAGEMENT BOX 2 -->
</div> <div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded">
<!-- RECORDS MANAGEMENT BOX 2 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-gray shadow-sm rounded"> <div class="p-3 text-center">
<div class="col-md-12"> <h2>Legal Hold Notices</h2>
<div class="p-3 text-center"> <p class="mx-auto" style="max-width: 850px;">TeleCare Connex is a completely integrated telemonitoring solution that includes wireless mobile devices
<h2>Legal Hold Notices</h2> for remote vital sign collection, and a web application for technicians and monitors to setup, enroll, and
<p class="mx-auto" style="max-width: 850px;">TeleCare Connex is a completely integrated telemonitoring solution that includes wireless mobile devices actively or passively track patient status and provide health information accordingly. This helps to reduce
for remote vital sign collection, and a web application for technicians and monitors to setup, enroll, and hospititalizations, promote good health with its participants and saves money.</p>
actively or passively track patient status and provide health information accordingly. This helps to reduce </div>
hospititalizations, promote good health with its participants and saves money.</p> </div>
</div> </div>
</div> <!-- RECORDS MANAGEMENT BOX 3 -->
</div> <div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded">
<!-- RECORDS MANAGEMENT BOX 3 --> <div class="col-md-12">
<div class="row mb-4 g-4 align-items-center bg-white shadow-sm rounded"> <div class="p-3 text-center">
<div class="col-md-12"> <h2>Freedom of Information Law (FOIL)</h2>
<div class="p-3 text-center"> <p class="mx-auto" style="max-width: 850px;">Dictation Notepad is a simple app for dictating and sending notes using an android powered device. It
<h2>Freedom of Information Law (FOIL)</h2> leverages speech recognition technology to accurately transform speech to text and it allows formatting and
<p class="mx-auto" style="max-width: 850px;">Dictation Notepad is a simple app for dictating and sending notes using an android powered device. It editing of the text using voice commands. The audio is recorded and encoded to a small file size and saved
leverages speech recognition technology to accurately transform speech to text and it allows formatting and along with the text. The text (in html format) and audio can be configured to send to variety of destination
editing of the text using voice commands. The audio is recorded and encoded to a small file size and saved protocols (SMTP, FTP/S, HTTP/S) with a user specified host.</p>
along with the text. The text (in html format) and audio can be configured to send to variety of destination </div>
protocols (SMTP, FTP/S, HTTP/S) with a user specified host.</p> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div id="site_footer"></div> <div id="site_footer"></div>
</div>
...@@ -3,12 +3,14 @@ object FRequestDemo: TFRequestDemo ...@@ -3,12 +3,14 @@ object FRequestDemo: TFRequestDemo
Height = 480 Height = 480
CSSLibrary = cssBootstrap CSSLibrary = cssBootstrap
ElementFont = efCSS ElementFont = efCSS
OnCreate = WebFormCreate
object lblReqPrefMethod: TWebLabel object lblReqPrefMethod: TWebLabel
Left = 54 Left = 54
Top = 138 Top = 138
Width = 96 Width = 225
Height = 15 Height = 15
Caption = 'lblReqPrefMethod' Caption = 'Please choose a preferred contact method.'
ElementID = 'lbl_req_pref_method'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
...@@ -19,24 +21,27 @@ object FRequestDemo: TFRequestDemo ...@@ -19,24 +21,27 @@ object FRequestDemo: TFRequestDemo
Top = 62 Top = 62
Width = 121 Width = 121
Height = 22 Height = 22
ElementClassName = 'form-control' TabStop = False
ElementID = 'edt_req_name'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
Text = 'edtReqName' ShowFocus = False
WidthPercent = 100.000000000000000000 WidthPercent = 100.000000000000000000
end end
object WebEdit2: TWebEdit object edtReqEmail: TWebEdit
Left = 196 Left = 196
Top = 62 Top = 62
Width = 121 Width = 121
Height = 22 Height = 22
TabStop = False
ChildOrder = 1 ChildOrder = 1
ElementClassName = 'form-control' ElementClassName = 'form-control'
ElementID = 'edt_req_email'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
Text = 'edtReqEmail' ShowFocus = False
WidthPercent = 100.000000000000000000 WidthPercent = 100.000000000000000000
end end
object edtReqAgency: TWebEdit object edtReqAgency: TWebEdit
...@@ -44,59 +49,82 @@ object FRequestDemo: TFRequestDemo ...@@ -44,59 +49,82 @@ object FRequestDemo: TFRequestDemo
Top = 100 Top = 100
Width = 121 Width = 121
Height = 22 Height = 22
TabStop = False
ChildOrder = 2 ChildOrder = 2
ElementClassName = 'form-control' ElementID = 'edt_req_agency'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
Text = 'edtReqAgency' ShowFocus = False
WidthPercent = 100.000000000000000000 WidthPercent = 100.000000000000000000
end end
object WebEdit4: TWebEdit object edtReqPhoneNumber: TWebEdit
Left = 50 Left = 50
Top = 100 Top = 100
Width = 121 Width = 121
Height = 22 Height = 22
TabStop = False
ChildOrder = 3 ChildOrder = 3
EditType = weNumeric
ElementClassName = 'form-control' ElementClassName = 'form-control'
ElementID = 'edt_req_phone_number'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
Text = 'edtReqPhone' ShowFocus = False
WidthPercent = 100.000000000000000000 WidthPercent = 100.000000000000000000
end end
object req: TWebRadioButton object radReqPhone: TWebRadioButton
Left = 54 Left = 54
Top = 164 Top = 164
Width = 113 Width = 117
Height = 22 Height = 22
Caption = 'req' Caption = 'Phone'
Checked = False Checked = False
ChildOrder = 5 ChildOrder = 5
Color = clNone Color = clNone
ElementClassName = 'custom-control custom-radio' ElementID = 'rad_req_phone'
ElementButtonClassName = 'custom-control-input'
ElementLabelClassName = 'custom-control-label'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
ShowFocus = False
WidthPercent = 100.000000000000000000 WidthPercent = 100.000000000000000000
end end
object WebRadioButton2: TWebRadioButton object radReqEmail: TWebRadioButton
Left = 196 Left = 196
Top = 164 Top = 164
Width = 113 Width = 121
Height = 22 Height = 22
Caption = 'WebRadioButton2' Caption = 'Email'
Checked = False Checked = False
ChildOrder = 6 ChildOrder = 6
Color = clNone Color = clNone
ElementClassName = 'custom-control custom-radio' ElementID = 'rad_req_email'
ElementButtonClassName = 'custom-control-input' ElementFont = efCSS
ElementLabelClassName = 'custom-control-label' HeightStyle = ssAuto
HeightPercent = 100.000000000000000000
ShowFocus = False
WidthPercent = 100.000000000000000000
end
object btnReqSendRequest: TWebButton
Left = 54
Top = 212
Width = 96
Height = 25
Caption = 'Send Request'
ChildOrder = 7
ElementID = 'btn_req_send_request'
ElementFont = efCSS ElementFont = efCSS
HeightStyle = ssAuto HeightStyle = ssAuto
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
TabStop = False
WidthPercent = 100.000000000000000000 WidthPercent = 100.000000000000000000
OnClick = btnReqSendRequestClick
end
object xdwcRequestDemo: TXDataWebClient
Connection = DMConnection.ApiConnection
OnError = xdwcRequestDemoError
Left = 270
Top = 260
end end
end end
...@@ -2,42 +2,44 @@ ...@@ -2,42 +2,44 @@
<div id="site_nav"></div> <div id="site_nav"></div>
<!-- REQUEST DEMO SECTION --> <!-- REQUEST DEMO SECTION -->
<main class="container pt-5 mt-5 flex-grow-1"> <div class="container pt-5 mt-5 flex-grow-1">
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-12 col-md-10 col-lg-7"> <div class="col-12 col-md-10 col-lg-7">
<div class="card shadow-sm border-0"> <div class="card shadow-sm border-0">
<div class="card-body p-4 p-md-5"> <div class="card-body p-4 p-md-5">
<h2 class="mb-2 text-center">Request a Demo</h2> <h2 class="mb-2 text-center">Request a Demo</h2>
<p class="text-muted text-center mb-4"> <p class="text-muted text-center mb-4">
Tell us a little about you, and well reach out to schedule a demo. Please fill in the information, and we will reach out to schedule a demo.
</p> </p>
<form> <form id="frm_request_demo" novalidate>
<div class="row g-3"> <div class="row g-3">
<div class="col-md-6">
<label for="edt_req_name" class="form-label">Name*</label> <div class="col-12">
<input type="text" class="form-control" id="edt_req_name" required> <label for="edt_req_name" class="form-label mb-1">Name*</label>
<input type="text" class="form-control" id="edt_req_name">
<div id="fb_req_name" class="invalid-feedback">Please enter your name.</div>
</div> </div>
<div class="col-md-6"> <div class="col-12 col-md-7">
<label for="edt_req_email" class="form-label">Email*</label> <label for="edt_req_email" class="form-label mb-1">Email</label>
<input type="email" class="form-control" id="edt_req_email" required> <input type="email" class="form-control" id="edt_req_email">
<div id="fb_req_email" class="invalid-feedback">Please enter a valid email address.</div>
</div> </div>
<div class="col-md-6"> <div class="col-12 col-md-5">
<label for="edt_req_phone_number" class="form-label">Phone Number</label> <label for="edt_req_phone_number" class="form-label mb-1">Phone Number</label>
<input type="tel" class="form-control" id="edt_req_phone_number"> <input type="tel" class="form-control" id="edt_req_phone_number">
<div id="fb_req_phone" class="invalid-feedback">Please enter a phone number.</div>
</div> </div>
<div class="col-md-6"> <div class="col-12 col-md-6">
<label for="edt_req_agency" class="form-label">Agency</label> <label for="edt_req_agency" class="form-label mb-1">Agency</label>
<input type="text" class="form-control" id="edt_req_agency"> <input type="text" class="form-control" id="edt_req_agency">
</div> </div>
<div class="col-12 mt-2"> <div class="col-12">
<div id="lbl_req_pref_method" class="form-label mb-2"> <div id="lbl_req_pref_method" class="form-label mb-2">Preferred Contact Method*</div>
Preferred Contact Method
</div>
<div class="d-flex flex-column flex-sm-row gap-2 gap-sm-4"> <div class="d-flex flex-column flex-sm-row gap-2 gap-sm-4">
<div class="form-check"> <div class="form-check">
...@@ -50,25 +52,28 @@ ...@@ -50,25 +52,28 @@
<label class="form-check-label" for="rad_req_email">Email</label> <label class="form-check-label" for="rad_req_email">Email</label>
</div> </div>
</div> </div>
<div id="fb_req_pref" class="text-danger small mt-1 d-none">
Please choose a preferred contact method.
</div>
</div> </div>
<div class="col-12 mt-3"> <div class="col-12 mt-4">
<button type="button" class="btn btn-primary w-100 w-sm-auto px-4" id="btn_req_send_request"> <button type="button" class="btn btn-primary w-100 d-md-inline-block w-md-auto px-4" id="btn_req_send_request">
Send Request Send Request
</button> </button>
</div> </div>
<div class="col-12">
<div id="card_status_message" class="alert mt-3 d-none mb-0" role="alert"></div>
</div>
</div> </div>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</main> </div>
<div id="site_footer" class="mt-auto"></div> <div id="site_footer" class="mt-auto"></div>
</div> </div>
...@@ -80,20 +85,28 @@ ...@@ -80,20 +85,28 @@
</div> </div>
</div> </div>
<div class="modal fade" id="request_demo_notification_modal" tabindex="-1" aria-labelledby="request_demo_notification_modal_label" aria-hidden="true"> <div class="modal fade" id="contact_notification_modal" tabindex="-1" aria-labelledby="contact_notification_modal_label" aria-hidden="true">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content shadow-lg"> <div class="modal-content shadow-lg">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="request_demo_notification_modal_label">Info</h5> <h5 class="modal-title" id="contact_notification_modal_label">Demo Requested Successfully</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body fs-6 fw-bold" id="request_demo_notification_modal_body"> <div class="modal-body fs-6 fw-bold" id="contact_notification_modal_body">
Please contact EMSystems to solve the issue. Please contact EMSystems to solve the issue.
</div> </div>
<div class="modal-footer justify-content-center"> <div class="modal-footer justify-content-center">
<button type="button" id="btn_modal_close" class="btn btn-primary">Close</button> <a href="#FHome"
id="btn_modal_close"
class="btn btn-primary"
data-bs-dismiss="modal"
onclick="window.location.hash='#FHome';">
Close
</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
...@@ -4,21 +4,32 @@ interface ...@@ -4,21 +4,32 @@ interface
uses uses
System.SysUtils, System.Classes, JS, Web, WEBLib.Graphics, WEBLib.Controls, System.SysUtils, System.Classes, JS, Web, WEBLib.Graphics, WEBLib.Controls,
WEBLib.Forms, WEBLib.Dialogs, Vcl.StdCtrls, WEBLib.StdCtrls, Vcl.Controls; WEBLib.Forms, WEBLib.Dialogs, Vcl.StdCtrls, WEBLib.StdCtrls, Vcl.Controls,
XData.Web.Client, ConnectionModule, Utils, WEBLib.RegularExpressions;
type type
TFRequestDemo = class(TWebForm) TFRequestDemo = class(TWebForm)
edtReqName: TWebEdit; edtReqName: TWebEdit;
WebEdit2: TWebEdit; edtReqEmail: TWebEdit;
edtReqAgency: TWebEdit; edtReqAgency: TWebEdit;
WebEdit4: TWebEdit; edtReqPhoneNumber: TWebEdit;
lblReqPrefMethod: TWebLabel; lblReqPrefMethod: TWebLabel;
req: TWebRadioButton; radReqPhone: TWebRadioButton;
WebRadioButton2: TWebRadioButton; radReqEmail: TWebRadioButton;
btnReqSendRequest: TWebButton;
xdwcRequestDemo: TXDataWebClient;
procedure btnReqSendRequestClick(Sender: TObject);
procedure WebFormCreate(Sender: TObject);
procedure xdwcRequestDemoError(Error: TXDataClientError);
private private
{ Private declarations } function IsEmailValid(const email: string): Boolean;
public function PreferredMethod: string;
{ Public declarations } procedure NavScrollSizing;
procedure ClearFieldErrors;
procedure SetInvalid(const inputId: string);
procedure ShowFeedback(const feedbackId: string);
function ValidateRequest: Boolean;
procedure SendRequest;
end; end;
var var
...@@ -28,7 +39,193 @@ implementation ...@@ -28,7 +39,193 @@ implementation
{$R *.dfm} {$R *.dfm}
uses
Site.Navbar,
Site.Footer;
procedure TFRequestDemo.WebFormCreate(Sender: TObject);
begin
Application.ThemeColor := clTMSWEB;
InjectNavbar;
InjectFooter;
SetFooterVersion('ver - ' + TDMConnection.clientVersion);
NavScrollSizing;
end;
procedure TFRequestDemo.xdwcRequestDemoError(Error: TXDataClientError);
begin
Utils.HideSpinner('spinner');
ShowNotificationModal('Error when attempting to send: ' + Error.ErrorMessage);
end;
procedure TFRequestDemo.NavScrollSizing;
begin
asm
window.addEventListener('scroll', function() {
var navbar = document.querySelector('.em-navbar-wrap .navbar');
var logo = document.querySelector('.em-brand img');
var scrollDistance = 50;
if (window.scrollY > scrollDistance) {
navbar.classList.add('scrolled');
logo.classList.add('scrolled-logo');
} else {
navbar.classList.remove('scrolled');
logo.classList.remove('scrolled-logo');
}
});
end;
end;
function TFRequestDemo.IsEmailValid(const email: string): Boolean;
const
pattern = '^[^\s@]+@[^\s@]+\.[^\s@]+$';
begin
Result := TRegEx.IsMatch(email.Trim, pattern);
end;
function TFRequestDemo.PreferredMethod: string;
begin
if radReqPhone.Checked then
Exit('phone');
if radReqEmail.Checked then
Exit('email');
Result := '';
end;
procedure TFRequestDemo.ShowFeedback(const feedbackId: string);
var
el: TJSHTMLElement;
begin
el := TJSHTMLElement(document.getElementById(feedbackId));
if Assigned(el) then
el.classList.remove('d-none');
end;
procedure TFRequestDemo.SetInvalid(const inputId: string);
var
inputEl: TJSHTMLElement;
begin
inputEl := TJSHTMLElement(document.getElementById(inputId));
if Assigned(inputEl) then
inputEl.classList.add('is-invalid');
end;
procedure TFRequestDemo.ClearFieldErrors;
var
inputEl: TJSHTMLElement;
prefEl: TJSHTMLElement;
begin
inputEl := TJSHTMLElement(document.getElementById('edt_req_name'));
if Assigned(inputEl) then inputEl.classList.remove('is-invalid');
inputEl := TJSHTMLElement(document.getElementById('edt_req_email'));
if Assigned(inputEl) then inputEl.classList.remove('is-invalid');
inputEl := TJSHTMLElement(document.getElementById('edt_req_phone_number'));
if Assigned(inputEl) then inputEl.classList.remove('is-invalid');
prefEl := TJSHTMLElement(document.getElementById('fb_req_pref'));
if Assigned(prefEl) then
prefEl.classList.add('d-none');
end;
function TFRequestDemo.ValidateRequest: Boolean;
var
prefMissing: Boolean;
needsEmail: Boolean;
needsPhone: Boolean;
emailHasText: Boolean;
begin
ClearFieldErrors;
if edtReqName.Text.Trim = '' then
begin
SetInvalid('edt_req_name');
Exit(False);
end;
prefMissing := not (radReqPhone.Checked or radReqEmail.Checked);
if prefMissing then
begin
ShowFeedback('fb_req_pref');
Exit(False);
end;
needsEmail := radReqEmail.Checked;
needsPhone := radReqPhone.Checked;
emailHasText := edtReqEmail.Text.Trim <> '';
if (needsEmail or emailHasText) and (not IsEmailValid(edtReqEmail.Text)) then
begin
SetInvalid('edt_req_email');
Exit(False);
end;
if needsPhone and (edtReqPhoneNumber.Text.Trim = '') then
begin
SetInvalid('edt_req_phone_number');
Exit(False);
end;
Result := True;
end;
procedure TFRequestDemo.btnReqSendRequestClick(Sender: TObject);
begin
if not ValidateRequest then
Exit;
Utils.ShowSpinner('spinner');
if not DMConnection.ApiConnection.Connected then
begin
DMConnection.ApiConnection.Open(
procedure
begin
SendRequest;
end);
Exit;
end;
SendRequest;
end;
procedure TFRequestDemo.SendRequest;
var
bodyText: string;
begin
bodyText :=
'Demo request details:' + sLineBreak +
'Name: ' + edtReqName.Text + sLineBreak +
'Email: ' + edtReqEmail.Text + sLineBreak +
'Phone: ' + edtReqPhoneNumber.Text + sLineBreak +
'Agency: ' + edtReqAgency.Text + sLineBreak +
'Preferred contact: ' + PreferredMethod;
xdwcRequestDemo.RawInvoke('IApiService.SendEmail',
[edtReqName.Text, edtReqEmail.Text, 'Demo Request', bodyText],
procedure(response: TXDataClientResponse)
begin
Utils.HideSpinner('spinner');
ClearFieldErrors;
edtReqName.Text := '';
edtReqEmail.Text := '';
edtReqPhoneNumber.Text := '';
edtReqAgency.Text := '';
radReqPhone.Checked := False;
radReqEmail.Checked := False;
ShowNotificationModal('Your demo request has been sent successfully. We will reach out shortly.');
end);
end;
initialization initialization
RegisterClass(TFRequestDemo); RegisterClass(TFRequestDemo);
end. end.
\ No newline at end of file
...@@ -17,93 +17,103 @@ body { ...@@ -17,93 +17,103 @@ body {
/* NAVBAR */ /* NAVBAR */
.em-navbar-wrap .navbar { .em-navbar-wrap .navbar {
transition: padding-top 0.3s ease, padding-bottom 0.3s ease; /* Smooth transitions for padding */ transition: padding-top 0.3s ease, padding-bottom 0.3s ease;
position: fixed; position: fixed;
width: 100%; width: 100%;
z-index: 1030; z-index: 1030;
} }
/* Logo sizing (default + smooth transition) */
.em-brand img {
transition: max-height 0.3s ease;
max-height: 50px;
height: auto;
width: auto;
margin-top: 8px;
}
/* Smaller logo when scrolled */
.em-brand img.scrolled-logo {
max-height: 40px;
}
/* Transition for navbar logo size */ /* Smaller logo on phones */
.em-brand img { @media (max-width: 575.98px) {
transition: max-height 0.3s ease; /* Smooth transition for logo size */ .em-brand img {
max-height: 80px; /* Set a max-height for the logo */ max-height: 40px;
margin-top: 8px; margin-top: 6px;
}
} }
/* Nav link styles and transitions */ /* Nav link styles and transitions */
.em-navbar-wrap .navbar .navbar-nav .nav-link { .em-navbar-wrap .navbar .navbar-nav .nav-link {
transition: color 0.3s ease; /* Smooth transition for color change */ transition: color 0.3s ease;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.085em; letter-spacing: 0.085em;
font-size: 1rem; font-size: 1rem;
color: #FFFFFF; color: #FFFFFF;
} }
/* Hover and active state for nav links */ /* Hover and active state for nav links */
.em-navbar-wrap .navbar .navbar-nav .nav-item:hover .nav-link, .em-navbar-wrap .navbar .navbar-nav .nav-item:hover .nav-link,
.em-navbar-wrap .navbar .navbar-nav .nav-item.active .nav-link { .em-navbar-wrap .navbar .navbar-nav .nav-item.active .nav-link {
color: #999999; color: #999999;
box-shadow: inset 0 -4px 0 0 #2c66a0; box-shadow: inset 0 -4px 0 0 #2c66a0;
} }
/* navbar changes when scrolled */ /* navbar changes when scrolled */
.em-navbar-wrap .navbar.scrolled { .em-navbar-wrap .navbar.scrolled {
padding-top: 0.5rem; padding-top: 0.5rem;
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
}
/* Smaller logo when scrolled */
.em-brand img.scrolled-logo {
max-height: 40px;
} }
/* Adjust padding for nav links when scrolled */ /* Adjust padding for nav links when scrolled */
.navbar.scrolled .nav-link { .navbar.scrolled .nav-link {
padding-top: 0.5rem; padding-top: 0.5rem;
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
} }
/* navbar dropdown menu */ /* navbar dropdown menu */
.em-navbar-wrap .navbar .navbar-nav .dropdown-menu { .em-navbar-wrap .navbar .navbar-nav .dropdown-menu {
background-color: #212529; /* Dark background to match the navbar */ background-color: #212529;
border: none; /* No border for a cleaner look */ border: none;
} }
.em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item { .em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item {
color: #f8f9fa; color: #f8f9fa;
} }
.em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item:hover, .em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item:hover,
.em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item:focus { .em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item:focus {
background-color: #495057; /* Slightly lighter background on hover/focus */ background-color: #495057;
color: #ffffff; color: #ffffff;
} }
.em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item:active { .em-navbar-wrap .navbar .navbar-nav .dropdown-menu .dropdown-item:active {
background-color: #2c66a0; /* Highlights color for active state */ background-color: #2c66a0;
color: #ffffff; color: #ffffff;
} }
/* navbar hamburger menu */ /* navbar hamburger menu */
.navbar-toggler { .navbar-toggler {
outline: none !important; outline: none !important;
border: none !important; border: none !important;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
transition: background-color 0.3s ease, box-shadow 0.3s ease; transition: background-color 0.3s ease, box-shadow 0.3s ease;
background-color: #2c66a0; background-color: #2c66a0;
} }
.navbar-toggler:focus, .navbar-toggler:active, .navbar-toggler.active { .navbar-toggler:focus,
outline: none; .navbar-toggler:active,
border: none !important; .navbar-toggler.active {
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); outline: none;
background-color: #999999; border: none !important;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
background-color: #999999;
} }
.navbar-toggler:hover { .navbar-toggler:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) inset; /* "Pressed in" look */ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) inset;
background-color: #999999; background-color: #999999;
} }
/****************************************************************************************/ /****************************************************************************************/
/* HERO IMAGES */ /* HERO IMAGES */
...@@ -111,7 +121,7 @@ body { ...@@ -111,7 +121,7 @@ body {
position: relative; position: relative;
height: 50vh; /* Control the height of the hero section */ height: 50vh; /* Control the height of the hero section */
overflow: hidden; overflow: hidden;
margin-top: 45px; margin-top: 0px;
} }
.hero-image { .hero-image {
width: 100%; width: 100%;
...@@ -212,16 +222,37 @@ body { ...@@ -212,16 +222,37 @@ body {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
/****************************************************************************************/
/* btn-primary */
.btn-primary { .btn-primary {
background-color: #000; background-color: #212529;
border-color: #000; border-color: #000;
color: #fff; color: #fff;
width: 175px; width: 175px;
} }
.btn-primary:hover { .btn-primary:hover {
background-color: #333; background-color: #333;
border-color: #333; border-color: #333;
color: #fff;
}
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
background-color: #333;
border-color: #333;
color: #fff;
}
.btn-primary:focus,
.btn-primary:focus-visible {
box-shadow: 0 0 0 .25rem rgba(33, 37, 41, .35);
color: #fff;
} }
/****************************************************************************************/ /****************************************************************************************/
...@@ -284,4 +315,29 @@ footer ul li a:focus { ...@@ -284,4 +315,29 @@ footer ul li a:focus {
max-width: 400px; max-width: 400px;
} }
/****************************************************************************************/
/* VALIDATION */
.was-validated .form-control:valid,
.was-validated .form-select:valid {
border-color: var(--bs-border-color) !important;
background-image: none !important;
padding-right: .75rem !important;
}
.was-validated .form-check-input:valid {
border-color: var(--bs-border-color) !important;
}
.was-validated .form-check-input:valid:checked {
background-color: var(--bs-primary) !important;
border-color: var(--bs-primary) !important;
}
.was-validated .form-check-input:valid ~ .form-check-label {
color: inherit !important;
}
...@@ -145,44 +145,56 @@ ...@@ -145,44 +145,56 @@
<DCCReference Include="Site.Footer.pas"/> <DCCReference Include="Site.Footer.pas"/>
<DCCReference Include="Site.Navbar.pas"/> <DCCReference Include="Site.Navbar.pas"/>
<None Include="css\App.css"/> <None Include="css\App.css"/>
<None Include="images\job-gcdf1cf1d3_1920-1536x925.jpg"> <None Include="index.html"/>
<None Include="css\spinner.css"/>
<RcItem Include="images\bookshelves.jpg">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_1</ResourceId> <ResourceId>JpgImage_1</ResourceId>
</None> </RcItem>
<None Include="images\table_with_computers.jpg"> <RcItem Include="images\computer_code.jpg">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_2</ResourceId> <ResourceId>JpgImage_2</ResourceId>
</None> </RcItem>
<None Include="images\EM_Logo2_Copy5-1024x173.png"> <RcItem Include="images\EM_Logo2_Copy5-1024x173.png">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>PngImage_1</ResourceId> <ResourceId>PngImage_1</ResourceId>
</None> </RcItem>
<None Include="images\EM_Logo_White.png"> <RcItem Include="images\EM_Logo_2c66a0.png">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>PngImage_2</ResourceId> <ResourceId>PngImage_2</ResourceId>
</None> </RcItem>
<None Include="images\EM_Logo_#2c66a0.png"> <RcItem Include="images\EM_Logo_Black_Purple.jpg">
<ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_3</ResourceId>
</RcItem>
<RcItem Include="images\EM_Logo_White.png">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>PngImage_3</ResourceId> <ResourceId>PngImage_3</ResourceId>
</None> </RcItem>
<None Include="images\EM_Logo_2c66a0.png"> <RcItem Include="images\honeycomb-new.png">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>PngImage_4</ResourceId> <ResourceId>PngImage_4</ResourceId>
</None> </RcItem>
<None Include="images\pexels-luis-gomes-546819.jpg"> <RcItem Include="images\honeycomb.jpg">
<ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_3</ResourceId>
</None>
<None Include="images\computer_code.jpg">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_4</ResourceId> <ResourceId>JpgImage_4</ResourceId>
</None> </RcItem>
<None Include="images\niagara.jpg"> <RcItem Include="images\laptop.jpg">
<ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_5</ResourceId>
</RcItem>
<RcItem Include="images\LogoAddress2.jpg">
<ResourceType>RCDATA</ResourceType> <ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_6</ResourceId> <ResourceId>JpgImage_6</ResourceId>
</None> </RcItem>
<None Include="index.html"/> <RcItem Include="images\niagara.jpg">
<None Include="css\spinner.css"/> <ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_7</ResourceId>
</RcItem>
<RcItem Include="images\table_with_computers.jpg">
<ResourceType>RCDATA</ResourceType>
<ResourceId>JpgImage_8</ResourceId>
</RcItem>
<BuildConfiguration Include="Base"> <BuildConfiguration Include="Base">
<Key>Base</Key> <Key>Base</Key>
</BuildConfiguration> </BuildConfiguration>
...@@ -267,19 +279,19 @@ ...@@ -267,19 +279,19 @@
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\EM_Logo_#2c66a0.png" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="images\EM_Logo_2c66a0.png" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\EM_Logo_2c66a0.png" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\EM_Logo_2c66a0.png" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\EM_Logo_2c66a0.png" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="images\EM_Logo_Black_Purple.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
...@@ -297,6 +309,18 @@ ...@@ -297,6 +309,18 @@
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\LogoAddress2.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32">
<RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite>
</Platform>
</DeployFile>
<DeployFile LocalName="images\bookshelves.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32">
<RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite>
</Platform>
</DeployFile>
<DeployFile LocalName="images\computer_code.jpg" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\computer_code.jpg" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
...@@ -309,67 +333,67 @@ ...@@ -309,67 +333,67 @@
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\job-gcdf1cf1d3_1920-1536x925.jpg" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\honeycomb-new.png" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\job-gcdf1cf1d3_1920-1536x925.jpg" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="images\honeycomb.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\niagara.jpg" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\job-gcdf1cf1d3_1920-1536x925.jpg" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\niagara.jpg" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="images\laptop.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\pexels-luis-gomes-546819.jpg" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\niagara.jpg" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\pexels-luis-gomes-546819.jpg" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="images\niagara.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\table_with_computers.jpg" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\pexels-luis-gomes-546819.jpg" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="images\table_with_computers.jpg" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="images\table_with_computers.jpg" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="index.html" Configuration="Debug" Class="ProjectFile"> <DeployFile LocalName="images\table_with_computers.jpg" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="index.html" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="index.html" Configuration="Debug" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
</Platform> </Platform>
</DeployFile> </DeployFile>
<DeployFile LocalName="test.html" Configuration="Release" Class="ProjectFile"> <DeployFile LocalName="index.html" Configuration="Release" Class="ProjectFile">
<Platform Name="Win32"> <Platform Name="Win32">
<RemoteDir>.\</RemoteDir> <RemoteDir>.\</RemoteDir>
<Overwrite>true</Overwrite> <Overwrite>true</Overwrite>
......
[Settings] [Settings]
memoLogLevel=3 memoLogLevel=3
fileLogLevel=4 fileLogLevel=4
LogFileNum=35 LogFileNum=42
webClientVersion=1.0.0 webClientVersion=1.0.1
[SMTP] [SMTP]
Host=mail.em-sys.net Host=mail.em-sys.net
......
...@@ -61,17 +61,24 @@ begin ...@@ -61,17 +61,24 @@ begin
HtmlBody := Format( HtmlBody := Format(
'<html>' + '<html>' +
'<body style="font-family: Arial, sans-serif; font-size: 14px;">' + '<body style="font-family: Arial, sans-serif; font-size: 14px; color:#222;">' +
'<h2 style="color: #2E86C1;">New Contact Form Message from EM Systems Website</h2>' + '<h2 style="color: #2E86C1; margin: 0 0 12px 0;">New "%s" message from EM Systems Website</h2>' +
'<hr>' + '<p style="margin: 0 0 6px 0;"><strong>Submitted On:</strong> %s</p>' +
'<p><strong><u>Submitted On:</u></strong> %s</p>' + '<p style="margin: 0 0 6px 0;"><strong>From:</strong> %s &lt;%s&gt;</p>' +
'<p><strong><u>From:</u></strong> %s &lt;%s&gt;</p>' + '<p style="margin: 0 0 14px 0;"><strong>Subject:</strong> %s</p>' +
'<p><strong><u>Subject:</u></strong> %s</p>' + '<hr style="border:0; border-top:1px solid #ddd; margin: 14px 0;">' +
'<hr>' + '<p style="margin: 0 0 8px 0;"><strong>Message:</strong></p>' +
'<p style="margin-top: 20px;"><strong>Message:</strong></p>' + '<div style="line-height: 1.4;">%s</div>' +
'<p>%s</p>' + '</body>' +
'</body></html>', '</html>',
[FormatDateTime('yyyy-mm-dd hh:nn AM/PM', Now), Name, Email, Subject, Body.Replace(sLineBreak, '<br>')] [
Subject,
FormatDateTime('yyyy-mm-dd hh:nn AM/PM', Now),
Name,
Email,
Subject,
Body.Replace(#13#10, '<br>').Replace(#10, '<br>').Replace(#13, '<br>')
]
); );
Message.Body.Text := HtmlBody; Message.Body.Text := HtmlBody;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment