var url = "https://script.google.com/macros/s/AKfycbwwh726w2wO1alAJvgr9bBoMUMldxN139xOoL8XzLVWI4P5ldz4OJfipaoztrSUUqH6/exec", //"forever" link
    years = [2019, 2020, 2021, 2022, 2023],
    yr = 0; // index for years array

/* test URL
$.getJSON('https://script.google.com/macros/s/AKfycby7p5oqWtAwdOoTo5Tr4vmOTWdkzKUQRTV96w6ta91ToMreRt4IMY44-MsEEVteJhkg/exec', {school:'AY Jackson SS'}, function(_r){console.log(_r)})
*/

function getSolarData(_e) {
   //!!!! need to include the school name getting clicked and redoing the table with just school rows, by year -> see sname.link
    var ops = {};

    $('.solarBtn').removeClass('currYr');
    $('#dl').attr('disabled', null);
    
    if (typeof _e == 'string') {
        //**** loading single school by name */
        ops.school = _e;

        $('#sname').text(_e);
    }
    else {
        //**** a year button clicked */
        $(this).addClass('currYr');
        ops.sheet = this.value;
        $('#sname').text('Name');
    }

    
    $('#tbody').html('<tr><td colspan="16">Loading data...</td></tr>');
    $table.removeClass('hide');


    $.getJSON(url, ops, function(d){
        //console.log(d);
        tf.destroy();
        yr = 0;

        //raw headers ["id","Project Number","Project Name","Capacity DC KW","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec","Total"]

        //new headers [NAME, ADDRESS, CAP, J, F, M, A, M, J, J, A, S, O, N, D, TOTAL]

        var headers = {
            name: 2,
            ward: 3,
            cap: 4,
            jan: 5, feb: 6, mar: 7, apr: 8, may: 9, jun: 10, jul: 11, aug: 12, sep: 13, oct: 14, nov: 15, dec: 16, tot: 17
        };

        //**** now make a table with the results - use "Proj Num" for address (need to parse Proj Name to get both address and name: "TDSB - 50 Francine (AY Jackson SS)") - also turn address into link for a google map view 

        var i, sname, address, rows = d.data.length, table = '', tableRow = '<tr><td><div class="nameCell">*</div></td><td class="addressCell">*</td><td>*</td><td title="capacity in DC kW">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td><td class="textR">*</td></tr>';

        for (i = 0; i < rows; i++) {
            if (d.data[i][0] == '') continue;

            
            if (ops.sheet) {
                sname = d.data[i][headers.name].match(/\(([^\)]+)/);
                if (/no data/.test(d.data[i][headers.name])) sname.link = sname[1];
                else sname.link = '<a href="#chart" onclick="getSolarData(\'?\')" title="view data for ? only">?</a>'.swap(sname[1], sname[1], sname[1]);
            }
            else {
                sname = years[yr];
                yr++;
            }

            address = d.data[i][headers.name].match(/\- ([^\(]+)/);
            address.link = '<a href="https://maps.google.com/maps?f=q&source=s_q&hl=en&ie=UTF8&t=h&z=17&geocode=&q=*" title="view building on map" target="_blank">*</a>'.swap({sym: "*", vals: [address[1] + ',Toronto, On', address[1]]});

            table += tableRow.swap({sym: "*", vals: [
                (ops.sheet ? sname.link : sname),//'<a href="*?schName=*">*</a>'.swap({sym: "*", vals: [url, sname[1], sname[1]]}), 
                address.link, 
                d.data[i][headers.ward],
                d.data[i][headers.cap], 
                numF(d.data[i][headers.jan]), 
                numF(d.data[i][headers.feb]), 
                numF(d.data[i][headers.mar]), 
                numF(d.data[i][headers.apr]), 
                numF(d.data[i][headers.may]), 
                numF(d.data[i][headers.jun]), 
                numF(d.data[i][headers.jul]), 
                numF( d.data[i][headers.aug]), 
                numF(d.data[i][headers.sep]), 
                numF(d.data[i][headers.oct]), 
                numF(d.data[i][headers.nov]), 
                numF(d.data[i][headers.dec]), 
                numF(d.data[i][headers.tot])
            ]});
        }
        
        //**** resupply table data */
        $('#tbody').html(table);
        tf.init();

        //**** HACK: add accessibility titles to filter elements 
        var addTitles = byQ('.fltrow input, .fltrow select');
        addTitles.forEach(function (element, index) {
            var header = (byQ('#thead th:nth-child(' + (index+1) + ')'))[0].textContent;

            //**** if the column is for a link, hide the filter */
            if (/link/i.test(header)) {
                element.insertAdjacentHTML("afterend", "&nbsp;");
                element.remove();
            }
            else {
                element.title = 'Filter results by ' + header;
                if (element.tagName == 'INPUT') element.title += ' (type in the word[s] you are looking for)';
            }

        });
        
        //var colSort = tf.extension('sort'); console.log(tf, colSort)
        //colSort.sortByColumnIndex(0, false); //fix group of schools added at bottom, dammit

        //**** add title to the pagination # of records select */
        var addLabel = byQ('.rspg')[0];
        addLabel.title = 'Select the number of records to show in the table';
        addLabel = byQ('.pgSlc')[0];
        addLabel.title = 'Select the page of results';

        //**** HACK: tableFilter code removes scope from thead; do it now */
        var rescope = byQ('#thead th');
        for (var i in rescope) { //rescope.forEach(element => {
            if (typeof rescope[i] == 'object') {
                rescope[i].setAttribute('scope', 'col');
            }
        }

    }); //END getjson

    

    //if (ops.sheet)
        _e.preventDefault();
    return false;

} //END getSolarData



var byQ = function(_q) { return document.querySelectorAll(_q); };



function numF(number)
{
    if (typeof number == 'string' || number == undefined) return 'no data';
    else {
        number = number.toFixed(0) + '';
        x = number.split('.');
        x1 = x[0];
        x2 = x.length > 1 ? '.' + x[1] : '';
        var rgx = /(\d+)(\d{3})/;
        while (rgx.test(x1)) {
            x1 = x1.replace(rgx, '$1' + ',' + '$2');
        }
        return x1 + x2;
    }
}



function download_table_as_csv(table_id, separator = ',') {
    // Select rows from table_id
    var rows = document.querySelectorAll('table#' + table_id + ' tr'),
        vizOnly = document.getElementById('vizOnly').checked;
    
    // Construct csv
    var csv = [];
    for (var i = 1; i < rows.length; i++) {
        if (vizOnly && rows[i].style.display == 'none') continue;

        var row = [], cols = rows[i].querySelectorAll('td, th');
        for (var j = 0; j < cols.length; j++) {
            // Clean innertext to remove multiple spaces and jumpline (break csv)
            var data = cols[j].innerText.replace(/(\r\n|\n|\r)/gm, '').replace(/(\s\s)/gm, ' ')
            // Escape double-quote with double-double-quote (see https://stackoverflow.com/questions/17808511/properly-escape-a-double-quote-in-csv)
            data = data.replace(/"/g, '""');
            // Push escaped string
            row.push('"' + data + '"');
        }
        csv.push(row.join(separator));
    }
    var csv_string = csv.join('\n');
    // Download it
    var filename = 'export_' + table_id + '_' + new Date().toLocaleDateString() + '.csv';
    var link = document.createElement('a');
    link.style.display = 'none';
    link.setAttribute('target', '_blank');
    link.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(csv_string));
    link.setAttribute('download', filename);
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
}



String.prototype.swap = 
    function(){
		var a = arguments,
			str = this.toString(),
			rep = a[0].sym || /[\?]/;
		
		a = a[0].vals || a;
		
		for (var i = 0, l = a.length; i < l; i++) {
			str = str.replace(rep, a[i]);
		}
		
		return str;
	};

    
var base_path = location.href.indexOf('127.0.0.1') == -1 ? '/scripts/outdoor/' : '';
var filtersConfig = {
    /*col_widths: ['200px', '150px', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto', 'auto'],*/
    col_2: 'select',
    col_3: 'none',
    col_4: 'none',
    col_5: 'none',
    col_6: 'none',
    col_7: 'none',
    col_8: 'none',
    col_9: 'none',
    col_10: 'none',
    col_11: 'none',
    col_12: 'none',
    col_13: 'none',
    col_14: 'none',
    col_15: 'none',
    col_16: 'none'
};//do the column filter thingies here

filtersConfig = $.extend(filtersConfig, {
    base_path: base_path + 'tablefilter/',
    auto_filter: { delay: 500 },
    sticky_headers: true,
    help_instructions: false,
    alternate_rows: true,
    btn_reset: false,
    loader: true,
    mark_active_columns: true,
    highlight_keywords: true,
    toolbar: {
        target_id: 'externalToolbar'
    },
    paging: {
        results_per_page: ['Records: ', [5, 10, 20, 50]]
    },
    extensions: [{
        name: 'sort',
        async_sort: true
    }]
});



var tf, colSort, $table;

$(document).ready(function(){
    //getSolarData();
    $('.solarBtn').on('click', getSolarData);

    tf = new TableFilter('solarData', filtersConfig);
	tf.init();
    tf.extension('sort');

    $table = $('#solarData, #externalToolbar');
});