var project={"_id":"58ebc4c89ed7ccac776e8dce","id":"8708314793636e6888e276555fa8a13b31e292a1","name":"ANIMP - V2-ADD OTHER REGIONS","user":"5876456bcc0eeafd51bf1cf2","description":"","created":"2017-01-13T20:38:05.143Z","shared":false,"server":"micro","datafiles":[{"file":{"link":"https://spreadsheets.google.com/feeds/list/1NuZ_t5vBMmMpFXGvGYS3chGmIoXspNihNb9EceWlU2c/od6/public/values?alt=json","type":"URL/API","url":"https://spreadsheets.google.com/feeds/list/1NuZ_t5vBMmMpFXGvGYS3chGmIoXspNihNb9EceWlU2c/od6/public/values?alt=json","message":{"error":false,"text":""}},"varname":"objdata","title":"Objectives","activated":true,"name":"datafile","linkedtofile":true,"optional":true,"content":"","sendtojs":true},{"file":{"link":"https://v4p4sz5ijk.execute-api.us-east-1.amazonaws.com/anbdata/states/names/icao-member-states?api_key=7c3cb620-ed23-11e5-a5f9-adff4fb3e3e1&states=518a8a5e492a5e615800000c&format=json&RO=","type":"URL/API","url":"https://v4p4sz5ijk.execute-api.us-east-1.amazonaws.com/anbdata/states/names/icao-member-states?api_key=7c3cb620-ed23-11e5-a5f9-adff4fb3e3e1&states=518a8a5e492a5e615800000c&format=json&RO=","message":{"error":false,"text":""}},"varname":"apac","title":"APAC States","activated":true,"name":"datafile","linkedtofile":true,"optional":true,"content":"","sendtojs":true},{"file":{"link":"https://s3.amazonaws.com/istarsshare/worldmap.js","type":"URL/API","url":"https://s3.amazonaws.com/istarsshare/worldmap.js","message":{"error":false,"text":""}},"varname":"mapdata","title":"Map","activated":true,"name":"datafile","linkedtofile":true,"optional":true,"content":"","sendtojs":true},{"file":{"link":"https://spreadsheets.google.com/feeds/list/1GHWNTL8MxjlwtXoY1feBZwTVoIIpMyGJpSDgZ1ROMP4/od6/public/values?alt=json","type":"URL/API","url":"https://spreadsheets.google.com/feeds/list/1GHWNTL8MxjlwtXoY1feBZwTVoIIpMyGJpSDgZ1ROMP4/od6/public/values?alt=json","message":{"error":false,"text":""}},"varname":"status","title":"Status_Of_Reporting_Process","activated":true,"name":"datafile","linkedtofile":true,"optional":true,"content":"","sendtojs":true},{"file":{"link":"https://spreadsheets.google.com/feeds/list/1IdisE82Z7nUyuEoPPYEh-f3JZsgtVBVQKA4hZQOmy1k/od6/public/values?alt=json","type":"URL/API","url":"https://spreadsheets.google.com/feeds/list/1IdisE82Z7nUyuEoPPYEh-f3JZsgtVBVQKA4hZQOmy1k/od6/public/values?alt=json","message":{"error":false,"text":""}},"varname":"allGroups","title":"ANI_ALLGroups_Index","activated":true,"name":"datafile","linkedtofile":true,"optional":true,"content":"","sendtojs":true}],"packs":["bootstrap","font-awesome","jquery","D3","Datatables"],"container":"mainpart","js":{"file":{"type":"","url":"","link":"","message":{"error":true,"text":"File not defined"}},"title":"Javascript","activated":true,"name":"js","linkedtofile":false,"optional":true,"content":"var regex=\"___\";\n\nvar notApplicable=\"rgb(253,219,208)\";\nvar notYetAnalyzed='rgb(197,54,7)'//'rgb(179,151,149)';\n//var notYetAnalyzed='rgb(230,248,192)'//'rgb(179,151,149)';\n//var noData='rgb(197,54,7)';//red\nvar noData='rgb(150,24,0)';//red\nvar emerging='rgb(213,142,67)';//orange\nvar inProgress='rgb(246,209,95)';//yellow\nvar mature='rgb(139,243,244)';//blue\nvar complete='rgb(152,218,29)'//'rgb(192,225,92)';//green\nvar na='Not Applicable';\nvar nya='Not yet analyzed';\nvar nd='No data';\nvar e='Emerging';\nvar ip='In progress';\nvar m='Mature';\nvar c='Complete';\n\nvar reference=[];\nvar referenceRow=\"Row: 2\";\nvar indicator=[];\nvar indicatorRow=\"Row: 5\";\nvar asbu=[];\nvar asbu_mid=[];\nvar objective_mid=[];\nvar asbuRow=\"Row: 4\";\nvar objective=[];\nvar objectiveRow=\"Row: 3\"\n\nvar phase='Phase 1';\nvar overviewTitle=\"\";\nvar region=\"apac\";\n\n//console.log(status)\n//console.log(objdata)\n\nvar thisuseremail=\"mmerens@icao.int\"\nif (typeof(getEmail)==\"function\") {\n    getEmail(function(e){\n        thisuseremail=e\n    })\n}\nif (getParameterByName(\"print\")) {\n    $(\".noprint\").hide()\n    $(\"#groupSelect\").val(getParameterByName(\"group\"))\n}\n\n\n$(document).ready(function(e){\n    populateGroupSelection();\n    var key=\"1qEze71wWAd1AWGQe3r1Fke61PR4cxJL0C2-IJKuRyL0\";\n    var title=\"The 10 regional priorities set in 2014 by APANPIRG\";\n    sel(key,title);\n    $(\"#phase_overview\").html(overviewTitle);\n    $(\"#region_subtitle\").html(region.toUpperCase()+\" Region\");\n    calculateOverView();\n    \n})\n\n\n\nfunction getParameterByName( name ){\n    var regexS = \"[\\\\?&]\"+name+\"=([^&]*)\", \n  regex = new RegExp( regexS ),\n  results = regex.exec( window.location.search );\n  if(results == null){\n    return \"\";\n  } else{\n    return decodeURIComponent(results[1].replace(/\\+/g, \" \"));\n  }\n}\n\n$(\"#printit\").click(function(e){\n    e.preventDefault();\n    //$.getJSON(\"https://v4p4sz5ijk.execute-api.us-east-1.amazonaws.com/anbdata/services/genpdf?callback=?\",\n    var file=\"http://quips.anbdata.com/project/prod/84274c6e50909d162651b1eb591b4433f641181b.html?print=true&group=\"+$(\"#groupSelect\").val()\n    $.getJSON(\"https://v4p4sz5ijk.execute-api.us-east-1.amazonaws.com/anbdata/services/genpdf?callback=?\",\n    {file:file,\n    key:\"ANIMP/\"+Math.round(new Date().getTime()/1000)+\"/animpreport.pdf\",\n    header:\"APAC Air Navigation Implementation Report\",\n    email:thisuseremail},function(res){\n        \n    })\n    alert(\"The report was sent to your email \"+$(\"#email\").val()+\". You may need to check your spam or junk folder.\")\n})\n\nfunction populateGroupSelection(){\n    resetSelection(\"#phase_1\");\n    resetSelection(\"#phase_2\");\n    $.each(objdata.feed.entry,function(index,value){\n        if(value.gsx$region.$t==region){\n            var t=value.gsx$group.$t;\n            var k=value.gsx$key.$t;\n            if(value.gsx$phase.$t==\"1\"){\n                $(\"#phase_1\").append($('<option>',{\n                    value:k+\", region: \"+region,\n                    text:t\n                }));\n            }else if(value.gsx$phase.$t==\"2\"){\n                $(\"#phase_2\").append($('<option>',{\n                    value:k+\", region: \"+region,\n                    text:t\n                }));\n            }\n        }\n    });\n}\n\nfunction populateObjectiveSelection(id,key,reference,objective){\n    var target=[];\n    for(var i=0;i<objective.length;i++){\n        if(reference.length>0){\n            var item=reference[i]+\" ,  \"+objective[i];\n            target.push({item:item,indi:indicator[i]});\n        }\n    }\n    for(var j=0;j<target.length;j++){\n        $(id).append($('<option>',{\n            value: key+regex+j,\n            subtitle:target[j].indi,\n            text:target[j].item\n        }));\n    }\n    objsel2()\n} \n\nfunction resetSelection(id){\n    $(id).empty();\n}\n\n$( \"#groupSelect\" ).change(function() {\n    var selected=$(':selected', this);\n    phase=selected.parent().attr('label');\n    calculateOverView();\n    $(\"#phase_overview\").html(overviewTitle);\n    var k=$(\"#groupSelect\").val();\n    var k1=[];\n    k1=k.split(\", region: \");\n    var key=k1[0];\n    var title=$('#groupSelect option:selected').text();\n    sel(key,title);\n});\n\n$('#region_select').change(function(){\n    region=$(\"select#region_select option:checked\").val();\n    var key;\n    var title;\n    if(region=='eurnat'){\n        $(\"#region_subtitle\").html(\"EUR / NAT Region\");\n    }else{\n        $(\"#region_subtitle\").html(region.toUpperCase()+\" Region\");\n    }\n    \n    phase='Phase 1';\n    if(region==\"apac\"){\n        $(\"#last_update\").text(\"Last updated Mar-2019\")\n        key=\"1qEze71wWAd1AWGQe3r1Fke61PR4cxJL0C2-IJKuRyL0\";\n        title=\"The 10 regional priorities set in 2014 by APANPIRG\";\n    }else if(region==\"mid\"){\n        $(\"#last_update\").text(\"Last updated May-2018\")\n        key=\"17AADmEOu2mDVnXZ2uq9DFqXwntRTO_xpNdqaRq8Hzl4\";\n        title=\"Airport Operations\";\n    }else if(region==\"sam\"){\n        $(\"#last_update\").text(\"Last updated May-2018\")\n        title=\"Regional\";\n        key=\"1Mq3YJGv7LWw0JHHomNW7DMKVB6fxGHCe1IQErOpTyDQ\";\n    }else if(region==\"eurnat\"){\n        $(\"#last_update\").text(\"Last updated May-2018\")\n        title=\"Globally Interoperable Systems and Data – Through Globally Interoperable System Wide Information Management\";\n        key=\"1HKaASOPMcfDsEQTPjhA6L6iJeh8SB4a1HUMLcr5R6Dk\";\n    }else if(region==\"nacc\"){\n        $(\"#last_update\").text(\"Last updated May-2018\")\n         title=\"Efficient flight path – through trajectory-based operations\";\n         key=\"1NcDXb6LAnaYUM3Bsde0DYNbJyTTsq-9VqaP1rIiKXO8\"\n    }else if(region==\"wacaf\"){\n        $(\"#last_update\").text(\"Last updated May-2018\")\n         title=\"Regional\";\n         key=\"1UCGI5Mj4MvwVE1nGikHEWwB7sbHq9_wZmwouZ_UEFYg\"\n    }\n    populateGroupSelection();\n    sel(key,title);\n    calculateOverView();\n    $(\"#phase_overview\").html(overviewTitle);\n});\n\nfunction sel(key,title) {\n    var subtitle\n    $(\"#gtitle\").text(title)\n    var url=\"https://spreadsheets.google.com/feeds/list/\" + key + \"/od6/public/values?alt=json\";\n    if(region==\"apac\"){\n        overviewTitle=\"Target: 100% by Nov. 2016 (Phase 1 Overview)\";\n        $('#status').show();\n        //$(\"#description_panel\").show();\n        drawStatus();\n        resetSelection('#template .objectiveSelect_1');\n        //$('#heatmap').show();\n       // $('#overview_body').show();\n        //$('#description').show();\n        //showDescription(alldata.filter(function(d){return d.key==key})[0].objectives);\n       // drawHeatmap(title,alldata.filter(function(d){return d.key==key})[0].objectives);\n       // populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n       $(\"#objectives\").empty();\n        $.getJSON(url,function(data){\n            $('#heatmap').show();\n            $('#overview_body').show();\n            $('#description').show();\n            showDescription(data.feed.entry);\n            drawHeatmap(title,data.feed.entry);\n            populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n        });\n    }else if(region==\"mid\"){\n        //$('#status').hide();\n        $('#status').show();\n        drawStatus();\n        resetSelection('#template .objectiveSelect_1');\n        $(\"#objectives\").empty();\n        $.getJSON(url,function(data){\n            $('#heatmap').show();\n            $('#overview_body').show();\n            $('#description').show();\n            showDescription(data.feed.entry);\n            drawHeatmapMID(title,data.feed.entry);\n            populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n        });\n    }else if(region==\"sam\"){\n        $('#status').hide();\n        //drawStatus();\n        resetSelection('#template .objectiveSelect_1');\n        $(\"#objectives\").empty();\n        $.getJSON(url,function(data){\n            $('#heatmap').show();\n            $('#overview_body').show();\n            $('#description').show();\n            showDescription(data.feed.entry);\n            drawHeatmapMID(title,data.feed.entry);\n            populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n        });\n    }else if(region==\"eurnat\"){\n        $('#status').hide();\n        //drawStatus();\n        resetSelection('#template .objectiveSelect_1');\n        $(\"#objectives\").empty();\n        $.getJSON(url,function(data){\n            drawHeatmapMID(title,data.feed.entry);\n            //$('#heatmap').hide();\n            $('#overview_body').show();\n            $('#description').show();\n            showDescription(data.feed.entry);\n            //reference=['INF04','ITY-ADQ','ATC17','ITY-COTR','ITY-FMTP','ITY-SPI','AOM19','NAV03','FCM01','FCM06'];\n            //objective=['Implement Integrated Breiefing','Ensure Quality of Aeronautical Data and Aeronautical Information','Electronic Dialogue as Automated Assistance to Controller During Coordination and Transfer','Implementation of Ground-Ground Automated Co-ordination Processes','APPLY A Common Flight Message Tasfer Protocol(FMTP)','Survellance Performance and Interoperablity','Implement Advanced Airspace Management','Implementation of P-RNAV','Implement Enhanced Tactical Flow Management Services','Traffic Complexity Assessment']\n            populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n        });\n    }else if(region==\"nacc\"){\n        $('#status').hide();\n        resetSelection('#template .objectiveSelect_1');\n        $(\"#objectives\").empty();\n         $.getJSON(url,function(data){\n            drawHeatmapMID(title,data.feed.entry);\n            $('#overview_body').show();\n            $('#description').show();\n            showDescription(data.feed.entry);\n            //drawHeatmap(title,data.feed.entry);\n            populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n        });\n    }else if(region==\"wacaf\"){\n        $('#status').hide();\n        resetSelection('#template .objectiveSelect_1');\n        $(\"#objectives\").empty();\n         $.getJSON(url,function(data){\n            drawHeatmapMID(title,data.feed.entry);\n            $('#overview_body').show();\n            $('#description').show();\n            showDescription(data.feed.entry);\n            populateObjectiveSelection('#template .objectiveSelect_1',key,reference,objective);\n        });\n    }\n}\n\nfunction objsel2(){\n        $(\"#objectives\").empty()\n        var value=$(\"#objectiveSelect_1\").val();\n        $(\"#template .objectiveSelect_1 option\").each(function(i,v){\n            var element=$(\"#template .panel\").clone()\n            element.appendTo(\"#objectives\")\n            element.attr(\"id\",\"obj\"+i)\n            element.find(\".map\").attr(\"id\",\"map\"+i)\n            element.show()\n            var value=$(v).attr(\"value\")\n            var title=$(v).text()\n            var subtitle=$(v).attr(\"subtitle\")\n            $(\"h2\",element).text(title)\n            var a=[];\n            a=value.split(regex);\n            var key=a[0];\n            var index=a[1];\n            var url=\"https://spreadsheets.google.com/feeds/list/\" + key + \"/od6/public/values?alt=json\";\n            if(region=='apac'){\n                var color={\n                    dataClasses: [ {\n                        from: -1,\n                        to: -1,\n                        color: \"rgb(197, 54, 7)\" ,\n                        name:nd\n                    },{\n                        from: -2,\n                        to: -2,\n                        color:\"darkgray\" ,\n                        name:nya\n                    },{\n                        from:-3,\n                        to: -3,\n                        color:\"rgb(227, 229, 224)\" ,\n                        name:na\n                    },  {\n                        from: 0,\n                        to: 33,\n                        color:\"rgb(246, 209, 95)\" ,\n                        name:e\n                    }, {\n                        from: 34,\n                        to: 67,\n                        color:\"rgb(211, 247, 160)\" ,\n                        name:ip\n                    }, {\n                        from: 68,\n                        to: 99,\n                        color:\"rgb(152, 218, 29)\" ,\n                        name:m\n                    }, {\n                        from: 100,\n                        to:100,\n                        color:\"green\" ,\n                        name:c\n                    }].reverse()\n                }\n                var plotline=[{\n                color: emerging, \n                value: 0, \n                width: 4,\n                label: {\n                    text: e,\n                    align: 'left',\n                }\n            },{\n                color:inProgress,\n                value:33,\n                width:4,\n                label: {\n                    text: ip,\n                    align: 'left',\n                }\n            },{\n                color:mature,\n                value:67,\n                width:4,\n                label: {\n                    text: m,\n                    align: 'left',\n                }\n            },{\n                color: complete, \n                value: 100, \n                width: 4,\n                label: {\n                    text: c,\n                    align: 'left',\n                }\n            }]\n                //drawBarChart(title,subtitle,index,alldata.filter(function(d){return d.key==key})[0].objectives,\"#\"+element.attr(\"id\"),plotline);\n                //drawMap(title,subtitle,index,alldata.filter(function(d){return d.key==key})[0].objectives,\"map\"+i,color);\n                $.getJSON(url,function(data){\n                    drawBarChart(title,subtitle,index,data.feed.entry,\"#\"+element.attr(\"id\"));\n                    drawMap(title,subtitle,index,data.feed.entry,\"map\"+i,color);\n                });\n                \n            }else if(region=='mid'){\n            /**\n             * No data: -1\n             * Not yet analyzed:-2\n             * No applicable:-3\n             * No plan:-4\n             * Planned:-5\n             * Partly Completed:-7\n             * Late:-8\n             **/\n            var color={\n                dataClasses: [{\n                        from: -1,\n                        to:-1,\n                        name: \"Missing data\",\n                        color:\"rgb(227, 229, 224)\"\n                    }, {\n                        from: -2,\n                        to: -2,\n                        name: \"Not started/not implemented\",\n                        color:\"rgb(197, 54, 7)\"\n                    },{\n                        from:-3,\n                        to: -3,\n                        name: \"Not applicable\",\n                        color: \"darkgray\"\n                    },{\n                        from:0,\n                        to:50,\n                        name:\"Partially Completed (50%-)\",\n                        color:\"rgb(246, 209, 95)\"\n                    }, {\n                        from:51,\n                        to:99,\n                        name:\"Partially Completed (50%+)\",\n                        color:\"rgb(152, 218, 29)\"\n                    },{\n                        from:100,\n                        to:100,\n                        name:\"Complete\",\n                        color:\"green\"\n                    }].reverse()\n                }\n                var plotline=[{\n                    color: emerging, \n                    value: 0, \n                    width: 4,\n                    label: {\n                        text: 'No data or not yet analyzed',\n                        align: 'left',\n                    }\n                },{\n                    color:inProgress,\n                    value:50,\n                    width:4,\n                    label: {\n                        text: \"Partially complete (50%)\",\n                        align: 'left',\n                    }\n                },{\n                    color: complete, \n                    value: 100, \n                    width: 4,\n                    label: {\n                        text: c,\n                        align: 'left',\n                    }\n                }]\n                $.getJSON(url,function(data){\n                    drawBarChart(title,subtitle,index,data.feed.entry,\"#\"+element.attr(\"id\"),plotline);\n                    drawMap(title,subtitle,index,data.feed.entry,\"map\"+i,color);\n                });\n            }else if(region=='sam'){\n                var color={\n                    dataClasses: [ {\n                        from: -1,\n                        to: -1,\n                        color: \"rgb(227, 229, 224)\",\n                        name:\"No data\"\n                    },{\n                        from: -2,\n                        to: -2,\n                        color:\"rgb(197, 54, 7)\",\n                        name:'Not yet analyzed'\n                    },{\n                        from:-3,\n                        to: -3,\n                        color:\"darkgray\",\n                        name:\"Not applicable\"\n                    },  {\n                        from: 0,\n                        to: 33,\n                        color:\"rgb(246, 209, 95)\",\n                        name:e\n                    }, {\n                        from: 34,\n                        to: 67,\n                        color:\"rgb(211, 247, 160)\",\n                        name:ip\n                    }, {\n                        from: 68,\n                        to: 99,\n                        color:\"rgb(152, 218, 29)\",\n                        name:m\n                    }, {\n                        from: 100,\n                        to:100,\n                        color:\"green\",\n                        name:c\n                    }].reverse()\n                };\n                var plotline=[{\n                    color: emerging, \n                    value: 0, \n                    width: 4,\n                    label: {\n                        text: e,\n                        align: 'left',\n                    }\n                },{\n                    color:inProgress,\n                    value:33,\n                    width:4,\n                    label: {\n                        text: ip,\n                        align: 'left',\n                    }\n                },{\n                    color:mature,\n                    value:67,\n                    width:4,\n                    label: {\n                        text: m,\n                        align: 'left',\n                    }\n                },{\n                    color: complete, \n                    value: 100, \n                    width: 4,\n                    label: {\n                        text: c,\n                        align: 'left',\n                    }\n                }];\n                $.getJSON(url,function(data){\n                    drawBarChart(title,subtitle,index,data.feed.entry,\"#\"+element.attr(\"id\"),plotline);\n                    drawMap(title,subtitle,index,data.feed.entry,\"map\"+i,color);\n                });\n            }\n            else if(region=='eurnat'){\n                var color={\n                    dataClasses: [ {\n                        from: 100,\n                        to: 100,\n                        color: \"green\",\n                        name:\"Completed\"\n                    },{\n                        from: 0,\n                        to: 99,\n                        color: complete,\n                        name:\"Partly Completed\"\n                    },{\n                        from: -5,\n                        to: -5,\n                        color: \"rgb(211, 247, 160)\",\n                        name:\"Planned\"\n                    },{\n                        from: -4,\n                        to: -4,\n                        color: notYetAnalyzed,\n                        name:\"No Plan\"\n                    },{\n                        from: -8,\n                        to: -8,\n                        color: inProgress,\n                        name:\"Late\"\n                    },{\n                        from: -3,\n                        to: -3,\n                        color: 'darkgray',\n                        name:\"Not applicable\"\n                    },{\n                        from: -1,\n                        to: -1,\n                        color: \"rgb(227, 229, 224)\",\n                        name:\"Missing Data\"\n                    }\n                ]};\n                //$('.barchart').hide();\n                $.getJSON(url,function(data){\n                    drawBarChart(title,subtitle,index,data.feed.entry,\"#\"+element.attr(\"id\"));\n                    drawMap(title,subtitle,index,data.feed.entry,\"map\"+i,color);\n                });\n            }else if(region=='nacc'){\n                var color={\n                dataClasses: [{\n                        from: -1,\n                        to:-1,\n                        name: \"No data\",\n                        color:\"rgb(227, 229, 224)\"\n                    }, {\n                        from: -2,\n                        to: -2,\n                        name: \"Not started/not implemented\",\n                        color:\"rgb(197, 54, 7)\"\n                    },{\n                        from:-3,\n                        to: -3,\n                        name: \"Not applicable\",\n                        color: \"darkgray\"\n                    },{\n                        from:0,\n                        to:50,\n                        name:\"Partially Completed (50%-)\",\n                        color:\"rgb(246, 209, 95)\"\n                    }, {\n                        from:51,\n                        to:99,\n                        name:\"Partially Completed (50%+)\",\n                        color:\"rgb(152, 218, 29)\"\n                    },{\n                        from:100,\n                        to:100,\n                        name:\"Complete\",\n                        color:\"green\"\n                    }].reverse()\n                }\n                var plotline=[{\n                    color: emerging, \n                    value: 0, \n                    width: 4,\n                    label: {\n                        text: 'No data or not yet analyzed',\n                        align: 'left',\n                    }\n                },{\n                    color:inProgress,\n                    value:50,\n                    width:4,\n                    label: {\n                        text: \"Partially complete (50%)\",\n                        align: 'left',\n                    }\n                },{\n                    color: complete, \n                    value: 100, \n                    width: 4,\n                    label: {\n                        text: c,\n                        align: 'left',\n                    }\n                }]\n                $.getJSON(url,function(data){\n                    drawBarChart(title,subtitle,index,data.feed.entry,\"#\"+element.attr(\"id\"),plotline);\n                    drawMap(title,subtitle,index,data.feed.entry,\"map\"+i,color);\n                });\n            }\n            else if(region==\"wacaf\"){\n                var color={\n                dataClasses: [{\n                        from: -1,\n                        to:-1,\n                        name: \"No data\",\n                        color:\"rgb(227, 229, 224)\"\n                    }, {\n                        from: -2,\n                        to: -2,\n                        name: \"Not started/not implemented\",\n                        color:\"rgb(197, 54, 7)\"\n                    },{\n                        from:-3,\n                        to: -3,\n                        name: \"Not applicable\",\n                        color: \"darkgray\"\n                    },{\n                        from:0,\n                        to:50,\n                        name:\"Partially Completed (50%-)\",\n                        color:\"rgb(246, 209, 95)\"\n                    }, {\n                        from:51,\n                        to:99,\n                        name:\"Partially Completed (50%+)\",\n                        color:\"rgb(152, 218, 29)\"\n                    },{\n                        from:100,\n                        to:100,\n                        name:\"Complete\",\n                        color:\"green\"\n                    }].reverse()\n                }\n                var plotline=[{\n                    color: emerging, \n                    value: 0, \n                    width: 4,\n                    label: {\n                        text: 'No data or not yet analyzed',\n                        align: 'left',\n                    }\n                },{\n                    color:inProgress,\n                    value:50,\n                    width:4,\n                    label: {\n                        text: \"Partially complete (50%)\",\n                        align: 'left',\n                    }\n                },{\n                    color: complete, \n                    value: 100, \n                    width: 4,\n                    label: {\n                        text: c,\n                        align: 'left',\n                    }\n                }]\n                $.getJSON(url,function(data){\n                    drawBarChart(title,subtitle,index,data.feed.entry,\"#\"+element.attr(\"id\"),plotline);\n                    drawMap(title,subtitle,index,data.feed.entry,\"map\"+i,color);\n                });\n            }\n        })\n}\n\nfunction drawHeatmapMID(title,data){\n    var x_axis=[];\n    var y_axis=[];\n    var series=[];\n   \n    asbu=[];\n    objective=[];\n    reference=[];\n \n    var color;\n    var y;\n    if(region==\"eurnat\"){\n        y=52-1;\n        color=[\n            {\n               from:100,\n               to:100,\n               name:\"Completed\",\n               color:\"green\"\n            },{\n                from:0,\n                to:99,\n                name:\"Partly Completed\",\n                color:\"rgb(152, 218, 29)\"\n            },{\n                from:-5,\n                to:-5,\n                name:\"Planned\",\n                color:\"rgb(211, 247, 160)\"\n            },{\n                from:-4,\n                to:-4,\n                name:\"No Plan\",\n                color:\"rgb(197, 54, 7)\"\n            },{\n                from:-8,\n                to:-8,\n                name:\"Late\",\n                color:\"rgb(246, 209, 95)\"\n            },{\n                from:-3,\n                to:-3,\n                name:\"Not applicable\",\n                color:\"darkgray\"\n            },{\n                from:-1,\n                to:-1,\n                name:\"Missing Data\",\n                color:\"rgb(227, 229, 224)\"\n            }    \n        \n        ]\n    }else if(region==\"sam\"){\n        y=14-1;\n        color=[{\n            from: -1,\n            to:-1,\n            name: \"No data\",\n            color:\"rgb(227, 229, 224)\"\n        }, {\n            from: -2,\n            to: -2,\n            name: \"Not yet analyzed/No Plan\",\n            color:\"rgb(197, 54, 7)\"\n        },{\n            from:-3,\n            to: -3,\n            name: \"Not applicable\",\n            color: \"darkgray\"\n        },{\n            from:0,\n            to:33,\n            name:e,\n            color:\"rgb(246, 209, 95)\"\n        },{\n            from:34,\n            to:67,\n            name:ip,\n            color:\"rgb(211, 247, 160)\"\n        },{\n            from:68,\n            to:99,\n            name:m,\n            color:\"rgb(152, 218, 29)\"\n        },{\n            from:100,\n            to:100,\n            name:c,\n            color:\"green\"\n        }]\n    }\n    else{\n        if(region=='nacc'){\n            y=21-1\n        }else if(region==\"wacaf\"){\n            y=25-1;\n        }\n        else{\n            y=15-1;\n        }\n        \n        color=[{\n                from: -1,\n                to:-1,\n                name: \"Missing data\",\n                color:\"rgb(227, 229, 224)\"\n            }, {\n                from: -2,\n                to: -2,\n                name: \"Not started/not implemented\",\n                color:\"rgb(197, 54, 7)\"\n            },{\n                from:-3,\n                to: -3,\n                name: \"Not applicable\",\n                color: \"darkgray\"\n            },{\n                from:0,\n                to:50,\n                name:\"Partially Completed (50%-)\",\n                color:\"rgb(246, 209, 95)\"\n            },{\n                from:51,\n                to:99,\n                name:\"Partially Completed (50%+)\",\n                color:\"rgb(152, 218, 29)\"\n            },{\n                from:100,\n                to:100,\n                name:c,\n                color:\"green\"\n            }].reverse()\n    }\n   \n    $.each(data,function(index,value){\n        var a = value.title.$t;\n        var b=value.content.$t;\n        var c=[];\n        \n        if(a==asbuRow){\n            c=[];\n            c=b.split(\", _\");\n            asbu.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                asbu.push(c[i].substring(7));\n            }\n        }else if(a==objectiveRow){\n            c=[];\n            c=b.split(\", _\");\n            objective.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                objective.push(c[i].substring(7));\n            }\n        }else if(a==referenceRow){\n            c=[];\n            c=b.split(\", _\");\n            reference.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                reference.push(c[i].substring(7));\n            }\n        }else if(a.indexOf(\"Row\")<0){\n            y_axis.push(a);\n            //add series\n            c=[];\n            c=b.split(\", \");\n            var e=[];\n            var d;\n            for(var i=1;i<c.length-1;i++){\n                e=[];\n                d=c[i].substring(8);//value\n                e.push(i-1);\n                e.push(y);\n                e.push(getValue(d));\n                if(region!='mid'){\n                    series.push({x:i-1,y:y,value:getValue(d),dataLabels:{enabled:(getValue(d)>=0)}});\n                }else{\n                    series.push({x:i-1,y:y,value:getValue(d),dataLabels:{enabled:false}});\n                }\n                \n            }\n            y--;\n           \n        }\n     \n    });\n    \n    var x_axis=reference;\n    if(region==\"wacaf\"){\n        x_axis=asbu\n    }\n\n    y_axis.reverse();\n    Highcharts.chart('heatmap', {\n        chart: {\n            type: 'heatmap',\n            marginTop: 100,\n            marginBottom: 60,\n            plotBorderWidth: 1\n        },\n        title: {\n            text: title\n        },\n\n        credits:{enabled:false},\n        \n        xAxis: {\n            categories: x_axis,\n            opposite:true\n        },\n        yAxis: {\n            title:{text:\"\"},\n            categories: y_axis\n        },\n        colorAxis: {\n            dataClasses:color\n        },\n        legend: {\n            //align: 'left',\n            layout: 'horizontal',\n            margin: 5,\n            verticalAlign: 'left',\n            y: 900,\n            symbolHeight: 12,\n            symbolWidth: 12,\n            symbolRadius: 6,\n            itemWidth:120\n        },\n        tooltip: {\n            formatter: function () {\n                /**\n                 * No data: -1\n                 * Not yet analyzed:-2\n                 * No applicable:-3\n                 * No plan:-4\n                 * Planned:-5\n                 * Partly Completed:-7\n                 * Late:-8\n                 **/\n                if(region=='mid'){\n                    return '<b>' + this.series.yAxis.categories[this.point.y] + \"<br>\"+this.series.xAxis.categories[this.point.x]+'<br>'\n                }else{\n                    var t=this.point.value + '%</b> Implemented'\n                    if (this.point.value==-1) t=\"No data\"\n                    if (this.point.value==-2) t=\"Not yet analyzed\"\n                    if (this.point.value==-3) t=\"Not applicable\"\n                    if (this.point.value==-4) t=\"No plan\"\n                    if (this.point.value==-5) t=\"Planned\"\n                    if (this.point.value==-7) t=\"Partly Completed\"\n                    if (this.point.value==-8) t=\"Late\"\n                    return '<b>' + this.series.yAxis.categories[this.point.y] + \"<br>\"+t+'<br>' ;\n                }\n                \n            }\n        },\n        series: [{\n            name: 'Implementation',\n            borderWidth: 1,\n            data: series,\n            dataLabels: {\n                enabled: false,\n                color: '#000000'\n            }\n        }]\n\n    });\n}\n\nfunction drawMap(title,subtitle,index,data,element,color){\n//console.log(element)\n    //Highcharts.data({\n        //googleSpreadsheetKey: '0AoIaUO7wH1HwdFJHaFI4eUJDYlVna3k5TlpuXzZubHc',\n\n        //parsed: function (columns) {\n            var series=[];\n            var allcodes=[]\n            $.each(data,function(i,e){\n                var a = e.title.$t;\n                var b = e.content.$t;\n                if(a.indexOf(\"Row\")<0){\n                    var code;\n                    var value;\n                    var name=a;\n                    var c=[];\n                    c=b.split(\", \");\n                    if(c[parseInt(index)+1]!=null&&c[parseInt(index)+1].indexOf(\"?\")<0){\n                        value=getValue(c[parseInt(index)+1].substring(8));\n                        code=c[c.length-1].substring(6);\n                        allcodes.push(code.toUpperCase());\n                        if(code!='nc'){\n                            series.push({\n                            code:code.toUpperCase(),\n                            value:parseInt(value),\n                            name:name\n                            });\n                        }\n                    \n                    }\n                }\n            });\n            /**if(region=='apac'){\n                $.each(apac.filter(function(d){return allcodes.indexOf(d.iso_2_code)<0}),function(i,e){\n                series.push({\n                        code:e.iso_2_code,\n                        value:0,\n                        name:e.UN_state_name\n                    });\n            })\n            }**/\n            \n            Highcharts.mapChart(element, {\n                chart: {\n                    borderWidth: 0,\n                    events: {\n                        load: function () {\n                            if(region=='apac'){\n                                this.mapZoom(0.5, 10000,0);\n                            }else if(region=='mid'){\n                                this.mapZoom(0.3, 5200);\n                            }else if(region=='sam'){\n                                this.mapZoom(0.3,2500,30);\n                            }else if(region=='eurnat'){\n                                this.mapZoom(0.5,5000);\n                            }else if(region=='nacc'){\n                                this.mapZoom(0.5,2000);\n                            }else if(region=='wacaf'){\n                                this.mapZoom(0.4,5000,0);\n                            }\n                        }\n                    }\n                },\n                colors: ['red', 'orange', 'yellow','green',\n                    'blue', 'purple', 'grey'],\n\n                title: {\n                    text: title\n                },\n                subtitle: {\n                    text: subtitle\n                },\n                mapNavigation: {\n                    enabled: true\n                },\n\n                legend: {\n                    title: {\n                        text: 'Implementation:',\n                        style: {\n                            color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'\n                        }\n                    },\n                    align: 'left',\n                    verticalAlign: 'bottom',\n                    floating: true,\n                    layout: 'vertical',\n                    valueDecimals: 0,\n                    backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'rgba(255, 255, 255, 0.85)',\n                    symbolRadius: 0,\n                    symbolHeight: 14\n                },\n        tooltip: {\n            formatter: function () {\n                var t=this.point.value + '%</b> Implemented'\n                if (this.point.value==-1) t=\"No data\"\n                if (this.point.value==-3) t=\"Not applicable\"\n                if (this.point.value==-2) t=\"Not yet analyzed\"\n                if (this.point.value==-4) t=\"No plan\"\n                if (this.point.value==-5) t=\"Planned\"\n                if (this.point.value==-6) t=\"Completed\"\n                if (this.point.value==-7) t=\"Partly Completed\"\n                if (this.point.value==-8) t=\"Late\"\n                return '<b>' + this.point.name + \"<br>\"+t+'<br>' ;\n            }\n        },\n        colorAxis:color,\n                plotOptions:{\n                    map:{\n                       states:{hover:{\n                                brightness:0,\n                                //enabled:false,\n                                borderColor:\"gray\",\n                                borderWidth:4\n                    }},\n                    }\n                },\n                series: [{\n                    data: series,\n                    mapData: mapdata,\n                    joinBy: ['iso-a2', 'code'],\n                    animation: true,\n                    name: 'Implementation:',\n                    tooltip: {\n                        valueSuffix: '%'\n                    }\n                }]\n            \n            },function(chart){\n                if(region==\"apac\"){\n                    chart.renderer.text('Disclaimer: Background maps are the property of third-parties and are used in herein under license. The data and labels contained in these third-party maps are not approved by and do not reflect the official position of either ICAO or the United Nations. They are included for references purposes only.', 250, 700)\n                    .css({\n                        width: 550,\n                        color: 'black',\n                        fontStyle:'italic',\n                        fontSize: '10px'\n                    })\n                    .add();\n                }\n            });\n        //}\n    //});\n}\n\nfunction drawBarChart(title,subtitle,index,data,element,pLine){\n    var series=[];\n    $(element).find(\".barchart\").empty();\n    $.each(data,function(i,e){\n        var a = e.title.$t;\n        var b = e.content.$t;\n        if(a.indexOf(\"Row\")<0){\n            var item=[];\n            var c=[];\n            c=b.split(\", \");\n            if(c[parseInt(index)+1]!=null&&c[parseInt(index)+1].indexOf(\"?\")<0){\n                var d=getValue(c[parseInt(index)+1].substring(8));\n                if(d!=-3){\n                    item.push(a);\n                    item.push(parseInt(d));\n                    series.push(item);\n                }\n            }\n            \n        }\n    });\n    series.sort(function(a,b){\n        return a[1] - b[1];\n    });\n    \n    if(series.length>0){\n        $(element).find(\".barchart\").highcharts({\n        chart: {\n            type: 'column'\n        },\n                credits:{enabled:false},\n        title: {\n            text: title\n        },\n        subtitle: {\n            text: subtitle\n        },\n        colors: ['rgb(134,179,180)'],\n        xAxis: {\n            type: 'category',\n            labels: {\n                rotation: -45,\n                style: {\n                    fontSize: '10px',\n                    fontFamily: 'Verdana, sans-serif'\n                }\n            }\n        },\n        yAxis: {\n            min: 0,\n            max: 100,\n            labels:{format:\"{value}%\"},\n            title: {\n                text: 'Implementation (%)'\n            },\n            plotLines: pLine,\n        },\n        legend: {\n            enabled: false\n        },\n        series: [{\n            name: 'Implementation',\n            data: series,\n            dataLabels: {\n                enabled: true,\n                rotation: -90,\n                color: '#FFFFFF',\n                align: 'right',\n                format: '{point.y}', \n                y: 10, \n                style: {\n                    fontSize: '13px',\n                    fontFamily: 'Verdana, sans-serif'\n                }\n            }\n        }]\n    });\n        $(element).find(\".barchart\").show();\n    }else{\n        $(element).find(\".barchart\").hide();\n    }\n}\n\nfunction showDescription(data){\n    $(\"#description\").empty();\n    $.each(data,function(index,value){\n        var a = value.title.$t;\n        var b = value.content.$t;\n        var c=[];\n        if(a==referenceRow){\n            reference=[];\n            c=b.split(\", _\");\n            reference.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                reference.push(c[i].substring(7));\n            }\n        }else if(a==indicatorRow){\n            indicator=[];\n            c=b.split(\", _\");\n            indicator.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                indicator.push(c[i].substring(7));\n            }\n        }else if(a==asbuRow){\n            asbu=[];\n            c=b.split(\", _\");\n            asbu.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                asbu.push(c[i].substring(7));\n            }\n        }else if(a==objectiveRow){\n            objective=[];\n            c=b.split(\", _\");\n            objective.push(c[0].substring(8));\n            for(var i=1;i<c.length;i++){\n                objective.push(c[i].substring(7));\n            }\n        }\n    });\n    var target=[];\n    for(var j=0;j<reference.length;j++){\n        var t=[];\n        t.push(reference[j]);\n        t.push(objective[j]);\n        t.push(asbu[j]);\n        t.push(indicator[j]);\n        target.push(t);\n    }\n    $('#description').DataTable({\n        \"iDisplayLength\":50,\n        destroy: true,\n        data: target,\n        columns: [\n            { title: \"Reference\" },\n            { title: \"Objective\" },\n            { title: \"ASBU Module\" },\n            { title: \"Indicator\" },\n        ],\n        \"fnRowCallback\": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {\n                $(nRow).css('text-align', 'center');\n            if(iDisplayIndex%2==1){\n                $(nRow).css('background-color', 'white');\n            }\n            else {\n                $(nRow).css('background-color', '#ddd');\n            }\n        }\n    });\n}\n\n/**\n * No data: -1\n * Not yet analyzed:-2\n * No applicable:-3\n * No plan:-4\n * Planned:-5\n * Partly Completed:-7\n * Late:-8\n **/\nfunction getValue(data){\n    var value;\n    if(data.indexOf(\"data\")>=0 || data.indexOf(\"Data\")>=0){\n        value=-1;\n    }else if(data.indexOf(\"analysed\")>=0 ||data.indexOf(\"Implemented\")>=0){\n        value=-2;\n    }else if(data.indexOf(\"pplicable\")>=0 || data.indexOf(\"Analyzed\")>=0){\n        value=-3;\n    }else if(data.indexOf(\"No plan\")>=0){\n        value=-4\n    }else if(data.indexOf(\"Planned\")>=0){\n        value=-5\n    }else if(data.indexOf(\"Partly Completed\")>=0){\n        value=-7\n    }else if(data.indexOf(\"Late\")>=0){\n        value=-8\n    }else if(data.indexOf(\"%\")>=0){\n        var a=[];\n        a=data.split(\"%\");\n        value=a[0];\n    }else{\n        if(data.indexOf(\"Completed\")>=0){\n            value=100;\n        }\n        value=parseFloat(data)*100;\n    }\n    return value;\n}\n\nfunction drawHeatmap(title,data){\n    var x_axis=[];\n    var y_axis=[];\n    var series=[];\n    var countryTotal=0;\n    //console.log(data.length)\n    if(region=='apac'){\n        countryTotal=data.length - 4;\n    }else if(region=='sam'){\n        countryTotal=14;\n    }else if(region=='eurnat'){\n        countryTotal=52;\n    }\n    var y=countryTotal-1;\n   \n    $.each(data,function(index,value){\n        var a = value.title.$t;\n        if(a.indexOf(\"Row\")<0){\n            \n            //add series\n            var b=value.content.$t;\n            var c=[];\n            c=b.split(\", \");\n            var e=[];\n            var d;\n            if(b.indexOf(\"?\")<0){\n                y_axis.push(a);\n                for(var i=1;i<c.length-1;i++){\n                    e=[];\n                    d=c[i].substring(8);//value\n                    e.push(i-1);\n                    e.push(y);\n                    e.push(getValue(d));\n                    series.push({x:i-1,y:y,value:getValue(d),dataLabels:{enabled:(getValue(d)>=0)}});\n                }\n                y--;\n            }\n            \n        }\n    });\n    y_axis.reverse();\n    Highcharts.chart('heatmap', {\n        chart: {\n            type: 'heatmap',\n            marginTop: 80,\n            marginBottom: 60,\n            plotBorderWidth: 1\n        },\n        title: {\n            text: title\n        },\n\n        credits:{enabled:false},\n        \n        xAxis: {\n            categories: reference,\n            opposite:true\n        },\n        yAxis: {\n            title:{text:\"\"},\n            categories: y_axis\n        },\n        colorAxis: {\n            dataClasses:[{\n                            from: -1,\n                            to:-1,\n                            name: nd,\n                            color:\"rgb(197, 54, 7)\"//\"rgb(227, 229, 224)\" noData\n                        }, {\n                            from: -2,\n                            to: -2,\n                            name: nya,\n                            color:\"darkgray\"//\"darkgray\" notYetAnalyzed\n                        },{\n                            from:-3,\n                            to: -3,\n                            name: na,\n                            color: \"rgb(227, 229, 224)\" //\"rgb(197, 54, 7)\" notApplicable\n                        },{\n                            from:0,\n                            to:33,\n                            name:e,\n                            color:\"rgb(246, 209, 95)\" //\"rgb(246, 209, 95)\" emerging\n                        },{\n                            from:34,\n                            to:67,\n                            name:ip,\n                            color:\"rgb(211, 247, 160)\"//\"rgb(211, 247, 160)\" inProgress\n                        },{\n                            from:68,\n                            to:99,\n                            name:m,\n                            color:\"rgb(152, 218, 29)\"//\"rgb(152, 218, 29)\" mature\n                        },{\n                            from:100,\n                            to:100,\n                            name:c,\n                            color:\"green\" //\"green\" complete\n                        }].reverse()\n        },\n        legend: {\n            align: 'left',\n            layout: 'horizontal',\n            margin: -10,\n            verticalAlign: 'left',\n            y: 900,\n            symbolHeight: 12,\n            symbolWidth: 12,\n            symbolRadius: 6,\n            itemWidth:120\n        },\n        tooltip: {\n            formatter: function () {\n                var t=this.point.value + '%</b> Implemented'\n                if (this.point.value==-1) t=\"No data\"\n                if (this.point.value==-2) t=\"Not yet analyzed\"\n                if (this.point.value==-3) t=\"Not applicable\"\n                return '<b>' + this.series.yAxis.categories[this.point.y] + \"<br>\"+t+'<br>' ;\n            }\n        },\n        series: [{\n            name: 'Implementation',\n            borderWidth: 1,\n            data: series,\n            dataLabels: {\n                enabled: true,\n                color: '#000000'\n            }\n        }]\n\n    });\n}\n\nfunction getAllDataOfRegion(region){\n    \n}\n\nfunction calculateOverView(){\n    var data;\n    var target_row;\n    current_overview=[];\n    var phase=\"1\"\n    if(region==\"apac\"){\n        target_row=referenceRow;\n        if(phase.indexOf('Phase 1')>=0){\n            overviewTitle=\"Target: 100% by Nov. 2016 (Phase 1 Overview)\";\n            //data=apac_phase1_all_data;\n        }else if(phase.indexOf('Phase 2')>=0){\n            overviewTitle=\"Target: 100% by Nov. 2019 (Phase 2 Overview)\";\n            phase=\"2\"\n            //data=apac_phase2_all_data;\n        }\n    }else if(region==\"mid\"){\n        target_row=referenceRow;\n        overviewTitle=\"\";\n        //if(phase.indexOf('Phase 1')>=0){\n            //data=mid_phase1_all_data;\n        //}else if(phase.indexOf('Phase 2')>=0){\n            \n       // }\n    }else if(region==\"sam\"){\n        target_row=referenceRow;\n        overviewTitle=\"\";\n        //if(phase.indexOf('Phase 1')>=0){\n            //data=sam_phase1_all_data;\n        //}else if(phase.indexOf('Phase 2')>=0){\n            \n        //}\n    }else if(region=='eurnat'){\n        target_row=referenceRow;\n        overviewTitle=\"\";\n        //if(phase.indexOf('Phase 1')>=0){\n            //data=eurant_phase1_all_data;\n        //}\n    }else if(region==\"nacc\"){\n        target_row=referenceRow;\n        overviewTitle=\"\";\n        //data=nacc_phase1_all_data;\n    }else if(region==\"wacaf\"){\n        target_row=asbuRow;\n        if(phase.indexOf('Phase 1')>=0){\n            overviewTitle=\"Target: 100% by Nov. 2016 (Phase 1 Overview)\";\n           // data=wacaf_phase1_all_data;\n        }else if(phase.indexOf('Phase 2')>=0){\n            overviewTitle=\"Target: 100% by Nov. 2019 (Phase 2 Overview)\";\n            phase=\"2\"\n           // data=wacaf_phase2_all_data;\n        }\n    }\n    //console.log(allGroups)\n    $.each(allGroups.feed.entry,function(index,value){\n        if(value.gsx$region.$t==region){\n            if(value.gsx$phase.$t==phase){\n                var k=value.gsx$key.$t;\n                var link=\"https://spreadsheets.google.com/feeds/list/\" + k + \"/od6/public/values?alt=json\";\n                $.getJSON(link,function(data){\n                    var ball_chart_complete=0;\n                    var ball_chart_no_data=0;\n                    var ball_chart_between=0;\n                    var ball_chart_all=0;\n                    \n                    var country_list=[];\n                    var indicator_list=[];\n                    var objective_list=[];\n                    var additional=[];    \n                    \n                    var country_complete=[];\n                    var country_all=[];\n                    var indicator_complete=new Array(100);\n                    var country_all_remove_not_applicable=new Array(100);\n                    var indicator_all_remove_not_applicable=new Array(100);\n                    var l=100;\n                    while(l--){\n                        indicator_complete[l]=0;\n                        country_all_remove_not_applicable[l]=0;\n                        indicator_all_remove_not_applicable[l]=0;\n                    }\n                    var indicator_all=[];\n                    \n                    var country_num;\n                    var indicator_num;\n                    \n                    var count_country_complete=0;\n                    $.each(data.feed.entry,function(index,value){\n                        var title=value.title.$t;\n                        var values=value.content.$t;\n                        if(title==target_row){\n                            var items=[];\n                            items=values.split(\", _\");\n                            var indicator;\n                            for(var i=0;i<items.length;i++){\n                                if(i==0){\n                                    indicator=items[i].substring(8);\n                                    indicator_list.push(indicator);\n                                }else{\n                                    indicator=items[i].substring(7);\n                                    indicator_list.push(indicator);\n                                }\n                            }\n                        }else if (title==objectiveRow){\n                            var items=[];\n                            items=values.split(\", _\");\n                            var objective;\n                            for(var i=0;i<items.length;i++){\n                                if(i==0){\n                                    objective=items[i].substring(8);\n                                    objective_list.push(objective);\n                                }else{\n                                    objective=items[i].substring(7);\n                                    objective_list.push(objective);\n                                }\n                            }\n                            \n                        }\n                        if(title.indexOf(\"Row\")<0){\n                            count_country_complete=0;\n                            country_list.push(title);\n                            var items=[]; \n                            items=values.split(\", _\");\n                            for(var i=1;i<items.length;i++){\n                                if(items[i].indexOf(\"pplicable\")<0){\n                                    ball_chart_all++;\n                                    country_all_remove_not_applicable[index-4]++\n                                    indicator_all_remove_not_applicable[i-1] ++\n                                    var item=items[i].substring(7);\n                                    if(item.indexOf(\"100\")>=0){\n                                        indicator_complete[i-1]++;\n                                        count_country_complete++;\n                                        ball_chart_complete++;\n                                    }else if(item.indexOf(\"%\")>=0){\n                                        ball_chart_between++;\n                                    }else{\n                                        ball_chart_no_data++;\n                                    }\n                                }\n                            }\n                            country_complete.push(count_country_complete);\n                        }\n                        \n                    });\n                    country_num=country_list.length;\n                    indicator_num=indicator_list.length;\n                    for(var i=0;i<country_num;i++){\n                        var item=[];\n                        item.push(country_list[i]);\n                        item.push(((country_complete[i]/country_all_remove_not_applicable[i]).toFixed(4))*100);\n                        if(country_complete[i]/country_all_remove_not_applicable[i]>=0){\n                            country_all.push(item);\n                        }\n                        \n                    }\n                    country_all.sort(function(a,b){\n                        return a[1] - b[1];\n                    });\n                    for(var i=0;i<indicator_num;i++){\n                        var item=[];\n                        item.push(indicator_list[i]);\n                        item.push(((indicator_complete[i]/indicator_all_remove_not_applicable[i]).toFixed(4))*100);\n                        if(indicator_complete[i]/indicator_all_remove_not_applicable[i]>=0){\n                            indicator_all.push(item);\n                            additional.push(objective_list[i]);\n                        }\n                    }\n                    indicator_all.slice(0,indicator_num);\n                    //indicator_all.sort(function(a,b){\n                    //    return a[1] - b[1];\n                    //});\n                \n                    for(var i=0;i<indicator_all.length-1;i++){\n                        var stop=indicator_all.length-1-i;\n                        for(var j=0;j<stop;j++){\n                            if(indicator_all[j][1]>indicator_all[j+1][1]){\n                                var temp=indicator_all[j];\n                                indicator_all[j]=indicator_all[j+1];\n                                indicator_all[j+1]=temp;\n                                \n                                var temp1=additional[j];\n                                additional[j]=additional[j+1];\n                                additional[j+1]=temp1;\n                            }\n                        }\n                    }\n                    \n                    var subtitle1=\"% of completed objectives per State for \"+region.toUpperCase();\n                    var subtitle2=\"% of completed states per objective for \"+region.toUpperCase();\n                    \n                    drawOverviewBarChart1(\"barchart_overview_countries\",\"Percentage of completed objectives by States\",subtitle1,\"Completed Objectives (%)\",country_all);\n                    drawOverviewBarChart(\"barchart_overview_indicators\",\"Percentage of completed objectives by indicators\",subtitle2,\"Completed States (%)\",indicator_all,additional);\n                    drawCircles(parseFloat((ball_chart_no_data/ball_chart_all*100).toFixed(1)),parseFloat((ball_chart_between/ball_chart_all).toFixed(3))*100,parseFloat((ball_chart_complete/ball_chart_all))*100);\n                })\n            }\n        } \n    })\n    \n}\n\nfunction drawOverviewBarChart1(id,title,subtitle,y_title,list,additional){\n    var x=[];\n    var y=[];\n    $.each(list,function(index,value){\n        x.push(value[0]);\n        y.push(value[1]);\n    });\n    Highcharts.chart(id, {\n    chart: {\n        type: 'column'\n    },\n    credits:{\n        enabled:false\n        \n    },\n    title: {\n        text: title\n    },\n    subtitle: {\n        text: subtitle\n    },\n    //colors: ['rgb(137, 165, 78)'],\n    colors: ['rgb(134,179,180)'],\n    xAxis: {\n        categories: x,\n        //crosshair: true\n        labels: {\n            rotation: -45,\n            style: {\n                fontSize: '10px',\n                fontFamily: 'Verdana, sans-serif'\n            }\n        }\n    },\n    yAxis: {\n        min: 0,\n        max:100,\n        title: {\n            text: y_title\n        }\n    },\n    legend: {\n            enabled: false\n        },\n    tooltip: {\n        headerFormat: '<span style=\"font-size:15px\">{point.key}</span><table>',\n        pointFormat: '<tr><td style=\"color:{series.color};padding:0;font-size:10px\">{series.name}: </td>' +\n            '<td style=\"padding:0\"><b>{point.y:.1f}%</b></td></tr>',\n        footerFormat: '</table>',\n        shared: true,\n        useHTML: true\n    },\n    series: [{\n        name: y_title,\n        data: y\n\n    }]\n});\n}\n\nfunction drawOverviewBarChart(id,title,subtitle,y_title,list,additional){\n    var x=[];\n    var y=[];\n    $.each(list,function(index,value){\n        x.push(value[0]);\n        y.push(value[1]);\n    });\n    Highcharts.chart(id, {\n    chart: {\n        type: 'column'\n    },\n    credits:{\n        enabled:false\n        \n    },\n    title: {\n        text: title\n    },\n    subtitle: {\n        text: subtitle\n    },\n    //colors: ['rgb(137, 165, 78)'],\n    colors: ['rgb(134,179,180)'],\n    xAxis: {\n        categories: x,\n        //crosshair: true\n        labels: {\n            rotation: -45,\n            style: {\n                fontSize: '10px',\n                fontFamily: 'Verdana, sans-serif'\n            }\n        }\n    },\n    yAxis: {\n        min: 0,\n        max:100,\n        title: {\n            text: y_title\n        }\n    },\n    legend: {\n            enabled: false\n        },\n    tooltip: {\n        headerFormat: '<span style=\"font-size:15px\">{point.key}</span><table>',\n        pointFormat: '<tr><td style=\"color:{series.color};padding:0;font-size:10px\">{series.name}: </td>' +\n            '<td style=\"padding:0\"><b>{point.y:.1f}%</b></td></tr>',\n        footerFormat: '</table>',\n        shared: true,\n        useHTML: true\n    },\n    plotOptions: {\n        column: {\n            pointPadding: 0.2,\n            borderWidth: 0\n        },\n        series: {\n            point: {\n                events: {\n                    mouseOver: function () {\n                        var chart = this.series.chart;\n                        if (!chart.lbl&&additional!=null) {\n                            chart.lbl = chart.renderer.label('')\n                                .attr({\n                                    padding: 20,\n                                    r: 10,\n                                    fill: 'rgb(134,179,180)'\n                                })\n                                .css({\n                                    color: '#000000'\n                                })\n                                .add();\n                        }\n                        chart.lbl\n                            .show()\n                            .attr({\n                                text: x[this.x]+\" : \"+additional[this.x]\n                            });\n                    }\n                }\n            },\n            events: {\n                mouseOut: function () {\n                    if (this.chart.lbl) {\n                        this.chart.lbl.hide();\n                    }\n                }\n            }\n        }\n    },\n    series: [{\n        name: y_title,\n        data: y\n\n    }]\n});\n}\n\nfunction drawCircles(d4,d5,d6){\n    var svg1=d3.select(\"#svg\").append(\"g\")\n    var circle1=svg1.append(\"circle\").attr(\"fill\",\"red\").attr(\"cx\",\"150\").attr(\"cy\",\"80\").attr(\"r\",65);\n    var text1=svg1.append(\"text\").text(d4+\"%\").attr(\"x\",\"115\").attr(\"y\",\"82\").attr(\"font-size\",\"25px\").attr(\"fill\",\"white\").attr(\"font-family\",\"Calibri\")\n    \n    var svg2=d3.select(\"#svg\").append(\"g\")\n    var circle2=svg2.append(\"circle\").attr(\"fill\",\"rgb(152, 218, 29)\").attr(\"cx\",\"400\").attr(\"cy\",\"80\").attr(\"r\",65);\n    var text2=svg2.append(\"text\").text(d5.toFixed(1)+\"%\").attr(\"x\",\"365\").attr(\"y\",\"82\").attr(\"font-size\",\"25px\").attr(\"fill\",\"white\").attr(\"font-family\",\"Calibri\")\n    \n    var svg3=d3.select(\"#svg\").append(\"g\")\n    var circle3=svg3.append(\"circle\").attr(\"fill\",\"green\").attr(\"cx\",\"650\").attr(\"cy\",\"80\").attr(\"r\",65);\n    var text3=svg3.append(\"text\").text(d6.toFixed(1)+\"%\").attr(\"x\",\"615\").attr(\"y\",\"82\").attr(\"font-size\",\"25px\").attr(\"fill\",\"white\").attr(\"font-family\",\"Calibri\")\n}\n\n/*\nfunction drawCircles(nodata, between, complete ){\n    var c = document.getElementById(\"circle1\");\n    var ctx = c.getContext(\"2d\");\n    ctx.beginPath();\n    ctx.arc(160, 75, 75, 0, 2 * Math.PI);\n    ctx.closePath();\n    ctx.fillStyle=\"red\";\n    ctx.fill();\n    ctx.font = '30px Calibri';\n    ctx.fillStyle = 'white';\n    ctx.textAlign = 'center';\n    ctx.fillText(nodata.toFixed(1)+\"%\", 160,75);\n    \n    var c1 = document.getElementById(\"circle3\");\n    var ctx1 = c1.getContext(\"2d\");\n    ctx1.beginPath();\n    ctx1.arc(160, 75, 75, 0, 2 * Math.PI);\n    ctx1.fillStyle=\"green\";\n    ctx1.fill();\n    \n    ctx1.font = '30px Calibri';\n    ctx1.fillStyle = 'white';\n    ctx1.textAlign = 'center';\n    ctx1.fillText(complete.toFixed(1)+\"%\", 160,75);\n    \n    var c2 = document.getElementById(\"circle2\");\n    var ctx2 = c2.getContext(\"2d\");\n    ctx2.beginPath();\n    ctx2.arc(160, 75, 75, 0, 2 * Math.PI);\n    ctx2.fillStyle=\"rgb(152, 218, 29)\";\n    ctx2.fill();\n    \n    ctx2.font = '30px Calibri';\n    ctx2.fillStyle = 'white';\n    ctx2.textAlign = 'center';\n    ctx2.fillText(between.toFixed(1)+\"%\", 160,75);\n}\n*/\n/*\nfunction drawStatus(){\n    var series=[];\n    var url=\"\";\n    var sub=\"\";\n    var color=[];\n    if(region==\"apac\"){\n        sub=\"Seamless ATM points of contact and reporting capability of States/Administrations\";\n        url=\"https://spreadsheets.google.com/feeds/list/1GHWNTL8MxjlwtXoY1feBZwTVoIIpMyGJpSDgZ1ROMP4/od6/public/values?alt=json\";\n        color=[ {\n                from: 0,\n                to: 0,\n                color: notYetAnalyzed,\n                name:\"No point of contact\"\n            },{\n                from: 1,\n                to: 1,\n                color:emerging,\n                name:\"Points of contact, but no report submitted\"\n            },{\n                from:2,\n                to: 2,\n                color:mature,\n                name:\"At least one report submitted, but no regular updates\"\n            },  {\n                from:3,\n                to: 3,\n                color:complete,\n                name:\"Regular updates\"\n            }].reverse()\n    }else if(region=='mid'){\n        color=[{\n            from:1,\n            to:1,\n            color:notYetAnalyzed,\n            name:\"No update/report received\"\n        },{\n            from:2,\n            to:2,\n            color:mature,\n            name:\"At least one report submitted, but no regular updates\"\n        },{\n            from:3,\n            to:3,\n            color:complete,\n            name:\"Regular updates\"\n        }].reverse();\n        series.push({code:'BH',name:'Bahrain',value:3});\n        series.push({code:'EG',name:'Egypt',value:3});\n        series.push({code:'IR',name:'Iran',value:3});\n        series.push({code:'JO',name:'Jordan',value:3});\n        series.push({code:'KW',name:'Kuwait',value:3});\n        series.push({code:'LB',name:'Lebanon',value:3});\n        series.push({code:'OM',name:'Oman',value:3});\n        series.push({code:'QA',name:'Qatar',value:3});\n        series.push({code:'SA',name:'Saudi Arabia',value:3});\n        series.push({code:'SD',name:'Sudan',value:3});\n        series.push({code:'AE',name:'UAE',value:3});\n        series.push({code:'IQ',name:'Iraq',value:2});\n        series.push({code:'LY',name:'Libya',value:1});\n        series.push({code:'SY',name:'Syria',value:1});\n        series.push({code:'YE',name:'Yemen',value:1});\n    }\n    if(url!=\"\"){\n        $.getJSON(url, function(data) {\n            $.each(data.feed.entry,function(index,value){\n                var c=value.gsx$code.$t;\n                var n=value.title.$t;\n                var d=value.gsx$latestupdate.$t;\n                var v=0;\n                if(value.gsx$reportingform.$t==\"1\"){\n                    v++;\n                }\n                if(value.gsx$regularupdates.$t==\"1\"){\n                    v++;\n                }\n                if(value.gsx$pointsofcontact.$t==\"1\"){\n                    v++;\n                }\n                var nn=n;\n                if(d!=\"\"){\n                    nn=nn+\", \"+d;\n                }\n                series.push({\n                    code:c.toUpperCase(),\n                    name:nn,\n                    value:v,\n                    date:d\n                });\n            });\n        \n        });\n    }\n   \n    Highcharts.data({\n\n        googleSpreadsheetKey: '0AoIaUO7wH1HwdFJHaFI4eUJDYlVna3k5TlpuXzZubHc',\n\n        parsed: function (columns) {\n            Highcharts.mapChart(\"status\", {\n\n                chart: {\n                    borderWidth: 0,\n                    events: {\n                        load: function () {\n                    }\n                }\n                },\n                \n                colors: ['red', 'orange', 'yellow','green'],\n\n                title: {\n                    text: \"Status of reporting process\"\n                },\n                subtitle: {\n                    text: sub\n                },\n                mapNavigation: {\n                    enabled: true\n                },\n\n                legend: {\n                    title: {\n                        text: '',\n                        style: {\n                            color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'\n                        }\n                    },\n                    align: 'left',\n                    verticalAlign: 'bottom',\n                    floating: true,\n                    layout: 'vertical',\n                    valueDecimals: 0,\n                    backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'rgba(255, 255, 255, 0.85)',\n                    symbolRadius: 0,\n                    symbolHeight: 14\n                },\n        tooltip: {\n            //useHTML: true,\n            formatter: function () {\n                return '<b>' + this.point.name+\", \"+this.point.date ;\n            }\n        },\n\n                colorAxis: {\n                    dataClasses: color\n                },\n                plotOptions:{\n                    map:{\n                       states:{hover:{\n                            brightness:0,\n                            //enabled:false,\n                            borderColor:\"gray\",\n                            borderWidth:2\n                        }},\n                    }\n                },\n                series: [{\n                    data: series,\n                    mapData: mapdata,\n                    joinBy: ['iso-a2', 'code'],\n                    animation: true,\n                    name: ':',\n                    tooltip: {\n                        valueSuffix: ''\n                    }\n                }]\n            });\n        }\n    });\n}\n*/\n\nfunction drawStatus(){\n    var series=[];\n    var url=\"\";\n    var sub=\"\";\n    var color=[];\n    \n   if(region==\"apac\"){\n        sub=\"Seamless ATM points of contact and reporting capability of States/Administrations\";\n        url=\"https://spreadsheets.google.com/feeds/list/1GHWNTL8MxjlwtXoY1feBZwTVoIIpMyGJpSDgZ1ROMP4/od6/public/values?alt=json\";\n        color=[ {\n                from: 0,\n                to: 0,\n                color: notYetAnalyzed,\n                name:\"No point of contact\"\n            },{\n                from: 1,\n                to: 1,\n                color:emerging,\n                name:\"Points of contact, but no report submitted\"\n            },{\n                from:2,\n                to: 2,\n                color:mature,\n                name:\"At least one report submitted, but no regular updates\"\n            },  {\n                from:3,\n                to: 3,\n                color:complete,\n                name:\"Regular updates\"\n            }].reverse()\n    }else if(region=='mid'){\n        color=[{\n            from:1,\n            to:1,\n            color:notYetAnalyzed,\n            name:\"No update/report received\"\n        },{\n            from:2,\n            to:2,\n            color:mature,\n            name:\"At least one report submitted, but no regular updates\"\n        },{\n            from:3,\n            to:3,\n            color:complete,\n            name:\"Regular updates\"\n        }].reverse();\n        series.push({code:'BH',name:'Bahrain',value:3});\n        series.push({code:'EG',name:'Egypt',value:3});\n        series.push({code:'IR',name:'Iran',value:3});\n        series.push({code:'JO',name:'Jordan',value:3});\n        series.push({code:'KW',name:'Kuwait',value:3});\n        series.push({code:'LB',name:'Lebanon',value:3});\n        series.push({code:'OM',name:'Oman',value:3});\n        series.push({code:'QA',name:'Qatar',value:3});\n        series.push({code:'SA',name:'Saudi Arabia',value:3});\n        series.push({code:'SD',name:'Sudan',value:3});\n        series.push({code:'AE',name:'UAE',value:3});\n        series.push({code:'IQ',name:'Iraq',value:2});\n        series.push({code:'LY',name:'Libya',value:1});\n        series.push({code:'SY',name:'Syria',value:1});\n        series.push({code:'YE',name:'Yemen',value:1});\n    }\n    if(url!=\"\"){\n        $.getJSON(url, function(data) {\n            $.each(data.feed.entry,function(index,value){\n                var c=value.gsx$code.$t;\n                var n=value.title.$t;\n                var d=value.gsx$latestupdate.$t;\n                var v=0;\n                if(value.gsx$reportingform.$t==\"Yes\"){\n                    v++;\n                }\n                if(value.gsx$regularupdates.$t==\"Yes\"){\n                    v++;\n                }\n                if(value.gsx$pointsofcontact.$t==\"Yes\"){\n                    v++;\n                }\n                var nn=n;\n                if(d!=\"\"){\n                    nn=nn+\", \"+d;\n                }\n                series.push({\n                    code:c.toUpperCase(),\n                    name:nn,\n                    value:v,\n                    date:d\n                });\n            });\n            Highcharts.mapChart(\"status\", {\n    \n                chart: {\n                    map: 'custom/world',\n                    borderWidth: 0,\n                    events: {\n                        load: function () {\n                    }\n                    }\n                },\n                    \n                colors: ['red', 'orange', 'yellow','green'],\n    \n                title: {\n                    text: \"Status of reporting process\"\n                },\n                subtitle: {\n                    text: sub\n                },\n                mapNavigation: {\n                    enabled: true\n                },\n    \n                legend: {\n                    title: {\n                        text: '',\n                        style: {\n                            color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'\n                        }\n                    },\n                    align: 'left',\n                    verticalAlign: 'bottom',\n                    floating: true,\n                    layout: 'vertical',\n                    valueDecimals: 0,\n                    backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'rgba(255, 255, 255, 0.85)',\n                    symbolRadius: 0,\n                    symbolHeight: 14\n                },\n                tooltip: {\n                    //useHTML: true,\n                    formatter: function () {\n                        return '<b>' + this.point.name+\", \"+this.point.date ;\n                    }\n                },\n    \n                colorAxis: {\n                    dataClasses: color\n                },\n                plotOptions:{\n                    map:{\n                       states:{hover:{\n                            brightness:0,\n                            //enabled:false,\n                            borderColor:\"gray\",\n                            borderWidth:2\n                        }},\n                    }\n                },\n                series: [{\n                    data: series,\n                    mapData: mapdata,\n                    joinBy: ['iso-a2', 'code'],\n                    animation: true,\n                    name: ':',\n                    tooltip: {\n                        valueSuffix: ''\n                    }\n                }]\n            });\n            return;\n    });\n    }\n    \n\n    Highcharts.mapChart(\"status\", {\n\n                chart: {\n                    map: 'custom/world',\n                    borderWidth: 0,\n                    events: {\n                        load: function () {\n                    }\n                    }\n                },\n                \n                colors: ['red', 'orange', 'yellow','green'],\n\n                title: {\n                    text: \"Status of reporting process\"\n                },\n                subtitle: {\n                    text: sub\n                },\n                mapNavigation: {\n                    enabled: true\n                },\n\n                legend: {\n                    title: {\n                        text: '',\n                        style: {\n                            color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'\n                        }\n                    },\n                    align: 'left',\n                    verticalAlign: 'bottom',\n                    floating: true,\n                    layout: 'vertical',\n                    valueDecimals: 0,\n                    backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'rgba(255, 255, 255, 0.85)',\n                    symbolRadius: 0,\n                    symbolHeight: 14\n                },\n        tooltip: {\n            //useHTML: true,\n            formatter: function () {\n                return '<b>' + this.point.name+\", \"+this.point.date ;\n            }\n        },\n\n                colorAxis: {\n                    dataClasses: color\n                },\n                plotOptions:{\n                    map:{\n                       states:{hover:{\n                            brightness:0,\n                            //enabled:false,\n                            borderColor:\"gray\",\n                            borderWidth:2\n                        }},\n                    }\n                },\n                series: [{\n                    data: series,\n                    mapData: mapdata,\n                    joinBy: ['iso-a2', 'code'],\n                    animation: true,\n                    name: ':',\n                    tooltip: {\n                        valueSuffix: ''\n                    }\n                }]\n            });\n   \n\n}"},"css":{"file":{"type":"","url":"","link":"","message":{"error":true,"text":"File not defined"}},"title":"Cascading Style Sheet (CSS)","activated":true,"name":"css","linkedtofile":false,"optional":true,"content":".container{\n    padding-top:10px;\n    margin:0 auto;\n}\n#heatmap{\n   padding-top:30px;\n    margin:0 auto;\n    height:1000px;\n    width:800px;\n}\n#barchart{\n    margin:0 auto;\n    height:600px;\n    width:1000px;\n}\n#status{\n    margin:0 auto;\n    height:600px;\n    width:850px;\n    margin-top: 30px;\n    margin-bottom: 30px;\n    border:solid;\n    border-width: 1px;\n    border-color:#bce8f1;\n}\n\n#status .highcharts-tooltip>span{\n    height:30px;\n    width:30px;\n}\n\n.map{\n    margin:0 auto;\n    height:400px;\n    width:600px;\n}\n#objectiveSelect_1{\n    margin:0 auto;\n    margin-top:20px;\n}\n#description{\n    width:800px;\n    font-size:12px;\n    padding-top:20px;\n}\n#groupSelect{\n    margin:0 auto;\n}\n#description_paginate,#description_info,#description_filter,#description_length{\n    display:none;\n}\n.highcharts-credits{\n    display:none;   \n}\n.ballchartlabel{\n    margin-left: 10px;\n    margin-top: -20px;\n    width:250px;\n    text-align:center;\n    float:left;\n    font-size:18px;\n    font-weight: bold;\n}\n#phase_overview{\n    text-align:center;\n}\n#barchart_overview_countries{\n    margin-top:70px;\n}\n#ball_chart_title{\n    font-size: 18px;\n    font-family: \"Lucida Grande\", \"Lucida Sans Unicode\", Arial, Helvetica, sans-serif;\n    text-align:center;\n    font-weight: bold;\n}\n#heatmap .highcharts-legend-item{\n    width:30px;\n}\n.select_title{\n    font-weight: bold;\n}"},"jade":{"file":{"type":"","url":"","link":"","message":{"error":true,"text":"File not defined"}},"title":"Jade","activated":true,"name":"jade","linkedtofile":false,"optional":false,"content":".container(style=\"width:900px\")\n    p.noprint Select a Region:\n    select.noprint#region_select\n        option(value=\"apac\") Asia Pacific (APAC)\n        option(value=\"eurnat\") Europe and North Atlantic (EUR/NAT)\n        option(value=\"nacc\") North America, Central America and Caribbean (NACC)\n        option(value=\"sam\") South America (SAM)\n        option(value=\"wacaf\") West and Central Africa (WACAF)\n        option(value=\"esaf\",disabled) East and South Africa (ESAF)\n        option(value=\"mid\") Middle East (MID)\n     div(style=\"clear:left\")\n    .title(style=\"text-align:center\")\n        h2 Air Navigation Implementation Status\n        h5#region_subtitle\n        p#last_update(style=\"font-style:italic\") Last updated Mar-2019\n    \n    .panel#status\n    \n    \n    .panel.panel-info\n        .panel-heading\n            h2#phase_overview  \n        .panel-body#overview_body\n            h4#ball_chart_title % of All Objectives of All Reporting States with Status of Complete, Partly Complete and No data/Not yet analyzed\n            #circlechart(style=\"\")\n                //canvas#circle1(style=\"width:250px;\")\n                //canvas#circle2(style=\"width:250px;\")\n                //canvas#circle3(style=\"width:250px;\")\n                \n                svg(height=\"200\" width=\"2000\" id=\"svg\")\n                    //circle(cx=\"150\" cy=\"80\" r=\"70\" fill=\"red\")\n                    //circle(cx=\"400\" cy=\"80\" r=\"70\" fill=\"red\")\n                    //circle(cx=\"650\" cy=\"80\" r=\"70\" fill=\"red\")\n                p.ballchartlabel No data\n                p.ballchartlabel Partly Complete\n                p.ballchartlabel Complete\n            #barchart_overview_countries\n            #barchart_overview_indicators\n    \n    p.noprint Select an Implementation Status area:  \n        select#groupSelect\n            optgroup#phase_1(label=\"Phase 1\")\n            optgroup#phase_2(label=\"Phase 2\")\n    a#printit.noprint(href=\"#\") Email me as PDF\n    \n    .panel.panel-info#description_panel\n        .panel-heading\n            h2#gtitle(style=\"text-align:center\")\n        .panel-body\n            table#description(style=\"margin:auto\")\n    .panel.panel-info(style=\"page-break-before:always\")\n        .panel-heading\n            h2 Implementation Status\n        .panel-body\n            #heatmap(style=\"margin:auto\")\n    \n    \n    \n    #objectives\n    #template\n        .panel.panel-info(style=\"display:none;page-break-before:always\")\n            .panel-heading\n                h2 Objectives\n            .panel-body\n                p(style=\"display:none\") Select an objective:\n                    select.objectiveSelect_1\n                .barchart(style=\"margin:auto;width:800px;height:500px\")\n                .map(style=\"margin:auto;width:800px;height:750px\")"},"morejs":[{"url":"https://code.jquery.com/jquery-3.1.1.min.js"},{"url":"https://code.highcharts.com/maps/highmaps.js"},{"url":"https://code.highcharts.com/maps/modules/data.js"},{"url":"https://code.highcharts.com/maps/modules/exporting.js"},{"url":"https://code.highcharts.com/maps/modules/offline-exporting.js"},{"url":"https://code.highcharts.com/mapdata/custom/world.js"},{"url":"https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"},{"url":" https://code.highcharts.com/modules/heatmap.js"}],"capture":"https://quipslibistars.s3.amazonaws.com/prod/8708314793636e6888e276555fa8a13b31e292a1/capture.png","prod":false,"sharedwith":["5969034e9b111eaf654f4aab"],"deploydate":"2020-01-28T20:13:39.959Z","libs":[{"_id":"5672b285f36b083214f3e63b","description":"A sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.","key":"","version":"3.3.6","link":"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css,https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css,https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js","name":"bootstrap","__v":0,"haskey":false,"required":false,"website":"http://www.getbootstrap.com"},{"_id":"5672b3e0f36b083214f3e63d","description":"","key":"","version":"4.5.0","link":"https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css","name":"font-awesome","__v":0,"haskey":false,"required":false,"website":"fontawesome.com"},{"_id":"5672b602f36b083214f3e63e","description":"The Write Less, Do More, JavaScript Library","key":"","version":"2.1.1","link":"https://code.jquery.com/jquery-2.1.4.js","name":"jquery","__v":0,"required":true,"haskey":false,"website":"https://jquery.com"},{"_id":"568c42d091ce286c15af73fd","required":false,"description":"A JavaScript library for visualizing data with HTML, SVG and CSS.","haskey":false,"version":"3","link":"//d3js.org/d3.v3.min.js,//d3js.org/topojson.v0.min.js","name":"D3","__v":0,"website":"http://d3js.org"},{"_id":"568eb9222043a726661b0ad2","required":false,"description":"A plug-in for the jQuery Javascript Library. It is a highly flexible tool, based upon the foundations of progressive enhancement, and will add advanced interaction controls to any HTML table.","haskey":false,"version":"1.10.10","link":"https://cdn.datatables.net/s/dt/dt-1.10.10/datatables.min.css,https://cdn.datatables.net/s/dt/dt-1.10.10/datatables.min.js","name":"Datatables","__v":0,"website":"https://www.datatables.net"}],"host":"https://quips.anbdata.com","version":"dev"}

