mozilla

Compare Revisions

Linear-gradient Generator

Change Revisions

Revision 479527:

Revision 479527 by gabriel_ivanica on

Revision 479611:

Revision 479611 by gabriel_ivanica on

Title:
Linear-gradient Generator
Linear-gradient Generator
Slug:
Web/CSS/Tools/Linear-gradient_Generator
Web/CSS/Tools/Linear-gradient_Generator
Tags:
"CSS", "Tools"
Content:

Revision 479527
Revision 479611
nn1070 
n1331                if (H >= 0 && H < 1) {    this.setRn1332                if (H >= 0 && H < 1) {  this.setRGB
>GBA(C, X, m);  return; }>A(C, X, m);  return; }
1332                if (H >= 1 && H < 2) {    this.setR1333                if (H >= 1 && H < 2) {  this.setRGB
>GBA(X, C, m);  return; }>A(X, C, m);  return; }
1333                if (H >= 2 && H < 3) {    this.setR1334                if (H >= 2 && H < 3) {  this.setRGB
>GBA(m, C, X);  return; }>A(m, C, X);  return; }
1334                if (H >= 3 && H < 4) {    this.setR1335                if (H >= 3 && H < 4) {  this.setRGB
>GBA(m, X, C);  return; }>A(m, X, C);  return; }
1335                if (H >= 4 && H < 5) {    this.setR1336                if (H >= 4 && H < 5) {  this.setRGB
>GBA(X, m, C);  return; }>A(X, m, C);  return; }
1336                if (H >= 5 && H < 6) {    this.setR1337                if (H >= 5 && H < 6) {  this.setRGB
>GBA(C, m, X);  return; }>A(C, m, X);  return; }
n1352                if (H >= 0 && H < 1) {    this.setRn1353                if (H >= 0 && H < 1) {  this.setRGB
>GBA(C, X, m);  return; }>A(C, X, m);  return; }
1353                if (H >= 1 && H < 2) {    this.setR1354                if (H >= 1 && H < 2) {  this.setRGB
>GBA(X, C, m);  return; }>A(X, C, m);  return; }
1354                if (H >= 2 && H < 3) {    this.setR1355                if (H >= 2 && H < 3) {  this.setRGB
>GBA(m, C, X);  return; }>A(m, C, X);  return; }
1355                if (H >= 3 && H < 4) {    this.setR1356                if (H >= 3 && H < 4) {  this.setRGB
>GBA(m, X, C);  return; }>A(m, X, C);  return; }
1356                if (H >= 4 && H < 5) {    this.setR1357                if (H >= 4 && H < 5) {  this.setRGB
>GBA(X, m, C);  return; }>A(X, m, C);  return; }
1357                if (H >= 5 && H < 6) {    this.setR1358                if (H >= 5 && H < 6) {  this.setRGB
>GBA(C, m, X);  return; }>A(C, m, X);  return; }
nn1974 * UI-DropDown Select
1975 */
1976 
1977var DropDownManager = (function DropdownManager() {
1978        'use strict';
1979 
1980        var subscribers = {};
1981        var dropdowns = [];
1982        var active = null;
1983 
1984        var visbility = ["hidden", "visible"];
1985 
1986        var DropDown = function DropDown(node) {
1987                var topic = node.getAttribute('data-topic');
1988                var label = node.getAttribute('data-label');
1989                var selected = node.getAttribute('data-selected')
 > | 0;
1990 
1991                var select = document.createElement('div');
1992                var list = document.createElement('div');
1993                var uval = 0;
1994                var option = null;
1995                var option_value = null;
1996 
1997                list.className = 'ui-dropdown-list';
1998                select.className = 'ui-dropdown-select';
1999 
2000                while (node.firstElementChild !== null) {
2001                        option = node.firstElementChild;
2002                        option_value = option.getAttribute('data-
 >value');
2003 
2004                        if (option_value === null)
2005                                option.setAttribute('data-value',
 > uval);
2006 
2007                        list.appendChild(node.firstElementChild);
2008                        uval++;
2009                }
2010 
2011                node.appendChild(select);
2012                node.appendChild(list);
2013 
2014                select.onclick = this.toggle.bind(this);
2015                list.onclick = this.updateValue.bind(this);
2016                document.addEventListener('click', clickOut);
2017 
2018                this.state = 0;
2019                this.time = 0;
2020                this.dropmenu = list;
2021                this.select = select;
2022                this.toggle(false);
2023                this.value = {};
2024                this.topic = topic;
2025 
2026                if (label)
2027                        select.textContent = label;
2028                else
2029                        this.setNodeValue(list.children[selected]
 >);
2030 
2031                dropdowns[topic] = this;
2032 
2033        };
2034 
2035        DropDown.prototype.toggle = function toggle(state) {
2036                if (typeof(state) === 'boolean')
2037                        this.state = state === false ? 0 : 1;
2038                else
2039                        this.state = 1 ^ this.state;
2040 
2041                if (active !== this) {
2042                        if (active)
2043                                active.toggle(false);
2044                        active = this;
2045                }
2046 
2047                if (this.state === 0)
2048                        this.dropmenu.setAttribute('data-hidden',
 > 'true');
2049                else
2050                        this.dropmenu.removeAttribute('data-hidde
 >n');
2051 
2052        };
2053 
2054        DropDown.prototype.updateValue = function updateValue(e) 
 >{
2055 
2056                if (Date.now() - this.time < 500)
2057                        return;
2058 
2059                if (e.target.className !== "ui-dropdown-list") {
2060                        this.setNodeValue(e.target);
2061                        this.toggle(false);
2062                }
2063 
2064                this.time = Date.now();
2065        };
2066 
2067        DropDown.prototype.setNodeValue = function setNodeValue(n
 >ode, send_notify) {
2068                this.value['name'] = node.textContent;
2069                this.value['value'] = node.getAttribute('data-val
 >ue');
2070 
2071                this.select.textContent = node.textContent;
2072                this.select.setAttribute('data-value', this.value
 >['value']);
2073 
2074                if (send_notify !== false)
2075                        notify.call(this);
2076        };
2077 
2078        var clickOut = function clickOut(e) {
2079                if (active.state === 0 ||
2080                        e.target === active.dropmenu ||
2081                        e.target === active.select)
2082                        return;
2083 
2084                active.toggle(false);
2085        };
2086 
2087        var createDropDown = function createDropDown(topic, optio
 >ns) {
2088 
2089                var dropdown = document.createElement('div');
2090                dropdown.setAttribute('data-topic', topic);
2091                dropdown.className = 'ui-dropdown';
2092 
2093                for (var i in options) {
2094                        var x = document.createElement('div');
2095                        x.setAttribute('data-value', i);
2096                        x.textContent = options[i];
2097                        dropdown.appendChild(x);
2098                }
2099 
2100                new DropDown(dropdown);
2101 
2102                return dropdown;
2103        };
2104 
2105        var setValue = function setValue(topic, index, send_notif
 >y) {
2106                if (dropdowns[topic] === undefined ||
2107                        index >= dropdowns[topic].dropmenu.chi
 >ldren.length)
2108                        return;
2109 
2110                dropdowns[topic].setNodeValue(dropdowns[topic].dr
 >opmenu.children[index], send_notify);
2111        };
2112 
2113        var subscribe = function subscribe(topic, callback) {
2114                if (subscribers[topic] === undefined)
2115                        subscribers[topic] = [];
2116                subscribers[topic].push(callback);
2117        };
2118 
2119        var unsubscribe = function unsubscribe(topic, callback) {
2120                var index = subscribers[topic].indexOf(callback);
2121                subscribers[topic].splice(index, 1);
2122        };
2123 
2124        var notify = function notify() {
2125                if (subscribers[this.topic] === undefined)
2126                        return;
2127 
2128                for (var i in subscribers[this.topic]) {
2129                        subscribers[this.topic][i](this.value);
2130                }
2131        };
2132 
2133        var init = function init() {
2134                var elem, size;
2135 
2136                elem = document.querySelectorAll('.ui-dropdown');
2137                size = elem.length;
2138                for (var i = 0; i < size; i++)
2139                        new DropDown(elem[i]);
2140 
2141        };
2142 
2143        return {
2144                init : init,
2145                setValue : setValue,
2146                subscribe : subscribe,
2147                unsubscribe : unsubscribe,
2148                createDropDown : createDropDown
2149        };
2150 
2151})();
2152 
2153/**
n2094                if (value < slider.min)      value = slider.min2275                if (value < slider.min) value = slider.min;
>n; 
n2429 n
2430/**
2431 * UI-DropDown Select
2432 */
2433 
2434var DropDownManager = (function DropdownManager() {
2435        'use strict';
2436 
2437        var subscribers = {};
2438        var dropdowns = [];
2439        var active = null;
2440 
2441        var visbility = ["hidden", "visible"];
2442 
2443        var DropDown = function DropDown(node) {
2444                var topic = node.getAttribute('data-topic');
2445                var label = node.getAttribute('data-label');
2446                var selected = node.getAttribute('data-selected')
> | 0; 
2447 
2448                var select = document.createElement('div');
2449                var list = document.createElement('div');
2450                var uval = 0;
2451                var option = null;
2452                var option_value = null;
2453 
2454                list.className = 'ui-dropdown-list';
2455                select.className = 'ui-dropdown-select';
2456 
2457                while (node.firstElementChild !== null) {
2458                        option = node.firstElementChild;
2459                        option_value = option.getAttribute('data-
>value'); 
2460 
2461                        if (option_value === null)
2462                                option.setAttribute('data-value',
> uval); 
2463 
2464                        list.appendChild(node.firstElementChild);
2465                        uval++;
2466                }
2467 
2468                node.appendChild(select);
2469                node.appendChild(list);
2470 
2471                select.onclick = this.toggle.bind(this);
2472                list.onclick = this.updateValue.bind(this);
2473                document.addEventListener('click', clickOut);
2474 
2475                this.state = 0;
2476                this.time = 0;
2477                this.dropmenu = list;
2478                this.select = select;
2479                this.toggle(false);
2480                this.value = {};
2481                this.topic = topic;
2482 
2483                if (label)
2484                        select.textContent = label;
2485                else
2486                        this.setNodeValue(list.children[selected]
>); 
2487 
2488                dropdowns[topic] = this;
2489 
2490        };
2491 
2492        DropDown.prototype.toggle = function toggle(state) {
2493                if (typeof(state) === 'boolean')
2494                        this.state = state === false ? 0 : 1;
2495                else
2496                        this.state = 1 ^ this.state;
2497 
2498                if (active !== this) {
2499                        if (active)
2500                                active.toggle(false);
2501                        active = this;
2502                }
2503 
2504                if (this.state === 0)
2505                        this.dropmenu.setAttribute('data-hidden',
> 'true'); 
2506                else
2507                        this.dropmenu.removeAttribute('data-hidde
>n'); 
2508 
2509        };
2510 
2511        DropDown.prototype.updateValue = function updateValue(e) 
>{ 
2512 
2513                if (Date.now() - this.time < 500)
2514                        return;
2515 
2516                if (e.target.className !== "ui-dropdown-list") {
2517                        this.setNodeValue(e.target);
2518                        this.toggle(false);
2519                }
2520 
2521                this.time = Date.now();
2522        };
2523 
2524        DropDown.prototype.setNodeValue = function setNodeValue(n
>ode) { 
2525                this.value['name'] = node.textContent;
2526                this.value['value'] = node.getAttribute('data-val
>ue'); 
2527 
2528                this.select.textContent = node.textContent;
2529                this.select.setAttribute('data-value', this.value
>['value']); 
2530 
2531                notify.call(this);
2532        };
2533 
2534        var clickOut = function clickOut(e) {
2535                if (active.state === 0 ||
2536                        e.target === active.dropmenu ||
2537                        e.target === active.select)
2538                        return;
2539 
2540                active.toggle(false);
2541        };
2542 
2543        var createDropDown = function createDropDown(topic, optio
>ns) { 
2544 
2545                var dropdown = document.createElement('div');
2546                dropdown.setAttribute('data-topic', topic);
2547                dropdown.className = 'ui-dropdown';
2548 
2549                for (var i in options) {
2550                        var x = document.createElement('div');
2551                        x.setAttribute('data-value', i);
2552                        x.textContent = options[i];
2553                        dropdown.appendChild(x);
2554                }
2555 
2556                new DropDown(dropdown);
2557 
2558                return dropdown;
2559        };
2560 
2561        var setValue = function setValue(topic, index) {
2562                if (dropdowns[topic] === undefined ||
2563                        index >= dropdowns[topic].dropmenu.chi
>ldren.length) 
2564                        return;
2565 
2566                dropdowns[topic].setNodeValue(dropdowns[topic].dr
>opmenu.children[index]); 
2567        };
2568 
2569        var subscribe = function subscribe(topic, callback) {
2570                if (subscribers[topic] === undefined)
2571                        subscribers[topic] = [];
2572                subscribers[topic].push(callback);
2573        };
2574 
2575        var unsubscribe = function unsubscribe(topic, callback) {
2576                var index = subscribers[topic].indexOf(callback);
2577                subscribers[topic].splice(index, 1);
2578        };
2579 
2580        var notify = function notify() {
2581                if (subscribers[this.topic] === undefined)
2582                        return;
2583 
2584                for (var i in subscribers[this.topic]) {
2585                        subscribers[this.topic][i](this.value);
2586                }
2587        };
2588 
2589        var init = function init() {
2590                var elem, size;
2591 
2592                elem = document.querySelectorAll('.ui-dropdown');
2593                size = elem.length;
2594                for (var i = 0; i < size; i++)
2595                        new DropDown(elem[i]);
2596 
2597        };
2598 
2599        return {
2600                init : init,
2601                setValue : setValue,
2602                subscribe : subscribe,
2603                unsubscribe : unsubscribe,
2604                createDropDown : createDropDown
2605        };
2606}();
n2610 n2613 
n2613 n2616 
n2617 n2620 
n2619 n2622 
n2623 n2626 
n2627 n2630 
n2634 n2637 
n2638 n2641 
n2642 n2645 
n2644 n2647 
n2651 n2654 
n2656 n2659 
n2659 n2662 
n2661 n2664 
n2667 n2670 
n2669 n2672 
n2675 n2678 
n2678 n2681 
n2683 n2686 
n2692 n2695 
n2696 n2699 
n2702 n2705 
n2705 n2708 
n2709 n2712 
n2715 n2718 
n2720 n2723 
2721 2724 
n2727 n2730 
n2729 n2732 
n2738 n2741 
n2740 n2743 
n2744 n2747 
n2748 n2751 
n2752 n2755 
n2756 n2759 
n2764 n2767 
n2768 n2771 
n2774 n2777 
n2779 n2782 
n2790 n2793 
n2801 n2804 
n2806 n2809 
n2815 n2818 
n2820 n2823 
n2826 n2829 
n2831 n2834 
n2835 n2838 
n2839 n2842 
n2847 n2850 
n2855 n2858 
2856 2859 
n2864 n2867 
n2866 n2869 
n2869 n2872 
n2880 n2883 
n2885 n2888 
n2888 n2891 
n2892 n2895 
2893 2896 
n2898 n2901 
n2900 n2903 
n2903 n2906 
n2907 n2910 
n2910 n2913 
n2919 n2922 
n2927 n2930 
n2929 n2932 
n2935 n2938 
n2947 n2950 
n2953 n2956 
n2956 n2959 
n2959 n2962 
n2970 n2973 
n2975 n2978 
n2983 n2986 
n2990 n2993 
n2994 n2997 
n3000 n3003 
n3007 n3010 
n3011 n3014 
n3018 n3021 
n3023 n3026 
n3029 n3032 
n3034 n3037 
n3039 n3042 
n3042 n3045 
n3045 n3048 
n3053 n3056 
n3059 n3062 
n3065 n3068 
n3071 n3074 
n3075 n3078 
n3077 n3080 
n3080 n3083 
n3084 n3087 
n3086 n3089 
n3092 n3095 
n3095 n3098 
n3099 n3102 
n3104 n3107 
n3110 n3113 
n3114 n3117 
n3119 n3122 
n3121 n3124 
n3127 n3130 
n3132 n3135 
n3141 n3144 
n3146 n3149 
n3151 n3154 
n3162 n3165 
n3164 n3167 
n3167 n3170 
n3172 n3175 
n3177 n3180 
n3181 n3184 
n3185 n3188 
n3189 n3192 
n3192 n3195 
n3196 n3199 
n3198 n3201 
n3201 n3204 
n3206 n3209 
n3211 n3214 
n3215 n3218 
n3218 n3221 
n3222 n3225 
n3225 n3228 
n3229 n3232 
n3235 n3238 
n3244 n3247 
n3247 n3250 
n3251 n3254 
n3255 n3258 
n3258 n3261 
n3262 n3265 
n3269 n3272 
n3274 n3277 
3278                        for (var i=0; i< lg_axes.length) {
3279                                if (ids[idx] !== true)
3280                                        return idx;
3281                                idx++;
3282                        }
3283 
3284                        return idx;
3285                };
3286 
3287                var getOrderID = function getOrderID(axisID) {
3288                        var len = lg_axes.length;
n3278 n3292 
n3280 n3294 
n3284 n3298 
n3288 n3302 
n3294 n3308 
n3296 n3310 
n3303 n3317 
n3311 n3325 
n3315 n3329 
n3318 n3332 
t3320                                for (var i=0; i<len; '="" '');t3334                                for (var i=0; i< 4)
>="" ');="" ';';="" 'both',="" 'disabled')="" 'disabled');="" 'px' 
>;="" ()="" (delete_point_btn)="" (lg_axes.length="" (this.getattr 
>ibute('data-state')="==" (update_output)="" *="" **="" +="" 4)="" 
> 500);="" :="" <="" activeaxis.deleteactivepoint();="" activea 
>xis.updatepointcolor(color);="" activeaxis.updatepointposition(co 
>lor);="" add_axis_btn.removeattribute('data-state');="" axes_menu 
>="getElemById('gradient-axes');" axesmanager.init();="" box="" bu 
>tton="getElemById('canvas-bg');" button.addeventlistener('click', 
>="" code="prefix" container="" container.setattribute('data-alpha 
>',="" container;="" createstartaxis(-18);="" createstartaxis(18); 
>="" delete_point_btn="getElemById('delete-point');" delete_point_ 
>btn.addeventlistener('click',="" delete_point_btn.setattribute('d 
>ata-state',="" dropdownmanager.init();="" dropdownmanager.subscri 
>be('axis-unit',="" for(var="" function="" function()="" functions 
>="" general="" gradient="[];" gradient.join(',\n="" gradient.push 
>(lg_axes[i].getcssgradient());="" gradient_container="getElemById 
>('gradient-container');" gradient_container.style.background="gra 
>dient.join('," i="" i++)="" if="" init="function" init()="" init, 
>="" inputslidermanager.init();="" inputslidermanager.subscribe('p 
>oint-position',="" k="0;" len="lg_axes.length;" len;="" lg_axes[i 
>].shortcut.style.left="60" lg_axes[i].updateabsoluteposition();=" 
>" lg_axes[i].updateonresize();="" methods="" output="getElemById( 
>'output');" output.children[index].children[1].textcontent="code; 
>" output.children[index].style.height="output.children[index].chi 
>ldren[1].scrollHeight" output;="" point="" pre="" prefix)="" resi 
>zecontainer="function" resizecontainer()="" resizecontainer);=""  
>resizecontainer,="" resizeend="function" resizeend()="" resizeend 
>);="" return="" return;="" setaddaxisbutton();="" setaxisunit);=" 
>" setdeleteaxisbutton();="" setdeletebuttonstate="function" setde 
>letebuttonstate('disabled');="" setdeletebuttonstate(state)="" se 
>tdeletepointbutton="function" setdeletepointbutton()="" setdelete 
>pointbutton();="" settogglealphabackground="function" settoggleal 
>phabackground()="" settogglealphabackground();="" slidermanager.i 
>nit();="" slidermanager.subscribe('axis-rotation',="" state="true 
>;" state);="" this.setattribute('data-alpha',="" this.setattribut 
>e('data-state',="" tool="" tool()="" tool.init();="" tool.updateo 
>utputcsscode(gradient);="" uicolorpicker.init();="" uicolorpicker 
>.subscribe('picker',="" uicomponent.makeresizable(gradient_contai 
>ner,="" update_output="setTimeout(" updateaxisrotation);="" updat 
>ecssgradient="function" updatecssgradient();="" updatecssgradient 
>,="" updateoutputcsscode="function" updateoutputcsscode(gradient) 
>="" updateoutputcsscode:="" updateoutputelem="function" updateout 
>putelem(0,="" updateoutputelem(index,="" updatepointcolor="functi 
>on" updatepointcolor(color)="" updatepointcolor);="" updatepointp 
>osition="function" updatepointposition(color)="" updatepointposit 
>ion);="" var="" window.addeventlistener('resize',="" window.clear 
>timeout(update_output);="" {="" }="" })();="" });="" },="" };=""& 
>gt; 
3335                                        add_axis_btn.removeAttrib
 >ute('data-state');
3336                        });
3337                };
3338 
3339                /* Point methods */
3340 
3341                var updatePointColor = function updatePointColor(
 >color) {
3342                        ActiveAxis.updatePointColor(color);
3343                };
3344 
3345                var updatePointPosition = function updatePointPos
 >ition(color) {
3346                        ActiveAxis.updatePointPosition(color);
3347                };
3348 
3349                var setDeletePointButton = function setDeletePoin
 >tButton() {
3350                        delete_point_btn = getElemById('delete-po
 >int');
3351                        delete_point_btn.addEventListener('click'
 >, function () {
3352                                if (this.getAttribute('data-state
 >') === 'disabled')
3353                                        return;
3354 
3355                                ActiveAxis.deleteActivePoint();
3356                                updateCSSGradient();
3357                                setDeleteButtonState('disabled');
3358                        });
3359                };
3360 
3361                var setDeleteButtonState = function setDeleteButt
 >onState(state) {
3362                        if (delete_point_btn)
3363                                delete_point_btn.setAttribute('da
 >ta-state', state);
3364                };
3365 
3366                /* Container box functions */
3367 
3368                var resizeContainer = function resizeContainer() 
 >{
3369                        var len = lg_axes.length;
3370                        for(var i = 0; i < len; i++)
3371                                lg_axes[i].updateOnResize();
3372                };
3373 
3374                var resizeEnd = function resizeEnd() {
3375                        var len = lg_axes.length;
3376                        for(var i = 0; i < len; i++)
3377                                lg_axes[i].updateAbsolutePosition
 >();
3378                };
3379 
3380                /* General functions */
3381 
3382                var updateCSSGradient = function () {
3383                        var gradient = [];
3384                        var k = 0;
3385                        var len = lg_axes.length;
3386                        for(var i = 0; i < len; i++) {
3387                                gradient.push(lg_axes[i].getCSSGr
 >adient());
3388                        }
3389 
3390                        gradient_container.style.background = gra
 >dient.join(', ');
3391 
3392                        if (update_output)
3393                                window.clearTimeout(update_output
 >);
3394 
3395                        update_output = setTimeout( function() {
3396                                Tool.updateOutputCSSCode(gradient
 >);
3397                        }, 500);
3398                };
3399 
3400                var init = function init() {
3401                        gradient_container = getElemById('gradien
 >t-container');
3402                        axes_menu = getElemById('gradient-axes');
3403 
3404                        setDeletePointButton();
3405                        setDeleteAxisButton();
3406                        setAddAxisButton();
3407 
3408                        createStartAxis(18);
3409                        createStartAxis(-18);
3410 
3411                        updateCSSGradient();
3412 
3413                        UIColorPicker.subscribe('picker', updateP
 >ointColor);
3414                        InputSliderManager.subscribe('point-posit
 >ion', updatePointPosition);
3415 
3416                        DropDownManager.subscribe('axis-unit', se
 >tAxisUnit);
3417                        SliderManager.subscribe('axis-rotation', 
 >updateAxisRotation);
3418 
3419                        UIComponent.makeResizable(gradient_contai
 >ner, 'both', resizeContainer, resizeEnd);
3420                        window.addEventListener('resize', resizeC
 >ontainer);
3421                };
3422 
3423                return {
3424                        init : init,
3425                        updateCSSGradient : updateCSSGradient,
3426                        setDeleteButtonState : setDeleteButtonSta
 >te
3427                };
3428 
3429        })();
3430 
3431 
3432        /**
3433         * Tool
3434         */
3435        var Tool = (function Tool() {
3436 
3437                var container;
3438                var output;
3439 
3440                var setToggleAlphaBackground = function setToggle
 >AlphaBackground() {
3441                        var button = getElemById('canvas-bg');
3442                        var state = true;
3443                        button.addEventListener('click', function
 >() {
3444                                state = !state;
3445                                container.setAttribute('data-alph
 >a', state);
3446                                this.setAttribute('data-alpha', s
 >tate);
3447                        });
3448                };
3449 
3450                var updateOutputCSSCode = function updateOutputCS
 >SCode(gradient) {
3451 
3452                        var updateOutputElem = function updateOut
 >putElem(index, prefix) {
3453                                var code = prefix + gradient.join
 >(',\n ' + prefix) + ';';
3454                                output.children[index].children[1
 >].textContent = code;
3455                                output.children[index].style.heig
 >ht = output.children[index].children[1].scrollHeight + 'px';
3456                        };
3457 
3458                        updateOutputElem(0, '');
3459                };
3460 
3461 
3462                var init = function init() {
3463                        output = getElemById('output');
3464                        container = getElemById('gradient-contain
 >er');
3465 
3466                        setToggleAlphaBackground();
3467                };
3468 
3469                return {
3470                        init : init,
3471                        updateOutputCSSCode: updateOutputCSSCode
3472                };
3473 
3474        })();
3475 
3476        var init = function init() {
3477                UIColorPicker.init();
3478                InputSliderManager.init();
3479                DropDownManager.init();
3480                SliderManager.init();
3481                AxesManager.init();
3482                Tool.init();
3483        };
3484 
3485        return {
3486                init : init
3487        };
3488 
3489})();
3490 
3491 
3492 
3493 

Back to History