fix issue #1 and #2

em7v · Jun 24, 2017 · 29e013b · 29e013b
1 parent 0dbaae8
commit 29e013b
Show file tree

Hide file tree

Showing 5 changed files with 102 additions and 102 deletions.
diff --git a/src/config.js b/src/config.js
@@ -92,11 +92,11 @@ module.exports = {
   WINDOW_WEBTORRENT: 'file://' + path.join(__dirname, '..', 'static', 'webtorrent.html'),
 
   WINDOW_INITIAL_BOUNDS: {
-    width: 500,
+    width: 925,
     height: UI_HEADER_HEIGHT + (UI_TORRENT_HEIGHT * 6) // header + 6 torrents
   },
   WINDOW_MIN_HEIGHT: UI_HEADER_HEIGHT + (UI_TORRENT_HEIGHT * 2), // header + 2 torrents
-  WINDOW_MIN_WIDTH: 425,
+  WINDOW_MIN_WIDTH: 925,
 
   UI_HEADER_HEIGHT: UI_HEADER_HEIGHT,
   UI_TORRENT_HEIGHT: UI_TORRENT_HEIGHT

diff --git a/src/renderer/components/media/Grid.js b/src/renderer/components/media/Grid.js
@@ -2,64 +2,70 @@ const React = require('react')
 const {dispatcher} = require('../../lib/dispatcher');
 
 module.exports = class MediaGrid extends React.Component {
-  constructor(props){
-    super(props)
-  }
-
-  render () {
-    const {items} = this.props
-      return (
-        <div>
-          <div className="row">
-          {
-            items.map((item, key) => {
-              return this.renderItem(item, key)
-            })
-          }
-          </div>
-        </div>
-      )
-  }
+    constructor(props) {
+        super(props)
+    }
 
+    render() {
+        const {items} = this.props
+        return (
+            <div className="row">
+                <div className="col-md-9 col-md-offset-1">
+                    {
+                        items.map((item, key) => {
+                            return this.renderItem(item, key)
+                        })
+                    }
+                </div>
+            </div>
 
-  renderItem(item, key) {
-    // const {item} = this.props
-      let raitingClass = ''
+        )
+    }
 
-        if(item.raiting > 5) 
-         raitingClass = 'label label-good-raiting' 
+    getRaitingItemClass(item) {
+        if (item.raiting > 5)
+            return 'label label-good-raiting';
         else
-         raitingClass='label label-bad-raiting'
-
-       return (
-            <div key={'keyTorrent-' + key} className="media-grid-item col-lg-2 col-sm-3">
-                <div onClick={dispatcher('torrentDetail', item)}>
-                  <div className='item-img'>
-                    <img className='img-rounded' src={item.img ? item.img : 'http://image.prntscr.com/image/ec577832719c4c1eb054fc250e73db2a.png'}/>
-
-                    <div className='raiting'>
+            return 'label label-bad-raiting';
+    }
+
+    renderItem(item, key) {
+        let raitingClass = this.getRaitingItemClass(item);
+
+        return (
+            <div
+                key={'keyTorrent-' + key}
+                onClick={dispatcher('torrentDetail', item)}
+                className="media-grid-item col-xs-3 col-md-2"
+                style={ {cursor: 'pointer'} }
+            >
+
+
+                <img className='img-rounded item-img'
+                     src={item.img ? item.img : 'http://image.prntscr.com/image/ec577832719c4c1eb054fc250e73db2a.png'}/>
+
+                <div className='raiting'>
                       <span className={raitingClass}>
                         {item.raiting}
                       </span>
-                    </div>
+                </div>
 
-                    <div className='year'>
+                <div className='year'>
                       <span className='label label-success'>
                         {item.year} г.
                       </span>
-                    </div>
-
-                      <span className="label quality">
+                </div>
+                <div className="toper" style={ {position: 'absolute', top: 0, left: 0} }>
+                    <span className="label quality">
                         {item.quality}
                       </span>
-                  </div>
                 </div>
                 <div className="caption" style={{textAlign: 'center'}}>
-                  <h6 className="no-margin">
-                      <span>{item.name}</span>                        
-                  </h6>
-              </div>
+                    <h6 className="no-margin">
+                        <span>{item.name}</span>
+                    </h6>
+                </div>
             </div>
-          )
-  }
+        )
+    }
 }
diff --git a/src/renderer/components/navbar.js b/src/renderer/components/navbar.js
@@ -15,11 +15,11 @@ module.exports = class NavBar extends React.Component {
                 {
                     name: 'Фильмы',
                     action: () => state.location.go({url: 'home'}),
-                    home: true, 
-                    children: [
+                    home: true,
+                    children: [/*
                         {name: 'Израбнное'},
                         {name: 'Комедии'},
-                ]
+                    */]
                 },
                 {name: 'Загрузки', action: () => state.location.go({url: 'torrent-download-list'})},
 
@@ -28,16 +28,17 @@ module.exports = class NavBar extends React.Component {
     }
 
     render() {
-        return <div style={{position: 'fixed'}}>
-        <div className="logo">  Friday Movie </div> 
+        return <div>
+            <div className="logo"> Friday Movie</div>
             <div className="sidebar-category sidebar-category-visible">
                 <div className="category-content no-padding">
                     <ul className="navigation navigation-main navigation-accordion">
                         <div>{this.renderNavLink()}</div>
                     </ul>
                 </div>
 
-                <input ref="findInput" onChange={this.searchHandler.bind(this)} type="text" placeholder="Поиск" className="form-control"/>
+                <input ref="findInput" onChange={this.searchHandler.bind(this)} type="text" placeholder="Поиск"
+                       className="form-control"/>
                 {this.renderSearchResult(``)}
             </div>
         </div>
@@ -65,21 +66,34 @@ module.exports = class NavBar extends React.Component {
         });
     }
 
-    renderSearchResult()
-    {
-        if(this.state.searchResult)
-        {
+    renderSearchResult() {
+        if (this.state.searchResult) {
             return <div>
-            {
-                this.state.searchResult.map( (item) => {
-                     return <div> 
-                        <img src={item.img} className="img-responsive" style={{width:'140px'}}/>
-
-                            <span className="name"> {item.name}</span>
-                            <button className="btn btn-primary">Просмотр</button> 
-                    </div>
-                })
-            }
+                <ul className="list-group">
+                    {
+                        this.state.searchResult.map((item) => {
+                            return <li
+                                style={ {height: '110px', cursor: 'pointer'} }
+                                className="list-group-item"
+                                onClick={dispatcher('torrentDetail', item)}
+                            >
+
+                                <img style={
+                                    {
+                                        float: 'left',
+                                        height: '106px',
+                                        padding: '8px',
+                                        maxHeight: '90px'
+                                    }
+                                }
+                                     src={item.img} className="img-responsive"/>
+
+
+                                <span style={ {fontSize: '12px', color: 'black'} }> {item.name}</span>
+                            </li>
+                        })
+                    }
+                </ul>
             </div>
         }
     }

diff --git a/src/renderer/pages/torrent-list-page.js b/src/renderer/pages/torrent-list-page.js
@@ -41,19 +41,18 @@ module.exports = class TorrentList extends React.Component {
     }
 
     render() {
-
         const contents = [];
         contents.push(
             <div key="push">
-                <div key="menu" className="col-md-2" >
+                <div key="menu" className="col-md-2 col-xs-3 col-lg-2">
                     <Navbar/>
                 </div>
-                
+
                 <div key="cont" className="col-md-10" style={{overflow: 'hidden'}}>
                     {
                         (this.state.torrentList.length !== 0) ?
                             <div className="col-md-12">
-                                {this.renderTorrentList()} 
+                                {this.renderTorrentList()}
                             </div>
                             :
                             <LinearProgress/>
@@ -86,27 +85,8 @@ module.exports = class TorrentList extends React.Component {
 
 
     renderTorrentList() {
-        const {torrentList} = this.state
-
+        const {torrentList} = this.state;
         return <MediaGrid items={torrentList}/>
-
-        return (<GridList
-            cellHeight={190}
-            cols={5}>
-
-         {torrentList.map(function (item, key) {
-
-                return <GridTile
-                    onClick={dispatcher('torrentDetail', item)}
-                    key={'keyTorrent-' + key}
-                    title={ item.name + ' rait:' + item.raiting}
-                    subtitle={item.name}>
-                    <img src={item.img}/>
-                </GridTile>
-            })
-            }
-
-        </GridList>)
     }
 
 
@@ -125,16 +105,16 @@ module.exports = class TorrentList extends React.Component {
             let $ = cheerio.load(body);
             $(".m-right .plate.showcase .tiles").find('.tile').map((key, item) => {
                 let elem = $(item);
-                if (elem.find('.name').text())
-                {
+                if (elem.find('.name').text()) {
                     arrayMovies[arrayMovies.length] = {
                         name: elem.find('.name').text(),
                         img: elem.find('img').attr('src'),
                         link: elem.find('a').attr('href'),
                         quality: elem.find('.quality').text(),
                         raiting: elem.find('span.rating').text(),
                         year: elem.find('span.year').text()
-                    };}
+                    };
+                }
             });
             this.setState({torrentList: [...this.state.torrentList, ...arrayMovies]});
 

diff --git a/static/main.css b/static/main.css
@@ -999,9 +999,12 @@ video::-webkit-media-text-track-container {
 }
 
 .media-grid-item {
-    height: 300px;
-    margin-left: 15px;
-    margin-right: 15px;
+    height: 294px;
+    padding: 17px;
+    margin: 15px;
+    border-radius: 25px 10px;
+    position: relative;
+    background: #242425;
 }
 
 .media-grid-item .item-img {
@@ -1010,9 +1013,9 @@ video::-webkit-media-text-track-container {
     color: rgba(0, 0, 0, 0.82);
 }
 
-.item-img img {
-    height: 223px;
-    width: 160px;
+.item-img {
+    max-height: 80%;
+    width: 100%;
 }
 
 .media-grid-item .raiting, .year {
@@ -1043,9 +1046,6 @@ video::-webkit-media-text-track-container {
 
 .quality{
     background: rgba(0, 0, 0, 0.82);
-    position: absolute;
-    width: 95%;
-    top: 68%;
 }
 
 .media-grid-item .year {