diff --git a/components/404.jsx b/components/404.jsx
new file mode 100644
index 0000000..c005254
--- /dev/null
+++ b/components/404.jsx
@@ -0,0 +1,16 @@
+var React = require('react');
+
+
+var PageNotFound = React.createClass({
+ render: function() {
+ return (
+
+
404: Page not found
+
+
+ )
+ }
+});
+
+module.exports = PageNotFound;
diff --git a/components/contact.jsx b/components/contact.jsx
new file mode 100644
index 0000000..734136c
--- /dev/null
+++ b/components/contact.jsx
@@ -0,0 +1,143 @@
+var React = require('react');
+var Formsy = require('formsy-react');
+var Textarea = require('react-textarea-autosize');
+
+var Nav = require('./nav');
+var Footer = require('./footer');
+
+
+var ContactPage = React.createClass({
+ getInitialState: function() {
+ return {
+ canSubmit: false
+ };
+ },
+
+ enableButton: function () {
+ this.setState({
+ canSubmit: true
+ });
+ },
+
+ disableButton: function () {
+ this.setState({
+ canSubmit: false
+ });
+ },
+
+ resetForm: function() {
+ this.refs.form.reset();
+ this.refs.form.inputs.emailContent.setValue('');
+ },
+
+ handleSubmit: function(data) {
+ var data = JSON.stringify({
+ name: data.fullName,
+ email: data.email,
+ content: data.emailContent
+ });
+
+ $.ajaxSetup({
+ beforeSend: function(xhr, settings) {
+ xhr.setRequestHeader("X-CSRFToken", Django.csrf_token());
+ xhr.setRequestHeader("Content-Type", 'application/json');
+ }
+ });
+
+ $.ajax({
+ type: 'POST',
+ url: '/api/public/contact/',
+ data: data,
+ success: function(data) { this.resetForm() }.bind(this),
+ error: function(error) { }
+ });
+
+ },
+
+ render: function() {
+ return (
+
+
+
+ Get in touch with us
+
+
+
+
+
+
+
+
+ {errorMessage}
+
+ );
+ }
+});
+
+var EmailInput = React.createClass({
+ mixins: [Formsy.Mixin],
+
+ changeValue: function (event) {
+ this.setValue(event.currentTarget.value);
+ },
+
+ render: function () {
+ var className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
+
+ var errorMessage = this.getErrorMessage();
+
+ return (
+
+ {errorMessage}
+
+ );
+ }
+});
+
+var ContentTextarea = React.createClass({
+ mixins: [Formsy.Mixin],
+
+ changeValue: function (event) {
+ this.setValue(event.currentTarget.value);
+ },
+
+ render: function () {
+ var className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
+
+ var errorMessage = this.getErrorMessage();
+
+ return (
+
+
+ {errorMessage}
+
+ );
+ }
+});
+
+module.exports = ContactPage;
diff --git a/components/cub.jsx b/components/cub.jsx
index 00ff9ff..5c31198 100644
--- a/components/cub.jsx
+++ b/components/cub.jsx
@@ -1,650 +1,25 @@
var React = require('react');
-var ReactDOM = require('react-dom');
-
-var Formsy = require('formsy-react');
var History = require('history');
-var Link = require('react-router').Link;
+var ReactDOM = require('react-dom');
var Router = require('react-router').Router;
var Route = require('react-router').Route;
-var Redirect = require('react-router').Redirect;
-var ReactPaginate = require('react-paginate');
-var Textarea = require('react-textarea-autosize');
-
-const history = History.createHistory();
-const per_page = 10;
-
-
-const MAX_PROGRESS = 1000
-
-
-var Repo = React.createClass({
- render: function() {
- var repo_score = this.props.repo.watchers_count * PointsList.watch;
- repo_score += this.props.repo.stargazers_count * PointsList.star;
-
- return (
-
-
-
{repo_score}
-
Points
-
-
-
{this.props.repo.description}
-
- Forked: {this.props.repo.fork}
- Forks: {this.props.repo.forks_count}
- Stars: {this.props.repo.stargazers_count}
- Watchers: {this.props.repo.watchers_count}
-
-
-
Your score
-
-
Your contributions
- { this.state.repos.map(function(repo, i) {
- return (
)
- }, this)}
-
-
... }
- pageNum={this.state.pageNum}
- marginPagesDisplayed={2}
- pageRangeDisplayed={5}
- clickCallback={this.handleClick}
- containerClassName={"pagination"}
- subContainerClassName={"pagination-pages"}
- activeClassName={"active"} />
-
-
Points:
-
- Watcher: {PointsList.watch}p
- Star: {PointsList.star}p
-
-
-
-
Noob
-
Master
-
-
- {this.state.progress + '%'}
-
-
-
Rockstar
-
-
-
-
Most important repo
-
{this.state.repos_top_name}
-
{this.state.repos_top_score + " points"}
-
-
-
Total score
-
{this.state.repos_score}
-
for all repos
-
-
-
Own contributions count
-
{this.state.repos_count}
-
repositories
-
-
- { this.state.login_message ?
-
: ''}
-
-
-
-
-
-
{this.state.name}
-
-
{this.state.email}
-
-
);
- }
- }
-})
-
-
-var Nav = React.createClass({
- render: function() {
- var user = ''
- if (typeof username !== 'undefined')
- user = username
-
- return (
-
-
-
-
-
-
-
-
Logout Login
-
- )
- }
-})
-
-
-var FullNameInput = React.createClass({
- mixins: [Formsy.Mixin],
-
- changeValue: function (event) {
- this.setValue(event.currentTarget.value);
- },
- render: function () {
- var className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
-
- var errorMessage = this.getErrorMessage();
-
- return (
-
- {errorMessage}
-
- );
- }
- })
-
- var EmailInput = React.createClass({
- mixins: [Formsy.Mixin],
-
- changeValue: function (event) {
- this.setValue(event.currentTarget.value);
- },
- render: function () {
- var className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
-
- var errorMessage = this.getErrorMessage();
-
- return (
-
- {errorMessage}
-
- );
- }
- })
-
- var ContentTextarea = React.createClass({
- mixins: [Formsy.Mixin],
-
- changeValue: function (event) {
- this.setValue(event.currentTarget.value);
- },
- render: function () {
- var className = this.showRequired() ? 'required' : this.showError() ? 'error' : null;
-
- var errorMessage = this.getErrorMessage();
-
- return (
-
-
- {errorMessage}
-
- );
- }
- })
-
-var ContactPage = React.createClass({
-
- getInitialState: function() {
- return {
- canSubmit: false
- };
- },
-
- enableButton: function () {
- this.setState({
- canSubmit: true
- });
- },
-
- disableButton: function () {
- this.setState({
- canSubmit: false
- });
- },
-
- resetForm: function() {
- this.refs.form.reset();
- this.refs.form.inputs.emailContent.setValue('');
- },
-
- handleSubmit: function(data) {
- var data = JSON.stringify({
- name: data.fullName,
- email: data.email,
- content: data.emailContent
- });
-
- $.ajaxSetup({
- beforeSend: function(xhr, settings) {
- xhr.setRequestHeader("X-CSRFToken", Django.csrf_token());
- xhr.setRequestHeader("Content-Type", 'application/json');
- }
- });
-
- $.ajax({
- type: 'POST',
- url: '/api/public/contact/',
- data: data,
- success: function(data) { this.resetForm() }.bind(this),
- error: function(error) { }
- });
-
- },
-
- render: function() {
- return (
-
-
-
- Get in touch with us
-
-
-
-
-
-
-
-
-
-
-
Open Source Connect Hub
-
CUB
-
- { this.render_links() }
-
-
-
Profile )
- else
- return (Login )
- }
-})
-
-
-var NotFoundPage = React.createClass({
- render: function() {
- return (
-
-
404: Page not found
-
-
- )
- }
-})
-
-
-var Footer = React.createClass({
- render: function() {
- return (
-
- )
- }
-})
+var IndexPage = require('./index');
+var ProfilePage = require('./profile');
+var RepoPage = require('./repos');
+var ContactPage = require('./contact');
+var PointsList = require('./settings');
+var PageNotFound = require('./404');
ReactDOM.render((
-
+
), document.getElementById("main"))
diff --git a/components/footer.jsx b/components/footer.jsx
new file mode 100644
index 0000000..189ce7b
--- /dev/null
+++ b/components/footer.jsx
@@ -0,0 +1,18 @@
+var React = require('react');
+
+
+var Footer = React.createClass({
+ render: function() {
+ return (
+
+ )
+ }
+});
+
+module.exports = Footer;
diff --git a/components/index.jsx b/components/index.jsx
new file mode 100644
index 0000000..ad45592
--- /dev/null
+++ b/components/index.jsx
@@ -0,0 +1,40 @@
+var React = require('react');
+
+
+var IndexPage = React.createClass({
+ statics: {
+ onEnter(next, transition) {
+ // Redirect to profile if user is logged in
+ if (typeof username !== 'undefined') {
+ return transition(null, '/profile/' + username);
+ }
+ },
+ },
+
+ render: function() {
+ return (
+
+
+
+
Open Source Connect Hub
+
CUB
+
+ { this.render_links() }
+
+
+
Profile )
+ else
+ return (Login )
+ }
+});
+
+module.exports = IndexPage;
diff --git a/components/nav.jsx b/components/nav.jsx
new file mode 100644
index 0000000..2d30e36
--- /dev/null
+++ b/components/nav.jsx
@@ -0,0 +1,36 @@
+var React = require('react');
+var Link = require('react-router').Link;
+
+var Nav = React.createClass({
+ render: function() {
+ var user = ''
+ if (typeof username !== 'undefined')
+ user = username
+
+ return (
+
+
+
+
+
+
+
+
Logout Login
+
+
Noob
+
Master
+
+
+ {this.state.progress + '%'}
+
+
+
Rockstar
+
+
+
+
Most important repo
+
{this.state.repos_top_name}
+
{this.state.repos_top_score + " points"}
+
+
+
Total score
+
{this.state.repos_score}
+
for all repos
+
+
+
Own contributions count
+
{this.state.repos_count}
+
repositories
+
+
+ { this.state.login_message ?
+
: ''}
+
+
+
+
+
+
{this.state.name}
+
+
{this.state.email}
+
+
);
+ }
+ }
+});
+
+module.exports = ProfilePage;
diff --git a/components/repos.jsx b/components/repos.jsx
new file mode 100644
index 0000000..e499365
--- /dev/null
+++ b/components/repos.jsx
@@ -0,0 +1,124 @@
+var React = require('react');
+var ReactPaginate = require('react-paginate');
+
+var Nav = require('./nav');
+var PointsList = require('./settings');
+var Footer = require('./footer');
+
+const per_page = 10;
+
+
+var RepoPage = React.createClass({
+ render: function() {
+ return (
+
+
+ )
+ }
+});
+
+var RepoList = React.createClass({
+ getInitialState: function() {
+ return {
+ repos: [],
+ offset: 0,
+ pageNum: 1,
+ nextOffset: per_page,
+ previousOffset: 0
+ }
+ },
+
+ getRepoList: function() {
+ var offset = this.state.offset;
+ var nextOffset = offset + per_page;
+ var previousOffset = (offset - per_page < 1) ? 0 : offset - per_page;
+ var url = '/api/v1/repository/?offset=' + offset + '&limit=' + per_page;
+
+ $.get(url, function(res) {
+ this.setState({
+ repos: res.objects,
+ nextOffset: nextOffset,
+ previousOffset: previousOffset,
+ pageNum: Math.ceil(res.meta.total_count / per_page )})
+ }.bind(this));
+ },
+
+ componentDidMount: function() {
+ if (this.props.username !== 'undefined' && this.isMounted()) {
+ this.getRepoList();
+
+ } else {
+ // Load demo page
+ this.setState({
+ repos : {},
+ offset : null,
+ pageNum : null
+ });
+ }
+ },
+
+ handleClick: function(event) {
+ var pageSelected = event.selected;
+
+ this.setState({
+ offset: pageSelected * per_page
+ }, () => {
+ this.getRepoList();
+ });
+ },
+
+ render: function() {
+ return (
+
+
Your score
+
+
Your contributions
+ { this.state.repos.map(function(repo, i) {
+ return (
)
+ }, this)}
+
+
... }
+ pageNum={this.state.pageNum}
+ marginPagesDisplayed={2}
+ pageRangeDisplayed={5}
+ clickCallback={this.handleClick}
+ containerClassName={"pagination"}
+ subContainerClassName={"pagination-pages"}
+ activeClassName={"active"} />
+
+
+
{repo_score}
+
Points
+
+
+
{this.props.repo.description}
+
+ Forked: {this.props.repo.fork}
+ Forks: {this.props.repo.forks_count}
+ Stars: {this.props.repo.stargazers_count}
+ Watchers: {this.props.repo.watchers_count}
+
+
+
Points:
+
+ Watcher: {PointsList.watch}p
+ Star: {PointsList.star}p
+
+
-