Intersystems Caché + CSP + AngularJS

[Lucas Boeing Scarduelli]

Hi guys,

I wanted to know if anyone has had experience using Caché, CSP and AngularJS , and what is their views regarding the use of this stack.

Regards,

Lucas Boeing Scarduelli

E-mail: lu...@scarduelli.com

Twitter: @lucasscarduelli

Skype: lucas.scarduelli

Github: github.com/lucasscarduelli

[Jason Warner]

I don't have experience with the full stack you mention, but I am very
experienced in each piece. I don't see a reason why AngularJS + CSP
wouldn't work. We currently use .Net + Cache + AngularJS and really love
it. If you do go angular + CSP, I would recommend building a restful API
layer and using $provide and $resource to consume that. Then if you for
some reason decide you don't like CSP, you can move to a different
platform by changing the <csp:> tags. Your endpoints and
factories/services will remain the same.

Jason

> --
> --
> Caché, Ensemble, DeepSee
>
> ---
> You received this message because you are subscribed to the Google
> Groups "Caché, Ensemble, DeepSee" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to intersystems-publi...@googlegroups.com
> <mailto:intersystems-publi...@googlegroups.com>.
> For more options, visit https://groups.google.com/d/optout.

[John Bertoglio]

I am currently using Angular and Cache on a legacy VB6 app, converting it into a SPA (single page app) on the web. We use EWD.js and Node.js on the server side. Frankly, I am not sure where CSP might fit in. The only conceivable reason to use CSP would be if you had a massive system with data stored in Cache Objects and wanted to take advantage of CSP's data binding...which, of course, negates Angular's vastly superior data binding. Using EWD as lightweight middle-ware, you get the ability to build a real-time, true multi-user experience due to the use of web-sockets. And since EWD contains javascript equivalent methods for every key Cache/MUMPS data functions, building data models and a data access layer is easy and fast. EWD even allows you to execute Cache/MUMPS function on the node server side allowing you to talk directly to the Cache data and move it back and forth as JSON objects.

Angular does not really play well with others. I suspect you will end up abandoning CSP as it will have little to do that Angular does not do in a superior fashion. And I would be very surprised if there was not a lot of collisions with CSP-generated JavaScript. Of course, ZEN seems like it would be a nightmare to integrate, but that is another story.

One exception is the Angular-Famo.us lib that has great potential. In some ways it is a solution in search of a problem...but it does allow some amazing UI behaviors. Time will tell if the community actually can use the potential to improve web interfaces.

Good Fortune,

jb

[Bill Farrell]

I've been following this with some interest. The appearance is I've got a task to modernize a load of CSP some time soon. I've used Yii with PHP and MySQL and love the simplicity. Sadly, there is no PDO for Caché (maybe some bright person will collaborate on writing one??). I'm not a fan of Angular but that may be the only reasonable alternative.

Is there a singular "before you start with EWD, here's what you need to plan for and what tools you'll need" document? I've found lots of blog posts and good reviews of EWB but nothing like a planning guide yet. Am I not looking in the right places?

Any clue for finding the right direction would be appreciated.

Thanks!
Bill

--

--
Caché, Ensemble, DeepSee

---
You received this message because you are subscribed to the Google Groups "Caché, Ensemble, DeepSee" group.

To unsubscribe from this group and stop receiving emails from it, send an email to intersystems-publi...@googlegroups.com.

[Nuno Almeida]

Lucas, how are you? how do i get the css and javascript files to be visible by my csp pages? right now i am porting a web app to csp but cannot figure out how to reference the css  and js files from inside cache.

thanks,
Huambo

[rtweed]

Is there a singular "before you start with EWD, here's what you need to plan for and what tools you'll need" document? I've found lots of blog posts and good reviews of EWB but nothing like a planning guide yet. Am I not looking in the right places?

Any clue for finding the right direction would be appreciated.

http://gradvs1.mgateway.com/download/EWDjs.pdf

http://ewdjs.com

https://groups.google.com/forum/#!forum/enterprise-web-developer-community

 

[John Bertoglio]

Bill:

