HTML5 Builder XE5 Documentation HTML5 Builder documentation includes several guides covering different aspects of the integrated development environment and how to build applications with it:. This is a wiki, so you can to improve the documentation. Don’t hesitate to fix any grammar mistakes you find, use the talk sections to request more detailed documentation about a given topic, or add new pages.

• Html5 Gui Builder

Samples and Examples - PDF and ZIP file downloads Use the and make an enquiry. Regarding material on this page, enquire for:. Web Apps resources, help, advice, for study, learning and development work.

Collaboration in design and origination of Web Apps as teaching aids. Technical Web Apps for remote or mobile workers. For students, teachers, engineers and ego-free programmers. Mobile Web Apps 17 May, 2012 GO-Global ® for Mobile Apps Important for education and industry - GO-Global mobile solutions for iPad and Android. GO-Global enable (bespoke) Windows programs on internet connected Tablet PCs. GO-Global give authorized clients secure Web access to permitted programs and the mobile clients enable interaction including touch-screen operations on 'smartpads', the mobile devices of choice. GO-Global working with low-cost cloud computing and sub-$200 Android pads, for workgroups, school students and many others - Economic solutions for provision of Rapid Web Apps.

Torrent Html5 Builder Tutorial. Check out some samples applications made. Charts and Form builder. Free website templates, free HTML5 templates using. HTML5 Builder XE5 Documentation. HTML5 Builder documentation includes several guides covering different aspects of the integrated development environment and how to. Samples and Examples - PDF and ZIP file downloads. Use the Contact form and make an enquiry. HTML5 Builder is available here from Grey Matter Ltd.

Graphic-1 (click to enlarge) shows WinXP Remote Desktop connection providing full root access to Amazon EC2 Win2K3 micro instance (virtual machine); micro means low I/O performance (details ). Describing operations in terms of a regular Windows Server 2003, GO-Global Windows (GGW) Host 4 software is downloaded to the server and installation program run so as to start Cluster Manager, as shown with EC2 host listed. On the server, the License Service requires license (.lic) file copied to C: Program Files. GO-Global Programs folder and Application Publishing Service generally requires License Service. Both services should run with server restart and this should be done from the EC2 Management Console (right-click the running instance and select Reboot). Graphic-2 (click to enlarge) shows screenshot from Android Tablet PC - GGW Android Client ready to connect to the running instance on EC2. Downloaded this Android app from Google Play after search for GO-Global.

User Name and Password are same as server login. (When instance first created, in EC2 Management Console, right-click and select Get Windows Password). Screenshots from Android Tablet PC - Graphic-3 (click to enlarge) shows GGW Android Client connected and legacy Windows (boat sail design) program opened in the Program Window. Graphic-4 (click to enlarge) shows Android keyboard (with upper row keys added by GGW client) prior to numbers entry. Low-cost Android Tablet PC here is, good to go with GO-Global - remarkable performance. GO-Global system requirements for the device (to run the Android client) are. And there is GO-Global Android Client User Guide (see also the Test Drive).

Important to read the User Guide; for touchscreens it includes details of multi-touch gestures for clicking and double-clicking, right-clicking, dragging, scrolling and using the touch keyboard. There is more about GGW and EC2 Web Standards for Mobile Apps Web standards - HTML5, CSS3, SVG and JavaScript, for mobile users, Web applications development. Apps (Web pages) on mobile devices, using the browser of a (touch enabled) tablet PC, iPad or Android. Trial development - App for Android 4.0.3 (on ZTPad tablet PC shown above) using Android browser plus Firefox 10 and Opera 12.00 browsers for Android (downloaded and installed on ZTPad from Google Play) as alternatives.

Essentially useful - w3schools.com tutorials -,. Mobile App Development with Delphi HTML5 Builder Information -.

Embarcadero web page for HTML5 Builder is;. Embarcadero Documentation is available online for Web Development - RadPHP and HTML5 Builder;. Docs have links to sample apps, and some tutorials and Youtube videos. HTML5 Builder is available from Grey Matter Ltd. Trial Templated Page Design (concept) is to comprise html5 template edited with diagram together with Delphi HTML5 Builder components forming UI that makes diagram changes via Javascript. Design is to utilize a Panel component as a container for the UI controls and the Panel complete with controls is to be embedded in the template.

