Category: Coding

ESP8826 (12e) Multisensor

We’d set up a prototype multi-sensor with an environment sensing kit that Scott picked up at MicroCenter a few years ago. There’s a little LCD display … but we wanted to report readings back to our OpenHAB server. Which required a network connection. Checking out prices for network cards to add to the Uno … well, it wasn’t a cheap add-on. But we found these ESP8266 modules that support 802.11b/g/n and provide the memory/processing for small programs. At about 3$ delivered, that was exactly what we needed.

I ordered a bunch of components to make multi-sensors – pressure sensors, luminescence sensors, temperature/humidity sensors. The sensors connect into a CP2102 ESP8266. The device is powered by a couple of 18650’s in a little box — another buck. There’s some miscellaneous wiring and a little breadboard, too. The total cost for the multi-sensor is about 8.50$. We could add a vibration sensor for another 0.50$, a PIR sensor for 2$, and a UV sensor for 2.50$. That’s 13.50$ for 7 different sensors — and we don’t need seven sensors everywhere.

I kind of want to make a weather station too — add a water level sensor, a precipitation detector, and a wind speed sensor. Those are surprisingly expensive! I want to check out the process to build your own anemometer. But I’d probably buy a nice Davis Anemometer 🙂

Connecting to a WiFi network with the ESP8266 is really easy:

  • Add a library to the Arduino IDE — In the Arduino IDE preferences, add ‘https://arduino.esp8266.com/stable/package_esp8266com_index.json’ into the ‘Additional Board Managers’ URL, then install the ESP8266 library and select the board. I ordered the CP2102 ESP8266 module, and we’re using “” as the board.
  • Configure the WiFi network connection details in your code
  • Compile
  • Upload
  • You’ve on the network!

We’ve used an MQTT library and send sensor readings to our MQTT server.

 

Composer Hangs

I don’t use composer often, and it generally just works … so I don’t know much about it beyond “another package manager”. But every once in a while, it just hangs. Nothing happening, nothing instructive in strace. Fortunately, composer has several levels of verbosity on the output. While the default output is minimal and offers absolutely no clue that it’s doing something … adding -vvv is a nicely verbose output that lets me see that the package install isn’t actually hung. It’s just going to take a long time.

Scraping Calendar Events

We’ve learned the value of engaging with local government — with few people involved in local proceedings, it’s pretty easy for a generally unpopular proposal to seem reasonable. And then we’re all stuck with the generally unpopular regulation. It is a pain, however, to keep manually adding the next Trustee meeting. And there’s no way I’m checking the website daily to find out about any emergency meetings.

Now I’m pulling the events from their Google calendar and creating new meeting items in my Exchange calendar:

  1. Register the app with Google to use the API
  2. Install exchangelib
  3. Copy config.sample to config.py and add personal information
  4. Create a ca.crt file with the CA signing key for your Exchange server (or remove the custom adapter if your server cert is signed by a public key)
  5. Run getCalendarEvents.py and follow the URL to authorize access to your calendar

I’ve tweaked the script to grab events from the school district’s calendar in SchoolPointe too. Now we know when there’s a school board meeting or dress-up day.

Extracting Waste Stream Collection Dates for the Netherlands

Yeah … mostly saving this for the regex search with a start and end flag that spans newlines because I don’t really need to know the date they collect each waste stream in the Netherlands. Although it’s cool that they’ve got five different waste streams to collect.

import requests
import re

strBaseURL = 'https://afvalkalender.waalre.nl/adres/<some component of your address in the Netherlands>' 
iTimeout = 600 
strHeader = {'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36'}

# Start and end flags for waste stream collection schedule content
START = '<ul id="ophaaldata" class="line">' 
END = '</ul>' 

page = requests.get(strBaseURL, timeout=iTimeout, headers=strHeader)
strContent = page.content
strContent = strContent.decode("utf-8")

result = re.search('{}(.*?){}'.format(START, END), strContent, re.DOTALL)
strCollectionDateSource = result.group(1)

resultWasteStreamData = re.findall('<li>(.*?)</li>', strCollectionDateSource, re.DOTALL)
for strWasteStreamRecord in resultWasteStreamData:
    listWasteStreamRecord = strWasteStreamRecord.split("\n")
    strDate = listWasteStreamRecord[3]
    strWasteType = listWasteStreamRecord[4]
    print("On {}, they collect {}".format(strDate.strip().replace('<i class="date">','').replace('</i>',''), strWasteType.strip().replace('<i>','').replace('</i>','')))

Adding CSS To Header

