mirror of
https://github.com/FoggedLens/iD.git
synced 2026-05-20 23:44:47 +02:00
Update maki; use prebuilt sprite (fixes #1916)
This commit is contained in:
John Firebaugh
@@ -96,7 +96,8 @@ dist/img/line-presets.png: svg/line-presets.svg
|
||||
dist/img/relation-presets.png: svg/relation-presets.svg
|
||||
if [ `which inkscape` ]; then $(SPRITE) --export-png=$@ $<; else echo "Inkscape is not installed"; fi;
|
||||
|
||||
dist/img/maki-sprite.png: $(wildcard node_modules/maki/renders/*.png)
|
||||
dist/img/maki-sprite.png: ./node_modules/maki/www/images/maki-sprite.png
|
||||
cp $< $@
|
||||
node data/maki_sprite
|
||||
|
||||
D3_FILES = \
|
||||
|
||||
+101
-93
@@ -3,99 +3,107 @@
|
||||
.preset-icon{background-image:url(img/maki-sprite.png);background-repeat:no-repeat;width:24px;height:24px;}
|
||||
.preset-icon-line{background-image:url(img/line-presets.png);background-repeat:no-repeat;width:60px;height:60px;}
|
||||
.preset-icon-relation{background-image:url(img/relation-presets.png);background-repeat:no-repeat;width:60px;height:60px;}
|
||||
.feature-airfield{background-position:-0px -34px;}
|
||||
.feature-airport{background-position:-0px -94px;}
|
||||
.feature-alcohol-shop{background-position:-0px -154px;}
|
||||
.feature-america-football{background-position:-0px -214px;}
|
||||
.feature-art-gallery{background-position:-0px -274px;}
|
||||
.feature-bank{background-position:-0px -334px;}
|
||||
.feature-bar{background-position:-0px -394px;}
|
||||
.feature-baseball{background-position:-0px -454px;}
|
||||
.feature-basketball{background-position:-0px -514px;}
|
||||
.feature-beer{background-position:-0px -574px;}
|
||||
.feature-bicycle{background-position:-0px -634px;}
|
||||
.feature-building{background-position:-0px -694px;}
|
||||
.feature-bus{background-position:-0px -754px;}
|
||||
.feature-cafe{background-position:-0px -814px;}
|
||||
.feature-campsite{background-position:-0px -874px;}
|
||||
.feature-cemetery{background-position:-0px -934px;}
|
||||
.feature-cinema{background-position:-0px -994px;}
|
||||
.feature-circle{background-position:-0px -1054px;}
|
||||
.feature-circle-stroked{background-position:-0px -1114px;}
|
||||
.feature-city{background-position:-0px -1174px;}
|
||||
.feature-college{background-position:-0px -1234px;}
|
||||
.feature-commercial{background-position:-0px -1294px;}
|
||||
.feature-cricket{background-position:-0px -1354px;}
|
||||
.feature-cross{background-position:-0px -1414px;}
|
||||
.feature-dam{background-position:-0px -1474px;}
|
||||
.feature-danger{background-position:-0px -1534px;}
|
||||
.feature-disability{background-position:-0px -1594px;}
|
||||
.feature-embassy{background-position:-0px -1654px;}
|
||||
.feature-emergency-telephone{background-position:-0px -1714px;}
|
||||
.feature-farm{background-position:-0px -1774px;}
|
||||
.feature-fast-food{background-position:-0px -1834px;}
|
||||
.feature-ferry{background-position:-0px -1894px;}
|
||||
.feature-fire-station{background-position:-0px -1954px;}
|
||||
.feature-fuel{background-position:-0px -2014px;}
|
||||
.feature-garden{background-position:-0px -2074px;}
|
||||
.feature-golf{background-position:-0px -2134px;}
|
||||
.feature-grocery{background-position:-0px -2194px;}
|
||||
.feature-harbor{background-position:-0px -2254px;}
|
||||
.feature-heliport{background-position:-0px -2314px;}
|
||||
.feature-hospital{background-position:-0px -2374px;}
|
||||
.feature-industrial{background-position:-0px -2434px;}
|
||||
.feature-land-use{background-position:-0px -2494px;}
|
||||
.feature-library{background-position:-0px -2554px;}
|
||||
.feature-lodging{background-position:-0px -2614px;}
|
||||
.feature-logging{background-position:-0px -2674px;}
|
||||
.feature-marker{background-position:-0px -2734px;}
|
||||
.feature-marker-stroked{background-position:-0px -2794px;}
|
||||
.feature-monument{background-position:-0px -2854px;}
|
||||
.feature-museum{background-position:-0px -2914px;}
|
||||
.feature-music{background-position:-0px -2974px;}
|
||||
.feature-oil-well{background-position:-0px -3034px;}
|
||||
.feature-park{background-position:-0px -3094px;}
|
||||
.feature-park2{background-position:-0px -3154px;}
|
||||
.feature-parking{background-position:-0px -3214px;}
|
||||
.feature-parking-garage{background-position:-0px -3274px;}
|
||||
.feature-pharmacy{background-position:-0px -3334px;}
|
||||
.feature-pitch{background-position:-0px -3394px;}
|
||||
.feature-place-of-worship{background-position:-0px -3454px;}
|
||||
.feature-police{background-position:-0px -3514px;}
|
||||
.feature-post{background-position:-0px -3574px;}
|
||||
.feature-prison{background-position:-0px -3634px;}
|
||||
.feature-rail{background-position:-0px -3694px;}
|
||||
.feature-rail-above{background-position:-0px -3754px;}
|
||||
.feature-rail-underground{background-position:-0px -3814px;}
|
||||
.feature-religious-christian{background-position:-0px -3874px;}
|
||||
.feature-religious-jewish{background-position:-0px -3934px;}
|
||||
.feature-religious-muslim{background-position:-0px -3994px;}
|
||||
.feature-restaurant{background-position:-0px -4054px;}
|
||||
.feature-roadblock{background-position:-0px -4114px;}
|
||||
.feature-school{background-position:-0px -4174px;}
|
||||
.feature-shop{background-position:-0px -4234px;}
|
||||
.feature-skiing{background-position:-0px -4294px;}
|
||||
.feature-slaughterhouse{background-position:-0px -4354px;}
|
||||
.feature-soccer{background-position:-0px -4414px;}
|
||||
.feature-square{background-position:-0px -4474px;}
|
||||
.feature-square-stroked{background-position:-0px -4534px;}
|
||||
.feature-star{background-position:-0px -4594px;}
|
||||
.feature-star-stroked{background-position:-0px -4654px;}
|
||||
.feature-swimming{background-position:-0px -4714px;}
|
||||
.feature-telephone{background-position:-0px -4774px;}
|
||||
.feature-tennis{background-position:-0px -4834px;}
|
||||
.feature-theatre{background-position:-0px -4894px;}
|
||||
.feature-toilets{background-position:-0px -4954px;}
|
||||
.feature-town{background-position:-0px -5014px;}
|
||||
.feature-town-hall{background-position:-0px -5074px;}
|
||||
.feature-triangle{background-position:-0px -5134px;}
|
||||
.feature-triangle-stroked{background-position:-0px -5194px;}
|
||||
.feature-village{background-position:-0px -5254px;}
|
||||
.feature-warehouse{background-position:-0px -5314px;}
|
||||
.feature-waste-basket{background-position:-0px -5374px;}
|
||||
.feature-water{background-position:-0px -5434px;}
|
||||
.feature-wetland{background-position:-0px -5494px;}
|
||||
.feature-zoo{background-position:-0px -5554px;}
|
||||
.feature-circle-stroked{background-position:-0px -0px;}
|
||||
.feature-circle{background-position:-54px -0px;}
|
||||
.feature-square-stroked{background-position:-108px -0px;}
|
||||
.feature-square{background-position:-162px -0px;}
|
||||
.feature-triangle-stroked{background-position:-216px -0px;}
|
||||
.feature-triangle{background-position:-0px -24px;}
|
||||
.feature-star-stroked{background-position:-54px -24px;}
|
||||
.feature-star{background-position:-108px -24px;}
|
||||
.feature-cross{background-position:-162px -24px;}
|
||||
.feature-marker-stroked{background-position:-216px -24px;}
|
||||
.feature-marker{background-position:-0px -48px;}
|
||||
.feature-religious-jewish{background-position:-54px -48px;}
|
||||
.feature-religious-christian{background-position:-108px -48px;}
|
||||
.feature-religious-muslim{background-position:-162px -48px;}
|
||||
.feature-cemetery{background-position:-216px -48px;}
|
||||
.feature-rocket{background-position:-0px -72px;}
|
||||
.feature-airport{background-position:-54px -72px;}
|
||||
.feature-heliport{background-position:-108px -72px;}
|
||||
.feature-rail{background-position:-162px -72px;}
|
||||
.feature-rail-underground{background-position:-216px -72px;}
|
||||
.feature-rail-above{background-position:-0px -96px;}
|
||||
.feature-bus{background-position:-54px -96px;}
|
||||
.feature-fuel{background-position:-108px -96px;}
|
||||
.feature-parking{background-position:-162px -96px;}
|
||||
.feature-parking-garage{background-position:-216px -96px;}
|
||||
.feature-airfield{background-position:-0px -120px;}
|
||||
.feature-roadblock{background-position:-54px -120px;}
|
||||
.feature-ferry{background-position:-108px -120px;}
|
||||
.feature-harbor{background-position:-162px -120px;}
|
||||
.feature-bicycle{background-position:-216px -120px;}
|
||||
.feature-park{background-position:-0px -144px;}
|
||||
.feature-park2{background-position:-54px -144px;}
|
||||
.feature-museum{background-position:-108px -144px;}
|
||||
.feature-lodging{background-position:-162px -144px;}
|
||||
.feature-monument{background-position:-216px -144px;}
|
||||
.feature-zoo{background-position:-0px -168px;}
|
||||
.feature-garden{background-position:-54px -168px;}
|
||||
.feature-campsite{background-position:-108px -168px;}
|
||||
.feature-theatre{background-position:-162px -168px;}
|
||||
.feature-art-gallery{background-position:-216px -168px;}
|
||||
.feature-pitch{background-position:-0px -192px;}
|
||||
.feature-soccer{background-position:-54px -192px;}
|
||||
.feature-america-football{background-position:-108px -192px;}
|
||||
.feature-tennis{background-position:-162px -192px;}
|
||||
.feature-basketball{background-position:-216px -192px;}
|
||||
.feature-baseball{background-position:-0px -216px;}
|
||||
.feature-golf{background-position:-54px -216px;}
|
||||
.feature-swimming{background-position:-108px -216px;}
|
||||
.feature-cricket{background-position:-162px -216px;}
|
||||
.feature-skiing{background-position:-216px -216px;}
|
||||
.feature-school{background-position:-0px -240px;}
|
||||
.feature-college{background-position:-54px -240px;}
|
||||
.feature-library{background-position:-108px -240px;}
|
||||
.feature-post{background-position:-162px -240px;}
|
||||
.feature-fire-station{background-position:-216px -240px;}
|
||||
.feature-town-hall{background-position:-0px -264px;}
|
||||
.feature-police{background-position:-54px -264px;}
|
||||
.feature-prison{background-position:-108px -264px;}
|
||||
.feature-embassy{background-position:-162px -264px;}
|
||||
.feature-beer{background-position:-216px -264px;}
|
||||
.feature-restaurant{background-position:-0px -288px;}
|
||||
.feature-cafe{background-position:-54px -288px;}
|
||||
.feature-shop{background-position:-108px -288px;}
|
||||
.feature-fast-food{background-position:-162px -288px;}
|
||||
.feature-bar{background-position:-216px -288px;}
|
||||
.feature-bank{background-position:-0px -312px;}
|
||||
.feature-grocery{background-position:-54px -312px;}
|
||||
.feature-cinema{background-position:-108px -312px;}
|
||||
.feature-pharmacy{background-position:-162px -312px;}
|
||||
.feature-hospital{background-position:-216px -312px;}
|
||||
.feature-danger{background-position:-0px -336px;}
|
||||
.feature-industrial{background-position:-54px -336px;}
|
||||
.feature-warehouse{background-position:-108px -336px;}
|
||||
.feature-commercial{background-position:-162px -336px;}
|
||||
.feature-building{background-position:-216px -336px;}
|
||||
.feature-place-of-worship{background-position:-0px -360px;}
|
||||
.feature-alcohol-shop{background-position:-54px -360px;}
|
||||
.feature-logging{background-position:-108px -360px;}
|
||||
.feature-oil-well{background-position:-162px -360px;}
|
||||
.feature-slaughterhouse{background-position:-216px -360px;}
|
||||
.feature-dam{background-position:-0px -384px;}
|
||||
.feature-water{background-position:-54px -384px;}
|
||||
.feature-wetland{background-position:-108px -384px;}
|
||||
.feature-disability{background-position:-162px -384px;}
|
||||
.feature-telephone{background-position:-216px -384px;}
|
||||
.feature-emergency-telephone{background-position:-0px -408px;}
|
||||
.feature-toilets{background-position:-54px -408px;}
|
||||
.feature-waste-basket{background-position:-108px -408px;}
|
||||
.feature-music{background-position:-162px -408px;}
|
||||
.feature-land-use{background-position:-216px -408px;}
|
||||
.feature-city{background-position:-0px -432px;}
|
||||
.feature-town{background-position:-54px -432px;}
|
||||
.feature-village{background-position:-108px -432px;}
|
||||
.feature-farm{background-position:-162px -432px;}
|
||||
.feature-bakery{background-position:-216px -432px;}
|
||||
.feature-dog-park{background-position:-0px -456px;}
|
||||
.feature-lighthouse{background-position:-54px -456px;}
|
||||
.feature-clothing-store{background-position:-108px -456px;}
|
||||
.feature-london-underground{background-position:-162px -456px;}
|
||||
.feature-minefield{background-position:-216px -456px;}
|
||||
.feature-camera{background-position:-0px -480px;}
|
||||
.preset-icon-line.feature-highway-motorway{background-position:-20px -25px;}
|
||||
.preset-icon-line.feature-highway-trunk{background-position:-80px -25px;}
|
||||
.preset-icon-line.feature-highway-primary{background-position:-140px -25px;}
|
||||
|
||||
File diff suppressed because one or more lines are too long
+44
-53
@@ -1,63 +1,54 @@
|
||||
var fs = require('fs');
|
||||
var path = require('path');
|
||||
var sprite = require('node-sprite');
|
||||
var _ = require('../js/lib/lodash');
|
||||
|
||||
var makipath = './node_modules/maki';
|
||||
var maki = require('maki/www/maki-sprite.json');
|
||||
var lineIcons = require('./line-icons.json');
|
||||
var relationIcons = require('./relation-icons.json');
|
||||
|
||||
sprite.sprite('renders', { path: makipath }, function(err, makiSprite) {
|
||||
if (err) process.exit(1);
|
||||
// Generate CSS
|
||||
var template = '.feature-{name}{background-position:-{x}px -{y}px;}\n';
|
||||
var css = "/* This file is generated by make. Do NOT edit manually. */\n\n";
|
||||
css += ".preset-icon{background-image:url(img/maki-sprite.png);background-repeat:no-repeat;width:24px;height:24px;}\n";
|
||||
css += ".preset-icon-line{background-image:url(img/line-presets.png);background-repeat:no-repeat;width:60px;height:60px;}\n";
|
||||
css += ".preset-icon-relation{background-image:url(img/relation-presets.png);background-repeat:no-repeat;width:60px;height:60px;}\n";
|
||||
|
||||
// Move image files
|
||||
fs.renameSync(path.join(makipath, makiSprite.filename()), './dist/img/maki-sprite.png');
|
||||
var images = {};
|
||||
|
||||
// Generate CSS
|
||||
var template = '.feature-{name}{background-position:-{x}px -{y}px;}\n';
|
||||
var css = "/* This file is generated by make. Do NOT edit manually. */\n\n";
|
||||
css += ".preset-icon{background-image:url(img/maki-sprite.png);background-repeat:no-repeat;width:24px;height:24px;}\n";
|
||||
css += ".preset-icon-line{background-image:url(img/line-presets.png);background-repeat:no-repeat;width:60px;height:60px;}\n";
|
||||
css += ".preset-icon-relation{background-image:url(img/relation-presets.png);background-repeat:no-repeat;width:60px;height:60px;}\n";
|
||||
_.forEach(maki, function(dimensions, name) {
|
||||
var match = name.match(/(.*)-(12|18|24)/),
|
||||
name = match[1],
|
||||
size = match[2],
|
||||
group = images[name] = images[name] || {};
|
||||
group[size] = [dimensions.x, dimensions.y];
|
||||
|
||||
var images = {};
|
||||
|
||||
makiSprite.images.forEach(function(image) {
|
||||
var match = image.name.match(/(.*)-(12|18|24)/),
|
||||
name = match[1],
|
||||
size = match[2],
|
||||
group = images[name] = images[name] || {};
|
||||
group[size] = [image.positionX, image.positionY];
|
||||
|
||||
if (image.width === 24) {
|
||||
css += template.replace('{name}', image.name.replace('-24', ''))
|
||||
.replace('{x}', image.positionX)
|
||||
.replace('{y}', image.positionY);
|
||||
}
|
||||
});
|
||||
|
||||
template = '.preset-icon-line.feature-{name}{background-position:-{x}px -{y}px;}\n';
|
||||
|
||||
_.forEach(lineIcons, function(position, name) {
|
||||
css += template.replace('{name}', name)
|
||||
.replace('{x}', position[0])
|
||||
.replace('{y}', position[1]);
|
||||
|
||||
images[name] = images[name] || {};
|
||||
images[name].line = position;
|
||||
});
|
||||
|
||||
template = '.preset-icon-relation.feature-{name}{background-position:-{x}px -{y}px;}\n';
|
||||
|
||||
_.forEach(relationIcons, function(position, name) {
|
||||
css += template.replace('{name}', name)
|
||||
.replace('{x}', position[0])
|
||||
.replace('{y}', position[1]);
|
||||
|
||||
images[name] = images[name] || {};
|
||||
images[name].relation = position;
|
||||
});
|
||||
|
||||
fs.writeFileSync('./css/feature-icons.css', css);
|
||||
fs.writeFileSync('./data/feature-icons.json', JSON.stringify(images));
|
||||
if (dimensions.width === 24) {
|
||||
css += template.replace('{name}', name.replace('-24', ''))
|
||||
.replace('{x}', dimensions.x)
|
||||
.replace('{y}', dimensions.y);
|
||||
}
|
||||
});
|
||||
|
||||
template = '.preset-icon-line.feature-{name}{background-position:-{x}px -{y}px;}\n';
|
||||
|
||||
_.forEach(lineIcons, function(position, name) {
|
||||
css += template.replace('{name}', name)
|
||||
.replace('{x}', position[0])
|
||||
.replace('{y}', position[1]);
|
||||
|
||||
images[name] = images[name] || {};
|
||||
images[name].line = position;
|
||||
});
|
||||
|
||||
template = '.preset-icon-relation.feature-{name}{background-position:-{x}px -{y}px;}\n';
|
||||
|
||||
_.forEach(relationIcons, function(position, name) {
|
||||
css += template.replace('{name}', name)
|
||||
.replace('{x}', position[0])
|
||||
.replace('{y}', position[1]);
|
||||
|
||||
images[name] = images[name] || {};
|
||||
images[name].relation = position;
|
||||
});
|
||||
|
||||
fs.writeFileSync('./css/feature-icons.css', css);
|
||||
fs.writeFileSync('./data/feature-icons.json', JSON.stringify(images));
|
||||
|
||||
Vendored
BIN
Binary file not shown.
|
Before Width: | Height: | Size: 86 KiB After Width: | Height: | Size: 98 KiB |
+1
-2
@@ -23,7 +23,7 @@
|
||||
"d3": "3.3.8",
|
||||
"smash": "0.0",
|
||||
"uglify-js": "~2.2.5",
|
||||
"maki": "0.1",
|
||||
"maki": "0.3",
|
||||
"jshint": "2.3.0",
|
||||
"mocha": "~1.12",
|
||||
"mocha-phantomjs": "~3.1.0",
|
||||
@@ -35,7 +35,6 @@
|
||||
"js-yaml": "~2.0.3",
|
||||
"request": "~2.16.2",
|
||||
"jsonschema": "~0.3.2",
|
||||
"node-sprite": "~0.1.2",
|
||||
"delve": "0.2",
|
||||
"editor-imagery-index": "git://github.com/osmlab/editor-imagery-index.git#gh-pages"
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user