Auto Deployment of Badgeyay Backend by Heroku Pipeline

Badgeyay project is now divided into two parts i.e front-end of Ember JS and back-end with REST-API programmed in Python. One of the challenging job is that, it should support the uncoupled architecture. Now, we have to integrate Heroku deployed API with Github which should auto deploy every Pull Request made to the Development Branch and help in easing the Pull Request review process.

In this blog, I’ll be discussing how I have configured Heroku Pipeline to auto deploy every Pull request made to the Development Branch and help in easing the Pull Request review process  in Badgeyay in my Pull Request.
First, Let’s understand Heroku Pipeline and its features. Then we will move onto configuring the Pipeline file to run auto deploy PR.. Let’s get started and understand it step by step.

What is Heroku Pipeline ?

A pipeline is a group of Heroku apps that share the same codebase. Each app in a pipeline represents one of the following steps in a continuous delivery workflow:

  • Review
  • Development
  • Staging
  • Production

A common Heroku continuous delivery workflow has the following steps:

  • A developer creates a pull request to make a change to the codebase.
  • Heroku automatically creates a review app for the pull request, allowing    developers to test the change.
  • When the change is ready, it’s merged into the codebase Default branch.
  • The Default branch is automatically deployed to staging for further testing.
  • When it’s ready, the staging app is promoted to production, where the change is available to end users of the app.

In badgeyay, I have used Review App and Development App steps for auto deployment of Pull Request.

Pre – requisites:

  • You should have admin rights of the Github Repository.
  • You should be the owner of the Heroku deployed app.
  • For creating a Review App , Below mentioned files are needed to be in the root of the project repository to trigger the Heroku Build.

1. App.json

{
    "name": "BadgeYay-API",
    "description": "A fully functional REST API for badges generator using flask",
    "repository": "https://github.com/fossasia/badgeyay/backend/",
    "keywords": [
        "badgeyay",
        "fossasia",
        "flask"
    ],
    "buildpacks": [
        {
            "url": "heroku/python"
        }
    ]
}
2. Procfile

web: gunicorn --pythonpath backend/app/ main:app

 

Now, I have fulfilled all the prerequisites needed for integrating Github repository to Heroku Deployed Badgeyay API. Let’s move to Heroku Dashboard of the Badgeyay API and implement auto deployment of every Pull Request.

Step 1 :

Open the heroku Deployed App on the dashboard. Yow will see following tabs in top of the dashboard.

Step 2 :

Click on Deploy and first create a new pipeline by giving a name to it and choose a stage for the pipeline.

Step 3 :

  • Choose a Deployment Method. For the badgeyay project, I have  integrated Github for auto deployment of PR.
  • Select the repository and connect with it.
  • You will receive a pop-up which will ensure that repository is connected to Heroku.

Step 4 :
Enable automatic deploys for the Github repository.

Step 5 :

Now after adding the pipeline, present app get nested under the pipeline. Click on the pipeline name on the top and now we have a pipeline dashboard like this :

Step 6:

Now for auto deployment of PR, enable Review Apps by filling the required information like this :

Step 7:

Verify by creating a test PR after following every above mentioned steps.

 

Now we are all done with setting up auto deployment of every pull request to badgeyay repository.

This is how I have configured Heroku Pipeline to auto deploy every Pull request made to the Development Branch and help in easing the Pull Request review process.

About Author :

I have been contributing in open source organization FOSSASIA, where I’m working on a project called BadgeYaY. It is a badge generator with a simple web UI to add data and generate printable badges in PDF.

Resources:

  • Heroku Pipelines Article – Link
Continue ReadingAuto Deployment of Badgeyay Backend by Heroku Pipeline
Read more about the article Daimler: Our developers know about the advantages of Open Source Software
Mit fünf spektakulären Installationen hat Sarah Illenberger den Mercedes-Benz F015 Luxury in Motion in Szene gesetzt. Die renommierte Künstlerin arbeitete dabei im Spannungsfeld zwischen technologischer Zukunft und künstlerischer Handarbeit. Mit den Installationen übersetzte Illenberger die faszinierenden Eigenschaften des F015 in eine ausdrucksstarke Bildwelt, die dem Betrachter die Mercedes-Benz Vision vom autonomen Fahren näherbringt. Die Motive machen den Sprung in die neue Ära des Fahrens und die damit verbundenen Veränderungen begreifbar. Dabei wird automobile Ingenieurs- und Designleistung im besten Sinne zu Kunst. ; Sarah Illenberger has drawn attention to the Mercedes-Benz F015 Luxury in Motion by producing five spectacular installations. To do this, the renowned artist had to work between the poles of technological future and artistic handiwork. With these installations, Illenberger has translated the fascinating features of the F015 into an expressive pictorial world that brings the observer closer to the Mercedes-Benz vision of autonomous driving. The subjects take the leap into the new era of driving, rendering the associated changes touchable and comprehensible. This process sees automotive engineering and design achievements becoming art in the best sense of the word.;

