sobota, 30 listopada 2013

Java ESL program for connecting to the FreeSWITCH

Next simple Java program using Event Socket interface to control FreeSWITCH. First you should read: Next you should not forget to change event_socket.conf.xml (to allow connections from any host on the network): Now we can write simple java ESL program for connecting to the FreeSWITCH.

MyEslEventListener.java MyEslEventTest.java When we run this program we can see on the console much more than below: Good start to do something cool :)

czwartek, 28 listopada 2013

Java program for connecting to the FreeSWITCH XML-RPC

I would like to show simple Java program which use XML-RPC interface to do some freeswitch commands. We should on freeswitch console load mod_xml_rpc: Worth checking out if it works, in web browser type: If you see "FreeSWITCH help" it works.

Next we download Apache XML-RPC library.

Now we create Java program (using Apache XML-RPC):
After running this simple Java program we can see on Java console: A lot of fun :)

sobota, 23 listopada 2013

AngularJS example MotoAds with NodeJS and MongoDB

I built MotoAds demo application in AngularJS but it did not have any server layer. Data was read directly from the json files. So I was decided to build the server side services. I know pretty well JEE and relational database, so I could use it. But I want to know something new so I chose NodeJS nad MongoDB. Thanks to this decision I got a full stack JavaScript application. It's incredible to use JavaScript to build the complete application.

Now MotoAds demo application consists of:
  • User interface in AngularJS and Bootstrap with full CRUD operations: add, read, edit and remove adverts.
  • Server service layer was built in NodeJS with RESTful serrvices. To simplify the use of a NodeJS I used ExpressJS.
  • Database: all data except the pictures are stored in MongoDB.
So let's see how to add the CRUD operations in AngularJS with services in NodeJS with MongoDB.

Step 1
We write in services.js access to our RESTful services:
Step 2
Inject services in app.js:
We use the angularjs services in controllers.js:
Step 3
In server.js we create the HTTP server with the RESTful service in NodeJS and ExpressJS. It is also used to host angularjs app:
Step 4
In adverts.js we write some code in NodeJS which allows us to use MongoDB:
We run MongoDB and start our HTTP server (node server.js). Now we are typing in web browser URL http://localhost:3000/#/. In web browser we should see the MotoAds application and we can use CRUD operations.

If you want to run this example on your computer, you can download sources from GitHub.

Any comment would be highly appreciated.

poniedziałek, 18 listopada 2013

AngularJS resource with JSONP

Lately I struggled to get access to facebook by JSONP. I try to do it in AngularJS with factory and resource. I want to share with people my solution. Let's try to connect to the Facebook Graph. Firstly, we create index.html file with input graph.username, after type a value there is called getGraph(). The result of the calling this function is saved in $scope.result so we can display it. Secondly, in app.js we write controller and factory which creates a resource object that call the Facebook Graph. So when it is called function getGraph we use GraphFacebook factory to call getJSONP passing in argument $scope.graph with username property. This property is used in building URL.
The result of our work:


Source on GitHub

sobota, 9 listopada 2013

AngularJS example MotoAds end-to-end tests

E2E (end-to-end) tests result: Application folders tree:
In previous post I showed how to write and run unit tests. Now, I will present how to test DOM manipulation or the wiring of our application. Angular Scenario Runner which simulates user interactions that will help us to do that.

Recall adverts.html code which we should know to simulate user interaction:
We should write the simple html page for running unit tests (runner.html):
When everything is ready we can start writing tests in scenarios.js.

Step 1
Navigate web browser to index.html which route to adverts.html view:
Step 2
We write first E2E test - filtering by brand and model on real data:
Step 3
We write second E2E test - filtering by country and region:
Step 4
We write third E2E test - filtering by year:
Step 5
We write fourth E2E test - sorting by year:
Step 6
We run E2E test by typing in web browser URL http://localhost:8000/test/e2e/runner.html (motoAds application must be run on the web server). In web browser we should see the same as the screenshot E2E (end-to-end) tests result.

If you want to run this example on your computer, you can download sources from GitHub.

Any comment would be highly appreciated.

piątek, 8 listopada 2013

AngularJS example MotoAds unit tests

Unit tests result: Application folders tree:
In Angular the controller is separated from the view so it is easy to add the unit tests to MotoAds application. Recall the controller code which will be tested (controllers.js): We should write the script for running unit tests (test.bat): We configure Karma for our tests (karma.conf.js): When everything is ready we can start writing tests in controllersSpec.js.

Step 1
We prepare dummy data:
Step 2
Load modules, define dummy services, initialize scope, controller and filter:
Step 3
We write first test - filtering by brand and model:
Step 4
We write second test - filtering by country and region:
Step 5
We write third test - filtering by year:
Step 6
We write fourth test - sorting by year:
Step 7
We run unit test in Node.js command prompt by running test.bat and we should see:
If you want to run this example on your computer, you can download sources from GitHub.

Any comment would be highly appreciated.

sobota, 2 listopada 2013

AngularJS example MotoAds more advanced than the tutorial on angularjs.org

I have just been learning AngularJS and decided to build demo application that cover more techniques than the tutorial on angularjs.org. This application is only demo so it do not have complete server side, some features have the todos and there is not any test.

This demo application is some kind of automotive adverts portal, so I called it MotoAds. It has two main features:
  • List of adverts – includes an advanced filtering and sorting.
  • Add advert – a form with some client side field validations.

MotoAds application looks like this: Application folders tree:

Root file index.html included external resource:
  • bootstrap.css (2.3.2)
  • angular.js, angular-resource.js (1.0.8)
  • ui-bootstrap-tpls-0.6.0.js (0.6.0)
and internal resource:
  • app.css
  • app.js
  • services.js
  • controllers.js

Bootstrap angular application, add navigation and route templates

In index.html we auto-bootstrap the angular application by defining directive ng-app: In app.js we define new angular module motaAdsApp (name must be the same as value of ng-app): In index.html we use Navbar component from the bootstrap library: We define NavbarController with function routeIs (used in ng-class). It allows us to highlight link which is active. We add directive ng-view which renders the proper template into index.html in case of the route definition: Url routes are defined in app.js:

Adverts - list, filtering, sorting

In adverts.html we define the left filtering panel with brands and models. We use the ui.bootstrap.accordion component: In controller.js we write AdvertsController in which we using method Brand.query() to fill $scope.brands: Definition of the Brand service is in service.js - it is the simple service which reads brands.json: Next in adverts.html we write filters for country, region and year (from-to): We add to adverts.html the panel with information which filters are active and the options of removing them: In controller.js we have to fill angular models, define variables and functions which are used by the filters: We define the Country service in service.js: Now we add the sorting option and the table containing the list of adverts: The adverts table is filled in controller.js in this lines: The Advert service is defined in services.js - it reads adverts.json:

Add advert - validation and currency directive



We define the adding advert form in addAdverts.html: We write AddAdvertController in controllers.js: Last thing is custom directive ma-currency used in addAdvert.html: Definition of ma-currency directive is in controller.js:

If you want to run this example on your computer, you can download sources from GitHub and run it on any web server. For example copy folder app to D:\apache\htdocs\app and run in web browser http://localhost/app/index.html.

Any comment would be highly appreciated.