 <section class="content-header">
    <h1>
        {{phrase.mediaCenter}}
    </h1>
</section>


<section class="content" ng-show="views.list">
  <a ng-show="dirParent!='-1'" ng-click="chDir(dirParent)" class="floatRTL btn btn-success btn-flat pull-right marginBottom15">{{phrase.goUp}}</a> 
  <a ng-if="userRole == 'admin'" ng-click="changeView('addMedia')" class="floatRTL btn btn-success btn-flat pull-right marginBottom15">{{phrase.uploadMedia}}</a> 
  <a ng-if="userRole == 'admin'" ng-click="changeView('addAlbum')" class="floatRTL btn btn-success btn-flat pull-right marginBottom15">{{phrase.addAlbum}}</a>  
  
  <div class="box col-xs-12">
      
    <div ng-show="albums.length" class="box-header">
        <h3 class="box-title">{{phrase.albums}}</h3>
    </div>
    <div ng-show="albums.length" class="row">
      
      <div ng-repeat="album in albums" class="col-md-3">
          
            <div class="box box-solid box-info">
                <div class="box-header">
                    <a ng-click="chDir(album.id)" class="mediaBtn"><h3 class="box-title">{{album.albumTitle}}</h3></a>
                    <div class="box-tools pull-right">
                        <a ng-if="userRole == 'admin'" ng-click="editAlbumData(album.id)" class="btn btn-info btn-sm" data-widget="{{phrase.Edit}}"><i class="fa fa-pencil"></i></a>
                        <a ng-if="userRole == 'admin'" ng-click="removeAlbum(album,$index)" class="btn btn-info btn-sm" data-widget="{{phrase.Remove}}"><i class="fa fa-times"></i></a>
                    </div>
                </div>
                <a ng-click="chDir(album.id)" class="mediaBtn"><div class="box-body">
                    <img ng-src="{{album.albumImage == '' && 'uploads/media/default.png' || 'media/resize/'+ album.albumImage+'/215/170' }}" class="center-block"/>
                    <p>{{album.albumDescription}}</p>
                </div></a>
            </div>
      </div>
        
    </div>

    <div ng-show="media.length" class="box-header">
        <h3 class="box-title">{{phrase.Media}}</h3>
    </div>
    <div ng-show="media.length" class="row">
      
      <div ng-repeat="item in media" class="col-md-3">
          <div class="box box-solid box-info">
              <div class="box-header">
                  <h3 class="box-title">{{item.mediaTitle}}</h3>
                  <div class="box-tools pull-right">
                      <a ng-if="userRole == 'admin'" ng-click="editItem(item.id)" class="btn btn-info btn-sm" data-widget="{{phrase.Edit}}"><i class="fa fa-pencil"></i></a>
                      <a ng-if="userRole == 'admin'" ng-click="removeItem(item,$index)" class="btn btn-info btn-sm" data-widget="{{phrase.Remove}}"><i class="fa fa-times"></i></a>
                  </div>
              </div>
              <div class="box-body">
                  <a target="_BLANK" href="uploads/media/{{item.mediaURL}}"><img ng-src="media/resize/{{item.mediaURL}}/215/170" class="img-responsive"/></a>
                  <p>{{item.mediaDescription}}</p>
              </div>
          </div>
      </div>
      
    </div>
    <div ng-show="!media.length" class="box-header">
      <h3 class="box-title">{{phrase.noMediaInAlbum}}</h3>
    </div>

  </div>
</section>

<section class="content" ng-show="views.addAlbum">
  <a ng-click="changeView('list')" class="floatRTL btn btn-danger btn-flat pull-right marginBottom15">{{phrase.cancelAdd}}</a>  
  <div class="box col-xs-12">
    <div class="box-header">
        <h3 class="box-title">{{phrase.addAlbum}}</h3>
    </div>
    <div class="box-body table-responsive">
      <form class="form-horizontal" ng-upload="saveAlbum(content)" method="post" action="media/newAlbum" name="addAlbum" role="form" novalidate>
        <div class="form-group" ng-class="{'has-error': addAlbum.albumTitle.$invalid}">
          <label for="inputEmail3" class="col-sm-2 control-label">{{phrase.albumTitle}} * </label>
          <div class="col-sm-10">
            <input type="text" name="albumTitle" ng-model="form.albumTitle" class="form-control" required placeholder="{{phrase.albumTitle}}">
          </div>
        </div>
        <div class="form-group">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.albumDesc}}</label>
          <div class="col-sm-10">
            <textarea name="albumDescription" class="form-control" ng-model="form.albumDescription" placeholder="{{phrase.albumDesc}}"></textarea>
          </div>
        </div>
        <div class="form-group">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.albumImage}}</label>
          <div class="col-sm-10">
            <input type="file" name="albumImage">
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-offset-2 col-sm-10">
            <input type="hidden" name="_token" value="{{CSRF_TOKEN}}">
            <input type="hidden" name="albumParent" value="{{dirNow}}">
            <button type="submit" class="btn btn-default" ng-disabled="addAlbum.$invalid">{{phrase.addAlbum}}</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</section>

