Backbone.js rendering multiple templates on the same view - templates

I'm just starting with Backbone.js. I'm building a Single Page Application and trying to figure out how I can handle this situation.
Depending on the view I'm rendering, I need to output multiple templates, meaning I have a wrapper that I use for the main template, and other 2 templates that go on other parts of the HTML.
I started by manually outputing the templates, but that got me thinking how correct that approach was, as it would require me to manually delete them whenever I navigate to other view.
The question is, How can I effeciently render multiple templates in a single view (that are appended in different places) and still have control over the deletion on the entire view and undelegating its events?

I'd check out Addy Osmani's walkthrough for developing with backbone.js.
http://addyosmani.github.io/backbone-fundamentals/
It walks through the example todo app, and then one more complicated one. What I think you want specifically is to use a framework such as Marionette.js to orchestrate and automate some of the event delegation and removal when you play with your views. If this is the case, skip to http://addyosmani.github.io/backbone-fundamentals/#marionettejs-backbone.marionette and read on about how marionette will help organizing views into regions and layouts as #NathanInMac said.

You need a layout with a couple of regions.
Then put your sub-views in these regions.

Related

What is the best way to fin and use a template in cakephp 3

i'm new in cakephp and I have started with version 3. I want to build a beautifull app and because I'm not good in design, I would really like to use a free template or buy one that I can use within cakephp.
So, I would really appreciate all your propositions and ideas or best practises. The easy way will be the best because I don't have a lot of time with this project. Thank you in advance.
If you don't have a lot of time like you mentioned, the easiest way to go ahead and get started is to paste a lot of the code in your default.ctp layout inside of src/Template/Layout/default.ctp.
You'll notice there are some lines of PHP already in there that are relevant to fetching blocks of css, meta tags, and other bits of code that could potentially exist throughout your project.
Find the main layout of the theme your trying to use - the one that will be consistent across most of the pages. That's the one you'll use for default.ctp. Compare what's already in default.ctp and make the comparable adjustments around the HTML in that document while keeping the important lines of PHP there as well.
For other important pages like a login or registration page, just create a new document for those, like 'login.ctp', then inside the function that loads the page (maybe 'login' inside of UsersController'), change the default layout with this line of code:
$this->viewBuilder()->layout('login'); // without the .ctp ending
This way you can create one-off layouts that don't really match any other page.

angularJs templating

I'm new to angular and I'm looking for a way to achive more advanced templating that one mentioned in the tutorial here
1.) I would like to have a different template for the login page and another one after you are logined
2.) it would be nice to have a functionality of multiple ng-view-s so you can have diferent pieces of the template filed diferently on every url...is it possible to achive this in angular
3.) is there a beter/easyer templating mechanisem to use, meybe some other js framework?
The ideall would be to use something like facelets but on client.
While it is not possible to have multiple ng-views, you can certainly have more than one routes, each one mapped to a controller and a view. It will help to do further reading on how to use controllers, routes etc. You can also use ng-include one ore more times with static or dynamic template urls mapped to a variable in the controller.
AngularJS is one of the best (if not the best) multi-feature JS UI frameworks available in terms of MVCness, extensibility, fine tuning, testing, data binding, templating etc. You cannot generally go wrong with it, just need to spend some time initially getting used to the patterns, idioms and terminology.
I would suggest looking into ui-router for doing nested views.

Concerning the Typical Behavior of Controllers in Ember

Are controllers in ember.js meant to be tied to main view areas/scenes a la iOS, or more tied to a set of data?
Is it common/wise to have several main views tied to the same controller in ember?
In iOS main portions or sections of the screen are tied to a single controller. If you want to present another main interface, say a modal window to create a new element, you (typically) have an entirely separate controller to manage that view and its data/logic.
In something like Zend Framework, you have controllers that might perform some common spinup steps of ensuring authentication, but largely the actions play the role that controllers do in iOS, handling the logic and providing the data for 1 main section or view (being the web, this usually ends up being the whole page).
What is that typical role or advised pattern for using controllers in ember?
You have a couple different questions here so I'll address them one at a time.
First, you asked if controllers should be data oriented or view oriented. In my experience both behaviors are allowable. Controllers are an excellent way to manage data sets for your application, including things like filtering and searching. Evin Grano wrote a good post about this from the SproutCore perspective and most of the concepts should apply to Ember as well: http://www.itsgotwhatplantscrave.com/2009/07/30/root-controller-paradigm/. Controllers are also well suited for controlling the application state and behavior. For example, you might put a method in a controller that is bound to as a button action elsewhere in your app. However, you should also examine Ember States to see if these might be better suited to your scenario.
Secondly, you asked about tying multiple views to the same controller. Personally, I see no concerns with this as long as the controller maintains a distinct purpose. If the views are logically related and share in the same state or data then a single controller makes sense. If you find the controller growing to cover too many different areas, you should consider splitting it into multiple controllers.
From my limited experience in Ember.js, I have regulate to the following:
The view handles user actions related to changes in the presentation layer, limited to its own instance.
A navigation controller/statemanager handles complex manipulation of what is presented (add multiple views, remove some other, etc.).
The controller responds to user actions related to the data layer.

