feat(trackers): display descriptions

src/app/torrent-page.js

@@ -18,6 +18,20 @@ import LinearProgress from 'material-ui/LinearProgress';
 import FlatButton from 'material-ui/FlatButton';
 import {fileTypeDetect} from './content'
 import {contentIcon} from './torrent'
+import TrackersImages from './trackers-images'
+
+let parseDescriptionText = (text) => {
+	return text.split("\n").map(function(item) {
+		const text = /([A-Za-zА-Яа-я]+:) (.+)/.exec(item)
+
+		return (
+		  <span>
+			{text ? <span><b>{`${text[1]} `}</b>{text[2]}</span> : item}
+			<br/>
+		  </span>
+		)
+	  })
+}
 
 let buildFilesTree = (filesList) => {
 	let rootTree = {
@@ -359,6 +373,7 @@ export default class TorrentPage extends Page {
   									</div>
   									<div style={{flexBasis: '40%'}} className='column center w100p'>
   										<img src={(this.torrent && this.torrent.info && this.torrent.info.poster) ? this.torrent.info.poster : NoImage} className='pad0-75' style={{height: '200px'}} />
+  										<TrackersImages info={this.torrent && this.torrent.info} className='column' />
 										<RaisedButton
   											href={`magnet:?xt=urn:btih:${this.torrent.hash}`}
   											target="_self"
@@ -509,15 +524,13 @@ export default class TorrentPage extends Page {
   										}
   									</div>
   								</div>
-								<div>
 								{
 									this.torrent && this.torrent.info && this.torrent.info.description
-										?
+									&&
-										<div />
+									<div className='fs0-85' style={{width: '95%', padding: 15, margin: 20, boxShadow: 'rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px'}}>
-										:
+										<div>{parseDescriptionText(this.torrent.info.description)}</div>
-										null
-									}
 									</div>
+								}
   							</div>
   						</Tab>
   						<Tab label={__('Files')} value="files" >

src/app/torrent.js

@@ -10,9 +10,7 @@ import TorrentPage from './torrent-page'
 import LinearProgress from 'material-ui/LinearProgress';
 let rating = require('./rating');
 import scrollBack from './remember-scroll'
-
+import TrackersImages from './trackers-images'
-import RutrackerIcon from './images/strategies/rutracker.png'
-import NyaaIcon from './images/strategies/nyaa.jpg'
 
 const contentIcon = (type, category, fill = 'grey') => {
 	if(category == 'xxx')
@@ -361,13 +359,7 @@ export default class Torrent extends Component {
                                     	}
                                     </div>
 							  }
-							  <div>
+							  <TrackersImages info={torrent.info} className='row' />
-								  {
-									torrent.info && torrent.info.trackers && torrent.info.trackers.includes('rutracker')
-									&&
-									<img src={RutrackerIcon} style={{height: 32}} />
-								  }
-							</div>
   						</div>
   					</a>
   				}

src/app/trackers-images.js

@@ -0,0 +1,28 @@
+import React from 'react';
+
+import RutrackerIcon from './images/strategies/rutracker.png'
+import NyaaIcon from './images/strategies/nyaa.jpg'
+
+export default (props) => {
+	let className = ''
+	if(props.className)
+        className += props.className
+    const {info} = props
+    if(!info)
+        return null
+
+	return (
+		<div>
+        {
+            info.trackers.includes('rutracker')
+            &&
+            <a href={`https://rutracker.org/forum/viewtopic.php?t=${info.rutrackerThreadId}`}><img src={RutrackerIcon} style={{height: 32}} /></a>
+        }
+        {
+            info.trackers.includes('nyaa')
+            &&
+           <img src={NyaaIcon} style={{height: 32}} />
+        }
+        </div>
+	)
+}