Formatted CreateComment, CreatePost, and FileUpload React components to match the style guide
Этот коммит содержится в:
hmhealey
@@ -14,7 +14,7 @@ module.exports = React.createClass({
|
||||
var element = $(this.refs.fileInput.getDOMNode());
|
||||
var files = element.prop('files');
|
||||
|
||||
var channel_id = ChannelStore.getCurrentId();
|
||||
var channelId = ChannelStore.getCurrentId();
|
||||
|
||||
this.props.onUploadError(null);
|
||||
|
||||
@@ -27,15 +27,15 @@ module.exports = React.createClass({
|
||||
}
|
||||
}
|
||||
|
||||
var numToUpload = Math.min(Constants.MAX_UPLOAD_FILES - this.props.getFileCount(channel_id), numFiles);
|
||||
var numToUpload = Math.min(Constants.MAX_UPLOAD_FILES - this.props.getFileCount(channelId), numFiles);
|
||||
|
||||
if (numFiles > numToUpload) {
|
||||
this.props.onUploadError("Uploads limited to " + Constants.MAX_UPLOAD_FILES + " files maximum. Please use additional posts for more files.");
|
||||
this.props.onUploadError('Uploads limited to ' + Constants.MAX_UPLOAD_FILES + ' files maximum. Please use additional posts for more files.');
|
||||
}
|
||||
|
||||
for (var i = 0; i < files.length && i < numToUpload; i++) {
|
||||
if (files[i].size > Constants.MAX_FILE_SIZE) {
|
||||
this.props.onUploadError("Files must be no more than " + Constants.MAX_FILE_SIZE/1000000 + " MB");
|
||||
this.props.onUploadError('Files must be no more than ' + Constants.MAX_FILE_SIZE / 1000000 + ' MB');
|
||||
continue;
|
||||
}
|
||||
|
||||
@@ -43,15 +43,15 @@ module.exports = React.createClass({
|
||||
var clientId = utils.generateId();
|
||||
|
||||
// Prepare data to be uploaded.
|
||||
formData = new FormData();
|
||||
formData.append('channel_id', channel_id);
|
||||
var formData = new FormData();
|
||||
formData.append('channel_id', channelId);
|
||||
formData.append('files', files[i], files[i].name);
|
||||
formData.append('client_ids', clientId);
|
||||
|
||||
var request = client.uploadFile(formData,
|
||||
function(data) {
|
||||
parsedData = $.parseJSON(data);
|
||||
this.props.onFileUpload(parsedData['filenames'], parsedData['client_ids'], channel_id);
|
||||
var parsedData = $.parseJSON(data);
|
||||
this.props.onFileUpload(parsedData['filenames'], parsedData['client_ids'], channelId);
|
||||
|
||||
var requests = this.state.requests;
|
||||
for (var i = 0; i < parsedData['client_ids'].length; i++) {
|
||||
@@ -68,26 +68,26 @@ module.exports = React.createClass({
|
||||
requests[clientId] = request;
|
||||
this.setState({requests: requests});
|
||||
|
||||
this.props.onUploadStart([clientId], channel_id);
|
||||
this.props.onUploadStart([clientId], channelId);
|
||||
}
|
||||
|
||||
// clear file input for all modern browsers
|
||||
try{
|
||||
try {
|
||||
element[0].value = '';
|
||||
if(element.value){
|
||||
element[0].type = "text";
|
||||
element[0].type = "file";
|
||||
if (element.value) {
|
||||
element[0].type = 'text';
|
||||
element[0].type = 'file';
|
||||
}
|
||||
}catch(e){}
|
||||
} catch(e) {}
|
||||
},
|
||||
componentDidMount: function() {
|
||||
var inputDiv = this.refs.input.getDOMNode();
|
||||
var self = this;
|
||||
|
||||
document.addEventListener("paste", function(e) {
|
||||
document.addEventListener('paste', function(e) {
|
||||
var textarea = $(inputDiv.parentNode.parentNode).find('.custom-textarea')[0];
|
||||
|
||||
if (textarea != e.target && !$.contains(textarea,e.target)) {
|
||||
if (textarea !== e.target && !$.contains(textarea, e.target)) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -99,50 +99,69 @@ module.exports = React.createClass({
|
||||
var numItems = 0;
|
||||
if (items) {
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
if (items[i].type.indexOf("image") !== -1) {
|
||||
if (items[i].type.indexOf('image') !== -1) {
|
||||
var ext = items[i].type.split('/')[1].toLowerCase();
|
||||
if (ext === 'jpeg') {
|
||||
ext = 'jpg';
|
||||
}
|
||||
|
||||
ext = items[i].type.split("/")[1].toLowerCase();
|
||||
ext = ext == 'jpeg' ? 'jpg' : ext;
|
||||
if (Constants.IMAGE_TYPES.indexOf(ext) < 0) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (Constants.IMAGE_TYPES.indexOf(ext) < 0) return;
|
||||
|
||||
numItems++
|
||||
numItems++;
|
||||
}
|
||||
}
|
||||
|
||||
var numToUpload = Math.min(Constants.MAX_UPLOAD_FILES - self.props.getFileCount(channel_id), numItems);
|
||||
var numToUpload = Math.min(Constants.MAX_UPLOAD_FILES - self.props.getFileCount(channelId), numItems);
|
||||
|
||||
if (numItems > numToUpload) {
|
||||
self.props.onUploadError("Uploads limited to " + Constants.MAX_UPLOAD_FILES + " files maximum. Please use additional posts for more files.");
|
||||
self.props.onUploadError('Uploads limited to ' + Constants.MAX_UPLOAD_FILES + ' files maximum. Please use additional posts for more files.');
|
||||
}
|
||||
|
||||
for (var i = 0; i < items.length && i < numToUpload; i++) {
|
||||
if (items[i].type.indexOf("image") !== -1) {
|
||||
if (items[i].type.indexOf('image') !== -1) {
|
||||
var file = items[i].getAsFile();
|
||||
|
||||
ext = items[i].type.split("/")[1].toLowerCase();
|
||||
ext = ext == 'jpeg' ? 'jpg' : ext;
|
||||
var ext = items[i].type.split('/')[1].toLowerCase();
|
||||
if (ext === 'jpeg') {
|
||||
ext = 'jpg';
|
||||
}
|
||||
|
||||
if (Constants.IMAGE_TYPES.indexOf(ext) < 0) return;
|
||||
if (Constants.IMAGE_TYPES.indexOf(ext) < 0) {
|
||||
continue;
|
||||
}
|
||||
|
||||
var channel_id = ChannelStore.getCurrentId();
|
||||
var channelId = ChannelStore.getCurrentId();
|
||||
|
||||
// generate a unique id that can be used by other components to refer back to this file upload
|
||||
var clientId = utils.generateId();
|
||||
|
||||
formData = new FormData();
|
||||
formData.append('channel_id', channel_id);
|
||||
var formData = new FormData();
|
||||
formData.append('channel_id', channelId);
|
||||
|
||||
var d = new Date();
|
||||
var hour = d.getHours() < 10 ? "0" + d.getHours() : String(d.getHours());
|
||||
var min = d.getMinutes() < 10 ? "0" + d.getMinutes() : String(d.getMinutes());
|
||||
var name = "Image Pasted at "+d.getFullYear()+"-"+d.getMonth()+"-"+d.getDate()+" "+hour+"-"+min+"." + ext;
|
||||
var hour;
|
||||
if (d.getHours() < 10) {
|
||||
hour = '0' + d.getHours();
|
||||
} else {
|
||||
hour = String(d.getHours());
|
||||
}
|
||||
var min;
|
||||
if (d.getMinutes() < 10) {
|
||||
min = '0' + d.getMinutes();
|
||||
} else {
|
||||
min = String(d.getMinutes());
|
||||
}
|
||||
|
||||
var name = 'Image Pasted at ' + d.getFullYear() + '-' + d.getMonth() + '-' + d.getDate() + ' ' + hour + '-' + min + '.' + ext;
|
||||
formData.append('files', file, name);
|
||||
formData.append('client_ids', clientId);
|
||||
|
||||
var request = client.uploadFile(formData,
|
||||
function(data) {
|
||||
parsedData = $.parseJSON(data);
|
||||
self.props.onFileUpload(parsedData['filenames'], parsedData['client_ids'], channel_id);
|
||||
var parsedData = $.parseJSON(data);
|
||||
self.props.onFileUpload(parsedData['filenames'], parsedData['client_ids'], channelId);
|
||||
|
||||
var requests = self.state.requests;
|
||||
for (var i = 0; i < parsedData['client_ids'].length; i++) {
|
||||
@@ -159,7 +178,7 @@ module.exports = React.createClass({
|
||||
requests[clientId] = request;
|
||||
self.setState({requests: requests});
|
||||
|
||||
self.props.onUploadStart([clientId], channel_id);
|
||||
self.props.onUploadStart([clientId], channelId);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -178,7 +197,12 @@ module.exports = React.createClass({
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<span ref="input" className="btn btn-file"><span><i className="glyphicon glyphicon-paperclip"></i></span><input ref="fileInput" type="file" onChange={this.handleChange} multiple/></span>
|
||||
<span ref='input' className='btn btn-file'>
|
||||
<span>
|
||||
<i className='glyphicon glyphicon-paperclip' />
|
||||
</span>
|
||||
<input ref='fileInput' type='file' onChange={this.handleChange} multiple/>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
Ссылка в новой задаче
Block a user