FontAwesome Update

[MartynKeigher]

Hey all,

Just wondering if there were plans to update the FontAwesome (v3.2.1) from the version that is currently part of the master branch still, to the current version. (v4.3.0).

and... if Dashing can (or is going to) be updated to v4.3.0, will I be able to make use of the animated icons too?? If someone else has already got this going, and has a fork to this.. then could you please share??

Thanks.

[terraboops]

This version change would be a breaking change, as outlined here: https://github.com/FortAwesome/Font-Awesome/wiki/Upgrading-from-3.2.1-to-4

Not that this would be an impossible task, but it certainly makes things a wee bit trickier.

[MartynKeigher]

Yah... I gave it a go (with my limited knowledge and extensive googling) and didn't get it to work! I definitely broke my dash a few times along the way too.

I ended up re-installing dashing from the master branch and settled for the 3.2.1 icons. ;p

I would still like to see the new icons as part of this project though! :) The spinning icons for sure would definitely be a great +1 . Would bring a little more "life" into the dash i think.

Speaking off adding things... I wonder if you could add sound, or blinking tiles?? - Are those things achievable with the current master?

[terraboops]

You can make the tiles blink by applying a status-warning or status-danger CSS class to them when appropriate. The number widget also takes a status parameter when sending events, in addition to the current parameter.

So you can make a number widget blink out of the box with something like:

send_event('my-number-widget',{current: 150, status: 'danger'})

You can look at number.coffee in the onData handler to see how you could replicate this functionality for other widgets. Maybe a Dashing 2.0 change could be to do this on the base widget -- as any widget could benefit from this functionality.

[terraboops]

I'm a bit busy at the moment, but I can take a look at updating this later. Maybe next week.

Whether or not the PR is accepted... I dunno. It would be a breaking change for anyone using Dashing, not just for the gem itself. Seems like a Dashing 2.0 thing.

[MartynKeigher]

Hey Tyler,
Thanks for the prompt reply, and thanks for the suggestion on the blinking tile. I'll give that a whirl in my lab soon for sure!! FYI: My use-case is a "Server Offline" tile. I run a query against a MySQL db, so if the value in the tile (a single number returned from the query) is NOT 0, then blink, just to draw extra attn. to it. - but as you stated, there are several use cases for this.

As for the FontAwesome update... I realize i might be asking a bit much, so if it's too much of a bother, then at least consider it a feature request for Dashing 2.0! :)

Which... by the way.. Whats the ETA on that??

Thanks.

[terraboops]

No idea on ETA, I think @pushmatrix has big ideas for Dashing 2.0 👍

I can certainly fork Dashing and make a PR for the update, I'm not sure if the maintainer will accept it until 2.0. I'm just an enthusiastic user.

I'm happy to do the update when I've got time, I bet it's a 1-2 hour job.

[MartynKeigher]

Sounds like a plan! ;)

Are you still using Dashing on Thin at all?? Fwiw: I shifted over to Puma and got much better results! I had plans I move it to Raptor (new passenger build), but not tried that yet!

I'm an enthuastic user too for sure and I've been making some decent dashboards for my managed services practice (& others), but my coding skills aren't at the same level as my thoughts... Yet! ;p

[terraboops]

I use thin. I start dashing like this, with an Apache proxy-pass on a vhost:

$BUNDLE_CMD exec thin start -p 3030 -d -R "$DASHING_DIR/$RACK_FILE" -P /var/run/dashing/web_console.pid

We have a PR waiting to be merged that swaps out Thin for Puma, this would enable us to run Dashing on JRuby. This would also enable people to bring Java data (like JMX) into the mix really easily, as well as improving overall performance for most users. I'm hoping it gets merged.

I'm not sure if there are other undesirable impacts of switching to Puma, I'm glad to hear that it's working for you. Learning to code is a lifelong process! Everyone is always learning.

[MartynKeigher]

Hmm... I may have to check out that Puma fork to be honest. I do quite a bit of documentation so when i do new things, I get all it noted (i live in evernote!) I can go over and validate it, so every time i install Dashing (as i blow it up on "purpose" sometimes) I manually convert it to run on Puma.

The reason why I went to Puma was because it was running behind a (Citrix) NetScaler and while dashing ran on 'Thin' it took 50+ seconds for the tiles show data, 👎 and with Ruby it was around 3 or 4 seconds. 👍

