Modify

Opened 6 years ago

Closed 4 years ago

Last modified 3 years ago

#15240 closed enhancement (fixed)

transform gui icons to svg

Reported by: Klumbumbus Owned by: team
Priority: major Milestone: 20.08
Component: Core Version:
Keywords: svg png icon ex-longterm Cc:

Description (last modified by Klumbumbus)

Since we have an icon scaling on hidpi screens now (ticket:9995#comment:110) it would be nice to transform all icons to svg. Preset icons are already all svg (#13357)

Here are the current numbers: 60 svg icons and 270 png icons. This statistic excludes the folders images/presets, images/icons (only potlatch icons), our logo (which exists 6 times as png versions additionally to svg) and two special cases (lambert maps).



I think we could ask the osm community for help on this subject.

There are two possibilities:

  • transform the 270 png to svg
  • create a whole new icon set with an consistent look

For the second, there was already such an (not fully complete) dataset, see JOSM themes:






progress since creation of this ticket:


(numbers of svg icons not recorded between 09/2017 and 12/2019)


end result on 2020-08-17:

In total:

  • 1160 svg icons (821 presets/mappaint style + 339 GUI)
  • 124 potlatch mappaint style png icons
  • 6 png icons of the logo in different sizes

Attachments (97)

png_icons.png (161.2 KB ) - added by Klumbumbus 6 years ago.
svg_icons.png (22.8 KB ) - added by Klumbumbus 6 years ago.
black-red.jpg (5.6 KB ) - added by Don-vip 6 years ago.
blue-red.jpg (6.4 KB ) - added by Don-vip 6 years ago.
monochrome.jpg (4.9 KB ) - added by Don-vip 6 years ago.
standart.jpg (5.1 KB ) - added by Don-vip 6 years ago.
statusline-svg.patch (2.2 KB ) - added by floscher 6 years ago.
Proposal for SVG icons for the status line
statusline.gif (53.3 KB ) - added by floscher 6 years ago.
Animated comparison between the statusline icons (current and proposed)
statusline-before.png (1.4 KB ) - added by floscher 6 years ago.
Current appearance of the statusline icons
statusline-after.png (1.2 KB ) - added by floscher 6 years ago.
Proposed appearance of the statusline icons
anglesnap.svg (552 bytes ) - added by floscher 6 years ago.
alignline.svg (443 bytes ) - added by floscher 6 years ago.
black_x.svg (200 bytes ) - added by floscher 6 years ago.
Replacement for misc/black_x.png
green_check.svg (477 bytes ) - added by floscher 6 years ago.
Replacement for misc/green_check.png
green_check.2.svg (484 bytes ) - added by floscher 6 years ago.
Replacement for misc/green_check.png
246png.png (152.2 KB ) - added by Klumbumbus 6 years ago.
separator.svg (218 bytes ) - added by floscher 6 years ago.
Replacement for preferences/separator.png
closedway.svg (311 bytes ) - added by anonymous 6 years ago.
Replacement for data/closedway.png
multipolygon.svg (527 bytes ) - added by floscher 6 years ago.
Replacement for data/multipolygon.png
node.svg (246 bytes ) - added by floscher 6 years ago.
Replacement for data/node.png
sequence.svg (876 bytes ) - added by floscher 6 years ago.
Replacement for data/sequence.png
way.svg (287 bytes ) - added by floscher 6 years ago.
Replacement for data/way.png
separator.2.svg (225 bytes ) - added by floscher 6 years ago.
Replacement for data/sequence.png
aligncircle.svg (326 bytes ) - added by floscher 6 years ago.
Replacement for aligncircle.png
taginfo.svg (292 bytes ) - added by floscher 6 years ago.
Replacement for dialogs/taginfo.png
aligncircle.2.svg (327 bytes ) - added by floscher 6 years ago.
New version for aligncircle.png
apply.svg (485 bytes ) - added by floscher 6 years ago.
Replacement for apply.png
gray_check.svg (485 bytes ) - added by floscher 6 years ago.
Replacement for misc/gray_check.png
ti_jochen.png (101.2 KB ) - added by stoecker 6 years ago.
TagInfo image from Jochen Topf
taginfo_preview.png (2.1 KB ) - added by Don-vip 6 years ago.
taginfo.2.svg (615 bytes ) - added by floscher 6 years ago.
Updated TagInfo logo with more contrast
taginfo_preview2.png (3.9 KB ) - added by floscher 6 years ago.
Preview of the context menu with TagInfo logo
rectangle.svg (211 bytes ) - added by floscher 6 years ago.
normal.svg (243 bytes ) - added by floscher 6 years ago.
crosshair.2.svg (221 bytes ) - added by floscher 6 years ago.
crosshair.svg (221 bytes ) - added by floscher 6 years ago.
select_add.svg (446 bytes ) - added by floscher 6 years ago.
selection.svg (384 bytes ) - added by floscher 6 years ago.
select_node.svg (443 bytes ) - added by floscher 6 years ago.
select_node_add.svg (505 bytes ) - added by floscher 6 years ago.
select_node_remove.svg (487 bytes ) - added by floscher 6 years ago.
select_remove.svg (428 bytes ) - added by floscher 6 years ago.
select_way.svg (512 bytes ) - added by floscher 6 years ago.
select_way_add.svg (574 bytes ) - added by floscher 6 years ago.
select_way_remove.svg (556 bytes ) - added by floscher 6 years ago.
close.svg (280 bytes ) - added by floscher 4 years ago.
replacement for misc/close.png
combineway.svg (353 bytes ) - added by floscher 4 years ago.
replacement for combineway.png
grey_x.svg (468 bytes ) - added by floscher 4 years ago.
replacement for misc/grey_x.png
joinnodeway.svg (299 bytes ) - added by floscher 4 years ago.
replacement for joinnodeway.png
minimized.svg (249 bytes ) - added by floscher 4 years ago.
replacement for misc/minimized.png
normal.2.svg (252 bytes ) - added by floscher 4 years ago.
replacement for misc/normal.png
rectangle.2.svg (478 bytes ) - added by floscher 4 years ago.
replacement for misc/rectangle.png
reorder.svg (331 bytes ) - added by floscher 4 years ago.
replacement for reorder.png
downloadalongtrack.svg (348 bytes ) - added by floscher 4 years ago.
replacement for downloadalongtrack.png
download_along_way.svg (348 bytes ) - added by floscher 4 years ago.
replacement for download_along_way.png
addnode.svg (279 bytes ) - added by floscher 4 years ago.
add_node_lock.svg (398 bytes ) - added by floscher 4 years ago.
create_note.svg (463 bytes ) - added by floscher 4 years ago.
joinnode.svg (247 bytes ) - added by floscher 4 years ago.
joinway.svg (275 bytes ) - added by floscher 4 years ago.
lock.svg (258 bytes ) - added by floscher 4 years ago.
mode.svg (300 bytes ) - added by floscher 4 years ago.
parallel.svg (335 bytes ) - added by floscher 4 years ago.
parallel_add.svg (411 bytes ) - added by floscher 4 years ago.
parallel_remove.svg (391 bytes ) - added by floscher 4 years ago.
audio-tracer.svg (137 bytes ) - added by floscher 4 years ago.
Bridge.svg (207 bytes ) - added by floscher 4 years ago.
Crossing.svg (172 bytes ) - added by floscher 4 years ago.
addnote.svg (486 bytes ) - added by floscher 4 years ago.
addsegment.svg (212 bytes ) - added by floscher 4 years ago.
png_icons.2.png (232.9 KB ) - added by floscher 4 years ago.
svg_icons.2.png (75.1 KB ) - added by floscher 4 years ago.
toggledialogsframe.png (25.8 KB ) - added by Klumbumbus 4 years ago.
josm_toggle_dialog_frame.png (71.6 KB ) - added by skyper 4 years ago.
menu windows screenshot
frame.png (417 bytes ) - added by Klumbumbus 4 years ago.
p2.svg (627 bytes ) - added by Stereo 4 years ago.
Replaces resources/images/dialogs/mappaint/pl2_small.png
josm-all-png.PNG (401.2 KB ) - added by Stereo 4 years ago.
PNG files in the JOSM source tree on 2020-03-30
Extrude.svg (1.4 KB ) - added by Stereo 4 years ago.
Based off Tango's Applications-accessories, replacement for resources/images/mapmode/extrude/extrude.png
Upload.svg (13.2 KB ) - added by Stereo 4 years ago.
Based of Gnome-document-save, replacement for resources/images/upload.png
Upload-selection.svg (13.3 KB ) - added by Stereo 4 years ago.
Based of Gnome-document-save (see Upload.svg) and JOSM's way-select.svg, improved replacement for resources/images/uploadselection.png
overpass-api-small (1).svg (2.8 KB ) - added by Stereo 4 years ago.
Based off Overpass API logo but with thicker lines, improved replacement for resources/images/download-overpass.png
qa.svg (931 bytes ) - added by Stereo 4 years ago.
The blue validation checkmark is easily one of the ugliest icons in JOSM, but also one of the most recognisable ones. I've vectorised an improved, flatter one.
activate-down.svg (400 bytes ) - added by Stereo 4 years ago.
Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/preferences/activate-down.png
activate-right.svg (396 bytes ) - added by Stereo 4 years ago.
Same as activate_down but to replace ./resources/images/preferences/activate-right.png
useallleft.svg (757 bytes ) - added by Stereo 4 years ago.
Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/dialogs/conflict/useallleft.png
useallright.svg (757 bytes ) - added by Stereo 4 years ago.
Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/dialogs/conflict/useallright.png
Tower_dome.svg (806 bytes ) - added by skyper 4 years ago.
[[JOSMImage(...)]] could be replaced with [[Image(...)]] osmwiki:File:Tower_dome.svg as the first does not look nice in preset menu
updownloadicons.png (10.9 KB ) - added by Klumbumbus 4 years ago.
2020-08-12-225226.png (3.7 KB ) - added by simon04 4 years ago.
josm-remaining-png.PNG (37.7 KB ) - added by Stereo 4 years ago.
Nine remaining PNGs as of 2020-08-14
qgis2416px.PNG (1.9 KB ) - added by Klumbumbus 4 years ago.
svg_icons_complete.png (173.7 KB ) - added by Klumbumbus 4 years ago.
chart.png (31.3 KB ) - added by Klumbumbus 4 years ago.
cloud1.png (7.6 KB ) - added by Klumbumbus 4 years ago.
imagery_variants.png (33.7 KB ) - added by Klumbumbus 4 years ago.
computers.PNG (23.7 KB ) - added by Klumbumbus 3 years ago.
newticket.png (2.3 KB ) - added by Klumbumbus 3 years ago.

Download all attachments as: .zip

Change History (349)

by Klumbumbus, 6 years ago

Attachment: png_icons.png added

by Klumbumbus, 6 years ago

Attachment: svg_icons.png added

comment:1 by Don-vip, 6 years ago

Keywords: svg png icon added
Priority: normalmajor

comment:2 by Klumbumbus, 6 years ago

Description: modified (diff)

in reply to:  description comment:3 by Don-vip, 6 years ago

Replying to Klumbumbus:

For the second, there was already such an (not fully complete) dataset, see JOSM themes. Sadly the links and screenshoots in the forum are no longer available. Maybe we could recover them.

I remember very well. Felis was one of the finalists for the LogoContest and he almost won. It was really a hard thing to choose between the two final designs. I love what he did, too bad we can't have two logos :D

I just sent him an e-mail to let it know about this ticket.

comment:4 by Felis Pimeja, 6 years ago

FYI, as long as Dropbox has changed sharing mechanics, theme files are now available at:

https://drive.google.com/file/d/0BzTaubB85qV2cEFPcnA2UTBZbG8/view?usp=sharing

And I'm searching for the source files now.

comment:5 by bastiK, 6 years ago

Our current icons are partly based on the Tango icon theme, which has an svg set. See also GNOME set (based on Tango) with icons for download, delete and others.

in reply to:  4 comment:6 by bastiK, 6 years ago

Replying to Felis Pimeja:

FYI, as long as Dropbox has changed sharing mechanics, theme files are now available at:

https://drive.google.com/file/d/0BzTaubB85qV2cEFPcnA2UTBZbG8/view?usp=sharing

And I'm searching for the source files now.

Wow, it's pretty good! I like the black-red color scheme.

by Don-vip, 6 years ago

Attachment: black-red.jpg added

by Don-vip, 6 years ago

Attachment: blue-red.jpg added

by Don-vip, 6 years ago

Attachment: monochrome.jpg added

by Don-vip, 6 years ago

Attachment: standart.jpg added

comment:7 by Don-vip, 6 years ago

Description: modified (diff)

comment:8 by Don-vip, 6 years ago

See also new default theme for Gnome 3: https://git.gnome.org/browse/adwaita-icon-theme/

comment:9 by stoecker, 6 years ago

The colorschemes like black-red do look good, but in my eyes they aren't good as the standard design. This should still be colorful (when possible with a bit more unified style :-).

comment:10 by bastiK, 6 years ago

How to move forward?

I noticed that some of the vector icons don't scale well down to very small sizes:

Current download icon (24x24px):
https://josm.openstreetmap.de/export/7668/josm/trunk/images/download.png
Scalable image, rendered at 48x48 px:
https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Gnome-document-save.svg/48px-Gnome-document-save.svg.png
Scalable image, rendered at 24x24 px
https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Gnome-document-save.svg/24px-Gnome-document-save.svg.png

Just replacing the current download.png by download.svg would be nice for HiDPI users, but clearly is a loss in image quality for everyone else. My conclusion so far is that some scalable images are designed with a certain minimum size in mind and will just look bad when scaled below that limit. This affects some icons more than others, the undo/redo image scales fine for example.

Possible solutions:

  • Find svg icons that scale well to 24x24 px (and decently well to 16x16 px for the menus).
  • Ship both the 24x24px "pixel art" and the .svg and use whatever image is better suited.

in reply to:  10 ; comment:11 by Don-vip, 6 years ago

Replying to bastiK:

Possible solutions:

  • Find svg icons that scale well to 24x24 px (and decently well to 16x16 px for the menus).
  • Ship both the 24x24px "pixel art" and the .svg and use whatever image is better suited.

I don't think we will succeed to find good SVG icons scalable to small sizes. It's already difficult enough to find a SVG version. This leaves only the second option.

in reply to:  11 ; comment:12 by stoecker, 6 years ago

Replying to Don-vip:

Replying to bastiK:

Possible solutions:

  • Find svg icons that scale well to 24x24 px (and decently well to 16x16 px for the menus).
  • Ship both the 24x24px "pixel art" and the .svg and use whatever image is better suited.

I don't think we will succeed to find good SVG icons scalable to small sizes. It's already difficult enough to find a SVG version. This leaves only the second option.

  • Change the icons, so that the vanishing elements (usually some sort of boundaries) are wider, so they don't vanish.

E.g. see point 7 here: ​https://www.creativebloq.com/how-to/10-golden-rules-for-responsive-svgs

in reply to:  12 ; comment:13 by bastiK, 6 years ago

Replying to stoecker:

Replying to Don-vip:

Replying to bastiK:

Possible solutions:

  • Find svg icons that scale well to 24x24 px (and decently well to 16x16 px for the menus).
  • Ship both the 24x24px "pixel art" and the .svg and use whatever image is better suited.

I don't think we will succeed to find good SVG icons scalable to small sizes. It's already difficult enough to find a SVG version. This leaves only the second option.

  • Change the icons, so that the vanishing elements (usually some sort of boundaries) are wider, so they don't vanish.

E.g. see point 7 here: ​https://www.creativebloq.com/how-to/10-golden-rules-for-responsive-svgs

This is more the job of a graphics designer that that of a programmer. Take the download icon posted above as an example: How can you modify the SVG without loss of quality in either the 24 px (top) or the 48 px rendering?

Anyway, if we implement option 2, it is still possible to improve the SVGs one by one, as suggested.

in reply to:  13 comment:14 by stoecker, 6 years ago

This is more the job of a graphics designer that that of a programmer. Take the download icon posted above as an example: How can you modify the SVG without loss of quality in either the 24 px (top) or the 48 px rendering?

Anyway, if we implement option 2, it is still possible to improve the SVGs one by one, as suggested.

Sure.

But the option 2 means a workaround which again will live MANY years. I personally would rather accept slightly worse low-zoom icons than another workaround.

comment:15 by stoecker, 6 years ago

P.S. We already had 24x24 menu icons. Maybe default simply should be 30x30 nowadays even for normal screens?

by floscher, 6 years ago

Attachment: statusline-svg.patch added

Proposal for SVG icons for the status line

by floscher, 6 years ago

Attachment: statusline.gif added

Animated comparison between the statusline icons (current and proposed)

comment:16 by floscher, 6 years ago

I propose to replace the icons in the statusline with SVG versions.
Below you see a comparison between the current icons (PNG, 18×18 pixels, scaled to 180×180), then how my proposed SVG icons look when converted to a 18×18 raster image scaled up to 180×180 pixels. And finally how the SVG icons look as 180×180 pixel image.
Animated comparison between the statusline icons (current and proposed)
(https://josm.openstreetmap.de/attachment/ticket/15240/statusline-svg.patch is the corresponding patch)

by floscher, 6 years ago

Attachment: statusline-before.png added

Current appearance of the statusline icons

by floscher, 6 years ago

Attachment: statusline-after.png added

Proposed appearance of the statusline icons

comment:17 by floscher, 6 years ago

Before:
Current appearance of the statusline icons
After:
Proposed appearance of the statusline icons

comment:18 by stoecker, 6 years ago

In 13363/josm:

see #15240 replace statusline png icons with svg variants by floscher, set mime-types for many images

comment:19 by stoecker, 6 years ago

No need to do such a impressive presentation. :) The new images and a before/after is enough. We plan to replace all PNG images anyway.

comment:20 by Don-vip, 6 years ago

Nice! thank you :)

