Web Form Builder

Labels
AJAX(112) Apple(1) Application Builder(244) Application Factory(207) ASP.NET(95) ASP.NET 3.5(45) ASP.NET Code Generator(72) ASP.NET Membership(28) Azure(18) Barcode(2) Barcodes(3) BLOB(18) Business Rules(1) Business Rules/Logic(140) BYOD(13) Caching(2) Calendar(5) Charts(29) Cloud(14) Cloud On Time(2) Cloud On Time for Windows 7(2) Code Generator(54) Collaboration(11) command line(1) Conflict Detection(1) Content Management System(11) COT Tools for Excel(26) CRUD(1) Custom Actions(1) Data Aquarium Framework(122) Data Sheet(9) Data Sources(22) Database Lookups(50) Deployment(22) Designer(177) Device(1) DotNetNuke(12) EASE(20) Email(6) Features(99) Firebird(1) Form Builder(14) Globalization and Localization(6) How To(1) Hypermedia(2) Inline Editing(1) Installation(4) JavaScript(20) Kiosk(1) Low Code(3) Mac(1) Many-To-Many(4) Maps(6) Master/Detail(36) Microservices(4) Mobile(63) Mode Builder(3) Model Builder(3) MySQL(10) Native Apps(5) News(17) OAuth(7) OAuth Scopes(1) OAuth2(10) Offline(19) Offline Apps(4) Offline Sync(5) Oracle(10) PKCE(2) PostgreSQL(2) PWA(2) QR codes(2) Rapid Application Development(5) Reading Pane(2) Release Notes(168) Reports(48) REST(28) RESTful(26) RESTful Workshop(15) RFID tags(1) SaaS(7) Security(77) SharePoint(12) SPA(6) SQL Anywhere(3) SQL Server(26) Stored Procedure(4) Teamwork(15) Tips and Tricks(84) Tools for Excel(2) Touch UI(93) Transactions(5) Tutorials(183) Universal Windows Platform(3) User Interface(335) Video Tutorial(37) Web 2.0(100) Web App Generator(101) Web Application Generator(607) Web Form Builder(40) Web.Config(9) Workflow(28)
Archive
Blog
Web Form Builder
Monday, January 2, 2023PrintSubscribe
Offline Sync 2.0

We are pleased to announce that the next generation of Offline Sync Add-On is now available.

The “magical” software component turning online apps into offline apps was first made available in November of 2019. The only way to experience the offline mode was through the Cloud On Time native application for a particular mobile operating system.

The second generation of the add-on brings the offline mode to any browser implementing the ServiceWorker, Cache, and IndexedDB APIs. That includes all major browsers on all mobile platforms. Now you can build the offline-first apps that work on any device powered by any operating system. The recently introduced native app installation capability improves the user experience and transparently delivers the true “always offline” mode.

The add-on licensing has been greatly simplified to meet the needs of our customers.

Only Code On Time makes it possible to build an app that works both in online and offline modes.

An app created with Code On Time can work both in the online and in the offline modes. The latter requires the Offline Sync added to the app configuration. Users with the "Offline" role will have the app front-end and data downloaded into the WebView storage upon sign in. Offline users must explicitly sync the pending changes with the application on the server. Offline Sync works in the browsers and in the installed apps.
An app created with Code On Time can work both in the online and in the offline modes. The latter requires the Offline Sync added to the app configuration. Users with the "Offline" role will have the app front-end and data downloaded into the WebView storage upon sign in. Offline users must explicitly sync the pending changes with the application on the server. Offline Sync works in the browsers and in the installed apps.

Sunday, June 20, 2021PrintSubscribe
Drawing Pad

Taking photos in business apps often requires the visual annotation of the image. Another common scenario is sketching on the pre-defined template. Touch UI provides a built-in drawing pad that works seamlessly with the BLOB fields of your app. The feature is enabled by default and can be activated with a tap on the “Draw” button.


The drawing pad will be immediately displayed in fullscreen mode in response to the tap. It offers several tools: pen, highlighter, blur, and eraser with multiple levels of undo and redo. You can draw with a finger or a stylus compatible with the touch-screen device. Mouse pointers will also work. 

The “pen” and “highlighter” will impact the image as one would expect. The “blur” tool will blur the image contents. The “eraser” will remove the effect of the other tools.


Developers can handle the blobdrawtoolbox.app event triggered on the document and override the available tools and their properties such as the width of the stroke and the color choices. The toolbox property of the event provides access to the default tool configuration.

The drawing is composed of multiple layers. Saving of the drawing will compose the final image that will be submitted to the server when the data record is saved. The end user can perform multiple sessions of drawing prior to the submission since the layers remain preserved until the record has been saved.


Sketching on the template will require a default image to be provided. Create a custom script to handle the getdefaultblob.app event. The field property will indicate the name of the blob field that does not have a value. If e.blob.url or e.blob.icon properties are assigned in the event handler, then the corresponding image will be downloaded or a material icon will be drawn.


