8:00 – 6:00 SR

• Lenny’s using the FR app. So far the only change is that the scheme for saving the project needs to change. Portfolio managers will probably be the last people to touch the submission, so save needs to be supported earlier.
• Updated my resume to reflect my shiny new MS. I guess it’s a sign of the times, but I have a lot of resumes to update…
• Test TypeScript server access code. If that works, then change the login directive.
• And it works! I had to change the calling function from this:

(function(angular, queryServicePtr, queryPtr, passwordDialogPtr, undefined) {
   "use strict";
   angular.module('phpConnection', [])
      .factory('QueryService', ['$http', queryServicePtr]);
   angular.module('queryApp', ['phpConnection'])
      .controller('MainCtrl', ['$http', 'QueryService', queryPtr])
      .directive('passwordDialog', ['$http', 'QueryService', passwordDialogPtr]);
})(
   angular,
   globalUtils.appMap.phpFactories.queryServicePtr,
   globalUtils.appMap.queryControllers.queryPtr,
   globalUtils.appMap.passwordDirectives.passwordDialogPtr
);

• To this JavaScript version…

(function(angular, queryServicePtr, queryPtr, passwordDialogPtr, undefined) {
   "use strict";
   angular.module('phpConnection', [])
      .service('QueryService', ['$http', queryServicePtr]);
   angular.module('queryApp', ['phpConnection'])
      .controller('MainCtrl', ['$http', 'QueryService', queryPtr])
      .directive('passwordDialog', ['$http', 'QueryService', passwordDialogPtr]);
})(
   angular,
   PhpConnectionService.UrlAccess,
   globalUtils.appMap.queryControllers.queryPtr,
   globalUtils.appMap.passwordDirectives.passwordDialogPtr
);

• And lastly, to TypeScript:

/// <reference path="../../definitelytyped/angularjs/angular.d.ts" />
/// <reference path="../../libs/novetta/services/phpConnectionService.d.ts" />
/// <reference path="../../libs/novetta/directives/PasswordDirectivesTS.d.ts" />

// we do this to accommodate the globalUtils JavaScript object from libs/novetta/globals/globalUtils.js
interface IGlobalUtils{
   appMap:any;
}
declare var globalUtils:IGlobalUtils;

module QueryApp {
   class AngularMain {
      serviceModule:ng.IModule;
      appModule:ng.IModule;

      public doCreate(angular:ng.IAngularStatic,
                  queryServicePtr:Function,
                  queryControllerPtr:Function,
                  passwordDialogPtr:Function){

         this.serviceModule = angular.module('phpConnection', []);
         this.serviceModule.service('QueryService', ['$http', queryServicePtr]);

         this.appModule = angular.module('queryApp', ['phpConnection']);
         this.appModule.controller('MainCtrl', ['$http', 'QueryService', queryControllerPtr]);
         this.appModule.directive('passwordDialog', ['QueryService', passwordDialogPtr]);
      }
   }

   new AngularMain().doCreate(angular,
      PhpConnectionService.UrlAccess,
      globalUtils.appMap.queryControllers.queryPtr,
      PasswordDirectives.BaseLoginDirective.ctor
   );
}

• That’s it!
• Now, for completeness, here’s the full TypeScript module with the UrlAccess service:

/// <reference path="../../../definitelytyped/angularjs/angular.d.ts" />

module PhpConnectionService{

   export interface IUrlAccess{
      setPasswordUrl(newUrl:string):void;
      setQueryUrl(newUrl:string):void;
      getPasswordUrl():string;
      getQueryUrl():string;
      submit(query:string, goodResponse:any, errorResponse:any):ng.IPromise<any>;
   }

   export class UrlAccess implements IUrlAccess{
      private passwordUrl:string = 'iopass.php';
      private queryUrl:string = 'io2.php';
      private httpService:ng.IHttpService;

      constructor($http:ng.IHttpService){
         this.httpService = $http;
      }

