JBOSS extjs configuration - extjs

I am developing an application using ExtJS where all related ExtJS file I have to keep in individual web app to be referred.
I want it to configure in JBOSS 6.1 as a module and then referred by any web app in my local.
Is there any way to achieve this.
thanks,

The best way to go would be to follow the "production process" that Sencha defined where you put into a single .js file all your defined classes plus the classes of the framework you are actually using. This is way faster.
http://www.sencha.com/forum/showthread.php?230650-How-to-package-(minify)-an-extjs-4-application
Although if you really want accessible the full framework for some(stubborn manager :P) reason. You can always create a simple Web application with ExtJs inside of it and refer to the classes from other web applications ...
ExtJs.war --> contains the full framework and nothing else
MyCoolEnterpriseApp --> in the html refers to
<script type="text/javascript" src="/ExtJs/extjs-4.2.1/ext-all-debug.js"></script>

Related

How to setup Adobe Analytics in webapp react typescript using Experience Platform Launch

How to setup Adobe Analytics in web app react typescript using Experience Platform Launch?
I have just js scripts like this:
<SCRIPT src="//assets.adobedtm.com/<hash>-staging.js"></SCRIPT>
and
<script type="text/javascript">_satellite.pageBottom();</script>
So, the question is how I can implement page tracking using those two scripts?
I want to create a component to track page switching when users walkthrough
Go to Launch, go into the property that you want to release. Then Go to the Environments:
It will give you the script to deploy:
Once you've deployed and tested the deployments, you can make a rule in Launch. In the rule, you set up triggers, conditions and actions. This explains it well.

Liferay7.0 portlet build with angular and typescript

I'm wondering, is it possible to create a liferay7.0 portlet based on angular(2, angular material v1.1.1) and typescripting.
I know its possible to load (for example) Angular 1.4 lib and create a portlet with plain javascript/angular code
source: https://web.liferay.com/web/sampsa.sohlman/blog/-/blogs/trying-the-angularjs-with-liferay
What i would like to achieve is to create a portlet based on nodejs packages. and to compile it with gulp or something to a war file.
Its Open for discussion.
Possible ways i can see, irrespective of Angular 2 & More focused on Single Page Application In General
Liferay 7 Provides ES6 Support. Your write your ES6 code & Then transpile it & install it as a module. Gradle in Liferay IDE has a option for transpilation & import is a seperate package, which can be used through out all modules in the OSGI Container.
Liferay 7 Introduced Metal JS. Metal JS has template support for SOY & JSX. Again it has same process, write ES6 Code, transpile it , install the module & Use it.
When explored liferay source code it uses babel & not typescript. there are files with extension .es.js. & Liferay uses AMD Module loader, so there needs to be a task for typescript & AMD Loader, which then can be passed. Such task needs to be created & Then loading the module can be done by something like this
require('my-dialog', function(myDialog) {
// your code here
}, function(error) {
console.error(error);
});
Reference :- https://dev.liferay.com/develop/tutorials/-/knowledge_base/7-0/liferay-amd-module-loader
Liferay introduced senna JS. Again its es6 transpiled file, where corresponding to each route we define a page, In that page we can keep a component to be loaded.
Definitively you can integrate Liferay with Angular. Currently exists an official and functional example in:
https://github.com/liferay/liferay-blade-samples/tree/master/gradle/apps/npm/angular-npm-portlet
But my personal recommendation is don't merge in the same page an Angular portlet with an not Angular portlet.
Integrating java based portals with angular is very complicated. Liferay is shipped with AlloyUi. There are side effects for using multiple JS libraries together such as AlloyUI with Angularjs.
Side effects usually manifests themselves in higher load times and possible conflicts. A single angular app protlet is required for every page containing an angular portlet. Once two instances of the same angular portlet are dropped on a page, this will lead to a conflict unless everything is namespaced (<div ng-app="myapp"> ==> <div id="myapp<portlet:namespace/>">).
It is not possible to define URLs in advance as in classic application development with angularjs. Liferay portal uses its own System-generated URLs so generated tags are needed(portlet:defineObjects, portlet:resourceURL ...) to create:
<URLs(portlet:resourceURL id="config"
var="config">/portlet:resourceURL>
<script> var urlConfig = '${config}'; </script>)
and these tags will not be available in javascript file since the javascript loads first.
This end up complicating development with angularjs and URLs handling issues are frequently encountered. A lot of workaround code is required to integrate portal URLs into angular since angular also controls URLS. And this is basically a try to integrate two directly competing technologies.
A compromise between AlloyUI and Angular must be developed, which will cause more dilemma than provide any actual benefit.
To be short, technological agnosticism sounds great in theory, but it practically does not work that well and it has more complications and disadvantages than actual benefits.
If you believe that developing then integrating a standalone web application into a portal can solve the problem, then this should be looked again because login credentials cannot be shared with the embedded application. In this case liferay has no utility.