<section class="content" ng-show="views.editAlbum">
  <a ng-click="changeView('list')" class="floatRTL btn btn-danger btn-flat pull-right marginBottom15">{{phrase.cancelEdit}}</a> 
  <div class="box col-xs-12">
    <div class="box-header">
        <h3 class="box-title">{{phrase.editAlbum}}</h3>
    </div>
    <div class="box-body table-responsive">
      <form class="form-horizontal" ng-upload="saveEditAlbum(content)" method="post" action="{{'media/editAlbum/'+form.id}}" name="editAlbum" role="form" novalidate>
        <div class="form-group" ng-class="{'has-error': addAlbum.albumTitle.$invalid}">
          <label for="inputEmail3" class="col-sm-2 control-label">{{phrase.albumTitle}} * </label>
          <div class="col-sm-10">
            <input type="text" name="albumTitle" ng-model="form.albumTitle" class="form-control" required placeholder="{{phrase.albumTitle}}">
          </div>
        </div>
        <div class="form-group">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.albumDesc}}</label>
          <div class="col-sm-10">
            <textarea name="albumDescription" class="form-control" ng-model="form.albumDescription" placeholder="{{phrase.albumDesc}}"></textarea>
          </div>
        </div>
        <div class="form-group">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.albumImage}}</label>
          <div class="col-sm-10">
            <input type="file" name="albumImage">
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-offset-2 col-sm-10">
            <input type="hidden" name="_token" value="{{CSRF_TOKEN}}">
            <input type="hidden" name="albumParent" value="{{dirNow}}">
            <button type="submit" class="btn btn-default" ng-disabled="editAlbum.$invalid">{{phrase.editAlbum}}</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</section>

<section class="content" ng-show="views.addMedia">
  <a ng-click="changeView('list')" class="floatRTL btn btn-danger btn-flat pull-right marginBottom15">{{phrase.cancelAdd}}</a>  
  <div class="box col-xs-12">
    <div class="box-header">
        <h3 class="box-title">{{phrase.addMedia}}</h3>
    </div>
    <div class="box-body table-responsive">
      <form class="form-horizontal" ng-upload="saveMedia(content)" method="post" action="media" name="addMedia" role="form" novalidate>
        <div class="form-group" ng-class="{'has-error': addMedia.mediaTitle.$invalid}">
          <label for="inputEmail3" class="col-sm-2 control-label">{{phrase.mediaTitle}} * </label>
          <div class="col-sm-10">
            <input type="text" name="mediaTitle" ng-model="form.mediaTitle" class="form-control" required placeholder="{{phrase.mediaTitle}}">
          </div>
        </div>
        <div class="form-group">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.mediaDesc}}</label>
          <div class="col-sm-10">
            <textarea name="mediaDescription" class="form-control" ng-model="form.mediaDescription" placeholder="{{phrase.mediaDesc}}"></textarea>
          </div>
        </div>
        <div class="form-group" ng-class="{'has-error': addMedia.mediaURL.$invalid}">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.mediaImage}}</label>
          <div class="col-sm-10">
            <input type="file" name="mediaURL" required>
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-offset-2 col-sm-10">
            <input type="hidden" name="_token" value="{{CSRF_TOKEN}}">
            <input type="hidden" name="albumId" value="{{dirNow}}">
            <button type="submit" class="btn btn-default" ng-disabled="addMedia.$invalid">{{phrase.addMedia}}</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</section>

<section class="content" ng-show="views.editMedia">
  <a ng-click="changeView('list')" class="floatRTL btn btn-danger btn-flat pull-right marginBottom15">{{phrase.cancelEdit}}</a> 
  <div class="box col-xs-12">
    <div class="box-header">
        <h3 class="box-title">{{phrase.editMedia}}</h3>
    </div>
    <div class="box-body table-responsive">
      <form class="form-horizontal" ng-upload="saveEditItem(content)" method="post" action="{{ 'media/' + form.id }}" name="editMedia" role="form" novalidate>
        <div class="form-group" ng-class="{'has-error': addMedia.mediaTitle.$invalid}">
          <label for="inputEmail3" class="col-sm-2 control-label">{{phrase.mediaTitle}} * </label>
          <div class="col-sm-10">
            <input type="text" name="mediaTitle" ng-model="form.mediaTitle" class="form-control" required placeholder="{{phrase.mediaTitle}}">
          </div>
        </div>
        <div class="form-group">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.mediaDesc}}</label>
          <div class="col-sm-10">
            <textarea name="mediaDescription" class="form-control" ng-model="form.mediaDescription" placeholder="{{phrase.mediaDesc}}"></textarea>
          </div>
        </div>
        <div class="form-group" ng-class="{'has-error': addMedia.mediaURL.$invalid}">
          <label for="inputPassword3" class="col-sm-2 control-label">{{phrase.mediaImage}}</label>
          <div class="col-sm-10">
            <input type="file" name="mediaURL" required>
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-offset-2 col-sm-10">
            <input type="hidden" name="_token" value="{{CSRF_TOKEN}}">
            <input type="hidden" name="albumId" value="{{dirNow}}">
            <button type="submit" class="btn btn-default" ng-disabled="editMedia.$invalid">{{phrase.editMedia}}</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</section>