[PLUGINS] +crayons
[lhc/web/clavette_www.git] / www / plugins / crayons / modeles / uploader_liste.html
diff --git a/www/plugins/crayons/modeles/uploader_liste.html b/www/plugins/crayons/modeles/uploader_liste.html
new file mode 100644 (file)
index 0000000..4a11ae5
--- /dev/null
@@ -0,0 +1,112 @@
+<style>
+.uploader {border:solid red 1px;}
+.uploader.hover {border:dotted red 1px;}
+.uploader li {border solid transparent 3px; padding-left:10px}
+.uploader li.loading {border:dotted red 3px;}
+.uploader li.ok {border:solid green 3px;}
+
+#uploader#ID_ARTICLE {
+       position: absolute;
+       top: 10px;
+       right: -180px;
+       width: 170px;
+       height: 100%;
+       max-height: 600px;
+       overflow: auto;
+       overflow-x: hidden;
+       background: #eee;
+       border: solid #ccc 1px;
+}
+
+#uploader#ID_ARTICLE.ferme {
+       width: 30px; height: 15px; overflow-x:hide;overflow-y:hide;overflow:hide;
+}
+</style>
+
+
+<div id="uploader#ID_ARTICLE" class="ferme">
+<i>Glissez un document ou une image dans cette zone pour l'ajouter à l'article.</i>
+
+<ul id="uploader_liste" >
+<BOUCLE_d(DOCUMENTS){tous}{id_article}{!par id_document}{0,10}>
+<li>#MODELE{uploader_item,id_document}</li>
+</BOUCLE_d>
+[<li class="pagination">(#PAGINATION)</li>]
+</B_d>
+</ul>
+
+
+</div>
+
+<!--
+/*
+
+$(function(){
+       var fileTemplate="<div id=\"{{id}}\">";
+       fileTemplate+="<div class=\"progressbar\"></div>";
+       fileTemplate+="<div class=\"preview\"></div>";
+       fileTemplate+="<div class=\"filename\">{{filename}}</div>";
+       fileTemplate+="</div>";
+       function slugify(text){
+               text=text.replace(/[^-a-zA-Z0-9,&\s]+/ig,'');
+               text=text.replace(/-/gi,"_");
+               text=text.replace(/\s/gi,"-");
+               return text;
+       }
+
+       $("#dropbox")
+       .html5Uploader({
+               onClientLoadStart:function(e,file){
+                       var upload=$("#upload");
+                       if(upload.is(":hidden")){
+                               upload.show();
+                       }
+                       upload.append(
+                               fileTemplate
+                                       .replace(/{{id}}/g, slugify(file.name))
+                                       .replace(/{{filename}}/g,file.name)
+                       );
+               },
+               onClientLoad:function(e,file){
+                       $("#"+slugify(file.name))
+                       .find(".preview")
+                       .append("<img src=\""+e.target.result+"\" alt=\"\">");
+               },
+               onServerLoadStart:function(e,file){
+                       $("#"+slugify(file.name))
+                       .find(".progressbar")
+                       .progressbar({value:0});
+               },
+               onServerProgress:function(e,file){
+                       if(e.lengthComputable){
+                               var percentComplete=(e.loaded/e.total)*100;
+                               $("#"+slugify(file.name))
+                               .find(".progressbar")
+                                       .progressbar({value:percentComplete});
+                       }
+               },
+               onServerLoad:function(e,file){
+                       $("#"+slugify(file.name))
+                       .find(".progressbar")
+                               .progressbar({value:100});
+               }
+       });
+
+       $(".download")
+       .mousedown(function(){
+               $(this).css({
+                       "background-image":"url('images/download-clicked.png')"
+               });
+       })
+       .mouseup(function(){
+               $(this).css({
+                       "background-image":"url('images/download.png')"
+               });
+       });
+
+
+});
+
+
+*/
+-->
\ No newline at end of file