I am currently working on a website that sources in a header and footer — not an uncommon thing to do as this ensures a consistent look across the site. The lead-in code starts head, closes head, starts body, and defines the common page elements (nav bar, etc). The footer then defines some more common page elements and closes body. This approach creates a problem when you want to add CSS. Now you could use style tags within the HTML, but I would rather not have the same style definition twenty times. Yeah, I’d make a single variable out of it and print the style-definition-variable twenty times … but I’d rather have my CSS sourced in from a style-sheet file.

Since I’m already using jQuery to dynamically append elements — add table rows as data is pulled back from the server — I wondered if you could append something to the header. Yes, you can!

/**
* This function appends a CSS file to the document head
*
* @param {string} strFileName Path to CSS file
* @return n/a
*
* @example
*
* loadCSSStylesheetToHead('/path/to/file.css')
*/
function loadCSSStylesheetToHead(strFileName){
var file = document.createElement("link");
file.setAttribute("rel", "stylesheet");
file.setAttribute("type", "text/css");
file.setAttribute("href", strFileName);
document.head.appendChild(file);
}

This allows me to after-the-fact add css from a style-sheet file into the document head.

Git: Using Soft Reset To Clean Up Un-pushed Commits

I missed a file when I was cleaning up debugging lines. I made the change and included it in a second commit, but I’d rather not have two commits for the same purpose. I hadn’t pushed my changes yet, so these commits only exist on my workstation … which means I can reset and bundle the changes into a single commit.

Find commit number that is one before the duplicate debug logging cleanup — this is the point to which you want to reset. In my case, it is the commit start with b443348c

Reset there with “–soft” — this doesn’t change anything on the file system (i.e. I don’t have to clean up those debug lines again) but puts the changes back into the staging area.

Now those files are staged again, so I can make a single commit for removing debug logging from my code.

Voila! I can push these changes and not clutter our history with my error.

 

Displaying An Image Tooltip

JQuery developers seem to have put a lot of effort into filtering HTML components out of tooltips … which, as someone who visits a website … is A Good Thing. But what’s a good security consideration can be a massive pain when building a website. I have a form which takes an internal ID number, and I have an image showing people how to find that internal ID number. I want a little question mark after the field name that pops up the image as a tooltip on mouseover events. And clears the image on mouseout.

JavaScript:

// Show finding equipment ID image "tooltip" 
$('#ShowEquipmentIDTip').hover(
	function(){
        	$('#FindingEID').css({ "display": "block" });
    	}
	,function(){
        	$('#FindingEID').css({ "display": "none" });
    	}
);
HTML:
<div class="col-md-2 col-sm-2 col-lg-2 col-xs-2 text-left">
	<span><strong>Equipment ID(s): <a id="ShowEquipmentIDTip" href="#">(?)</a></strong></span>
	<div id="FindingEID" style="position: relative;top: 20;left: 60;width: 100%;height: 100%;z-index:99;display:none"><img src="/groomsGenerateCircuitReport/images/Tip-FindingEquipmentID.png" /></div>
</div>

Moving your mouse over the ShowEquipmentIDTip a element displays the div which contains my image “tooltip” and moving the mouse away sets the display back to none.

Shell Script: Path To Script

We occasionally have to re-home our shell scripts, which means updating any static path values used within scripts. It’s quick enough to build a sed script to convert /old/server/path to /new/server/path, but it’s still extra work.

The dirname command works to provide a dynamic path value, provided you use the fully qualified path to run the script … but it fails spectacularly whens someone runs ./scriptFile.sh and you’re trying to use that path in, say, EXTRA_JAVA_OPTS. The “path” is just . — and Java doesn’t have any idea what to do with “-Xbootclasspath/a:./more/path/goes/here.jar”

Voila, realpath gives you the fully qualified file path for /new/server/path/scriptFile.sh, ./scriptFile.sh, or even bash scriptFile.sh … and the dirname of a realpath is the fully qualified path where scriptFile.sh resides:

#!/bin/bash 
DIRNAME=`dirname $(realpath "$0")`
echo ${DIRNAME}

Hopefully next time we’ve got to re-home our batch jobs, it will be a simple scp & sed the old crontab content to use the new paths.

Modifying Shared PHP Function

We needed to modify a shared function to include additional information … but didn’t want to coordinate changing all of the calls to the function as one change. Simplest way to accomplish that was to set a default value for the new parameter — either to NULL and just not do the new thing when the parameter is NULL or some value that indicates that we’re not yet gathering that data.

<?php

function testFunction($strOldParameter, $strNewParameter=NULL){
     echo "The old parameter is |$strOldParameter|\n";
     if($strNewParameter){
          echo "The new parameter is |$strNewParameter|\n";
     }
}

testFunction("first", "second");
testFunction("justFirst");

?>