transpile angularjs

web-examples/src/main/groovy/io/vertx/example/web/angularjs/server.groovy

@@ -0,0 +1,206 @@
+import groovy.transform.Field
+import io.vertx.groovy.ext.mongo.MongoClient
+import io.vertx.groovy.ext.web.Router
+import io.vertx.groovy.ext.web.handler.BodyHandler
+import io.vertx.groovy.ext.web.handler.StaticHandler
+@Field def mongo
+def loadData(db) {
+  db.dropCollection("users", { drop ->
+    if (drop.failed()) {
+      throw new java.lang.RuntimeException(drop.cause())
+    }
+
+    def users = new java.util.LinkedList()
+
+    users.add([
+      username:"pmlopes",
+      firstName:"Paulo",
+      lastName:"Lopes",
+      address:"The Netherlands"
+    ])
+
+    users.add([
+      username:"timfox",
+      firstName:"Tim",
+      lastName:"Fox",
+      address:"The Moon"
+    ])
+
+    users.each { user ->
+      db.insert("users", user, { res ->
+        println("inserted ${groovy.json.JsonOutput.toJson(user)}")
+      })
+    }
+  })
+}
+
+vertx.deployVerticle("maven:io.vertx:vertx-mongo-embedded-db:3.0.0-milestone6", { done ->
+  // Create a mongo client using all defaults (connect to localhost and default port) using the database name "demo".
+  mongo = MongoClient.createShared(vertx, [
+    db_name:"demo"
+  ])
+
+  // the load function just populates some data on the storage
+  this.loadData(mongo)
+
+  def router = Router.router(vertx)
+
+  router.route().handler(BodyHandler.create())
+
+  // define some REST API
+  router.get("/api/users").handler({ ctx ->
+    mongo.find("users", [:], { lookup ->
+      // error handling
+      if (lookup.failed()) {
+        ctx.fail(500)
+        return
+      }
+
+      // now convert the list to a JsonArray because it will be easier to encode the final object as the response.
+      def json = [
+      ]
+
+      lookup.result().each { o ->
+        json.add(o)
+      }
+
+      ctx.response().putHeader(io.vertx.core.http.HttpHeaders.CONTENT_TYPE, "application/json")
+      ctx.response().end(groovy.json.JsonOutput.toJson(json))
+    })
+  })
+
+  router.get("/api/users/:id").handler({ ctx ->
+    mongo.findOne("users", [
+      id:ctx.request().getParam("id")
+    ], null, { lookup ->
+      // error handling
+      if (lookup.failed()) {
+        ctx.fail(500)
+        return
+      }
+
+      def user = lookup.result()
+
+      if (user == null) {
+        ctx.fail(404)
+      } else {
+        ctx.response().putHeader(io.vertx.core.http.HttpHeaders.CONTENT_TYPE, "application/json")
+        ctx.response().end(groovy.json.JsonOutput.toJson(user))
+      }
+    })
+  })
+
+  router.post("/api/users").handler({ ctx ->
+    def newUser = ctx.getBodyAsJson()
+
+    mongo.findOne("users", [
+      username:newUser.username
+    ], null, { lookup ->
+      // error handling
+      if (lookup.failed()) {
+        ctx.fail(500)
+        return
+      }
+
+      def user = lookup.result()
+
+      if (user != null) {
+        // already exists
+        ctx.fail(500)
+      } else {
+        mongo.insert("users", newUser, { insert ->
+          // error handling
+          if (insert.failed()) {
+            ctx.fail(500)
+            return
+          }
+
+          // add the generated id to the user object
+          newUser.id = insert.result()
+
+          ctx.response().putHeader(io.vertx.core.http.HttpHeaders.CONTENT_TYPE, "application/json")
+          ctx.response().end(groovy.json.JsonOutput.toJson(newUser))
+        })
+      }
+    })
+  })
+
+  router.put("/api/users/:id").handler({ ctx ->
+    mongo.findOne("users", [
+      id:ctx.request().getParam("id")
+    ], null, { lookup ->
+      // error handling
+      if (lookup.failed()) {
+        ctx.fail(500)
+        return
+      }
+
+      def user = lookup.result()
+
+      if (user == null) {
+        // does not exist
+        ctx.fail(404)
+      } else {
+
+        // update the user properties
+        def update = ctx.getBodyAsJson()
+
+        user.username = update.username
+        user.firstName = update.firstName
+        user.lastName = update.lastName
+        user.address = update.address
+
+        mongo.replace("users", [
+          id:ctx.request().getParam("id")
+        ], user, { replace ->
+          // error handling
+          if (replace.failed()) {
+            ctx.fail(500)
+            return
+          }
+
+          ctx.response().putHeader(io.vertx.core.http.HttpHeaders.CONTENT_TYPE, "application/json")
+          ctx.response().end(groovy.json.JsonOutput.toJson(user))
+        })
+      }
+    })
+  })
+
+  router.delete("/api/users/:id").handler({ ctx ->
+    mongo.findOne("users", [
+      id:ctx.request().getParam("id")
+    ], null, { lookup ->
+      // error handling
+      if (lookup.failed()) {
+        ctx.fail(500)
+        return
+      }
+
+      def user = lookup.result()
+
+      if (user == null) {
+        // does not exist
+        ctx.fail(404)
+      } else {
+
+        mongo.remove("users", [
+          id:ctx.request().getParam("id")
+        ], { remove ->
+          // error handling
+          if (remove.failed()) {
+            ctx.fail(500)
+            return
+          }
+
+          ctx.response().setStatusCode(204)
+          ctx.response().end()
+        })
+      }
+    })
+  })
+
+  // Create a router endpoint for the static content.
+  router.route().handler(StaticHandler.create())
+
+  vertx.createHttpServer().requestHandler(router.&accept).listen(8080)
+})

