Raspberry PI: Bottlepy and Twitter Bootstrap

I have been using my Raspberry Pi for the last few months quite a lot. I am currently working on a temperature/environment monitor that logs temperature, using a DS18B20, and light conditions using an optical sensor. I also have two LED’s and two buttons to test basic input and output.
I am developing the application in python using the BottlePy framework. I chose the BottlePy framework as it is a single file that you add, it is very small and it works with Python 3. To control my GPIO’s, I am using the Quick2Wire library. To display the temperature data, I am using Google Charts.

This is a picture of the main temperature logging page so far.
However, the purpose of this post is to show how to integrate BottlePy and Bootstrap by Twitter. According to their website, Bootstrap is a “Sleek, intuitive, and powerful front-end framework for faster and easier web development.”
To display this, I am going to use my GPIO code which reads buttons and turns on LED’s through a webpage. 

To start off we need python file that will run as the server. Below is a snippet of code. The @route shows that this particular function will be run when /gpio us entered into the browser. The webpage is broken up into four sections. The first controls LED 1, the second controls LED 2, the third gets the state of both buttons and light sensor and then the fourth runs a .c file to flash the LED’s.
Now we need to have a look at the html code that creates the webpage. By default, Bootstrap works with the user downloading the .css and .js file. These are then statically linked to the html code. When using the BottlePy framework, I haven’t found a way to return a webpage template, AND a static file. Therefore I have found a link where the .css and .js files have been hosted. By using these links, you only have access to the default settings, but they are enough for what I am wanting to do.
You have to link to the .js and .css file and then by using certain classes that have been defined and explained on the Bootstrap website, you can get nice looking buttons, navigation bars, and tables. They have many options to use but these are the three that I used here for my site. 
When a button on the website is pressed, it sends the value back to the python function and the python code will perform the task. With the Flash LED button, the python code calls a .c file that has been compiled and runs when called. 
When requesting the button state, I return hex formatted colours to show the state of the buttons. These the colour in the table. 

The red shows that Button 1 has been pressed, the Green shows that Button 2 is not pressed and the Blue shows that the light level is currently light.
There are many different elements that can be added by using the Bootstrap framework. The documentation is really clear and easy to follow with many examples. 
If you get stuck or need some more explanations give me a shout.
Greg

Raspberry Pi: Using Bottlypy to control GPIO

I have been trying for a few days now to get control over the GPIO pins through a webserver. There are a number of tutorials on the web but having very little web programming experience, I struggled to understand and follow the tutorials. 
After working through a number of examples, and not getting what I want, I came across the bottlepy framework. The tutorial on their website and the todo example show enough ways on how to get data to an html page and how to get data from an HTML page.
I have been super busy at work and also trying to get it to work so haven’t had a chance yet to do a bit of an explanation on what I did.
To download the files I used click here.
You will need to edit your IP address in the index.py file.
Change to the directory on your Raspberry Pi and run $ python3 index.py
In your browser navigate to IPaddress:8080/index then follow the links. Have a look in index.py to see what pins I have used for the inputs and outputs.

Sorry this is so vague but as soon as I get a chance I will update this post with some more explanations.

Greg

LabVIEW: Making a window active

A small issue that I have been trying to resolve is when a LabVIEW application runs and multiple windows are open, the need is often there to bring a window to the front as some stages of the application. 

Now I am sure there are many ways to perform this task, but the easiest and most reliable way that I found is to use the user32.dll that is part of the windows installation. This dll is easily accessed by using Call Library Function Node. This can be found in Connectivity >> Libraries & Executables.


The three methods that are used are FindWindowA, SetForegroundWindow and ShowWindow. By wiring these us and adding the correct window name that you want to bring forward, when the program is run whatever window name is selected will be brought to the front. 

There are many other tasks that can be performed by using the user32.dll. I have used it in a few other places in my programs and will add some more posts in the future of where it can be used.

To download the example VI, use this link.

Greg

Adding source code to Blogger

I have been trying for quite some time to add source code to my blog. Just copying and pasting the code works fine, but there is no proper formatting or colours used in normal source code editors. After browsing the internet and reading many examples, I finally came across this website that helped me get it done.
I have used the SyntaxHighlighter script and from what I have seen, this seems to be the most used method. It supports a number of different programming languages and once set up, very easy to implement.
Please back up your blog before trying this as you need to edit the html template. From your Dashboard, navigate to Template, and then select Edit HTML. A warming will pop up so select Proceed. The HTML template will now be displayed.
Navigate down in the template to find </head>
Copy the code below and paste it above </head>


































Preview your template to ensure that it still looks ok. If all is fine, then save the template and close the editor.
The next step is to make the script work. You do this by using the <pre> and </pre> HTML tag. In between these tags is where you add your code. You also need to specify which script to use depending on what language your source code is in. Here is the example I used to display C# source code.

private void UpdateCounter()

{

if (iCounter.Value < 50000)

{
iCounter.Value++;

{

}
else

iCounter.Value = 1;
}
}
You need to add the tags and code in the HTML editor. Once the source code has been added, then you can go back the the text editor to complete the post.
That’s about it. Once the template has been edited and your set up is correct, adding source code it pretty easy.
Greg

LabVIEW: Event Structure vs While Loop

When I started working with Event Structures in LabVIEW, I wondered what the difference was in terms of CPU usage. In a small program, managing efficiency might not be an issue but in a large testing environment where many processes need to be performed, the need for managing efficiency becomes quite important.
To test the difference in CPU usage between using the standard While Loop, which can get messy very quickly and the Event Structure, I wrote a simple program. The While Loop and Event Structure options are placed in different cases which is selected before the program is run. Both options monitor two buttons, display a message when either button is pressed and has a counter which shows how many times the loop is run.
The Event Structure monitors two buttons and displays a message for each. 
The While Loop also monitors two buttons but as it can be seen from the front panel above, it is quite a bit more messy than the Event Structure. If any more button or inputs need to be monitored, this method can quite easily get out of hand.
Here is the CPU monitor comparison of the two options being run. On the left is the Event Structure only using 5% and on the right is the While Loop which is using 30%. There are ways to slow the While Loop down like adding a loop delay but I wanted to show the extremes.
I hope this helps and can provide some display on the different ways to do a similar process.
To download the example VI, use this link.
Greg