source upload
This commit is contained in:
@@ -0,0 +1,30 @@
|
||||
{
|
||||
Synopse mORMot framework
|
||||
|
||||
Sample 19 - HTTP Server for FishFacts ExtJS queries
|
||||
|
||||
Version 1.18
|
||||
- download and unzip the FishFacts SQLite3 database if not available
|
||||
- added button to open the Browser on the AJAX application page
|
||||
}
|
||||
|
||||
program Project19Server;
|
||||
|
||||
// first line of uses clause must be {$I SynDprUses.inc}
|
||||
uses
|
||||
{$I SynDprUses.inc}
|
||||
Forms,
|
||||
{$ifdef FPC}
|
||||
Interfaces,
|
||||
{$endif}
|
||||
Unit2 in 'Unit2.pas' {Form1};
|
||||
|
||||
{$ifndef FPC}
|
||||
{$R *.res}
|
||||
{$endif}
|
||||
|
||||
begin
|
||||
Application.Initialize;
|
||||
Application.CreateForm(TForm1, Form1);
|
||||
Application.Run;
|
||||
end.
|
Binary file not shown.
@@ -0,0 +1,68 @@
|
||||
object Form1: TForm1
|
||||
Left = 198
|
||||
Top = 124
|
||||
Width = 344
|
||||
Height = 201
|
||||
Caption = 'mORMot FishFacts HTTP Server'
|
||||
Color = clBtnFace
|
||||
Font.Charset = DEFAULT_CHARSET
|
||||
Font.Color = clWindowText
|
||||
Font.Height = -13
|
||||
Font.Name = 'Tahoma'
|
||||
Font.Style = []
|
||||
OldCreateOrder = False
|
||||
OnCreate = FormCreate
|
||||
OnDestroy = FormDestroy
|
||||
OnShow = FormShow
|
||||
PixelsPerInch = 96
|
||||
TextHeight = 16
|
||||
object Label1: TLabel
|
||||
Left = 16
|
||||
Top = 16
|
||||
Width = 297
|
||||
Height = 33
|
||||
Alignment = taCenter
|
||||
AutoSize = False
|
||||
Font.Charset = DEFAULT_CHARSET
|
||||
Font.Color = clTeal
|
||||
Font.Height = -16
|
||||
Font.Name = 'Tahoma'
|
||||
Font.Style = [fsBold]
|
||||
ParentFont = False
|
||||
end
|
||||
object Label2: TLabel
|
||||
Left = 88
|
||||
Top = 72
|
||||
Width = 145
|
||||
Height = 16
|
||||
Caption = 'HTTP Server is running...'
|
||||
end
|
||||
object btnQuit: TButton
|
||||
Left = 24
|
||||
Top = 128
|
||||
Width = 105
|
||||
Height = 25
|
||||
Caption = 'Quit'
|
||||
TabOrder = 1
|
||||
OnClick = btnQuitClick
|
||||
end
|
||||
object btnShowLogs: TButton
|
||||
Left = 192
|
||||
Top = 128
|
||||
Width = 105
|
||||
Height = 25
|
||||
Caption = 'Show Logs'
|
||||
TabOrder = 2
|
||||
OnClick = btnShowLogsClick
|
||||
end
|
||||
object btnOpenBrowser: TButton
|
||||
Left = 24
|
||||
Top = 96
|
||||
Width = 105
|
||||
Height = 25
|
||||
Caption = 'Open AJAX App'
|
||||
Default = True
|
||||
TabOrder = 0
|
||||
OnClick = btnOpenBrowserClick
|
||||
end
|
||||
end
|
@@ -0,0 +1,128 @@
|
||||
unit Unit2;
|
||||
|
||||
interface
|
||||
|
||||
uses
|
||||
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
|
||||
Dialogs, StdCtrls, ShellAPI,
|
||||
SynCommons, SynTable, SynLog, SynZip, SynCrtSock,
|
||||
mORMot, mORMotSQLite3, SynSQLite3Static, mORMotHttpServer;
|
||||
|
||||
type
|
||||
TSQLBiolife = class(TSQLRecord)
|
||||
public
|
||||
fSpecies_No: integer;
|
||||
fCategory: RawUTF8;
|
||||
fCommon_Name: RawUTF8;
|
||||
fSpecies_Name: RawUTF8;
|
||||
fLength_cm: double;
|
||||
fLength_in: double;
|
||||
fNotes: RawUTF8;
|
||||
fGraphic: TSQLRawBlob;
|
||||
fSom: TSQLRawBlob;
|
||||
published
|
||||
property Species_No: integer read fSpecies_No write fSpecies_No;
|
||||
property Category: RawUTF8 read fCategory write fCategory;
|
||||
property Common_Name: RawUTF8 read fCommon_Name write fCommon_Name;
|
||||
property Species_Name: RawUTF8 read fSpecies_Name write fSpecies_Name;
|
||||
property Length_cm: double read fLength_cm write fLength_cm;
|
||||
property Length_in: double read fLength_in write fLength_in;
|
||||
property Notes: RawUTF8 read fNotes write fNotes;
|
||||
property Graphic: TSQLRawBlob read fGraphic write fGraphic;
|
||||
property Som: TSQLRawBlob read fSom write fSom;
|
||||
end;
|
||||
|
||||
TForm1 = class(TForm)
|
||||
Label1: TLabel;
|
||||
btnQuit: TButton;
|
||||
Label2: TLabel;
|
||||
btnShowLogs: TButton;
|
||||
btnOpenBrowser: TButton;
|
||||
procedure btnQuitClick(Sender: TObject);
|
||||
procedure FormCreate(Sender: TObject);
|
||||
procedure FormDestroy(Sender: TObject);
|
||||
procedure FormShow(Sender: TObject);
|
||||
procedure btnShowLogsClick(Sender: TObject);
|
||||
procedure btnOpenBrowserClick(Sender: TObject);
|
||||
private
|
||||
fDatabaseFileName: TFileName;
|
||||
public
|
||||
Model: TSQLModel;
|
||||
DB: TSQLRestServerDB;
|
||||
Server: TSQLHttpServer;
|
||||
end;
|
||||
|
||||
var
|
||||
Form1: TForm1;
|
||||
|
||||
implementation
|
||||
|
||||
{$R *.dfm}
|
||||
|
||||
|
||||
{ TForm1 }
|
||||
|
||||
procedure TForm1.btnQuitClick(Sender: TObject);
|
||||
begin
|
||||
Close;
|
||||
end;
|
||||
|
||||
procedure TForm1.FormCreate(Sender: TObject);
|
||||
var download: RawByteString;
|
||||
begin
|
||||
Model := TSQLModel.Create([TSQLBiolife]);
|
||||
fDatabaseFileName := ChangeFileExt(paramstr(0),'.db3');
|
||||
if not FileExists(fDatabaseFileName) then begin
|
||||
download := TWinINet.Get('https://synopse.info/files/samples/Project19Server.zip');
|
||||
if download<>'' then
|
||||
with TZipRead.Create(pointer(download),length(download)) do
|
||||
try
|
||||
UnZip(ExtractFileName(fDatabaseFileName),ExtractFilePath(fDatabaseFileName));
|
||||
finally
|
||||
Free;
|
||||
end;
|
||||
if not FileExists(fDatabaseFileName) then begin
|
||||
ShowMessage('Impossible to find '+fDatabaseFileName+
|
||||
#13#13'Please download it from https://synopse.info/files/samples/Project19Server.zip');
|
||||
exit;
|
||||
end;
|
||||
end;
|
||||
DB := TSQLRestServerDB.Create(Model,fDatabaseFileName);
|
||||
// initialize and launch the server
|
||||
DB.CreateMissingTables;
|
||||
Server := TSQLHttpServer.Create('8080',[DB],'+',useHttpApiRegisteringURI);
|
||||
Server.AccessControlAllowOrigin := '*'; // allow cross-site AJAX queries
|
||||
end;
|
||||
|
||||
procedure TForm1.FormDestroy(Sender: TObject);
|
||||
begin
|
||||
Server.Free;
|
||||
DB.Free;
|
||||
Model.Free;
|
||||
end;
|
||||
|
||||
procedure TForm1.FormShow(Sender: TObject);
|
||||
begin
|
||||
if DB=nil then
|
||||
Close;
|
||||
Label1.Caption := Caption;
|
||||
end;
|
||||
|
||||
procedure TForm1.btnShowLogsClick(Sender: TObject);
|
||||
begin
|
||||
AllocConsole;
|
||||
TextColor(ccLightGray); // to force the console to be recognized
|
||||
with TSQLLog.Family do begin
|
||||
Level := LOG_VERBOSE;
|
||||
EchoToConsole := LOG_VERBOSE; // log all events to the console
|
||||
end;
|
||||
btnShowLogs.Hide;
|
||||
end;
|
||||
|
||||
procedure TForm1.btnOpenBrowserClick(Sender: TObject);
|
||||
begin
|
||||
ShellExecute(0,'open',pointer(ExtractFilePath(ParamStr(0))+'html5\index.html'),
|
||||
nil,nil,SW_SHOWNORMAL);
|
||||
end;
|
||||
|
||||
end.
|
@@ -0,0 +1 @@
|
||||
.fishname{font-size:xx-large;text-align:center;font-style:italic;color:#FFF;font-weight:700;padding:3px}.fishname2{background:0 to(#000));font-size:xx-large;text-align:center}.aboutText{font-family:sans-serif;font-size:medium;color:#FFF;font-weight:700;text-align:left;padding:3px}.captiondiv{background: -moz-linear-gradient(#BEBBB4, #222222) repeat scroll 0 0 #222222;background: -webkit-gradient(linear, left top, left bottom, from(#BEBBB4), to(#222222));;padding:3px 0 5px 3px}.divpadding{height:100%;width:100%;padding:3px}table th{padding:10px}.memoDiv{background-color:#FFF;height:218px;width:100%;overflow:auto;border-style:inset;border-width:1px;padding:3px}.imageDiv{padding-top:6px;height:210px;width:100%;background-color:#FFF;text-align:center;border-style:inset;border-width:1px}.innerTable{height:80%;width:100%}.outerTable{height:340px;width:800px;background-color:#DADBDC}.outerTableDiv{width:800px;border-style:outset;border-width:2px}td.innertable{background:0 to(#222222));height:100%;width:100%;vertical-align:top}table.detailstable{background: -moz-linear-gradient(#565656, #222222) repeat scroll 0 0 #222222;background: -webkit-gradient(linear, left top, left bottom, from(#565656), to(#222222));;border:1px solid #2A2A2A;color:#FFF;font-weight:400;border-collapse:collapse;font-size:Smaller;font-family:sans-serif;width:100%;height:75%;border-style:inset;border-width:1px}td.detailstable{width:25%;text-align:left;color:#000;background-color:#FFF;border-style:inset;border-width:1px;padding:2px}th.detailstable{text-align:left;border-style:inset;border-width:1px;padding:3px}.btnUP{background:url(../images/up.png);color:#fff;margin-right:0;margin-top:10px;border-radius:3px;text-shadow:1px 1px 0 rgba(0,0,0,0.3);padding:5px 15px}.btnDown{background:url(../images/down.png);color:#fff;margin-right:0;margin-top:10px;border-radius:3px;text-shadow:1px 1px 0 rgba(0,0,0,0.3);padding:5px 15px}
|
Binary file not shown.
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1,231 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title>mORMot FishFacts >> by warleyalex</title>
|
||||
<link rel="stylesheet" type="text/css" href="css/main.css" />
|
||||
<script type="text/javascript" src="jquery.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
function gxr(){var xdr=null;if(window.XDomainRequest){xdr=new XDomainRequest();}else if(window.XMLHttpRequest){xdr=new XMLHttpRequest();} return xdr;}
|
||||
|
||||
function GetKeys(url) {
|
||||
var xdr = gxr();
|
||||
xdr.onload = function () {
|
||||
jsonData = JSON.parse(request.responseText);
|
||||
}
|
||||
xdr.onerror = function () {
|
||||
alert("Error");
|
||||
}
|
||||
xdr.open("GET", url);
|
||||
xdr.send();
|
||||
}
|
||||
|
||||
function addOption(selectbox, text, value) {
|
||||
var o = document.createElement("OPTION");
|
||||
o.text = text;
|
||||
o.value = value;
|
||||
selectbox.options.add(o);
|
||||
}
|
||||
|
||||
function getL() {
|
||||
return document.getElementById('l');
|
||||
}
|
||||
|
||||
function getUp() {
|
||||
return document.getElementById('up');
|
||||
}
|
||||
|
||||
function getDown() {
|
||||
return document.getElementById('down');
|
||||
}
|
||||
|
||||
function maquina() {
|
||||
refreshFacts();
|
||||
}
|
||||
|
||||
function refreshFacts() {
|
||||
var l = getL();
|
||||
var xdr = gxr();
|
||||
xdr.onload = function () {
|
||||
jsonData = JSON.parse(xdr.responseText);
|
||||
var len = jsonData.length;
|
||||
for (i = 0; i < len; i++) {
|
||||
var o = document.createElement("OPTION");
|
||||
s = jsonData;
|
||||
o.text = s[i].Species_No;
|
||||
o.value = s[i].Species_No;
|
||||
l.options.add(o);
|
||||
}
|
||||
if (l.length > 0) {
|
||||
l.selectedIndex = 0;
|
||||
}
|
||||
selectionChange();
|
||||
}
|
||||
xdr.onerror = function () {
|
||||
alert("Error");
|
||||
}
|
||||
xdr.open('GET', 'http://localhost:8080/root/Biolife');
|
||||
xdr.send();
|
||||
}
|
||||
|
||||
function setInnerText(id, s) {
|
||||
var e = document.getElementById(id);
|
||||
if (e != null) {
|
||||
e.innerHTML = s;
|
||||
}
|
||||
}
|
||||
|
||||
function roundNumber(num, dec) {
|
||||
var result = Math.round(num * Math.pow(10, dec)) / Math.pow(10, dec);
|
||||
return result;
|
||||
}
|
||||
|
||||
function selectionChange() {
|
||||
var l = getL();
|
||||
getUp().disabled = (l.length == 0) || (l.selectedIndex == 0);
|
||||
getDown().disabled = (l.length == 0) || (l.selectedIndex == l.length - 1);
|
||||
var key = l.value;
|
||||
var notas = function () {
|
||||
var xdr = gxr();
|
||||
xdr.onload = function () {
|
||||
jsonData = JSON.parse(xdr.responseText);
|
||||
setInnerText('memo', jsonData.Notes);
|
||||
setInnerText('about', 'About the ' + jsonData.Common_Name);
|
||||
setInnerText('picturecaption', jsonData.Common_Name);
|
||||
setInnerText('category', jsonData.Category);
|
||||
setInnerText('species', jsonData.Species_Name);
|
||||
setInnerText('lengthcm', roundNumber(jsonData.Length_cm, 2));
|
||||
setInnerText('lengthin', roundNumber(jsonData.Length_In, 2));
|
||||
img = document.getElementById('image');
|
||||
if (img != null) {
|
||||
img.src = 'http://localhost:8080/root/Biolife/' + key + '/Graphic';
|
||||
}
|
||||
}
|
||||
xdr.onerror = function () {
|
||||
alert("Error");
|
||||
}
|
||||
xdr.open('GET', 'http://localhost:8080/root/Biolife/' + key);
|
||||
xdr.send();
|
||||
}
|
||||
notas();
|
||||
}
|
||||
|
||||
function onSelectionChange() {
|
||||
selectionChange();
|
||||
}
|
||||
|
||||
function up() {
|
||||
var l = getL();
|
||||
if (l.selectedIndex > 0) {
|
||||
l.selectedIndex--;
|
||||
selectionChange();
|
||||
}
|
||||
}
|
||||
|
||||
function down() {
|
||||
var l = getL();
|
||||
if (l.selectedIndex < l.length - 1) {
|
||||
l.selectedIndex++;
|
||||
selectionChange();
|
||||
}
|
||||
}
|
||||
|
||||
function onUp() {
|
||||
up();
|
||||
}
|
||||
|
||||
function onDown() {
|
||||
down();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="maquina()">
|
||||
<img src="images/fishfacts.jpg" width="80%" /></br></br>
|
||||
<div id="contentdiv" class="contentdiv">
|
||||
<div class="outerTableDiv">
|
||||
<table class="outerTable">
|
||||
<tr>
|
||||
<td class="innertable" style="width:100%">
|
||||
<table class="innerTable">
|
||||
<tr>
|
||||
<td class="innertable" style="width: 50%">
|
||||
<div class="divpadding">
|
||||
<table id="fishimageandtitle" class="innerTable">
|
||||
<tr>
|
||||
<td class="innertable">
|
||||
<div class="imagediv">
|
||||
<img id="image" alt="" xstyle="width:100%;background-color:blue"/>
|
||||
</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="captiondiv"><span id="picturecaption" class="fishname" >Clown Triggerfish</span>
|
||||
</div></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div></td>
|
||||
<td class="innertable">
|
||||
<div class="divpadding">
|
||||
<table class="innerTable">
|
||||
<tr>
|
||||
<td>
|
||||
<div class="captiondiv"><span id="about" class="aboutText">About goes here</span>
|
||||
</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="innertable">
|
||||
<div id="memo" class="memoDiv"> Details go here </div></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="innertable" colspan="2">
|
||||
<table class="innertable">
|
||||
<tr>
|
||||
<td>
|
||||
<table class="innertable">
|
||||
<tr>
|
||||
<td>
|
||||
<table class="detailstable">
|
||||
<tr>
|
||||
<th class="detailstable">Category</th>
|
||||
<th class="detailstable">Species Name</th>
|
||||
<th class="detailstable">Length(cm)</th>
|
||||
<th class="detailstable" style="width:100%">Length(in)</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="detailstable"><span id="category"></span></td>
|
||||
<td class="detailstable"><span id="species"></span></td>
|
||||
<td class="detailstable" style="text-align: right"><span id="lengthcm"></span></td>
|
||||
<td class="detailstable" style="width:100%; text-align:right"><span id="lengthin"></span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
<td class ="innertable" style="width:3em">
|
||||
<table class="innertable" >
|
||||
<tr>
|
||||
<td><button id="up" class="btnUp" style="width:2em;height:2.5em;padding-top:.1em" onclick="onUp();">^</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><button id="down" class="btnDown"style="width:2em;height:2.5em" onclick="onDown();">v</button></td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
</table></td>
|
||||
<td class="innertable" style="WIDTH: 0%">
|
||||
<table class="innerTable">
|
||||
<tr>
|
||||
<td class="innerTable"><select id="l" onchange="onSelectionChange()" size="4" style="border-style: none; width: 100%; height: 100%"></select></td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
4
contrib/mORMot/SQLite3/Samples/19 - AJAX ExtJS FishFacts/html5/jquery.min.js
vendored
Normal file
4
contrib/mORMot/SQLite3/Samples/19 - AJAX ExtJS FishFacts/html5/jquery.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user