Changeset 29811 for other-projects

Show
Ignore:
Timestamp:
27.03.2015 10:24:28 (4 years ago)
Author:
davidb
Message:

Additional coding so the colour palette choices now feed through to the svg-editor

Location:
other-projects/nz-flag-design/trunk/main-form
Files:
4 modified

Legend:

Unmodified
Added
Removed
  • other-projects/nz-flag-design/trunk/main-form/choose-canvas.html

    r29808 r29811  
    5555    <script type="text/javascript"> 
    5656        // Flag settings - used to initialise the svg canvas to the user's preferences 
    57         var flagCanvasSettings = { backgroundColor: "#000066", width: 800, height: 400 }; 
     57 
     58        var colourPotSwatch = [ "#00247d", "#cc142b", "#ffffff", "#29afaf", "#008000", "#800080", "#ffff15", "#ff6600" ] 
     59        var numColourPots = colourPotSwatch.length; 
     60 
     61 
     62        var flagCanvasSettings = { width: 800, height: 400, 
     63                               backgroundColor: "#000066", 
     64                               colourPots: colourPotSwatch.slice(0,3) 
     65                             }; 
    5866 
    5967 
  • other-projects/nz-flag-design/trunk/main-form/choose-palette.html

    r29808 r29811  
    7676      var activatedColourPalette = false; 
    7777 
    78       var colourPotSwatch = [ "#00247d", "#cc142b", "#ffffff", "#29afaf", "#008000", "#800080", "#ffff15", "#ff6600" ] 
    79       var numColourPots = colourPotSwatch.length; 
    80  
    8178      var selectedColourPot = null; 
    8279      var selectedColourPotID; 
     
    9491            $('#'+selectedColourPickerID).value = colour; 
    9592            $('#'+selectedColourPickerID).spectrum("set",colour); 
     93 
     94       
     95            if (typeof flagCanvasSettings !== 'undefined') { 
     96                var colour_pos_pos = selectedColourPotID.replace("colour-pot"); 
     97                flagCanvasSettings.colourPots[colour_pot_pos] = colour.toHexString(); 
     98        } 
    9699 
    97100            if (selectedColourPotID == "colour-pot0") 
     
    593596        function showColourPots(newValue) 
    594597        {             
     598 
     599            flagCanvasSettings.colourPots = []; 
     600 
    595601        for (var i=0; i<numColourPots; i++) { 
    596602                var circle = "colour-pot" + i; 
    597603            if (i<=newValue) { 
    598                   document.getElementById(circle).style.visibility = 'visible'; 
     604                  var colourPot = document.getElementById(circle); 
     605                  colourPot.style.visibility = 'visible'; 
     606          var colourHexStr = tinycolor(colourPot.style.fill).toHexString(); 
     607 
     608                  flagCanvasSettings.colourPots[i] = colourHexStr; 
    599609        } 
    600610            else { 
  • other-projects/nz-flag-design/trunk/main-form/iterative-design.html

    r29809 r29811  
    278278                        //don't load the previous drawing! 
    279279                        reconfigureSvgCanvas(flagCanvasSettings); 
     280 
     281                    //if (typeof flagCanvasSettings !== 'undefined') { 
     282                setTimeout(function() { 
     283                  console.log("**** design frame = " + design_frame); 
     284                  console.log("**** design frame content window = " + design_frame.contentWindow); 
     285                  design_frame.contentWindow.setSVGEditorColourPalette(flagCanvasSettings); 
     286                }, 500); 
     287 
     288                //} 
    280289                    }); 
    281290                } 
     
    313322                        else {                 
    314323                            reconfigureSvgCanvas(flagCanvasSettings);    
     324                            var design_frame = document.getElementById('design-2d-iframe'); 
     325                    design_frame.contentWindow.setSVGEditorColourPalette(flagCanvasSettings); 
    315326                        } 
    316327                    } 
  • other-projects/nz-flag-design/trunk/main-form/svg-edit-local/extensions/ext-advanced.js

    r29771 r29811  
    101101    } 
    102102} 
     103 
     104 
     105 
     106 
     107function setSVGEditorColourPalette(flagCanvasSettings) { 
     108     
     109    var num_active_colours = flagCanvasSettings.colourPots.length; 
     110    console.log("*** num active colours = " + num_active_colours); 
     111 
     112    $('.palette_item').each( function (index) { 
     113    // Skip the first palette_item, so transparent fill is still an option 
     114    if (index==0) { return true; } // jquery equivalent of continue 
     115 
     116    var colour_index = index-1; 
     117 
     118    if (colour_index<num_active_colours) { 
     119        $(this).show(); 
     120        $(this).css("background-color",flagCanvasSettings.colourPots[colour_index]); 
     121        $(this).attr("data-rgb",flagCanvasSettings.colourPots[colour_index]); 
     122 
     123        if (index==1) { 
     124        $(this).trigger("mousedown"); 
     125        } 
     126    } 
     127    else { 
     128        $(this).hide(); 
     129    } 
     130    }); 
     131 
     132 
     133 
     134    //$('#palette').empty(); 
     135    $('#palette').width(150); 
     136     
     137    return; 
     138 
     139    var str = '<div class="palette_item" data-rgb="none"></div>'; 
     140    $.each(flagCanvasSettings.colourPots, function(i, item) { 
     141    str += '<div class="palette_item" style="background-color: ' + item + ';" data-rgb="' + item + '"></div>'; 
     142    }); 
     143    $('#palette').append(str); 
     144 
     145 
     146            // Prevent selection of elements when shift-clicking 
     147            $('#palette').mouseover(function() { 
     148                var inp = $('<input type="hidden">'); 
     149                $(this).append(inp); 
     150                inp.focus().remove(); 
     151            }); 
     152 
     153            $('.palette_item').mousedown(function(evt) { 
     154                // shift key or right click for stroke 
     155                var picker = evt.shiftKey || evt.button === 2 ? 'stroke' : 'fill'; 
     156                var color = $(this).data('rgb'); 
     157                var paint; 
     158 
     159                // Webkit-based browsers returned 'initial' here for no stroke 
     160                if (color === 'none' || color === 'transparent' || color === 'initial') { 
     161                    color = 'none'; 
     162                    paint = new $.jGraduate.Paint(); 
     163                } else { 
     164                    paint = new $.jGraduate.Paint({alpha: 100, solidColor: color.substr(1)}); 
     165                } 
     166 
     167                //paintBox[picker].setPaint(paint); 
     168                svgCanvas.setColor(picker, color); 
     169 
     170                if (color !== 'none' && svgCanvas.getPaintOpacity(picker) !== 1) { 
     171                    svgCanvas.setPaintOpacity(picker, 1.0); 
     172                } 
     173                //updateToolButtonState(); 
     174            }).bind('contextmenu', function(e) {e.preventDefault();}); 
     175 
     176 
     177}