The links Rob Tweed posted will give you a start...actually all you need. If you download the GitHub repo, it contains enough "best practices" in the included demos to get going. What it doesn't cover is AngularJS integration. So I thought I would post an example. A typical task is use ng-repeat to build a table or more sophisticated grid. 

For this table we want to display some of the contents of a language localization module that holds all the strings used in our application. The task of the two functions below is to fetch the contents of a Cache global that contains a list of supported countries/languages and pass that information to the controller that renders the table.

To get the data, we use Simon's Tweeds implementation of MicroServices in an Angular data service. This is rudimentary service that simply returns the entire table. We could pass it parameters to refine the search but given the nature of this table, we probably never will.

  /*

  ^LanguageCode(1,"Code")         = "af-ZA"

  ^LanguageCode(1,"Country")      = "South Africa"

  ^LanguageCode(1,"CultureCode")  = "0x0436"

  ^LanguageCode(1,"ISO639x")      = "AFK"

  ^LanguageCode(1,"LanguageName") = "Afrikaans"

  */

  // Data service

  angular

    .module('patsApp.grids')

      .factory('LanguageCodeDataService', ['$q',

        function($q) {

          var deferred = $q.defer();

          EWD.sockets.sendMessage({

            type     : 'getAllLanguageCode',

            service  : 'patsLocaleServices',

            params   : {

              /* no params for entire global load */

            },

            done: function(messageObj) { 

              deferred.resolve(messageObj.message.data)

            }

          });

          return deferred.promise;

        }

      ])

The data is contained in the promise. We use the promise technique because the data fetch is async...we will get the data but we can't be sure the controller will get it to our table before its simple HTML structure is rendered. Heres the controller that uses the data service:

  // Controller

  angular

    .module('patsApp.grids')

      .controller('LanguageCodeSummaryTableController', ['$scope', 'LanguageCodeDataService',

        function( $scope, LanguageCodeDataService) {

          LanguageCodeDataService

            .then(function(languageCodeItems) {

              $scope.languageCodeItems = languageCodeItems;

            }, 

            function(error) {

              $scope.error = error;

              console.log('++> [LanguageCodeDataService] '+ error)

              $scope.languageCodeItems = [];

            }

          );   

          if (PATSConfig.cLog.showControllerLog) {console.log('---- > [ Called: LanguageCodeSummaryTableController ]') }

        }

      ]); 

We inject the data service into the controller and when it is available it gets added to the $scope of the HTML table object on our page. All the fields (nodes) of the table are present in the $scope.languageCodeItems array but we can use whichever ones make sense for our table display.

Perhaps the coolest thing is that this backend service:

           type     : 'getAllLanguageCode',

           service  : 'patsLocaleServices',

 

managed by node server-side EWD, has all the plumbing to extract the data from the Cache database using javaScript-equivalents of familiar Cache functions such as $get and $order. A web page designer does not need any understanding of HOW languageCodeItems is populated...they just call data service and build out the grid or table as they desire.

Perhaps even more interesting is that this entire process does not have a single line of COS/MUMPS anywhere! We are using plenty of COS, of course, because that is the language all the business logic of our legacy app is written in. But new features only need COS if we need to do massive high-speed data transformations inside the database itself.

Since EWDjs can call ObjectScript functions from JavaScript, we can continue to use the often arcane and complex functions that provide the app with sophisticated statistical analysis. (They have worked for 30 years...no sense in reinventing mathematics)..

Hope this gives you some insight into how AngularJS can integrate with Cache. Give how slick this is, it is hard to see the advantage of a PDO unless one had a huge amount of happily working PHP apps...but it looks like the code above could be adapted to build one out. (Not, by me...way to much work and with Angular/EWD/Node/Cache (CANE?) I don't see much of a role for PHP. :) 

There was a lot I left out here...post is too long already. If you want to see the backend JavaScript that uses EWDjs to get or set the data and/or the html snippets that are populated by the code above let me know and I can share them off list.

jb

To unsubscribe from this group and stop receiving emails from it, send an email to intersystems-public-cache+unsub...@googlegroups.com.

[Bill Farrell]

Thanks, John! That's pretty straightforward. The curve for me will be in learning Angular well. I've written Cache MVBasic, COS, PHP, HTML, and JavaScript for years. Taking on another framework shouldn't be a big deal. (In tiny shops you learn to do it all <smile>)

Best regards,
B

To unsubscribe from this group and stop receiving emails from it, send an email to intersystems-publi...@googlegroups.com.

[John Bertoglio]

Bill:

Gotta tell you: Angular will take you on an emotional roller coaster. This graph from fullstack,info (while clever and funny) is a fairly accurate analysis of the process: 

There is so much to grasp, it is daunting sometimes but it is worth it. And the ability of Cache to natively store and consume JSON objects makes it a natural backend. Oddly, the new database, MongoDB also is multidimensional and has the same ability. I think Mongo (despite the number of large web enterprises that use it) is not at a point where it can fully compete with Cache, especially at the enterprise, mission-critical end of the use spectrum. But I do use their documentation of "global data structures" to explain the concept to customers. Despite a 30 year head start, I can't find anything from InterSystems that does a better job of explaining the vast power of sparse array data storage.

While I fully understand the importance of being able to project your Cache data to SQL to talk to the outside world, I have always felt that ISC could do a lot more with the concepts of basic, raw globals. Like Angular, wrapping your head around multidimensional globals can be a challenge (at least compared to projecting rows, columns and tables). But I think that the power and flexibility is worth it. On the other hand, Cache Objects make a great repository to organize and use business logic compared to tag^routine constructs. I hope the next iteration of cache.node directly supports calls to object methods so we don't have to wrapper them in tag^routine syntax.

jb

[Bill Farrell]

I have fooled with Angular but haven't got to get terribly deeply into it. I've worked with WordPress, glFusion, Xoops (back in the day), and a few others. I much prefer Yii's neat division of labor. I've been working on growing a framework I'd made for UniVerse a while back into something fairly Yii-like. It's rather the opposite approach: let the Cache programmers do what they do best and allow the framework to do the sloggy part of building the scripts and presentation. That's going to take a few more weeks to tidy up. I may not have the luxury of time to re-face a site I'm on contract to do now with it.

It's rather a pity nobody has written a PHP PDO for Cache. Otherwise I'd have gone that direction. With this company I'm working for, LAMP for presentation would have been an easy sell -- and a major labor saver for me. PHP's notion of arrays and Cache globals are nearly identical. It would be a natural fit. Buuuuuut...

Ya gotta run what they brung. Such is the life of a contractor.

Heh, gotta smile at the folks who think Mondo's multidimensional storage is Some Big New Thing. The rest of us have been working with Pick/U2 and Cache for decades. I worked at one design firm where they refused to listen to anything about Cache or U2 (and certainly not CacheMV) ("we don't want to know anything about multidimensional whatevers. This is a MySQL shop!") but jumped right into Mondo. ("Do you think you can get your head around Mondo's storage scheme?" "You are pulling my leg, aren't you?" <smile>)

I'm off to read more about EWS and Angular. I have a feeling that will be time well-spent.

Thanks again,
B

[John Bertoglio]

For fun, look at the Mongo docs about data storage. They explain and promote the concepts of multi-dimensional "globals" (not their term, of course) than ISC or any other MUMPS vendor I am aware of.

jb 

You received this message because you are subscribed to a topic in the Google Groups "Caché, Ensemble, DeepSee" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/intersystems-public-cache/dgpP_YJs0lk/unsubscribe.
To unsubscribe from this group and all its topics, send an email to intersystems-publi...@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

John A. Bertoglio
Co-Laboratory, Inc.
503.330.6713

[rtweed]

Indeed so - probably the best presentation I've seen about Mumps at a conference was given by Will LaForest from MongoDB at the 2013 OSEHRA Conference in DC:

http://osehra.org/sites/default/files/NoSQLtheModernMUMPS.pdf

Ironically, I was the next speaker on that same session :-)

Rob

[Jonathan DeVries]

I have used angularjs with cache, use cache 2014.2 and the REST dispatch class (in web application config), works fine.  2014.2 has a new zconvert which I use all the time $zconvert(,,"JSON")

You do need to make sure your content type is correct when you post back to cache.

Also, if you need to deal with UTF-8 inbound on POST/PUT you will need to roll that your self as cache doesn't support that.