Reputation: 25
I have a Backbone view that has to deal with a lot of logic. I'm using require.js and I was wondering what the best way of creating variables is for that view. My current set up is like so.
define([
'jquery',
'underscore',
'backbone',
'pixi',
'tweenlite',
'easepack',
'app/models/tower-item-model',
'app/views/tower-item-view',
'app/templates'
], function($, _, Backbone, PIXI, TweenLite, EasePack, TowerItemModel, TowerItemView, Templates){
'use strict';
// ********* create view variables ************
var numberOfTowers = 1; // this is set by the icons in the top right of the view. Default is 1
var sectionWidth = 180;
var mmToPixelRatio = 180/300;
var currentWidth = 0;
var currentHeight = 0;
var currentDepth = 0;
var frameColourPressed = false;
var hiliteIntensity = 0;
var hiliteUp = true;
var hiliteIntervalID;
var TowerView = Backbone.View.extend({
id: 'tower-view',
className: 'tower-view',
am I right in thinking that these variables are currently in the global namespace? If so I imagine that this is not good. I had another view set up like this and the app was creating several instances of it. I noticed that a change in one of the variables to one instance was affecting all of them.
Is there a simpler way of declaring variables so that they are true instance variables?
Many thanks
Upvotes: 0
Views: 342
Reputation: 270
You can simply add the variable in view class
For example,
var TowerView = Backbone.View.extend(
{
id: 'tower-view',
className: 'tower-view',
currentWidth : 0,
currentHeight : 0,
currentDepth : 0,
frameColourPressed : false,
setTowerHeight : function()
{
console.log(this.currentwidth);
}
});
These are called true class variables, and they will be different for each instance.
Upvotes: 3