How to Build a SmartCan

One night I was discussing with a friend the progression of smart technology and where it would go next. He mentioned hearing something about a Samsung refrigerator that would keep track of what you had based on an integrated barcode scanner. There was no price recollection or if it had even reached the market but I was sure it would be expensive. I thought that this could be an interesting concept if developed in a cheaper more adaptable way. Thus the SmartCan was born.

Hardware features:

• Should be able to scan UPC barcodes
• Should be able to connect and sync with the cloud
• Should have an app front end

Software features:

• Gives you a list of what you’ve discarded (aka a grocery list)
• Can show you nutritional information
• Show common ingredients in your diet
• Calculate average price per serving you consume
• Recipes based on common ingredients

Hardware parts:

• Arduino Uno
• Arduino barcode scanner
• SparkCore

Software parts:

• parse.com for online database management
• SparkCore web IDE
• Xcode

Hardware Setup

The first step was to wire up all the hardware together. The barcode libraries do not run on the Spark which is the only reason why we need to use the Arduino (I plan on porting the libraries in the future). So we will have the barcode scanner read to the Arduino which will then feed to the Spark who then sends it to the cloud.

Removing the USB cable you can wire directly into the scanner then solder the ground lead. Here is photo showing my end setup. I created a simple case by bending some sheet metal and using a plastic molder to shape a clear cover.

You should now use the SparkCore Getting Started to get your core online and connected to your Wi-Fi. You should also make sure to connect to the same Wi-Fi that your computer is connected to. This will be needed for near future.

Software Setup

Before getting starting you should complete or have already completed a few things:

• Create a Parse account
• Be a registered Apple developer. You have to run this on an actual device in order for the push notifications to work (so yes you have to spend the $99).
• Have your Spark accounts setup

I will also make a few assumptions that you are familiar with (or can easily learn) how to:

• Flash code to your SparkCore
• Setup Apple Push Notifications
• Upload Arduino code
• iOS development

Explaining each of the above could be done in a post by itself. I will give you all the relevant parts but leave it up to you for the base working knowledge.

Overview

The way we will monitor the connects is through a mix of JavaScript and SSE event streams. The progression will be:

Barcode reader  ➔  Arduino ➔  Spark  ➔  Middle man  ➔  Parse  ➔  Push notification  ➔  iPhone

The middle man will be a short bit JavaScript that listens for updates from the SparkCore. When an event is received, it relays that information to Parse. Once Parse is alerted, a push notification is sent using (in this example Apple Push Notification) to an iPhone.

Code:

JavaScript

You can create a simple HTML page and place in the following JavaScript code. You will need to replace the relevant sections with your Parse information.

  <script type="text/javascript">
    
    Parse.initialize(applicationId, javaScriptKey, masterKey);
    
    var deviceID    = "YOURSPARKDEVICEID";
    var accessToken = "YOURSPARKACESSTOKEN";
    var eventSource = new EventSource("https://api.spark.io/v1/devices/" + deviceID + "/events/?access_token=" + accessToken);

    eventSource.addEventListener('open', function(e) {
        console.log("Opened!"); 
        document.getElementById("output").innerHTML = "Event open success";
        },false);

    eventSource.addEventListener('error', function(e) {
        console.log("Errored!"); 
        document.getElementById("output").innerHTML = "Event open error";
        },false);

    eventSource.addEventListener('Uptime', function(e) {

        var parsedData = JSON.parse(e.data);
        
		var BarcodeObject = Parse.Object.extend("Barcode");
   		var barcodeObject = new BarcodeObject();
   		
   		document.getElementById("output").innerHTML = "Saving data to Parse database";
     	
     	barcodeObject.save({barcode: parsedData.data}, {
      		success: function(object) {
       		 	$(".success").show();
     		},
      		error: function(model, error) {
        		$(".error").show();
      		}
    	});
            
    }, false);
  </script>

SparkCore

You can copy and paste this into your Spark IDE and flash to your device.

/*
PROJECT: SmartCan

This application is used to send data (char) received through serial (RX pin) to
a webpage running JavaScript with an open SSE event stream.

Created by Cory Hymel on 6/9/14.
Copyright (c) 2014 Enventys. All rights reserved.
*/

// Buffer to store incoming commands from serial port
String inData;

bool isReadingData;

void setup() {
    delay(1000);

    //RX pin is Serial1, TX would be Serial
    Serial1.begin(9600);
}

/*
Publish a given string to SSE event stream.
@param value The string value to publish
*/
void printValueToServer (String value) {
    Spark.publish("Uptime",value);
}

void loop() {
    
    char recieved;
    
    while (Serial1.available() > 0)
    {
        
        recieved = Serial1.read();
        
        //The reader sends a '\n''j' after each read, so we can just return after we see a 'j'
        if (recieved == 'j') {
            inData = "";
            return;
        }

        // Process message when new line character is recieved
        if (recieved == '\n')
        {
            //Spark.publish("Uptime", inData);
            printValueToServer(inData);
            
            delay(1000);

            inData = ""; // Clear recieved buffer
        }

        //We are getting the barcode so append to inData
        else {
            inData += recieved; 
        }
    }
}

iOS

Your iOS app will receive the push notifications in the didReceiveRemoteNotifications method of the Application Delegate.

- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult result))handler
{
    NSString *upcCode = userInfo[@"barcode"];
    NSLog(@"UPC: %@", upcCode);
}

Now everything should be setup for you start receiving UPC codes into your iOS app. What you do with them from here is up to you! Take a look and see what we did below.

Enventys SmartCan

In order to make the information beneficial to the user and adhere to our software features listed above, we needed to get all the nutritional information for a given UPC code. To find this data we used Factual. Which has over 600,000 UPC codes and all the information we needed. After setting up our account and downloading their SDK, we had all the components to start generating some cool data!

• How much does it cost to patent an idea?
• Prototyping: Different types of prototypes.
• 12 questions to ask when finding a manufacturer.