For example, the following handler will cause the framework to create a blue material icon for the category picture in the application.


The default image based on an icon may serve as a blob stub whenever the optional image is required. The end user may tap on the image and have it replaced with their by either taking a photo on the device or choosing a previously created image.



Tapping on the default blob image will always activate the drawing pad if the BLOB data field is tagged as image-user-defined-none. The end user will not be able to replace the template image.

The end users may take real-world photos and provide the visual comments with the drawing pad tools. Keep in mind that the huge photographs taken by modern day cameras will likely be redundant for business purposes. Make sure to specify the image-size-WxH tag to engage the image preprocessor to enforce the pre-defined image photo size and graphical annotations. 


Drawing pad provides a powerful tool for the line-of-business apps. Naturally it may not always be desirable to allow image alteration. Tag the blob data field as image-editor-none to disable the drawing pad.


By default the blob images are rendered as thumbnails. Tag the data fields as image-original-always if the original image must be displayed both when the users are viewing and editing the data. The field with the tag image-original-editing will show the original image if the blob is presented in the “edit” mode. End users may still download the original image when viewing the record.


The drawing pad will work on the small devices, tablets, and huge desktop monitors.
Monday, October 14, 2019PrintSubscribe
Announcing Offline Sync Add-On
Code On Time is pleased to announce Offline Sync Add-On!  This new product converts your online application into an offline app capable of running in disconnected mode on tablets, phones, and laptops. Simply enable the add-on in the project and mark a few pages as “offline”. This is it!


The application shown in the next screen shot has been rapidly constructed with Code On Time app generator.


End users can access this app in any modern web browser on a device with Wi-Fi and Cellular connectivity.

What if your end users do not have a robust network connection? Offline Sync is the answer!

Enable the add-on in the Settings | Features of the projects.


Click Finish and activate Project Designer

Select a data page that will be available in disconnected / offline mode. Enable “Offline” checkbox and save the page. Repeat as needed.

Exit designer and proceed to generate the app. 

Copy the URL of the app in the web browser.

Install Cloud On Time app from the App Store of your mobile device. This app is available for  iOS, Mac OS, Windows, and Android (November 2017).

Start the app on the device. Cloud On Time app looks virtually the same on all platforms.


Tap the Connect button, paste the application URL in the input and press Save. 


Tap OK and Cloud On Time will load your online application in the hosted web view. 

Cloud On Time will proceed to install the front end of your application as soon as you sign in. The front end is composed on HTML pages, JavaScript, CSS, and Fonts. The front end files are transferred from the online application to the device.



This will be followed by downloading of data linked to “offline” pages. Offline Sync will follow the discovered data relationships and transfer the relevant records. User identity and application access control rules will limit the number of records. Downloaded information is persisted in JSON format on the device next to the front end files.


Your application is now running on the mobile device in hosted web view.


The cloud icon with a checkmark is displayed next to the user avatar indicating that the user is working in offline mode. The availability of network connection is irrelevant since Offline Sync is executing all data requests directly on the device.


If data is changed then Offline Sync executes the requests to update, insert, and delete records directly on the JSON copy of data while storing the requests in the log file. The cloud icon will change to indicate that the synchronization with the cloud is required.


End user can work with the app for extended period of time, close the app and restart the device as needed. The changes are safely persisted on the device. If the application on the server is down then this fact will have no impact on the “offline” users.

A tap on the cloud icon will activate synchronization. This process does require a network connection and the application on the server to be running.


If the user taps on Synchronize button, then the log of changes is submitted to the application on the server for execution. Errors are returned to the device for user review and reconciliation. 

If the synchronization was successful and “Refresh Data” checkbox is not selected, then the log of changes on the device is cleared and the data on the device is considered to be “in-sync”. It means that the local data does not reflect the true state of the database on the server. 

If the user elects to refresh data, then the successful sync is followed by synchronization of the front end files and downloading of the complete dataset from the server. Once again the data will be limited to those records that the user can access as defined by application access control rules.

The pricing for Offline Sync starts at $9 USD per device per month. See the license agreement and pricing examples at https://codeontime.com/documents/offlinesync-eula.pdf


Code On Time will begin shipping purchased licenses on October 18, 2019. Links to download the software will be delivered via email. The automated distribution system for Offline Sync Add-On will be launched later this year.

Offline Sync Add-On relies on the Offline Data Processor (ODP) included in the framework of applications created with Code On Time app generator. ODP does not require licensing and enables the exciting new feature Transaction Data Input in both offline and online applications. 

If at least one Data View field is included in the form used to create new records, then the end user will be able to enter child data rows along with the master on the pages marked as “offline”. ODP accumulates new child records on the client and submits them alone with the master in a single transaction when the master record is saved.



Watch this cool feature in action at https://www.youtube.com/watch?v=szwlCLSS2JI&list=PLy2g3SjvDe2b2cl9i0msBaMVLntQucZtb&index=37&t=0s.

Offline Sync Add-On and Offline Data Processor are compatible with Code On Time v8.9.0.0 and up.