{"id":1658,"date":"2012-02-16T21:49:40","date_gmt":"2012-02-17T01:49:40","guid":{"rendered":"http:\/\/www.braindeadprojects.com\/blog\/?p=1658"},"modified":"2012-02-16T21:49:40","modified_gmt":"2012-02-17T01:49:40","slug":"midtown-wifi-the-internals","status":"publish","type":"post","link":"http:\/\/www.braindeadprojects.com\/blog\/what\/midtown-wifi-the-internals\/","title":{"rendered":"Midtown Wifi &#8211; the internals."},"content":{"rendered":"<p>In the next few days, I&#8217;ll be upgrading my north facing access point from <a title=\"The Engenius Website\" href=\"http:\/\/www.engeniustech.com\/\" target=\"_blank\">Engenius<\/a> to <a title=\"The Ubiquiti Homepage\" href=\"http:\/\/www.ubnt.com\/\" target=\"_blank\">Ubiquiti<\/a>. The firmware is already written, and I have most everything prepped for the rooftop mount. Before I post about working with the (hidden) Ubiquiti 5.3 SDK, I thought I&#8217;d give a quick tour of my system so far.<\/p>\n<p>With Midtown Wifi I had the following goals:<\/p>\n<ol>\n<li>Work more in the <a title=\"C\" href=\"http:\/\/en.wikipedia.org\/wiki\/C_%28programming_language%29\" target=\"_blank\">C language.<\/a><\/li>\n<li>Build a stable and (mostly) embedded captive portal system with a minimal ToS acceptance screen.<\/li>\n<li>Let the surrounding neighborhood use the Internet for free in exchange for helping me build and test the system.<\/li>\n<li>Use the system as a way to introduce neighbors, let them post local interest items (missing pets, crime reports, events, etc).<\/li>\n<li>Provide maps of recently reported crimes via the Harrisburg, PA online Police Blotter.<\/li>\n<\/ol>\n<p>Over the years I&#8217;ve accomplished all of this, to one degree or another. <a title=\"Harrisburg PA\" href=\"http:\/\/harrisburgpa.gov\/\" target=\"_blank\">Harrisburg, PA<\/a> is in the midst of some serious financial problems, so their online police blotter has gone away\u00a0 &#8211; preventing me from easily obtaining local crime information. People are what they are, and as Google+, MySpace, and any other Social Site knows &#8212; getting people to truly use your social portal is a trick that requires sheer genius. Getting them to log into it and push a &#8220;Free Wifi&#8221; button however, is easy.<\/p>\n<figure id=\"attachment_1659\" aria-describedby=\"caption-attachment-1659\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogin.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1659\" title=\"MidtownWifiLogin\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogin-300x240.png\" alt=\"MidtownWifiLogin\" width=\"300\" height=\"240\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogin-300x240.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogin-1024x819.png 1024w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogin.png 1280w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1659\" class=\"wp-caption-text\">The Midtown Wifi Login Screen (as of Feb 15, 2012)<\/figcaption><\/figure>\n<h3>How it works:<\/h3>\n<p>After connecting to one of the open access points, the end user is redirected (courtesy of a patched <a title=\"NoDogSplash\" href=\"http:\/\/kokoro.ucsd.edu\/nodogsplash\/\" target=\"_blank\">NoDogSplash<\/a>) to a captive web portal. The web portal is based off <a title=\"The Elgg Social Networking Engine\" href=\"http:\/\/www.elgg.org\/\" target=\"_blank\">Elgg<\/a>, a fairly easy to use Social Network Engine written in PHP. I&#8217;ve made a few modifications to the base system, adding a more recent <a title=\"JQuery\" href=\"http:\/\/jquery.com\/\" target=\"_blank\">JQuery<\/a> and <a title=\"JQuery UI\" href=\"http:\/\/jqueryui.com\/\" target=\"_blank\">JQueryUI<\/a> (so that I can create interactive <a title=\"JQuery UI Dialogs\" href=\"http:\/\/jqueryui.com\/demos\/dialog\/\" target=\"_blank\">Dialogs<\/a>), and writing a few plugins to handle <a title=\"Netflow\" href=\"http:\/\/en.wikipedia.org\/wiki\/Netflow\" target=\"_blank\">Netflow<\/a> display, wireless signal strength reports (per user), user speed tests, and to verify that they have a picture set before allowing them to use the Free Wifi.<\/p>\n<p>By nature, people won&#8217;t set a profile picture when all they want is Free Wifi. I had to enforce a profile picture (&#8220;it doesn&#8217;t have to be you, it can be anything non-offensive&#8221;) to make the site NOT appear like a barren wasteland.<\/p>\n<p>I eventually limited account creation strictly to the access points as registrations from outside those IPs were mostly just spam.<\/p>\n<p>After a user creates an account and logs in, they are directed to the &#8220;Dashboard&#8221;, which is a listing of recent posts from any of the users. Most are quick &#8220;Hey you!&#8221;, but sometimes people post something more substantive. When my rear car window was broken, I used the system as a venting forum.<\/p>\n<figure id=\"attachment_1660\" aria-describedby=\"caption-attachment-1660\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiDashboard.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1660\" title=\"MidtownWifiDashboard\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiDashboard-300x240.png\" alt=\"MidtownWifiDashboard\" width=\"300\" height=\"240\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiDashboard-300x240.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiDashboard-1024x819.png 1024w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiDashboard.png 1280w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1660\" class=\"wp-caption-text\">All the names and 1 dirty word have been removed.<\/figcaption><\/figure>\n<p>I&#8217;ve consolidated most of my customizations relative to the wireless users into a single Elgg plugin I named &#8220;TSA Patdown&#8221;. Initially TSA Patdown only verified that a user had a profile image set, but now it does quite a bit more. Every 30 seconds I export <a title=\"RSSI\" href=\"http:\/\/en.wikipedia.org\/wiki\/Received_signal_strength_indication\" target=\"_blank\">Received Signal Strength Indication<\/a> (RSSI) for each client from the\u00a0 Engenius equipment. I collect this information, as well as information from a Javascript based speedtest widget I wrote to get an idea as to what kind of online experience each user is having.<\/p>\n<p>I represent this information to myself on the following menu, with signal bars that I created using <a title=\"Blender\" href=\"http:\/\/www.blender.org\/\" target=\"_blank\">Blender<\/a>:<\/p>\n<figure id=\"attachment_1661\" aria-describedby=\"caption-attachment-1661\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogins.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1661\" title=\"MidtownWifiLogins\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogins-300x240.png\" alt=\"MidtownWifiLogins\" width=\"300\" height=\"240\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogins-300x240.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogins-1024x819.png 1024w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiLogins.png 1280w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1661\" class=\"wp-caption-text\">Signal Strengths, Login times, MAC addresses and more.<\/figcaption><\/figure>\n<p>I can further delve into information on a per-user basis by simply clicking on a name. I can also pull a full neighborhood report, graphing each clients RSSI values as well as their recent speedtest results.<\/p>\n<figure id=\"attachment_1680\" aria-describedby=\"caption-attachment-1680\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSpeedTest.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1680\" title=\"MidtownWifiSpeedTest\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSpeedTest-300x225.png\" alt=\"MidtownWifiSpeedTest\" width=\"300\" height=\"225\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSpeedTest-300x225.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSpeedTest.png 1024w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1680\" class=\"wp-caption-text\">The Javascript Speedtest Widget<\/figcaption><\/figure>\n<p>Being implemented in Javascript, the speedtest results aren&#8217;t the same as you&#8217;d see when visiting a Flash based speedtest. The standard web method of performing such a test is to have the end-user download an image file or two (oftentimes two images simultaneously)- and at random intervals determine how much of the image has been downloaded by that timeframe.\u00a0 With a single image download, it can perform multiple measurements at various intervals and determine available bandwidth much more accurately. Since there&#8217;s additional overhead in the underlying TCP\/IP layers, it appears most tests also add padding to their calculation to make things more accurate.<\/p>\n<figure id=\"attachment_1700\" aria-describedby=\"caption-attachment-1700\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/Speakeasy.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1700\" title=\"Speakeasy\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/Speakeasy-300x265.png\" alt=\"Speakeasy\" width=\"300\" height=\"265\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/Speakeasy-300x265.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/Speakeasy.png 550w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1700\" class=\"wp-caption-text\">Speakeasy Flash based speedtest<\/figcaption><\/figure>\n<p>Flash has methods that will allow for such periodic sampling, Javascript however does not. This makes my Javascript implementation an overall average &#8211; so a report of 900Kbit\/sec can easily represent 1.5Mbit\/sec. (My results are much more akin to what <a title=\"Wireshark\" href=\"http:\/\/www.wireshark.org\/\" target=\"_blank\">Wireshark<\/a> will report as throughput). I do plan to write a Flash based speedtest in the near future.<\/p>\n<figure id=\"attachment_1701\" aria-describedby=\"caption-attachment-1701\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/WiresharkThroughput.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1701\" title=\"WiresharkThroughput\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/WiresharkThroughput-300x218.png\" alt=\"WiresharkThroughput\" width=\"300\" height=\"218\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/WiresharkThroughput-300x218.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/WiresharkThroughput.png 1024w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1701\" class=\"wp-caption-text\">Wireshark measures throughput how I do: Bandwidth \/ (endtime - starttime)<\/figcaption><\/figure>\n<p>In this example, the capture in Wireshark measures the throughput as 21.22Mbit\/sec, nowhere near the 52.37Mbit\/sec rating given by Speakeasy. The recent throughput information is all displayed in the signal screen:<\/p>\n<figure id=\"attachment_1663\" aria-describedby=\"caption-attachment-1663\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSignals.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1663\" title=\"MidtownWifiSignals\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSignals-300x240.png\" alt=\"MidtownWifiSignals\" width=\"300\" height=\"240\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSignals-300x240.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSignals-1024x819.png 1024w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiSignals.png 1280w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1663\" class=\"wp-caption-text\">Can you hear me now? How fast can I talk?<\/figcaption><\/figure>\n<p>The Netflow section of my TSA Patdown plugin details the current traffic flow on the network. This screen updates dynamically as users surf the internet. (I&#8217;ll reiterate my past posts here: The netflow data is only packet endpoints&#8230; basically &#8220;this person called this person at this time&#8221;, but not the actual content of those conversations). I&#8217;ve also added a small port-based protocol disector that colorizes the flows and provides protocol information depending upon the packet you select. If you choose a <a title=\"NetBIOS\" href=\"http:\/\/en.wikipedia.org\/wiki\/NetBIOS\" target=\"_blank\">NetBIOS<\/a> packet, you&#8217;ll get something similar to this:<\/p>\n<figure id=\"attachment_1666\" aria-describedby=\"caption-attachment-1666\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiNetFlow.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1666\" title=\"MidtownWifiNetFlow\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiNetFlow-300x240.png\" alt=\"MidtownWifiNetFlow\" width=\"300\" height=\"240\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiNetFlow-300x240.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiNetFlow-1024x819.png 1024w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiNetFlow.png 1280w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1666\" class=\"wp-caption-text\">Flying by at the speed of light: PACKETS<\/figcaption><\/figure>\n<p>The system monitors for NetBIOS names as well as DHCP hostnames that appear on Midtown Wifi. All of this information comes together to paint an accurate view of the network.<\/p>\n<p>Clicking a Protocol Name (in this instance NetBIOS) will direct you to a <a title=\"This link will implode upon itself.\" href=\"http:\/\/en.wikipedia.org\/wiki\/Wikipedia\" target=\"_blank\">Wikipedia<\/a> article on the protocol and how it works. Unclassified protocols can be classified and colorized with a simple click. You can also specify the URL to load when the protocol name is clicked.<\/p>\n<figure id=\"attachment_1727\" aria-describedby=\"caption-attachment-1727\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiProtocolAssignment1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1727\" title=\"MidtownWifiProtocolAssignment\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiProtocolAssignment1-300x225.png\" alt=\"MidtownWifiProtocolAssignment\" width=\"300\" height=\"225\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiProtocolAssignment1-300x225.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiProtocolAssignment1.png 1024w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1727\" class=\"wp-caption-text\">Pick a transport, a color, a name, a URL - and you&#39;ve defined a protocol<\/figcaption><\/figure>\n<p>The pie charts, RSSI graphs, and throughput graphs are all handled using the PHP <a title=\"JP Graph\" href=\"http:\/\/jpgraph.net\/\" target=\"_blank\">JPGraph libraries<\/a>. In the future, I intend to improve the graphs (there are tendencies for my labels to bleed off-screen or over each other).<\/p>\n<p>The access points share their own ADSL line for bandwidth but maintain individual PPPoE sessions. The wiring in my home needs improvement (the house was built in the 1800&#8217;s, the Cat5 running through the house is obviously not that old but does have some serious issues) . Most of the exterior walls appear to be metal, which does hinder re-running the DSL line a bit.<\/p>\n<p>I recently migrated my home network graphing from <a title=\"NetMRG\" href=\"http:\/\/www.netmrg.net\/\" target=\"_blank\">NetMRG<\/a> to Cacti, and I&#8217;m using <a title=\"The Cacti graphing solution\" href=\"http:\/\/www.cacti.net\/\" target=\"_blank\">Cacti<\/a>&#8216;s (albeit poor) FTP export function to offload graphs pertaining to MidTown Wifi to the captive portal.<\/p>\n<figure id=\"attachment_1693\" aria-describedby=\"caption-attachment-1693\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiGraphs.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-1693\" title=\"MidtownWifiGraphs\" src=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiGraphs-300x225.png\" alt=\"MidtownWifiGraphs\" width=\"300\" height=\"225\" srcset=\"http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiGraphs-300x225.png 300w, http:\/\/www.braindeadprojects.com\/blog\/wp-content\/MidtownWifiGraphs.png 1024w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-1693\" class=\"wp-caption-text\">Graphs that have been imported from Cacti.<\/figcaption><\/figure>\n<p>As you can see in the graphs, the system currently has 175 subscribers. I have deleted the bogus accounts that weren&#8217;t created through the APs. The high number of subscribers is largely the result of transient users (my home is on a major bus line, rental homes in the area turn over somewhat frequently, the local college is blocks away,\u00a0 etc). A couple of users have duplicate accounts having apparently lost their credentials (as is evidenced by a few repeat MAC addresses).<\/p>\n<p>To put the large number into proper perspective:\u00a0 in the last 7 days there were 157 logins by 18 unique users. Unlike myself, most of the users don&#8217;t spend every waking moment on the Internet.<\/p>\n<p>I&#8217;ve covered the access points and the firmware images in a number of previous posts, so I&#8217;ll let them speak for themselves. In the next few days (hopefully not weeks), I&#8217;ll be introducing my first Ubiquiti access point to the system with full details posted then. If you have any thoughts or input, by all means reach me in the comments section.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In the next few days, I&#8217;ll be upgrading my north facing access point from Engenius to Ubiquiti. The firmware is already written, and I have most everything prepped for the rooftop mount. Before I post about working with the (hidden) Ubiquiti 5.3 SDK, I thought I&#8217;d give a quick tour of my system so far. &hellip; <a href=\"http:\/\/www.braindeadprojects.com\/blog\/what\/midtown-wifi-the-internals\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Midtown Wifi &#8211; the internals.<\/span> <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23,25,17,24,1,18],"tags":[],"class_list":["post-1658","post","type-post","status-publish","format-standard","hentry","category-blender","category-c","category-engenius","category-gimp","category-what","category-wireless"],"_links":{"self":[{"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/posts\/1658"}],"collection":[{"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/comments?post=1658"}],"version-history":[{"count":64,"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/posts\/1658\/revisions"}],"predecessor-version":[{"id":1733,"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/posts\/1658\/revisions\/1733"}],"wp:attachment":[{"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/media?parent=1658"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/categories?post=1658"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.braindeadprojects.com\/blog\/wp-json\/wp\/v2\/tags?post=1658"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}