better resizing in editor
This commit is contained in:
parent
df324f8efa
commit
d4a17c5972
1 changed files with 49 additions and 30 deletions
|
@ -1520,12 +1520,14 @@ requires
|
||||||
}
|
}
|
||||||
|
|
||||||
function dragStart(e) {
|
function dragStart(e) {
|
||||||
|
if (!self.options.collapsed) {
|
||||||
self.startPos = e[self.clientXY];
|
self.startPos = e[self.clientXY];
|
||||||
self.startSize = self.options.size;
|
self.startSize = self.options.size;
|
||||||
Ox.print('startSize', self.startSize)
|
Ox.print('startSize', self.startSize)
|
||||||
$window.mousemove(drag);
|
$window.mousemove(drag);
|
||||||
$window.one('mouseup', dragStop);
|
$window.one('mouseup', dragStop);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function dragStop() {
|
function dragStop() {
|
||||||
$window.unbind('mousemove');
|
$window.unbind('mousemove');
|
||||||
|
@ -1780,7 +1782,7 @@ requires
|
||||||
triggerResizeEvent();
|
triggerResizeEvent();
|
||||||
}
|
}
|
||||||
|
|
||||||
function resize(event) {
|
function resize(event) { // fixme: reserved jquery string?
|
||||||
var documentWidth = $document.width(),
|
var documentWidth = $document.width(),
|
||||||
documentHeight = $document.height(),
|
documentHeight = $document.height(),
|
||||||
elementWidth = that.width(),
|
elementWidth = that.width(),
|
||||||
|
@ -1899,7 +1901,7 @@ requires
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
that.resize = function(width, height, callback) {
|
that.size = function(width, height, callback) {
|
||||||
$.extend(self, {
|
$.extend(self, {
|
||||||
initialWidth: width,
|
initialWidth: width,
|
||||||
initialHeight: height
|
initialHeight: height
|
||||||
|
@ -5767,8 +5769,8 @@ requires
|
||||||
that.$element.closePreview();
|
that.$element.closePreview();
|
||||||
};
|
};
|
||||||
|
|
||||||
that.resize = function() {
|
that.size = function() {
|
||||||
that.$element.resize();
|
that.$element.size();
|
||||||
}
|
}
|
||||||
|
|
||||||
that.sortList = function(key, operator) {
|
that.sortList = function(key, operator) {
|
||||||
|
@ -6001,7 +6003,7 @@ requires
|
||||||
updateQuery();
|
updateQuery();
|
||||||
Ox.print('s.o', self.options)
|
Ox.print('s.o', self.options)
|
||||||
that.addEvent(self.keyboardEvents);
|
that.addEvent(self.keyboardEvents);
|
||||||
$window.resize(that.resize);
|
$window.resize(that.size);
|
||||||
|
|
||||||
function addAboveToSelection() {
|
function addAboveToSelection() {
|
||||||
var pos = getAbove();
|
var pos = getAbove();
|
||||||
|
@ -6204,6 +6206,10 @@ requires
|
||||||
), 0);
|
), 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getPageByPosition(pos) {
|
||||||
|
return parseInt(self.options.pageLength / pos);
|
||||||
|
}
|
||||||
|
|
||||||
function getPositions() {
|
function getPositions() {
|
||||||
Ox.print('getPositions', $.map(self.selected, function(v, i) {
|
Ox.print('getPositions', $.map(self.selected, function(v, i) {
|
||||||
return self.ids[v];
|
return self.ids[v];
|
||||||
|
@ -6223,6 +6229,7 @@ requires
|
||||||
|
|
||||||
function getPositionsCallback(result) {
|
function getPositionsCallback(result) {
|
||||||
Ox.print('getPositionsCallback', result)
|
Ox.print('getPositionsCallback', result)
|
||||||
|
var pos = 0;
|
||||||
if (result) {
|
if (result) {
|
||||||
$.extend(self, {
|
$.extend(self, {
|
||||||
ids: {},
|
ids: {},
|
||||||
|
@ -6232,8 +6239,14 @@ requires
|
||||||
Ox.print('id', id, 'pos', pos)
|
Ox.print('id', id, 'pos', pos)
|
||||||
self.selected.push(pos);
|
self.selected.push(pos);
|
||||||
});
|
});
|
||||||
|
pos = Ox.min(self.selected);
|
||||||
|
self.page = getPageByPosition(pos);
|
||||||
}
|
}
|
||||||
load();
|
that.scrollTop(0);
|
||||||
|
that.$content.empty();
|
||||||
|
loadPages(self.page, function() {
|
||||||
|
scrollTo(pos);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPrevious() {
|
function getPrevious() {
|
||||||
|
@ -6277,12 +6290,6 @@ requires
|
||||||
return self.selected.indexOf(pos) > -1;
|
return self.selected.indexOf(pos) > -1;
|
||||||
}
|
}
|
||||||
|
|
||||||
function load() {
|
|
||||||
that.scrollTop(0);
|
|
||||||
that.$content.empty();
|
|
||||||
loadPages(self.page);
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadPage(page, callback) {
|
function loadPage(page, callback) {
|
||||||
if (page < 0 || page >= self.pages) {
|
if (page < 0 || page >= self.pages) {
|
||||||
!Ox.isUndefined(callback) && callback();
|
!Ox.isUndefined(callback) && callback();
|
||||||
|
@ -6340,8 +6347,7 @@ requires
|
||||||
function loadPages(page, callback) {
|
function loadPages(page, callback) {
|
||||||
var counter = 0,
|
var counter = 0,
|
||||||
fn = function() {
|
fn = function() {
|
||||||
counter++;
|
++counter == 2 && !Ox.isUndefined(callback) && callback();
|
||||||
counter == 2 && !Ox.isUndefined(callback) && callback();
|
|
||||||
};
|
};
|
||||||
loadPage(page, function() {
|
loadPage(page, function() {
|
||||||
loadPage(page - 1, fn);
|
loadPage(page - 1, fn);
|
||||||
|
@ -6651,7 +6657,7 @@ requires
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
that.resize = function() {
|
that.size = function() {
|
||||||
if (self.options.orientation == 'both') {
|
if (self.options.orientation == 'both') {
|
||||||
var rowLength = getRowLength(),
|
var rowLength = getRowLength(),
|
||||||
pageLength = self.pageLengthByRowLength[rowLength];
|
pageLength = self.pageLengthByRowLength[rowLength];
|
||||||
|
@ -6667,7 +6673,7 @@ requires
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
} else if (self.options.type == 'text') {
|
} else if (self.options.type == 'text') {
|
||||||
Ox.print('that.resize, type==text')
|
Ox.print('that.size, type==text')
|
||||||
emptyFirstPage();
|
emptyFirstPage();
|
||||||
fillFirstPage();
|
fillFirstPage();
|
||||||
}
|
}
|
||||||
|
@ -7192,9 +7198,9 @@ requires
|
||||||
that.$body.closePreview();
|
that.$body.closePreview();
|
||||||
};
|
};
|
||||||
|
|
||||||
that.resize = function() {
|
that.size = function() {
|
||||||
setWidth();
|
setWidth();
|
||||||
that.$body.resize();
|
that.$body.size();
|
||||||
}
|
}
|
||||||
|
|
||||||
that.resizeColumn = function(id, width) {
|
that.resizeColumn = function(id, width) {
|
||||||
|
@ -8869,7 +8875,7 @@ requires
|
||||||
Ox.print(self.options.elements[pos])
|
Ox.print(self.options.elements[pos])
|
||||||
};
|
};
|
||||||
|
|
||||||
that.resize = function(id, size) {
|
that.size = function(id, size) {
|
||||||
// one can pass pos instead of id
|
// one can pass pos instead of id
|
||||||
var pos = Ox.isNumber(id) ? id : getPositionById(id);
|
var pos = Ox.isNumber(id) ? id : getPositionById(id);
|
||||||
// Ox.print('pos', pos, self.options.elements, $.map(self.options.elements, function(v, i) { return v.element.options('id'); }))
|
// Ox.print('pos', pos, self.options.elements, $.map(self.options.elements, function(v, i) { return v.element.options('id'); }))
|
||||||
|
@ -9223,6 +9229,10 @@ requires
|
||||||
margin: 8
|
margin: 8
|
||||||
});
|
});
|
||||||
|
|
||||||
|
that.css({
|
||||||
|
height: ((self.height + self.margin) * self.lines + 4) + 'px'
|
||||||
|
});
|
||||||
|
|
||||||
getTimelineImageURL(function(url) {
|
getTimelineImageURL(function(url) {
|
||||||
|
|
||||||
self.timelineImageURL = url;
|
self.timelineImageURL = url;
|
||||||
|
@ -9488,6 +9498,7 @@ requires
|
||||||
duration: 0,
|
duration: 0,
|
||||||
find: '',
|
find: '',
|
||||||
frameURL: function() {},
|
frameURL: function() {},
|
||||||
|
height: 0,
|
||||||
largeTimeline: true,
|
largeTimeline: true,
|
||||||
matches: [],
|
matches: [],
|
||||||
points: [0, 0],
|
points: [0, 0],
|
||||||
|
@ -9502,7 +9513,12 @@ requires
|
||||||
width: 0
|
width: 0
|
||||||
})
|
})
|
||||||
.options(options || {})
|
.options(options || {})
|
||||||
.addClass('OxEditor');
|
.addClass('OxEditor')
|
||||||
|
.css({
|
||||||
|
height: self.options.height + 'px',
|
||||||
|
overflowY: 'auto',
|
||||||
|
width: self.options.width + 'px'
|
||||||
|
});
|
||||||
|
|
||||||
$.extend(self, {
|
$.extend(self, {
|
||||||
$player: [],
|
$player: [],
|
||||||
|
@ -9716,14 +9732,16 @@ requires
|
||||||
}
|
}
|
||||||
|
|
||||||
function getSizes() {
|
function getSizes() {
|
||||||
var size = {
|
var scrollbarWidth = oxui.scrollbarSize,
|
||||||
|
contentWidth = self.options.width - scrollbarWidth,
|
||||||
|
size = {
|
||||||
player: [],
|
player: [],
|
||||||
timeline: []
|
timeline: []
|
||||||
},
|
},
|
||||||
width, widths;
|
width, widths;
|
||||||
if (self.options.videoSize == 'small') {
|
if (self.options.videoSize == 'small') {
|
||||||
width = 0;
|
width = 0;
|
||||||
widths = Ox.divideInt(self.options.width - 4 * self.margin, 3);
|
widths = Ox.divideInt(contentWidth - 4 * self.margin, 3);
|
||||||
[1, 0, 2].forEach(function(v, i) {
|
[1, 0, 2].forEach(function(v, i) {
|
||||||
size.player[v] = {
|
size.player[v] = {
|
||||||
left: (i + 0.5) * self.margin + width,
|
left: (i + 0.5) * self.margin + width,
|
||||||
|
@ -9737,13 +9755,13 @@ requires
|
||||||
size.player[0] = {
|
size.player[0] = {
|
||||||
left: self.margin / 2,
|
left: self.margin / 2,
|
||||||
top: self.margin / 2,
|
top: self.margin / 2,
|
||||||
width: Math.round((self.options.width - 3 * self.margin + (self.controlsHeight + self.margin) / 2 * self.videoRatio) * 2/3),
|
width: Math.round((contentWidth - 3 * self.margin + (self.controlsHeight + self.margin) / 2 * self.videoRatio) * 2/3),
|
||||||
}
|
}
|
||||||
size.player[0].height = Math.round(size.player[0].width / self.videoRatio);
|
size.player[0].height = Math.round(size.player[0].width / self.videoRatio);
|
||||||
size.player[1] = {
|
size.player[1] = {
|
||||||
left: size.player[0].left + size.player[0].width + self.margin,
|
left: size.player[0].left + size.player[0].width + self.margin,
|
||||||
top: size.player[0].top,
|
top: size.player[0].top,
|
||||||
width: self.options.width - 3 * self.margin - size.player[0].width
|
width: contentWidth - 3 * self.margin - size.player[0].width
|
||||||
}
|
}
|
||||||
size.player[1].height = Math.ceil(size.player[1].width / self.videoRatio)
|
size.player[1].height = Math.ceil(size.player[1].width / self.videoRatio)
|
||||||
size.player[2] = {
|
size.player[2] = {
|
||||||
|
@ -9756,7 +9774,7 @@ requires
|
||||||
size.timeline[0] = {
|
size.timeline[0] = {
|
||||||
left: self.margin / 2,
|
left: self.margin / 2,
|
||||||
top: size.player[0].height + self.controlsHeight + 1.5 * self.margin,
|
top: size.player[0].height + self.controlsHeight + 1.5 * self.margin,
|
||||||
width: self.options.width - 2 * self.margin,
|
width: contentWidth - 2 * self.margin,
|
||||||
height: 64
|
height: 64
|
||||||
}
|
}
|
||||||
size.timeline[1] = {
|
size.timeline[1] = {
|
||||||
|
@ -9891,6 +9909,7 @@ requires
|
||||||
|
|
||||||
self.onChange = function(key, value) {
|
self.onChange = function(key, value) {
|
||||||
if (key == 'width') {
|
if (key == 'width') {
|
||||||
|
that.width(value);
|
||||||
setSizes();
|
setSizes();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in a new issue