ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2025-01-03 10:25:08 +01:00
Code Issues Releases Wiki Activity

Add "other" type display

Browse Source
This commit is contained in:
vrde 2015-06-04 17:37:46 +02:00
parent ff6855970e
commit 8f65aa7a2d
2 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
js/components/ascribe_media/media_player.js
View File

@ -1,5 +1,6 @@
import React from 'react';
import InjectInHeadMixin from '../../mixins/inject_in_head_mixin';
import Panel from 'react-bootstrap/lib/Panel';
/**
* This is the component that implements display-specific functionality.
@ -13,6 +14,20 @@ import InjectInHeadMixin from '../../mixins/inject_in_head_mixin';
*/
let Other = React.createClass({
render() {
let ext = this.props.url.split('.').pop();
return (
<Panel className="media-other">
<p className="text-center">
.{ext}
</p>
</Panel>
);
}
});
let Image = React.createClass({
render() {
return (
@ -65,7 +80,8 @@ let Video = React.createClass({
let resourceMap = {
'image': Image,
'video': Video
'video': Video,
'other': Other
}
let MediaPlayer = React.createClass({
@ -76,7 +92,7 @@ let MediaPlayer = React.createClass({
},
render() {
let Component = resourceMap[this.props.mimetype] || Image;
let Component = resourceMap[this.props.mimetype] || Other;
return (
<div className="ascribe-media-player">

5
sass/ascribe_media_player.scss
View File

@ -9,5 +9,10 @@
width: 100%;
height: 100%;
}
.media-other {
font-size: 500%;
color: #cccccc;
}
}