In Delphi HTML5 Builder, starting point is Client Web Application (Home New Client Web App). Graphic at left (click to enlarge) shows Design view of UI Panel assembled from Standard components; Object Inspector Events refer to Javascript functions in.js file. A component Button is shown selected; pressing Esc selects Panel (button is contained in Panel); pressing Esc from Panel selects Page. Each button property ButtonType is set to btNormal (no form submission); Page properties TemplateEngine and TemplateFilename are left blank. Graphics at right (click to enlarge) show Design Run from IDE in browser of choice.

And Design Source view in browser (right-click, local menu View page source). Graphic at left (click to enlarge) shows CSS in browser - In Design Source, click on (in this example) linechange.php?css=1.

Notionally this is the internal stylesheet. Graphics at right (click to enlarge) - First shows copy of internal stylesheet in CSS file placed in Project folder and opened in IDE. Then, in Design View, style sheet non-visual component (Tool Palette System StyleSheet) with FileName set to (in this example) linechangeext.css.

Notionally this is the external stylesheet for use with template. Graphic at left (click to enlarge) shows Template view. From blank HTML (double-click Templates document), changed to doctype html, added Heading (h3 styled in external stylesheet), added the SVG listing, added the Panel (container of components). The layout as shown relies on the external stylesheet in which the top of the panel is set to position beneath diagram (in the example stylesheet it is the #Page1 #Panel1outer selector that sets absolute position of the panel). Looking at the enlarged view of template, note the tags: This markup mandatory to make built-in templating work for RPCL (Rad PHP Component Library) components. Demo Graphics App (1) Graphic at left (click to enlarge) is screenshot from Android tablet PC with browser opened to start new session and addressed to webapps.me.uk/html5builder/linechange1/linechange1.php. App is a single html5 page, product of Trial Templated Page above.

With Local Save/Recall checked then line (x,y) end-point stored in browser if available on device. Otherwise, storage on server: Web service (, servicelinechange.php) provides SaveData and RecallData functions; username.csv files are written in local directory on server and directory cleared when full (expedient for demo purposes). In Javascript, XMLHttpRequest gets the Web service. Javascript functions are same as listed in Mobile App Development with BlueGriffon below. Demo Graphics App (2) Graphic at left (click to enlarge) is screenshot from Android tablet PC with browser opened to start new session and addressed to webapps.me.uk/html5builder/linechange2/linechange2.php. This App(2) functions same as App(1), same UI, same Javascript. But no Template HTML with inline SVG as in App(1).

Label component is placed on the panel and set to the 300px x 200px size of the graphic. SVG listing is copied (Windows Control-V) into the Label Caption property and diagram is then shown in the Design view. Download Apps (1)and(2) contains source files for LineChange1 and LineChange2 apps. Also servicelinechange.php and program notes. Mobile App Development with BlueGriffon Graphic at left (click to enlarge) shows demo app on Android tablet PC, browser addressed to webapps.me.uk/linechange.html. Functioning of this 'LineChange' app is just to input change of line end-point; purpose is to find way of writing this kind of app for mobile use. Essential is that app works when internet connection is down.

Mobile browser is addressed to open the app (web page), then maybe no requirement to access server except user selects certain actions. In the 'LineChange' app there is selection of server storage and recall of user data, user is informed of failed connection and local store/recall is available on the client. App in Android browser responds to common touch gestures to select (tap), zoom (double-tap, two-finger pinch open or close) and pan (drag finger on screen). Tap to select numbers input fetches the numbers input keyboard and tap to select text input fetches qwerty. The app is a client-side (JavaScript) program run in web browser, not an HTML form submission; calls to web service are made using JavaScript XMLHttpRequest with timeout if internet connection not available.

A listing of the app is here. Download Mobile App Files Download - Zipped files are the app linechange.html (for mobile browser) and the web service for app data storage servicelinechange.php together with zendtest.php in case needed to check out PHP5 with Zend Framework on server, and prognotes.txt, lists files and folder in server root, etc., combined HTML5, CSS3, SVG editor, employed for content of this LineChange app, single HTML5 file with inline SVG. BlueGriffon is of proven worth for rapid production of Mobile Web Apps. Graphic at right (click to enlarge) shows app opened in BlueGriffon with inset SVG Edit dialog overlaying Style Properties for selected input element in wysiwyg view. To develop apps, aim is to know where to find information covering all aspects:.

Starting point - BlueGriffon - File New for XHTML5 page. Or File New wizard for HTML 4, XHTML 1, HTML 5, XHTML 5, with selections of doc properties, colors for text and links, background image and settings, page layout etc. And also, File One-click Templates for very many different and effective web pages.

In BlueGriffon - File New HTML5 page Insert HTML5 Element. In Wysiwyg view gives list of available HTML tags. Element selection from list will place tags in Source HTML, after showing dialog to set attributes for each tag as appropriate. See for description of tags, list of attributes for each tag and description of each attribute, with working examples, including markup using the tags. In BlueGriffon, completing markup in Source HTML does produce the Wysiwyg view of the UI. Take the case of positioning a Button on the page, writing into the HTML for correct button type, styling the button and hooking up button press to Javascript function:. Button selected from Insert HTML5 Element, with Name button1 entered in Form Input dialog.

In Wysiwyg view Button displays fully when, in Source view, the button Caption is entered at tags. Button attributes: In Wysiwyg, double-click Button shows Form Input dialog with inputs for.

Setting Type drop-down list to Button means, in this case, button when clicked is for Javascript action, not to submit form-data. Button properties: In Wysiwyg - Toolbar - Click on Set CSS styles shows sheet. Click Button to select. Then make selections from Style Properties where initial selection alerts to enter ID, in this case button1 (ID can be same as Name) - At top of Style Properties, drop-down list styles are applied to element ID, to be written in section. Button size: Without width and height settings, button size is determined by Caption and font settings in General tab of Style Properties.

With width and height settings in Geometry tab, button size is determined with settings also for Paddings to position Caption on the button, and Margins to effect offsets of button on the page. Button position: Position and Layout tab of Style Properties - With position set Absolute, click on button in Wysiwyg view yields grab handles to size and position button by mouse dragging, and Offsets (top, left) in Position and Layout are adjusted accordingly. Button appearance: In Style Properties, Colors tab has settings for button face and Caption colors and for bit patterns on the button.

The Borders tab, for edges, has settings for Solid etc. Border and border width. And for corners, it is each (rounded) corner radius that can be set, and if, with same style for the four corners, settings are respectively one half the button width and height, then elliptical shape. Button action: Main menu Panels Script Inspector - Add embedded script (+ button in footer) - Script editor - Edit Javascript function(s) to respond to button clicks etc.

Click Commit changes so as to write script in Source. Then in Source view, add to button tag the event onclick=' JavascriptFunction'.

Events are listed and; these w3schools.com references do mostly each have link to 'Definition and Usage', useful for HTML syntax and elements that events can/cannot be used with. Here is BlueGriffon (x)html listing - Copy to Notepad, save and rename with.html extension and click file name to run in browser. Source code and program notes.

NetBeans and Java Web Start 27 Jul, 2011 Sample Project Start with installation of Java Development Kit, at time of writing, JDK 6 Update 26 with NetBeans 7.0; download current version for Windows on. Starting out is facilitated by completing sample project CelsiusConverter, detailed illustrated procedure described. First steps, taken from the project description, to create New Project, as applied to current NetBeans IDE:. File New Project: New Project Dialog;.

New Project Dialog: Category Java. Project Java Application;. New Project Dialog, Next: Set Project Name, Project Location (default), Uncheck Create Main Class, Check Set as Main Project;.

Click Finish to initiate Creating New Project. See empty project loaded in IDE;. Projects pane right-click project name (CelsiusConverterProject) Local menu, New JFrame Form Class Name ((CelsiusConverterGUI), Package Name (any name);. Click Finish to see opened Form with Source and Design buttons in tool bar.

Graphic-1 at left (click to enlarge) shows NetBeans IDE with design area display of CelsiusConverterProject GUI comprising Swing Windows Frame and Swing Controls Text Frame, Button and Labels. Controls are dragged from Palette and Propeties set as in project description (ref above). Graphic-2 at left (click to enlarge) shows method added in response to Button press (in Design area, right-click button, select Event Action actionPerformed). And the sample app Celsius Converter is shown running locally (Run Run Main Project). Project using Java Web Start Generally applicable instructions to generate project files for Java Web Start are referenced under heading 'Configuring Project to Enable Java Web Start'. Project Properties dialog (Projects pane, right-click project name, click Properties) shown in graphic-3 at left (click to enlarge), some differences between this current IDE and graphic shown in reference. In Project Properties dialog:.

Html5 Gui Builder

Categories - Web Start;. Enable Web Start - checked;. Codebase - User defined (HTTP deployment);. Codebase Preview - E.g.,.

Customize button - Self-sign;. Click OK to close dialog. Projects pane - Right-click project name, set as Main Project. Main menu - Run Clean and Build Main Project. Graphic-4 at left (click to enlarge). Go to project files dist folder and see files to be copied locally, or uploaded, to server. Server for Java Web Start Oracle 'Setting Up the Web Site' refers to configuring Web server so.jnlp files are set to application/x-java-jnlp-file MIME type.

Guidance from 1and1.co.uk, for Windows 2008 Hosting is, and for Linux Packages is - refers to writing.htaccess file - command would be: AddType application/x-java-jnlp-file.jnlp. This to ensure file is fetched as an executable, not as a text file. Ready to run. Graphic-6 at left (click to enlarge) shows project files copied to IIS on local machine and application launched. For any client machine, requirement is to have installed so as to call Web Start apps from any web browser. Try the Graphical Triangle Calculator (demo app).

NetBeans IDE - Java Web Start - Graphical Triangle Calculator Shown in Graphic-6 above. Partly developed app to explore interactive graphics in NetBeans IDE 7.0.

Source code, TriangleAppGUI.java, with comments, is shown in Graphic-7 at left and Graphic-8 shows the Design view (click graphics to enlarge, arrow keys to index). NetBeansTriangleApp project folder - Download Zip file, unzip to any location and open in NetBeans IDE (File Open Project Project Folder). See Graphic-1 above.

Expand Projects tree and double-click, in this project, TriangleAppGUI.java. Press F6 to run the application locally.

Follow procedure under to get distribution files. Ensure users of the web app do have installed on their device. References. Joomla Websites 23 Jan, 2011 To be looked at - latest Joomla out-of-the-box CMS and incorporating web applications - Legacy Programming 23 Jan, 2011 Under construction - Legacy programming is set of design and manufacture programs for types of boat sails with mulit-radius spherical shaping of sails. (Probably long since redundant, now with manufacture at China Sail Factory). Library of spherical geometry functions is of interest.

More so is numerical solution of equations developed for the programs. Hope to resurrect some useful stuff. Contact form Use contact form here to make any request, enquiry, citicism etc. Purpose is to make contact with all interested in any of the WebApps material on this site, or other WebApps stuff, so as to aid teaching, help learning, provide solutions. Background to this is software and engineering on this site focused on problem solving and computer solutions.

Send the contact form - let us know any requirements for teaching, for learning, for (technical) solutions. Downloads and Links 15 Feb, 2013 Notes. Downloads of source files - Delphi for PHP, RadPHP, HTML5 Builder - Generally require component library files available in separate downloads under 'Delphi PHP Programming' below. Download material here is all to do with demo software, as guidance for development work, responsibility of the user. Downloads are logged, including IP addresses for recognition. Email addresses (in Contact Form) are not logged, just used for replies. Zip file - All folders and files - Demo of HTML5 Builder jQueryMobile - Collapsible set with Lists.

Zip file - All folders and files - Geometry App demo of HTML5 Builder and SVG Zip file - All source and program notes for opinion survey mobile app Zip file - All source and program notes for workgroup calendar app Zip file - HTML app and web service for AJAX version of Unit Conversions Zip file - All source and program notes for LineChange1 and LineChange2 apps Zip file - BlueGriffon produced HTML5. Zip files include program notes and desktop client.exe - Demo PHP uses Zend REST Server and Client. Delphi (Win32) client works with same PHP web server. PHP clients (one using Xajax) for Abbreviations.com REST services. PHP5 code - requires no built-in extensions. Zip file with program notes. PHP client for worldweatheronline.com REST Weather API.

PHP5 code - requires no built-in extensions. Zip file with program notes. PDF's in support of learning. PDF Marco Cantu. UK schools exams board (AQA) recommended website. UK schools exams board (AQA) recommended websites. PDF Marco Cantu.

PDF's from Borland Delphi 7 Companion Tools CD By Marco Cantu - eBook PDF (1000+ pages) By Marco Cantu - 250 page pdf. Comprehensive Delphi coverage, essential stuff (?) By Marco Cantu - 400 page pdf. All to do with new stuff in Delphi 2009: Unicode strings, Generics, Anonymous Methods (big business methods). Atozed software, 143 page pdf, year 2004 copy (only available) - For latest online, download from www.atozedsoftware.com/IntraWeb/Documentation/Index.EN.aspx ZIP file - D2009 Pro source code for standalone IW app (used for EC2 trial). Includes compiled IWTriangleApp.exe (IW server). Includes IW app program notes PDF.

PDF Notes to accompany IntraWeb Triangle App Source ZIP file - Delphi (D2009) project file (all source files) and program notes - Demo event-driven motion of building elevator, modeled using Delphi advanced Records as real-world objects. Zip file - Windows installer ggwpe.exe and graphongg4personaledpr18oct10.pdf ZIP file - Gives PHP files for D4PHP programs to work with upgraded Xajax (not Delphi built-in version) enabling Javascript execution upon ajax calls returning results from server. Library files and folders from C: Program Files Embarcadero HTML5 Builder 5.0 rpcl - RPCL folder to be placed in root directory of server. See under heading.

Library files and folders from C: Program Files CodeGear Delphi for PHP 2.0 vcl - VCL folder to be placed in root directory of server. See under heading. Zip file - Shows web page with small Web app (UK lottery numbers) as part of content. Zip file - D4PHP Basic Authentication source files and program notes. Zip file - Access control with PEAR - All source files, with password file and program notes. Zip file - Password protection with ZEND - All source files, with password file and program notes. Zip file - Web page content management using InnovaStudio Fast Editor.

PDF - Delphi for PHP 1.0 from CodeGear (2007). PDF - Delphi for PHP 2.0 from Embarcadero (2009). All up-front features of new version. PDF - More then 700 pages quality content.

Zip file - Twelve chapters, three appendices and illustrated throughout - Copious SVG content from learnsvg.com Zip file - SVG Tutorials 1, 2 & 3 for IE7+. Latest updates - Go to learnsvg.com/tutorials/index.php Zip file - Web app with D4PHP VCL controls (edit boxes, buttons etc.) in one frame and SVG diagram, responding to controls, in other frame. Zip file includes PDF's detailing the app and covering scheme for mapping screen coordinates. Zip files - PHP SVG Catenary App, similar to EggShape but using Xajax.

And source files to act as template for D4PHP SVG Web apps using Xajax. SVG & Javascript Zip file - Demo SVG GUI components from carto.net with potential to build interactive client-side Web apps. Zip file - SVG diagram (slider-crank mech) - Javascript runs loop successively changing position coords. Zip file - Xara (.xar) drawing file with Xara SVG exported (.svg) file MS Silverlight Zip file includes prognotes.rtf - Uses Xajax to return calculated coords from server, in response to user inputs, and, on return, to invoke Javascript to modify Silverlight diagram. Java Web Start Zip file contains project folder to open in NetBeans IDE 7.0.

Run app locally and distribute app for Java Web Start. Free eBooks - Computing Essentially useful - includes Delphi, Pascal, Java, JavaScript, PHP. Looks good for Java, C#, XML, MySQL, JavaScript Unzip to some folder and open index.html in browser.