Transmitting response from a Web page to a server.

{ Re-post from my Medium Post }

My project has pivoted from a standalone android app to a Web page that will generate a custom app for an event organizer’s use.

Read up here on what my project actually is.

So obviously some changes at the server are to be made to make this possible.

How are you planning to do it?

First of we started by providing a Web page that the organizers can use to submit information about the app they need to be built like the App’s name, the link to the API (for fetching the json files) and their email address (for mailing them the apk once it’s generated).

The HTML file for the same can be found here.

Some changes to the Travis build should also be made so that it can use this data for building.

From there on, the details submitted by them will be converted by a json object (using javascript) and further send to the open event server via a POST request where it will be written to a database.

We will be able to fetch this file from the database by the following link

openevent.com/api/v2/customapps/id.

Simultaneously one Travis build will also be trigger using the API that will auto build the latest commit, taking the modified json file data provided by the orga-server.

This configuration will be provided to Travis while the build time.

Cool, any difficulties yet!

One of the main challenges that we are facing is manually triggering the Travis build.

We can do this via the Travis API but that’s still in beta and also we are getting our head around on how to implement it.

I also had a tough time learning javascript and HTML for making the Web page and then I also have to read up on sending a POST request to the server via Ajax.

It’s a bit tough, but should be fun.

So, that was all for now, see you next week and all the best for your projects.✌

Continue Reading

Factories, Services and Controllers

week1gsoc1

So before I start the blog post, it is better if you know more about what sTeam web interface is and what are the capabilites of sTeam. Click here.

So what is a Controller ?

It is simply a a constructor function which is instantiated by AngularJS when it encounters ng-controller directive in HTML.

So what is a Factory ?

In Angular Js a factory is an injectable type which helps us in encapsulating repetitive logic.

How are they helpful for sTeam web interface ?

So as my first week of work started of for GSOC, the core concentration has been on primarily working with the controllers of the workarea and integrating them with the respective views. In an attempt i started of with adding a :

commentsCtrl

: Used for adding comments to the web interface

workspaceeditorCtrl

: Used for integrating textAngular to the web interface

Things apart, in a broader aspect here what should be understood is about how things should be implemented using controllers, factories and services. Let me illustrate how it should be properly done in angular js.

To start off

How are controllers really helpful in Angular and how should they be used ?

Generally we should understand that controllers responsible for augmenting the scope which is done by attaching models and functions to it that are subsequently accessed in the view. There are some things which are to be understood while writing controllers. Lets go one by one,

  • A Straight “No” for all the DOM manipulation. This must be achieved only with directives
  • If you are having a situation where you are about to write repeatable code, then don’t do it with controllers, instead encapsulate them in services.
  • If you are trying to expose the whole controller instance then it isn’t a good idea. In fact the scope object exists in order to clear separation of concern between controller and view .

So what about Factories ?

“Services, factories, and providers are all injectable types. We must understand that Factories in angular Js are just another example for an injectable type. It looks almost the same as Service but when it comes to implementation you can decide and determine what to instantiate and return from the factory”

scribes by hector | Akhil Pandey

Let me give you a small example before i wrap up, Have a look at the below image,

week1gsoc2

Observe broadcastItem, prepForBroadcast. If you look keenly essentially what i am doing there is creating an injectable type which enables me to change the message that which has to be printed depending on the broadcast item.

One more key thing about factories is that a factory can also depend on other services or factories. Also there is one more point to grab which is we are returning an object from the factory function, so we absolutely have the freedom to determine what should be the object which is to be returned, going further we can base it on certain parameters as well.

Thats it folks,
Happy Hacking !!

Continue Reading

KnitWeb Localization

Why Localization important

Localization is the process of adapting, translating and customizing a product for a specific locale or cultural conventions. Localization distinguishes a good web front end from a truly successful one. Today English is a priority language to be learning to use computers. Having Localization we can gain benefits such as, no need to local users to learn English first, Reduce amount of training and localization brings additional value. Localization To improve localization community of volunteers needs to get together and first establish a guiding set of terms to guarantee accurate and consistent translation. Community is the strongest part for an Open Source project. Translation process can be improved by making sure that efforts in translations are consistent and structured. So the lots of local users can enjoy KnitWeb and hopefully become a part of the community.

How Localization work on KnitWeb

KnitWeb construct elements of the interface using JavaScript dynamically. Retrieve the correct localized string in JavaScript is the most important part for localize an app like KnitWeb. For the Localization I used 3 types of files i.e. languge.properties, locles.ini and l10.js.

.properties files (en.properties, ge.properties): These files contain the translations of strings used in the KnitWeb. Each line is the translation of a single string in “name=value” format; name is an identifier for this string, It is used to map the string; value is the translation of the string in particular language.

Inside ge.properties

#Inputs
input_port=Port
input_machine=Maschine:

Inside si.properties

#Inputs
input_port=කවුළුව
input_machine=යන්ත්‍රය:

locales.ini : locales.ini includes which is the default language in case app does not support current language, what type of other locales KnitWeb supports and the location of the each translated file.

l10n.js: JavaScript library. Automatic localization of strings appearing in your app’s HTML. Provides a JavaScript API your app can use to retrieve localized strings( get, getLanguage, setLanguage, getDirection)

global_translate_german
Localization – German
global_tranlate_sinhala
Localization – Sinhala
Continue Reading
Close Menu