Ukázka kompletního kódu

Příklad HTML kódu s předdefinovanými JavaScript komponentami:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en-US">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>
FlexBook Examples
</title>
<!-- FlexBook JavaScripts -->
<script src="https://www.flexbook.cz/jq/jquery.js"></script>
<script src="https://www.flexbook.cz/flbv2.js"></script>
<!-- Integrator's custom CSS -->
<link rel="stylesheet" type="text/css" href="example.css" />
</head>
<body>
<h1><a href="index.html">FlexBook Examples<a></h1>
<i> Simple examples of predefined FlexBook JavaScript components</i>
<h2>User Profile</h2>
<div id="flexbook_profile"></div>
<br>
<h2>List of all resources</h2>
<div id="flexbook_resource_list"></div>
<h2>List of all events</h2>
<div id="flexbook_event_list" style="overflow-y:scroll; height:250px;"></div>
<br>
<h2>List of events with tag 'package'</h2>
<div id="flexbook_event_list_packages"></div>
<br>
<h2>Resource detail of resource with ID 7</h2>
<div id="flexbook_resource_detail_1"></div>
<h2>Calendar of resource with ID 7</h2>
<div id="flexbook_resource_calendar_1"></div>
<h2>Calendar of resources with ID 577 and 578 focused to date 2016-11-02</h2>
<div id="flexbook_resource_calendar_2"></div>
<h2>Vertical calendar of resources with ID 577 and 578 focused to date 2016-11-02</h2>
<div id="flexbook_resource_calendar_3"></div>
<script>
flbInit('https://www.flexbook.cz/ajax.php',4, [
{
type: 'flbProfile',
placeHolder: 'flexbook_profile',
params: {
language: 'en',
buttons: ['login','logout','profile','password','reservation','registration','credit','sendPassword'],
checkAttributeMandatory: 1,
externalAccount: 1,
extraDiv: 1,
},
},
{
type: 'flbResourceList',
placeHolder: 'flexbook_resource_list',
},
{
type: 'flbEventList',
placeHolder: 'flexbook_event_list',
},
{
type: 'flbEventList',
placeHolder: 'flexbook_event_list_packages',
params: {
tag: ['package'],
}
},
{
type: 'flbResourceDetail',
placeHolder: 'flexbook_resource_detail_1',
params: {
resourceId: 7,
}
},
{
type: 'flbResourceCalendar',
placeHolder: 'flexbook_resource_calendar_1',
params: {
resourceId: 7,
render: ['reservation','occupied','event'],
renderText: ['legend','name','description','price'],
}
},
{
type: 'flbResourceCalendar',
placeHolder: 'flexbook_resource_calendar_2',
params: {
resourceId: [577,578],
dateStart: '2016-11-02',
resourceLabel: 'Stolky',
resourceWidth: 100,
slotWidth: 100,
}
},
{
type: 'flbResourceCalendar',
placeHolder: 'flexbook_resource_calendar_3',
params: {
resourceId: [7,535,10],
render: ['reservation','occupied','event'],
viewDirection : 'vertical',
}
},
]);
</script>
</body>
</html>
Otestovaná verze HTML kódu s příklady FlexBookových JavaScript komponent je k dispozici na GitHubu v projektu flexbook-examples na adrese https://github.com/davidpasek/flexbook-examples
Funkční kód je vystaven na adrese http://flexbook.dpasek.com/