comment:21 by Hb---, 6 years ago

References to the old PNG-files are still used in the wiki, please see https://josm.openstreetmap.de/wiki/Help/StatusBar
Wiki has been updated.

Last edited 6 years ago by Hb--- (previous) (diff)

comment:22 by bastiK, 6 years ago

In 13375/josm:

see #15240 - replace image for geoimage layer with svg version (from Tango icon project)

comment:23 by stoecker, 6 years ago

In 13376/josm:

see #15240 - set proper mime-type

comment:24 by Klumbumbus, 6 years ago

some icons replaced in #16159

by floscher, 6 years ago

Attachment: anglesnap.svg added

by floscher, 6 years ago

Attachment: alignline.svg added

by floscher, 6 years ago

Attachment: black_x.svg added

Replacement for misc/black_x.png

by floscher, 6 years ago

Attachment: green_check.svg added

Replacement for misc/green_check.png

by floscher, 6 years ago

Attachment: green_check.2.svg added

Replacement for misc/green_check.png

comment:25 by floscher, 6 years ago

Here are four more:
https://josm.openstreetmap.de/export/13612/josm/trunk/images/anglesnap.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/alignline.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/misc/black_x.png Replacement for misc/black_x.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/misc/green_check.png Replacement for misc/green_check.png

By the way: Can the icons dialogs/valid https://josm.openstreetmap.de/export/13612/josm/trunk/images/dialogs/valid.png and misc/check_large https://josm.openstreetmap.de/export/13612/josm/trunk/images/misc/check_large.png also be replaced by the checkmark above or is there a need for three different green checkmarks?

comment:26 by stoecker, 6 years ago

In 13613/josm:

see #15240 - new SVG icons

comment:27 by stoecker, 6 years ago

I didn't replace misc/check_large. It is used in the upload dialog and I'd say it looks better there than the boxy green_check.

comment:28 by Klumbumbus, 6 years ago

interim result: 246 png icons left :)

by Klumbumbus, 6 years ago

Attachment: 246png.png added

comment:29 by stoecker, 6 years ago

Hmm, are sure that's right? The green check is svg and the large is missing and some icons are in two sizes and 3 blue checkmarks?

comment:30 by stoecker, 6 years ago

BTW The WMS/TMS related icons are all ugly.

Better ones would be fine.

comment:31 by Klumbumbus, 6 years ago

It seems you accidently moved the large green check to nodist instead of source:trunk/images/misc/green_check.png.

comment:32 by Klumbumbus, 6 years ago

in the screenshot I scaled all icons to 24px. multiple icons appear when there are different sizes available, e.g. source:trunk/images/imagery_menu.pngsource:trunk/images/imagery_small.pngsource:trunk/images/preferences/imagery.png source:trunk/images/dialogs/validator.pngsource:trunk/images/layer/validator_small.pngsource:trunk/images/preferences/validator.png

should be unified when replayed by svg

comment:33 by Klumbumbus, 6 years ago

Code of the screenshot. Can be used here in wiki with comment preview feature. (But takes a bit to load all images which is why I made the screenshot)

edit: code outdated and removed

Last edited 4 years ago by Klumbumbus (previous) (diff)

in reply to:  31 comment:34 by stoecker, 6 years ago

Replying to Klumbumbus:

It seems you accidently moved the large green check to nodist instead of source:trunk/images/misc/green_check.png.

Ooops. Can someone please fix this before next build?

comment:35 by Klumbumbus, 6 years ago

could be a meme: JOSM user level expert: knows the difference between the upload icon and the upload selection icon
source:trunk/images/upload.pngsource:trunk/images/uploadselection.png

Last edited 6 years ago by Klumbumbus (previous) (diff)

comment:36 by Klumbumbus, 6 years ago

In 13615/josm:

see #15240 - fix moved icons

in reply to:  35 comment:37 by Don-vip, 6 years ago

Replying to Klumbumbus:

could be a meme: JOSM user level expert: knows the difference between the upload icon and the upload selection icon
source:trunk/images/upload.pngsource:trunk/images/uploadselection.png

hahaha :D

by floscher, 6 years ago

Attachment: separator.svg added

Replacement for preferences/separator.png

by anonymous, 6 years ago

Attachment: closedway.svg added

Replacement for data/closedway.png

by floscher, 6 years ago

Attachment: multipolygon.svg added

Replacement for data/multipolygon.png

by floscher, 6 years ago

Attachment: node.svg added

Replacement for data/node.png

by floscher, 6 years ago

Attachment: sequence.svg added

Replacement for data/sequence.png

by floscher, 6 years ago

Attachment: way.svg added

Replacement for data/way.png

by floscher, 6 years ago

Attachment: separator.2.svg added

Replacement for data/sequence.png

