Thanks to visit codestin.com
Credit goes to github.com

Skip to content

File list directive #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

File list directive #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
94bcc26
bootstraping directive to deal with file list
freddylimpens May 19, 2014
7d1288b
merged
freddylimpens Jun 25, 2014
e8e19c1
added attribute-only directive to watch load event on cards thumbnail…
freddylimpens Jun 27, 2014
4fbb8b0
code-cleaning on file comments (following Kanbans coding style)
freddylimpens Jun 27, 2014
25c55c3
refactored isotope services
freddylimpens Jun 27, 2014
2d15bcf
enhanced directive + added Files service
freddylimpens Jul 2, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@
<!-- app files -->
<script src="scripts/lib/filer/services.js"></script>
<script src="scripts/lib/filer/controllers.js"></script>
<script src="scripts/lib/filer/directives.js"></script>
<script src="scripts/lib/app.js"></script>

</html>
6 changes: 5 additions & 1 deletion scripts/src/app.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
angular.element(document).on('ready page:load', ->
angular.module('filer', ['filer.controllers', 'filer.services'])
angular.module('filer', ['filer.controllers', 'filer.services', 'filer.directives'])

angular.module('unisson_filer', ['filer', 'ui.router', 'ngAnimate', 'restangular', 'angularFileUpload', 'angucomplete', 'angular-unisson-auth'])

Expand Down Expand Up @@ -80,6 +80,10 @@ angular.element(document).on('ready page:load', ->
loginServiceProvider.setBaseUrl(config.loginBaseUrl)
)

.config((loginServiceProvider) ->
loginServiceProvider.setBaseUrl(config.loginBaseUrl)
)

.run(['$rootScope', 'loginService', ($rootScope, loginService) ->
$rootScope.config = config;

Expand Down
589 changes: 282 additions & 307 deletions scripts/src/filer/controllers.coffee
View file
Open in desktop

Large diffs are not rendered by default.

33 changes: 33 additions & 0 deletions scripts/src/filer/directives.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
module = angular.module('filer.directives', [])

#module.directive("leaflet", ["$http", "$log", "$location", ($http, $log, $location) ->

module.directive('isotopeOnLoad', ($rootScope) ->
return {
restrict: 'A',
link: (scope, element, attrs) ->
console.debug("starting isotopeOnLoad directive !!")
if (typeof $rootScope.loadCounter == 'undefined')
$rootScope.loadCounter = 0
image = element.find('img')
for img in image
do (img) ->
img = angular.element(img)
if img.hasClass('thumbnail')
img.bind('load', ()->
console.debug(" signal Card loaded", $rootScope.loadCounter)
scope.$emit('$cardLoaded', $rootScope.loadCounter++)
)
,
controller: ($scope, FilerService) ->
$scope.$parent.$on('$cardLoaded', (event, data) ->
if ($scope.$last && $scope.$index == $rootScope.loadCounter - 1)
$scope.$emit('$allCardsLoaded')
delete $rootScope.loadCounter
# FIXME : use initIsotope service from FilerService
FilerService.initIsotope()
)
}
)


59 changes: 46 additions & 13 deletions scripts/src/filer/services.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,12 @@ class FilerService
autoUpload: false
removeAfterUpload: true
url: config.bucket_uri
# FIXME : so far we set headers right after addin file, to be sure login is already done
# and api key is available. There HAS to be a cleaner way
formData: [{bucket: $stateParams.bucketId}] # FIXME
formData: [{bucket: $stateParams.bucketId}]
)

@$rootScope.uploader.bind('success', (event, xhr, item, response) =>
@$rootScope.panel = ''
# FIXME : add file to files list and then refresh isotope
@$state.go('bucket.labellisation', {filesIds: response.id})
)

Expand All @@ -32,12 +31,10 @@ class FilerService
@$state.transitionTo('bucket.file', toParams)

@$rootScope.exitPreview = ()=>
console.debug(" Exit preview mode !")
angular.element("#drive-app").removeClass("preview-mode")
@$state.go('bucket')
@$timeout(()=>
@$rootScope.runIsotope()
,300
)
this.initIsotope()
return true

@$rootScope.exitFiler = ()=>
Expand All @@ -60,20 +57,56 @@ class FilerService
@$rootScope.panel = ''
)

# Isotope stuff
@$rootScope.runIsotope = ()=>
@$rootScope.isotope_container = angular.element('#cards-wrapper').isotope(
console.log(" OO- Running isotope ")
# Isotope stuff
initIsotope: =>
@$rootScope.isotopeContainer = angular.element('#cards-wrapper')
@$timeout(()=>
@$rootScope.isotopeContainer.isotope(
console.log(" OO- Init isotope ")
itemSelector: '.element'
layoutMode: 'masonry'
)
)
,300
)

refreshIsotopeLayout: =>
@$timeout(()=>
@$rootScope.isotopeContainer.isotope('layout')
,300
)


# Services
services.factory('filerService', ['$rootScope', '$compile', '$fileUploader', 'Restangular','$state', '$stateParams','$http', '$timeout',($rootScope, $compile, $fileUploader, Restangular, $state, $stateParams, $http, $timeout) ->
services.factory('FilerService', ['$rootScope', '$compile', '$fileUploader', 'Restangular','$state', '$stateParams','$http', '$timeout',($rootScope, $compile, $fileUploader, Restangular, $state, $stateParams, $http, $timeout) ->
return new FilerService($rootScope, $compile, $fileUploader, Restangular, $state, $stateParams, $http, $timeout)
])

# Restangular factories
services.factory('Buckets', (Restangular) ->
return Restangular.service('bucket/bucket')
)

services.factory('FileComments', (Restangular) ->
return Restangular.service('bucket/filecomment')
)

services.factory('Files', (Restangular) ->
return Restangular.service('bucket/file')
)


# services.factory('KanbanLists', (Restangular) ->
# return Restangular.service('flipflop/list')
# )

# services.factory('KanbanTasks', (Restangular) ->
# return Restangular.service('flipflop/task')
# )

# services.factory('KanbanCards', (Restangular) ->
# return Restangular.service('flipflop/card')
# )

# services.factory('KanbanCardComments', (Restangular) ->
# return Restangular.service('flipflop/cardcomment')
# )
8 changes: 4 additions & 4 deletions views/file-card.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<!-- TYPE VIDEO XXX: Should not make a difference -->
<article ui-sref-active="previewed" class="vid file item">
<article ui-sref-active="previewed" class="vid file item" isotope-on-load>
<a ui-sref="bucket.file({fileId: file.id})">
<div class="preview">
<img ng-show="file.thumbnail_url" width="240px" ng-src="{{ config.bucket_preview_uri }}{{ file.thumbnail_url }}?width=240" alt="{{ file.name }}" />
<img class="thumbnail" ng-show="file.thumbnail_url" width="240px" ng-src="{{ config.bucket_preview_uri }}{{ file.thumbnail_url }}?width=240" alt="{{ file.name }}" />
<img ng-show="!file.thumbnail_url" width="240px" src="img/_TEMP/defaultfilepreview.jpg" alt="{{ file.name }}" />
</div>
<header>
Expand All @@ -28,8 +28,8 @@ <h1>{{ file.filename }}</h1>
</ul>
<!-- <a href="#" class="seemore">FIXME commentaires</a> -->
<form>
<textarea name="text" ng-model="comment_form.text" placeholder="Ajouter un commentaire"></textarea>
<button ng-click="submitForm()" >Envoyer</button>
<textarea name="text" ng-model="comment_form.text" placeholder="Ajouter un commentaire (min 3 charactères)"></textarea>
<button ng-click="submitNewComment()" >Envoyer</button>
</form>
</section>
<span class="preview-cursor">&nbsp;</span>
Expand Down
79 changes: 31 additions & 48 deletions views/file-list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,59 +57,42 @@

<section id="drive-app" >
<div>

<div id="topbar">
<div id="bucket-name"><h1>{{ bucket.name }}</h1> </div>
<div id="search-block" >
<form>
<angucomplete id="searchField" autocomplete="off" minlength="1" url="{{autocompleteUrl}}"
datafield="objects" titlefield="name" selectedobject="search_form.query" type="text"
pause="300" ng-model="search_form.query" placeholder="Rechercher ou filtrer par label..." />
<button id="search-bt" ng-click="searchFiles()" >Rechercher un fichier</button>
<!-- <button id="label-bt">Rechercher un label</button> -->
</form>
</div>

<div class="actions">
<!--
FIXME <button class="action del">Supprimer</button>
-->
<!--
FIXME <button class="action tools">Options</button>
-->
<!--
FIXME <button class="action fav">Favori</button>
-->

<div id="display-mode">
<!--
FIXME <button class="active" id="display1-bt">Afficher en blocs</button>
-->
<!--
FIXME <button id="display2-bt">Afficher en lignes</button>
-->
</div>
<div id="sort-mode"></div>
</div>
<div id="bucket-name"><h1>{{ bucket.name }}</h1> </div>
<div id="search-block" >
<form>
<angucomplete id="searchField" autocomplete="off" minlength="1" url="{{autocompleteUrl}}"
datafield="objects" titlefield="name" selectedobject="search_form.query" type="text"
pause="300" ng-model="search_form.query" placeholder="Rechercher ou filtrer par label..." />
<button id="search-bt" ng-click="searchFiles()" >Rechercher un fichier</button>
<!-- <button id="label-bt">Rechercher un label</button> -->
</form>
</div>
<div class="actions">
<!--FIXME <button class="action del">Supprimer</button>
FIXME <button class="action tools">Options</button>
FIXME <button class="action fav">Favori</button> -->
<div id="display-mode">
<!--FIXME <button class="active" id="display1-bt">Afficher en blocs</button>
FIXME <button id="display2-bt">Afficher en lignes</button>-->
</div>
<div id="sort-mode"></div>
</div>

<div id="current-labels">
<ul class="labels-list">
<li ng-repeat="tag in selectedTags"><span>{{tag}}</span> <button ng-click="removeTag(tag)">Supprimer</button></li>
</ul>
<!--
FIXME <button class="erase-all">Tout supprimer</button>
-->
</div>

<div id="cards-wrapper">
<ng-include class="element" src="'views/file-card.html'" ng-repeat="file in files" />
</div>
<div id="current-labels">
<ul class="labels-list">
<li ng-repeat="tag in selectedTags"><span>{{tag}}</span>
<button ng-click="removeTag(tag)">Supprimer</button>
</li>
</ul>
<!-- FIXME <button class="erase-all">Tout supprimer</button>-->
</div>
<div id="cards-wrapper">
<ng-include class="element" src="'views/file-card.html'" ng-repeat="file in files" />
</div>
</div>
</div>

<!-- temp: move me! -->
<div id="preview-panel-wrapper" ui-view></div>

</div>

</section>
12 changes: 5 additions & 7 deletions views/file-preview.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,17 +67,15 @@
<section ng-controller="FileCommentCtrl" class="comments">
<ul class="comments-list">
<li ng-repeat=" comment in comments">
<img src="img/_TEMP/emptyavatar.jpg" alt="" />
<strong>{{ comment.submitter.username }}</strong>
<p>
{{ comment.text }}
</p>
<img src="img/_TEMP/emptyavatar.jpg" alt="" />
<strong>{{ comment.submitter.username }}</strong>
<p>{{ comment.text }}</p>
</li>
</ul>
<!--<a href="#" class="seemore">FIXME commentaires</a>-->
<form>
<textarea name="text" ng-model="comment_form.text" placeholder="Ajouter un commentaire"></textarea>
<button type="submit" ng-click="submitForm()" >Envoyer</button>
<textarea name="text" ng-model="comment_form.text" placeholder="Ajouter un commentaire (min 3 charactères)"></textarea>
<button type="submit" ng-click="submitNewComment()" >Envoyer</button>
</form>
</section>
</div>
Expand Down