/[colormatch]/trunk/index.php
This is repository of my old source code which isn't updated any more. Go to git.rot13.org for current projects!
ViewVC logotype

Diff of /trunk/index.php

Parent Directory Parent Directory | Revision Log Revision Log | View Patch Patch

revision 1 by dpavlin, Sat Oct 2 23:24:01 2004 UTC revision 3 by dpavlin, Sat Oct 2 23:39:42 2004 UTC
# Line 194  width: 760px; Line 194  width: 760px;
194  }  }
195  </style>  </style>
196    
197    <script type="text/javascript" src="hide.js"></script>
198  <script type="text/javascript" src="range.js"></script>  <script type="text/javascript" src="range.js"></script>
199  <script type="text/javascript" src="timer.js"></script>  <script type="text/javascript" src="timer.js"></script>
200  <script type="text/javascript" src="slider.js"></script>  <script type="text/javascript" src="slider.js"></script>
# Line 201  width: 760px; Line 202  width: 760px;
202  </head>  </head>
203  <body>  <body>
204  <div id="sitewidth">  <div id="sitewidth">
 <div id="news">  
         <h1>ColorMatch Remix</h1>  
         <p>This colorpicker is based heavily upon the code from <a href="http://colormatch.dk">ColorMatch 5k</a>. I've made it more compatible - it now works in Mozilla, and should also work in Opera, since I'm using a much better slider control. I've also added 3 more colors, bringing the total auto-generated colors to 9, and the ability to export your colors to a Photoshop color table.</p>  
         <p>You can also download the full source code <a href="colormatch.zip" title="Source Code">here.</a></p>  
         <p><b>What's New:</b></p>  
         <ul>  
                 <li>Jun. 12, 2004: Fixed a text export bug (finally!), added CMYK output, and the ability to bookmark colors. Also added colors to the dropdown theme list. Zipfile updated.</li>  
                 <li>Feb. 01, 2004: Added Sample Page rendering, cleaned up code, added config file.</li>  
                 <li>Jan. 29, 2004: Woo! <a href="http://zeldman.com" title="The Daily Report">Jeffrey Zeldman</a> has linked to this! Sweet!</li>  
                 <li>Jan. 23, 2004: <a href="http://hlrnet.com" title="Hans' site">Hans Le Roy</a> has put up a mirror of <a href="http://hlrnet.com/colormatch/" title="multilingual!">ColorMatch Remix</a>, with 3 translations - Spanish, French, and Dutch.</li>  
                 <li>Jan. 19, 2004: I've <a href="colormatch.zip" title="Everything you need.">zipped up</a> all the code, along with a dump of the database, for those of you who'd like to run it on your own server. All I request is that you link back to my main page.</li>  
                 <li>Dec. 06, 2003: This site featured in Lockergnome's <a href="http://channels.lockergnome.com/windows/backissues/20031205.phtml">Windows Fanatics</a> newsletter! (Thanks for the link, Chris!) </li>  
         </ul>  
         <form id="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">  
                 <p>  
                         <input type="hidden" name="cmd" value="_xclick" />  
                         <input type="hidden" name="business" value="twyst@twysted.net" />  
                         <input type="hidden" name="no_note" value="1" />  
                         <input type="hidden" name="currency_code" value="USD" />  
                         <input type="hidden" name="tax" value="0" />  
                         <input type="image" src="https://www.paypal.com/en_US/i/btn/x-click-but21.gif" name="submit" alt="Make payments with PayPal - it's fast, free and secure!" />  
                 </p>  
         </form>  
 </div>  