Using the Coldbox framework, is there a way to intercept a renderView call and execute a different template?

I am trying to learn Coldbox to perhaps replace the current framework I am using. One of the features that I currently use is the ability to override any of the template inclusions by convention.
Essentially, lets say I have a view, "views/home.cfm"
<h1>I am the default theme</h1>
and that is all well and good. But lets say that I have a different view, "themes/[theme-name]/views/home.cfm"
<h1>I am the user chosen theme</h1>
that I want to include conditionally (say there is a cookie to determine what theme is in use). Also, if the file does not exist, the default/fallback view should be rendered.
Is there any way of doing this overriding the system functions?
I looked at interceptors, and the preViewRender and postViewRender interceptors seem like the place to do something like this, but there doesn't seem to be any way of manipulating the actual workflow. If seems to be mainly pre/post processing of the content. For instance, there doesn't seem to be a way to "return false" to tell the renderView method to not actually render the view. Or any way to affect the location in which the view is to be found.
Any ideas?
Tyler,
The ColdBox Framework is quite flexible. It is possible to do what you desire but I don't think modifying renderView() is the best way to resolve this--although, you most definitely can.
I would encourage you to create a User Defined Function in the /includes/helpers/ApplicationHelper.cfm file that contains the logic you require. The functions that are added to this helper file are accessible from anywhere in the framework. This would allow you to create a function called "renderSkin()" that contains the logic you need. RenderSkin() would ultimitly call "renderView()" when you finally figured out which template you wanted to render for that user.
Respectfully,
Aaron Greenlee
I would suggest you go with the interceptor route, but change the layout instead of the view.
From the postEvent interceptor you can get the processedEvent key from the interceptData to change the layout.
Otherwise you could just make the check part of the layout page. The layout can the be a switch statement (or a more OO approach) $including the themed layout files as needed. This has the advantage of giving you a chance to emit custom interception points and having common functionality (css, js)

Calling small app in template

Lets say I have a website with a small application that lists the 10 newest members, or something dynamic like that. I want this to view on every page, perhaps in a sidebar. How would i go about doing this.
My thoughts on the matter. I might not get the whole django thing just yet, but when I have a url like /foo/ calling a view bar - but what info do I have to send to the template from this view. Does every view have to send the info to the template (just so I can view my app) or is there someway to call this from the template instead.
I have tried to read through the documentation, but its seems I just can't understand this.
The usual way to provide '10 newest members' type of information from other apps is via a template tag. See this article by James Bennett on best practices (although note it's a bit out of date, as it was written before the inclusion_tag and simple_tag shortcuts were available).
Create a template tag that you can call on the page
Create a context processor and inject extra context variables onto each pageload
I'm sure there are other ways of doing this but those are probably the most logical two. The first gives you more power and will waste less processing time (for pages where you don't want to display the data) but a context processor is much more simple to write (you don't have to bend over backwards to please the template_tag gods).
Both are valuable things to know so there you go. Go and learn!
"Does every view have to send the info to the template (just so I can view my app)"
Yes.
"Is there someway to call this from the template instead."
No.
Your views are just functions. Functions can call other functions. That's ordinary good design. You can still do ordinary good design in Django.
You do have the ability to provide a "context". This is still done in the views to provide additional "context" for the templates. See http://docs.djangoproject.com/en/dev/ref/templates/api/#writing-your-own-context-processors for writing your own context processor.
Nothing (well almost nothing) is done in the template except render the objects provided by the view into HTML (or XML).
If you have a page that is an amalgamation of stuff from many small apps, then you have two tiers of apps.
Independent Apps.
Composite Apps that depend on Composite or Independent Apps.
Your composite app can call other app view functions to gather data.
Your composite app template can include other app template elements to present that data.
You have all the power of Python to decompose the independent apps into "data production" functions, view functions, template components and final page templates.
An independent app Page will use a view function and a template. The view function will use the data production functions. The template will use template components.
Decomposition still works, even in Django.