From 216eca67e97bc6ac5c2616a7f56ea50e20e6639d Mon Sep 17 00:00:00 2001
From: Nicolas Le Goff <legoff.n@gmail.com>
Date: Thu, 6 Sep 2012 11:11:42 +0200
Subject: [PATCH] enhance uploader informations

---
 .../web/prod/upload/upload-flash.html.twig    |  16 +++++++----
 templates/web/prod/upload/upload.html.twig    |  20 +++++++------
 www/skins/icons/html5-logo.jpeg               | Bin 0 -> 755 bytes
 www/skins/icons/logo-flash.png                | Bin 0 -> 2488 bytes
 www/skins/prod/000000/prodcolor.css           |  26 +++++++++++++++++
 www/skins/prod/959595/prodcolor.css           |  27 ++++++++++++++++++
 6 files changed, 75 insertions(+), 14 deletions(-)
 create mode 100644 www/skins/icons/html5-logo.jpeg
 create mode 100644 www/skins/icons/logo-flash.png

diff --git a/templates/web/prod/upload/upload-flash.html.twig b/templates/web/prod/upload/upload-flash.html.twig
index 9e8d4c9ac6..c069066838 100644
--- a/templates/web/prod/upload/upload-flash.html.twig
+++ b/templates/web/prod/upload/upload-flash.html.twig
@@ -24,19 +24,22 @@
 
                     {# <h5 style="margin-top: 10px;">{% trans 'Choose files to add' %} :</h5> #}
                     {# action bar #}
-                    <div id="addFileList">
-                        <div class="btn-toolbar">
+                    <div id="addFileList" class="span5 btn-toolbar row">
+                        <div class="span2  upload-button">
                             <span id="spanSWFUploadButton" class="span2"></span>
                             <br />
-                            <span>
-                                 <a href="/prod/upload/" class="dialog full-dialog" title="{% trans 'Upload' %}"><span class="label label-info"><i>{% trans 'Switch to html5 uploader' %}</i></span></a>
-                            </span>
-                            <br />
                             <span class="comment">
                                 ({% trans %} maximum : {{ maxFileSizeReadable }} {% endtrans %})
                             </span>
                         {#    <button type="button" class="upload-submitter btn btn-inverse input-medium">{% trans 'Send' %}</button> #}
                         </div>
+                        <div class="span1 uploader-icon">
+                            <img src='/skins/icons/logo-flash.png' width="32px" heigh="32px"/>
+                        </div>
+                        <div class="span2 uploader-info">
+                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+                            <a href="/prod/upload/" class="dialog full-dialog" title="{% trans 'Upload' %}">{% trans 'Switch' %}</a>
+                        </div>
                     </div>
 
                     {# settings box #}
@@ -105,6 +108,7 @@
                 </div>
 
                 <div id="uploadBoxRight" class="well">
+                    <h5 style="margin-top: 10px;">{% trans 'Transmited files' %} : </h5>
                     <div class='well-small'>
                         <button id="cancel-all" class="btn disabled" type="button" disabled="disabled">
                             {% trans "Cancel all" %}
diff --git a/templates/web/prod/upload/upload.html.twig b/templates/web/prod/upload/upload.html.twig
index ec6de10628..e9bc101b1e 100644
--- a/templates/web/prod/upload/upload.html.twig
+++ b/templates/web/prod/upload/upload.html.twig
@@ -20,26 +20,30 @@
         <div id="tab-upload">
             <form id="fileupload" enctype="multipart/form-data" method="POST" action="/prod/upload/">
 
-                <div id="uploadBoxLeft" class="well ">
+                <div id="uploadBoxLeft" class="well">
 
                     {# <h5 style="margin-top: 10px;">{% trans 'Choose files to add' %} :</h5> #}
                     {# action bar #}
-                    <div id="addFileList">
-                        <div class="btn-toolbar">
+                    <div id="addFileList" class="span5 btn-toolbar row">
+                        <div class="span2 upload-button">
                             <span class="btn btn-inverse fileinput-button input-medium">
                                 <span>{% trans 'Select files...' %}</span>
                                 <input type="file" name="files[]" multiple>
                             </span>
-                            <br />
-                            <span>
-                                 <a href="/prod/upload/flash-version/" class="dialog full-dialog" title="{% trans 'Upload' %}"><span class="label label-info"><i>{% trans 'Switch to flash uploader' %}</i></span></a>
-                            </span>
-                            <br />
+                                <br />
                             <span class="comment">
                                 ({% trans %} maximum : {{ maxFileSizeReadable }} {% endtrans %})
                             </span>
                         {#    <button type="button" class="upload-submitter btn btn-inverse input-medium">{% trans 'Send' %}</button> #}
                         </div>
+
+                        <div class="span1 uploader-icon" style= "text-align:left;">
+                            <img src='/skins/icons/html5-logo.jpeg' width="32px" heigh="32px"  style='margin:10px auto;'/>
+                        </div>
+                        <div class="span2 uploader-info">
+                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+                            <a href="/prod/upload/flash-version/" class="dialog full-dialog" title="{% trans 'Upload' %}">{% trans 'Switch' %}</a>
+                        </div>
                     </div>
 
                     {# settings box #}
diff --git a/www/skins/icons/html5-logo.jpeg b/www/skins/icons/html5-logo.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..deb6868477c27887ddb6e148dc79e11bbb53d81c
GIT binary patch
literal 755
zcmex=<NpH&0WUXCHwH#V1_nkTWcYuZp@o5yjg5<qm6L;=gNu`si&u<~mxqT}N?1fd
zOkPG&L0(2qPFdYZOIcN4RZdRZT1Vg5)WX6-QOnlR#>~;k+`^QRlZ%U&n^BUFPtsIH
zPQ{cYps8tU`u_lfAP0j2g90<75(ASUBeNjm|04|IKxcv+iU4fvEUZ8YT>%D0W@aX4
zb{1x+93vAm3oDx-gOH-qL3YQ$iHj~iG&BlM6c!N$DwkknV1g-xs0S+t%BTo}3}Rtq
zg<AoX5oBOdWMdaHY!r43Og#Ai76T76&;UW8xIM$lc*Rb$o?kUHGuqNO?08X{sm170
z{x~?}TQ0BOv5;4nO_|PyoQd8Pu+`$R>XPL@PBIkUnNYLk{g!RpZ}+U<D-`@BXnn7|
z*;grDBbik#H*@|oWNulL%q4k1{l(<RtNd&pl}36cv7gP3zO`ZRR<Ao+lRS=9eRO*8
ztz2rF@@}!WJv(_8T05WF5$!bTldQCx@pes>e^*zhZV&#?;5X^koM}gP>h`YRDZ5pX
zHGaW5D`_>+Jss;-*?L9Y<51l)WrE0>0{Qg5-E-%dZ);YpeLZEp!jwNRBX<;5U2a-@
zEaOh(rhC`K1y9u-sSBI^ckj2B);iOLaSN<oJT^6d6tyA6)~DCZ%I(OLshSq&h0Gq*
z+LWAo-1OA%-gMEHccn*)cp4{h*qYiV<rZB_F?tia%sS<P#kD7VmNtj)J3W|^-51$p
z-8Jo`;@vq96eg@}N)~+Uad*;Hr*rcSOSUPlwCPY}R=0S>$KJR7hVPp#i&uZrJzCZA
za<Nd>*VPMK4UUA1%brOwyLLs+Qs&h6%hg5PQ%+Z@gkRoz?czBjK2DXd7q;1ay{}-v
YUMM^(`pB<ns{oHlD?4Wh#{a(w0EhVr;Q#;t

literal 0
HcmV?d00001

diff --git a/www/skins/icons/logo-flash.png b/www/skins/icons/logo-flash.png
new file mode 100644
index 0000000000000000000000000000000000000000..43243e32b186df9e1a4622de870fd51c89358c83
GIT binary patch
literal 2488
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

literal 0
HcmV?d00001

diff --git a/www/skins/prod/000000/prodcolor.css b/www/skins/prod/000000/prodcolor.css
index 6c49dc0e7d..2752ec6f1a 100644
--- a/www/skins/prod/000000/prodcolor.css
+++ b/www/skins/prod/000000/prodcolor.css
@@ -4084,6 +4084,32 @@ dans l'onglet thesaurus : arbres, menus contextuels
     height: 10px;
 }
 
+#uploadBox .uploader-info {
+    text-align:left;
+    font-size:10px;
+    margin:5px 0;
+}
+
+#uploadBox .uploader-icon {
+    text-align:left;
+}
+
+#uploadBox .uploader-icon img{
+    margin:10px auto;
+}
+
+#uploadBox .uploader-info p {
+    line-height:10px;
+    font-size:10px;
+    word-wrap: break-word;
+}
+
+#uploadBox .uploader-info a {
+    text-decoration: underline;
+    color: darkblue;
+    margin:5px 0;
+}
+
 #uploadBoxRight .progress .progress-bar {
     height: 10px;
 }
diff --git a/www/skins/prod/959595/prodcolor.css b/www/skins/prod/959595/prodcolor.css
index 97995c57fe..cdd14a562b 100644
--- a/www/skins/prod/959595/prodcolor.css
+++ b/www/skins/prod/959595/prodcolor.css
@@ -4215,6 +4215,33 @@ dans l'onglet thesaurus :  arbres, menus contextuels
     font-style: normal;
 }
 
+
+#uploadBox .uploader-info {
+    text-align:left;
+    font-size:10px;
+    margin:5px 0;
+}
+
+#uploadBox .uploader-icon {
+    text-align:left;
+}
+
+#uploadBox .uploader-icon img{
+   margin:10px auto;
+}
+
+#uploadBox .uploader-info p {
+    line-height:10px;
+    font-size:10px;
+    word-wrap: break-word;
+}
+
+#uploadBox .uploader-info a {
+    text-decoration: underline;
+    color: darkblue;
+    margin:5px 0;
+}
+
 #uploadBoxRight .progress {
     margin-top: 4px;
     margin-bottom: 10px;