by floscher, 6 years ago

Attachment: aligncircle.svg added

Replacement for aligncircle.png

by floscher, 6 years ago

Attachment: taginfo.svg added

Replacement for dialogs/taginfo.png

comment:38 by floscher, 6 years ago

And some more:
https://josm.openstreetmap.de/export/13612/josm/trunk/images/preferences/separator.pngReplacement for data/sequence.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/data/closedway.pngReplacement for data/closedway.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/data/multipolygon.pngReplacement for data/multipolygon.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/data/node.pngReplacement for data/node.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/data/sequence.pngReplacement for data/sequence.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/data/way.pngReplacement for data/way.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/dialogs/taginfo.pngReplacement for dialogs/taginfo.png
https://josm.openstreetmap.de/export/13612/josm/trunk/images/aligncircle.pngReplacement for aligncircle.png

The last one I changed, because the line around really should be the circle (I think), not the ways connecting the nodes. So I changed the color (if you want some other color, we could change it). And I made the points more irregular to emphasize that the nodes are not evenly distributed around a circle, but only moved to the closest point on a circle.

comment:39 by stoecker, 6 years ago

Hmm. taginfo does still not look nice. It's the website favicon, but looks ugly. Adding the world logo from the website behind the ti?

in reply to:  39 comment:40 by anonymous, 6 years ago

Replying to stoecker:

Hmm. taginfo does still not look nice. It's the website favicon, but looks ugly. Adding the world logo from the website behind the ti?

Don't know if that would work at this resolution (16x16). Probably has to be something simpler.

comment:41 by Don-vip, 6 years ago

Maybe just frame it with something like https://png.icons8.com/metro/50/000000/note.png

comment:42 by stoecker, 6 years ago

Or let the t look a bit like a "tag"?

comment:43 by stoecker, 6 years ago

https://www.google.de/search?q=icon+tag
They all have a hole inside.
Or simply such a tag with an i or ti inside. When we have something better we'd need to ask Jochen if he likes it.

comment:44 by Klumbumbus, 6 years ago

Or we pixel align the current taginfo icon a bit to make it look a bit sharper.

Regarding https://josm.openstreetmap.de/export/13612/josm/trunk/images/aligncircle.pngReplacement for aligncircle.png I agree that there should be a circle in the icon instead of a pentagon to better illustrate the align in circle action. However the irregular pattern destroys this illustration again a bit in my opinion. And if you select a way and hit O then the nodes are indeed evenly distributed. The thin light green is pretty hard to recognize on a light background too.

Currently Help/Action/AlignInCircle and Help/Action/CreateCircle use the same icon. While the align action works on single nodes too, the create action always creates a way, so probably the black way lines shouldn't be removed from the create action icon.

My suggestion (but I didn't test how it looks): a circle and even distributed nodes for both icons; for the create action the circle is black and for the align action grey or another color (but a bit darker than the light green).

by floscher, 6 years ago

Attachment: aligncircle.2.svg added

New version for aligncircle.png

comment:45 by floscher, 6 years ago

Here's my draft for an alternative TagInfo logo:
Updated TagInfo logo with more contrast

And another version of aligncircle: New version for aligncircle.png.

@Klumbumbus: Actually it depends on what you select if the nodes distribute equally around the circle: When selecting a way, they do. When selecting only the nodes, they do not distribute evenly around the circle. I thought they were always only jumping to their nearest position on the circle, but it seems to be more complicated.
Anyway, I now changed the icon to show evenly distributed nodes, also for aesthetic reasons. Also the color is now grey. I think a second version in black would be too much, especially because they are too similar… Not that in the end your joke about the download icons really becomes a meme 😉

in reply to:  45 ; comment:46 by stoecker, 6 years ago

Replying to floscher:

Here's my draft for an alternative TagInfo logo:

I contacted Jochen and asked for his opinion.

comment:47 by stoecker, 6 years ago

In 13630/josm:

see #15240 - new SVG icons made by floscher

by floscher, 6 years ago

Attachment: apply.svg added

Replacement for apply.png

comment:48 by Klumbumbus, 6 years ago

(replacement for gray_check.png source:trunk/images/misc/gray_check.png can be derived from the green and blue one too)

by floscher, 6 years ago

Attachment: gray_check.svg added

Replacement for misc/gray_check.png

comment:49 by floscher, 6 years ago

You might consider renaming gray_check.svg to grey_check.svg. Next to it there is the file grey_x.png, which uses the other spelling.

comment:50 by Hb---, 6 years ago

On Plugins the images /browser/trunk/images/misc/black_x.png and ../green_check.png are missing now.

They are placed by a script in the last column to indicate if a plugin needs a restart. The alt parameters for the images are localized. This script needs to be modified.

Replacing the former PNG images with their SVG counterparts will make the page display in the Help Browser worse, because that Browser can't properly resize images currently. Simple characters like ✓ and ✕ may give the same information.

in reply to:  50 ; comment:51 by Klumbumbus, 6 years ago

Did someone fix this already? The icons are displayed fine for me. (I remember that i fixed wiki:JavaBugs and wiki:OldJavaBugs 5 weeks ago and I think that the Plugins page was already working fine a that point.)

Replying to Hb---:

Replacing the former PNG images with their SVG counterparts will make the page display in the Help Browser worse, because that Browser can't properly resize images currently.

That shouldn't be a problem anyway in this case as these two icons have a small base size and shouldn't be resized.

Last edited 6 years ago by Klumbumbus (previous) (diff)

in reply to:  51 comment:52 by stoecker, 6 years ago

Replying to Klumbumbus:

Did someone fix this already?

Yes.

comment:53 by Don-vip, 6 years ago

In 13832/josm:

fix #5603, see #5256, see #15240 - add first/last buttons for geoimage dialog. Fixed shortcuts. Switch to SVG icons taken from https://commons.wikimedia.org/wiki/GNOME_Desktop_icons#Navigation

comment:54 by Don-vip, 6 years ago

In 13837/josm:

see #15240 - convert more GNOME icons to SVG versions. Taken from https://commons.wikimedia.org/wiki/Category:GNOME_Desktop_icons

comment:55 by Klumbumbus, 6 years ago

duplicate icons:
source:trunk/images/help/previous.svgsource:trunk/images/dialogs/previous.svg
source:trunk/images/help/next.svgsource:trunk/images/dialogs/next.svg

Last edited 6 years ago by Klumbumbus (previous) (diff)

comment:56 by Don-vip, 6 years ago

In 13844/josm:

see #15240 - remove duplicated icons

in reply to:  46 comment:57 by Don-vip, 6 years ago

Replying to stoecker:

I contacted Jochen and asked for his opinion.

any news?

comment:58 by Don-vip, 6 years ago

Another thing: the icon warnings scripts says bookmark.svg is not used, but it is:

        static ImageIcon getDefaultIcon() {
            return ImageProvider.get("dialogs", "bookmark", ImageSizes.SMALLICON);
        }

by stoecker, 6 years ago

Attachment: ti_jochen.png added

TagInfo image from Jochen Topf

comment:59 by stoecker, 6 years ago

TagInfo image from Jochen Topf

Jochen sent me this image which he also uses (which is to large for our purpose), but didn't answer whether he likes or does not like the small icon.

I'd say we simply use floscher's icon in JOSM.

comment:60 by stoecker, 6 years ago

In 13857/josm:

see #15240 - detect another type of ImageProvider calls for in image check script

by Don-vip, 6 years ago

Attachment: taginfo_preview.png added

comment:61 by Don-vip, 6 years ago

It's nice but the contrast should be increased, it's hard to view the tag on grey background:


by floscher, 6 years ago

Attachment: taginfo.2.svg added

Updated TagInfo logo with more contrast

by floscher, 6 years ago

Attachment: taginfo_preview2.png added

Preview of the context menu with TagInfo logo

comment:62 by floscher, 6 years ago

Should now be better:
Updated TagInfo logo with more contrast
Preview of the context menu with TagInfo logo

comment:63 by Don-vip, 6 years ago

In 13860/josm:

see #15240 - use new taginfo icon (by floscher)

comment:64 by Klumbumbus, 6 years ago

In 13862/josm:

see #15240 - new SVG icons made by floscher

comment:65 by Klumbumbus, 6 years ago

In 13863/josm:

see #15240 - add svg mime type

by floscher, 6 years ago

Attachment: rectangle.svg added

by floscher, 6 years ago

Attachment: normal.svg added

comment:66 by floscher, 6 years ago

Replacements for some icons in the directory images/cursor/modifier:
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/rectangle.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_add.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/selection.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node_add.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node_remove.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_remove.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_way.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_way_add.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_way_remove.png

As well as these two in images/cursor:
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/crosshair.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/normal.png

Last edited 6 years ago by Don-vip (previous) (diff)

by floscher, 6 years ago

Attachment: crosshair.2.svg added

by floscher, 6 years ago

Attachment: crosshair.svg added

comment:67 by Don-vip, 6 years ago

In 13871/josm:

see #15240 - switch 12 cursor icons to SVG (by floscher)

comment:68 by Klumbumbus, 6 years ago

Did you accidently not pixel align the red node symbols at these three icons?

https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node_add.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node_remove.png

by floscher, 6 years ago

Attachment: select_add.svg added

by floscher, 6 years ago

Attachment: selection.svg added

by floscher, 6 years ago

Attachment: select_node.svg added

by floscher, 6 years ago

Attachment: select_node_add.svg added

by floscher, 6 years ago

Attachment: select_node_remove.svg added

by floscher, 6 years ago

Attachment: select_remove.svg added

by floscher, 6 years ago

Attachment: select_way.svg added

by floscher, 6 years ago

Attachment: select_way_add.svg added

by floscher, 6 years ago

Attachment: select_way_remove.svg added

in reply to:  68 comment:69 by floscher, 6 years ago

Replying to Klumbumbus:

Did you accidently not pixel align the red node symbols at these three icons?

https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node_add.png
https://josm.openstreetmap.de/export/13870/josm/trunk/images/cursor/modifier/select_node_remove.png

Yes, good catch, thank you! I corrected the icons. And I also made a small modification to the other select-modifiers, which shouldn't change the appearance in JOSM, but in some image viewing programs (e.g. Gimp) the dashed line should display correctly.

comment:70 by Klumbumbus, 6 years ago

In 13874/josm:

see #15240 - update 9 SVG icons made by floscher, add svg mime type

comment:71 by Don-vip, 6 years ago

@bastiK @michael2402 The test MapCSSRendererTest.testRender[area-fill-image] is both failing and slower on Jenkins since r13862, could you please have a look? Surprisingly the test is OK on my machine.

comment:72 by Klumbumbus, 6 years ago

Description: modified (diff)

add progress chart to ticket description, little motivation ;)

in reply to:  71 comment:73 by Don-vip, 6 years ago

@bastiK @michael2402

up? Is the test failing for you?

comment:74 by Don-vip, 6 years ago

In 13904/josm:

see #15240 - drop png suffix in renderer unit tests

comment:75 by Don-vip, 6 years ago

In 13909/josm:

see #15240 - update renderer unit test reference image

comment:76 by Klumbumbus, 4 years ago

Milestone: Longterm

by floscher, 4 years ago

Attachment: close.svg added

replacement for misc/close.png

by floscher, 4 years ago

Attachment: combineway.svg added

replacement for combineway.png

by floscher, 4 years ago

