This is an automated email from the git hooks/post-receive script. New commit to branch feature/createPreviewRessource in repository pollen. See http://git.chorem.org/pollen.git commit 7cd7ff9dc920b320551367264a558a2ee7732779 Author: Adrien Garandel <a.garandel@dralagen.fr> Date: Wed Aug 13 14:55:59 2014 +0200 remove spin.js, add font-awesome. add icon for no image picture --- pollen-ui-angular/bower.json | 4 +- pollen-ui-angular/src/main/webapp/index.html | 6 +-- pollen-ui-angular/src/main/webapp/js/directives.js | 47 ++++++++++++++++------ pollen-ui-angular/src/main/webapp/less/style.less | 30 +++++++------- .../src/main/webapp/partials/printResource.html | 16 +++++++- 5 files changed, 68 insertions(+), 35 deletions(-) diff --git a/pollen-ui-angular/bower.json b/pollen-ui-angular/bower.json index 5fdb1e0..b75909f 100644 --- a/pollen-ui-angular/bower.json +++ b/pollen-ui-angular/bower.json @@ -20,9 +20,9 @@ "ckeditor": "4.4.2", "less": "1.7.3", "jqplot-bower": "1.0.8", - "spin.js": "2.0.1", "moment": "2.8.1", - "bootstrap-datetimepicker": "dralagen/bootstrap-datetimepicker#development" + "bootstrap-datetimepicker": "dralagen/bootstrap-datetimepicker#development", + "font-awesome": "4.1.0" }, "devDependencies": { "angular-mocks": "1.2.21" diff --git a/pollen-ui-angular/src/main/webapp/index.html b/pollen-ui-angular/src/main/webapp/index.html index ee23285..ecf2891 100644 --- a/pollen-ui-angular/src/main/webapp/index.html +++ b/pollen-ui-angular/src/main/webapp/index.html @@ -26,7 +26,8 @@ <link rel="stylesheet" type="text/css" href="lib/bootstrap/dist/css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="lib/bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css" /> - <link rel="stylesheet" type="text/css" href="lib/jqplot-bower/dist//jquery.jqplot.min.css" /> + <link rel="stylesheet" type="text/css" href="lib/jqplot-bower/dist/jquery.jqplot.min.css" /> + <link rel="stylesheet" type="text/css" href="lib/font-awesome/css/font-awesome.min.css" /> <!-- TODO : compile less to css $ lessc -x less/style.less css/style.css ou @@ -46,9 +47,6 @@ <script language="javascript" type="text/javascript" src="lib/jqplot-bower/dist//plugins/jqplot.pointLabels.min.js"></script> <script language="javascript" type="text/javascript" src="lib/jqplot-bower/dist//plugins/jqplot.highlighter.min.js"></script> - <script language="javascript" type="text/javascript" src="lib/spin.js/spin.js"></script> - <script language="javascript" type="text/javascript" src="lib/spin.js/jquery.spin.js"></script> - <script language="javascript" type="text/javascript" src="lib/ckeditor/ckeditor.js"></script> <script language="javascript" type="text/javascript" src="lib/angular/angular.min.js"></script> diff --git a/pollen-ui-angular/src/main/webapp/js/directives.js b/pollen-ui-angular/src/main/webapp/js/directives.js index 4adb593..7421341 100644 --- a/pollen-ui-angular/src/main/webapp/js/directives.js +++ b/pollen-ui-angular/src/main/webapp/js/directives.js @@ -485,17 +485,16 @@ angular.module('pollenDirective', []) } scope.isImage = isImage(scope.meta.contentType); - - $(element).find('div').spin(false); } else { - scope.resourceURL = ""; - scope.previewURL = ""; - $(element).find('.preview').spin({ - position:'relative', - top:'32px', - left:'50%' - }); + scope.resourceURL = null; + scope.previewURL = null; + } + }); + + scope.$watch('meta', function(newVal) { + if (angular.isDefined(newVal)) { + scope.isImage = isImage(newVal.contentType); } }); }); @@ -507,13 +506,37 @@ angular.module('pollenDirective', []) }; var isImage = function (type) { - var allTypeAccepted = ["image/jpeg", "image/png", "image/gif"]; + if (type === undefined || type === null) { + scope.meta.class = "fa-spin fa-spinner"; + return false; + } + var allTypeImage = ["image/jpeg", "image/png", "image/gif"]; - for (var i in allTypeAccepted) { - if (allTypeAccepted[i] == type) { + for (var i in allTypeImage) { + if (allTypeImage[i] == type) { return true; } } + + if (type == "application/pdf") { + scope.meta.class = "fa-file-pdf-o"; + } + else if (type == "text/plain") { + scope.meta.class = "fa-file-text-o" + } + else if (type.split("/")[0] == "text") { + scope.meta.class = "fa-file-code-o"; + } + else if (type.split("/")[0] == "audio") { + scope.meta.class = "fa-file-audio-o"; + } + else if (type.split("/")[0] == "video") { + scope.meta.class = "fa-file-video-o"; + } + else { + scope.meta.class = "fa-file-archive-o"; + } + return false; }; diff --git a/pollen-ui-angular/src/main/webapp/less/style.less b/pollen-ui-angular/src/main/webapp/less/style.less index bef8bdf..764d2ae 100644 --- a/pollen-ui-angular/src/main/webapp/less/style.less +++ b/pollen-ui-angular/src/main/webapp/less/style.less @@ -307,17 +307,20 @@ body { .btn-large { height:60px; width:80px; + font-size: 1.5em; } - img { - max-width: @preview-size; - max-height: @preview-size; - } + .preview { + img { + max-width: @preview-size; + max-height: @preview-size; + } - .spinner { - height:64px; - width:150x !important; - z-index:1000 !important; + .fa { + font-size: @preview-size/2; + width: @preview-size/2; + height: @preview-size/2; + } } } } @@ -384,13 +387,6 @@ body { } } -.right-inner-addon .glyphicon-input { - position: absolute; - right: 30px; - top:10px; - pointer-events: none; -} - .fixe-input .ng-hide { display:inline-block !important; visibility:hidden; @@ -525,6 +521,10 @@ label.label-block { color : @help-color; } +.control-group { + margin-top: 5px; +} + footer { position: absolute; right: 0; diff --git a/pollen-ui-angular/src/main/webapp/partials/printResource.html b/pollen-ui-angular/src/main/webapp/partials/printResource.html index 3261fd8..c761212 100644 --- a/pollen-ui-angular/src/main/webapp/partials/printResource.html +++ b/pollen-ui-angular/src/main/webapp/partials/printResource.html @@ -1,5 +1,17 @@ -<div class="preview" ng-if="isImage"><img ng-attr-src="{{previewURL}}" /></div> -<div class="preview" ng-if="!isImage"><a ng-attr-href="{{resourceURL}}"><img ng-attr-src="{{previewURL}}" /></a></div> +<div class="preview" ng-if="isImage && resourceURL"> + <img ng-attr-src="{{previewURL}}" /> +</div> + +<div class="preview" ng-if="!isImage && resourceURL"> + <a ng-attr-href="{{resourceURL}}" target="_blank"> + <span ng-attr-class="fa {{meta.class}}"></span> + </a> +</div> + +<div class="preview" ng-if="!resourceURL"> + <span class="fa fa-spin fa-spinner"></span> +</div> + <div ng-if="isImage && showImage" class="full"> <div class="full-content"> <span>{{meta.name}}</span> -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.