I also ALWAYS add this great tweak to it to: https://gist.github.com/jwalton/6670630 , although i 'think' it affects my ability to drag the tiles, or maybe that's something else?

My only missing piece to the instructions, is getting Puma to run as a Daemon. Right now (As my ubuntu server is a vm) i have to go to the console and kick off sudo bundle exec puma there and just let it run. :(

+1 on the 'Everyone is always learning' quote!! A day without a smile (and a lesson learned) is a day lost! :)

/me is off to look for the Puma fork! ;p

Oh... one last thing, if you was to do a fork that included the newer version of FontAwesome, would it be configured to run on Thin or Puma?? - Thanks.

[cefigueiredo]

I think that we 've already lost the subject of this thread, so I will give
my 2 cents about puma as daemon. You could see that
https://github.com/puma/puma/tree/master/tools/jungle/init.d#puma-daemon-service

Or you even can write a script to put on rc.d calling bundle exec puma (on
the appropriate path for your project and RVM if you use it)

On Sun, Feb 1, 2015 at 10:15 PM, Martyn Keigher [email protected]
wrote:

Hmmm... I may have to check out that Puma fork to be honest. I do quite a
bit of documentation so when i do new things, I get all it noted (i live in
evernote!) I can go over and validate it, so every time i install Dashing
(as i blow it up on "purpose" sometimes) I manually convert it to run on
Puma.

My only missing piece to the instructions, is getting Puma to run as a
Daemon. Right now (As my ubuntu server is a vm) i have to go to the console
and kick off sudo bundle exec puma there and just let it run. :(

+1 on the 'Everyone is always learning' quote!! A day without a smile (and
a lesson learned) is a day lost! :)

/me is off to look for the Puma fork! ;p

—
Reply to this email directly or view it on GitHub
#511 (comment).

[ghost]

I fuddled about last week trying to update to font-awesome 4.xxx. I only succeeded in breaking 3.xxx ;-)

Watching with interest.....

[MartynKeigher]

Yeah, sorry @cefigueiredo for bringing this one slightly off topic. @tylermauthe and I kinda segway'd a bit! ;p Thanks @howardsternisbatman for bringing right back on track!!

Having the full use of FontAwesome (even including the animated icons)... would be pretty spectacular!!

[jmb]

I managed to get the latest font-awesome installed. All I did was put in the new css for font awesome, add the new font files and then edit the css update the reference to the font files (e.g. src:url('../assets/fontawesome-webfont.eot?v=4.3.0')).
In a couple of widgets you need to change from the icon-whatever classes to the new fa- versions.
I don't think it broke anything...

I can probably put together a pull request if it helps...

[terraboops]

That's excellent, I wasn't sure if the update changed had breaking styling changes. Sounds like it's a pretty quick job. Which also gives me hope for getting a PR merged before 2.0, as User's customised widgets and dashboards would also be easy to change. Thanks for the info!

It's up to you, but I'd support a PR to resolve this issue.

[MartynKeigher]

Nicely done @jmb! @tylermauthe ... would your PR be on PUMA too, by chance? ;p

[terraboops]

As that is an unrelated change, that would be in a different PR. #427 has been started for that -- though the intended goal there is to allow Dashing to run in JRuby out of the box.

[jmb]

Here is the PR: #514 (for just FontAwesome update)
Please let me know if it has issues! 😃

[ghost]

I'll give it a bash today....urm, where is it exactly? :-)

[jmb]

My fork is here: https://github.com/jmb/dashing/tree/fontawesome-4.3.0 (you can click through from the pull request).

[ghost]

Thank you, installed and working perfectly. I really appreciate your effort.

[jmb]

👍

[MartynKeigher]

Hey all, sorry for asking a dumb question here, but what the simplest way to merge this PR into my current project? Usually I just grab the master and then make my changes, but this is a big one that I'd rather not do manually! ;p

I suppose I could DL it and 'WinSCP in' to copy/replace files, but i know there must be an easier way! Apologies if this sounds very "GitHub 101'ish", but i'd love to know how!

Thanks for your patience!

[jmb]

I'm not a GitHub expert in anyway, but if you've cloned from the master, I think you could add my repository as another remote and merge in my changes (after checking out whatever branch you want to merge onto):

