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

JobLeonard commented 8 years ago

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.

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

lmccart commented 7 years ago

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

JobLeonard commented 7 years ago

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

JobLeonard commented 7 years ago

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:

processing / p5.js-editor

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