Use .NET bundling & minification feature in angularjs - index.html

I have a web site with angularjs framework for front-end using index.html and .net REST API services.
I need to achieve something one of followings:
1. I can create a dummy MVC view and write #Scripts.Render(...) to render all the bundled script and whatever I can see chrome developers tool e.g.
/bundles/angular?v=asIfVCRZ0mozQeQR34C1aw1HwLnnZATyODNO8bNn1mY1
I can take this to index.html and put in a way
<script src="/bundles/angular?v=asIfVCRZ0mozQeQR34C1aw1HwLnnZATyODNO8bNn1mY1"></script>
2. This is possible on my local, however I am not sure, if I publish to another server, there random key asIfVCRZ0mozQeQR34C1aw1HwLnnZATyODNO8bNn1mY1 will remain as is.
So questions here are:
Is there any setting to keep this key unchanged?
OR simply handling bundle & minification feature of angularjs-index.html page? note- I do not want to use any of npm packages

How to make an existing AngularJS SPA plugable to other projects

I have an AngularJS app (myApp) currently used only by my own ASP.NET MVC app. The AngularJS is working well in my app. Now other MVC apps also want this as an add-on (plugin). Is this possible to do without modifying my original AngularJS app, and been too intrusive to other apps?
I thought is like this:
distribute the myApp.js to an in-house CDN to be included the BundleConfig.cs by other apps
add a <DIV data-ng-app="myApp"> in pages of other apps so that my original AngularJS can be injected.
Far too many unknowns about how your app is configured for a precise answer but any module can be dependency injected into another module.
For simplicity sake assume that you have all the templates needed to run your app converted to javascript strings and use $templateCache() to register them and all the code for your app is in one file then anyone would be able to inject your module into theirs and use whatever components you have available.
All they would need would be a script tag that points at location for your app file ... and that location could be any server, cdn or local download directory

EntryPoint Classes & Modules in GWT

GWT code structure is really getting hard for me to follow :(.
As per my understandings,
Modules references Entry Point classes.
When a module is loaded entry point classes referenced on it get initiated, and onModuleLoad() of corresponding classes will get executed
HTML host pages need to include a nocache.js file (only if it needs to work with entry point classes)
If my understandings are correct,
In standard web development platforms like asp .net an aspx page refer to a servlet. Here mulitple html pages can refer to a single entry point class.Why?(and this is much complicated?)
When I can expect a module to load? If multiple modules & html pages are there, how we can assign modules to html pages, so that a particular module will load when user requests an html page?
I have an Async service call implemented at onModuleLoad(). And want to call this only for index.html page. But How can I identify the html page at onModuleLoad()?
Why Google proposes GWT for GAE app development?
I am newbie in GWT. I want to follow a good programmig structure for GAE app development. Corrections and suggestions are expecting...
Pls see this to understand how a GWT project is organized: https://developers.google.com/web-toolkit/doc/latest/DevGuideOrganizingProjects
(Bootstrap is also described there, how application loads from the html page)
I think the main thing is that everything compiles to one javascript file.
The app runs in a single page.
In .gwt.xml you define the entry-point of your app.
Also you specify what other modules you inherit.
This is very similar to java or .net applications where you specify what other packages you need. The modules are like libraries. For example if you needed to use JSON you would inherit the json module. Also I don't think to you are obliged to use GWT on the front

Resources