git add remote jmb [email protected]:jmb/dashing.git
git merge jmb/fontawesome-4.3.0

In terms of applying the changes to an existing project created with dashing new, then I'm not really sure how you'd do that (but it's really not too difficult to manually install - just take a look at the files I've changed and download the font files from fontawesome.io and replace the existing ones).

[MartynKeigher]

Yeah, I'll prob just copy/replace the files as I have pulled the master, then got it running on PUMA. I was concerned that if pulled the PR, it would overwrite all the PUMA stuff I have configured. I'll go ahead and copy/paste the files the old fashioned way in WinSCP! I just don't wanna break it all over again!

(PS: VMWare snapshots are your friend!) ;p

Thanks for your quick response! :)

[jmb]

Doing a merge from my branch shouldn't affect anything other than the fontawesome stuff though - git is pretty good at asking you about any conflicts (if any) and letting you resolve them.

[MartynKeigher]

ha ha... as SOON AS I copied the LAST file (via WinSCP), you replied! ;p

(About to test it out now!)

[jmb]

Typical! I just tested it though:

$ git checkout master
$ git branch test-merge
$ git checkout test-merge

Here I made a change to application.coffee (just added a line for debugging in). Then merge from my 'remote' branch (my remote is labelled origin):

$ git merge origin/fontawesome-4.3.0
Updating f4b121e..763d950
Fast-forward
 templates/project/assets/fonts/FontAwesome.otf           |  Bin 0 -> 93888 bytes
 templates/project/assets/fonts/fontawesome-webfont.eot   |  Bin 37405 -> 60767 bytes
 templates/project/assets/fonts/fontawesome-webfont.svg   |  240 ++++-
 templates/project/assets/fonts/fontawesome-webfont.ttf   |  Bin 79076 -> 122092 bytes
 templates/project/assets/fonts/fontawesome-webfont.woff  |  Bin 43572 -> 71508 bytes
 templates/project/assets/fonts/fontawesome-webfont.woff2 |  Bin 0 -> 56780 bytes
 templates/project/assets/stylesheets/font-awesome.css    | 1704 ++++++++++++++++++-------------
 templates/project/dashboards/sampletv.erb                |    8 +-
 templates/project/widgets/number/number.coffee           |    2 +-
 9 files changed, 1221 insertions(+), 733 deletions(-)
 create mode 100644 templates/project/assets/fonts/FontAwesome.otf
 create mode 100644 templates/project/assets/fonts/fontawesome-webfont.woff2

So anything unrelated is definitely not broken by git (as expected).

Hope this helps for next time! 😃

[MartynKeigher]

@jmb YOU ARE A LEGEND!! ;)

I know you cant tell from this image: http://i.imgur.com/y1WQPyD.png but the cog is spinning too!

Thank you so much for putting this up!! Can't remember how many times I broke it trying to get this to work! You will notice that the "spinning icon" is outside of the tile... I can work around this by lowering the font size!

Thank you once again! :)

[MartynKeigher]

For what it's worth, I now have a Dashing project running on PUMA and also with the updated font. I'll figure out how to get this up to GitHub today! (But first.. I need coffee!)

PS: I realize that the comments here are growing quite a bit.. To minimize the chatter in here, I am also on IRC (Freenode network. Name there is "MartynKeigher". Maybe chat to you on there???

[MartynKeigher]

Hey,

The default implementation of this will make the icons "rotate around a relevant point on the tile", instead of "spinning on their own axis" (spin). So to tackle this 'issue' i did the following:

Added an additional class in the application.scss:

.icon-background-spin {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.1;
  font-size: 225px;
  text-align: center;
  margin-top: 55px;
}

Then in my layout.erb I called the new icon-background-spin for spinning icons and called icon-background (as usual) for static icons.

I also slowed the spinning down. Edit font-awesome.css on line 81 & 82 to the following:

-webkit-animation: fa-spin 8s infinite linear;
animation: fa-spin 8s infinite linear;

You can also apply the same change to fa-pulse class on line 85 & 86, too.

I would make a pull request if I knew how, so if someone wants to do this, then please... go right ahead.

Regards,

[MartynKeigher]

I'm going to close this now as a PR was made. Hope it gets pulled into the MASTER branch soon. :)
PR is here: #514

[jmb]

Just a note to say I've created anew PR #687 for FontAwesome 4.5.0