-
Notifications
You must be signed in to change notification settings - Fork 97
/
Plugin.jsx
80 lines (68 loc) · 2.25 KB
/
Plugin.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
/** @jsx React.DOM */
"use strict";
var $ = require("jquery");
var React = require("react");
var store = require("store");
var transitionTo = require("react-nested-router").transitionTo;
var Plugin = React.createClass({
getInitialState: function() {
var pluginId = this.props.plugin.slug;
var pluginStore = pluginId && store.enabled &&
store.get("plugin-" + pluginId);
return {
hasVisited: pluginStore && pluginStore.hasVisited
};
},
componentDidMount: function() {
this.addBootstrapTooltips();
},
componentWillUnmount: function() {
$(this.getDOMNode()).find('[title]').tooltip('destroy');
},
componentDidUpdate: function() {
this.addBootstrapTooltips();
},
addBootstrapTooltips: function() {
$(this.getDOMNode()).find('[title]').tooltip({
animation: false,
container: 'body'
});
},
goToDetailsPage: function() {
transitionTo("plugin", {slug: this.props.plugin.slug});
},
render: function() {
// TODO(david): Animations on initial render
var plugin = this.props.plugin;
if (!plugin || !plugin.name) {
return <li className="plugin"></li>;
}
var hasNavFocus = this.props.hasNavFocus;
return <li
className={"plugin" + (hasNavFocus ? " nav-focus" : "") +
(this.state.hasVisited ? " visited" : "")}
onMouseEnter={this.props.onMouseEnter}>
<a href={"/plugin/" + plugin.slug}>
<h3 className={"plugin-name " + plugin.category}>{plugin.name}</h3>
{plugin.author && <span className="by">by</span>}
{plugin.author &&
<span className="author">{" " + plugin.author}</span>}
{plugin.github_stars > 0 &&
<div className="github-stars"
title={plugin.github_stars + " stars on GitHub"}>
{plugin.github_stars}<i className="icon-star"></i>
</div>
}
{plugin.plugin_manager_users > 0 &&
<div className="plugin-users"
title={plugin.plugin_manager_users +
" Vundle/Pathogen/NeoBundle users on GitHub"}>
{plugin.plugin_manager_users}<i className="icon-user"></i>
</div>
}
<p className="short-desc">{plugin.short_desc}</p>
</a>
</li>;
}
});
module.exports = Plugin;