BluePic
WARNING: This repository is no longer maintained :warning: This repository will not be updated. The repository will be kept available in read-only mode.
Install / Use
/learn @IBM/BluePicREADME
BluePic
Read this in other languages: 한국어, Português,中国.
WARNING: This repository is no longer maintained :warning:
This repository will not be updated. The repository will be kept available in read-only mode.
BluePic is a photo and image sharing sample application that allows you to take photos and share them with other BluePic users. This sample application demonstrates how to leverage, in a mobile iOS 10 application, a Kitura-based server application written in Swift.
BluePic takes advantage of Swift in a typical iOS client setting, but also on the server-side using the new Swift web framework and HTTP Server, Kitura. An interesting feature of Bluepic, is the way it handles photos on the server. When an image is posted, it's data is recorded in Cloudant and the image binary is stored in Object Storage. From there, a Cloud Functions sequence is invoked causing weather data like temperature and current condition (e.g. sunny, cloudy, etc.) to be calculated based on the location an image was uploaded from. Watson Visual Recognition is also used in the Cloud Functions sequence to analyze the image and extract text tags based on the content of the image. A push notification is finally sent to the user, informing them their image has been processed and now includes weather and tag data.
Swift version
The back-end components (i.e. Kitura-based server and Cloud Functions actions) and the iOS component of the BluePic app work with specific versions of the Swift binaries, see following table:
| Component | Swift Version |
| --- | --- |
| Kitura-based server | 4.0.2 |
| Cloud Functions actions | 3.1.1 |
| iOS App | Xcode 9.1 default (Swift 4.0.2)
You can download the development snapshots of the Swift binaries by following this link. Compatibility with other Swift versions is not guaranteed.
Optionally, if you'd like to run the BluePic Kitura-based server using Xcode, you should use Xcode 9.1 and configure it to use the default toolchain. For details on how to set up Xcode, see Building within Xcode. Please note that any other versions of Xcode are not guaranteed to work with the back-end code.
Getting started
1. Install system dependencies
The following system level dependencies should be installed on macOS using Homebrew:
brew install curl
If you would like to use Linux as your development platform for the Kitura server component, see Compile and test your code on macOS and Linux for details on how to leverage Docker on your macOS system.
2. Clone the BluePic Git repository
Execute the following command to clone the Git repository:
git clone https://github.com/IBM/BluePic.git
If you'd like to, you can spend a few minutes to get familiar with the folder structure of the repo as described in the About page.
3. Create BluePic application on IBM Cloud
Cloud Foundry Deployment
Clicking on the button below deploys the BluePic application to IBM Cloud. The manifest.yml file [included in the repo] is parsed to obtain the name of the application and to determine the Cloud Foundry services that should be instantiated. For further details on the structure of the manifest.yml file, see the Cloud Foundry documentation. After clicking the button below, you will be able to name your application, keep in mind that your IBM Cloud application name needs to match the name value in your manifest.yml. Therefore, you may have to change the name value in your manifest.yml if there is a naming conflict in your IBM Cloud account.
Once deployment to IBM Cloud is completed, you should access the route assigned to your application using the web browser of your choice. You should see the Kitura welcome page!
Note that the IBM Cloud buildpack for Swift is used for the deployment of BluePic to IBM Cloud. This buildpack is currently installed in the following IBM Cloud regions: US South, United Kingdom, and Sydney.
Manual Command Line Deployment
Deploy as Cloud Foundry Application
You will need to install the following:
sh ./Cloud-Scripts/Deployment/cloud_foundry.sh
Deploy as Kubernetes Container Cluster with Docker
- For information on deploying to Kubernetes please read our docs
4. Populate Cloudant database
To populate your Cloudant database instance with sample data, you need to obtain the following credential values:
username- The username for your Cloudant instance.password- The password for your Cloudant instance.projectId- The project ID for your Object Storage instance.
You can obtain the above credentials by accessing your application's page on IBM Cloud and clicking on the Show Credentials twisty found on your Cloudant service and Object Storage service instances. Once you have these credentials, navigate to the Cloud-Scripts/cloudantNoSQLDB/ directory in the BluePic repo and execute the populator.sh script as shown below:
./populator.sh --username=<cloudant username> --password=<cloudant password> --projectId=<object storage projectId>
5. Populate Object Storage
To populate your Object Storage instance with sample data, you need to obtain the following credential values (region is optional):
userId- The userId for your Object Storage instance.password- The password for your Object Storage instance.projectId- The project ID for your Object Storage instance.region- Optionally, you can set the region for Object Storage to save your data in, eitherlondonfor London ordallasfor Dallas. If not set, region defaults todallas.
You can obtain the above credentials by accessing your application's page on IBM Cloud and clicking on the Show Credentials twisty found on your Object Storage instance. Once you have these credentials, navigate to the ./Cloud-Scripts/Object-Storage/ directory in the BluePic repo and execute the populator.sh script as shown below:
./populator.sh --userId=<object storage userId> --password=<object storage password> --projectId=<object storage projectId> --region=<object storage region>
6. Update BluePic-Server/config/configuration.json file
You should now update the credentials for each one of the services listed in the BluePic-Server/config/configuration.json file. This will allow you to run the Kitura-based server locally for development and testing purposes. You will find placeholders in the configuration.json file (e.g. <username>, <projectId>) for each of the credential values that should be provided.
Remember that you can obtain the credentials for each service listed in the configuration.json file by accessing your application's page on IBM Cloud and clicking on the Show Credentials twisty found on each of the service instances bound to the BluePic app.
You can take a look at the contents of the configuration.json file by clicking here.
7. Update configuration for iOS app
Go to the BluePic-iOS directory and open the BluePic workspace with Xcode using open BluePic.xcworkspace. Let's now update the cloud.plist in the Xcode project (you can find this file in Configuration folder of the Xcode project).
-
You should set the
isLocalvalue toYESif you'd like to use a locally running server; if you set the value toNO, then you will be accessing the server instance running on IBM Cloud. -
To get the
appRouteRemotevalue, you should go to your application's page on IBM Cloud. There, you will find aView Appbutton near the top right. Clicking on it should open up your app in a new tab, the url for this page is yourroutewhich maps to theappRouteRemotekey in the plist. Make sure to include thehttp://protocol in yourappRouteRemoteand to exclude a forward slash at the end of the url. -
Lastly, we need to get the value for
cloudAppRegion, which can be one of three options currently:
REGION US SOUTH | REGION UK | REGION SYDNEY
--- | --- | ---
.ng.bluemix.net | .eu-gb.bluemix.net | .au-syd.bluemix.net
You can find your region in multiple ways. For instance, by just looking at the URL you use to access your application's page (or the IBM Cloud dashboard). Another way is to look at the configuration.json file you modified earlier. If you look at the credentials under your AppID service, there is a value called oauthServerUrl which should contain one of the regions mentioned above. Once you insert your cloudAppRegion value into the cloud.plist, your app should be configured.
Optional features to configure
This section describes the steps to take in order to leverage Facebook authentication with App ID, Push Notifications, and Cloud Functions.
API endpoints in BluePic-Server are currently not protected due to dependency limitations, but they will be as soon as that functionality is available with the Kitura and App ID SDKs
1. Create an application instance on Facebook
In order to have the app authenticate with Facebook, you must create an application instance on Facebook's website.
- Go to the
BluePic-iOSdirectory and open the BluePic workspace with Xcode usin

