I need to use a customize path for the Ext.Loader in my MVC project. I've already looked through the API and found nothing useable. If I set the loader directly it gets simply overriden, as it seems by the MVC app settings. So how can I customize the loader path for a MVC app?
In addition: It would be awesome if the loader could be tweaked to sumarize multiple requirements that occours by the same source into one request. Would that be possible?
Thanks in advance for any suggestions
Edit
The loader by default calling something like app/controller/MyController.js or app/store/MyStore.js
My goal is to modify this path like load/data/app/controller/MyController or better load/data?ident=app.controller.MyController or best request via JSON
Edit 2
Thanks for all reply! I looked again into the sourcecode of the Ext.app.Application but I could not find where the loader get initialized. Yes, I found the appFolder property but not where it is used. And my Problem with the appFolder approach is, that I can't use routes because of the applied GET param. So guess the best is to modify the Ext.Loader, isn't it? Or is the loader capable of loading entire namespaces?
You can set the 'appFolder' config property in your application if you need to change the root relative to the website.
For example, if you have www.mysite.com but you want to store you .js files in www.mysite.com/scripts/ext/ you could do something like this:
Ext.application({
name: 'MySite',
appFolder: '/scripts/ext'
});
Not sure if that's quite what's being asked here, but might give you a start point.
I guess what you are trying to archive is not possible without many modifications. You have to change the loader for that so that it fit your request needs. I think you may go better to define some routes in your backend and use the approach #dougajmcdonald wrote. I think you will endup in nearly the same.
But you should note that it is much faster when you let Webserver fetch the files then doing it per code.
Related
I am working on a project that uses Angular1, we hit the problem where when we change an html template the users will not see the change until a hard refresh is performed. Ideal would be to have the cache service to check a timestamp and invalidate the cached file. As an example now I edited a template used by the $stateProvider.
My questions is what solutions or best practices are used to solve the problem?
P.S since our JS files are combined in 1 file we fixed the problem there by appending a timestamp in the script tag from our PHP backend
Interesting question! We've had the same issue in a project that uses Angular1.x. We solved it using angular-cache-buster.
It basically helps you put a httpInterceptor. All you need is have ngCacheBuster in module dependency injection, and inject httpRequestInterceptorCacheBusterProvider in the .config of your app to set the match list.
For example,
httpRequestInterceptorCacheBusterProvider.setMatchlist([/.*api.*/], true);
this tells it to cache everything except REST api requests. You can learn more about the configuration here.
js app that I use MEAN stack at that time I didn't know there was such of thing like mean stack. The problem im having is that I use a more common web approach for example I don't handle my routing in angular I use the traditional full page reload using node/express.js.
I have two question for the experience MEAN stack developer first does it worth it to change my routing to use angular so I can have a more traditional MEAN stack app and the second question is what would be a good file structure to my already builded application for example do i make my "/" route to send res.sendfile('./public/index.html');and then I can control the routing for my angular?
I'm just looking for any advice before I make the change. I don't think it would take me that long since I already use all the technologies.
thanks :)
You have the right idea, and I would encourage you to make the switch. First, like you said, it wouldn't take a lot of time to do. Therefore the cost of learning a new approach is minimal and you stand to lose nothing by it. I think you'll be happy with the results. Serve up a single page on / like you suggested, handle routing in angular instead of in the server, and keep your views in your /app folder, or whatever you like to use. The rest of your servers routes can serve as an API for AJAX requests for data.
Our team is constantly working on an angular application, and every week or 2 we update it with new features or correct some bugs that came out.
We are using a C# backend with webservices.
QUESTION: When we update the application on the server, we sometimes (this doesn't happen all the time) get the problem that user is still seeing the old HTML and functionalities. What is the way to solve this?
I didn't find this on google, maybe I'm not looking for the right terms,
any help is appreciated.
Users have to clear their cache to get the new version of the application.
What you are seeing are cached copies of the JS files (possibly HTML partials too).
When the browser parses the HTML page, it makes the request for getting the JS resource and looks at various information before deciding to retrieve either the cached copy (if any) or whether to query the server again.
You can find some extra details on the Google fundamentals on HTTP caching
A solution I have been adopting myself is to set the cache headers to cache the file for a very long period, and then use tools in the build to version the file either on the filename or with a request parameter.
I have used grunt-cache-breaker and found it to serve well for this purpose. I know there is a gulp equivalent too
The most common way to make sure cached versions of your javascript aren't used is adding the version as a parameter in the reference to the script like so:
<script src="/app.js?v=v1.0"></script>
I found interesting link on how to organize my files and load files using require.js http://backbonetutorials.com/organizing-backbone-using-modules/ , the only issue I have with that example is that they load everything in the beginning even asynchronously. I was wondering if it is possible load .js files only when they needed... For example if I click on Project List ( http://backbonetutorials.com/examples/modular-backbone/#/projects ), it checks on which url we are currently located, and load projects.js and list.js after that....
For small apps it would be ok, but for big apps with big classes it might take a while, before all classes will be loaded to the browser, for all routers.
I think creator of that example answered this question more accurately. Here is his answer: http://backbonetutorials.com/organizing-backbone-using-modules/#IDComment-CommentText210764496 , see the reply
First of all, you would really need a big application in order to need that. The files of a normal application, minified and gzipped, are not a significant load. And then you can use caching to load them only once in each browser.
If you really want to, of course you can do partial loading, in the same way you do it for the application in the example (in the router, the projects route will first ensure the project-related js files are loaded, and only then do the fetching/view initialization etc)
The interactive console accessible at localhost:8080/_ah/admin is very useful for debugging your App Engine app.
I always find myself importing the same modules over and over again, particularly models.
I've looked into monkey patching the interactive console to automatically import these models, and I'm stumped. Ideally, I could do it from my app so I wouldn't need to reapply the patch every time I update the SDK.
I'll investigate and hopefully find an answer, please let me know if you have any ideas about how to accomplish this.
Good question! The relevant code for the interactive console is in InteractiveExecuteHandler at google/appengine/ext/admin/init.py:188. Specifically, it executes the code like this:
try:
compiled_code = compile(code, '<string>', 'exec')
exec(compiled_code, globals())
except Exception, e:
traceback.print_exc(file=results_io)
Note that for the globals, it simply uses the globals of the module it's in. So in order to provide your own imports, all you need to do is this:
Create your own module, where you import and subclass InteractivePageHandler and InteractiveExecuteHandler
Import any additional modules and classes you want in your new module - they'll automatically be imported for any code that's executed by them.
Override the generate() function from BaseRequestHandler in those classes so they look for the templates on google/appengine/ext/admin/templates instead of in the 'templates' subdir under your own module.
I ended up using the App Engine Console project which comes with an autoexec.py that provides the functionality I asked about.
I'm not sure if this is at all what you're going for, but you can just edit the html template for the interactive console page to have different default text entered. It's located at:
./google_appengine/google/appengine/ext/admin/templates/interactive.html
This would apply to all your apps, and as you mentioned you'd have to goof with it every time the SDK updated.