Example Code

LabVIEW Website Creator/Editor with HTML5, CSS3 and JS Using LabVIEW

Products and Environment

This section reflects the products and operating system used to create the example.

To download NI software, including the products shown below, visit ni.com/downloads.

    Software

  • LabVIEW

Code and Documents

Attachment

Download All

Overview

This LabVIEW project includes an editor which allows you to edit your html, css and Javascript in real time while watching the edits in a browser screen.

 

 

Description

This application will open, read, edit and close an HTML based website defined by the website information inserted by the user. The website information is inserted bottom right and the top 3 boxes contain the HTML, CSS and Javascript respectively.

 

FrontPanel.JPG

Auto refresh of the web page is possible but is very inefficient since it refreshes the page entirely in a polling fashion. You will also hear the annoying browser click as it refreshes the page.

 

The following is a picture of the main refresh action of the application:

  

Requirements

  • LabVIEW 2012 (or compatible)

 

 

Steps to Implement or Execute Code

  1. Download the .zip file and unzip it.
  2. Open the project and run editor
  3. In default state this will create a website on the desktop which includes the required folder structure and html, css and js files.
  4. You can now edit the 3 top boxes and press refresh (or auto refresh) to view the updates you just inserted.

 Additional Information or References

 VI Block Diagram

Website.JPG

 

**This Document has been updated to meet the current required format for the NI Code Exchange.**

 


Larry Colvin
Associate Principal Engineer
Dyson Technology Ltd.

Example code from the Example Code Exchange in the NI Community is licensed with the MIT license.