Skip to content

Commit c5a3d68

Browse files
weblancasterweblancaster
committed
Improve React components structure, fix checkRateLimit method response, update some modules
1 parent 4f48426 commit c5a3d68

10 files changed

Lines changed: 171 additions & 172 deletions

File tree

‎app/public/js/common/SCapiService.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,14 +31,14 @@ app.service('SCapiService', function (
3131
this.checkRateLimit = function (urlStream) {
3232
return $http.get(urlStream)
3333
.then(function (response) {
34-
console.log('success checkRateLimit')
34+
console.log('Limit not reached.')
3535
if (response.status === 429) {
3636
return false;
3737
}
3838
}, function (response) {
39-
console.log('error checkRateLimit')
39+
console.log('Limit has been reached.')
4040
// something went wrong
41-
return $q.reject(response.errors[0].meta.reset_time);
41+
return $q.reject(response.data.errors[0].meta.reset_time);
4242
});
4343
}
4444

‎app/public/js/common/modalFactory.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,8 @@ app.factory('modalFactory', function (
3939
showClose: false,
4040
template: 'views/common/modals/rate-limit.html',
4141
controller: ['$scope', function ($scope) {
42-
var urlGH = 'https://api.github.com/repos/Soundnode/soundnode-about/contents/rate-limit-reached.html';
43-
var config = {
42+
const urlGH = 'https://api.github.com/repos/Soundnode/soundnode-about/contents/rate-limit-reached.html';
43+
const config = {
4444
headers: {
4545
'Accept': 'application/vnd.github.v3.raw+json'
4646
}

‎app/public/js/components/header/backForwardButtons.jsx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React, { Component } from 'react';
2+
3+
class BackForwardActions extends Component {
4+
render() {
5+
return (
6+
<ul className="windowAction">
7+
<li className="windowAction_item navigationButton goBack" data-ng-click="goBack()">
8+
<i className="fa fa-chevron-left"></i>
9+
</li>
10+
<li className="windowAction_item navigationButton goForward" data-ng-click="goForward()">
11+
<i className="fa fa-chevron-right"></i>
12+
</li>
13+
</ul>
14+
)
15+
}
16+
}
17+
18+
export default BackForwardActions;

‎app/public/js/components/header/headerActions.jsx‎

Lines changed: 3 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,6 @@
1-
const guiConfig = require('../../system/guiConfig').guiConfig;
2-
import React, { Component } from 'react';
3-
4-
class BackForwardActions extends Component {
5-
render() {
6-
return (
7-
<ul className="windowAction">
8-
<li className="windowAction_item navigationButton goBack" data-ng-click="goBack()">
9-
<i className="fa fa-chevron-left"></i>
10-
</li>
11-
<li className="windowAction_item navigationButton goForward" data-ng-click="goForward()">
12-
<i className="fa fa-chevron-right"></i>
13-
</li>
14-
</ul>
15-
)
16-
}
17-
}
18-
19-
class WindowActions extends Component {
20-
closeApp() {
21-
guiConfig.close();
22-
}
23-
24-
minimizeApp() {
25-
guiConfig.minimize();
26-
}
27-
28-
maximizeApp() {
29-
guiConfig.maximize();
30-
}
31-
32-
render() {
33-
34-
if (window.process.platform == 'linux32'
35-
|| window.process.platform == 'linux64'
36-
|| window.process.platform == 'linux'
37-
|| window.process.platform == 'darwin') {
38-
return (
39-
<ul className="windowAction macActionButtons">
40-
<li className="windowAction_item" onClick={this.closeApp} id="closeApp">
41-
<i className="fa fa-times"></i>
42-
</li>
43-
<li className="windowAction_item" onClick={this.minimizeApp} id="minimizeApp">
44-
<i className="fa fa-minus"></i>
45-
</li>
46-
<li className="windowAction_item" onClick={this.maximizeApp} id="expandApp">
47-
<i className="fa fa-plus"></i>
48-
</li>
49-
</ul>
50-
)
51-
} else if (window.process.platform == 'win32') {
52-
return (
53-
<ul className="windowAction windowsActionButtons">
54-
<li className="windowAction_item" onClick={this.minimizeApp} id="minimizeApp">
55-
<i className="fa fa-minus"></i>
56-
</li>
57-
<li className="windowAction_item" onClick={this.maximizeApp} id="expandApp">
58-
<i className="fa fa-square-o"></i>
59-
</li>
60-
<li className="windowAction_item" onClick={this.closeApp} id="closeApp">
61-
<i className="fa fa-times"></i>
62-
</li>
63-
</ul>
64-
)
65-
}
66-
}
67-
}
1+
import React, { Component } from "react";
2+
import BackForwardActions from "./backForwardbuttons";
3+
import WindowActions from "./windowActions";
684

695
class HeaderActions extends Component {
706
render() {

‎app/public/js/components/header/settingsButton.jsx‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import React, { Component } from 'react';
2+
import SettingsDropdown from "./settingsDropdown"
3+
4+
class SettingsButton extends Component {
5+
constructor (props) {
6+
super(props);
7+
8+
this.state = {
9+
isVisible: false,
10+
isMouseIn: false
11+
};
12+
13+
//Close when we click on the UI
14+
window.addEventListener('click', this.closeOut.bind(this), false);
15+
}
16+
17+
stopClose (e) {
18+
e.stopPropagation();
19+
};
20+
21+
closeOut () {
22+
this.setState({
23+
isVisible: false
24+
});
25+
};
26+
27+
toggleSettings () {
28+
this.setState({
29+
isVisible: !this.state.isVisible
30+
});
31+
};
32+
33+
stopEventsAndToggleSettings (e) {
34+
this.stopClose(e);
35+
this.toggleSettings();
36+
};
37+
38+
render () {
39+
return (
40+
<div>
41+
<a onClick={this.stopEventsAndToggleSettings.bind(this)} className="subNav_button"><i className="fa fa-cog"></i></a>
42+
<SettingsDropdown onClick={this.stopClose.bind(this)} isVisible={this.state.isVisible} />
43+
</div>
44+
)
45+
}
46+
}
47+
48+
export default SettingsButton;

‎app/public/js/components/header/settingsDropdown.jsx‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import React, { Component } from "react";
2+
3+
class SettingsDropdown extends Component {
4+
render () {
5+
return (
6+
<ul className="subNav_nav" data-isvisible={this.props.isVisible} onClick={this.props.onClick}>
7+
<li className="subNav_nav_item" data-ng-controller="AboutCtrl">
8+
<a data-ng-click="openModal()">About</a>
9+
</li>
10+
<li className="subNav_nav_item">
11+
<a data-ui-sref="settings">Settings</a>
12+
</li>
13+
<li className="subNav_nav_item">
14+
<a data-ui-sref="news">News</a>
15+
</li>
16+
<li className="subNav_nav_item">
17+
<a>Shortcuts (shift + ?)</a>
18+
</li>
19+
</ul>
20+
)
21+
}
22+
}
23+
24+
export default SettingsDropdown;

‎app/public/js/components/header/settingsNav.jsx‎

Lines changed: 0 additions & 76 deletions
This file was deleted.

‎app/public/js/components/header/windowActions.jsx‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import React, { Component } from "react";
2+
3+
const guiConfig = require('../../system/guiConfig').guiConfig;
4+
5+
class WindowActions extends Component {
6+
closeApp() {
7+
guiConfig.close();
8+
}
9+
10+
minimizeApp() {
11+
guiConfig.minimize();
12+
}
13+
14+
maximizeApp() {
15+
guiConfig.maximize();
16+
}
17+
18+
render() {
19+
20+
if (window.process.platform == 'linux32'
21+
|| window.process.platform == 'linux64'
22+
|| window.process.platform == 'linux'
23+
|| window.process.platform == 'darwin') {
24+
return (
25+
<ul className="windowAction macActionButtons">
26+
<li className="windowAction_item" onClick={this.closeApp} id="closeApp">
27+
<i className="fa fa-times"></i>
28+
</li>
29+
<li className="windowAction_item" onClick={this.minimizeApp} id="minimizeApp">
30+
<i className="fa fa-minus"></i>
31+
</li>
32+
<li className="windowAction_item" onClick={this.maximizeApp} id="expandApp">
33+
<i className="fa fa-plus"></i>
34+
</li>
35+
</ul>
36+
)
37+
} else if (window.process.platform == 'win32') {
38+
return (
39+
<ul className="windowAction windowsActionButtons">
40+
<li className="windowAction_item" onClick={this.minimizeApp} id="minimizeApp">
41+
<i className="fa fa-minus"></i>
42+
</li>
43+
<li className="windowAction_item" onClick={this.maximizeApp} id="expandApp">
44+
<i className="fa fa-square-o"></i>
45+
</li>
46+
<li className="windowAction_item" onClick={this.closeApp} id="closeApp">
47+
<i className="fa fa-times"></i>
48+
</li>
49+
</ul>
50+
)
51+
}
52+
}
53+
}
54+
55+
export default WindowActions;

‎app/public/js/components/main.jsx‎

Lines changed: 7 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,8 @@
1-
import React from 'react';
2-
import ReactDOM from 'react-dom';
1+
import React from "react";
2+
import ReactDOM from "react-dom";
33

4-
import HeaderActions from './header/headerActions.jsx';
5-
import SettingsNav from './header/settingsNav.jsx';
6-
7-
// because of https://github.com/babel/babel/issues/2700
8-
// writing components using ES2015 class won't work
9-
// when trying to set state as the class property
10-
// when not in the constructor
4+
import HeaderActions from "./header/headerActions";
5+
import SettingsButton from "./header/settingsButton";
116

127
// While migration is happening
138
// for every component group
@@ -18,10 +13,10 @@ import SettingsNav from './header/settingsNav.jsx';
1813

1914
ReactDOM.render(
2015
<HeaderActions />,
21-
document.querySelector('.headerActionsApp')
16+
document.querySelector(".headerActionsApp")
2217
);
2318

2419
ReactDOM.render(
25-
<SettingsNav />,
26-
document.querySelector('.settingsApp')
20+
<SettingsButton />,
21+
document.querySelector(".settingsApp")
2722
);

0 commit comments

Comments
 (0)