Daimler: Our developers know about the advantages of Open Source Software

Vlado Koljibabic is Head of CASE IT at Daimler AG, the parent company of the car manufacturer Mercedes-Benz. He aims to strengthen the idea of Open Source in his company. Daimler is a partner of FOSSASIA. Torben Stephan interviewed Koljibabic on the advantages of open source software.

Stephan: What does CASE stand for?

Koljibabic: CASE is the combination of everything disruptive regarding our business: Connected, Autonomous, Shared & Services and Electric. These topics shall help us to transform from a car manufacturer to a mobility services provider. This is key in order to remain successful in the future.

How much Free and Open Source Software (FOSS) is actually part of a Mercedes?

We have been using FOSS for many years. Any Mercedes-Benz comes with a CD full of FOSS licenses. Every license belongs to a piece of open source software which is implemented in our cars. Even our Mercedes me app contains seven OS licenses. We use it because our developers know about the advantages of OSS.

Which are?

We don’t need to develop everything from scratch, we can reuse things where it makes sense and contribute to the development of open standards that increase efficiency throughout the system.

Daimler is a member of the “Automotive Grade Linux” (AGL) initiative initiated by the Linux Foundation. Isn’t that the right place for such open standards?

Absolutely. During FOSSASIA, with the community, we discussed the opportunity of defining an open standard for electric vehicle charging stations. From my point of view it definitely does make sense to develop this via the AGL. On the other hand Daimler might put even more commitment into this project to show we seriously want to be part of this.

Vlado Koljibabic CASE IT Daimler
Vlado Koljibabic CASE IT Daimler

 

What’s the advantage of open source software compared to proprietary?

Two things: Nobel Prize laureate John Nash showed that sharing of commodities brings advantages to all players in the market. For me this is the secret of the success of open source software. Beside this we can use existing software solutions for recurring processes. And the car industry is full of recurring processes. If there is no ready-to-use solution, we can initiate and design the processes and contribute to the community.

How do other business units within Daimler respond to this ideas?

For a company like Daimler these are huge changes. That’s why we do this step-by-step. First of all we convince our internal stakeholders of the reasonableness and the value of FOSS. As a following step we accelerate the topic within concrete projects. The overall process of enhancement of OSS usage is initiated and strategically supported. Jan Brecht the CIO of the Daimler AG drives and promotes the initiative essentially.

In which fields would you refrain from publishing your source code?

For example in highly sensitive areas in terms of competition. One example is Autonomous Driving – I would not be the first to focus on open source when it comes to this topic right now. But I’m sure that within the next years, there will be a deck of open source tools for Autonomous Driving, Machine Learning and Artificial Intelligence everyone can use.

Daimler uses a lot of open source. But what are you giving back to the community?

We are a member of the Linux Foundation and partner here at FOSSASIA. However, we don’t contribute source code yet in the context of open source projects. But we see the demand of the community and are working on it continuously to contribute as soon as possible.

Continue ReadingDaimler: Our developers know about the advantages of Open Source Software

Unit Tests for REST-API in Python Web Application

Badgeyay backend is now shifted to REST-API and to test functions used in REST-API, we need some testing technology which will test each and every function used in the API. For our purposes, we chose the popular unit tests Python test suite.

In this blog, I’ll be discussing how I have written unit tests to test Badgeyay  REST-API.

First, let’s understand what is unittests and why we have chosen it. Then we will move onto writing API tests for Badgeyay. These tests have a generic structure and thus the code I mention would work in other REST API testing scenarios, often with little to no modifications.

Let’s get started and understand API testing step by step.

What is Unittests?

Unitests is a Python unit testing framework which supports test automation, sharing of setup and shutdown code for tests, aggregation of tests into collections, and independence of the tests from the reporting framework. The unittest module provides classes that make it easy to support these qualities for a set of tests.

Why Unittests?

We get two primary benefits from unit testing, with a majority of the value going to the first:

  • Guides your design to be loosely coupled and well fleshed out. If doing test driven development, it limits the code you write to only what is needed and helps you to evolve that code in small steps.
  • Provides fast automated regression for re-factors and small changes to the code.
  • Unit testing also gives you living documentation about how small pieces of the system work.

We should always strive to write comprehensive tests that cover the working code pretty well.

