merging changes
This commit is contained in:
parent
7ef84ae6b2
commit
ee027fb760
3 changed files with 59 additions and 90 deletions
|
@ -719,7 +719,7 @@ Lists
|
|||
}
|
||||
|
||||
.OxIconList .OxPage {
|
||||
//position: absolute;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin-left: auto;
|
||||
|
@ -799,6 +799,11 @@ Lists
|
|||
//-webkit-user-select: text;
|
||||
}
|
||||
|
||||
.OxTextList {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.OxTextList .OxBar {
|
||||
//z-index: 10;
|
||||
//-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.75);
|
||||
|
@ -892,7 +897,7 @@ Lists
|
|||
|
||||
.OxTextList .OxBody {
|
||||
float: left;
|
||||
//position: absolute;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
|
@ -943,7 +948,7 @@ Lists
|
|||
cursor: ns-resize;
|
||||
}
|
||||
.OxTextList .OxPage {
|
||||
//position: absolute;
|
||||
position: absolute;
|
||||
}
|
||||
.OxTextList.OxDrop .OxItem .OxCell {
|
||||
color: green;
|
||||
|
|
|
@ -9625,8 +9625,13 @@ requires
|
|||
self.places = [];
|
||||
self.options.places.forEach(function(place, i) {
|
||||
self.places[i] = Place(Ox.clone(place));
|
||||
if (i == 0) {
|
||||
Ox.print('0000', self.places[i].bounds, self.places[i].bounds.union)
|
||||
} else {
|
||||
Ox.print('$$$$', self.bounds)
|
||||
}
|
||||
self.bounds = i == 0 ?
|
||||
Ox.clone(self.places[i].bounds) :
|
||||
self.places[i].bounds :
|
||||
self.bounds.union(self.places[i].bounds);
|
||||
});
|
||||
self.center = self.bounds ? self.bounds.getCenter() : new google.maps.LatLng(0, 0);
|
||||
|
@ -9739,23 +9744,29 @@ requires
|
|||
}
|
||||
|
||||
function Marker(place) {
|
||||
var listeners = {},
|
||||
marker = new google.maps.Marker({
|
||||
var marker = new google.maps.Marker({
|
||||
position: place.center,
|
||||
title: place.name
|
||||
}),
|
||||
selected = false;
|
||||
setOptions();
|
||||
Ox.print('MARKER', marker)
|
||||
function click(event) {
|
||||
Ox.print('click metaKey', event.metaKey, selected)
|
||||
// fixme: metaKey used to work
|
||||
/*
|
||||
Ox.print('click event', event, 'metakey', event.metaKey, 'selected', selected)
|
||||
if (event.metaKey == selected) {
|
||||
selected = !event.metaKey;
|
||||
selectPlace(selected ? place.id : '');
|
||||
}
|
||||
*/
|
||||
selected = !selected;
|
||||
selectPlace(selected ? place.id : '');
|
||||
}
|
||||
function dblclick() {
|
||||
Ox.print('####', place.bounds)
|
||||
self.map.fitBounds(place.bounds);
|
||||
Ox.print('PLACE.BOUNDS', place.bounds)
|
||||
self.bounds = place.bounds;
|
||||
self.map.fitBounds(self.bounds);
|
||||
}
|
||||
function setOptions() {
|
||||
marker.setOptions({
|
||||
|
@ -9768,10 +9779,8 @@ requires
|
|||
add: function() {
|
||||
Ox.print('Marker.add()')
|
||||
marker.setMap(self.map);
|
||||
listeners = {
|
||||
click: google.maps.event.addListener(marker, 'click', click),
|
||||
dblclick: google.maps.event.addListener(marker, 'dblclick', dblclick),
|
||||
};
|
||||
google.maps.event.addListener(marker, 'click', click);
|
||||
google.maps.event.addListener(marker, 'dblclick', dblclick);
|
||||
},
|
||||
deselect: function() {
|
||||
selected = false;
|
||||
|
@ -9779,9 +9788,7 @@ requires
|
|||
},
|
||||
remove: function() {
|
||||
marker.setMap(null);
|
||||
$.each(listeners, function(i, listener) {
|
||||
google.maps.event.removeListener(listener);
|
||||
});
|
||||
google.maps.event.clearListeners(marker);
|
||||
},
|
||||
select: function() {
|
||||
selected = true;
|
||||
|
@ -9799,6 +9806,7 @@ requires
|
|||
new google.maps.LatLng(place.south, place.west),
|
||||
new google.maps.LatLng(place.north, place.east)
|
||||
);
|
||||
Ox.print('place.bounds', place.bounds, place.bounds.union)
|
||||
} else {
|
||||
// geodata object
|
||||
if (!place.geometry.bounds) {
|
||||
|
@ -9972,6 +9980,7 @@ requires
|
|||
self.resultPlace = place;
|
||||
selectPlace(place.id);
|
||||
self.bounds = place.bounds;
|
||||
Ox.print('SELF.BOUNDS', self.bounds)
|
||||
self.map.fitBounds(self.bounds);
|
||||
}
|
||||
callback(place);
|
||||
|
@ -11252,12 +11261,7 @@ requires
|
|||
var element = self.options.elements[pos],
|
||||
size = element.element[self.dimensions[0]]();
|
||||
if (element.resizable && !element.collapsed) {
|
||||
Ox.isString(element.size) && setPixels(pos);
|
||||
self.drag = {
|
||||
resize: Ox.isNumber(element.size) ?
|
||||
element.resize : element.resize.map(function(v) {
|
||||
return getPixelsByPercent(v);
|
||||
}),
|
||||
size: size,
|
||||
startPos: e[self.clientXY],
|
||||
startSize: size
|
||||
|
@ -11274,10 +11278,10 @@ requires
|
|||
var d = e[self.clientXY] - self.drag.startPos,
|
||||
size = Ox.limit(
|
||||
self.drag.startSize + d * (index ? -1 : 1),
|
||||
self.drag.resize[0],
|
||||
self.drag.resize[element.resize.length - 1]
|
||||
element.resize[0],
|
||||
element.resize[element.resize.length - 1]
|
||||
);
|
||||
self.drag.resize.forEach(function(v) {
|
||||
element.resize.forEach(function(v) {
|
||||
if (size >= v - 8 && size <= v + 8) {
|
||||
size = v;
|
||||
return false;
|
||||
|
@ -11299,53 +11303,16 @@ requires
|
|||
var data = {},
|
||||
element = self.options.elements[pos];
|
||||
if (element.resizable && !element.collapsed) {
|
||||
Ox.isString(element.size) && setPercent(pos);
|
||||
data[self.dimensions[0]] = self.drag.size
|
||||
element.element.triggerEvent('resizeend', data);
|
||||
triggerEvents('resizeend', pos);
|
||||
}
|
||||
}
|
||||
|
||||
function getPixelsByPercent(percent) {
|
||||
return Math.round((
|
||||
that[self.dimensions[0]]() -
|
||||
self.options.elements.reduce(function(val, element) {
|
||||
return val + Ox.isNumber(element.size) ?
|
||||
element.element[self.dimensions[0]]() : 0;
|
||||
}, 0) - self.$separators.length
|
||||
) * parseFloat(percent) / 100);
|
||||
}
|
||||
|
||||
function setPercent(pos) {
|
||||
var element = self.options.elements[pos],
|
||||
flex = (
|
||||
element.size == 'auto' ? self.autoPercent : element.size
|
||||
).replace('%', ''),
|
||||
css = {
|
||||
boxFlex: flex,
|
||||
MozBoxFlex: flex,
|
||||
WebkitBoxFlex: flex
|
||||
};
|
||||
css[self.dimensions[0]] = '';
|
||||
Ox.print('setPercent', css)
|
||||
element.element.css(css);
|
||||
}
|
||||
|
||||
function setPixels(pos) {
|
||||
var css = {
|
||||
boxFlex: '',
|
||||
MozBoxFlex: '',
|
||||
WebkitBoxFlex: ''
|
||||
},
|
||||
element = self.options.elements[pos];
|
||||
css[self.dimensions[0]] = element.element[self.dimensions[0]]() + 'px';
|
||||
element.element.css(css);
|
||||
}
|
||||
|
||||
function triggerEvents(event, pos) {
|
||||
var data = {};
|
||||
self.options.elements.forEach(function(element, i) {
|
||||
if (i != pos && Ox.isString(element.size)) {
|
||||
if (i != pos && element.size == 'auto') {
|
||||
data[self.dimensions[0]] = element.element[self.dimensions[0]]();
|
||||
element.element.triggerEvent(event, data);
|
||||
}
|
||||
|
@ -11353,24 +11320,28 @@ requires
|
|||
}
|
||||
|
||||
that.replaceElement = function(pos, element) {
|
||||
var $element = self.options.elements[pos].element;
|
||||
var $element = self.options.elements[pos].element,
|
||||
size = self.options.elements[pos].size;
|
||||
$element.replaceWith(self.options.elements[pos].element = element);
|
||||
if (Ox.isNumber(self.options.elements[pos].size)) {
|
||||
setPixels(pos);
|
||||
if (size == 'auto') {
|
||||
$element.css(self.boxFlexCSS);
|
||||
} else {
|
||||
setPercent(pos);
|
||||
$element.css(self.dimensions[0], size + 'px')
|
||||
}
|
||||
return that;
|
||||
};
|
||||
|
||||
that.resizeElement = function(pos, size) {
|
||||
var element = self.options.elements[pos];
|
||||
element.size = size;
|
||||
if (Ox.isNumber(element.size)) {
|
||||
setPixels(pos);
|
||||
that.size = function(pos, size) {
|
||||
var element = self.options.elements[pos],
|
||||
ret;
|
||||
if (Ox.isUndefined(size)) {
|
||||
ret = element.element[self.dimensions[0]]();
|
||||
} else {
|
||||
setPercent(pos);
|
||||
element.size = size;
|
||||
element.element.css(self.dimensions[0], size + 'px')
|
||||
ret = that;
|
||||
}
|
||||
return that;
|
||||
}
|
||||
|
||||
that.toggle = function(pos) {
|
||||
|
@ -11381,16 +11352,10 @@ requires
|
|||
size = element.element[self.dimensions[0]]();
|
||||
if (element.collapsible) {
|
||||
element.collapsed = !element.collapsed;
|
||||
if (Ox.isString(element.size) && element.collapsed) {
|
||||
setPixels(pos);
|
||||
}
|
||||
css['margin' + Ox.toTitleCase(self.edges[0][index])] =
|
||||
element.collapsed ? -size : 0;
|
||||
Ox.print('css', css);
|
||||
that.animate(css, 250, function() {
|
||||
if (Ox.isString(element.size) && !element.collapsed) {
|
||||
setPercent(pos);
|
||||
}
|
||||
element.element.triggerEvent('toggle', {collapsed: element.collapsed});
|
||||
triggerEvents('resize', pos);
|
||||
});
|
||||
|
@ -11420,6 +11385,7 @@ requires
|
|||
toggle
|
||||
*/
|
||||
Ox.SplitPanel = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self) // fixme: Container
|
||||
.defaults({
|
||||
|
@ -11553,7 +11519,7 @@ requires
|
|||
return self.options.elements[pos].collapsed;
|
||||
};
|
||||
|
||||
that.replace = function(id, element) { // fixme: should be replaceElement
|
||||
that.replaceElement = function(id, element) {
|
||||
// one can pass pos instead of id
|
||||
var pos = Ox.isNumber(id) ? id : getPositionById(id);
|
||||
//Ox.print('replace', pos, element);
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
<link rel="stylesheet" type="text/css" href="../../build/css/ox.ui.css"/>
|
||||
<script type="text/javascript" src="../../build/js/jquery-1.5.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.map.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.ui.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
|
@ -42,7 +43,7 @@
|
|||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(128, 128, 255)'})
|
||||
.html('{collapsible: true, size: "10%"}'),
|
||||
size: '10%'
|
||||
size: 24
|
||||
},
|
||||
{
|
||||
element: five = new Ox.SplitPanel_({
|
||||
|
@ -66,19 +67,18 @@
|
|||
})
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 160, 255)'})
|
||||
element: new Ox.TreeList({
|
||||
data: Ox.COUNTRIES
|
||||
})
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({
|
||||
//position: 'absolute',
|
||||
top: 16,
|
||||
bottom: 16,
|
||||
//display: 'block',
|
||||
//top: 15,
|
||||
//bottom: 0,
|
||||
//height: '100%',
|
||||
//height: '200px',
|
||||
overflowY: 'scroll'
|
||||
})
|
||||
.append(
|
||||
|
@ -97,7 +97,7 @@
|
|||
collapsible: true,
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 128, 128)'}),
|
||||
size: '10%'
|
||||
size: 24
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
|
@ -107,10 +107,8 @@
|
|||
collapsible: true,
|
||||
element: new Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 255, 0)'})
|
||||
.html('foo'/*'{collapsible: true, size: "10%", resizable: true, resize: ["5%", "10%", "15%"]}'*/),
|
||||
size: '10%',
|
||||
resizable: true,
|
||||
resize: ['5%', '10%', '15%']
|
||||
.html('{collapsible: true, size: "10%", resizable: true, resize: ["5%", "10%", "15%"]}'),
|
||||
size: 256
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
|
|
Loading…
Reference in a new issue