secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Cleaning line endings with proper JS;

Browse Source
This commit is contained in:
James Barnsley
2018-02-01 08:06:40 +13:00
parent 35e3a62b36
commit 8159991980
17 changed files with 689 additions and 519 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/js/App.js
View File

@ -73,6 +73,12 @@ class App extends React.Component{
});
hashHistory.push(global.baseURL);
}
// show initial setup if required
/*
if (this.props.show_initial_setup){
this.props.uiActions.openModal('initial_setup');
}*/
}
shouldTriggerShortcut(e){
@ -293,6 +299,7 @@ class App extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
touch_dragging: state.ui.touch_dragging,
show_initial_setup: state.ui.show_initial_setup,
slim_mode: state.ui.slim_mode,
broadcasts: (state.ui.broadcasts ? state.ui.broadcasts : []),
volume: (state.mopidy.volume ? state.mopidy.volume : false),

3
src/js/bootstrap.js vendored
View File

@ -44,6 +44,7 @@ var initialState = {
tracks: {}
},
ui: {
show_initial_setup: true,
slim_mode: false,
selected_tracks: [],
notifications: [],
@ -61,7 +62,7 @@ var initialState = {
},
pusher: {
connected: false,
username: 'Anonymous',
username: false,
connections: {},
version: {
current: '0.0.0'

10
src/js/components/Modal/AddToPlaylistModal.js
View File

@ -1,10 +1,10 @@
import React, { PropTypes } from 'react'
import FontAwesome from 'react-fontawesome'
import React, { PropTypes } from 'react';
import FontAwesome from 'react-fontawesome';
import Icon from '../Icon'
import Thumbnail from '../Thumbnail'
import * as helpers from '../../helpers'
import Icon from '../Icon';
import Thumbnail from '../Thumbnail';
import * as helpers from '../../helpers';
export default class AddToPlaylistModal extends React.Component{

10
src/js/components/Modal/AddToQueueModal.js
View File

@ -1,9 +1,9 @@
import React, { PropTypes } from 'react'
import FontAwesome from 'react-fontawesome'
import React, { PropTypes } from 'react';
import FontAwesome from 'react-fontawesome';
import Icon from '../Icon'
import * as helpers from '../../helpers'
import Icon from '../Icon';
import * as helpers from '../../helpers';
export default class AddToQueueModal extends React.Component{
@ -57,7 +57,7 @@ export default class AddToQueueModal extends React.Component{
</div>
<div className="actions centered-text">
<button type="submit" className="primary wide">Add</button>
<button type="submit" className="primary large">Add</button>
</div>
</form>
</div>

12
src/js/components/Modal/AuthorizationModal_Receive.js
View File

@ -1,8 +1,8 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { Link } from 'react-router'
import { createStore, bindActionCreators } from 'redux'
import React, { PropTypes } from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router';
import { createStore, bindActionCreators } from 'redux';
import * as uiActions from '../../services/ui/actions'
import * as helpers from '../../helpers'
@ -43,8 +43,8 @@ export default class extends React.Component{
</div>
<div className="actions centered-text">
<button onClick={e => this.props.uiActions.closeModal()}>Ignore</button>
<button className="primary" onClick={e => this.handleImport(e)}>Import authorization</button>
<button className="large" onClick={e => this.props.uiActions.closeModal()}>Ignore</button>
<button className="primary large" onClick={e => this.handleImport(e)}>Import authorization</button>
</div>
</div>
)

9
src/js/components/Modal/CreatePlaylistModal.js
View File

@ -1,8 +1,9 @@
import React, { PropTypes } from 'react'
import React, { PropTypes } from 'react';
import FontAwesome from 'react-fontawesome';
import Icon from '../Icon'
import * as helpers from '../../helpers'
import Icon from '../Icon';
import * as helpers from '../../helpers';
export default class CreatePlaylistModal extends React.Component{
@ -122,7 +123,7 @@ export default class CreatePlaylistModal extends React.Component{
{this.renderFields()}
<div className="actions centered-text">
<button type="submit" className="primary wide">Create</button>
<button type="submit" className="primary large">Create playlist</button>
</div>
</form>

8
src/js/components/Modal/EditPlaylistModal.js
View File

@ -1,8 +1,8 @@
import React from 'react'
import React from 'react';
import Icon from '../Icon'
import * as helpers from '../../helpers'
import Icon from '../Icon';
import * as helpers from '../../helpers';
export default class EditPlaylistModal extends React.Component{
@ -98,7 +98,7 @@ export default class EditPlaylistModal extends React.Component{
{this.renderFields()}
<div className="actions centered-text">
<button type="submit" className="primary wide">Save</button>
<button type="submit" className="primary large">Save</button>
</div>
</form>
</div>

12
src/js/components/Modal/EditRadioModal.js
View File

@ -1,9 +1,9 @@
import React, { PropTypes } from 'react'
import FontAwesome from 'react-fontawesome'
import React, { PropTypes } from 'react';
import FontAwesome from 'react-fontawesome';
import Icon from '../Icon'
import * as helpers from '../../helpers'
import Icon from '../Icon';
import * as helpers from '../../helpers';
export default class EditRadioModal extends React.Component{
@ -214,8 +214,8 @@ export default class EditRadioModal extends React.Component{
<form>
<div className="actions centered-text">
{this.state.enabled ? <button className="destructive wide" onClick={e => this.handleStop(e)}>Stop</button> : null}
{this.state.enabled ? <button className="primary wide" onClick={e => this.handleUpdate(e)}>Save</button> : <button className="primary wide" onClick={e => this.handleStart(e)}>Start</button>}
{this.state.enabled ? <button className="destructive large" onClick={e => this.handleStop(e)}>Stop</button> : null}
{this.state.enabled ? <button className="primary large" onClick={e => this.handleUpdate(e)}>Save</button> : <button className="primary large" onClick={e => this.handleStart(e)}>Start</button>}
</div>
</form>
</div>

15
src/js/components/Modal/ImageZoomModal.js
View File

@ -1,13 +1,12 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { Link } from 'react-router'
import { createStore, bindActionCreators } from 'redux'
import React, { PropTypes } from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router';
import { createStore, bindActionCreators } from 'redux';
import * as uiActions from '../../services/ui/actions'
import * as helpers from '../../helpers'
import Icon from '../Icon'
import Icon from '../Icon';
import * as uiActions from '../../services/ui/actions';
import * as helpers from '../../helpers';
class ImageZoomModal extends React.Component{

53
src/js/components/Modal/InitialSetupModal.js Executable file
View File

@ -0,0 +1,53 @@
import React, { PropTypes } from 'react'
import FontAwesome from 'react-fontawesome'
import Icon from '../Icon'
import * as helpers from '../../helpers'
export default class InitialSetupModal extends React.Component{
constructor(props){
super(props);
this.state = {
username: 'Anonymous'
}
}
handleSubmit(e){
// save and falseify show_initial_setup
}
handleCancel(e){
// falseify show_initial_setup
}
render(){
return (
<div>
<h1>Welcome to Iris</h1>
<form onSubmit={(e) => this.handleSubmit(e)}>
<div className="field">
<div className="name">Username</div>
<div className="input">
<input
type="text"
onChange={e => this.setState({username: e.target.value.replace(/\W/g, '')})}
value={this.state.username } />
<div className="description">
A non-unique string used to identify this client (no special characters)
</div>
</div>
</div>
<div className="actions centered-text">
<button className="large" onClick={e => this.handleCancel(e)}>Skip</button>
<button className="primary large" onClick={e => this.handleSubmit(e)}>Save</button>
</div>
</form>
</div>
)
}
}

8
src/js/components/Modal/Modal.js
View File

@ -14,7 +14,7 @@ import EditRadioModal from './EditRadioModal'
import ImageZoomModal from './ImageZoomModal'
import KioskModeModal from './KioskModeModal'
import SearchURISchemesModal from './SearchURISchemesModal'
import VolumeModal from './VolumeModal'
import InitialSetupModal from './InitialSetupModal'
import AuthorizationModal_Send from './AuthorizationModal_Send'
import AuthorizationModal_Receive from './AuthorizationModal_Receive'
@ -131,11 +131,9 @@ class Modal extends React.Component{
available_uri_schemes={this.props.uri_schemes}
data={this.props.modal.data} /> : null }
{ this.props.modal.name == 'volume' ? <VolumeModal
{ this.props.modal.name == 'initial_setup' ? <InitialSetupModal
uiActions={this.props.uiActions}
mopidyActions={this.props.mopidyActions}
volume={this.props.volume}
mute={this.props.mute} /> : null }
pusherActions={this.props.pusherActions} /> : null }
</div>
</div>

10
src/js/components/Modal/SearchURISchemesModal.js
View File

@ -1,10 +1,10 @@
import React, { PropTypes } from 'react'
import FontAwesome from 'react-fontawesome'
import React, { PropTypes } from 'react';
import FontAwesome from 'react-fontawesome';
import Sortable from 'react-sortablejs';
import Icon from '../Icon'
import * as helpers from '../../helpers'
import Icon from '../Icon';
import * as helpers from '../../helpers';
export default class SearchURISchemesModal extends React.Component{
@ -95,7 +95,7 @@ export default class SearchURISchemesModal extends React.Component{
</div>
<div className="actions centered-text">
<button type="submit" className="primary wide">Save</button>
<button type="submit" className="primary large">Save</button>
</div>
</form>
</div>

41
src/js/components/Modal/VolumeModal.js
View File

@ -1,41 +0,0 @@
import React, { PropTypes } from 'react'
import FontAwesome from 'react-fontawesome'
import Icon from '../Icon'
import * as helpers from '../../helpers'
export default class VolumeModal extends React.Component{
constructor(props){
super(props)
}
changeVolume(e){
var slider = e.target;
var sliderY = e.clientY - slider.getBoundingClientRect().top;
var sliderHeight = slider.getBoundingClientRect().height;
var percent = 100 - parseInt(sliderY / sliderHeight * 100 );
this.props.mopidyActions.setVolume(percent )
}
toggleMute(e){
this.props.mopidyActions.setMute(!this.props.mute)
}
render(){
return (
<div>
<a className="toggle-mute" onClick={e => this.toggleMute(e)}>
{this.props.mute ? <FontAwesome className="muted" name="volume-off" /> : <FontAwesome name="volume-down" />}
</a>
<div className={this.props.mute ? "slider vertical disabled" : "slider vertical"} onClick={e => this.changeVolume(e)}>
<div className="track">
<div className="progress" style={{ height: this.props.volume+'%' }}></div>
</div>
</div>
</div>
)
}
}