@extends('layouts.experiments')
@section('content')
    <style>
        td:first-child{
            width:85%;
        }
    </style>
    <div class="container">
        <h2>Reddit 2</h2>

        <section>
            <h3>Import Subreddit Posts</h3>
            {!! Form::open(['route'=>['import-reddit'],'method'=>'GET','id'=>'import-form'])!!}
           <div class="form-group">
               {!! Form::label('feed','Subreddit:') !!}
               {!! Form::text('feed',null,['class'=>'form-control'])!!}
           </div>
            <button class="btn btn-success">Import</button>
            {!!Form::close()!!}
        </section>
    @foreach($subreddits as $subreddit=>$data)
    <section>
        <h3>{{$subreddit}} <small>Last Updated {{$data['last_updated']->diffForHumans()}}</small></h3>
        <div class="table-responsive">
            <table class="table table-striped">
                <thead>
                <th>Post</th>
                <th>Date Posted</th>
                </thead>
                <tbody>
                    @foreach($data['posts'] as $post)
                        <tr>
                            <td>
                                <a target="_blank" href="http://www.reddit.com/{{$post->permalink}}">{{$post->title}}</a>
                            </td>
                            <td>
                                {{$post->date->diffForHumans()}}
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </section>
    @endforeach
    </div>
@stop
@section('view-footer')
    <script>
        jQuery(document).ready(function(){
            $('#import-form').on('submit',function(e){

                var $self=$(this);
                $('*',$self).hide();
               $self.append('importing data <img src="/images/loading.gif">');
            });
        });
    </script>
@stop