Create a p5js-editor.desktop file for Linux users and decide on the best way to install it

[JobLeonard]

At the moment the Linux version (and presumably the Mac version too?) doesn't include an icon. I don't know which image is used for the Windows icon, but if we could include it as an SVG and PNG so users can manually set it, that would be great. If it's possible to export the Node.JS app to include it, even better!

At the moment I use the one for hello.p5js[0] myself, adding a white background to fill in the transparancy. I made a quick edit in InkScape and added an exported SVG:

See how nice it looks on my desktop? All I did was create a link manually and set it to this image:

Here are the files, they only add up to 20kb extra.

• http://blindedcyclops.neocities.org/p5js-icons/p5-sq-reverse-filled.png
• http://blindedcyclops.neocities.org/p5js-icons/p5-sq-reverse-filled.svg
• http://blindedcyclops.neocities.org/p5js-icons/p5-sq-white-background.png
• http://blindedcyclops.neocities.org/p5js-icons/p5-sq-white-background.svg

[0] http://hello.p5js.org/assets/p5-sq-reverse.svg

[lmccart]

looks like we need to create a .desktop file: https://github.com/nwjs/nw.js/wiki/Icons#linux

[JobLeonard]

Seems simple enough, I can look into that! What's the image to be used as an icon?

[JobLeonard]

Ok, so I'm assuming we want to keep it portable (that is, no admin rights needed), so here's what I did:

• have a p5js.desktop "template" and a simple bash installation script
• figure out the full path in bash
• use sed to take the template, replace {P5XJSPATH} in it with the path, and copy the resulting p5js.desktop file to the appropriate folder (n most distros this appears to be ~/.local/share/applications)

This also avoids environment variables, so less mess to clean up.

p5js.desktop template: (not sure aboute the WebDevelopment, let me know what you think)

[Desktop Entry]
Version=1.0
Name=p5.js
Comment=Processing core ideas reinterpreted for today's web.
Exec={P5JSPATH}/p5
Path={P5JSPATH}
Icon={P5JSPATH}/icons/p5-sq-reverse-filled.svg
Terminal=false
Type=Application
Categories=Education;Development;Art;WebDevelopment;IDE

installation script:

#! /bin/bash

# get full path of p5js editor
DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"

# Using question mark as sed delimiter, since it is 
# guaranteed to not be used in path names.
sed -e "s?{P5JSPATH}?$DIR?g" p5js.desktop > ~/.local/share/applications/p5js.desktop
# make the desktop file executable
chmod +x ~/.local/share/applications/p5js.desktop

I'm not sure if this fits into the existing build process, or where I should change the files in the github repo to include this. All I can say is that it worked for me: