Weather widget in gnome-shell

Submitted by danigm on Sun, 01/05/2011 - 18:09

These days I'm playing arround gnome shell and gjs code. Yesterday night I started to implement a weather widget to have in gnome-shell status bar, and that isn't as easy as I thought but today I've something.

I tried to use libgweather to get the weather, but I can't get it working with gjs. I spent some hours yesterday triying it, going to sleep late at night, but I can't get it working.

So today I've taken the easy way. Look for a web service that provides weather information and parse that information.

I've taken the yahoo weather rss and I've parsed the output using regular expresions (ok, I know that is odd, but use gmarkup with gjs isn't easy), and voilá, I get a gnome-shell weather widget. It isn't the best, but is something.

To get it working I add the file weather.js to /usr/share/gnome-shell/js/ui/status and then modify the file /usr/share/gnome-shell/js/ui/panel.js adding weather tray icon:

[java]
const STANDARD_TRAY_ICON_ORDER = ['a11y', 'display', 'keyboard', 'volume', 'bluetooth', 'network', 'battery', 'weather'];
const STANDARD_TRAY_ICON_SHELL_IMPLEMENTATION = {
'a11y': imports.ui.status.accessibility.ATIndicator,
'volume': imports.ui.status.volume.Indicator,
'battery': imports.ui.status.power.Indicator,
'weather': imports.ui.status.weather.Indicator,
'keyboard': imports.ui.status.keyboard.XKBIndicator
};
[/java]

The city code to get the weather is hardcoded in weather.js, line 95: "zone = 'SPXX0220';". If you want to use that hack, you should change the file, because there's not ui to change the zone, wheather settings does nothing :P

Attachment	Size
weather.js	4.18 KB

tags:

Comments

Submitted by amuchamu (not verified) on Mon, 02/05/2011 - 16:34

¡Buenas! Aunque la entrada

¡Buenas! Aunque la entrada está en inglés espero que no te importe que te escriba en español.

Estaba mirando cómo hacer una extensión para controlar la frecuencia del procesador y tu código me va a venir muy bien, ya que debo de ser un zoquete y no encuentro documentación por ninguna parte.

Si sigues mejorándolo, podrías hacerlo como extensión independiente y así no tener que tocar ningún archivo de fuera del ~.

Básicamente es hacer una extensión con el código de tu weather.js en medio y 4 cosillas más:

const Panel = imports.ui.panel;

[weather.js]

function main() {
Panel.STANDARD_TRAY_ICON_ORDER[Panel.STANDARD_TRAY_ICON_ORDER.length] = 'weather';
Panel.STANDARD_TRAY_ICON_SHELL_IMPLEMENTATION['weather'] = this.Indicator;
}

Así lo tengo yo ahora mismo y va bastante bien.

Un saludo

Submitted by danigm on Tue, 03/05/2011 - 01:40

No importa que comentes en

No importa que comentes en español :D

Estuve comentando por el canal irc de gnome-shell el widget este, y me estuvieron comentando que estaría bien hacerlo como extensión y meterlo en el repositorio de gnome-shell-extensions, pero me da pereza ponerme a hacerlo.

Así que si tienes el código hecho como extensión y quieres ver si es posible meterlo en el repositorio oficial de extensiones podemos preguntar por el irc y preguntar a ver si hay interés.

Submitted by SnocK (not verified) on Mon, 30/05/2011 - 21:42

queda muy bien xd , no se

queda muy bien xd , no se puede traducir en español los mensajes ?

Submitted by amuchamu (not verified) on Wed, 04/05/2011 - 16:52

A mí más que pereza es que de

A mí más que pereza es que de javascript no tengo mucha idea, y al no encontrar la documentación me cuesta bastante hacer cualquier extensión.

Lo que has hecho lo he metido dentro del código que he puesto y sólo he llegado a poner un tooltip de modo que al poner el ratón encima del icono me muestre la temperatura actual, pero a más por ahora no llego :P

Submitted by Miguelroboso (not verified) on Wed, 04/05/2011 - 20:58

thanks!

Thanks! Even though I suspect you are from Cordoba, I hope you won't be offended if I write in English :.
I added your weather "applet" to my shell, it's gorgeous. I only have to understand why the numbers in parenthesis are still in fahrenheit for me...(or what they actually mean)

Submitted by danigm on Thu, 05/05/2011 - 10:10

The numbers in parenthesis

The numbers in parenthesis aren't the fahrenheit, its are the number of image to show using this url http://l.yimg.com/a/i/us/we/52/12.gif, if you change the last number you have the icon showed by yahoo.

There's a switch in weather.js that set the icon looking that number.

For fahrenheit you can change this url:

uri = 'http://weather.yahooapis.com/forecastrss?p='+zone+'&u=c';

to:

uri = 'http://weather.yahooapis.com/forecastrss?p='+zone+'&u=f';

Submitted by Miguelroboso (not verified) on Thu, 05/05/2011 - 18:27

Oh I see. As for farhenheit I

Oh I see.
As for farhenheit I was already good (I use Celsius, darn imperial system!).
However, I have both the numbers and the image now, I will try to fiddle with the js to fix it (screenshot attached
http://img717.imageshack.us/i/weathergnomeshell.png/ )

Submitted by Eduaro (not verified) on Tue, 10/05/2011 - 18:46

Gracias

Seguí las instrucciones y no tuve problemas para instalarlo en mi laptop con Fedora 15. Sólo me preguntaba si era necesario conservar "Weather settings", si en realidad no tienen una función. Gracias y no dejes de avisar cambios en el script. Saludos

Submitted by jeff (not verified) on Sun, 15/05/2011 - 22:32

I made the additions to

I made the additions to weather.js to make it an extension after an update replaced panel.js.
Make a new directory in "~/.local/share/gnome-shell/extensions/". I used "Weather_Widget@amd64". In that directory create 2 files, the weather.js with the following lines added. The weather.js file must be renamed to extension.js. The other file metadata.json's content is given at the end of my post. Alt-F2 then "r" to restart the shell. This should survive updates.

extension.js
const Gettext = imports.gettext.domain('gnome-shell'); const _ = Gettext.gettext;

const Panel = imports.ui.panel;

function main () {
Panel.STANDARD_TRAY_ICON_ORDER [Panel.STANDARD_TRAY_ICON_ORDER.length] = 'weather';
Panel.STANDARD_TRAY_ICON_SHELL_IMPLEMENTATION ['weather'] = this.Indicator;
}

function Indicator() {
this._init.apply(this, arguments);
}

metadata.json

{"shell-version": ["3.0.1"], "uuid": "Weather_Widget@amd64", "name": "Weather Widget", "description": "Display a weather info icon"}

Submitted by arzanulhaq (not verified) on Mon, 16/05/2011 - 19:51

add \u00B0 before 'C ' to get degree symbol

I use your extension on my gnome-shell.
It's works.
Thx a lot.

BTW, I add \u00B0 before 'C ' to get degree symbol

Submitted by Monigote (not verified) on Sun, 22/05/2011 - 01:58

Ya que usamos javascript: ¿No

Ya que usamos javascript: ¿No sería más facil utilizar JSON para leer los datos del tiempo?
Se puede ver en:
http://weather.yahooapis.com/forecastjson
con los mismos parametros!!!

Submitted by Monigote (not verified) on Sun, 22/05/2011 - 03:53

Codigo:

Mejor usar JSON:

_callback: function(s, sm, ind) {
var msg = {};
eval("msg = " + sm.response_body.data.split("\n"));
var condition = msg["condition"];
var forecasts = msg["forecast"];
var city = msg["location"]["city"];

output = ind._outputTomorrow;
if (condition) {
cloud = condition["code"];
text = _(condition["text"]);
temp = condition["temperature"];

ind._outputTitle.label.set_text(_("Tiempo") + " " + _("en") + " " + city);
ind._outputToday.label.set_text(text + ' ' + temp + '\u00B0C ');
gicon = Shell.util_icon_from_string(ind.get_icon(cloud));
ind._outputToday._icon.gicon = gicon;
ind.setGIcon(gicon);
}

if (forecasts) {
var total = forecasts.length;
for(var i = 0; i < total; i++){
var forecast = forecasts[i];
if (forecast) {
cloud = (forecast["code"])? forecast["code"] : 28; // (default 28 "weather-few-clouds": NO CODES!!!)
text = _(forecast["condition"]);
day = _(forecast["day"]);
temph = forecast["high_temperature"];
templ = forecast["low_temperature"];

output.label.set_text(day + ': ' + text + ' ' + templ + '\u00B0C-' + temph + '\u00B0C ');
gicon = Shell.util_icon_from_string(ind.get_icon(cloud));
output._icon.gicon = gicon;

output = ind._outputNext;
}
}
}
},

y en _on_update cambiar:

uri = 'http://weather.yahooapis.com/forecastjson?p='+zone+'&u=c';

Vamos a ver si alguien se anima a hacer el dialogo de configuración ;)

Submitted by Eder John (not verified) on Fri, 19/08/2011 - 02:34

Hey, I liked your widget.

Hey, I liked your widget.
And i was wondering if I can modify it?
Maybe translate to Portuguese, wich is my mother language. Or to implement the weather settings, or a list with the most popular citys in Brazil, maybe in the world.

Thanks!

Submitted by danigm on Fri, 19/08/2011 - 12:01

Thank you, you can take the

Thank you, you can take the code and make modification if you want. But currently there're other gnome shell weather extension that's more complete, you can find one here:

https://github.com/simon04/gnome-shell-extension-weather

Weather widget in gnome-shell

Comments

¡Buenas! Aunque la entrada

No importa que comentes en

queda muy bien xd , no se

A mí más que pereza es que de

thanks!

The numbers in parenthesis

Oh I see. As for farhenheit I

Gracias

I made the additions to

add \u00B0 before 'C ' to get degree symbol

Ya que usamos javascript: ¿No

Codigo:

Hey, I liked your widget.

Thank you, you can take the

twitter

links

Recent comments

Weather widget in gnome-shell

Comments

Search form

twitter

links

Recent comments