Attachment: grey_x.svg added

replacement for misc/grey_x.png

by floscher, 4 years ago

Attachment: joinnodeway.svg added

replacement for joinnodeway.png

by floscher, 4 years ago

Attachment: minimized.svg added

replacement for misc/minimized.png

by floscher, 4 years ago

Attachment: normal.2.svg added

replacement for misc/normal.png

by floscher, 4 years ago

Attachment: rectangle.2.svg added

replacement for misc/rectangle.png

by floscher, 4 years ago

Attachment: reorder.svg added

replacement for reorder.png

comment:77 by floscher, 4 years ago

a few more SVG icons:

before after
https://josm.openstreetmap.de/export/15557/josm/trunk/images/misc/close.png replacement for misc/close.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/combineway.png replacement for combineway.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/downloadalongtrack.png replacement for downloadalongtrack.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/download_along_way.png replacement for download_along_way.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/misc/grey_x.png replacement for misc/grey_x.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/joinnodeway.png replacement for joinnodeway.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/misc/minimized.png replacement for misc/minimized.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/misc/normal.png replacement for misc/normal.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/misc/rectangle.png replacement for misc/rectangle.png
https://josm.openstreetmap.de/export/15557/josm/trunk/images/reorder.png replacement for reorder.png
Last edited 4 years ago by floscher (previous) (diff)

by floscher, 4 years ago

Attachment: downloadalongtrack.svg added

replacement for downloadalongtrack.png

by floscher, 4 years ago

Attachment: download_along_way.svg added

replacement for download_along_way.png

comment:78 by Klumbumbus, 4 years ago

Where are grey_x, rectangle and reorder used in JOSM? I can't find them right now.

comment:80 by floscher, 4 years ago

I'm currently looking at icons in https://josm.openstreetmap.de/browser/josm/trunk/images/cursor/modifier?rev=15558 and found that some of them have a white outline that is not completely opaque. But the icons are not really consistent on how opaque/transparent that white outline is. For example https://josm.openstreetmap.de/browser/josm/trunk/images/cursor/modifier/joinway.png?rev=15558 has opacity values 196, 204 and 231 (of 255) for different parts of the icon.

Should these white outlines have a bit of transparency? If yes how much?

Last edited 4 years ago by floscher (previous) (diff)

comment:81 by Klumbumbus, 4 years ago

I think transparency is probably not needed on these outlines. At least on stadard dpi screens I guess you don't see an difference between full white and such a slight transparency at all. Not sure about hi dpi screens.

comment:82 by Klumbumbus, 4 years ago

In 15571/josm:

see #15240 - new SVG icons made by floscher

comment:83 by Klumbumbus, 4 years ago

Thanks for the icons.

I couldn't figure out how to get an Image marker layer, so I hope this icon works fine ;)

by floscher, 4 years ago

Attachment: addnode.svg added

by floscher, 4 years ago

Attachment: add_node_lock.svg added

by floscher, 4 years ago

Attachment: create_note.svg added

by floscher, 4 years ago

Attachment: joinnode.svg added

by floscher, 4 years ago

Attachment: joinway.svg added

by floscher, 4 years ago

Attachment: lock.svg added

by floscher, 4 years ago

Attachment: mode.svg added

by floscher, 4 years ago

Attachment: parallel.svg added

by floscher, 4 years ago

Attachment: parallel_add.svg added

by floscher, 4 years ago

Attachment: parallel_remove.svg added

by floscher, 4 years ago

Attachment: audio-tracer.svg added

by floscher, 4 years ago

Attachment: Bridge.svg added

by floscher, 4 years ago

Attachment: Crossing.svg added

by floscher, 4 years ago

Attachment: addnote.svg added

comment:84 by floscher, 4 years ago

some more SVG icons:

before after
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/addnode.png cursor/modifier/addnode
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/add_node_lock.png cursor/modifier/add_node_lock
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/create_note.png cursor/modifier/create_note
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/joinnode.png cursor/modifier/joinnode
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/joinway.png cursor/modifier/joinway
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/lock.png cursor/modifier/lock
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/mode.png cursor/modifier/mode
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/parallel.png cursor/modifier/parallel
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/parallel_add.png cursor/modifier/parallel_add
https://josm.openstreetmap.de/export/15576/josm/trunk/images/cursor/modifier/parallel_remove.png cursor/modifier/parallel_remove
https://josm.openstreetmap.de/export/15576/josm/trunk/images/mapmode/addnote.png mapmode/addnote
https://josm.openstreetmap.de/export/15576/josm/trunk/images/mapmode/addsegment.png mapmode/addsegment
https://josm.openstreetmap.de/export/15576/josm/trunk/images/markers/audio-tracer.png markers/audio-tracer
https://josm.openstreetmap.de/export/15576/josm/trunk/images/markers/Bridge.png markers/Bridge
https://josm.openstreetmap.de/export/15576/josm/trunk/images/markers/Crossing.png markers/Crossing
Last edited 4 years ago by floscher (previous) (diff)

by floscher, 4 years ago

Attachment: addsegment.svg added

by floscher, 4 years ago

Attachment: png_icons.2.png added

by floscher, 4 years ago

Attachment: svg_icons.2.png added

comment:85 by floscher, 4 years ago

Description: modified (diff)

comment:86 by Klumbumbus, 4 years ago

In 15577/josm:

see #15240 - new SVG icons made by floscher

comment:87 by Klumbumbus, 4 years ago

Description: modified (diff)

comment:89 by Klumbumbus, 4 years ago

Description: modified (diff)

comment:90 by Klumbumbus, 4 years ago

Description: modified (diff)

comment:91 by Don-vip, 4 years ago

There's a new icon warning for Departements_Lambert4Zones.svg: Style starts with minus: -inkscape-font-specification:DejaVu Sans

Last edited 4 years ago by Don-vip (previous) (diff)

comment:92 by Klumbumbus, 4 years ago

In 15585/josm:

see #15240 - fix icon

comment:93 by Stereo, 4 years ago

https://www.sjjb.co.uk/mapicons/contactsheet has a lot of icons that we use in the potlatch2 theme - https://www.sjjb.co.uk/mapicons/svg/accommodation/alpinehut.svg could replace source:trunk/resources/images/icons/accommodation_alpinehut.n.16.png resources/images/icons/accommodation_alpinehut.n.16.png etc.

comment:94 by Stereo, 4 years ago

http://osm-icons.org/wiki/Icons has more of the same icons

comment:95 by Klumbumbus, 4 years ago

