//var COUNTER = 0; (function($){ function jggui(options){ var _options = jQuery.extend({ height : 440, width : 630, callback : false }, options); return this.each(function(){ var that = this; //var _src = that.src; var _table = jQuery(that).parent().next("table").eq(0); var _jgtable = _table.parent(); var _jggui = false; //FASE 1: load data var _axis = []; var _legend = []; var _tables = []; var _palette = []; var _chart = false; var _defaults = {}; var _icon; _bind(); //BIND function _bind(){ //console.log(that); jQuery(that).click(function(){ _start(); _init_gui(); }); } function _start(){ //metadata miei var _cre = /({.*})/; var _m = _cre.exec( _jgtable.attr("class") ); var _my_metadata = false; if ( _m ) _my_metadata = eval("(" + _m[1] + ")");; _load(); //default colors _palette = [ "5131C9","FFCC00","DA1B1B","FF9900","FF6600","CCFFFF","CCFF00", "CCCCCC","FF99CC","999900","999999","66FF00","66CC00","669900","660099", "33CC00","333399","000000"]; _chart = _my_metadata;//jQuery.metadata.get(_jgtable); _defaults = { //DEVONO CORRISPONDERE type : 'bvg', height : 200, width : 300, size : "200x300", title_size : 12, title_color : '000000', bar_width : 20, bar_spacing : 1, lines : [], axis_step : 1, bg : false, bg_type : false, bg_offset : false, bg_angle : 90, bg_width : 10, bg_trasparency : false, chbg : false, chbg_type : false, chbg_offset : false, chbg_angle : 90, chbg_width : 10, chbg_trasparency : false, grid : false, grid_x : 10 , grid_y : 10, grid_line : 1, grid_blank : 1 }; if(!_chart) _chart = {}; _chart.type = _chart.type || 'bvg'; _chart.size = _chart.size || "200x300"; var _s = _chart.size.split("x"); _chart.height = _s[0]; _chart.width = _s[1]; _chart.title_size = _chart.title_size || 12; _chart.title_color = _chart.title_color || '000000'; _chart.bar_width = _chart.bar_width || 20; _chart.bar_spacing = _chart.bar_spacing || 1; _chart.lines = _chart.lines || []; _chart.axis_step = _chart.axis_step || 1; _chart.bg = _chart.bg || false; _chart.bg_type = _chart.bg_type || false; _chart.bg_offset = _chart.bg_offset || false; _chart.bg_angle = _chart.bg_angle || 90; _chart.bg_width = _chart.bg_width || 10; _chart.bg_trasparency = _chart.bg_trasparency || false; _chart.chbg = _chart.chbg || false; _chart.chbg_type = _chart.chbg_type || false; _chart.chbg_offset = _chart.chbg_offset || false; _chart.chbg_angle = _chart.chbg_angle || 90; _chart.chbg_width = _chart.chbg_width || 10; _chart.chbg_trasparency = _chart.chbg_trasparency || false; _chart.grid = _chart.grid || false; _chart.grid_x = _chart.grid_x || 10 _chart.grid_y = _chart.grid_y || 10; _chart.grid_line = _chart.grid_line || 1; _chart.grid_blank = _chart.grid_blank || 1; //console.log(_chart.colors); _icon = _chart.type; //console.log(this); } //LOAD function _load(){ _axis = jQuery.map( jQuery(_table).find("tbody > tr > th.serie"), function(th) { return jQuery(th).text(); } ); for(var x= 0;x< jQuery(_table).find("tbody > tr").size();x++){ _tables.push( jQuery.map( jQuery(_table).find("tbody > tr:eq(" + x + ") > td"), function(td,index){ if(parseFloat(jQuery(td).text())) return parseFloat(jQuery(td).text()); else return 0; } ) ); } //console.log(tables); _legend = jQuery.map( jQuery(_table).find("thead > tr:last > th.serie"), function(th) { return jQuery(th).text(); } ); } //TOGGLE function _toggle_filltable(){ //show filltable if(_chart.fillarea){ $("#filltable", _jggui).show(); }else{ $("#filltable", _jggui).hide(); } if(_chart.filltop){ var _color = _palette[_legend.length]; $("#filltable", _jggui).find("#filltop").val(_color).css("background","#" + _color); } } function _toggle_lines(){ //console.log($(".line")); if(_icon == 'lc' || _chart.fillarea){ $(".line", _jggui).show(); }else{ $(".line", _jggui).hide(); } } function _toggle_axis_step(){ //console.log(_axis.length>10) if(_axis.length>10){//TODO:test $(".axis_step", _jggui).show(); }else{ $(".axis_step", _jggui).hide(); } //console.log($("#axis_step")); } function _toggle_bar_options(){ //console.log(_icon) if(_icon == 'bvg' || _icon == 'bvs' || _icon == 'bhg' || _icon == 'bhs' ){ $("tr.bar", _jggui).find("th,td").show(); }else{ $("tr.bar", _jggui).find("th,td").hide(); } } function _toggle_bg(){ //console.log(_chart.bg); if(_chart.bg){ $("#background1", _jggui).val(_chart.bg); $(".background1", _jggui).show(); $(".bg_trasparency", _jggui).show(); }else{ $(".background1", _jggui).hide(); $(".bg_trasparency", _jggui).hide(); } if(_chart.bg_type == "gradient" || _chart.bg_type == "stripes"){ $("#background2", _jggui).val(_chart.bg_offset ? _chart.bg_offset : 'FFFFFF'); $(".background2, .bg_angle", _jggui).show(); }else{ $(".background2, .bg_angle", _jggui).hide(); } if(_chart.bg_type == "stripes"){ $("#stripe_width", _jggui).val(_chart.bg_width); $(".stripe_width", _jggui).show(); }else{ $(".stripe_width", _jggui).hide(); } if(_chart.chbg){ $("#ch_background1", _jggui).val(_chart.chbg); $(".ch_background1", _jggui).show(); $(".ch_bg_trasparency", _jggui).show(); }else{ $(".ch_background1", _jggui).hide(); $(".ch_bg_trasparency", _jggui).hide(); } if(_chart.chbg_type == "gradient" || _chart.chbg_type == "stripes"){ $("#ch_background2", _jggui).val(_chart.chbg_offset ? _chart.chbg_offset : 'FFFFFF'); $(".ch_background2, .ch_bg_angle", _jggui).show(); }else{ $(".ch_background2, .ch_bg_angle", _jggui).hide(); } if(_chart.chbg_type == "stripes"){ $("#ch_stripe_width", _jggui).val(_chart.chbg_width); $(".ch_stripe_width", _jggui).show(); }else{ $(".ch_stripe_width", _jggui).hide(); } } function _toggle_grid(){ //return; if(_chart.grid){ $(".grid_x", _jggui).show(); $(".grid_y", _jggui).show(); $(".grid_line", _jggui).show(); $(".grid_blank", _jggui).show(); }else{ $(".grid_x", _jggui).hide(); $(".grid_y", _jggui).hide(); $(".grid_line", _jggui).hide(); $(".grid_blank", _jggui).hide(); } } //UPDATE - REFRESH function _update_type(){ _toggle_filltable(); _toggle_bar_options(); _toggle_lines(); _toggle_axis_step(); _refresh(); } function _update(chart){ _chart = $.extend(chart,_chart); _size(); //###$("#JGG_top").find(".jgchart").fadeOut();//###.remove(); //###$("#JGG_top").append(_clone); //###_clone.jgtable(_chart).hide().fadeIn(); if(_options.callback){ _options.callback(); //console.log(this); _bind(); } var _div = _table.parent().find(".jgchart").eq(0).clone().hide(); $("#JGG_top").append(_div.fadeIn()); //$("#JGG_top").find(".jgchart"). $("#export_url", _jggui).val(_div.find("img").eq(0).attr("src")); } function _export(){ //COUNTER++; //var _url = $("#JGG_top").find(".jgchart > img").attr("src"); //console.log($(_jggui).find("img")); var _options = _metadata(); var _jgcc = _jgcharts(_options); $("#export_html", _jggui).val(''); $("#export_metadata", _jggui).val(_options); //$("#export_url").val(_url); $("#export_jgcharts", _jggui).val(_jgcc); } function _jgcharts(opts){ return "jQuery(TARGET_CONTAINER).jgcharts(" + opts + ")"; } function _metadata(){ var _metadata = "{\n"; var _t = []; for(prop in _chart){ var _x = _filter_metadata_property(prop); if(_x) _t.push(_x); } _metadata += _t.join(",\n"); _metadata += "\n}"; return _metadata; } function _filter_metadata_property(prop){ switch(prop){ case "height": case "width": return false; break; case "title_size": case "title_color": if(_chart.title) return _metadata_property(prop); else return false; break; case "bar_width": case "bar_spacing": if(_chart.type == "bhg"|| _chart.type == "bvg"|| _chart.type == "bhs"|| _chart.type == "bvs" ){ return _metadata_property(prop); }else{ return false; } break; case "fillarea": case "fillbottom": case "filltop": case "lines": if(_chart.type == "lc"){ return _metadata_property(prop); }else{ return false; } break; case "bg": case "bg_type": case "bg_offset": case "bg_width": case "bg_angle": case "bg_trasparency": if(_chart.bg){ return _metadata_property(prop); }else{ return false; } break; case "chbg": case "chbg_type": case "chbg_offset": case "chbg_width": case "chbg_angle": case "chbg_trasparency": if(_chart.chbg){ return _metadata_property(prop); }else{ return false; } break; case "grid": case "grid_x": case "grid_y": case "grid_line": case "grid_blank": if(_chart.grid){ return _metadata_property(prop); }else{ return false; } break; default: return _metadata_property(prop); break; } } function _metadata_property(prop){ var _val = _prop(_chart[prop]); if(_chart[prop] !== _defaults[prop] && _val) return "\t" + prop + " : " + _val + ""; else return false; } function _prop(prop){ //console.log(typeof prop); switch(typeof prop){ case "object": //console.log(prop.constructor); if(prop.constructor == Array){ var _s = []; for(x in prop){ _s.push(_prop(prop[x])) } _s = "[" + _s.join(",") + "]"; if(_s !== "[]") return _s; else return false; } break; case "string": return "'"+ prop +"'"; break; default: return prop; break; } } function _refresh(){ _refresh_hex(); _refresh_spinners(); _export(); _metadata_to_target(); _update(); } function _metadata_to_target(){ var _class = _jgtable.attr("class"); var _re = /{([\S\s]*)}/; if(_class) _class = _class.replace(_re,""); //console.log(_class); //console.log(_table.attr("class")); var _metadata = $("#export_metadata").val(); if(_class) _metadata = _class + " " + _metadata; _jgtable.attr("class", _metadata); } function _refresh_hex(){ _chart.colors = []; $(".hex").not(".custom").each(function(){ //TODO: //console.log(this.id); if($(this).hasClass("serie")){ _chart.colors.push(jQuery(this).val().replace("#","")); }else{ _chart[this.id] = jQuery(this).val().replace("#",""); //console.log(_chart[this.id]); } }); //console.log(_chart.bg) if(_chart.bg){ var _j = $("#background1"); var _val = _j.val(); _j.css("background", "#" + _val); _chart.bg = _val.replace("#",""); } if(_chart.bg){ var _j = $("#background2"); var _val = _j.val(); _j.css("background", "#" + _val); _chart.bg_offset = _val.replace("#",""); } if(_chart.chbg){ var _j = $("#ch_background1"); var _val = _j.val(); _j.css("background", "#" + _val); _chart.chbg = _val.replace("#",""); } if(_chart.chbg){ var _j = $("#ch_background2"); var _val = _j.val(); _j.css("background", "#" + _val); _chart.chbg_offset = _val.replace("#",""); } } function _refresh_spinners(){ var x=1;var _temp = []; _chart.lines = []; $("#seriestable").find(".line_style").each(function(){ //console.log($(this).val()); _temp.push($(this).val()); if(x % 3 == 0){ _chart.lines.push(_temp); _temp = []; } x++; }); //console.log(_chart.lines); } //helpers function _size(){ _chart.size = _chart.width + 'x' + _chart.height; } //INIT-EVENTS function _init_gui(){ _overlay(); _init_window(); } function _init_window(){ $("#JGG_window").append('
').show(); //_refresh(_chart); _init_tabs(); } function _init_tabs(){ $("#JGG_bottom").load(_options.url+'jggui.html', function(html){ $(this).html(html); _position(_options.height, _options.width); _jggui = $("#jggui"); $("#jggui ul").tabs(); //FASE 2.A - inizializza eventi _init_panel_colors(); _init_events_panel_options(); _init_events_panel_background(); _init_events_panel_grid(); _init_events_panel_type(); _init_widgets(); //_hex(); //refresh $('.refresh').click(function(){ _refresh(); }); }); } function _init_widgets(){ _init_spinner(); _init_hex(); _events_hex(); //valori predefiniti hex } function _init_spinner(){ $(".spinner").not(".custom").spinner({max: 10, min: 0}); } function _init_hex(){ //colorpickers $('.hex').each(function(){ var bgColor = $(this).val(); bgColor = '#'+bgColor.replace(/#/g, ""); $(this).val(bgColor).css('background', bgColor); $(this).wrap('
').after(''); }); //set up colors, then remove temp pickers $('input.hex').each(function(){ $('body').append(''); $('#picker').farbtastic(this).remove(); }); } function _init_events_panel_type(){ $(".icon") .each(function(){ var _img = $(this).find("img") var _src = _img.attr("src"); //console.log(_src); //console.log(_icon); if(_src.indexOf(_icon + '.png') !== -1){ $(this).addClass("pressed"); _update_type(); } _src = _options.url + _src; _img.attr('src', _src); }) .click(function(){ $(this).parent().find(".pressed").removeClass("pressed"); $(this).addClass("pressed"); _icon = $(this).find("img").attr("src").replace(_options.url,"").replace("img/","").replace(".png",""); //console.log(_type); switch(_icon){ case 'lc': case 'bvg': case 'bvs': case 'bhg': case 'bhs': case 'p': case 'p3': _chart.type = _icon; _chart.fillarea = false; _chart.fillbottom = false; _chart.filltop = false; break; case 'fillall': _chart.type = 'lc'; _chart.fillarea = true; _chart.fillbottom = true; _chart.filltop = true; break; case 'fillbottom': _chart.type = 'lc'; _chart.fillarea = true; _chart.fillbottom = true; _chart.filltop = false; break; } _update_type(); return false; }); } function _init_events_panel_options(){ $(".title").change( function(){ _chart.title = $(this).val(); } ); $("#title_color").val("#" + _chart.title_color); $("#title_size") .val(_chart.title_size) .spinner({min:5, max:30}) .bind('spinchange', function(event, ui) { _chart.title_size = ui.value; }); //bug?: sul nero la size non fa effetto $("#ch_height") .val(_chart.height) .spinner({min:100, max:1000, stepping: 10}) .bind('spinchange', function(event, ui) { _chart.height = ui.value; }); $("#ch_width") .val(_chart.width) .spinner({min:100, max:1000, stepping: 10}) .bind('spinchange', function(event, ui) { _chart.width = ui.value; }); $("#bar_width") .val(_chart.bar_width) .spinner({min:1, max:30}) .bind('spinchange', function(event, ui) { _chart.bar_width = ui.value; }); $("#bar_spacing") .val(_chart.bar_spacing) .spinner({min:1, max:10}) .bind('spinchange', function(event, ui) { _chart.bar_spacing = ui.value; }); $("#axis_step") .val(_chart.axis_step) .spinner({min:1, max:10}) .bind('spinchange', function(event, ui) { _chart.axis_step = ui.value; }); } function _init_panel_colors(){ _init_colors(); _toggle_lines(); } function _init_colors(){ var _tpl = 'SERIE'; _tpl += ''; _tpl += ''; _tpl += ''; _tpl += ''; var _html = ''; //console.log(_legend.length); //console.log(_legend); var y = 0; for(x in _legend){ var _color = _chart.colors && _chart.colors[y] ? _chart.colors[y] : _palette[y] || '000000'; _html += _tpl.replace("SERIE", _legend[x]).replace("$COLOR", _color); y++; } $("#seriestable").find("tbody").append(_html); $("#seriestable").find(".spinner").spinner(); } function _init_events_panel_background(){ //$("#chart-background").val(_chart.bg_type)//.trigger("update"); //$("#chartarea-background").val(_chart.bg_type)//.trigger("update"); $("#chart-background").change(function(){ var _val = $(this).val(); if(_val == 'disabled'){ _val = false; _chart.bg = _val; _chart.bg_offset = _val; }else{ _chart.bg = 'FFFFFF'; _chart.bg_offset = 'FFFFFF'; } _chart.bg_type = _val; $(this).trigger("update"); _refresh(); }) .val(_chart.bg_type) .bind("update",function(){ _toggle_bg(); }) .trigger("update"); $("#chartarea-background").change(function(){ var _val = $(this).val(); if(_val == 'disabled'){ _val = false; _chart.chbg = _val; _chart.chbg_offset = _val; }else{ _chart.chbg = 'FFFFFF'; _chart.chbg_offset = 'FFFFFF'; } _chart.chbg_type = _val; $(this).trigger("update"); _refresh(); }) .val(_chart.chbg_type) .bind("update",function(){ _toggle_bg(); }) .trigger("update"); $("#bg_trasparency_bool").change(function(){ if($(this).attr("checked")){ $(".bg_trasparency_bool").show(); }else{ $(".bg_trasparency_bool").hide(); _chart.bg_trasparency = false; } }).trigger("change"); $("#ch_bg_trasparency_bool").change(function(){ if($(this).attr("checked")){ $(".ch_bg_trasparency_bool").show(); }else{ $(".ch_bg_trasparency_bool").hide(); _chart.chbg_trasparency = false; } }).trigger("change"); $("#bg_angle") .val(_chart.bg_angle) .spinner({min:0, max:90}) .bind('spinchange', function(event, ui) { _chart.bg_angle = ui.value; }); $("#ch_bg_angle") .val(_chart.chbg_angle) .spinner({min:0, max:90}) .bind('spinchange', function(event, ui) { _chart.chbg_angle = ui.value; }); $("#bg_trasparency") .val(_chart.bg_trasparency ? _chart.bg_trasparency : 90) .spinner({min:10, max:90, stepping: 10}) .bind('spinchange', function(event, ui) { //console.log(ui.value); _chart.bg_trasparency = ui.value; }); $("#ch_bg_trasparency") .val(_chart.chbg_trasparency ? _chart.chbg_trasparency : 90) .spinner({min:10, max:90, stepping: 10}) .bind('spinchange', function(event, ui) { //console.log(ui.value); _chart.chbg_trasparency = ui.value; }); $("#stripe_width") .spinner({min:10, max:100, stepping: 5}) .bind('spinchange', function(event, ui) { //console.log(ui.value); _chart.bg_width = ui.value; }); $("#ch_stripe_width") .spinner({min:10, max:100, stepping: 5}) .bind('spinchange', function(event, ui) { //console.log(ui.value); _chart.chbg_width = ui.value; }); } function _init_events_panel_grid(){ $("#grid").change(function(){ _chart.grid = this.checked; $(this).trigger("update"); _refresh(); }) .val(_chart.grid) .bind("update",function(){ _toggle_grid(); }) .trigger("update"); $("#grid_x, #grid_y, #grid_line, #grid_blank") .spinner({min:1, max:100, stepping: 1}) .bind('spinchange', function(event, ui) { //console.log(ui.value); _chart[this.id] = ui.value; }) .val(_chart[this.id]); } function _events_hex(){ //click events for color pickers $('.pickerIcon').click(function(){ if($(this).next().is('#picker')){ $('#picker').remove(); return false; } $('#picker').remove(); $('a.on').removeClass('on'); $('div.texturePicker ul:visible').fadeOut(100, function(){$(this).parent().css('position', 'static');}); $(this).toggleClass('on').parent().css('position', 'relative'); $(this).after('
'); $('#picker').farbtastic($(this).prev()); $('body').click(function(){ //$('#picker').remove(); }); return false; }); } }); }; /* THICKBOX METHODS */ function _position(height, width) { var TB_WIDTH = (width*1) + 30 || 630; //defaults to 630 if no paramaters were added to URL var TB_HEIGHT = (height*1) + 40 || 440; //defaults to 440 if no paramaters were added to URL $("#JGG_window").css({marginLeft: '-' + parseInt((TB_WIDTH / 2),10) + 'px', width: TB_WIDTH + 'px'}); if ( !(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6 $("#JGG_window").css({marginTop: '-' + parseInt((TB_HEIGHT / 2),13) + 'px'}); } } function _remove() { $("#JGG_window").fadeOut("fast",function(){$('#JGG_window,#JGG_overlay,#JGG_HideSelect').trigger("unload").unbind().remove();}); $("#JGG_load").remove(); if (typeof document.body.style.maxHeight == "undefined") {//if IE 6 $("body","html").css({height: "auto", width: "auto"}); $("html").css("overflow",""); } jQuery(document).trigger("jggui"); return false; } function _overlay(){ if (typeof document.body.style.maxHeight === "undefined") {//if IE 6 $("body","html").css({height: "100%", width: "100%"}); $("html").css("overflow","hidden"); if (document.getElementById("JGG_HideSelect") === null) {//iframe to hide select elements in ie6 $("body").append("
"); $("#JGG_overlay").click(_remove); } }else{//all others if(document.getElementById("JGG_overlay") === null){ $("body").append("
"); $("#JGG_overlay").click(_remove); } } if(_detectMacXFF()){ $("#JGG_overlay").addClass("JGG_overlayMacFFBGHack");//use png overlay so hide flash }else{ $("#JGG_overlay").addClass("JGG_overlayBG");//use background and opacity } } function _detectMacXFF() { var userAgent = navigator.userAgent.toLowerCase(); if (userAgent.indexOf('mac') != -1 && userAgent.indexOf('firefox')!=-1) { return true; } } /* THICKBOX METHODS */ jQuery.fn.jggui = jggui; })(jQuery);