web-examples/src/main/groovy/io/vertx/example/web/angularjs/webroot/index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset='utf-8'>
+    <title>AngularJs</title>
+    <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
+<body ng-app="CrudApp">
+
+<div class="container">
+    <div ng-view></div>
+</div>
+
+<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
+<script type="text/javascript" src="/js/app.js"></script>
+</body>
+</html>

web-examples/src/main/groovy/io/vertx/example/web/angularjs/webroot/js/app.js

@@ -0,0 +1,57 @@
+angular.module('CrudApp', []).config(['$routeProvider', function ($routeProvider) {
+    $routeProvider.
+        when('/', {templateUrl: '/tpl/lists.html', controller: ListCtrl}).
+        when('/add-user', {templateUrl: '/tpl/add-new.html', controller: AddCtrl}).
+        when('/edit/:id', {templateUrl: '/tpl/edit.html', controller: EditCtrl}).
+        otherwise({redirectTo: '/'});
+}]);
+
+function ListCtrl($scope, $http) {
+    $http.get('/api/users').success(function (data) {
+        $scope.users = data;
+    });
+}
+
+function AddCtrl($scope, $http, $location) {
+    $scope.master = {};
+    $scope.activePath = null;
+
+    $scope.add_new = function (user, AddNewForm) {
+
+        $http.post('/api/users', user).success(function () {
+            $scope.reset();
+            $scope.activePath = $location.path('/');
+        });
+
+        $scope.reset = function () {
+            $scope.user = angular.copy($scope.master);
+        };
+
+        $scope.reset();
+
+    };
+}
+
+function EditCtrl($scope, $http, $location, $routeParams) {
+    var id = $routeParams.id;
+    $scope.activePath = null;
+
+    $http.get('/api/users/' + id).success(function (data) {
+        $scope.user = data;
+    });
+
+    $scope.update = function (user) {
+        $http.put('/api/users/' + id, user).success(function (data) {
+            $scope.user = data;
+            $scope.activePath = $location.path('/');
+        });
+    };
+
+    $scope.delete = function (user) {
+        var deleteUser = confirm('Are you absolutely sure you want to delete?');
+        if (deleteUser) {
+            $http.delete('/api/users/' + user.id);
+            $scope.activePath = $location.path('/');
+        }
+    };
+}