function loadjquery(url,callback) {
if(typeof jQuery=='undefined') {
loadScript(url,callback)
}
else {
callback()
}
}

    function loadScript(url, callback) {

        var script = document.createElement("script")
        script.type = "text/javascript";
        if (script.readyState) { //IE
            script.onreadystatechange = function () {
                if (script.readyState == "loaded" || script.readyState == "complete") {
                    script.onreadystatechange = null;
                    callback();
                }
            };
        } else { //Others
            script.onload = function () {
                callback();
            };
        }

        script.src = url;
        document.getElementsByTagName("head")[0].appendChild(script);
    }
(function () {
    
    loadjquery("https://code.jquery.com/jquery-2.1.4.js", function () {

         //jQuery loaded
	$("#"+project.container).html("<img src='https://s3.amazonaws.com/quipslib/load.gif'/>")	
	var libs=[]
	$(project.libs).each(function(i,v){
		if (v.name!="jquery") {
		$(v.link.split(",")).each(function(j,u){
			if (u.slice(-2)=="js") {
				libs.push(u+(v.haskey?"?key="+project[v.name+"key"]:""))
			}
			else {
				$("head").append("<link rel='stylesheet' href='"+u+"' type='text/css' />")

			}
		})
		}
	})
	if (project.morejs) {
	$(project.morejs).each(function(i,v){
		if ((v.url.substring(0,2)=="//")||(v.url.substring(0,8)=="https://")||(v.url.substring(0,7)=="http://")) {
			libs.push(v.url)
		}
	})
	}
	if (project.morecss) {
	$(project.morecss).each(function(i,v){
		$("head").append("<link rel='stylesheet' href='"+v.url+"' type='text/css' />")
	})	


	}
	loadlibs(libs.reverse())
    });


})();


function loadlibs(libs){
if (libs.length>0) {
	var l=libs.pop()
	loadScript(l,function(){
	//$.getScript(l,function(res){
		loadlibs(libs)
	})
	//.fail(function(e){
	//	loadlibs(libs)
	//	
	//})
}
else {
	start()

}


}


function putscriptcontent(content){


        var script = document.createElement("script")
        script.type = "text/javascript";
        $(script).text(content)
        document.getElementsByTagName("head")[0].appendChild(script);


}

function start(){
//load jade
$.getJSON(project.host+"/project/"+project.version+"/"+project.id+"/render?callback=?"+(project.datachange?"&data="+project.datachange:""),function(res){
	$("#"+project.container).html(res.html)
	if (project.css.activated) {
		if (project.css.linkedtofile) {
			$("head").append("<link rel='stylesheet' href='"+project.css.file.url+"' type='text/css' />")}
		else {
			$("head").append("<style>"+project.css.content+"</style>")}
	}
			
	if (project.js.activated) {
		if (project.js.linkedtofile) {	
			$.getScript(project.js.file[(project.prod?"depurl":"url")])}
		else {
			putscriptcontent(project.js.content)}
		if (project.mainjs) {
			window[project.mainjs]()
		}
	}
})


}