Now, here is glimpse of how  I wrote unit tests for testing code in the REST-API backend of Badgeyay. Using unittests python package and requests modules, we can test REST API in test automation.

Below is the code snippet for which I have written unit tests in one of my pull requests.

def output(response_type, message, download_link):
    if download_link == '':
        response = [
            {
                'type': response_type,
                'message': message
            }
        ]
    else:
        response = [
            {
                'type': response_type,
                'message': message,
                'download_link': download_link
            }
        ]
    return jsonify({'response': response})

 

To test this function, I basically created a mock object which could simulate the behavior of real objects in a controlled way, so in this case a mock object may simulate the behavior of the output function and return something like an JSON response without hitting the real REST API. Now the next challenge is to parse the JSON response and feed the specific value of the response JSON to the Python automation script. So Python reads the JSON as a dictionary object and it really simplifies the way JSON needs to be parsed and used.

And here’s the content of the backend/tests/test_basic.py file.

 #!/usr/bin/env python3
"""Tests for Basic Functions"""
import sys
import json
import unittest

sys.path.append("../..")
from app.main import *


class TestFunctions(unittest.TestCase):
      """Test case for the client methods."""
    def setup(self):
        app.app.config['TESTING'] = True
        self.app = app.app.test_client()
      # Test of Output function
    def test_output(self):
        with app.test_request_context():
            # mock object
            out = output('error', 'Test Error', 'local_host')
            # Passing the mock object
            response = [
                {
                    'type': 'error',
                    'message': 'Test Error',
                    'download_link': 'local_host'
                }
            ]
            data = json.loads(out.get_data(as_text=True))
            # Assert response
            self.assertEqual(data['response'], response)


if __name__ == '__main__':
    unittest.main()

 

And finally, we can verify that everything works by running nosetests .

This is how I wrote unit tests in BadgeYaY repository. You can find more of work here.

Resources:

  • The Purpose of Unit Testing – Link
  • Unit testing framework – Link
Continue ReadingUnit Tests for REST-API in Python Web Application

Parallelizing Builds In Travis CI

Badgeyay project is now divided into two parts i.e front-end of emberJS and back-end with REST-API programmed in Python. Now, one of the challenging job is that, it should support the uncoupled architecture. It should therefore run tests for the front-end and backend i.e, of two different languages on isolated instances by making use of the isolated parallel builds.

In this blog, I’ll be discussing how I have configured Travis CI to run the tests parallely in isolated parallel builds in Badgeyay in my Pull Request.

First let’s understand what is Parallel Travis CI build and why we need it. Then we will move onto configuring the travis.yml file to run tests parallely. Let’s get started and understand it step by step.

Why Parallel Travis CI Build?

The integration test suites tend to test more complex situations through the whole stack which incorporates front-end and back-end, they likewise have a tendency to be the slowest part, requiring various minutes to run, here and there even up to 30 minutes. To accelerate a test suite like that, we can split it up into a few sections utilizing Travis build matrix feature. Travis will decide the build matrix based on environment variables and schedule two builds to run.

Now our objective is clear that we have to configure travis.yml to build parallel-y. Our project requires two buildpacks, Python and node_js, running the build jobs for both them would speed up things by a considerable amount.It seems be possible now to run several languages in one .travis.yml file using the matrix:include feature.

Below is the code snippet of the travis.yml file  for the Badgeyay project in order to run build jobs in a parallel fashion.

sudo: required
dist: trusty

# check different combinations of build flags which is able to divide builds into “jobs”.
matrix:

# Helps to run different languages in one .travis.yml file
include:

# First Job in Python.
- language: python3

apt:
packages:
- python-dev

python:
- 3.5
cache:
directories:
- $HOME/backend/.pip-cache/

before_install:
- sudo apt-get -qq update
- sudo apt-get -y install python3-pip
- sudo apt-get install python-virtualenv

install:
- virtualenv  -p python3 ../flask_env
- source ../flask_env/bin/activate
- pip3 install -r backend/requirements/test.txt --cache-dir

before_script:
- export DISPLAY=:99.0
- sh -e /etc/init.d/xvfb start
- sleep 3

script:
- python backend/app/main.py >> log.txt 2>&1  &
- python backend/app/main.py > /dev/null &
- py.test --cov ../  ./backend/app/tests/test_api.py

