Monday, June 13, 2016

Login View App Project in Intel XDK - Part 1

This app helps you include support for logging in to proceed with the app. The user will be asked to register his login information before he/she access the app. Intel XDK version 3400 and Windows 10 Professional were used for this post.

Some details of Login View App  are available here:

LoginView_00

Launch Intel XDK and Start a New Project.

The following window with all the templates open.

LoginView-01

Click on Login View App to display this window.


LoginView-02

In the Login View App window choose Standard HTML5.

 
LoginView-03

Click Continue at the bottom right.

In the New Project Name and Location screen that gets displayed provide a name for the project

LoginView-04

Enter a name, herein TestLog and click Create.
The project is successfully created.

LoginView-05

The Intel XDK displays the index.html page as shown.


LoginView-06

It has 4 views under the 'pages' section.
Welcome View
Login View
Register View and the
Main App View

In the DEVELOP tab there is nothing else but the code. There is no DESIGN tab. There are files and folders of the app as shown.


LoginView-07

Click on the EMULATE tab to display the app on the Apple iPhone 6 emulator (probably this was the emulator that was used the last time).


LoginView-08

Click on Register. The Register page opens as shown.

LoginView-09

Enter the details and click Register
The account get created and you get to the start page. This page is empty and you need to start here.

Creating content in the empty page:

In the www folder make a right click to get the drop-down. Create New file,  FirstPage.html (empty for now)

In the Main App View page add the following code after creating the FirstPage.html.

LoginView-10

When you launch the app and enter your login information. The Start page shows up as shown.


Now you can add content to FirstPage.html. I just reused a file from a previous project.


Now when click the link in the start page, the following is displayed. It seems to spawn a local web server at some port.


If you are looking for more technical details you can find it here.

Visit this site for more of Intel XDK Projects http://hodentekMobile.blogspot.com

This app does not store any user information. The registration is therefore useful for one (only one) time registration only. There is no back end database and is illustrative of using forms.





Tuesday, June 7, 2016

Microsoft's new collabortion app, GigJam