      static buildParams(obj:any):string {
         var query:string = '';
         var name:string;
         var value: any;
         var fullSubName:string;
         var subName:string;
         var subValue:any;
         var innerObj:any;
         var i:number;

         for(name in obj) {
            if(obj.hasOwnProperty(name)) {
               value = obj[name];

               if(value instanceof Array) {
                  for(i = 0; i < value.length; ++i) {
                     subValue = value[i];
                     fullSubName = name + '[' + i + ']';
                     innerObj = {};
                     innerObj[fullSubName] = subValue;
                     query += UrlAccess.buildParams(innerObj) + '&';
                  }
               }
               else if(value instanceof Object) {
                  for(subName in value) {
                     if(value.hasOwnProperty(subName)) {
                        subValue = value[subName];
                        fullSubName = name + '[' + subName + ']';
                        innerObj = {};
                        innerObj[fullSubName] = subValue;
                        query += UrlAccess.buildParams(innerObj) + '&';
                     }
                  }
               }
               else if(value !== undefined && value !== null) {
                  query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
               }
            }
         }

         return query.length ? query.substr(0, query.length - 1) : query;
      }

      public setPasswordUrl(newUrl:string):void{
         this.passwordUrl = newUrl;
      }

      public setQueryUrl(newUrl:string):void{
         this.queryUrl = newUrl;
      }

      public getPasswordUrl():string{
         return this.passwordUrl;
      }

      public getQueryUrl():string{
         return this.queryUrl;
      }

      public submit(query:string, goodResponse:any, errorResponse:any):ng.IPromise<any> {
         var upstring:string = encodeURI("query=" + query);
         var upObj:ng.IRequestConfig = {
            url: this.getQueryUrl(),
            method: "POST",
            data: upstring,
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
         };
         return this.httpService(upObj).then(goodResponse, errorResponse);
      }

      public setPassword(userName:string, userPassword:string, goodResponse:any, errorResponse:any):ng.IPromise<any> {
         var postObj = {query: 'set_password', name: userName, password: userPassword};
         var upObj = {
            url: this.getPasswordUrl(),
            method: "POST",
            data: postObj,
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            transformRequest: UrlAccess.buildParams
         };

         return this.httpService(upObj).then(goodResponse, errorResponse);
      }

      public checkPassword(userName:string, userPassword:string, goodResponse:any, errorResponse:any):ng.IPromise<any> {
         var postObj = {query: 'check_password', name: userName, password: userPassword};
         var upObj = {
            url: this.getPasswordUrl(),
            method: "POST",
            data: postObj,
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            transformRequest: UrlAccess.buildParams
         };

         return this.httpService(upObj).then(goodResponse, errorResponse);
      }
   }
}

• Found a great resource for mapping js to ts, including this wonderful line:  “This is the universal sink unblocker of TypeScript“. I needed to handle the case of globalUtils making the tsc complain. Fixed as follows:

// we do this to accommodate the globalUtils JavaScript object from libs/novetta/globals/globalUtils.js
interface IGlobalUtils{
   appMap:any;
}
declare var globalUtils:IGlobalUtils;

• So now we have the main calling app done in TS.

8:00 – 5:00 SR

• Deploying new FR, with debugging. Everything but the login works. Dong is perplexed.
• More Angular. Working on figuring out how to do complex directives. Huh. The secret is to understand that directives are static. And it turns out that factories are static too.
• I’ve got my test app now working with
  • a controller
  • a service
  • a directive (with link function)
  • a factory.
• Next, inheritance on all of the above.
  • Back to TypeScriptEssentials….
  • Modified the command line for the tsc compiler (under ‘watch’). It’s now tsc.cmd –declaration –noImplicitAny –target ES5 –sourcemap <filename>
  • Inheritance works like a charm. Classes with static functions (Factories and Directives) are a bit problematic, since there’s no ‘this’ to refer to. This means that functions are referred to by their fully qualified name (i.e. TestDirective.foo(), rather than this.foo()). Overloading can’t quite work the way that I’d like to. That being said, the static functions do come along for the ride, so as long as all the references are updated, everything works the way it should.

8:00 – 10:00, 12:00 – 5:30 SR

• DB backups
• Worked with Dong to install FR on the test server. The services still aren’t working. Maybe missing jar files?
• Status report
• More Angular
  • Tried making factories work but I got stuck trying to access the object’s this. Since they are structured differently but generally have the same functionality(ish), I tried configuring the TypeScript class as a service. That worked just fine – I was able to access public variables and functions through dependency injection.
  • Discovered that the ‘static’ keyword allows for directives to work with classes. THis might also be true for factories. The issue to work through is how the link function connects to the directive. Components like the scatterplot are big directives, and can’t be crammed into a single method in a class.
• Timesheet!