Skip to content

Instantly share code, notes, and snippets.

@ChadiEM ChadiEM/README-airparif.md
Last active Nov 10, 2019

Embed
What would you like to do?
Airparif Map and Pollution Index in Paris & Ile de France

Preview

Preview

Installation

smashing install 688c9a1a135fcebbbb3332e9cd8e8c82

Usage

<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
    <div data-id="airparif" data-view="Airparif" data-title="Airparif"></div>
</li>

Requirements

  • imagemagick installed on your system (sudo apt install imagemagick)
  • mini_magick gem

Why ImageMagick?

The image provided by Airparif is not transparent friendly so it does not display nicely on Dashing/Smashing; therefore, the text needs to be removed and the outer layer filled in transparent color.

class Dashing.Airparif extends Dashing.Widget
Batman.Filters.toAirparifClassName = (value) ->
if value >= 0 && value < 25 then return 'vlow'
else if value >= 25 && value < 50 then return 'low'
else if value >= 50 && value < 75 then return 'medium'
else if value >= 75 && value < 100 then return 'high'
else if value >= 100 then return 'vhigh'
<h1 data-bind="title" data-showif="title"></h1>
<img data-bind-src="image" />
<div id="info">
<span>Today <span id="todayIndex" data-bind-class="jour | toAirparifClassName" data-bind="jour"></span></span>
<span data-showif="demain">Tomorrow <span id="tomorrowIndex" data-bind-class="demain | toAirparifClassName" data-bind="demain"></span></span>
</div>
<p class="updated-at" data-bind="updatedAtMessage"></p>
require 'mini_magick'
SCHEDULER.every '5m', first_in: 0 do
begin
image = MiniMagick::Image.open('https://www.airparif.asso.fr/services/cartes/indice/date/jour')
rescue StandardError => e
puts("ERROR: Unable to download Airparif map: #{e}")
next
end
image.combine_options do |c|
# Remove Airparif logo
c.fill 'white'
c.draw 'rectangle 320,276 440,345'
# Remove date
c.fill 'white'
c.draw 'rectangle 310,0 440,25'
# make transparent background
c.fill 'none'
c.draw 'color 0,0 floodfill'
# Crop the unnecessary sides
c.crop '403x323+7+20'
end
data = fetch_data('http://www.airparif.asso.fr/appli/api/1.1/indice')
jour = data[1]['indice']
demain = data[2]['indice']
send_event('airparif',
image: 'data:image/png;base64,' + Base64.encode64(image.to_blob),
jour: jour,
demain: demain)
end
def fetch_data(path)
response = Net::HTTP.get_response(URI(path))
JSON.parse(response.body)
end
// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color: #50A4AF;
$vlow-color: #79BC6A;
$low-color: #BBCF4C;
$medium-color: #EEC20B;
$high-color: #F29305;
$vhigh-color: #960018;
// ----------------------------------------------------------------------------
// Widget-airparif styles
// ----------------------------------------------------------------------------
.widget-airparif {
background-color: $background-color;
#info {
margin-top: 10px;
margin-bottom: 30px;
}
#todayIndex, #tomorrowIndex {
font-weight: bold;
padding-left: 3px;
padding-right: 3px;
}
.vlow {
background-color: $vlow-color;
}
.low {
background-color: $low-color;
}
.medium {
background-color: $medium-color;
}
.high {
background-color: $high-color;
}
.vhigh {
background-color: $vhigh-color;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.