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

Basic uploadfield

Browse Source
This commit is contained in:
James Barnsley
2018-07-08 20:20:51 +12:00
parent 528383cfe8
commit 0ef00e74ab
7 changed files with 43 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
mopidy_iris/static/app.css
View File

@ -2920,6 +2920,7 @@ input[type="email"],
input[type="number"],
input[type="email"],
input[type="date"],
input[type="file"],
select {
padding: 10px 14px;
background: rgba(255, 255, 255, 0.1);
@ -2939,6 +2940,8 @@ select {
input[type="email"]:active,
input[type="date"]:focus,
input[type="date"]:active,
input[type="file"]:focus,
input[type="file"]:active,
select:focus,
select:active {
background: rgba(255, 255, 255, 0.2); }
@ -2948,6 +2951,7 @@ select {
input[type="number"]:disabled,
input[type="email"]:disabled,
input[type="date"]:disabled,
input[type="file"]:disabled,
select:disabled {
opacity: 0.5; }
textarea.tiny,
@ -2956,6 +2960,7 @@ select {
input[type="number"].tiny,
input[type="email"].tiny,
input[type="date"].tiny,
input[type="file"].tiny,
select.tiny {
width: 50px;
padding-left: 4px;
@ -3301,7 +3306,9 @@ input[type="submit"] {
color: #cf2d2d;
display: inline-block;
opacity: 1; }
.field.radio input, .field.checkbox input {
.field.radio input[type="radio"],
.field.radio input[type="checkbox"], .field.checkbox input[type="radio"],
.field.checkbox input[type="checkbox"] {
display: none; }
.field.radio .input, .field.checkbox .input {
padding-top: 4px; }

13
mopidy_iris/static/app.js
View File

@ -62004,6 +62004,9 @@ var EditPlaylistModal = function (_React$Component) {
key: 'setImage',
value: function setImage(e) {
var self = this;
// Create a file-reader to import the selected image
// as a base64 string
var file_reader = new FileReader();
file_reader.addEventListener("load", function (e) {
@ -62066,7 +62069,7 @@ var EditPlaylistModal = function (_React$Component) {
),
_react2.default.createElement(
'div',
{ className: 'field text' },
{ className: 'field file' },
_react2.default.createElement(
'div',
{ className: 'name' },
@ -62077,10 +62080,16 @@ var EditPlaylistModal = function (_React$Component) {
{ className: 'input' },
_react2.default.createElement('input', {
type: 'file',
placeholder: 'Leave empty to keep existing image',
onChange: function onChange(e) {
return _this2.setImage(e);
}
})
}),
_react2.default.createElement(
'div',
{ className: 'description' },
'Leave empty to keep cover image unchanged'
)
)
),
_react2.default.createElement(

2
mopidy_iris/static/app.js.map
View File

File diff suppressed because one or more lines are too long

8
mopidy_iris/static/index.html
View File

@ -26,9 +26,6 @@
<link rel="apple-touch-icon" sizes="512x512" href="/iris/assets/logo-app-512.png" />
<link rel="mask-icon" href="/iris/assets/icon_coloured.svg" color="#08d58f" />
<!-- Raven Sentry -->
<script src="https://cdn.ravenjs.com/3.17.0/raven.min.js" crossorigin="anonymous"></script>
<!-- Loading screen -->
<style>
html {
@ -77,7 +74,7 @@
// Release details
// These are automatically injected to built HTML
var build = "1530872793";
var build = "1530996335";
var version = "3.22.0";
// Construct the script tag
@ -114,5 +111,8 @@
</script>
<!-- Raven Sentry -->
<script src="https://cdn.ravenjs.com/3.17.0/raven.min.js" crossorigin="anonymous"></script>
</html>

6
src/index.html
View File

@ -26,9 +26,6 @@
<link rel="apple-touch-icon" sizes="512x512" href="/iris/assets/logo-app-512.png" />
<link rel="mask-icon" href="/iris/assets/icon_coloured.svg" color="#08d58f" />
<!-- Raven Sentry -->
<script src="https://cdn.ravenjs.com/3.17.0/raven.min.js" crossorigin="anonymous"></script>
<!-- Loading screen -->
<style>
html {
@ -114,5 +111,8 @@
</script>
<!-- Raven Sentry -->
<script src="https://cdn.ravenjs.com/3.17.0/raven.min.js" crossorigin="anonymous"></script>
</html>

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

@ -25,14 +25,17 @@ export default class EditPlaylistModal extends React.Component{
this.setState({error: 'Name is required'})
return false
} else {
this.props.coreActions.savePlaylist(this.props.data.uri, this.state.name, this.state.description, this.state.public, this.state.collaborative, this.state.image)
this.props.uiActions.closeModal()
return false
this.props.coreActions.savePlaylist(this.props.data.uri, this.state.name, this.state.description, this.state.public, this.state.collaborative, this.state.image);
this.props.uiActions.closeModal();
return false;
}
}
setImage(e){
var self = this;
var self = this;
// Create a file-reader to import the selected image
// as a base64 string
var file_reader = new FileReader();
file_reader.addEventListener("load", function(e){
@ -69,13 +72,17 @@ export default class EditPlaylistModal extends React.Component{
/>
</div>
</div>
<div className="field text">
<div className="field file">
<div className="name">Cover image</div>
<div className="input">
<input
type="file"
placeholder="Leave empty to keep existing image"
onChange={e => this.setImage(e)}
/>
<div className="description">
Leave empty to keep cover image unchanged
</div>
</div>
</div>
<div className="field checkbox white">

5
src/scss/global/_forms.scss
View File

@ -13,6 +13,7 @@ input[type="email"],
input[type="number"],
input[type="email"],
input[type="date"],
input[type="file"],
select {
padding: 10px 14px;
background: rgba(255,255,255,0.1);
@ -339,7 +340,9 @@ input[type="submit"] {
&.radio,
&.checkbox {
input{
input[type="radio"],
input[type="checkbox"] {
display: none;
}