web-examples/src/main/groovy/io/vertx/example/web/angularjs/webroot/tpl/add-new.html

@@ -0,0 +1,25 @@
+<h2>Add new user</h2>
+<div class="row">
+    <div class="col-md-6">
+        <form novalidate name="AddNewForm" id="add-new-form" method="post" action="">
+            <div class="form-group">
+                <label>Username:</label>
+                <input class="form-control" type="text" ng-model="user.username" required />
+            </div>
+            <div class="form-group">
+                <label>First name:</label>
+                <input class="form-control" type="text" ng-model="user.firstName" required />
+            </div>
+            <div class="form-group">
+                <label>Last name:</label>
+                <input class="form-control" type="text" ng-model="user.lastName" required />
+            </div>
+            <div class="form-group">
+                <label>Address:</label>
+                <input class="form-control" type="text" ng-model="user.address" />
+            </div>
+            <button class="btn btn-primary" ng-disabled="AddNewForm.$invalid || isUnchanged(user)" id="add-new-btn" ng-click="add_new(user)">Save!</button>
+            <a href="#/" class="btn">Cancel</a>
+        </form>
+    </div>
+</div>

web-examples/src/main/groovy/io/vertx/example/web/angularjs/webroot/tpl/edit.html

@@ -0,0 +1,27 @@
+<h2>Edit user</h2>
+<div class="row">
+    <div class="col-md-6">
+        <form novalidate name="EditForm" id="edit-form" method="post" action="">
+            <input type="hidden" ng-model="user.id" value="{{user.id}}" />
+            <div class="form-group">
+                <label>Username:</label>
+                <input class="form-control" type="text" ng-model="user.username" value="{{user.username}}" required />
+            </div>
+            <div class="form-group">
+                <label>First name:</label>
+                <input class="form-control" type="text" ng-model="user.firstName" value="{{user.firstName}}" required />
+            </div>
+            <div class="form-group">
+                <label>Last name:</label>
+                <input class="form-control" type="text" ng-model="user.lastName" value="{{user.lastName}}" required />
+            </div>
+            <div class="form-group">
+                <label>Address:</label>
+                <input class="form-control" type="text" ng-model="user.address" value="{{user.address}}" />
+            </div>
+            <button class="btn btn-primary" ng-disabled="AddNewForm.$invalid || isUnchanged(user)" id="add-new-btn" ng-click="update(user)">Update <span class="glyphicon glyphicon-floppy-disk"></span></button>
+            <button class="btn btn-danger" ng-click="delete(user)">Delete <span class="glyphicon glyphicon-trash"></span></button>
+            <a href="#/" class="btn">Cancel</a>
+        </form>
+    </div>
+</div>

web-examples/src/main/groovy/io/vertx/example/web/angularjs/webroot/tpl/lists.html

@@ -0,0 +1,22 @@
+<h2>Users</h2>
+<table class="table table-condensed">
+    <thead>
+    <tr>
+        <th>Username</th>
+        <th>First Name</th>
+        <th>Last Name</th>
+        <th>Address</th>
+        <th>Options</th>
+    </tr>
+    </thead>
+    <tbody>
+    <tr ng-repeat="user in users">
+        <td>{{user.username}}</td>
+        <td>{{user.firstName}}</td>
+        <td>{{user.lastName}}</td>
+        <td>{{user.address}}</td>
+        <td><a href="#/edit/{{user.id}}" class="btn btn-default btn-sm"><i class="glyphicon glyphicon-pencil"></i></a></td>
+    </tr>
+    </tbody>
+</table>
+<a class="btn btn-primary" href="#/add-user">Add New User</a>