GigJam (code name 'Magic Glass") is an app that uses Cortana to coordinate and bring together data from various sources the scattered corporate data, on any of the PC, tablet or Phone. Each piece of data will be avialble on Cards (formatted by the app) and you can add/remove pieces of information on the cards and consolidate and send it over to one or more collaborators.

This information can be:

  • Read only or Editable
  • Synchronous or Asynchronous collaboration
  • Platform neutral being written using standards: HTML5, JavaScript, OAuth and REST
It is conceivable to use and colloborate not only Windows but also Apple and Android devices. The colloboration can take place even in the absence of Windows in the coloborating devices. The nice thing is that you can get away from the PCs and tablets and use just the phone. Truly mobile centric app.

Watch this video:

Friday, June 3, 2016

Arduino 101: Programming with Visual Studio 2015 Community Update 2

 How can I program Arduino 101 board using Visual Studio?

It is not very difficult. You need to use the right tools.
If you rather not use Visual Studio 2015, you could also use the program from Arduino.

But Visual studio does lot more than Arduino Program.

Follow these steps.
Step 1:
First thing you need to have is the correct version (if you follow my advice) of Visual Studio. Get the Visual Studio 2015 Community (What I have is the same but with Update 2).

If you do not have, no problem. Read this post.

Step 2:
For Arduino to work with Visual Studio 2015 Community (VS2015C), you need to install the Arduino Extensions for Visual Studio. A default install of VS2015C does not have the 'hooks' to create a Arduino Project. You will not find it in the 'New Project...' templates.

You need to install the Arduino Extension for Visual Studio 2015. You can get an idea how to do it by following this Swaytorial:

Step 0:
Of course you need to buy the Arduino 101. It is available from many sources. Connect it to computer with a USB cable as shown.



With all of the above in place, it is very easy to run the board from Visual Studio 2015 Community.

Step 3:
 Open Tools menu as shown to access the Extensions and Updates... submenu.

arduino101_Vs15C

The extension immediately brings in the support for Arduino 101.


Start a new project as shown here:

arduino101_Vs15C_000

Provide a name for the project (herein OneZeroOne)and click OK. The project with folders will be created for you as shown.

arduino101_Vs15C_00

In the above image click on the OneZeroOne.ino file. This is the 'sketch' that you will using to interact with the board via your USB drive to which the arduino 101 board is connected. It will be a simple, empty template. You can cut and paste any of the relevant sketches. Herein I have used the same sketch I used here to run the 'Blink' project that makes a LED on the arduino 101 board to flash on and off. It is one of the example applications, something akin to a 'Hello World'.

Here is the sketch used in this post:


arduino101_Vs2015C_02

When you compile and run this program you may get a message like this.

arduino101_Vs2015C_02

You may also get the messages from the serial port as shown as you connect/disconnect or run the program:


arduino101_Vs2015C_04

The arduino extension you added will also add a arduino specific toolbar as shown which makes it easy to work with the board.
arduino101_Vs2015C_05

There are couple of ways to build the program and upload it to the board. Here is one way using the main menu.
arduino101_Vs2015C_06

The result:
 As soon as you upload the second LED on the board starts blinking.

video










Monday, May 30, 2016

Thinfilm solutions for the Internet of Things

Using thinfilms on suitable substrates it is possible to provide a means to communicate with Smart Phones.

Thin Film Electronics ASA (also known as Thinfilm) , a Norwegian company is a leader in the production of thinfilms using near field communication (NFC).

Thinfilm will be participating in the GSMA Innovation City at the Mobile World Congress in Shanghai during June 29-July 1, 2016


Thinfilm has two products,
  • Thinfilm NFC SpeedTap(trademark)
----Connect everyday objects to the Internet of Everything
  • Thinfilm NFC OpenSense(trademark) 
----Thinfilm NFC OpenSense creates a connected “smart package” using printed sensor tags and a smartphone’s Near Field Communications (NFC) capabilities

This will have a large scale market as the Internet of Everything becomes more and more popular with Smart Phones as single source of control.

Watch this video: 

Intel XDK: Controls5: Using the You Tube widget

This post is about the You Tube widget in Intel XDK. A new version has been released:

Release date: May 19 2016
Version:      v3357

Intel XDK Cloud services is undergoing significant changes and it is a recommendation from Intel XDK to use this latest version. A few new features have been added to the DEVELOP tab in the user interface and the rest about bug fixes.

Start a new project using Standard HTML5 choose App Designer 3. The project is named
TestYouTube.

The project is just a bare bones HTML project with the main page, index.html.
However, it has references to these script files and no other content in the body of the index.html:
-------------
cordova.js
js/app.js
js/init-app.js
xdk/init-dev.js 
--------------------------
Add a header (optional) to keep track of your project.

 YouTubeDemo_00

Click on YOUTUBE in the MEDIA folder.


YouTubeDemo_01

Drag it and and drop it on the page in DESIGN view.

It actually drops a iFrame widget (uib_w_2) and provides a default source shown below:
http://www.youtube.com/embed/rryxZjqLtNs


YouTubeDemo_011

What you would see in index.html will be the following:

YouTubeDemo_03

Click on the YouTube widget in MEDIA and click Contextual tab on the bottom pane. You get the complete referencce to the YouTube JavaScript API Reference as shown.

YouTubeDemo_04

 YouTubeDemo_05

The JavaScript API details:

"The JavaScript API allows users to control the YouTube chrome-less or embedded video players via JavaScript. Calls can be made to play, pause, seek to a certain time in a video, set the volume, mute the player, and other useful functions."

The player requires Flash Player 10.1 higher. Read the JavaScript API Reference for more details.

Actually this is all that is needed to launch the app.
Click on emulate to bring up an emulator of your choice.

YouTubeDemo_06

Intel App Preview  which is supposed to bring the app to the device over the Internet is working neither in the Apple Phone iPhone 6 or the Microsoft Lumia 950. It is either broken or has not been updated.

You can add the You Tube video of your choice to the app by substituting your video in the src of the iFrame.

 

Friday, May 27, 2016

Multiboard programming using Johnny-Five robotics and IOT Platform

Arduino boards can be programmed using Arduino software (or in Visual Studio Community using Arduino Extensions) and Intel IOT boards can be programmed using Intel XDK IOT. Using JavaScript to program controllers would be very useful as most browsers are HTML5 compliant. The Johnny-Five Robotics and IOT program is an interesting option.

Johnny-Five is the JavaScript Robotics and; IOT platform released by the Bocoup group. Johnny-Five is maintained by a growing number of talented developers.

What is Bocoup?
Bocoup  is a group that championed the cause of Open tools and WorkFlow. They really seems to have people with very varied and diverse talents to tackle web, data, and visualization.

How does Johnny-Five handle the Hello World (or Blink for that matter)?
It looks like 1-2-3 really.

1. Install Node.js(Preffeer 4.2.1 LTS)
2. Setup your board
3. Run: npm install johnny-five

What else is needed?

You also need to run the Firmata protocol for the controller board to communicate with the computer.
Interestingly Johnny-Five can handle over 30 different arduino compatible boards from the likes of Raspberry, Intel, Arduino, Sparkfun and many more.

This is very impressive indeed as each of these boards are handled by their vendors like Arduino, Intel and others.

How about non-arduino boards?

There are platform specific IO Plugins (for example, Galileo-IO plugin) .These plugins can speak the language of the platform as they implement Firmata compatible interfaces.

You will be hearing more about Johnny-Five in my blogs, here and here, keep reading....

Sunday, May 22, 2016

Arduino 101 : Implementing the basics

Arduino 101 is an electronics board that makes it easy to test out some simple IOT examples. It is not quite ready for IOT but you can do some Bluetooth tests with it. It also has built-in 6-axis accelerometer and gyroscope.  It has 14 digital input/output pins (of which 4 can be used as PWM outputs); 6 analog inputs; an USB connector for serial communication and sketch upload, a power jack, an ICSP header with SPI signals and I2C dedicated pins. These peripherals are the same ones you find on Arduino UNO.  Optionally, the USB connector also supplies power to the board.

This post shows how to work with Arduino 101 using the Arduino 1.8.3 program. You can test using the Blink program; a program that you upload to the board that makes an LED to blink.

Review this Swaytorial on the docs.com site.