fix(live-streaming): show stream key validation in mobile
This commit is contained in:
parent
920c179f56
commit
5598b8443a
|
@ -52,15 +52,28 @@ class StreamKeyForm extends AbstractStreamKeyForm {
|
||||||
placeholderTextColor = { PLACEHOLDER_COLOR }
|
placeholderTextColor = { PLACEHOLDER_COLOR }
|
||||||
style = { styles.streamKeyInput }
|
style = { styles.streamKeyInput }
|
||||||
value = { this.props.value } />
|
value = { this.props.value } />
|
||||||
<TouchableOpacity
|
<View style = { styles.formFooter }>
|
||||||
onPress = { this._onOpenHelp }
|
{
|
||||||
style = { styles.streamKeyHelp } >
|
this.state.showValidationError
|
||||||
<Text style = { styles.text }>
|
? <View style = { styles.formFooterItem }>
|
||||||
{
|
<Text style = { styles.warningText }>
|
||||||
t('liveStreaming.streamIdHelp')
|
{ t('liveStreaming.invalidStreamKey') }
|
||||||
}
|
</Text>
|
||||||
</Text>
|
</View>
|
||||||
</TouchableOpacity>
|
: null
|
||||||
|
}
|
||||||
|
<View style = { styles.formFooterItem }>
|
||||||
|
<TouchableOpacity
|
||||||
|
onPress = { this._onOpenHelp }
|
||||||
|
style = { styles.streamKeyHelp } >
|
||||||
|
<Text style = { styles.text }>
|
||||||
|
{
|
||||||
|
t('liveStreaming.streamIdHelp')
|
||||||
|
}
|
||||||
|
</Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
</View>
|
||||||
|
</View>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -48,6 +48,20 @@ export default createStyleSheet({
|
||||||
padding: BoxModel.padding
|
padding: BoxModel.padding
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Wrapper for the last element in the form.
|
||||||
|
*/
|
||||||
|
formFooter: {
|
||||||
|
flexDirection: 'row'
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Wrapper for individual children in the last element of the form.
|
||||||
|
*/
|
||||||
|
formFooterItem: {
|
||||||
|
flex: 1
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Explaining text on the top of the sign in form.
|
* Explaining text on the top of the sign in form.
|
||||||
*/
|
*/
|
||||||
|
@ -133,6 +147,12 @@ export default createStyleSheet({
|
||||||
|
|
||||||
text: {
|
text: {
|
||||||
color: ColorPalette.white
|
color: ColorPalette.white
|
||||||
}
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A different colored text to indicate information needing attention.
|
||||||
|
*/
|
||||||
|
warningText: {
|
||||||
|
color: ColorPalette.Y200
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -53,11 +53,12 @@ class StreamKeyForm extends AbstractStreamKeyForm {
|
||||||
type = 'text'
|
type = 'text'
|
||||||
value = { this.props.value } />
|
value = { this.props.value } />
|
||||||
<div className = 'form-footer'>
|
<div className = 'form-footer'>
|
||||||
{ this.state.showValidationError
|
{
|
||||||
? <span className = 'validation-error'>
|
this.state.showValidationError
|
||||||
{ t('liveStreaming.invalidStreamKey') }
|
? <span className = 'validation-error'>
|
||||||
</span>
|
{ t('liveStreaming.invalidStreamKey') }
|
||||||
: null
|
</span>
|
||||||
|
: null
|
||||||
}
|
}
|
||||||
{ this.helpURL
|
{ this.helpURL
|
||||||
? <a
|
? <a
|
||||||
|
|
Loading…
Reference in New Issue