source: spip-zone/_squelettes_/oswd/3626_multiflex-3/fonds/cfg_multiflex_couleurs.html @ 18668

Last change on this file since 18668 was 18668, checked in by marcimat@…, 11 years ago
  • utiliser l'écriture <!-- dans les fonds CFG et prendre en compte la syntaxe des liens "prefixe:nom" dans ces mêmes fonds, permettant de se passer du fichier /lang/local_fr.php
  • nécessite cfg 1.3.5
File size: 12.0 KB
Line 
1<!-- titre=<:multiflex:configuration_multiflex:> -->
2
3<!--  autoriser=webmestre -->
4
5<!--  refus=Seuls les webmestres du site sont autoris&#233;s &#224;
6modifier ces param&#232;tres. Pour en savoir plus,
7voir <a href="http://www.spip-contrib.net/-Autorite-">la documentation</a>. -->
8
9<!-- descriptif=
10<h4>Configuration du Squelette Multiflex</h4>
11-->
12<!--  onglet=non -->
13
14<!--  liens*=multiflex:multiflex_general -->
15<!--  liens*=multiflex:multiflex_layouts -->
16<!--  liens*=multiflex:multiflex_navigation -->
17
18<!--  nom=multiflex -->
19<!--  casier=couleurs -->
20
21#CACHE{0}
22
23
24<script language="javascript" type="text/javascript"><!--
25
26function hexdec(h){
27        return parseInt(h, 16);
28}
29
30function dechex(d){
31        return Math.round(d).toString(16);
32}
33
34function couleur_rvb(hex){
35        hex = hex.replace("#","");
36        couleur = new Array();
37
38        if (hex.length==6){
39                couleur['r'] = hex.substr(0,2);
40                couleur['v'] = hex.substr(2,2);
41                couleur['b'] = hex.substr(4,2);
42        } else if (hex.length==3){
43                couleur['r'] = hex.substr(0,1).concat(hex.substr(0,1));
44                couleur['v'] = hex.substr(1,1).concat(hex.substr(1,1));
45                couleur['b'] = hex.substr(2,1).concat(hex.substr(2,1));         
46        } else {
47                /* blanc */
48                couleur['r'] = couleur['v'] = couleur['b'] = 'ff';
49        }
50       
51        /* en decimal */
52        couleur['r'] = hexdec(couleur['r']);
53        couleur['v'] = hexdec(couleur['v']);
54        couleur['b'] = hexdec(couleur['b']);
55       
56        return couleur;
57}
58
59function couleur_hex(dec){
60        var hex = new Array();
61        hex['r'] = dechex(dec['r']);
62        hex['v'] = dechex(dec['v']);
63        hex['b'] = dechex(dec['b']);   
64
65        if (hex['r'] == '0') { hex['r'] = '00';}
66        if (hex['v'] == '0') { hex['v'] = '00';}
67        if (hex['b'] == '0') { hex['b'] = '00';}
68       
69        return '#' + hex['r'] + hex['v'] + hex['b'];   
70}
71
72function calculer_couleur(base, kr, kv, kb){
73
74        rvb = couleur_rvb(base);
75       
76        /* calculs */
77        if ((rvb['r'] == 255) && (rvb['v'] == 255) && (rvb['b'] == 255)) 
78                {return '#ffffff';}
79        if ((rvb['r'] == 0) && (rvb['v'] == 0) && (rvb['b'] == 0)) 
80                {return '#000000';}
81       
82       
83        if (kr >  1) kr =  1;
84        if (kr < -1) kr = -1;
85        if (kv >  1) kv =  1;
86        if (kv < -1) kv = -1;
87        if (kb >  1) kb =  1;
88        if (kb < -1) kb = -1;
89       
90        if (kr>=0) 
91                {rvb['r'] = rvb['r'] + kr * (255-rvb['r']);}
92        else
93                {rvb['r'] = rvb['r'] + kr * rvb['r'];}
94       
95        if (kv>=0) 
96                {rvb['v'] = rvb['v'] + kv * (255-rvb['v']);}
97        else
98                {rvb['v'] = rvb['v'] + kv * rvb['v'];}
99       
100        if (kb>=0) 
101                {rvb['b'] = rvb['b'] + kb * (255-rvb['b']);}
102        else
103                {rvb['b'] = rvb['b'] + kb * rvb['b'];} 
104
105        if (rvb['r']>255) rvb['r']=255;
106        if (rvb['v']>255) rvb['v']=255;
107        if (rvb['b']>255) rvb['b']=255;
108       
109        if (rvb['r']<0) rvb['r']=0;
110        if (rvb['v']<0) rvb['v']=0;
111        if (rvb['b']<0) rvb['b']=0;
112       
113        return couleur_hex(rvb);       
114}
115
116function trouver_couleur(type, kr, kb, kv){
117        var base;
118        if (type=='dominante'){base = '#cccccc';}
119        if (type=='generale') {base = '#f6f6f6';}
120       
121        if (!kr && kr !== 0) {kr = parseFloat($("#mfx_coef_rouge").attr('value'));}
122        if (!kv && kv !== 0) {kv = parseFloat($("#mfx_coef_vert").attr('value'));}
123        if (!kb && kb !== 0) {kb = parseFloat($("#mfx_coef_bleu").attr('value'));}
124       
125       
126        /*kv = parseFloat($("#mfx_coef_vert").attr('value'));
127        kb = parseFloat($("#mfx_coef_bleu").attr('value'));*/
128       
129        return calculer_couleur(base, kr, kv, kb);
130}
131
132jQuery(document).ready(function() {
133       
134        /* ------- INIT -------- */
135        $("#mfx_dominante_ori").
136                css('background-color', trouver_couleur('dominante',0,0,0));
137        $("#mfx_generale_ori").
138                css('background-color', trouver_couleur('generale',0,0,0));
139        $("#mfx_dominante_now, #mfx_dominante_new").
140                css('background-color', trouver_couleur('dominante'));
141        $("#mfx_generale_now, #mfx_generale_new").
142                css('background-color', trouver_couleur('generale'));
143       
144        /* ------- SUR CHANGEMENTS -------- */
145        $(".def_couleurs input").keyup(function(){
146                $(this).parent().next().next().next().css('background-color', '#'+this.value);
147        });     
148        $(".def_couleurs input").change(function(){
149                $(this).parent().next().next().next().css('background-color', '#'+this.value);
150        });     
151        $(".def_teintes input").keyup(function(){
152                $("#mfx_dominante_new").
153                        css('background-color', trouver_couleur('dominante'));
154                $("#mfx_generale_new").
155                        css('background-color', trouver_couleur('generale'));   
156        });                     
157        $(".def_teintes input").change(function(){
158                if(this.value>1)  {this.value=1};
159                if(this.value<-1) {this.value=-1};
160                $("#mfx_dominante_new").
161                        css('background-color', trouver_couleur('dominante'));
162                $("#mfx_generale_new").
163                        css('background-color', trouver_couleur('generale'));                   
164        });
165       
166       
167});
168--></script>
169
170<style type="text/css"><!--
171table.def td{padding-left:1em; padding-right:1em;}
172--></style>
173
174<form method="post" action="#SELF">
175<div>
176<div>[(#ENV{_cfg_}|form_hidden)]</div>
177
178<br />
179
180<fieldset class="cadre"><legend><:multiflex:couleur_liens:></legend>
181        <table class="def def_couleurs">
182                <thead>
183                <tr>
184                    <th></th>
185                    <th><:multiflex:valeur:></th>
186                    <th><:multiflex:couleur_origine:></th>
187                    <th><:multiflex:couleur_actuelle:></th>
188                    <th><:multiflex:nouvelle_couleur:></th>
189                   
190                </tr>           
191                </thead>
192                <tbody>
193                <tr>
194                    <th><label for="mfx_couleur_liens"><:multiflex:couleur_liens:></label></th>
195                    <td><input type="text" name="liens" id="mfx_couleur_liens" value="#ENV{liens}" size="6" class="fondl"/></td>
196                    <td style="background-color:#467aa7;">467aa7</td>
197                    <td style="background-color:#[(#ENV{liens}|sinon{467AA7})]">[(#ENV{liens}|sinon{467AA7})]</td>
198                    <td id="case_couleur_liens" style="background-color:#[(#ENV{liens}|sinon{467AA7})]"></td>
199                </tr>
200                <tr>
201                    <th><label for="mfx_couleur_liens"><:multiflex:couleur_liens_survoles:></label></th>
202                    <td><input type="text" name="liens_survoles" id="mfx_couleur_liens_survoles" value="#ENV{liens_survoles}" size="6" class="fondl" /></td>
203                    <td style="background-color:#2a5a8a;">2a5a8a</td>
204                    <td style="background-color:#[(#ENV{liens_survoles}|sinon{2A5A8A})]">[(#ENV{liens_survoles}|sinon{2A5A8A})]</td>
205                    <td id="case_couleur_liens_survoles" style="background-color:#[(#ENV{liens_survoles}|sinon{2A5A8A})]"></td>
206                </tr>
207            </tbody>
208        </table>
209</fieldset>
210
211</br>
212
213
214<fieldset class="cadre"><legend><:multiflex:blocs:></legend>
215        <table class="def def_couleurs">
216                <thead>
217                <tr>
218                    <th></th>
219                    <th><:multiflex:valeur:></th>
220                    <th><:multiflex:couleur_origine:></th>
221                    <th><:multiflex:couleur_actuelle:></th>
222                    <th><:multiflex:nouvelle_couleur:></th>
223                   
224                </tr>           
225                </thead>
226                <tbody>
227                <tr>
228                    <th><label for="mfx_couleur_bloc_vert_titre"><:multiflex:couleur_bloc_vert_titre:></label></th>
229                    <td><input type="text" name="bloc_vert_titre" id="mfx_couleur_bloc_vert_titre" value="#ENV{bloc_vert_titre}" size="6" class="fondl" /></td>
230                    <td style="background-color:#a0d651;">a0d651</td>
231                    <td style="background-color:#[(#ENV{bloc_vert_titre}|sinon{a0d651})]">[(#ENV{bloc_vert_titre}|sinon{a0d651})]</td>
232                    <td id="case_couleur_bloc_vert_titre" style="background-color:#[(#ENV{bloc_vert_titre}|sinon{a0d651})]"></td>
233                </tr>
234                <tr>
235                    <th><label for="mfx_couleur_bloc_vert_fond"><:multiflex:couleur_bloc_vert_fond:></label></th>
236                    <td><input type="text" name="bloc_vert_fond" id="mfx_couleur_bloc_vert_fond" value="#ENV{bloc_vert_fond}" size="6" class="fondl" /></td>
237                    <td style="background-color:#d9efb9;">d9efb9</td>
238                    <td style="background-color:#[(#ENV{bloc_vert_fond}|sinon{d9efb9})]">[(#ENV{bloc_vert_fond}|sinon{d9efb9})]</td>
239                    <td id="case_couleur_bloc_vert_fond" style="background-color:#[(#ENV{bloc_vert_fond}|sinon{d9efb9})]"></td>
240                </tr>
241               
242                <tr><td colspan="5">&nbsp;</td></tr>
243                <tr>
244                    <th><label for="mfx_couleur_bloc_bleu_titre"><:multiflex:couleur_bloc_bleu_titre:></label></th>
245                    <td><input type="text" name="bloc_bleu_titre" id="mfx_couleur_bloc_bleu_titre" value="#ENV{bloc_bleu_titre}" size="6" class="fondl" /></td>
246                    <td style="background-color:#89aad6;">89aad6</td>
247                    <td style="background-color:#[(#ENV{bloc_bleu_titre}|sinon{89aad6})]">[(#ENV{bloc_bleu_titre}|sinon{89aad6})]</td>
248                    <td id="case_couleur_bloc_bleu_titre" style="background-color:#[(#ENV{bloc_bleu_titre}|sinon{89aad6})]"></td>
249                </tr>
250                <tr>
251                    <th><label for="mfx_couleur_bloc_bleu_fond"><:multiflex:couleur_bloc_bleu_fond:></label></th>
252                    <td><input type="text" name="bloc_bleu_fond" id="mfx_couleur_bloc_bleu_fond" value="#ENV{bloc_bleu_fond}" size="6" class="fondl" /></td>
253                    <td style="background-color:#d5e1f0;">d5e1f0</td>
254                    <td style="background-color:#[(#ENV{bloc_bleu_fond}|sinon{d5e1f0})]">[(#ENV{bloc_bleu_fond}|sinon{d5e1f0})]</td>
255                    <td id="case_couleur_bloc_bleu_fond" style="background-color:#[(#ENV{bloc_bleu_fond}|sinon{d5e1f0})]"></td>
256                </tr>
257               
258                <tr><td colspan="5">&nbsp;</td></tr>
259                <tr>
260                    <th><label for="mfx_couleur_bloc_orange_titre"><:multiflex:couleur_bloc_orange_titre:></label></th>
261                    <td><input type="text" name="bloc_orange_titre" id="mfx_couleur_bloc_orange_titre" value="#ENV{bloc_orange_titre}" size="6" class="fondl" /></td>
262                    <td style="background-color:#e8b10d;">e8b10d</td>
263                    <td style="background-color:#[(#ENV{bloc_orange_titre}|sinon{e8b10d})]">[(#ENV{bloc_orange_titre}|sinon{e8b10d})]</td>
264                    <td id="case_couleur_bloc_orange_titre" style="background-color:#[(#ENV{bloc_orange_titre}|sinon{e8b10d})]"></td>
265                </tr>
266                <tr>
267                    <th><label for="mfx_couleur_bloc_orange_fond"><:multiflex:couleur_bloc_orange_fond:></label></th>
268                    <td><input type="text" name="bloc_orange_fond" id="mfx_couleur_bloc_orange_fond" value="#ENV{bloc_orange_fond}" size="6" class="fondl" /></td>
269                    <td style="background-color:#f8e096;">f8e096</td>
270                    <td style="background-color:#[(#ENV{bloc_orange_fond}|sinon{f8e096})]">[(#ENV{bloc_orange_fond}|sinon{f8e096})]</td>
271                    <td id="case_couleur_bloc_orange_fond" style="background-color:#[(#ENV{bloc_orange_fond}|sinon{f8e096})]"></td>
272                </tr>
273            </tbody>
274        </table>
275</fieldset>
276
277</br>
278
279<fieldset class="cadre"><legend><:multiflex:teintes:></legend>
280        <table class="def def_teintes">
281                <thead>
282                <tr>
283                    <th></th>
284                    <th><label for="mfx_coef_rouge"><:multiflex:rouge:></label></th>
285                    <th><label for="mfx_coef_vert"><:multiflex:vert:></label></th>
286                    <th><label for="mfx_coef_bleu"><:multiflex:bleu:></label></th>   
287                </tr>           
288                </thead>
289                <tbody>
290                <tr>
291                    <th><:multiflex:coefficients_teinte:></label></th>
292                    <td><input type="text" name="coef_rouge" id="mfx_coef_rouge" value="#ENV{coef_rouge}" size="4" class="fondl"/></td>
293                    <td><input type="text" name="coef_vert" id="mfx_coef_vert" value="#ENV{coef_vert}" size="4" class="fondl"/></td>
294                    <td><input type="text" name="coef_bleu" id="mfx_coef_bleu" value="#ENV{coef_bleu}" size="4" class="fondl"/></td>
295
296                </tr>
297            </tbody>
298            <tfoot>
299                <tr>
300                        <th></th>
301                    <th><:multiflex:couleur_origine:></th>
302                    <th><:multiflex:couleur_actuelle:></th>
303                    <th><:multiflex:nouvelle_couleur:></th>
304                </tr>
305                <tr>
306                        <th><:multiflex:dominante:></th>
307                    <td id="mfx_dominante_ori"></td>
308                    <td id="mfx_dominante_now"></td>
309                    <td id="mfx_dominante_new"></td>           
310                </tr>           
311                <tr>
312                        <th><:multiflex:generale:></th>
313                    <td id="mfx_generale_ori"></td>
314                    <td id="mfx_generale_now"></td>
315                    <td id="mfx_generale_new"></td>             
316                </tr>
317            </tfoot>
318        </table>
319</fieldset>
320
321
322<div>
323<input type="submit" name="_cfg_ok" value="<:oK:>" class="fondo" />
324<input type="reset" value="<:reset:>" class="fondo" />
325<input type="submit" name="_cfg_delete" value="<:supprimer:>" class="fondo" />
326</div>
327</div>
328</form>
329
330
Note: See TracBrowser for help on using the repository browser.