This ticket is about the icons of the programm, not the mappaint style(s). (The JOSM default mappaint style is already full svg. I personally don't plan to invest time in the potlatch mappaint style.)

comment:96 by tgertin, 4 years ago

Klumbumbus, in the JOSM wiki Introduction, the images do not work. Do you think you can get them to work? Thanks

in reply to:  96 comment:97 by Klumbumbus, 4 years ago

Replying to tgertin:

Klumbumbus, in the JOSM wiki Introduction, the images do not work. Do you think you can get them to work? Thanks

Currently all icons in the wiki which refer to the josm source code are not displayed. It will be fixed soon. See #18845.

in reply to:  95 ; comment:98 by Stereo, 4 years ago

Replying to Klumbumbus:

This ticket is about the icons of the programm, not the mappaint style(s). (The JOSM default mappaint style is already full svg. I personally don't plan to invest time in the potlatch mappaint style.)

I really like the Potlatch style. Should I open a separate ticket for it?

If I'd like to work on this, how should I submit my patch?

comment:99 by stoecker, 4 years ago

In this case a zip file with the new images and a small shell script doing the necessary svn commands would probable be the best idea (old icons moved with "svn mv" to nodist directory).

in reply to:  98 comment:100 by Klumbumbus, 4 years ago

Replying to Stereo:

Should I open a separate ticket for it?

Yes.

comment:101 by Klumbumbus, 4 years ago

Anyone knows why some toggle dialogs have that scrollbar frame and some not? Most of the toggle dialogs are kind of lists which may be scrollable. Maybe we could unify this and drop the frame?
With frame are: Selection, Relations, Mini map, Command Stack, Authors, Relation Toolbox

by Klumbumbus, 4 years ago

Attachment: toggledialogsframe.png added

comment:102 by Klumbumbus, 4 years ago

Is there an easy way to find all references to an icon in the source code?

by skyper, 4 years ago

menu windows screenshot

comment:103 by skyper, 4 years ago

Replying to Klumbumbus:

Anyone knows why some toggle dialogs have that scrollbar frame and some not?

Do not really understand, are you talking about the toggle dialog or the menu "Windows". What has your screenshot to do with your question ?

My menu looks a bit different:

menu windows screenshot

comment:104 by Klumbumbus, 4 years ago

I mean this "frame" around some icons:

by Klumbumbus, 4 years ago

Attachment: frame.png added

comment:105 by Klumbumbus, 4 years ago

Description: modified (diff)

in reply to:  104 ; comment:106 by skyper, 4 years ago

Replying to Klumbumbus:

I mean this "frame" around some icons:

Thanks got it, you are talking about the icons in the windows menu.
+1 for removing but maybe we need new icons, e.g. I am not sure if the relation icon source:trunk/resources/images/data/relation.svg is the best for the relation list. Similar is true for the selection list.

in reply to:  106 comment:107 by Klumbumbus, 4 years ago

Replying to skyper:

you are talking about the icons in the windows menu.

These are the same as in the toggle dialogs!?

by Stereo, 4 years ago

Attachment: p2.svg added

Replaces resources/images/dialogs/mappaint/pl2_small.png

comment:108 by Stereo, 4 years ago

I've added a p2.svg as attachment that replaces resources/images/dialogs/mappaint/pl2_small.png

Original: 4 KB
SVG: 627 bytes

Hey, it's still something :)

comment:109 by Klumbumbus, 4 years ago

In 16059/josm:

see #15240 - change Potlatch2 icon to svg, icon provided by Stereo

in reply to:  108 comment:110 by Klumbumbus, 4 years ago

Replying to Stereo:

Hey, it's still something :)

Thanks! (I needed to adjust the svg code a bit as JOSM was not able to display it.)

comment:111 by Stereo, 4 years ago

I haven't found an easy way of displaying all the images in one, like in the original ticket. In the end, I found this, which also adds the filename:

find . -not -path './nodist/*' -not -path '*/images/icons/*' -not -path '*/images/logo*' -not -path './test*' -not -path './native/linux/*' -name \*.png | cat - <(echo -ne "josm-all-png.PNG\0") | xargs montage -label '%f' -tile 6x

Edit: excluded nodist

Last edited 4 years ago by Stereo (previous) (diff)

by Stereo, 4 years ago

Attachment: josm-all-png.PNG added

PNG files in the JOSM source tree on 2020-03-30

comment:112 by Klumbumbus, 4 years ago

You can exclude the nodist folder.

comment:113 by Stereo, 4 years ago

Original vector files

https://commons.wikimedia.org/wiki/File:Process-stop.svg is resources/images/cancel.png ✔️

https://commons.wikimedia.org/wiki/File:Document-save.svg is resources/images/save.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Document-save-as.svg is resources/images/save_as.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Gnome-document-properties.svg is ./resources/images/dialogs/settings.png ✔️ icon removed

https://commons.wikimedia.org/wiki/File:Dialog-error.svg is resources/images/data/error.png ✔️

https://commons.wikimedia.org/wiki/File:Gnome-emblem-web.svg is resources/images/help/internet.png ✔️

https://commons.wikimedia.org/wiki/File:Gnome-text-html.svg is resources/images/markers/web.png ✔️

https://commons.wikimedia.org/wiki/File:Gnome-document-save.svg is resources/images/download.png (and the source of many other download icons, as mentioned above) ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Gtk-refresh.svg is resources/images/restart.png (but https://commons.wikimedia.org/wiki/File:View-refresh-2.svg could also be used) ✔️

https://commons.wikimedia.org/wiki/File:Gnome-zoom-fit-best.svg is ./resources/images/dialogs/zoom-best-fit.png (see zoom.png) ✔️

https://commons.wikimedia.org/wiki/File:Mail-mark-junk-2.svg is both ./resources/images/purge.png and ./resources/images/data/purge.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:View-fullscreen.svg is resources/images/view-fullscreen.png (see below for fullscreen-revert) ✔️

Near matches

https://commons.wikimedia.org/wiki/File:View-fullscreen.svg is resources/images/view-fullscreen-revert.png with all the arrows turned 180 degrees. ✔️

https://commons.wikimedia.org/wiki/File:Emblem-system.svg can replace resources/images/data/relation.png ✔️

https://commons.wikimedia.org/wiki/File:System-software-update.svg can replace resources/images/updatedata.png ✔️

https://commons.wikimedia.org/wiki/File:Text-x-generic_with_pencil.svg can replace resources/images/dialogs/edit.png . The original looks very gnome-ish, but I couldn't find the source. ✔️

https://en.wikipedia.org/wiki/Java_(programming_language)#/media/File:Java_programming_language_logo.svg can replace resources/images/java.png ✔️

https://commons.wikimedia.org/wiki/File:Document-open.svg can replace resources/images/open.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Emblem-notice.svg can replace resources/images/info.png ✔️

https://github.com/GNOME/gimp/blob/mainline/icons/Color/24/gimp-tool-free-select.svg can replace resources/images/mapmode/rope.png ✔️

https://commons.wikimedia.org/wiki/File:Gnome-zoom-fit-best.svg is probably the source for resources/images/mapmode/zoom.png - there is no empty magnifying glass in the gnome icons. Otherwise https://commons.wikimedia.org/wiki/File:System-search.svg can also be used. In that case, zoom-best-fit.png should be https://commons.wikimedia.org/wiki/File:View-zoom-fit.svg. ✔️

https://commons.wikimedia.org/wiki/File:Gnome-dialog-warning.svg can replace both resources/images/warning-small.png and resources/images/data/warning.png ✔️

https://commons.wikimedia.org/wiki/File:Edit-find.svg can replace resources/images/dialogs/search.png ✔️ other one used

Improvements

https://commons.wikimedia.org/wiki/File:Input-keyboard.svg looks a lot like resources/images/preferences/shortcuts.png but https://commons.wikimedia.org/wiki/File:Preferences-desktop-keyboard-shortcuts.svg would be a much nicer replacement ✔️

https://commons.wikimedia.org/wiki/File:Gnome-preferences-desktop.svg can maybe replace resources/images/preference.png although it's not great, especially on low zoom. Maybe https://commons.wikimedia.org/wiki/File:Preferences-system.svg would be a better fit. ✔️ other icon used

resources/images/preferences/reset.png is https://commons.wikimedia.org/wiki/File:Gnome-go-jump.svg flipped, but https://commons.wikimedia.org/wiki/File:Edit-undo.svg could be a better one ✔️

resources/images/data/user.png is https://commons.wikimedia.org/wiki/File:Gnome-system-users.svg but https://commons.wikimedia.org/wiki/File:System-users-3.svg is nicer ✔️

https://commons.wikimedia.org/wiki/File:Gnome-applications-utilities.svg (swiss army knife) or https://commons.wikimedia.org/wiki/File:Applications-development.svg (helmet) could replace resources/images/expert.png (Einstein) ✔️ other icon used

I like https://commons.wikimedia.org/wiki/File:Red_bug.svg to replace resources/images/bug.png license not compatible

Tango look uniformisation

https://commons.wikimedia.org/wiki/File:Gnome-view-refresh.svg is resources/images/dialogs/refresh.png but https://commons.wikimedia.org/wiki/File:View-refresh.svg could be used to standardise on the Tango look ✔️

resources/images/preferences/advanced.png is https://commons.wikimedia.org/wiki/File:Gnome-document-properties.svg but https://commons.wikimedia.org/wiki/File:Document-properties.svg could be used to standardise on the Tango look ✔️

resources/images/preferences/display.png is https://commons.wikimedia.org/wiki/File:Gnome-preferences-desktop-wallpaper.svg but https://commons.wikimedia.org/wiki/File:Preferences-desktop-wallpaper.svg could be used to standardise on the Tango look ✔️

KDE Breeze icons

https://commons.wikimedia.org/wiki/Breeze_icons has some beautiful ones, and they come in different sizes, which means we can make them look good even in smaller sizes. If you all like these, I'll create the other icons.

https://github.com/KDE/breeze-icons/blob/master/icons/actions/22/selection-move-to-layer-below.svg can replace resources/images/dialogs/mergedown.png ✔️ other icon used

https://github.com/KDE/breeze-icons/blob/master/icons/actions/16/layer-duplicate.svg can replace resources/images/dialogs/duplicatelayer.png ✔️ other icon used

https://github.com/KDE/breeze-icons/blob/master/icons/actions/16/layer-bottom.svg could be adapted with a double-headed arrow to replace resources/images/dialogs/reorderlayers.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-kstars_satellites.svg could replace resources/images/layer/gpx_small.png and be the base for all gpx-related icons: resources/images/exportgpx.png , resources/images/dialogs/geoimage/gpx2img.png and resources/images/converttogpx.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-redeyes.svg, https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-hint.svg and https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-visibility.svg could be adapted to replace all the eye icons: resources/images/misc/buttonshow.png , resources/images/dialogs/layerlist/eye-off.png , resources/images/dialogs/layerlist/eye-pressed.png , resources/images/misc/buttonhide.png , resources/images/dialogs/layerlist/eye-translucent.png , resources/images/dialogs/showhide.png and resources/images/dialogs/layerlist/eye.png . We could also use their layer icons - https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-layer-visible-on.svg and https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-layer-visible-off.svg ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-autocorrection.svg could replace resources/images/dialogs/fix.png - and be an UI improvement over the socket wrench ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Breezeicons-emblems-16-vcs-normal.svg can replace resources/images/dialogs/layerlist/active.png right away. I'm not sure when resources/images/dialogs/layerlist/active-pressed.png is ever shown, but I could easily create that. ✔️ other icon used

For filters, it has https://github.com/KDE/breeze-icons/blob/master/icons-dark/preferences/32/preferences-desktop-filter.svg https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-kt-add-filters.svg https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-kt-remove-filters.svg. ✔️ other icon used

https://github.com/KDE/breeze-icons/blob/master/icons/actions/16/document-edit.svg can replace resources/images/dialogs/mappaint/pencil.png ✔️ other icon used

https://commons.wikimedia.org/wiki/File:Breezeicons-actions-22-edit-select-lasso.svg could replace resources/images/cursor/modifier/rope.png ✔️ other icon used

https://github.com/KDE/breeze-icons/blob/master/icons/actions/16/layer-raise.svg and https://github.com/KDE/breeze-icons/blob/master/icons/actions/16/layer-lower.svg could replace the up/down arrows in the Layers panel. ✔️ other icon used

resources/images/clock.png is only even used for Help > Show Status Report. I suggest replacing it with https://github.com/KDE/breeze-icons/blob/master/icons/actions/22/debug-run.svg ✔️ other icon used (--> clock is used also while icons in the mapview load (usually you don't see this), in the layerlist during an upload of osm data and in the correlate images with gpx dialog)

Last edited 3 years ago by Klumbumbus (previous) (diff)

by Stereo, 4 years ago

Attachment: Extrude.svg added

Based off Tango's Applications-accessories, replacement for resources/images/mapmode/extrude/extrude.png

by Stereo, 4 years ago

Attachment: Upload.svg added

Based of Gnome-document-save, replacement for resources/images/upload.png

by Stereo, 4 years ago

Attachment: Upload-selection.svg added

Based of Gnome-document-save (see Upload.svg) and JOSM's way-select.svg, improved replacement for resources/images/uploadselection.png

by Stereo, 4 years ago

Attachment: overpass-api-small (1).svg added

Based off Overpass API logo but with thicker lines, improved replacement for resources/images/download-overpass.png

comment:114 by Stereo, 4 years ago

The existing ./resources/images/mapmode/addnote.svg can replace ./resources/images/dialogs/notes/note_new.png

Last edited 4 years ago by Stereo (previous) (diff)

comment:115 by Stereo, 4 years ago

The validation checkmark is actually there four times:

resources/images/preferences/validator.png ✔️
resources/images/layer/validator_small.png ✔️
resources/images/dialogs/validator.png ✔️
resources/images/data/imagery/qa.png ✔️

Last edited 4 years ago by Klumbumbus (previous) (diff)

by Stereo, 4 years ago

Attachment: qa.svg added

The blue validation checkmark is easily one of the ugliest icons in JOSM, but also one of the most recognisable ones. I've vectorised an improved, flatter one.

by Stereo, 4 years ago

Attachment: activate-down.svg added

Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/preferences/activate-down.png

by Stereo, 4 years ago

Attachment: activate-right.svg added

Same as activate_down but to replace ./resources/images/preferences/activate-right.png

comment:116 by Stereo, 4 years ago

https://github.com/openstreetmap/openstreetmap-website/blob/master/app/assets/images/NoteMarker.svg could replace: ✔️

./resources/images/dialogs/notes/note_closed.png
./resources/images/dialogs/notes/note_open.png
./resources/images/dialogs/notes/note_comment.png
./resources/images/dialogs/notes/note_new.png
./resources/images/mapmode/addnote.svg

and be adapted for

./resources/images/note_search.png

Last edited 4 years ago by Klumbumbus (previous) (diff)

by Stereo, 4 years ago

Attachment: useallleft.svg added

Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/dialogs/conflict/useallleft.png

by Stereo, 4 years ago

Attachment: useallright.svg added

Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/dialogs/conflict/useallright.png

comment:117 by Stereo, 4 years ago

Actually, I see that we already have arrows like that in the SVG sprite at the top! Well, whichever works best.

by skyper, 4 years ago

Attachment: Tower_dome.svg added

source:trunk/resources/images/presets/landmark/tower.png could be replaced with [[JOSMImage(presets/landmark/tower)]] could be replaced with [[Image(Tower_dome.svg)]] osmwiki:File:Tower_dome.svg as the first does not look nice in preset menu osmwiki:File:Tower_dome.svg as the first does not look nice in preset menu

comment:118 by Klumbumbus, 4 years ago

Thanks a lot for this long list of replacements, Stereo! I'll have a look after the upcoming next JOSM stable release.

comment:119 by Klumbumbus, 4 years ago

In 16250/josm:

comment:120 by Klumbumbus, 4 years ago

I had these validator icons sitting here already for a while. I compared with your suggestions (https://commons.wikimedia.org/wiki/File:Gnome-dialog-warning.svg and https://commons.wikimedia.org/wiki/File:Dialog-error.svg) but these don't scale down well.

Last edited 4 years ago by Klumbumbus (previous) (diff)

comment:122 by Klumbumbus, 4 years ago

In 16251/josm:

see #15240 - use nicer user icon (from https://commons.wikimedia.org/wiki/File:System-users-3.svg, removed strange script from file, CC0 and PD licensed)

comment:123 by Klumbumbus, 4 years ago

@Dirk: Do we need some special additions in the contribution file for icons with licenses like https://commons.wikimedia.org/wiki/File:Gnome-zoom-fit-best.svg
And whats the license of the KDE Breeze icons?

comment:124 by stoecker, 4 years ago

I fear icons which require individual attribution can't be used. If we use larger sets of icons where one attribution fits, our contributions file can be used.

comment:125 by Klumbumbus, 4 years ago

I reworked the icon section in the contribution file. Please have a look if it is ok:

  • CONTRIBUTION

     
    105105
    106106------------------------------------ ICONS ------------------------------------
    107107
    108 Most icons have been nicked from GNOME and the GIMP, both under GPL.
    109 Some are originally LGPL but redistributed here under GPL.
     108Lots of icons are from GNOME Project https://www.gnome.org/ under GPL or LGPL, redistributed here under GPL.
    110109
     110Some icons are from GIMP https://www.gimp.org/ under GPL or LGPL, redistributed here under GPL.
     111
     112Lots of icons are from https://openclipart.org/, https://publicdomainvectors.org/, The Tango Desktop Project, other sources or self created, all PD and CC0 licensed.
     113
    111114Simple OpenStreetMap logo has been created by ScubbX (CC-SA 2.0) based on official
    112115logo used by the OpenStreetMap Foundation:
    113116https://wiki.openstreetmap.org/wiki/File:Logo_simple.svg
     
    121124- original filename: keyboard.png
    122125- original size: 128x128
    123126- modifications: icon was cropped, then resized
     127
     128See also the commit message of each icon for its source at https://josm.openstreetmap.de/browser/josm/trunk/resources/images.
     129 No newline at end of file
Last edited 4 years ago by Klumbumbus (previous) (diff)

comment:126 by stoecker, 4 years ago

The last link shouldn't have a point at the end. Either remove it or add one more word behind :-). Also add the newline at the end. Otherwise it looks fine to me.

comment:127 by Klumbumbus, 4 years ago

In 16351/josm:

see #15240 - Rework icon attribution section

in reply to:  113 comment:128 by Klumbumbus, 4 years ago

Replying to Stereo:

Original vector files

...

These look blurry when scaled down to 16 or 24 px. Anyone knows a program/tool that pixel aligns svgs somehow? Doing this manually is lots of work.
I loaded the tango theme (where we use some pngs still) from https://web.archive.org/web/20150911230620/http://tango.freedesktop.org/releases/tango-icon-theme-0.8.90.tar.gz and beside the svgs it includes png exports at 16, 22 and 32 px, which are nicely pixel aligned but I don't know if this was done manually too or with one of the included scripts.

Also a general question: For the gui icons we stay at the base size of 24px, do we? In the past (some years ago) the size in the menus was 24px too similar to the toolbar. Now that the menus display the icons at 16 px lots of them are blurry. (See e.g. the tools menu.)

comment:129 by Klumbumbus, 4 years ago

In 16719/josm:

see #15240 - Replace cancel icon by svg, (icon from tango project https://commons.wikimedia.org/wiki/File:Process-stop.svg, modified, PD and CC0 licensed)

comment:130 by Klumbumbus, 4 years ago

In 16720/josm:

see #15240 - Replace validator icon by svg, (icon by Stereo, PD and CC0 licensed)

comment:131 by Klumbumbus, 4 years ago

In 16721/josm:

see #15240 - Replace activate-down and activate-right icon by svg (icon by Stereo, PD and CC0 licensed)

comment:132 by Klumbumbus, 4 years ago

Thanks for the icons Stereo.
Yeah, we reached the turning point. 173 png vs. 173 svg gui icons right now, see graph in ticket desciption above \o/

comment:133 by Stereo, 4 years ago


comment:134 by skyper, 4 years ago

Would it be a good idea to add the size 24 as default option to [[JOSMImage()]] or do we need to adjust all wiki pages where the icons are present?

comment:135 by Klumbumbus, 4 years ago

In 16722/josm:

see #15240 - Resize one of the validator icons to avoid a lot wiki changes

comment:136 by Klumbumbus, 4 years ago

In 16724/josm:

see #15240 - Replace some icons by svg

see #10759 - Remove old unused icons

comment:137 by Klumbumbus, 4 years ago

One regression, see #19446, already fixed. I hope there are no more plugins affected.

comment:138 by Klumbumbus, 4 years ago

At least the plugins undelete and buildings_tools are affected too :(
Too bad Jenkins doesn't report it.
Can someone please give me a hint how to find all affected plugins and how to properly fix it, not like [o35496]?

in reply to:  138 comment:139 by Klumbumbus, 4 years ago

Replying to Klumbumbus:

how to properly fix it, not like [o35496]?

I just figured out that simply deleting the extension seems to work fine too. Is that a good solution?

in reply to:  138 ; comment:140 by stoecker, 4 years ago

Replying to Klumbumbus:

At least the plugins undelete and buildings_tools are affected too :(
Too bad Jenkins doesn't report it.
Can someone please give me a hint how to find all affected plugins and how to properly fix it, not like [o35496]?

grep -e "\.\(png\|svg\)\"" -r .|grep "\.java"
or a bit reduced:
grep -e "\.\(png\|svg\)\"" -r .|grep "\.java"|grep "cancel\.png"

I just figured out that simply deleting the extension seems to work fine too. Is that a good solution?

That's the right solution. Extension should only be specified in rare cases when for some reason the auto-choice is unwanted.

So in most cases (in Java code) the extension should simply be dropped everywhere.

comment:141 by Klumbumbus, 4 years ago

So by simply removing the file extension I don't need to change plugin.main.version right?

in reply to:  140 comment:142 by Klumbumbus, 4 years ago

Replying to stoecker:

grep -e "\.\(png\|svg\)\"" -r .|grep "\.java"
or a bit reduced:
grep -e "\.\(png\|svg\)\"" -r .|grep "\.java"|grep "cancel\.png"

Thx, that helped, I found:

areaselector\src\org\openstreetmap\josm\plugins\areaselector\AddressDialog.java:    protected static final String[] BUTTON_ICONS = new String[] {"ok.png", "cancel.png"};
austriaaddresshelper\src\org\openstreetmap\josm\plugins\austriaaddresshelper\AddressTypeDialog.java:    protected static final String[] BUTTON_ICONS = new String[] {"ok.png", "cancel.png"};
buildings_tools\src\org\openstreetmap\josm\plugins\buildings_tools\MyDialog.java:    private static final String[] BUTTON_ICONS = new String[] {"ok.png", "cancel.png"};
DirectUpload\src\org\openstreetmap\josm\plugins\DirectUpload\UploadDataGui.java:        setButtonIcons(new String[] { "uploadtrace.png", "cancel.png" });
Dxf-Import\src\org\openstreetmap\josm\plugins\dxfimport\ImportDialog.java:        setButtonIcons(new String[] {"ok.png", "cancel.png"});
ext_tools\src\ext_tools\preferences\EditToolDialog.java:        setButtonIcons("ok.png", "cancel.png");
FastDraw\src\org\openstreetmap\josm\plugins\fastdraw\FastDrawConfigDialog.java:        setButtonIcons(new String[] {"ok.png", "cancel.png"});
importvec\src\org\openstreetmap\josm\plugins\importvec\ImportDialog.java:        setButtonIcons(new String[] { "ok.png", "cancel.png" });
photo_geotagging\src\org\openstreetmap\josm\plugins\photo_geotagging\GeotaggingAction.java:            .setButtonIcons(new String[] {"ok.png", "cancel.png"})
photo_geotagging\src\org\openstreetmap\josm\plugins\photo_geotagging\GeotaggingAction.java:                        .setButtonIcons(new String[] {"cancel.png", "ok.png", "dialogs/delete.png"})
roadsigns\src\org\openstreetmap\josm\plugins\roadsigns\RoadSignInputDialog.java:        setButtonIcons("ok.png", "cancel.png");
sds\src\org\openstreetmap\hot\sds\SdsDiskAccessAction.java:                dialog.setButtonIcons(new String[] {"save_as.png", "cancel.png"});
sds\src\org\openstreetmap\hot\sds\SdsDiskAccessAction.java:            dialog.setButtonIcons(new String[] {"save_as.png", "cancel.png"});
terracer\src\org\openstreetmap\josm\plugins\terracer\HouseNumberInputDialog.java:        setButtonIcons(new String[] {"ok.png", "cancel.png" });
tracer2\src\org\openstreetmap\josm\plugins\tracer2\preferences\ServerParamDialog.java:        setButtonIcons(new String[] {"ok.png", "cancel.png"});

(found with findstr /s /i cancel\.png *.java)

in reply to:  141 comment:143 by stoecker, 4 years ago

Replying to Klumbumbus:

So by simply removing the file extension I don't need to change plugin.main.version right?

Yes. In the core that was done years ago for all icons.

comment:144 by stoecker, 4 years ago

I removed all extensions in plugins for setButtonIcons() call. Now recompiling and publishing is needed.

in reply to:  144 ; comment:145 by Klumbumbus, 4 years ago

Replying to stoecker:

I removed all extensions in plugins for setButtonIcons() call.

Thx.

Now recompiling and publishing is needed.

Are you on it yet or should I do it?

in reply to:  145 comment:146 by stoecker, 4 years ago

Replying to Klumbumbus:

Replying to stoecker:

I removed all extensions in plugins for setButtonIcons() call.

Thx.

Now recompiling and publishing is needed.

Are you on it yet or should I do it?

I currently have no Java8 system ready (and compiling with 11 may cause trouble). If you do it that would be fine, so I must not search a place for compiling. Simply compile all plugins (e.g. "ant build" in main dir) and then in dist dir do ./getversions. That drops all files without version change. This way also all the pending i18n is updated :-) Afterwards check in all changed files jars.

Last edited 4 years ago by stoecker (previous) (diff)

comment:147 by Klumbumbus, 4 years ago

fixed trac plugins in [o35502] (with ant clean dist in every plugin directory)
still todo:

I don't know how the github releases work.

comment:148 by josmTEACH, 4 years ago

hey there wizards! i randomly walked into a large .svg on a wiki page (/styles)https://josm.openstreetmap.de/wiki/Styles and somehow teleported here, so wanted to let you know it might affect other wiki pages too?

big props to all the efforts done through the years fellas

comment:149 by Klumbumbus, 4 years ago

In 16728/josm:

see #15240 - fix icons size

comment:150 by Klumbumbus, 4 years ago

Thx for reporting josmTEACH.

comment:151 by skyper, 4 years ago

See #18562 for a problem with source:trunk/resources/images/dialogs/delete.svg delete.svg

in reply to:  151 comment:152 by stoecker, 4 years ago

Replying to skyper:

See #18562 for a problem with source:trunk/resources/images/dialogs/delete.svg delete.svg

Should be fixed in the plugin, i.e. in #18562.

in reply to:  147 comment:153 by stoecker, 4 years ago

Replying to Klumbumbus:

I don't know how the github releases work.

I could find out, but actually I don't want to. I don't want to care for multiple build systems.

I'd say we release core tomorrow.

Either the plugins get fixed by the maintainers of the plugins or disabled. I'd only handle them after a reimport into the SVN.

comment:154 by Klumbumbus, 4 years ago

In 16797/josm:

see #15240 - Change some png icons to svg:

comment:155 by Klumbumbus, 4 years ago

Anyone knows where source:trunk/resources/images/java.svg is used?

comment:156 by GerdP, 4 years ago

MainApllication.askUpdateJava() uses it for a button:

            ed.setButtonIcons("ok", "java", "cancel").setCancelButton(3);

comment:157 by Klumbumbus, 4 years ago

Thx.

comment:158 by Klumbumbus, 4 years ago

In 16799/josm:

see #15240 - Change some png icons to svg:

comment:159 by Klumbumbus, 4 years ago

I removed dialogs/settings because the svg didn't scale down well, it was used only once twice in core and the "preference" icon is the better choice anyway.

One plugin adapted in [o35513:35514] and one pull request created https://github.com/JOSM/conflation/pull/14. (I hope there are no more external plugins.)

Last edited 4 years ago by Klumbumbus (previous) (diff)

comment:160 by Stereo, 4 years ago

I hadn't noticed that you were using my long comment as a to-do list, slowly but surely striking out every line. So cool :D

comment:162 by Klumbumbus, 4 years ago

Yeah, I already noticed. I'll fix it with the next batch.

comment:163 by Klumbumbus, 4 years ago

In 16800/josm:

see #15240 - Change some png icons to svg:

  • dialogs/duplicatelayer, dialogs/layerlist, dialogs/layerlist/active, dialogs/layerlist/active-pressed, dialogs/mergedown, dialogs/reorderlayers, all derived from internal dialogs/activate icon, PD and CC0 licensed
  • help/internet https://commons.wikimedia.org/wiki/File:Gnome-emblem-web.svg, modified, from GNOME Project, LGPL licensed
  • purge https://commons.wikimedia.org/wiki/File:Edit-clear.svg, resized, from The Tango Desktop Project, PD and CC0 licensed
  • dialogs/geoimage/deletefromdisk, derived from internal dialogs/delete icon, PD and CC0 licensed
  • remove data/key, use dialogs/propertiesdialog instead (fits better, used in command stack panel only)
  • small changes/fixes to existing icons

comment:164 by Klumbumbus, 4 years ago

The purge icon was always hard to understand what that should mean. The svg version was worse even after trying to improve it. So I switched to the well known broom.

comment:165 by Klumbumbus, 4 years ago

In 16806/josm:

see #15240 - Change some png icons to svg:

fix a missing file extension in nodist folder

add golf=path to ignorelist

comment:166 by Klumbumbus, 4 years ago

Some icons did completely change, most recognizable ones are plugin, save, save_as and restart.

comment:167 by Stereo, 4 years ago

It's cool to see the progress.

Some useful sources of vectors made for various sizes:

https://ftp.acc.umu.se/pub/gnome/sources/gnome-icon-theme/2.20 which has our download icon
https://ftp.gnome.org/pub/gnome/sources/gnome-icon-theme/2.91
https://ftp.gnome.org/pub/gnome/sources/gnome-icon-theme/3.12 which has multiple sizes in vector. We could use drive-harddisk.svg to re-create our download icon.
https://ftp.gnome.org/pub/gnome/sources/adwaita-icon-theme/3.37/ which also has cursors and some symbolic icons that could be used to lazily recreate note_comment, note_closed, note_new, note_open, arrowdown, add, pastetags and delete and rotate

And then http://tango.freedesktop.org/releases/tango-icon-theme-0.8.90.tar.gz has the last release of the Tango icons, but they don't all scale well.

Last edited 4 years ago by Stereo (previous) (diff)

comment:168 by stoecker, 4 years ago

A side note: I find the WMS/TMS icon and the Add icons for these with the plus really ugly. Something nicer would be fine...

by Klumbumbus, 4 years ago

Attachment: updownloadicons.png added

comment:169 by Klumbumbus, 4 years ago

I plan to use the green up and down arrow without the hard drive for up- and download. (This is also how the download icon looks usually today, e.g. in browsers). This then allows also to easier retrieve derive the other variants, which are:

Last edited 4 years ago by Klumbumbus (previous) (diff)

comment:170 by Stereo, 4 years ago

@stoecker I agree! And the sharpness/transparency/colorfulness/gamma/adjustimg icons too, which seem based on the same custom icon.

@Klumbumbus Great idea. Those icons will become a lot clearer without the hard drive; "upload selection" can show a selection, for example.

in reply to:  168 ; comment:171 by Klumbumbus, 4 years ago

Replying to stoecker:

A side note: I find the WMS/TMS icon and the Add icons for these with the plus really ugly. Something nicer would be fine...

I have no idea so far how TMS, WMS and WMTS could be expressed as image (if not as text in the image). One solution could be to use the plain add icon for all three and use TMS, WMS and WMTS as button text!?

comment:172 by Klumbumbus, 4 years ago

ToggleDialog.java automatically adds "dialogs/" to the iconName. Is it possible to overwrite this to use icons from other folders, e.g. data/user in UserListDialog.java?

in reply to:  171 comment:173 by stoecker, 4 years ago

Replying to Klumbumbus:

Replying to stoecker:

A side note: I find the WMS/TMS icon and the Add icons for these with the plus really ugly. Something nicer would be fine...

I have no idea so far how TMS, WMS and WMTS could be expressed as image (if not as text in the image). One solution could be to use the plain add icon for all three and use TMS, WMS and WMTS as button text!?

Don't ask me. I've no idea or otherwise I'd have fixed this long ago.

in reply to:  172 comment:174 by stoecker, 4 years ago

Replying to Klumbumbus:

ToggleDialog.java automatically adds "dialogs/" to the iconName. Is it possible to overwrite this to use icons from other folders, e.g. data/user in UserListDialog.java?

Rather copy an image than reuse it. Makes replacing them later easier.

comment:175 by Stereo, 4 years ago

Do you like the wms/tms icons in qgis?

comment:176 by Klumbumbus, 4 years ago

attachments to this ticket from Stereo:
Replaces resources/images/dialogs/mappaint/pl2_small.png p2 ✔️
Based off Tango's Applications-accessories, replacement for resources/images/mapmode/extrude/extrude.png Extrude ✔️
Based of Gnome-document-save, replacement for resources/images/upload.png Upload
Based of Gnome-document-save (see Upload.svg) and JOSM's way-select.svg, improved replacement for resources/images/uploadselection.png Upload-selection
Based off Overpass API logo but with thicker lines, improved replacement for resources/images/download-overpass.png overpass-api-small (1) ✔️
The blue validation checkmark is easily one of the ugliest icons in JOSM, but also one of the most recognisable ones. I've vectorised an improved, flatter one. qa ✔️
Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/preferences/activate-down.png activate-down ✔️
Same as activate_down but to replace ./resources/images/preferences/activate-right.png activate-right ✔️
Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/dialogs/conflict/useallleft.png useallleft ✔️
Modified from ./resources/images/dialogs/activate.svg, here's the replacement for ./resources/images/dialogs/conflict/useallright.png useallright ✔️

Last edited 4 years ago by Klumbumbus (previous) (diff)

comment:177 by Stereo, 4 years ago

Yeah, a lot of love went into that "Upload selection" icon :). Want me to redo them all without the disk?

in reply to:  175 comment:178 by stoecker, 4 years ago

Replying to Stereo:

Do you like the wms/tms icons in qgis?

The world? Looks better than ours, but this still leaves the issue how to separate them.

Maybe we should ask the guys which are better with such things, e.g. the ones of LogoContest? A notice on StartupPage linking to this ticket (after the image in the description are refreshed for current state)?

Like: "we're in the final phase to get rid of PNG icons in JOSM and want to replace some ugly icons in the process. Please help us to find better graphics".

While reading and writing code is easy for me, graphics is not. For other people it's reversed, so we should ask these people :-) I can only judge the result.

comment:179 by skyper, 4 years ago

@Stereo
You already wrote that the icon is uggly but in my eyes it got noticeable worse with the switch to vector graphic:
The blue validation checkmark is easily one of the ugliest icons in JOSM, but also one of the most recognisable ones. I've vectorised an improved, flatter one. /export/15658/josm/trunk/images/data/imagery/qa.png The blue validation checkmark is easily one of the ugliest icons in JOSM, but also one of the most recognisable ones. I've vectorised an improved, flatter one. /export/15658/josm/trunk/images/data/imagery/qa.png

I miss the shade and the 3D look. Could this be improved?

@Klumbumbus
Why was the old icon complete deleted and not moved to nodist?

comment:180 by Stereo, 4 years ago

I thought the 3D look and shadow looked early-2000s and old fashioned, so I deliberately flattened it. De gustibus non est disputandum, I guess!

in reply to:  179 comment:181 by Klumbumbus, 4 years ago

Replying to skyper:

Why was the old icon complete deleted and not moved to nodist?

If the new icon is 99% identical I delete the old icon. If they differ I move the old to nodist.

If an icon was deleted it is not lost, but can be found relatively easy via the commit, e.g. r16720.

in reply to:  177 comment:182 by Klumbumbus, 4 years ago

Replying to Stereo:

Yeah, a lot of love went into that "Upload selection" icon :). Want me to redo them all without the disk?

If you want you can do this. Please use https://commons.wikimedia.org/wiki/File:Go-down.svg and https://commons.wikimedia.org/wiki/File:Go-up.svg as base, maybe with a bit thicker outline (not https://commons.wikimedia.org/wiki/File:Gnome-go-down.svg because they have a different fill and we use them in blue for navigation buttons. The different fill seperates the navigation icons a bit from the up/download icons, aside from the color)
We don't need the uploadproperties icon, I'll remove it.

in reply to:  175 ; comment:183 by Klumbumbus, 4 years ago

Replying to Stereo:

Do you like the wms/tms icons in qgis?

Do you mean this one? https://github.com/qgis/QGIS/blob/master/images/themes/default/mActionAddWmsLayer.svg

comment:184 by Klumbumbus, 4 years ago

In 16807/josm:

see #15240 - Change some png icons to svg:

comment:185 by Klumbumbus, 4 years ago

plugin adapted in [o35515:35516]

comment:186 by Klumbumbus, 4 years ago

In 16808/josm:

see #15240 - unify icon size

in reply to:  183 comment:187 by Stereo, 4 years ago

Replying to Klumbumbus:

Replying to Stereo:

Do you like the wms/tms icons in qgis?

Do you mean this one? https://github.com/qgis/QGIS/blob/master/images/themes/default/mActionAddWmsLayer.svg

Yeah and https://github.com/qgis/QGIS/blob/master/images/themes/default/mActionAddXyzLayer.svg for TMS.

For those unfamiliar with QGIS's interface, I've posted a screenshot at https://i.imgur.com/Ox92kiq.png. There would be benefits to having a common "language" for users.

in reply to:  185 comment:188 by skyper, 4 years ago

Replying to Klumbumbus:

plugin adapted in [o35515:35516]

Seems conflation fell under the hood, see #19592.

comment:189 by Klumbumbus, 4 years ago

In 16827/josm:

see #15240 - Change a lot png icons to svg:

comment:190 by Klumbumbus, 4 years ago

In 16828/josm:

  • see #15240 - remove forgotten png in svg
  • fix #19583 - remove unused icons

comment:191 by Klumbumbus, 4 years ago

I changed the cursor image of the mapview because it looked bad as the rendering of the cursor icons is different from all other icons (there is an outer rendering with full black pixels). I can't attach a screenshot because I had no tool which captures the custom cursor. I hope the new image works fine on other environments too (e.g. Java > 8 and hidpi screen). If anyone has problems with the cursor please report.

comment:192 by Klumbumbus, 4 years ago

In 16842/josm:

see #15240 - Change png icon to svg:

comment:193 by Klumbumbus, 4 years ago

In 16851/josm:

see #15240 - Change some png icons to svg:

  • closechangeset, derived from dialogs/changesetdialog and closechangeset in nodist, modified, PD and CC0 licensed
  • cursor/modifier/delete_node, cursor/modifier/delete, cursor/modifier/delete_segment, cursor/modifier/delete_way_normal, cursor/modifier/delete_way_only, cursor/modifier/delete_way_node_only derived from png, PD and CC0 licensed
  • open, openrecent, https://freesvg.org/blue-opened-folder, modified, PD and CC0 licensed
  • movenodeontoway, derived from png and joinnodeway, PD and CC0 licensed
  • mapmode/delete, derived from png and dialogs/delete, PD and CC0 licensed
  • unglueways, derived from png and alignline, PD and CC0 licensed
  • movenode, derived from png and movenodeontoway, PD and CC0 licensed
  • mapmode/improvewayaccuracy, distribute, mapmode/extrude/dualalign, mapmode/node/autonode, simplify, derived from png, PD and CC0 licensed

comment:194 by Klumbumbus, 4 years ago

In 16854/josm:

see #15240 - Change some png icons to svg:

  • statusline/name, derived from dialogs/autoscale/selection, PD and CC0 licensed
  • dialogs/relation/roundabout_left_tiny, dialogs/relation/roundabout_right_tiny, https://commons.wikimedia.org/wiki/File:Zeichen_215_-_Kreisverkehr,_StVO_2000.svg, resized and the right one mirrored, PD and CC0 licensed
  • data/object, layer/osmdata_small, self created, PD and CC0 licensed
  • markers/photo, derived from presets/shop/photo, PD and CC0 licensed
  • cursor/scale, cursor/rotate, self created, PD and CC0 licensed
  • cursor/modifier/move, derived from cursor/hand, PD and CC0 licensed
  • dialogs/selectionlist, self created, PD and CC0 licensed
  • dialogs/geoimage/togglegit, derived from dialogs/geoimage/photo-marker and new cursor/rotate, PD and CC0 licensed
  • parts outside the mapview removed in data/imagery/osmbasedmap
  • update contribution file
  • update ignorelist

comment:195 by Klumbumbus, 4 years ago

In 16868/josm:

see #15240 - Change some png icons to svg:

  • layer/gpx_small, converttogpx, dialogs/geoimage/gpx2img, https://freesvg.org/map-pointer, modified, PD and CC0 licensed
  • converttoosm, is layer/osmdata_small, PD and CC0 licensed
  • exportgpx, derived from new layer/gpx_small and save_as, PD and CC0 licensed
  • download, download_in_view, downloadprimitive, dialogs/downloadincomplete, https://commons.wikimedia.org/wiki/File:Go-down.svg, modified, from The Tango Desktop Project, PD and CC0 licensed
  • upload, https://commons.wikimedia.org/wiki/File:Go-down.svg, and new download, modified, PD and CC0 licensed
  • no_upload, derived from old svg and new upload, PD and CC0 licensed
  • dialogs/autoscale/download, derived from dialogs/autoscale/layer and new download, PD and CC0 licensed
  • download_new_layer, derived from dialogs/autoscale/layer, new and new download, PD and CC0 licensed
  • openlocation, https://freesvg.org/link-symbol-vector-clip-art and new download, modified, PD and CC0 licensed
  • uploadselection, derived from dialogs/selectionlist and new upload, PD and CC0 licensed
  • relation/downloadincomplete, relation/downloadincompleteselected, derived from png, relation/selectmembers and new download, PD and CC0 licensed
  • redye gpx marker icons
  • use download in view icon in notes panel

comment:196 by Klumbumbus, 4 years ago

In 16871/josm:

see #15240 - Change some png icons to svg:

comment:197 by Klumbumbus, 4 years ago

MOTD is still broken, r16871 didn't fix it. Could someone please have a look?

comment:198 by stoecker, 4 years ago

In 16872/josm:

fix image display in MOTD, see #15240

comment:199 by stoecker, 4 years ago

Following icons have CSS-information not supported by SVG salamander causing CSS parser not implemented yet. Can the CSS maybe simply be removed?

  • resources/images/presets/emergency/aed.svg
  • resources/images/presets/misc/angles.svg
  • resources/images/presets/misc/information/audioguide.svg
  • resources/images/presets/misc/information/board.svg
  • resources/images/presets/misc/information/information.svg
  • resources/images/presets/misc/information/map.svg
  • resources/images/presets/misc/information/informationoffice.svg
  • resources/images/preferences/remotecontrol.svg

comment:200 by Klumbumbus, 4 years ago

In 16875/josm:

see #15240 - Change some png icons to svg:

  • dialogs/layerlist/colorfulness, dialogs/layerlist/gamma, dialogs/layerlist/sharpness, dialogs/layerlist/transparency, self created, PD and CC0 licensed
  • remove unsupported CSS style information from some icons (doesn't change the icons appearance)

comment:201 by stoecker, 4 years ago

In 16876/josm:

see #15240 - detect CSS in icons checker

comment:202 by stoecker, 4 years ago

In 16880/josm:

see #15240 - add missing since for new function

by simon04, 4 years ago

Attachment: 2020-08-12-225226.png added

comment:203 by simon04, 4 years ago

JOSM tested r16812 fails to show the download icon on StartupPage:


Relative:URL: ^/trunk
Repository:UUID: 0c6e7542-c601-0410-84e7-c038aed88b3b
Last:Changed Date: 2020-07-30 12:44:04 +0200 (Thu, 30 Jul 2020)
Revision:16812
Build-Date:2020-07-31 01:30:49
URL:https://josm.openstreetmap.de/svn/trunk

Identification: JOSM/1.5 (16812 en) Linux Arch Linux
Memory Usage: 309 MB / 3844 MB (154 MB allocated, but free)
Java version: 11.0.8+10, N/A, OpenJDK 64-Bit Server VM
Look and Feel: javax.swing.plaf.metal.MetalLookAndFeel
Screen: :0.0 3840x2160 (scaling 1.0x1.0)
Maximum Screen Size: 3840x2160
Best cursor sizes: 16x16 -> 16x16, 32x32 -> 32x32
VM arguments: [-Djosm.home=<josm.pref>]

in reply to:  203 comment:204 by skyper, 4 years ago

Replying to simon04:

JOSM tested r16812 fails to show the download icon on StartupPage:

That's what I feared but was uncertain to ask about. So #19668 is only fixed for latest.

in reply to:  203 ; comment:205 by skyper, 4 years ago

How about changing the wiki page and using the old icon until the end of the month ?

comment:206 by Klumbumbus, 4 years ago

Browsers don't display source:trunk/resources/images/dialogs/sort.svg, source:trunk/resources/images/dialogs/sort_below.svg and source:trunk/resources/images/dialogs/reverse.svg correctly (I tested Firefox, Opera and IE), not sure why. In JOSM it works fine. Fixed it. Will be part of next commit.

Last edited 4 years ago by Klumbumbus (previous) (diff)

in reply to:  205 ; comment:207 by simon04, 4 years ago

Replying to skyper:

How about changing the wiki page and using the old icon until the end of the month ?

Then JOSM latest will be affected (since it no longer bundles a download.png). What if we remove the icon from StartupPage completely?

Last edited 4 years ago by simon04 (previous) (diff)

in reply to:  207 comment:208 by Klumbumbus, 4 years ago

Replying to simon04:

Then JOSM latest will be affected (since it no longer bundles a download.png).

It works atm for tested and latest as now it is an external icon, see #19668. Lets continue discussion for this topic there.

Last edited 4 years ago by Klumbumbus (previous) (diff)

in reply to:  207 comment:209 by stoecker, 4 years ago

Replying to simon04:

Then JOSM latest will be affected (since it no longer bundles a download.png).completely?

No. When I do changes they always add a bit sugar if possible. From now on the icon is replaced with the internal one independent from the fact whether it's SVG or PNG :-)

This does not help in this case, as the old JOSM can't do that yet and the PNG is in a different directory.

comment:210 by Klumbumbus, 4 years ago

In 16888/josm:

see #15240 - Change some png icons to svg:

  • improve icons: ok, dialogs/sort, dialogs/sort_below, dialogs/reverse, mergenodes, unglueways, combineway

in reply to:  206 comment:211 by skyper, 4 years ago

Replying to Klumbumbus:

Browsers don't display source:trunk/resources/images/dialogs/sort.svg, source:trunk/resources/images/dialogs/sort_below.svg and source:trunk/resources/images/dialogs/reverse.svg correctly (I tested Firefox, Opera and IE), not sure why. In JOSM it works fine. Fixed it. Will be part of next commit.

Was no problem with Firefox on Linux.

by Stereo, 4 years ago

Attachment: josm-remaining-png.PNG added

Nine remaining PNGs as of 2020-08-14

comment:212 by Klumbumbus, 4 years ago

We basically just need one more icon representing "Imagery" in general and then we are done.

(I'm still in favor of converting the WMS, TMS and WMTS buttons to buttons with text. Then we can use the plain plus icon.)

Regarding the suggestion of the QGIS icon I don't like it so much as it is not good recognizable at 24 and 16 px:
Also we use the globe in a different version already for "internet" i.e. connection settings, when something is opened in the browser and the contact presets.

by Klumbumbus, 4 years ago

Attachment: qgis2416px.PNG added

comment:213 by Klumbumbus, 4 years ago

In 16895/josm:

see #15240 - Change some png icons to svg:

  • imagery_menu, preferences/imagery, mapmode/adjustimg, self created, PD and CC0 licensed
  • remove imagery_small, replaced by imagery_menu
  • presets/misc/embankment-pattern, presets/misc/embankment-pattern-centered, derived from png, PD and CC0 licensed
  • fix offset of embankment patterns, which led to unpredictable rendering

comment:214 by simon04, 4 years ago

In 16897/josm:

see #15240 - Ignore GettingStartedTest.testImageReplacement

comment:215 by Klumbumbus, 4 years ago

In 16899/josm:

see #15240 - Change some png icons to svg:

  • dialogs/add_tms, dialogs/add_wms, dialogs/add_wmts, derived from dialogs/add and png, PD and CC0 licensed

comment:216 by Klumbumbus, 4 years ago

Resolution: fixed
Status: newclosed

comment:217 by Klumbumbus, 4 years ago

Keywords: ex-longterm added
Milestone: Longterm20.08

First longterm ticket fixed 🥳

comment:218 by Klumbumbus, 4 years ago

Current number of JOSM icons:

  • 1160 svg icons (821 presets/mappaint style + 339 GUI)
  • 124 potlatch mappaint style png icons
  • 6 png icons of the logo in different sizes

by Klumbumbus, 4 years ago