Ox.load(), and adding moved files
This commit is contained in:
rolux
parent
dc1ec954fb
commit
6cfb6b7647
594 changed files with 1381 additions and 19555 deletions
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
ENG: "England",
|
||||
NIR: "Northern Ireland",
|
||||
SCT: "Scotland",
|
||||
WLS: "Wales"
|
||||
}
|
||||
17315
tools/geo/geo.json
17315
tools/geo/geo.json
File diff suppressed because it is too large
Load diff
|
|
@ -1,408 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
#map {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#data0 {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 50%;
|
||||
height: 100px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-family: Consolas;
|
||||
font-size: 8px;
|
||||
color: rgb(255, 255, 255);
|
||||
overflow: auto;
|
||||
z-index: 1000;
|
||||
}
|
||||
#data:focus {
|
||||
outline: none;
|
||||
}
|
||||
#data1 {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 50%;
|
||||
height: 100px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-family: Consolas;
|
||||
font-size: 8px;
|
||||
color: rgb(255, 255, 255);
|
||||
overflow: auto;
|
||||
z-index: 1000;
|
||||
}
|
||||
.flag {
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin-left: -4px;
|
||||
margin-top: -4px;
|
||||
-moz-border-radius: 1px;
|
||||
-webkit-border-radius: 1px;
|
||||
-moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 128);
|
||||
-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 128);
|
||||
}
|
||||
.flag:hover {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: -8px;
|
||||
margin-top: -8px;
|
||||
opacity: 0.5;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 128);
|
||||
-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 128);
|
||||
}
|
||||
.rect {
|
||||
position: absolute;
|
||||
border: 1px solid rgb(255, 255, 255);
|
||||
z-index: 1;
|
||||
-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 128);
|
||||
-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 128);
|
||||
}
|
||||
</style>
|
||||
<script src="../../build/js/jquery-1.3.2.js"></script>
|
||||
<script src="../../build/js/ox.js"></script>
|
||||
<script src="../../build/js/ox.data.js"></script>
|
||||
<script src="../../build/js/ox.geo.js"></script>
|
||||
<script src="../../build/js/ox.map.js"></script>
|
||||
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var $body = $("body"),
|
||||
$map = $("<img/>")
|
||||
.attr({
|
||||
id: "map",
|
||||
src: "map.png"
|
||||
})
|
||||
.appendTo($body),
|
||||
$data0 = $("<textarea/>")
|
||||
.attr({
|
||||
id: "data0"
|
||||
})
|
||||
.appendTo($body),
|
||||
$data1 = $("<textarea/>")
|
||||
.attr({
|
||||
id: "data1"
|
||||
})
|
||||
.appendTo($body),
|
||||
aliases = {
|
||||
'Byelorussian Soviet Socialist Republic': 'Belarus',
|
||||
'Dahomey': 'Benin',
|
||||
'European Union': 'Europe',
|
||||
'Georgia': 'Georgia, Europe',
|
||||
'Johnston Island': 'Johnston Atoll',
|
||||
'Metropolitan France': 'France',
|
||||
'Neutral Zone': 'Neutral Zone, Saudi Arabia',
|
||||
'Sahrawi': 'Western Sahara',
|
||||
'Siam': 'Thailand',
|
||||
'United States Minor Outlying Islands': 'Wake Island',
|
||||
'Upper Volta': 'Burkina Faso'
|
||||
// "Palestine": ["West Bank", "Gaza Strip"],
|
||||
},
|
||||
unions = {
|
||||
/*
|
||||
'Bonaire, Saint Eustatius and Saba': [
|
||||
'Bonaire', 'Saba', 'Saint Eustatius'
|
||||
],
|
||||
*/
|
||||
'Czechoslovakia': [
|
||||
'Czech Republic', 'Slovakia'
|
||||
],
|
||||
'Korea': [
|
||||
'North Korea', 'South Korea'
|
||||
],
|
||||
'Pacific Islands': [
|
||||
'Marshall Islands', 'Micronesia', 'Northern Mariana Islands', 'Palau'
|
||||
],
|
||||
'Serbia and Montenegro': [
|
||||
'Montenegro', 'Serbia'
|
||||
],
|
||||
'Soviet Union': [
|
||||
'Armenia', 'Azerbaijan', 'Belarus', 'Estonia', 'Georgia',
|
||||
'Latvia', 'Lithuania', 'Kazakhstan', 'Kyrgyzstan', 'Moldova',
|
||||
'Russia', 'Tajikistan', 'Turkmenistan', 'Ukraine', 'Uzbekistan'
|
||||
],
|
||||
'United Kingdom': [
|
||||
'England', 'Northern Ireland', 'Scotland', 'Wales'
|
||||
],
|
||||
/*
|
||||
'West Germany': [
|
||||
'Schleswig Holstein', 'Northrhine Westphalia', 'Bavaria'
|
||||
],
|
||||
*/
|
||||
'Yugoslavia': [
|
||||
'Bosnia and Herzegovina', 'Croatia', 'Serbia', 'Slovenia', 'Macedonia',
|
||||
'Montenegro'
|
||||
]
|
||||
}
|
||||
json = {};
|
||||
///*
|
||||
$.getJSON("geo.json", function(data) {
|
||||
json = data;
|
||||
getPlacemarks(Ox.COUNTRIES);
|
||||
setTimeout(parse, 2000);
|
||||
});
|
||||
//*/
|
||||
/*
|
||||
getPlacemarks(Ox.COUNTRIES);
|
||||
*/
|
||||
function getPlacemarks(countries) {
|
||||
var country = countries.shift();
|
||||
if (!(country.code in json) || !(country.name in unions)) {
|
||||
console.log(country);
|
||||
Ox.getPlacemarks(aliases[country.name] || country.name, function(geodata) {
|
||||
if (!geodata.results.length) {
|
||||
console.log(country.name, geodata.status);
|
||||
} else {
|
||||
geodata = geodata.results[0];
|
||||
Ox.print('geodata', geodata)
|
||||
data = {
|
||||
address: aliases[country.name] || country.name,
|
||||
geocode: {
|
||||
address_components: geodata.address_components,
|
||||
formatted_address: geodata.formatted_address,
|
||||
geometry: {
|
||||
location: {},
|
||||
location_type: geodata.geometry.location_type
|
||||
},
|
||||
types: geodata.types
|
||||
},
|
||||
name: country.name,
|
||||
time: +new Date()
|
||||
};
|
||||
$.each(["lat", "lng"], function(i, crd) {
|
||||
data.geocode.geometry.location[crd] = parseFloat(
|
||||
geodata.geometry.location[crd]().toFixed(8)
|
||||
);
|
||||
});
|
||||
$.each(["bounds", "viewport"], function(i, obj) {
|
||||
if (obj in geodata.geometry) {
|
||||
data.geocode.geometry[obj] = {};
|
||||
$.each(["center", "southWest", "northEast"], function(i, pnt) {
|
||||
data.geocode.geometry[obj][pnt] = {};
|
||||
$.each(["lat", "lng"], function(i, crd) {
|
||||
data.geocode.geometry[obj][pnt][crd] = parseFloat(
|
||||
geodata.geometry[obj][
|
||||
"get" + pnt[0].toUpperCase() + pnt.substr(1)
|
||||
]()[crd]().toFixed(8)
|
||||
);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
json[country.code] = data;
|
||||
addFlag(country, json[country.code]);
|
||||
addData(json)
|
||||
if (country.name != geodata.formatted_address) {
|
||||
console.log(country.name, geodata.formatted_address, geodata);
|
||||
}
|
||||
}
|
||||
if (countries.length) {
|
||||
setTimeout(function() {
|
||||
getPlacemarks(countries);
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
addFlag(country, json[country.code]);
|
||||
addData(json);
|
||||
if (countries.length) {
|
||||
setTimeout(function() {
|
||||
getPlacemarks(countries);
|
||||
}, 100);
|
||||
}
|
||||
}
|
||||
}
|
||||
function addData(json) {
|
||||
//var scroll = $data[0].scrollTop == $data[0].scrollHeight;
|
||||
$data0.html(
|
||||
JSON.stringify(json, null, 4)
|
||||
);
|
||||
/*
|
||||
if (scroll) {
|
||||
$data[0].scrollTop = $data[0].scrollHeight;
|
||||
}
|
||||
*/
|
||||
}
|
||||
function addFlag(country, data) {
|
||||
var location = Ox.getXY(data.geocode.geometry.location.lat, data.geocode.geometry.location.lng),
|
||||
bounds = "bounds" in data.geocode.geometry ? data.geocode.geometry.bounds : data.geocode.geometry.viewport,
|
||||
southWest = Ox.getXY(bounds.southWest.lat, bounds.southWest.lng),
|
||||
northEast = Ox.getXY(bounds.northEast.lat, bounds.northEast.lng),
|
||||
crossesDateline = southWest.x > northEast.x,
|
||||
$div = [];
|
||||
if (crossesDateline) {
|
||||
$div = [
|
||||
$("<div/>")
|
||||
.addClass("rect")
|
||||
.css({
|
||||
left: "-16px",
|
||||
top: ($map.height() * northEast.y) + "px",
|
||||
right: ($map.width() - $map.width() * northEast.x) + "px",
|
||||
bottom: ($map.height() - $map.height() * southWest.y) + "px",
|
||||
})
|
||||
.hide()
|
||||
.appendTo($body),
|
||||
$("<div/>")
|
||||
.addClass("rect")
|
||||
.css({
|
||||
left: ($map.width() * southWest.x) + "px",
|
||||
top: ($map.height() * northEast.y) + "px",
|
||||
right: "-16px",
|
||||
bottom: ($map.height() - $map.height() * southWest.y) + "px",
|
||||
})
|
||||
.hide()
|
||||
.appendTo($body),
|
||||
|
||||
];
|
||||
} else {
|
||||
$div = [
|
||||
$("<div/>")
|
||||
.addClass("rect")
|
||||
.css({
|
||||
left: ($map.width() * southWest.x) + "px",
|
||||
top: ($map.height() * northEast.y) + "px",
|
||||
right: ($map.width() - $map.width() * northEast.x) + "px",
|
||||
bottom: ($map.height() - $map.height() * southWest.y) + "px",
|
||||
})
|
||||
.hide()
|
||||
.appendTo($body)
|
||||
];
|
||||
}
|
||||
$("<img/>")
|
||||
.attr({
|
||||
src: '../../build/svg/' + country.code + '.' +
|
||||
(country.flag == 'png' ? 'png' : 'svg'),
|
||||
title: country.name + " ((" + bounds.southWest.lat + ", " + bounds.southWest.lng + "), (" + bounds.northEast.lat + ", " + bounds.northEast.lng + "))"
|
||||
})
|
||||
.addClass("flag")
|
||||
.css({
|
||||
left: (location.x * 100) + "%",
|
||||
top: (location.y * 100) + "%"
|
||||
})
|
||||
.mouseenter(function() {
|
||||
$(this).css({
|
||||
zIndex: Ox.uid()
|
||||
});
|
||||
$.each($div, function() {
|
||||
$(this).show();
|
||||
});
|
||||
})
|
||||
.mouseleave(function() {
|
||||
$.each($div, function() {
|
||||
$(this).hide();
|
||||
});
|
||||
})
|
||||
.appendTo($body);
|
||||
window.status = Ox.length(json) + " " + data.address;
|
||||
}
|
||||
function parse() {
|
||||
var bounds, center,
|
||||
data = JSON.parse($data0.html()),
|
||||
data_ = [],
|
||||
union;
|
||||
alert(Ox.COUNTRIES.length + ' ' + Ox.COUNTRIES[0].code)
|
||||
Ox.COUNTRIES.forEach(function(country) {
|
||||
if (country.code == 'AF') {
|
||||
alert('AF')
|
||||
}
|
||||
Ox.print('CC', country.code)
|
||||
if (country.code in data) {
|
||||
bounds = data[country.code].geocode.geometry.bounds ||
|
||||
data[country.code].geocode.geometry.viewport;
|
||||
}
|
||||
if (country.name in unions) {
|
||||
unions[country.name].forEach(function(countryName, i) {
|
||||
var countryCode = getCountryCode(countryName);
|
||||
Ox.print('countryCode', countryCode)
|
||||
bounds = data[countryCode].geocode.geometry.bounds ||
|
||||
data[countryCode].geocode.geometry.viewport;
|
||||
bounds = new google.maps.LatLngBounds(
|
||||
new google.maps.LatLng(
|
||||
bounds.southWest.lat,
|
||||
bounds.southWest.lng
|
||||
),
|
||||
new google.maps.LatLng(
|
||||
bounds.northEast.lat,
|
||||
bounds.northEast.lng
|
||||
)
|
||||
);
|
||||
union = i == 0 ? bounds : union.union(bounds);
|
||||
});
|
||||
bounds = {
|
||||
southWest: {
|
||||
lat: union.getSouthWest().lat(),
|
||||
lng: union.getSouthWest().lng()
|
||||
},
|
||||
northEast: {
|
||||
lat: union.getNorthEast().lat(),
|
||||
lng: union.getNorthEast().lng()
|
||||
}
|
||||
};
|
||||
}
|
||||
if (country.name == 'Antarctica') {
|
||||
bounds.southWest.lat = Ox.MIN_LATITUDE;
|
||||
bounds.southWest.lng = -179.99999999;
|
||||
bounds.northEast.lng = 179.99999999;
|
||||
} else if (country.name == 'United Kingdom') {
|
||||
|
||||
}
|
||||
var center = new google.maps.LatLngBounds(
|
||||
new google.maps.LatLng(
|
||||
bounds.southWest.lat, bounds.southWest.lng
|
||||
),
|
||||
new google.maps.LatLng(
|
||||
bounds.northEast.lat, bounds.northEast.lng
|
||||
)
|
||||
).getCenter();
|
||||
data_.push({
|
||||
code: country.code,
|
||||
name: country.name,
|
||||
country: country.country,
|
||||
region: country.region,
|
||||
continent: country.continent,
|
||||
type: country.type,
|
||||
lat: center.lat(),
|
||||
lng: center.lng(),
|
||||
south: bounds.southWest.lat,
|
||||
west: bounds.southWest.lng,
|
||||
north: bounds.northEast.lat,
|
||||
east: bounds.northEast.lng,
|
||||
size: Ox.getArea(
|
||||
bounds.southWest, bounds.northEast
|
||||
)
|
||||
});
|
||||
});
|
||||
$data1.html(JSON.stringify(data_.sort(function(a, b) {
|
||||
return a.name < b.name ? -1 : (a.name > b.name ? 1 : 0);
|
||||
}), null, 4));
|
||||
function getCountryCode(countryName) {
|
||||
var ret;
|
||||
Ox.COUNTRIES.forEach(function(country) {
|
||||
if (country.name == countryName) {
|
||||
ret = country.code;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
return ret;
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 MiB |
Loading…
Add table
Add a link
Reference in a new issue