ウィンドウのサイズやウィンドウ自体ではなく、ビューがあり、サイズを変更するときに、サイズ変更の開始値と終了値を比較したいと考えています。ただし、JQ-UI の resize ui オブジェクトには元の状態ではなく、前の状態のみが含まれているため、変更をピクセル単位で取得しているだけです (コードを end 関数ではなく resize 関数に入れているためだと思いますが、 var を Backbone View 自体に戻す方法がわかれば解決できるので、本当の問題ではありません)。サイズ変更内からバックボーン ビューに情報を取得するにはどうすればよいですか? self
はグローバルwindow
オブジェクトでありthis
、 のセレクターからの JQuery の結果ですthis.el
。
define([ ... ], function( ... ){
return Backbone.View.extend({
// I also tried to use the event handlers from backbone
events : {
'resize' : 'info'
},
initialize: function(options){
if (options) { ... }
this.el = '#measure-rep-c55';
}
//Dispatch listeners
...
//Binding
this.model.bind('change', _.bind(this.render, this));
$(this.el).on('resize', this.info); // Here I am trying to attach the listener here according the API
this.render();
},
info: function(){
console.log('in info')
},
render: function(){
... //template and other stuff
// JQ-UI resizable
$(this.el).resizable({
aspectRatio: true,
start: function(e, ui) {
// alert('resizing started');
},
resize: function( event, ui ) {
// in here self = window
// and this is the JQuery object
var oldW = ui.originalSize.width;
var newW = ui.size.width;
var deltaWidth = newW - oldW;
var deltaRatio = deltaWidth/oldW;
//HOW TO SEND info (in this case var deltaRatio) back to the backbone view
//I tried getting to the function info() so that I could access the View itself from there
},
stop: function(e, ui) {
// alert('resizing stopped');
}
});
},
});
});