2015-08-28 14:20:07 +02:00
|
|
|
var React = require('react');
|
|
|
|
var Util = require('../util');
|
2015-08-30 21:29:19 +02:00
|
|
|
var LazyLoad = require('./mixins/lazy-load');
|
2015-08-28 14:20:07 +02:00
|
|
|
|
|
|
|
module.exports = React.createClass({
|
|
|
|
|
2015-08-30 21:29:19 +02:00
|
|
|
mixins: [LazyLoad],
|
|
|
|
|
2015-08-28 14:20:07 +02:00
|
|
|
getInitialState: function() {
|
2015-08-30 21:29:19 +02:00
|
|
|
return { icon: 'img/hourglass.svg', loading: false };
|
|
|
|
},
|
|
|
|
|
|
|
|
onInViewport: function() {
|
|
|
|
if(!this.state.loading) {
|
|
|
|
this.setState({ loading: true });
|
|
|
|
var desktopEntry = this.props.desktopEntry;
|
|
|
|
this._findIcon(desktopEntry.Icon);
|
|
|
|
}
|
2015-08-28 14:20:07 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
|
|
|
|
|
|
|
var desktopEntry = this.props.desktopEntry;
|
|
|
|
var label = desktopEntry.Name;
|
|
|
|
var category = desktopEntry.Categories;
|
|
|
|
|
|
|
|
return (
|
|
|
|
<li className="desktop-app">
|
2015-08-30 21:29:19 +02:00
|
|
|
<img src={this.state.icon} className="desktop-app-icon" />
|
2015-08-28 14:20:07 +02:00
|
|
|
<span className="desktop-app-label">{label}</span>
|
|
|
|
</li>
|
|
|
|
);
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
_findIcon: function(iconPath) {
|
|
|
|
|
2015-08-30 21:29:19 +02:00
|
|
|
var self = this;
|
2015-08-28 14:20:07 +02:00
|
|
|
|
2015-08-30 21:29:19 +02:00
|
|
|
Util.DesktopApps.findIcon(iconPath || 'application-default-icon')
|
2015-08-28 14:20:07 +02:00
|
|
|
.then(function(iconPath) {
|
2015-08-30 21:29:19 +02:00
|
|
|
self.setState({ icon: iconPath });
|
|
|
|
})
|
2015-08-28 14:20:07 +02:00
|
|
|
;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|