205  <div id="allsliders">  <div id="allsliders">
206          <div class="spacer"></div>          <div class="spacer"></div>
207          <div id="slideleft">          <div id="slideleft">
# Line 253  width: 760px; Line 230  width: 760px;
230                  </div>                  </div>
231          </div>          </div>
232          <div id="slideright">          <div id="slideright">
233                  <div id="color-result"></div>                  <div id="color-result">
234                    <div style="float: left; width: 49%; text-align: center;" id="light" onClick="c2r('light');">
235                    light
236                    </div>
237                    <div style="float: right; width: 49%; text-align: center;" id="dark" onClick="c2r('dark');">
238                    dark
239                    </div>
240                    </div>
241          </div>          </div>
242          <div class="spacer"></div>          <div class="spacer"></div>
243  </div>  </div>
# Line 302  width: 760px; Line 286  width: 760px;
286                          <select id="coltheme" name="coltheme" onchange="load_theme();">                          <select id="coltheme" name="coltheme" onchange="load_theme();">
287          <?          <?
288                  include("config.php");                  include("config.php");
289                  $db = mysql_connect($dbhost,$dbuser,$dbpass);                  $db = pg_connect($pg);
                 mysql_select_db($dbtable);  
290                  $rgb = "$red,$green,$blue";                  $rgb = "$red,$green,$blue";
291                  $r = mysql_query("Select basecol,name from colorpick where approved='1' order by name");                  $r = pg_query("select basecol,name from colorpick where approved='1' order by name");
292                  while ($q = mysql_fetch_assoc($r)) {                  while ($q = pg_fetch_assoc($r)) {
293                          if($q["basecol"] == $rgb) {                          if($q["basecol"] == $rgb) {
294                                  $sel = "selected=\"selected\" ";                                  $sel = "selected=\"selected\" ";
295                          } else {                          } else {
# Line 333  width: 760px; Line 316  width: 760px;
316          </div>          </div>
317          <div class="spacer"></div>          <div class="spacer"></div>
318  </div>  </div>
319    
320    <a href="#" onClick="javascript:toggle_display('news',1);">site news</a>
321    <div id="news" style="display: none;">
322            <h1>ColorMatch Remix</h1>
323            <p>This colorpicker is based heavily upon the code from <a href="http://colormatch.dk">ColorMatch 5k</a>. I've made it more compatible - it now works in Mozilla, and should also work in Opera, since I'm using a much better slider control. I've also added 3 more colors, bringing the total auto-generated colors to 9, and the ability to export your colors to a Photoshop color table.</p>
324            <p>You can also download the full source code <a href="colormatch.zip" title="Source Code">here.</a></p>
325            <p><b>What's New:</b></p>
326            <ul>
327                    <li>Oct. 03, 2004: First modification by Dobrica Pavlinusic: lighter and darker selections, speedup using getElementById cache</li>
328                    <li>Jun. 12, 2004: Fixed a text export bug (finally!), added CMYK output, and the ability to bookmark colors. Also added colors to the dropdown theme list. Zipfile updated.</li>
329                    <li>Feb. 01, 2004: Added Sample Page rendering, cleaned up code, added config file.</li>
330                    <li>Jan. 29, 2004: Woo! <a href="http://zeldman.com" title="The Daily Report">Jeffrey Zeldman</a> has linked to this! Sweet!</li>
331                    <li>Jan. 23, 2004: <a href="http://hlrnet.com" title="Hans' site">Hans Le Roy</a> has put up a mirror of <a href="http://hlrnet.com/colormatch/" title="multilingual!">ColorMatch Remix</a>, with 3 translations - Spanish, French, and Dutch.</li>
332                    <li>Jan. 19, 2004: I've <a href="colormatch.zip" title="Everything you need.">zipped up</a> all the code, along with a dump of the database, for those of you who'd like to run it on your own server. All I request is that you link back to my main page.</li>
333                    <li>Dec. 06, 2003: This site featured in Lockergnome's <a href="http://channels.lockergnome.com/windows/backissues/20031205.phtml">Windows Fanatics</a> newsletter! (Thanks for the link, Chris!) </li>
334            </ul>
335    </div>
336    
337  <p class="footer">  <p class="footer">
338          Based on <a href="http://colormatch.dk">ColorMatch 5K</a> by Kim Jensen. | Modified by <a href="http://twysted.net">Twyst</a> (mail: twyst AT twysted dot net)<br />          Based on <a href="http://colormatch.dk">ColorMatch 5K</a> by Kim Jensen. | Modified by <a href="http://twysted.net">Twyst</a> (mail: twyst AT twysted dot net) and <a href="http://www.rot13.org/~dpavlin/">Dobrica Pavlinusic</a> (mail: dpavlin AT rot13 dot org)<br />
339          This page validates as <a href="http://validator.w3.org/check/referer">XHTML 1.0 transitional.</a>          This page validates as <a href="http://validator.w3.org/check/referer">XHTML 1.0 transitional.</a>
340  </p>  </p>
341    
# Line 344  width: 760px; Line 345  width: 760px;
345    
346    
347  // init code  // init code
348  var r = new Slider(document.getElementById("red-slider"), document.getElementById("red-slider-input"));  var r = new Slider(element_id("red-slider"), document.getElementById("red-slider-input"));
349  r.setMaximum(255);  r.setMaximum(255);
350  var g = new Slider(document.getElementById("green-slider"), document.getElementById("green-slider-input"));  var g = new Slider(element_id("green-slider"), document.getElementById("green-slider-input"));
351  g.setMaximum(255);  g.setMaximum(255);
352  var b = new Slider(document.getElementById("blue-slider"), document.getElementById("blue-slider-input"));  var b = new Slider(element_id("blue-slider"), document.getElementById("blue-slider-input"));
353  b.setMaximum(255);  b.setMaximum(255);
354    
355  var ri = document.getElementById("red-input");  var ri = element_id("red-input");
356  ri.onchange = function () {  ri.onchange = function () {
357          r.setValue(parseInt(this.value));          r.setValue(parseInt(this.value));
358  };  };
359    
360  var gi = document.getElementById("green-input");  var gi = element_id("green-input");
361  gi.onchange = function () {  gi.onchange = function () {
362          g.setValue(parseInt(this.value));          g.setValue(parseInt(this.value));
363  };  };
364    
365  var bi = document.getElementById("blue-input");  var bi = element_id("blue-input");
366  bi.onchange = function () {  bi.onchange = function () {
367          b.setValue(parseInt(this.value));          b.setValue(parseInt(this.value));
368  };  };
369    
370  r.onchange = g.onchange = b.onchange = function () {  r.onchange = g.onchange = b.onchange = function () {
371          var cr = document.getElementById("color-result");          var cr = element_id("color-result");
372          cr.style.backgroundColor = "rgb(" + r.getValue() + "," + g.getValue() + "," + b.getValue() + ")";          cr.style.backgroundColor = "rgb(" + r.getValue() + "," + g.getValue() + "," + b.getValue() + ")";
373          rg.r = ri.value = r.getValue();          rg.r = ri.value = r.getValue();
374          rg.g = gi.value = g.getValue();          rg.g = gi.value = g.getValue();
# Line 405  function fixSize() { Line 406  function fixSize() {
406          b.recalculate();          b.recalculate();
407  }  }
408    
409    var step = 8;
410    
411    function inc(n) {
412            if (n + step < 255) {
413                    n += step;
414            } else {
415                    n = 255;
416            }
417            return n;
418    }
419    
420    function dec(n) {
421            if (n - step > 0) {
422                    n -= step;
423            } else {
424                    n = 0;
425            }
426            return n;
427    }
428    
429    function light() {
430            r.setValue( inc( r.getValue() ) );
431            g.setValue( inc( g.getValue() ) );
432            b.setValue( inc( b.getValue() ) );
433    }
434    
435    function dark() {
436            r.setValue( dec( r.getValue() ) );
437            g.setValue( dec( g.getValue() ) );
438            b.setValue( dec( b.getValue() ) );
439    }
440    
441    
442  window.onresize = fixSize;  window.onresize = fixSize;
443    
444  fixSize();  fixSize();
Legend:
Removed from v.1  
changed lines
  Added in v.3
  ViewVC Help
Powered by ViewVC 1.1.26