after_success:
- bash <(curl -s https://codecov.io/bash)

# Second Job in node js.
- language: node_js
node_js:
- "6"

addons:
chrome: stable

cache:
directories:
- $HOME/frontend/.npm

env:
global:
# See https://git.io/vdao3 for details.
- JOBS=1

before_install:
- cd frontend
- npm install
- npm install -g ember-cli
- npm i eslint-plugin-ember@latest --save-dev
- npm config set spin false

script:
- npm run lint:js
- npm test

 

Now, as we have added travis.yml and pushed it to the project repo. Here is the screenshot of passing Travis CI after parallel build jobs.

The related PR of this work is https://github.com/fossasia/badgeyay/pull/512

Resources :

Travis CI documentation – Link

Continue ReadingParallelizing Builds In Travis CI

Deploying BadgeYaY with Docker on Docker Cloud

We already have a Dockerfile present in the repository but  there is problem in many lines of code.I studied about Docker and learned how It is deployed and I am now going to explain how I deployed BadgeYaY on Docker Cloud.

To make deploying of Badgeyay easier we are now supporting Docker based installation.

Before we start to deploy, let’s have a quick brief about what is docker and how it works ?

What is Docker ?

Docker is an open-source technology that allows you create, deploy, and run applications using containers. Docker allows you deploy technologies with many underlying components that must be installed and configured in a single, containerized instance.Docker makes it easier to create and deploy applications in an isolated environment.

Now, let’s start with how to deploy on docker cloud:

Step 1 – Installing Docker

Get the latest version of docker. See the offical site for installation info for your platform.

Step 2 – Create Dockerfile

With Docker, we can just grab a portable Python runtime as an image, no installation necessary. Then, our build can include the base Python image right alongside our app code, ensuring that our app, its dependencies, and the runtime, all travel together.

These portable images are defined by something called a Dockerfile.

In DockerFile, there are all the commands a user could call on the command line to assemble an image. Here’s is the Dockerfile of BadgeYaY.

# The FROM instruction initializes a new build stage and sets the Base Image for subsequent instructions.
FROM python:3.6

# We copy just the requirements.txt first to leverage Docker cache
COPY ./app/requirements.txt /app/


# The WORKDIR instruction sets the working directory for any RUN, CMD, ENTRYPOINT, COPY and ADD instructions that follow it in the Dockerfile.
WORKDIR /app


# The RUN instruction will execute any commands in a new layer on top of the current image and commit the results.
RUN pip install -r requirements.txt


# The COPY instruction copies new files.
COPY . /app


# An ENTRYPOINT allows you to configure a container that will run as an executable.
ENTRYPOINT [ "python" ]

# The main purpose of a CMD is to provide defaults for an executing container.
CMD [ "main.py" ]

 

Step 3 – Build New Docker Image

sudo docker build -t badgeyay:latest .

 

When the command completed successfully, we can check the new image with the docker command below:

     sudo docker images

 

Step 4 – Run the app

Let’s run the app in the background, in detached mode:

 sudo docker run -d -p 5000:5000 badgeyay

 

We get the long container ID for our app and then are kicked back to our terminal.Our container is running in the background.Now use docker container stop to end the process, using the CONTAINER ID, like so :

 

docker container stop 1fa4ab2cf395

 

Step 5 – Publish the app.

Log in to the Docker public registry on your local machine.

docker login

 

Upload your tagged image to the repository:

docker push username/repository:tag

 

From now on, we can use docker run and run our app on any machine. No matter where docker run executes, it pulls your image, along with Python and all the dependencies from requirements.txt, and runs your code. It all travels together in a neat little package, and the host machine doesn’t have to install anything but Docker to run it.

Docker Cloud

Docker Cloud provides a hosted registry service with build and testing facilities for Dockerized application images; tools to help you set up and manage host infrastructure; and application lifecycle features to automate deploying (and redeploying) services created from images.

In BadgeYaY, we  also have a Deploy button button which directly deploys on Docker cloud with a single click .

The related PR of this work is https://github.com/fossasia/badgeyay/pull/401 .

Resources :

  • Docker documentation: Link
  • Get Started With Docker: Link
Continue ReadingDeploying BadgeYaY with Docker on Docker Cloud

Setting up Codecov in Badgeyay

 

BadgeYaY already has Travis CI and Codacy to test code quality and Pull Request but there was no support for testing Code Coverage in repository against every Pull Request. So I decided to go with setting up Codecov to test the code coverage.

In this blog post, I’ll be discussing how I have set up codecov in BadgeYaY in my Pull Request.

First, let’s understand what is codecov and why do we need it. For that we have to first understand what is code coverage then we will move on to how to add Codecov with help of Travis CI .

Let’s get started and understand it step by step.

What is Code Coverage ?

Code coverage is a measurement used to express which lines of code were executed by a test suite. We use three primary terms to describe each lines executed.

  • hit indicates that the source code was executed by the test suite.
  • partial indicates that the source code was not fully executed by the test suite; there are remaining branches that were not executed.
  • miss indicates that the source code was not executed by the test suite.

Coverage is the ratio of hits / (hit + partial + miss). A code base that has 5 lines executed by tests out of 12 total lines will receive a coverage ratio of 41% . In BadgeYaY , Code Coverage is 100%.

How CodeCov helps in Code Coverage ?

Codecov focuses on integration and promoting healthy pull requests. Codecov delivers <<<or “injects”>>> coverage metrics directly into the modern workflow to promote more code coverage, especially in pull requests where new features and bug fixes commonly occur.

I am listing down top 5 Codecov Features:

We can change the configuration of how Codecov processes reports and expresses coverage information. Let’s see how we configure it according to BadgeYaY by integrating it with Travis CI.

Now generally, the codecov works better with Travis CI. With the one line

 bash <(curl -s https://codecov.io/bash)

 

the code coverage can now be easily reported.

Add a script for testing:

"scripts": {
   - nosetests app/tests/test.py -v --with-coverage
}

Here is a particular example of travis.yml from the project repository of BadgeYaY:

Script:
- python app/main.py >> log.txt 2>&1  &
- nosetts app/tests/test.py -v --with-coverage
- python3 -m pyflakes

after_success:
- bash <(curl -s https://codecov.io/bash)

 

Let’s have a look at Codecov.yml to check exact configuration that I have used for BadgeYaY.

Codecov:
  # yes: will delay sending notifications until all ci is finished
  notify:
    require_ci_to_pass: yes

coverage:
  # how many decimal places to display in the UI: 0 <= value <= 4
  precision: 2
  # how coverage is rounded: down/up/nearest
  round: down 
  # custom range of coverage colors from red -> yellow -> green 
  range: "70...100"

  status:
     # measuring the overall project coverage
    project: yes
     # pull requests only: this commit status will measure the
       entire pull requests Coverage Diff. Checking if the lines
       adjusted are covered at least X%.
    patch: yes
     # if there are any unexpected changes in coverage
    changes: no

Comment:

  layout: "reach, diff, flags, files, footer"
  behavior: default
  require_changes: no

 

Now when anyone makes a Pull Request to BadgeYaY, Codecov will analyze the Pull Request according to above configuration and generate a Report showing the code coverage of that Pull Request.

 

Below is the screenshot of all test passing in BadgeYaY repository

This is how we setup codecov in BadgeYaY repository. And like this way, it can be set up in other repositories as well.

The related PR of this work is https://github.com/fossasia/badgeyay/pull/400

Resources :

  • CodeCov Documentation – Link
Continue ReadingSetting up Codecov in Badgeyay

FOSSASIA Summit 2018 Highlights

The schedule for the FOSSASIA Summit is out. Our four-day open tech event starts on Thursday, March 22 with a grand opening of the exhibition at 12:00 PM and the conference at 1:00 PM in the Lifelong Learning Institute.

Developers, engineers and business representatives from FOSS projects and companies are joining the event. Thank you to Google Cloud, Daimler, Indeed, Microsoft, JPMorgan and the many partners and supporters for helping us to make the summit possible!

As a reader of FOSSASIA news you get a 15% discount on your ticket if you book before March 14 (after that 10%) with this link.

Here are some highlights of the event and a glance at participating FOSS projects, organizations and companies.

Highlights of the FOSSASIA Summit 2018

  • 200+ Tech Speakers in 12 Tracks are confirmed. Learn about latest technologies and Open Source business models in the Blockchain track, find out how to analyze data more efficiently in the Artificial Intelligence track or see how to deploy solutions with Kubernetes in the Cloud from engineers at leading cloud providers.
  • Executive Keynotes about “Daimler’s Open Source Strategy”, and “Machine Learning with TensorFlow and Cloud ML”
  • Leadership Panels about “AI, Machine Learning, Cloud, and the Conversational Web: Where is it all going?”, “Making Money with FOSS” and “Open Source Education”
  • The Exhibition and Career Fair runs from Thursday (March 22) till Saturday (March 24) with more than 50 company and project booths, where you can learn about technologies, job opportunities and participate in hands-on labs. Free hall passes are available until March 14.
  • The UNESCO Open Science and Open Data Hackathon takes place on Saturday and Sunday (March 24/25). Tickets and registration are free. Awesome prizes are waiting for the winners.
  • We put together a Cloud Training Day for Business Professionals in cooperation with Google. Apply for your spot here.
  • At the Young Developers Day on Saturday (March 24) there are many hands-on workshops in the exhibition hall, where participants of any age can build their own hardware and experiment with our Pocket Science Lab.
  • Vast variety of Deep Tech Sessions in tracks such as Artificial Intelligence,  Cloud, Container, DevOps, Blockchain, Cybersecurity, Web and Mobile, Open Design, IoT, Hardware, Imaging, Kernel & Platform,  Science Tech and Education and more.

FOSS Organizations at the FOSSASIA Summit

Speakers at the event come from amazing Free/Open Source organizations and projects like Debian, CentOS, FreeBSD, Videolan/VLC, Linux Foundation, Open Source Initiative, Python Software Foundation, Wikimedia, KDE, Apache Software Foundation, Open Source Design, Drupal, OpenTech, Ethical Hacking Club, Pocket Science Lab, Oman FOSS Initiative, LikeCoin Foundation and many more.

Companies at the FOSSASIA Summit

Tech Companies present at the event are Daimler/Mercedes, Google, Microsoft, Samsung, Singapore Press Holding, J.P. Morgan, Indeed, UNESCO, Oracle/MySQL, Gandi.net, Lazada, Viseo, Grab, SUSI.AI, BareOS, Platform.sh, Ulicious, SAP, Thoughtworks, Autodesk, KPMG, VMWare, Lionsforge, Fujitsu, Zendesk, McKinsey, Iomedia, IBM, Collabora, Manulife, Tata Consultancy Services and many startups like KyberNetwork, DataKind, Ethereum, Kamailio, Go-Jek, Canaan, StopStalk, ConsenSys, Chibitronics, Status.im, Attores and many others.

Continue ReadingFOSSASIA Summit 2018 Highlights

UNESCO Hackathon at FOSSASIA Summit in Singapore

Join the UNESCO Open Data Hackathon at the FOSSASIA Summit, create open source apps and games that tackle climate change, environment and sustainable development challenges, and win awesome prizes! The hackathon takes place from Saturday 24 March to Sunday 25 March 2018 at the Lifelong Learning Institute in Singapore.

We are specifically interested in applications and games that set an example for others who could replicate solutions in other countries, and in particular in the Mekong countries, to tackle the sustainable development challenges. It is our goal to engage the developer community to develop innovative applications in open source by leveraging the open data and knowledge available.

We are inviting developers, designers, open source contributors, bloggers, journalists and all FOSSASIA community members to be part of the UNESCO Hackathon. We are especially encouraging applications from the Mekong region to join the contest. The hackathon is open for all and awesome prizes are waiting for you!

For participants from outside of Singapore we have the possibility to host them in a Singapore hostel. Please apply here. The number is limited. UNESCO encourages the application of women and girls.

How do I sign up?

1. Get your ticket to the Event on eventyay.com.

2. Sign up on Devpost.

3. Join the Gitter channel at https://gitter.im/fossasia/hackathon (requires login with Github).

4. Find team members and create your team preferably at least 3 members and maximum 5 contributors. You are also welcome to sign up and then wait until the Presentation of Ideas on Saturday before deciding to join a team, however we’d encourage you to form/join a team in advance if you already have an idea that you’d like to work on.

5. Join the event at the Lifelong Learning Institute on Saturday, March 24 at the opening at 2.00 pm until 10.00 pm and on Sunday, March 25 from 9.00 am until 5.00 pm.

Visit the website at unesco.sciencehack.asia and stay connected, join the event on Facebook and Meetup and follow FOSSASIA on Twitter.

UNESCO Hackathon Schedule

Hackathon Opening: March 24, 2018

12.00 Registration Opens
14:00 Opening
14.10 Intro of Background, Rules and Prizes
14:20 Presentation of Ideas, Teams and Team Building Activities
15:00 Begin of Hacking Activities
19.30 Dinner
22:00 Closing of Space

Hackday: March 25, 2018

08:00 – 09:00 Breakfast
09:00 – 13:00 Hack Activities Continue
13:00 – 13:30 Lunch
13:30 – 15:00 Hacking Continues
14:00 Submission Form Closes
15:15 – 16:00 Presentation of Outcome
16:00 Judges Withdraw for Consultation
16:30 Award Announcement and Ceremony
17:00 Summit Closing

Location/Venue

Lifelong Learning Institute

Address: 11 Eunos Road 8, Singapore 408601

Prizes

Prizes are awarded for three teams, and each team prize with a value of 1000 SGD. Win cool gear, hardware, raspis, Arduinos and more!

Project Submission Requirements

For the expected outcome of the hack, the applications or games shall be open source and use open data to tackle the climate change, environment and sustainable development challenges.

They shall address one or several of the following requirements:

  1. Respond to pressing environmental challenges at local, national or regional levels in Asia

  2. Enable the visualization of data in an innovative and/or easy-to-understand way

  3. Mobilize and create engagement of variety of stakeholders and sectors in society on climate change, environment and sustainable development

  4. Gender-sensitive prototype, recognizing or encouraging women’s participation in sustainable development

Functioning App

An important point is, is the prototype or showcase functioning? We prefer real code and design implementations over mockups.

What to enter

Please submit a link to the app, a Github repo link and a short presentation as a download or on Google drive (ensure it is set to public sharing). You can also share anything else to demonstrate your work and let us test it.

  • Video: The platform accepts links to YouTube, Vimeo or Youku. If you like you can post a short video to demonstrate your work.

  • File Upload: There is also an option to upload a file. The platform allows submitters to upload one file, though they can combine files into a single ZIP file.

  • Other: The platform requires contestants to enter an entry name and description. Please also accept the the conditions of the contest including sharing your work under certified Open Source license.

Platform

Share information about what operating systems or devices can your hack run on.

Ressources

Include information about API, SDK, or data set, that are required to run the app.

New vs. Existing

Any work done need to be new for the competition. Existing apps are not eligible. However the specific details what is acceptable and what is not will be determined by the jury. For example existing apps that have been modified substantially and include entirely new functionality would still be eligible.

Submission Rights & Display

The submissions should be Open Source and licensed under a compliant Open Source/Free Software license. They should be upload to a Github repository.

We also request the right to use the winners’ names and work to promote the competition and hackathons in future.

Links

UNESCO Hackathon: https://unesco.sciencehack.asia

FOSSASIA Summit: https://2018.fossasia.org

Tickets: https://eventyay.com/e/db15e7db/

Project Signup: https://fossasia-unesco.devpost.com

Facebook: https://www.facebook.com/events/139329623548116/

Meetup: https://www.meetup.com/FOSSASIA-Singapore-Open-Technology-Meetup/events/247899257/

FOSSASIA: https://twitter.com/fossasia

List of Open Data Resources in Asia

Data portals across Asia: http://dataportals.org
China: http://opendatachina.com
Singapore http://data.gov.sg
Indonesia: https://petabencana.id/map/jakarta
Cambodia: https://opendevelopmentcambodia.net
Thailand https://data.go.th, http://catalog.opendata.in.th
Vietnam: https://vietnam.opendevelopmentmekong.net/data/
World Bank: https://data.worldbank.org
India http://data.gov.in

Continue ReadingUNESCO Hackathon at FOSSASIA Summit in Singapore

Participate in the #OpenTechNights Program today and Win a Free Stay during the FOSSASIA Summit 2018 from the Open Source Initiative and UNESCO

The FOSSASIA Summit 2018 takes place in Singapore from Thursday, March 22 – Sunday, March 25. Open Source contributors can now apply for a free ticket to the event, and accommodation throughout the conference. In addition, you’ll be eligible to participate in: Featured cloud workshops, the UNESCO hackathon, and celebrate the 20th Anniversary of the Open Source Initiative. All you have to do is convince us, that you are an awesome Open Source contributor and book your trip to Singapore!

About #OpenTechNights

Developers from all over the world are joining the FOSSASIA Summit. We want to connect established and new Open Tech contributors alike. With the support of UNESCO, the Open Source Initiative, and other partners, we are inviting Free and Open Source Software contributors to join us. Winners will receive free lodging at a shared accommodation in the centre of Singapore, and a free ticket to the conference.

Winners are expected to join the summit each day, to participate in the workshops, and the Hackathon on Saturday/Sunday, March 24/25. We would also hope you can support the Open Source Initiative at their booth.

How do I sign up?

Step 1: Please fill in our form here before February 28, 2018.

Step 2: We will notify all winners within three days of their submission, however judging will begin immediately, and continue until all open spots are filled, so the earlier you apply, the higher your chances to win. Please note, winners will receive free accommodations in Singapore. Flight and other travel costs are not included and are the responsibility of the attendee.

Step 3: Selected applicants must confirm their itinerary and tickets before March 1st to insure their free stay in Singapore. Earliest check-in possible is Wednesday March 21, latest check-out is Monday, March 26. Please indicate your arrival and departure times in the application form.

Expectations of Participants – Share what you learn

  1. Attendees support volunteers, speakers and participants at the event, and take a shift at the Open Source Initiative’s booth. Let’s bring the spirit of sharing Open Technologies and learning together!
  2. Please confirm your participation at the opening event at 12PM, Thursday, March 22, 2018 and participate in the specially featured cloud workshops on Friday, March 23, 2018 from 9.00 AM – 5.00PM.
  3. Attendees participate in the UNESCO Hackathon on Saturday, March 24 (2.00 PM – 10.00PM) and on Sunday, March 25 (9.00 AM – 5.00PM).
  4. Attendees help reach out to community members who cannot join us at the event, make tweets, share what you learn on social media, publish photos and put up blog post about the summit.

Apply Now

Apply for a free stay with #FOSSASIA #OpenTechNights supported by the Open Source Initiative and the UNESCO and participate in the FOSSASIA Summit 2018 now here!

More Information

More updates, tickets and information on speakers on our website: https://2018.fossasia.org

Links

Open Source Initiative: https://opensource.org

UNESCO: http://unesco.org

Continue ReadingParticipate in the #OpenTechNights Program today and Win a Free Stay during the FOSSASIA Summit 2018 from the Open Source Initiative and UNESCO

Enhancing Rotation in Phimp.me using Horizontal Wheel View

Installation

To implement rotation of an image in Phimp.me,  we have implemented Horizontal Wheel View feature. It is a custom view for user input that models horizontal wheel controller. How did we include this feature using jitpack.io?

Step 1: 

The jitpack.io repository has to be added to the root build.gradle:

allprojects {
repositories {
jcenter()
maven { url "https://jitpack.io" }
}
}


Then, add the dependency to your module build.gradle:

compile 'com.github.shchurov:horizontalwheelview:0.9.5'


Sync the Gradle files to complete the installation.

Step 2: Setting Up the Layout

Horizontal Wheel View has to be added to the XML layout file as shown below:

<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2">

<com.github.shchurov.horizontalwheelview.HorizontalWheelView
android:id="@+id/horizontalWheelView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toStartOf="@+id/rotate_apply"
android:padding="5dp"
app:activeColor="@color/accent_green"
app:normalColor="@color/black" />

</FrameLayout>


It has to be wrapped inside a Frame Layout to give weight to the view.
To display the angle by which the image has been rotated, a simple text view has to be added just above it.

<TextView
android:id="@+id/tvAngle"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:textColor="@color/black"
android:textSize="14sp" />

Step 3: Updating the UI

First, declare and initialise objects of HorizontalWheelView and TextView.

HorizontalWheelView horizontalWheelView = (HorizontalWheelView) findViewById(R.id.horizontalWheelView);
TextView tvAngle= (TextView) findViewById(R.id.tvAngle);

 

Second, set up listener on the HorizontalWheelView and update the UI accordingly.

horizontalWheelView.setListener(new HorizontalWheelView.Listener() {
@Override
public void onRotationChanged(double radians) {
updateText();
updateImage();
}
});


updateText()
updates the angle and updateImage() updates the image to be rotated. The following functions have been defined below:

private void updateText() {
String text = String.format(Locale.US, "%.0f°", horizontalWheelView.getDegreesAngle());
tvAngle.setText(text);
}

private void updateImage() {
int angle = (int) horizontalWheelView.getDegreesAngle();
//Code to rotate the image using the variable 'angle'
rotatePanel.rotateImage(angle);
}


rotateImage()
is a method of ‘rotatePanel’ which is an object of RotateImageView, a custom view to rotate the image.

Let us have a look at some part of the code inside RotateImageView.

private int rotateAngle;


‘rotateAngle’ is a global variable to hold the angle by which image has to be rotated.

public void rotateImage(int angle) {
rotateAngle = angle;
this.invalidate();
}


The method invalidate() is used to trigger UI refresh and every time UI is refreshed, the draw() method is called.
We have to override the draw() method and write the main code to rotate the image in it.

The draw() method is defined below:

@Override
public void draw(Canvas canvas) {
super.draw(canvas);
if (bitmap == null)
return;
maxRect.set(0, 0, getWidth(), getHeight());// The maximum bounding rectangle

calculateWrapBox();
scale = 1;
if (wrapRect.width() > getWidth()) {
scale = getWidth() / wrapRect.width();
}

canvas.save();
canvas.scale(scale, scale, canvas.getWidth() >> 1,
canvas.getHeight() >> 1);
canvas.drawRect(wrapRect, bottomPaint);
canvas.rotate(rotateAngle, canvas.getWidth() >> 1,
canvas.getHeight() >> 1);
canvas.drawBitmap(bitmap, srcRect, dstRect, null);
canvas.restore();
}

private void calculateWrapBox() {
wrapRect.set(dstRect);
matrix.reset(); // Reset matrix is ​​a unit matrix
int centerX = getWidth() >> 1;
int centerY = getHeight() >> 1;
matrix.postRotate(rotateAngle, centerX, centerY); // After the rotation angle
matrix.mapRect(wrapRect);
}

 

And here you go:

Resources

Refer to Github- Horizontal Wheel View for more functions and for a sample application.

Continue ReadingEnhancing Rotation in Phimp.me using Horizontal Wheel View