diff --git a/README.md b/README.md index c2166de5..bac81408 100644 --- a/README.md +++ b/README.md @@ -2,15 +2,15 @@ Heat.js [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Heat.js%2C%20a%20free%20JavaScript%heat%20map&url=https://github.com/williamtroup/Heat.js&hashtags=javascript,heat,map) -[![npm](https://img.shields.io/badge/npmjs-v1.5.0-blue)](https://www.npmjs.com/package/jheat.js) -[![nuget](https://img.shields.io/badge/nuget-v1.5.0-purple)](https://www.nuget.org/packages/jHeat.js/) +[![npm](https://img.shields.io/badge/npmjs-v1.5.1-blue)](https://www.npmjs.com/package/jheat.js) +[![nuget](https://img.shields.io/badge/nuget-v1.5.1-purple)](https://www.nuget.org/packages/jHeat.js/) [![license](https://img.shields.io/badge/license-MIT-green)](https://github.com/williamtroup/Heat.js/blob/main/LICENSE.txt) [![discussions Welcome](https://img.shields.io/badge/discussions-Welcome-red)](https://github.com/williamtroup/Heat.js/discussions) [![coded by William Troup](https://img.shields.io/badge/coded_by-William_Troup-yellow)](https://william-troup.com/) >

🌞 A lightweight JavaScript library that generates customizable heat maps to visualize date-based activity and trends.

->

v1.5.0

+>

v1.5.1


![Heat.js](docs/images/main.png) diff --git a/README_NUGET.md b/README_NUGET.md index c65e5fae..8c1b2a1d 100644 --- a/README_NUGET.md +++ b/README_NUGET.md @@ -1,8 +1,8 @@ -# Heat.js v1.5.0 +# Heat.js v1.5.1 [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Heat.js%2C%20a%20free%20JavaScript%heat%20map&url=https://github.com/williamtroup/Heat.js&hashtags=javascript,heat,map) -[![npm](https://img.shields.io/badge/npmjs-v1.5.0-blue)](https://www.npmjs.com/package/jheat.js) -[![nuget](https://img.shields.io/badge/nuget-v1.5.0-purple)](https://www.nuget.org/packages/jHeat.js/) +[![npm](https://img.shields.io/badge/npmjs-v1.5.1-blue)](https://www.npmjs.com/package/jheat.js) +[![nuget](https://img.shields.io/badge/nuget-v1.5.1-purple)](https://www.nuget.org/packages/jHeat.js/) [![license](https://img.shields.io/badge/license-MIT-green)](https://github.com/williamtroup/Heat.js/blob/main/LICENSE.txt) [![discussions Welcome](https://img.shields.io/badge/discussions-Welcome-red)](https://github.com/williamtroup/Heat.js/discussions) [![coded by William Troup](https://img.shields.io/badge/coded_by-William_Troup-yellow)](https://william-troup.com/) diff --git a/dist/heat.js b/dist/heat.js index 2094ba77..c0071441 100644 --- a/dist/heat.js +++ b/dist/heat.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ (function() { function render() { var tagTypes = _configuration.domElementTypes; @@ -137,30 +137,32 @@ function renderControlTitleBar(bindingOptions) { if (bindingOptions.showTitle || bindingOptions.showYearSelector || bindingOptions.showRefreshButton || bindingOptions.showExportButton) { var titleBar = createElement(bindingOptions.currentView.element, "div", "title-bar"); + var title = createElement(titleBar, "div", "title"); + createElement(title, "div", "down-arrow"); if (bindingOptions.showTitle) { - var title = createElementWithHTML(titleBar, "div", "title", bindingOptions.titleText); - var titlesList = createElement(title, "div", "titles-list"); - var titles = createElement(titlesList, "div", "titles"); - var optionMap = createElementWithHTML(titles, "div", "title", _configuration.mapText); - var optionChart = createElementWithHTML(titles, "div", "title", _configuration.chartText); - if (bindingOptions.currentView.view !== _elements_View_Map) { - optionMap.onclick = function() { - bindingOptions.currentView.view = _elements_View_Map; - renderControlContainer(bindingOptions); - fireCustomTrigger(bindingOptions.onNextYear, bindingOptions.currentView.year); - }; - } else { - optionMap.className += _string.space + "title-active"; - } - if (bindingOptions.currentView.view !== _elements_View_Chart) { - optionChart.onclick = function() { - bindingOptions.currentView.view = _elements_View_Chart; - renderControlContainer(bindingOptions); - fireCustomTrigger(bindingOptions.onNextYear, bindingOptions.currentView.year); - }; - } else { - optionChart.className += _string.space + "title-active"; - } + title.innerHTML += bindingOptions.titleText; + } + var titlesList = createElement(title, "div", "titles-list"); + var titles = createElement(titlesList, "div", "titles"); + var optionMap = createElementWithHTML(titles, "div", "title", _configuration.mapText); + var optionChart = createElementWithHTML(titles, "div", "title", _configuration.chartText); + if (bindingOptions.currentView.view !== _elements_View_Map) { + optionMap.onclick = function() { + bindingOptions.currentView.view = _elements_View_Map; + renderControlContainer(bindingOptions); + fireCustomTrigger(bindingOptions.onNextYear, bindingOptions.currentView.year); + }; + } else { + optionMap.className += _string.space + "title-active"; + } + if (bindingOptions.currentView.view !== _elements_View_Chart) { + optionChart.onclick = function() { + bindingOptions.currentView.view = _elements_View_Chart; + renderControlContainer(bindingOptions); + fireCustomTrigger(bindingOptions.onNextYear, bindingOptions.currentView.year); + }; + } else { + optionChart.className += _string.space + "title-active"; } if (bindingOptions.showExportButton) { var exportData = createElementWithHTML(titleBar, "button", "export", _configuration.exportButtonText); @@ -184,6 +186,7 @@ fireCustomTrigger(bindingOptions.onBackYear, bindingOptions.currentView.year); }; bindingOptions.currentView.yearText = createElementWithHTML(titleBar, "div", "year-text", bindingOptions.currentView.year); + createElement(bindingOptions.currentView.yearText, "div", "down-arrow"); if (bindingOptions.showYearSelectionDropDown) { var yearList = createElement(bindingOptions.currentView.yearText, "div", "years-list"); var years = createElement(yearList, "div", "years"); @@ -326,7 +329,6 @@ } function renderControlChart(bindingOptions) { var chart = createElement(bindingOptions.currentView.chartContents, "div", "chart"); - var chartMonths = createElement(bindingOptions.currentView.chartContents, "div", "chart-months "); var labels = createElement(chart, "div", "labels"); var dayLines = createElement(chart, "div", "day-lines"); var mapRangeColors = bindingOptions.mapRangeColors.sort(function(a, b) { @@ -336,16 +338,23 @@ var pixelsPerNumbers = bindingOptions.currentView.mapContents.offsetHeight / largestValueForCurrentYear; var currentYear = bindingOptions.currentView.year; var totalDays = 0; - var dayLine = null; - var labelsWidth = labels.offsetWidth + getStyleValueByName(labels, "margin-right", true); - if (largestValueForCurrentYear > 0) { - createElementWithHTML(labels, "div", "label-top", largestValueForCurrentYear.toString()); - createElementWithHTML(labels, "div", "label-middle", Math.floor(largestValueForCurrentYear / 2).toString()); - createElementWithHTML(labels, "div", "label-bottom", "0"); + var labelsWidth = 0; + if (largestValueForCurrentYear > 0 && bindingOptions.showChartYLabels) { + createElementWithHTML(labels, "div", "label-0", largestValueForCurrentYear.toString()); + createElementWithHTML(labels, "div", "label-25", (Math.floor(largestValueForCurrentYear / 4) * 3).toString()); + createElementWithHTML(labels, "div", "label-50", Math.floor(largestValueForCurrentYear / 2).toString()); + createElementWithHTML(labels, "div", "label-75", Math.floor(largestValueForCurrentYear / 4).toString()); + createElementWithHTML(labels, "div", "label-100", "0"); + labelsWidth = labels.offsetWidth + getStyleValueByName(labels, "margin-right", true); + } else { + labels.parentNode.removeChild(labels); + labels = null; } if (largestValueForCurrentYear === 0) { chart.style.minHeight = bindingOptions.currentView.mapContents.offsetHeight + "px"; - labels.style.display = "none"; + if (isDefined(labels)) { + labels.style.display = "none"; + } } else { var totalMonths = 0; var monthIndex1 = 0; @@ -357,7 +366,7 @@ var dayIndex = 0; for (; dayIndex < totalDaysInMonth; dayIndex++) { if (bindingOptions.daysToShow.indexOf(actualDay) > -1) { - dayLine = renderControlChartDay(dayLines, bindingOptions, dayIndex + 1, monthIndex1, currentYear, mapRangeColors, pixelsPerNumbers); + renderControlChartDay(dayLines, bindingOptions, dayIndex + 1, monthIndex1, currentYear, mapRangeColors, pixelsPerNumbers); } if ((dayIndex + 1) % 7 === 0) { actualDay = 0; @@ -367,18 +376,21 @@ } } } - var linesWidth = dayLines.offsetWidth / totalMonths; - var monthIndex2 = 0; - for (; monthIndex2 < 12; monthIndex2++) { - if (bindingOptions.monthsToShow.indexOf(monthIndex2 + 1) > -1) { - var monthName = createElementWithHTML(chartMonths, "div", "month-name", _configuration.monthNames[monthIndex2]); - monthName.style.marginLeft = labelsWidth + linesWidth * monthIndex2 + "px"; + if (bindingOptions.showMonthNames) { + var chartMonths = createElement(bindingOptions.currentView.chartContents, "div", "chart-months "); + var linesWidth = dayLines.offsetWidth / totalMonths; + var monthIndex2 = 0; + for (; monthIndex2 < 12; monthIndex2++) { + if (bindingOptions.monthsToShow.indexOf(monthIndex2 + 1) > -1) { + var monthName = createElementWithHTML(chartMonths, "div", "month-name", _configuration.monthNames[monthIndex2]); + monthName.style.marginLeft = labelsWidth + linesWidth * monthIndex2 + "px"; + } } + chartMonths.style.width = dayLines.offsetWidth + "px"; + var monthNameSpace = createElement(chartMonths, "div", "month-name-space"); + monthNameSpace.style.height = chartMonths.offsetHeight + "px"; + monthNameSpace.style.width = labelsWidth + "px"; } - chartMonths.style.width = dayLines.offsetWidth + "px"; - var monthNameSpace = createElement(chartMonths, "div", "month-name-space"); - monthNameSpace.style.height = chartMonths.offsetHeight + "px"; - monthNameSpace.style.width = labelsWidth + "px"; if (bindingOptions.keepScrollPositions) { bindingOptions.currentView.chartContents.scrollLeft = bindingOptions.currentView.chartContentsScrollLeft; } @@ -395,6 +407,7 @@ dayLine.title = getCustomFormattedDateText(bindingOptions.dayToolTipText, date); } dayLine.style.height = dateCount * pixelsPerNumbers + "px"; + dayLine.style.setProperty("border-bottom-width", "0", "important"); if (isDefinedFunction(bindingOptions.onDayClick)) { dayLine.onclick = function() { fireCustomTrigger(bindingOptions.onDayClick, date, dateCount); @@ -406,7 +419,6 @@ if (isDefined(useMapRangeColor) && isHeatMapColorVisible(bindingOptions, useMapRangeColor.id)) { dayLine.className += _string.space + useMapRangeColor.cssClassName; } - return dayLine; } function renderControlViewGuide(bindingOptions) { var guide = createElement(bindingOptions.currentView.element, "div", "guide"); @@ -583,6 +595,7 @@ options.extraSelectionYears = getDefaultNumber(options.extraSelectionYears, 50); options.showYearSelectionDropDown = getDefaultBoolean(options.showYearSelectionDropDown, true); options.view = getDefaultString(options.view, null); + options.showChartYLabels = getDefaultBoolean(options.showChartYLabels, true); if (isInvalidOptionArray(options.monthsToShow)) { options.monthsToShow = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]; } @@ -998,7 +1011,7 @@ return this; }; this.getVersion = function() { - return "1.5.0"; + return "1.5.1"; }; (function(documentObject, windowObject) { _parameter_Document = documentObject; diff --git a/dist/heat.js.css b/dist/heat.js.css index 19cc0733..55161c38 100644 --- a/dist/heat.js.css +++ b/dist/heat.js.css @@ -1,5 +1,5 @@ /* - * Heat.js Library v1.5.0 + * Heat.js Library v1.5.1 * * Copyright 2024 Bunoon * Released under the MIT License @@ -55,7 +55,7 @@ /* ------------------------------------------------------------------------- - Heat.js - Buttons + Heat.js - Mixins ------------------------------------------------------------------------- */ /* @@ -109,6 +109,15 @@ div.heat-js div.title-bar div.title { padding-bottom: 3px; cursor: pointer; } +div.heat-js div.title-bar div.title div.down-arrow { + display: inline-block; + width: 0; + height: 0; + border-left: 8px solid transparent; + border-right: 8px solid transparent; + border-top: 14px solid var(--heat-js-color-white); + margin-right: var(--heat-js-spacing); +} div.heat-js div.title-bar div.title:hover div.titles-list { display: block; } @@ -192,6 +201,15 @@ div.heat-js div.title-bar div.year-text { padding-bottom: 5px; cursor: pointer; } +div.heat-js div.title-bar div.year-text div.down-arrow { + display: inline-block; + width: 0; + height: 0; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-top: 9px solid var(--heat-js-color-white); + margin-left: calc(var(--heat-js-spacing) / 2); +} div.heat-js div.title-bar div.year-text:hover div.years-list { display: block; } @@ -255,7 +273,8 @@ div.heat-js div.title-bar button.refresh { ------------------------------------------------------------------------- */ div.heat-js div.map-contents { - overflow-y: scroll; + overflow-x: scroll; + overflow-y: hidden; } div.heat-js div.map-contents div.map { display: inline-flex; @@ -346,7 +365,8 @@ div.heat-js div.map-contents div.map div.months div.month div.day-columns div.da */ div.heat-js div.chart-contents { display: flex; - overflow-y: scroll; + overflow-x: scroll; + overflow-y: hidden; text-wrap: nowrap; white-space: nowrap; } @@ -369,9 +389,11 @@ div.heat-js div.chart-contents div.chart div.labels { display: block; } } -div.heat-js div.chart-contents div.chart div.labels div.label-top, -div.heat-js div.chart-contents div.chart div.labels div.label-middle, -div.heat-js div.chart-contents div.chart div.labels div.label-bottom { +div.heat-js div.chart-contents div.chart div.labels div.label-0, +div.heat-js div.chart-contents div.chart div.labels div.label-25, +div.heat-js div.chart-contents div.chart div.labels div.label-50, +div.heat-js div.chart-contents div.chart div.labels div.label-75, +div.heat-js div.chart-contents div.chart div.labels div.label-100 { font-weight: var(--heat-js-text-bold-weight); text-align: left !important; height: var(--heat-js-day-size); @@ -381,14 +403,22 @@ div.heat-js div.chart-contents div.chart div.labels div.label-bottom { position: absolute; left: 0; } -div.heat-js div.chart-contents div.chart div.labels div.label-top { +div.heat-js div.chart-contents div.chart div.labels div.label-0 { top: 0; } -div.heat-js div.chart-contents div.chart div.labels div.label-middle { +div.heat-js div.chart-contents div.chart div.labels div.label-25 { + top: 25%; + transform: translateY(-25%); +} +div.heat-js div.chart-contents div.chart div.labels div.label-50 { top: 50%; transform: translateY(-50%); } -div.heat-js div.chart-contents div.chart div.labels div.label-bottom { +div.heat-js div.chart-contents div.chart div.labels div.label-75 { + top: 75%; + transform: translateY(-75%); +} +div.heat-js div.chart-contents div.chart div.labels div.label-100 { bottom: 0; } div.heat-js div.chart-contents div.chart div.day-lines { diff --git a/dist/heat.js.css.map b/dist/heat.js.css.map index e3ca30f8..263e04f5 100644 --- a/dist/heat.js.css.map +++ b/dist/heat.js.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../src/heat.js.scss","../src/foundation/_styles.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;EAEI;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EAGA;EACA;EAGA;EACA;EAGA;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAoCA;AAAA;AAAA;AAAA;AAAA;AAMA;ECxHI;EACA;EACA;EACA;EACA;EACA;EDqHA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAEA;EAEI;EACA;;;AAMZ;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;EACA;;AAEA;EAGI;EACA;EACA;EACA,gBALe;EAMf;;AAEA;EACI;;AAGJ;EACI,aAbW;EAcX;EACA;EACA;EACA,YAjBW;EAkBX;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;;AAnIpB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAkHA;EACI;;AAGJ;EACI;;AAGJ;EAGI;EACA;EACA;EACA;EACA;EACA,aAPc;EAQd,gBARc;EASd;;AAEA;EACI;;AAGJ;EACI,SAhBU;EAiBV;EACA;EACA;EACA;EACA;EACA,YAtBU;;AAwBV;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;;AAMhB;AAAA;EAEI;;AAEA;EAJJ;AAAA;IAKQ;;;;AAOhB;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;;AAEA;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EATJ;IAUQ;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAMgB;EACI;;AAOpB;AAAA;EAEI;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAGI;AAAA;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;;AAWpC;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAVJ;IAWQ;;;AAGJ;AAAA;AAAA;EAGI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAMhB;EACI;EACA;;AAEA;AAAA;EAEI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;;AAOhB;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;;AAEA;EAHJ;IAIQ;;;AAGJ;AAAA;EAEI;;AAEA;EAJJ;AAAA;IAKQ;IACA;;;AAIR;EACI;;AAEA;EAHJ;IAIQ;;;AAndZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;EACA;;AA+bI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;IACA;;;AAGJ;AAAA;EAEI;EACA;EACA;;AAEA;AAAA;EACI;EACA;;AAGJ;AAAA;EACI;;AAIR;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AASxB;AAAA;AAAA;AAAA;AAAA;AAWQ;AAAA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;AAAA;EACI;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA","file":"heat.js.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../src/heat.js.scss","../src/foundation/_styles.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;EAEI;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EAGA;EACA;EAGA;EACA;EAGA;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAuDA;AAAA;AAAA;AAAA;AAAA;AAMA;EC3II;EACA;EACA;EACA;EACA;EACA;EDwIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAEA;EAEI;EACA;;;AAMZ;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;EACA;;AAEA;EAGI;EACA;EACA;EACA,gBALe;EAMf;;AAxER;EACI;EACA;EACA;EACA;EACA;EACA;EAGI,cAVuF;;AA6EvF;EACI;;AAGJ;EACI,aAfW;EAgBX;EACA;EACA;EACA,YAnBW;EAoBX;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;;AAxJpB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAuIA;EACI;;AAGJ;EACI;;AAGJ;EAGI;EACA;EACA;EACA;EACA;EACA,aAPc;EAQd,gBARc;EASd;;AApJR;EACI;EACA;EACA;EACA;EACA;EACA;EAMI,aA0IsC;;AAEtC;EACI;;AAGJ;EACI,SAlBU;EAmBV;EACA;EACA;EACA;EACA;EACA,YAxBU;;AA0BV;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;;AAMhB;AAAA;EAEI;;AAEA;EAJJ;AAAA;IAKQ;;;;AAOhB;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EATJ;IAUQ;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAMgB;EACI;;AAOpB;AAAA;EAEI;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAGI;AAAA;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;;AAWpC;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAVJ;IAWQ;;;AAGJ;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAMhB;EACI;EACA;;AAEA;AAAA;EAEI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;;AAOhB;AAAA;AAAA;AAAA;AAAA;AAOI;EACI;;AAEA;EAHJ;IAIQ;;;AAGJ;AAAA;EAEI;;AAEA;EAJJ;AAAA;IAKQ;IACA;;;AAIR;EACI;;AAEA;EAHJ;IAIQ;;;AAxfZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAoeI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;IACA;;;AAGJ;AAAA;EAEI;EACA;EACA;;AAEA;AAAA;EACI;EACA;;AAGJ;AAAA;EACI;;AAIR;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AASxB;AAAA;AAAA;AAAA;AAAA;AAWQ;AAAA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;AAAA;EACI;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA","file":"heat.js.css"} \ No newline at end of file diff --git a/dist/heat.js.min.css b/dist/heat.js.min.css index 2ac3b046..422f44d9 100644 --- a/dist/heat.js.min.css +++ b/dist/heat.js.min.css @@ -1,2 +1,2 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ -:root{--heat-js-color-black:#3b3a3a;--heat-js-color-white:#F5F5F5;--heat-js-color-gray:#AAA;--heat-js-container-background-color:#22272e;--heat-js-container-border-color:#454c56;--heat-js-years-background-color:var(--heat-js-container-background-color);--heat-js-years-border-color:var(--heat-js-container-border-color);--heat-js-years-text-color:var(--heat-js-color-white);--heat-js-years-background-color-hover:var(--heat-js-button-background-color-hover);--heat-js-title-background-color:var(--heat-js-container-background-color);--heat-js-title-border-color:var(--heat-js-container-border-color);--heat-js-title-text-color:var(--heat-js-color-white);--heat-js-title-background-color-hover:var(--heat-js-button-background-color-hover);--heat-js-day-background-color:#2d333b;--heat-js-day-border-color:var(--heat-js-container-border-color);--heat-js-day-background-color-hover:var(--heat-js-container-border-color);--heat-js-day-spacing:6.3px;--heat-js-day-opacity-hover:.7;--heat-js-day-opacity-active:.5;--heat-js-day-size:1.1rem;--heat-js-day-color-1-background-color:rgba(57,211,83,.25);--heat-js-day-color-1-border-color:rgba(57,211,83,.15);--heat-js-day-color-1-text-color:var(--heat-js-color-white);--heat-js-day-color-2-background-color:rgba(57,211,83,.5);--heat-js-day-color-2-border-color:rgba(57,211,83,.25);--heat-js-day-color-2-text-color:var(--heat-js-color-white);--heat-js-day-color-3-background-color:rgba(57,211,83,.75);--heat-js-day-color-3-border-color:rgba(57,211,83,.5);--heat-js-day-color-3-text-color:var(--heat-js-color-white);--heat-js-day-color-4-background-color:rgba(57,211,83,1);--heat-js-day-color-4-border-color:rgba(57,211,83,.75);--heat-js-day-color-4-text-color:var(--heat-js-color-black);--heat-js-button-background-color:var(--heat-js-day-background-color);--heat-js-button-border-color:var(--heat-js-container-border-color);--heat-js-button-text-color:var(--heat-js-color-white);--heat-js-button-background-color-hover:var(--heat-js-container-border-color);--heat-js-button-background-color-active:#616b79;--heat-js-border-radius:.5rem;--heat-js-border-radius-day:.25rem;--heat-js-border-size:.5px;--heat-js-border-size-day:1px;--heat-js-spacing:10px;--heat-js-spacing-font-size:.85rem;--heat-js-text-bold-weight:400;--heat-js-title-bold-weight:800;--heat-js-transition:all .3s}div.heat-js{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;cursor:default;display:inline-block;border-radius:var(--heat-js-border-radius);background-color:var(--heat-js-container-background-color);color:var(--heat-js-color-white);border:var(--heat-js-border-size) solid var(--heat-js-container-border-color);padding:var(--heat-js-spacing);font-size:var(--heat-js-spacing-font-size);width:100%;max-width:700px;margin:0!important}div.heat-js div.no-click{pointer-events:none!important}div.heat-js *{box-sizing:border-box;line-height:normal}div.heat-js *::before,div.heat-js *::after{box-sizing:border-box;line-height:normal}div.heat-js div.title-bar{text-align:right;margin-bottom:calc(var(--heat-js-spacing) + var(--heat-js-spacing) / 2)}div.heat-js div.title-bar div.title{float:left;font-weight:var(--heat-js-title-bold-weight);font-size:1.2rem;padding-bottom:3px;cursor:pointer}div.heat-js div.title-bar div.title:hover div.titles-list{display:block}div.heat-js div.title-bar div.title div.titles-list{padding-top:3px;display:none;position:absolute;width:100px;margin-top:3px;z-index:100}div.heat-js div.title-bar div.title div.titles-list div.titles{border-radius:var(--heat-js-border-radius);background-color:var(--heat-js-title-background-color);border:var(--heat-js-border-size) solid var(--heat-js-title-border-color);color:var(--heat-js-title-text-color);overflow-y:scroll}div.heat-js div.title-bar div.title div.titles-list div.titles div.title{color:var(--heat-js-color-white);font-weight:var(--heat-js-text-bold-weight);border-bottom:var(--heat-js-border-size) dashed var(--heat-js-container-border-color);padding:var(--heat-js-spacing);text-align:left;width:100%;transition:var(--heat-js-transition);font-size:var(--heat-js-spacing-font-size)!important}div.heat-js div.title-bar div.title div.titles-list div.titles div.title:not(.title-active):active{opacity:0.5!important}div.heat-js div.title-bar div.title div.titles-list div.titles div.title:not(.title-active):hover{cursor:pointer;background-color:var(--heat-js-title-background-color-hover)}div.heat-js div.title-bar div.title div.titles-list div.titles div.title:last-child{border-bottom:none}div.heat-js div.title-bar div.title div.titles-list div.titles div.title-active{background-color:var(--heat-js-title-background-color-hover);font-weight:900;cursor:default!important}div.heat-js div.title-bar button{background-color:var(--heat-js-button-background-color);border:var(--heat-js-border-size) solid var(--heat-js-button-border-color);color:var(--heat-js-button-text-color);border-radius:var(--heat-js-border-radius);padding-top:5px;padding-bottom:5px;padding-left:9px;padding-right:9px;outline:none;transition:var(--heat-js-transition)}div.heat-js div.title-bar button:active{background:var(--heat-js-button-background-color-active)!important}div.heat-js div.title-bar button:hover{cursor:pointer;background:var(--heat-js-button-background-color-hover)}div.heat-js div.title-bar button.active{cursor:default;background:var(--heat-js-button-background-color-hover);transition:var(--heat-js-transition)}div.heat-js div.title-bar button.back{margin-left:calc(var(--heat-js-spacing) * 2)!important}div.heat-js div.title-bar button.export{margin-right:calc(var(--heat-js-spacing) / 2)!important}div.heat-js div.title-bar div.year-text{margin-left:var(--heat-js-spacing);margin-right:var(--heat-js-spacing);display:inline-block;font-weight:var(--heat-js-title-bold-weight);position:relative;padding-top:5px;padding-bottom:5px;cursor:pointer}div.heat-js div.title-bar div.year-text:hover div.years-list{display:block}div.heat-js div.title-bar div.year-text div.years-list{padding:5px;display:none;position:absolute;width:80px;left:50%;transform:translateX(-50%);margin-top:5px}div.heat-js div.title-bar div.year-text div.years-list div.years{border-radius:var(--heat-js-border-radius);background-color:var(--heat-js-years-background-color);border:var(--heat-js-border-size) solid var(--heat-js-years-border-color);color:var(--heat-js-years-text-color);height:183px;overflow-y:scroll;scroll-snap-type:y mandatory}div.heat-js div.title-bar div.year-text div.years-list div.years div.year{color:var(--heat-js-color-white);font-weight:var(--heat-js-text-bold-weight);border-bottom:var(--heat-js-border-size) dashed var(--heat-js-container-border-color);padding:var(--heat-js-spacing);text-align:center;width:100%;transition:var(--heat-js-transition);scroll-snap-align:start}div.heat-js div.title-bar div.year-text div.years-list div.years div.year:not(.year-active):active{opacity:0.5!important}div.heat-js div.title-bar div.year-text div.years-list div.years div.year:not(.year-active):hover{cursor:pointer;background-color:var(--heat-js-years-background-color-hover)}div.heat-js div.title-bar div.year-text div.years-list div.years div.year:last-child{border-bottom:none}div.heat-js div.title-bar div.year-text div.years-list div.years div.year-active{background-color:var(--heat-js-years-background-color-hover);font-weight:900;cursor:default!important}div.heat-js div.title-bar button.export,div.heat-js div.title-bar button.refresh{display:none}@media (min-width:768px){div.heat-js div.title-bar button.export,div.heat-js div.title-bar button.refresh{display:inline-block}}div.heat-js div.map-contents{overflow-y:scroll}div.heat-js div.map-contents div.map{display:inline-flex;flex-direction:row}div.heat-js div.map-contents div.map div.days{background-color:var(--heat-js-container-background-color);padding-right:calc(var(--heat-js-spacing) * 3);padding-top:calc(var(--heat-js-spacing-font-size) + var(--heat-js-spacing) + 1px);position:sticky;left:0;display:none;z-index:50}@media (min-width:768px){div.heat-js div.map-contents div.map div.days{display:block}}div.heat-js div.map-contents div.map div.days div.day-name{font-weight:var(--heat-js-text-bold-weight);text-align:left!important;height:var(--heat-js-day-size);margin-bottom:var(--heat-js-day-spacing);display:inline-flex;justify-content:center;flex-direction:column}div.heat-js div.map-contents div.map div.months{display:flex;justify-content:space-between;flex-grow:1}div.heat-js div.map-contents div.map div.months div.month{flex:1;pointer-events:none}div.heat-js div.map-contents div.map div.months div.month:last-child div.day-columns div.day-column:last-child div.day{margin-right:0!important}div.heat-js div.map-contents div.map div.months div.month div.month-name,div.heat-js div.map-contents div.map div.months div.month div.month-name-bottom{font-weight:var(--heat-js-text-bold-weight);text-align:left!important}div.heat-js div.map-contents div.map div.months div.month div.month-name{margin-bottom:var(--heat-js-spacing)}div.heat-js div.map-contents div.map div.months div.month div.month-name-bottom{margin-top:var(--heat-js-spacing)}div.heat-js div.map-contents div.map div.months div.month div.day-columns{display:flex;justify-content:space-between}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day,div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day-disabled{display:flex;border-radius:var(--heat-js-border-radius-day);width:var(--heat-js-day-size);height:var(--heat-js-day-size);margin-right:var(--heat-js-day-spacing);margin-bottom:var(--heat-js-day-spacing);font-size:.6rem;justify-content:center;align-items:center;overflow:hidden}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day:last-child,div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day-disabled:last-child{margin-bottom:0}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day{pointer-events:all;background-color:var(--heat-js-day-background-color);border:var(--heat-js-border-size) solid var(--heat-js-day-border-color);transition:var(--heat-js-transition)}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day:hover{cursor:pointer;background:var(--heat-js-day-background-color-hover)}div.heat-js div.chart-contents{display:flex;overflow-y:scroll;text-wrap:nowrap;white-space:nowrap}div.heat-js div.chart-contents div.chart{display:inline-flex;flex-direction:row}div.heat-js div.chart-contents div.chart div.labels{background-color:var(--heat-js-container-background-color);padding-right:calc(var(--heat-js-spacing) * 3);padding-top:calc(var(--heat-js-spacing-font-size) + var(--heat-js-spacing) + 1px);position:sticky;left:0;display:none;border-right:var(--heat-js-border-size) solid var(--heat-js-container-border-color);z-index:50}@media (min-width:768px){div.heat-js div.chart-contents div.chart div.labels{display:block}}div.heat-js div.chart-contents div.chart div.labels div.label-top,div.heat-js div.chart-contents div.chart div.labels div.label-middle,div.heat-js div.chart-contents div.chart div.labels div.label-bottom{font-weight:var(--heat-js-text-bold-weight);text-align:left!important;height:var(--heat-js-day-size);display:inline-flex;justify-content:center;flex-direction:column;position:absolute;left:0}div.heat-js div.chart-contents div.chart div.labels div.label-top{top:0}div.heat-js div.chart-contents div.chart div.labels div.label-middle{top:50%;transform:translateY(-50%)}div.heat-js div.chart-contents div.chart div.labels div.label-bottom{bottom:0}div.heat-js div.chart-contents div.chart div.day-lines{flex:1;border-bottom:var(--heat-js-border-size) solid var(--heat-js-container-border-color)}div.heat-js div.chart-contents div.chart div.day-lines div.day-line{vertical-align:bottom;width:8px;margin-right:1px;display:inline-block}div.heat-js div.chart-contents div.chart div.day-lines div.day-line:last-child{margin-right:0}div.heat-js div.chart-contents div.chart-months{position:relative;height:calc(var(--heat-js-spacing-font-size) + var(--heat-js-spacing))}div.heat-js div.chart-contents div.chart-months div.month-name,div.heat-js div.chart-contents div.chart-months div.month-name-space{font-weight:var(--heat-js-text-bold-weight);text-align:left!important;position:absolute;bottom:0}div.heat-js div.chart-contents div.chart-months div.month-name-space{left:0;top:0;position:sticky;background-color:var(--heat-js-container-background-color)}div.heat-js div.guide{display:block}@media (min-width:768px){div.heat-js div.guide{display:flex}}div.heat-js div.guide div.map-types,div.heat-js div.guide div.map-toggles{margin-top:calc(var(--heat-js-spacing) + var(--heat-js-spacing) / 2)}@media (min-width:768px){div.heat-js div.guide div.map-types,div.heat-js div.guide div.map-toggles{flex-basis:100%;margin-bottom:0}}div.heat-js div.guide div.map-types{text-align:center}@media (min-width:768px){div.heat-js div.guide div.map-types{text-align:left}}div.heat-js div.guide div.map-types button{background-color:var(--heat-js-button-background-color);border:var(--heat-js-border-size) solid var(--heat-js-button-border-color);color:var(--heat-js-button-text-color);border-radius:var(--heat-js-border-radius);padding-top:5px;padding-bottom:5px;padding-left:9px;padding-right:9px;outline:none;transition:var(--heat-js-transition)}div.heat-js div.guide div.map-types button:active{background:var(--heat-js-button-background-color-active)!important}div.heat-js div.guide div.map-types button:hover{cursor:pointer;background:var(--heat-js-button-background-color-hover)}div.heat-js div.guide div.map-types button.active{cursor:default;background:var(--heat-js-button-background-color-hover);transition:var(--heat-js-transition)}div.heat-js div.guide div.map-types button{margin-left:0!important;margin-right:calc(var(--heat-js-spacing) / 2)!important}div.heat-js div.guide div.map-toggles{display:flex;align-items:center;justify-content:center;text-align:center}@media (min-width:768px){div.heat-js div.guide div.map-toggles{text-align:right;justify-content:right}}div.heat-js div.guide div.map-toggles div.less-text,div.heat-js div.guide div.map-toggles div.more-text{display:inline-block;font-weight:var(--heat-js-text-bold-weight);transition:var(--heat-js-transition)}div.heat-js div.guide div.map-toggles div.less-text:hover,div.heat-js div.guide div.map-toggles div.more-text:hover{cursor:pointer;text-decoration:underline}div.heat-js div.guide div.map-toggles div.less-text:active,div.heat-js div.guide div.map-toggles div.more-text:active{color:var(--heat-js-color-gray)}div.heat-js div.guide div.map-toggles div.less-text{margin-right:var(--heat-js-spacing)}div.heat-js div.guide div.map-toggles div.more-text{margin-left:var(--heat-js-spacing)}div.heat-js div.guide div.map-toggles div.days{display:inline-flex;align-items:center;justify-content:right}div.heat-js div.guide div.map-toggles div.days div.day{background-color:var(--heat-js-day-background-color);border:var(--heat-js-border-size) solid var(--heat-js-day-border-color);display:inline-block;border-radius:var(--heat-js-border-radius-day);width:var(--heat-js-day-size);height:var(--heat-js-day-size);margin-right:var(--heat-js-day-spacing);cursor:pointer;transition:var(--heat-js-transition)}div.heat-js div.guide div.map-toggles div.days div.day:last-child{margin-right:0}div.heat-js div.day-color-1:active,div.heat-js div.day-color-2:active,div.heat-js div.day-color-3:active,div.heat-js div.day-color-4:active{opacity:var(--heat-js-day-opacity-active)!important}div.heat-js div.day-color-1:hover,div.heat-js div.day-color-2:hover,div.heat-js div.day-color-3:hover,div.heat-js div.day-color-4:hover{opacity:var(--heat-js-day-opacity-hover)}div.heat-js div.day-color-1{background-color:var(--heat-js-day-color-1-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-1-border-color)!important;color:var(--heat-js-day-color-1-text-color)}div.heat-js div.day-color-2{background-color:var(--heat-js-day-color-2-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-2-border-color)!important;color:var(--heat-js-day-color-2-text-color)}div.heat-js div.day-color-3{background-color:var(--heat-js-day-color-3-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-3-border-color)!important;color:var(--heat-js-day-color-3-text-color)}div.heat-js div.day-color-4{background-color:var(--heat-js-day-color-4-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-4-border-color)!important;color:var(--heat-js-day-color-4-text-color)} \ No newline at end of file +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ +:root{--heat-js-color-black:#3b3a3a;--heat-js-color-white:#F5F5F5;--heat-js-color-gray:#AAA;--heat-js-container-background-color:#22272e;--heat-js-container-border-color:#454c56;--heat-js-years-background-color:var(--heat-js-container-background-color);--heat-js-years-border-color:var(--heat-js-container-border-color);--heat-js-years-text-color:var(--heat-js-color-white);--heat-js-years-background-color-hover:var(--heat-js-button-background-color-hover);--heat-js-title-background-color:var(--heat-js-container-background-color);--heat-js-title-border-color:var(--heat-js-container-border-color);--heat-js-title-text-color:var(--heat-js-color-white);--heat-js-title-background-color-hover:var(--heat-js-button-background-color-hover);--heat-js-day-background-color:#2d333b;--heat-js-day-border-color:var(--heat-js-container-border-color);--heat-js-day-background-color-hover:var(--heat-js-container-border-color);--heat-js-day-spacing:6.3px;--heat-js-day-opacity-hover:.7;--heat-js-day-opacity-active:.5;--heat-js-day-size:1.1rem;--heat-js-day-color-1-background-color:rgba(57,211,83,.25);--heat-js-day-color-1-border-color:rgba(57,211,83,.15);--heat-js-day-color-1-text-color:var(--heat-js-color-white);--heat-js-day-color-2-background-color:rgba(57,211,83,.5);--heat-js-day-color-2-border-color:rgba(57,211,83,.25);--heat-js-day-color-2-text-color:var(--heat-js-color-white);--heat-js-day-color-3-background-color:rgba(57,211,83,.75);--heat-js-day-color-3-border-color:rgba(57,211,83,.5);--heat-js-day-color-3-text-color:var(--heat-js-color-white);--heat-js-day-color-4-background-color:rgba(57,211,83,1);--heat-js-day-color-4-border-color:rgba(57,211,83,.75);--heat-js-day-color-4-text-color:var(--heat-js-color-black);--heat-js-button-background-color:var(--heat-js-day-background-color);--heat-js-button-border-color:var(--heat-js-container-border-color);--heat-js-button-text-color:var(--heat-js-color-white);--heat-js-button-background-color-hover:var(--heat-js-container-border-color);--heat-js-button-background-color-active:#616b79;--heat-js-border-radius:.5rem;--heat-js-border-radius-day:.25rem;--heat-js-border-size:.5px;--heat-js-border-size-day:1px;--heat-js-spacing:10px;--heat-js-spacing-font-size:.85rem;--heat-js-text-bold-weight:400;--heat-js-title-bold-weight:800;--heat-js-transition:all .3s}div.heat-js{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;cursor:default;display:inline-block;border-radius:var(--heat-js-border-radius);background-color:var(--heat-js-container-background-color);color:var(--heat-js-color-white);border:var(--heat-js-border-size) solid var(--heat-js-container-border-color);padding:var(--heat-js-spacing);font-size:var(--heat-js-spacing-font-size);width:100%;max-width:700px;margin:0!important}div.heat-js div.no-click{pointer-events:none!important}div.heat-js *{box-sizing:border-box;line-height:normal}div.heat-js *::before,div.heat-js *::after{box-sizing:border-box;line-height:normal}div.heat-js div.title-bar{text-align:right;margin-bottom:calc(var(--heat-js-spacing) + var(--heat-js-spacing) / 2)}div.heat-js div.title-bar div.title{float:left;font-weight:var(--heat-js-title-bold-weight);font-size:1.2rem;padding-bottom:3px;cursor:pointer}div.heat-js div.title-bar div.title div.down-arrow{display:inline-block;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:14px solid var(--heat-js-color-white);margin-right:var(--heat-js-spacing)}div.heat-js div.title-bar div.title:hover div.titles-list{display:block}div.heat-js div.title-bar div.title div.titles-list{padding-top:3px;display:none;position:absolute;width:100px;margin-top:3px;z-index:100}div.heat-js div.title-bar div.title div.titles-list div.titles{border-radius:var(--heat-js-border-radius);background-color:var(--heat-js-title-background-color);border:var(--heat-js-border-size) solid var(--heat-js-title-border-color);color:var(--heat-js-title-text-color);overflow-y:scroll}div.heat-js div.title-bar div.title div.titles-list div.titles div.title{color:var(--heat-js-color-white);font-weight:var(--heat-js-text-bold-weight);border-bottom:var(--heat-js-border-size) dashed var(--heat-js-container-border-color);padding:var(--heat-js-spacing);text-align:left;width:100%;transition:var(--heat-js-transition);font-size:var(--heat-js-spacing-font-size)!important}div.heat-js div.title-bar div.title div.titles-list div.titles div.title:not(.title-active):active{opacity:0.5!important}div.heat-js div.title-bar div.title div.titles-list div.titles div.title:not(.title-active):hover{cursor:pointer;background-color:var(--heat-js-title-background-color-hover)}div.heat-js div.title-bar div.title div.titles-list div.titles div.title:last-child{border-bottom:none}div.heat-js div.title-bar div.title div.titles-list div.titles div.title-active{background-color:var(--heat-js-title-background-color-hover);font-weight:900;cursor:default!important}div.heat-js div.title-bar button{background-color:var(--heat-js-button-background-color);border:var(--heat-js-border-size) solid var(--heat-js-button-border-color);color:var(--heat-js-button-text-color);border-radius:var(--heat-js-border-radius);padding-top:5px;padding-bottom:5px;padding-left:9px;padding-right:9px;outline:none;transition:var(--heat-js-transition)}div.heat-js div.title-bar button:active{background:var(--heat-js-button-background-color-active)!important}div.heat-js div.title-bar button:hover{cursor:pointer;background:var(--heat-js-button-background-color-hover)}div.heat-js div.title-bar button.active{cursor:default;background:var(--heat-js-button-background-color-hover);transition:var(--heat-js-transition)}div.heat-js div.title-bar button.back{margin-left:calc(var(--heat-js-spacing) * 2)!important}div.heat-js div.title-bar button.export{margin-right:calc(var(--heat-js-spacing) / 2)!important}div.heat-js div.title-bar div.year-text{margin-left:var(--heat-js-spacing);margin-right:var(--heat-js-spacing);display:inline-block;font-weight:var(--heat-js-title-bold-weight);position:relative;padding-top:5px;padding-bottom:5px;cursor:pointer}div.heat-js div.title-bar div.year-text div.down-arrow{display:inline-block;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid var(--heat-js-color-white);margin-left:calc(var(--heat-js-spacing) / 2)}div.heat-js div.title-bar div.year-text:hover div.years-list{display:block}div.heat-js div.title-bar div.year-text div.years-list{padding:5px;display:none;position:absolute;width:80px;left:50%;transform:translateX(-50%);margin-top:5px}div.heat-js div.title-bar div.year-text div.years-list div.years{border-radius:var(--heat-js-border-radius);background-color:var(--heat-js-years-background-color);border:var(--heat-js-border-size) solid var(--heat-js-years-border-color);color:var(--heat-js-years-text-color);height:183px;overflow-y:scroll;scroll-snap-type:y mandatory}div.heat-js div.title-bar div.year-text div.years-list div.years div.year{color:var(--heat-js-color-white);font-weight:var(--heat-js-text-bold-weight);border-bottom:var(--heat-js-border-size) dashed var(--heat-js-container-border-color);padding:var(--heat-js-spacing);text-align:center;width:100%;transition:var(--heat-js-transition);scroll-snap-align:start}div.heat-js div.title-bar div.year-text div.years-list div.years div.year:not(.year-active):active{opacity:0.5!important}div.heat-js div.title-bar div.year-text div.years-list div.years div.year:not(.year-active):hover{cursor:pointer;background-color:var(--heat-js-years-background-color-hover)}div.heat-js div.title-bar div.year-text div.years-list div.years div.year:last-child{border-bottom:none}div.heat-js div.title-bar div.year-text div.years-list div.years div.year-active{background-color:var(--heat-js-years-background-color-hover);font-weight:900;cursor:default!important}div.heat-js div.title-bar button.export,div.heat-js div.title-bar button.refresh{display:none}@media (min-width:768px){div.heat-js div.title-bar button.export,div.heat-js div.title-bar button.refresh{display:inline-block}}div.heat-js div.map-contents{overflow-x:scroll;overflow-y:hidden}div.heat-js div.map-contents div.map{display:inline-flex;flex-direction:row}div.heat-js div.map-contents div.map div.days{background-color:var(--heat-js-container-background-color);padding-right:calc(var(--heat-js-spacing) * 3);padding-top:calc(var(--heat-js-spacing-font-size) + var(--heat-js-spacing) + 1px);position:sticky;left:0;display:none;z-index:50}@media (min-width:768px){div.heat-js div.map-contents div.map div.days{display:block}}div.heat-js div.map-contents div.map div.days div.day-name{font-weight:var(--heat-js-text-bold-weight);text-align:left!important;height:var(--heat-js-day-size);margin-bottom:var(--heat-js-day-spacing);display:inline-flex;justify-content:center;flex-direction:column}div.heat-js div.map-contents div.map div.months{display:flex;justify-content:space-between;flex-grow:1}div.heat-js div.map-contents div.map div.months div.month{flex:1;pointer-events:none}div.heat-js div.map-contents div.map div.months div.month:last-child div.day-columns div.day-column:last-child div.day{margin-right:0!important}div.heat-js div.map-contents div.map div.months div.month div.month-name,div.heat-js div.map-contents div.map div.months div.month div.month-name-bottom{font-weight:var(--heat-js-text-bold-weight);text-align:left!important}div.heat-js div.map-contents div.map div.months div.month div.month-name{margin-bottom:var(--heat-js-spacing)}div.heat-js div.map-contents div.map div.months div.month div.month-name-bottom{margin-top:var(--heat-js-spacing)}div.heat-js div.map-contents div.map div.months div.month div.day-columns{display:flex;justify-content:space-between}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day,div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day-disabled{display:flex;border-radius:var(--heat-js-border-radius-day);width:var(--heat-js-day-size);height:var(--heat-js-day-size);margin-right:var(--heat-js-day-spacing);margin-bottom:var(--heat-js-day-spacing);font-size:.6rem;justify-content:center;align-items:center;overflow:hidden}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day:last-child,div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day-disabled:last-child{margin-bottom:0}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day{pointer-events:all;background-color:var(--heat-js-day-background-color);border:var(--heat-js-border-size) solid var(--heat-js-day-border-color);transition:var(--heat-js-transition)}div.heat-js div.map-contents div.map div.months div.month div.day-columns div.day-column div.day:hover{cursor:pointer;background:var(--heat-js-day-background-color-hover)}div.heat-js div.chart-contents{display:flex;overflow-x:scroll;overflow-y:hidden;text-wrap:nowrap;white-space:nowrap}div.heat-js div.chart-contents div.chart{display:inline-flex;flex-direction:row}div.heat-js div.chart-contents div.chart div.labels{background-color:var(--heat-js-container-background-color);padding-right:calc(var(--heat-js-spacing) * 3);padding-top:calc(var(--heat-js-spacing-font-size) + var(--heat-js-spacing) + 1px);position:sticky;left:0;display:none;border-right:var(--heat-js-border-size) solid var(--heat-js-container-border-color);z-index:50}@media (min-width:768px){div.heat-js div.chart-contents div.chart div.labels{display:block}}div.heat-js div.chart-contents div.chart div.labels div.label-0,div.heat-js div.chart-contents div.chart div.labels div.label-25,div.heat-js div.chart-contents div.chart div.labels div.label-50,div.heat-js div.chart-contents div.chart div.labels div.label-75,div.heat-js div.chart-contents div.chart div.labels div.label-100{font-weight:var(--heat-js-text-bold-weight);text-align:left!important;height:var(--heat-js-day-size);display:inline-flex;justify-content:center;flex-direction:column;position:absolute;left:0}div.heat-js div.chart-contents div.chart div.labels div.label-0{top:0}div.heat-js div.chart-contents div.chart div.labels div.label-25{top:25%;transform:translateY(-25%)}div.heat-js div.chart-contents div.chart div.labels div.label-50{top:50%;transform:translateY(-50%)}div.heat-js div.chart-contents div.chart div.labels div.label-75{top:75%;transform:translateY(-75%)}div.heat-js div.chart-contents div.chart div.labels div.label-100{bottom:0}div.heat-js div.chart-contents div.chart div.day-lines{flex:1;border-bottom:var(--heat-js-border-size) solid var(--heat-js-container-border-color)}div.heat-js div.chart-contents div.chart div.day-lines div.day-line{vertical-align:bottom;width:8px;margin-right:1px;display:inline-block}div.heat-js div.chart-contents div.chart div.day-lines div.day-line:last-child{margin-right:0}div.heat-js div.chart-contents div.chart-months{position:relative;height:calc(var(--heat-js-spacing-font-size) + var(--heat-js-spacing))}div.heat-js div.chart-contents div.chart-months div.month-name,div.heat-js div.chart-contents div.chart-months div.month-name-space{font-weight:var(--heat-js-text-bold-weight);text-align:left!important;position:absolute;bottom:0}div.heat-js div.chart-contents div.chart-months div.month-name-space{left:0;top:0;position:sticky;background-color:var(--heat-js-container-background-color)}div.heat-js div.guide{display:block}@media (min-width:768px){div.heat-js div.guide{display:flex}}div.heat-js div.guide div.map-types,div.heat-js div.guide div.map-toggles{margin-top:calc(var(--heat-js-spacing) + var(--heat-js-spacing) / 2)}@media (min-width:768px){div.heat-js div.guide div.map-types,div.heat-js div.guide div.map-toggles{flex-basis:100%;margin-bottom:0}}div.heat-js div.guide div.map-types{text-align:center}@media (min-width:768px){div.heat-js div.guide div.map-types{text-align:left}}div.heat-js div.guide div.map-types button{background-color:var(--heat-js-button-background-color);border:var(--heat-js-border-size) solid var(--heat-js-button-border-color);color:var(--heat-js-button-text-color);border-radius:var(--heat-js-border-radius);padding-top:5px;padding-bottom:5px;padding-left:9px;padding-right:9px;outline:none;transition:var(--heat-js-transition)}div.heat-js div.guide div.map-types button:active{background:var(--heat-js-button-background-color-active)!important}div.heat-js div.guide div.map-types button:hover{cursor:pointer;background:var(--heat-js-button-background-color-hover)}div.heat-js div.guide div.map-types button.active{cursor:default;background:var(--heat-js-button-background-color-hover);transition:var(--heat-js-transition)}div.heat-js div.guide div.map-types button{margin-left:0!important;margin-right:calc(var(--heat-js-spacing) / 2)!important}div.heat-js div.guide div.map-toggles{display:flex;align-items:center;justify-content:center;text-align:center}@media (min-width:768px){div.heat-js div.guide div.map-toggles{text-align:right;justify-content:right}}div.heat-js div.guide div.map-toggles div.less-text,div.heat-js div.guide div.map-toggles div.more-text{display:inline-block;font-weight:var(--heat-js-text-bold-weight);transition:var(--heat-js-transition)}div.heat-js div.guide div.map-toggles div.less-text:hover,div.heat-js div.guide div.map-toggles div.more-text:hover{cursor:pointer;text-decoration:underline}div.heat-js div.guide div.map-toggles div.less-text:active,div.heat-js div.guide div.map-toggles div.more-text:active{color:var(--heat-js-color-gray)}div.heat-js div.guide div.map-toggles div.less-text{margin-right:var(--heat-js-spacing)}div.heat-js div.guide div.map-toggles div.more-text{margin-left:var(--heat-js-spacing)}div.heat-js div.guide div.map-toggles div.days{display:inline-flex;align-items:center;justify-content:right}div.heat-js div.guide div.map-toggles div.days div.day{background-color:var(--heat-js-day-background-color);border:var(--heat-js-border-size) solid var(--heat-js-day-border-color);display:inline-block;border-radius:var(--heat-js-border-radius-day);width:var(--heat-js-day-size);height:var(--heat-js-day-size);margin-right:var(--heat-js-day-spacing);cursor:pointer;transition:var(--heat-js-transition)}div.heat-js div.guide div.map-toggles div.days div.day:last-child{margin-right:0}div.heat-js div.day-color-1:active,div.heat-js div.day-color-2:active,div.heat-js div.day-color-3:active,div.heat-js div.day-color-4:active{opacity:var(--heat-js-day-opacity-active)!important}div.heat-js div.day-color-1:hover,div.heat-js div.day-color-2:hover,div.heat-js div.day-color-3:hover,div.heat-js div.day-color-4:hover{opacity:var(--heat-js-day-opacity-hover)}div.heat-js div.day-color-1{background-color:var(--heat-js-day-color-1-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-1-border-color)!important;color:var(--heat-js-day-color-1-text-color)}div.heat-js div.day-color-2{background-color:var(--heat-js-day-color-2-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-2-border-color)!important;color:var(--heat-js-day-color-2-text-color)}div.heat-js div.day-color-3{background-color:var(--heat-js-day-color-3-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-3-border-color)!important;color:var(--heat-js-day-color-3-text-color)}div.heat-js div.day-color-4{background-color:var(--heat-js-day-color-4-background-color)!important;border:var(--heat-js-border-size-day) solid var(--heat-js-day-color-4-border-color)!important;color:var(--heat-js-day-color-4-text-color)} \ No newline at end of file diff --git a/dist/heat.min.js b/dist/heat.min.js index 978b498d..12e7c7b8 100644 --- a/dist/heat.min.js +++ b/dist/heat.min.js @@ -1,36 +1,37 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ -(function(){function V(){for(var a=g.domElementTypes,c=a.length,b=0;bd;d++)for(var e=O(a.currentView.year, -d),f=0;f=f.minimum)d=f;else break}return d}function ha(a){if(a.showTitle||a.showYearSelector||a.showRefreshButton||a.showExportButton){var c=n(a.currentView.element,"div","title-bar");if(a.showTitle){var b=r(c,"div","title",a.titleText);b=n(b,"div","titles-list");var d=n(b,"div","titles");b=r(d,"div","title",g.mapText); -d=r(d,"div","title",g.chartText);1!==a.currentView.view?b.onclick=function(){a.currentView.view=1;t(a);q(a.onNextYear,a.currentView.year)}:b.className+=p.space+"title-active";2!==a.currentView.view?d.onclick=function(){a.currentView.view=2;t(a);q(a.onNextYear,a.currentView.year)}:d.className+=p.space+"title-active"}a.showExportButton&&(r(c,"button","export",g.exportButtonText).onclick=function(){var f=h[a.currentView.element.id].type[a.currentView.type];var l=[];var k=[];l.push([J(g.dateText),J(g.countText)].join()); -for(var m in f)f.hasOwnProperty(m)&&k.push(m);k.sort();if(a.exportOnlyYearBeingViewed)for(k=0;12>k;k++){m=O(a.currentView.year,k);for(var w=0;wf;f++)-1f;f++)if(-1=B?z=!0:n(w,"div","day-disabled");if(z){var G=null;-1d;d++)if(-1k;k++)-1a.getDay()-1?6:a.getDay()-1}function da(a,c){var b=a,d=ca(c);b=b.replace("{dddd}",g.dayNames[d]);b=b.replace("{dd}",D(c.getDate()));b=b.replace("{d}",c.getDate());d=b.replace;var e=c.getDate(),f=g.thText;if(31===e||21===e||1===e)f=g.stText;else if(22===e||2===e)f=g.ndText;else if(23===e||3===e)f=g.rdText;b=d.call(b,"{o}",f);b=b.replace("{mmmm}",g.monthNames[c.getMonth()]);b=b.replace("{mm}",D(c.getMonth()+ -1));b=b.replace("{m}",c.getMonth()+1);b=b.replace("{yyyy}",c.getFullYear());b=b.replace("{yyy}",c.getFullYear().toString().substring(1));b=b.replace("{yy}",c.getFullYear().toString().substring(2));return b=b.replace("{y}",parseInt(c.getFullYear().toString().substring(2)).toString())}function v(a){return null!==a&&void 0!==a&&a!==p.empty}function M(a){return v(a)&&"object"===typeof a}function P(a){return v(a)&&"boolean"===typeof a}function A(a){return v(a)&&"string"===typeof a}function H(a){return v(a)&& -"function"===typeof a}function K(a){return v(a)&&"number"===typeof a}function R(a){return M(a)&&a instanceof Array}function n(a,c,b){c=c.toLowerCase();var d="text"===c;U.hasOwnProperty(c)||(U[c]=d?C.createTextNode(p.empty):C.createElement(c));c=U[c].cloneNode(!1);v(b)&&(c.className=b);a.appendChild(c);return c}function r(a,c,b,d){a=n(a,c,b);a.innerHTML=d;return a}function T(a,c,b){var d=null;b=v(b)?b:!1;Q.getComputedStyle?d=C.defaultView.getComputedStyle(a,null).getPropertyValue(c):a.currentStyle&& -(d=a.currentStyle[c]);b&&(d=parseFloat(d,10));return d}function q(a){var c=null;H(a)&&(c=a.apply(null,[].slice.call(arguments,1)));return c}function u(a,c){return A(a)?a:c}function x(a,c){return P(a)?a:c}function y(a,c){return H(a)?a:c}function fa(a){var c=!0,b=null;try{A(a)&&(b=JSON.parse(a))}catch(d){try{b=eval("("+a+")"),H(b)&&(b=b())}catch(e){g.safeMode||(console.error("Errors in object: "+d.message+", "+e.message),c=!1),b=null}}return{parsed:c,result:b}}function Y(){for(var a=[],c=0;32>c;c++){8!== -c&&12!==c&&16!==c&&20!==c||a.push("-");var b=Math.floor(16*Math.random()).toString(16);a.push(b)}return a.join(p.empty)}function D(a){a=a.toString();return 1===a.length?"0"+a:a}function I(a){return a.getFullYear()+"-"+D(a.getMonth()+1)+"-"+D(a.getDate())}function ea(){g.safeMode=x(g.safeMode,!0);var a=g,c=g.domElementTypes,b=["*"];A(c)?(c=c.split(p.space),0===c.length&&(c=b)):c=R(c)?c:b;a.domElementTypes=c;g.stText=u(g.stText,"st");g.ndText=u(g.ndText,"nd");g.rdText=u(g.rdText,"rd");g.thText=u(g.thText, -"th");g.backButtonText=u(g.backButtonText,"Back");g.nextButtonText=u(g.nextButtonText,"Next");g.refreshButtonText=u(g.refreshButtonText,"Refresh");g.exportButtonText=u(g.exportButtonText,"Export");g.lessText=u(g.lessText,"Less");g.moreText=u(g.moreText,"More");g.dateText=u(g.dateText,"Date");g.countText=u(g.countText,"Count");g.mapText=u(g.mapText,"Map");g.chartText=u(g.chartText,"Chart");N(g.monthNames,12)&&(g.monthNames="Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "));N(g.dayNames, -7)&&(g.dayNames="Mon Tue Wed Thu Fri Sat Sun".split(" "))}function N(a,c){c=K(c)?c:1;return!R(a)||a.lengthb&&(a.currentView.year=b,t(a),q(a.onSetYear,a.currentView.year))}return this};this.getYear=function(a){var c=null;h.hasOwnProperty(a)&&(c=h[a].options.currentView.year);return c}; -this.render=function(a,c){W(X(c,a));return this};this.renderAll=function(){V();return this};this.destroyAll=function(){for(var a in h)if(h.hasOwnProperty(a)){var c=h[a].options;c.currentView.element.innerHTML=p.empty;c.currentView.element.className=p.empty;q(c.onDestroy,c.currentView.element)}h={};return this};this.destroy=function(a){if(h.hasOwnProperty(a)){var c=h[a].options;c.currentView.element.innerHTML=p.empty;c.currentView.element.className=p.empty;q(c.onDestroy,c.currentView.element);delete h[a]}return this}; -this.setConfiguration=function(a){g=M(a)?a:{};ea();return this};this.getVersion=function(){return"1.5.0"};(function(a,c){C=a;Q=c;ea();C.addEventListener("DOMContentLoaded",function(){V()});v(Q.$heat)||(Q.$heat=this)})(document,window)})(); \ No newline at end of file +x(b.exportOnlyYearBeingViewed,!0);var d=b;var f=b.year;var e=(new Date).getFullYear();f=I(f)?f:e;d.year=f;b.showDayNumbers=x(b.showDayNumbers,!1);b.keepScrollPositions=x(b.keepScrollPositions,!1);d=b;f=b.extraSelectionYears;f=I(f)?f:50;d.extraSelectionYears=f;b.showYearSelectionDropDown=x(b.showYearSelectionDropDown,!0);b.view=w(b.view,null);b.showChartYLabels=x(b.showChartYLabels,!0);N(b.monthsToShow)&&(b.monthsToShow=[1,2,3,4,5,6,7,8,9,10,11,12]);N(b.daysToShow)&&(b.daysToShow=[1,2,3,4,5,6,7]); +d=b.mapRangeColors;f=[{minimum:10,cssClassName:"day-color-1",tooltipText:"Day Color 1"},{minimum:15,cssClassName:"day-color-2",tooltipText:"Day Color 2"},{minimum:20,cssClassName:"day-color-3",tooltipText:"Day Color 3"},{minimum:25,cssClassName:"day-color-4",tooltipText:"Day Color 4"}];d=R(d)?d:f;b.mapRangeColors=d;d=b.mapRangeColors.length;for(f=0;fd;d++)for(var f=O(a.currentView.year,d),e=0;e=e.minimum)d=e;else break}return d}function ha(a){if(a.showTitle||a.showYearSelector||a.showRefreshButton||a.showExportButton){var c=n(a.currentView.element,"div","title-bar"),b=n(c,"div","title");n(b,"div","down-arrow");a.showTitle&&(b.innerHTML+=a.titleText);b=n(b, +"div","titles-list");var d=n(b,"div","titles");b=r(d,"div","title",g.mapText);d=r(d,"div","title",g.chartText);1!==a.currentView.view?b.onclick=function(){a.currentView.view=1;t(a);q(a.onNextYear,a.currentView.year)}:b.className+=p.space+"title-active";2!==a.currentView.view?d.onclick=function(){a.currentView.view=2;t(a);q(a.onNextYear,a.currentView.year)}:d.className+=p.space+"title-active";a.showExportButton&&(r(c,"button","export",g.exportButtonText).onclick=function(){var e=h[a.currentView.element.id].type[a.currentView.type]; +var l=[];var k=[];l.push([H(g.dateText),H(g.countText)].join());for(var m in e)e.hasOwnProperty(m)&&k.push(m);k.sort();if(a.exportOnlyYearBeingViewed)for(k=0;12>k;k++){m=O(a.currentView.year,k);for(var u=0;ue;e++)-1e;e++)if(-1=A?z=!0:n(u,"div","day-disabled");if(z){var K=null;-1b;b++)if(-1k;k++)-1 +a.getDay()-1?6:a.getDay()-1}function da(a,c){var b=a,d=ca(c);b=b.replace("{dddd}",g.dayNames[d]);b=b.replace("{dd}",D(c.getDate()));b=b.replace("{d}",c.getDate());d=b.replace;var f=c.getDate(),e=g.thText;if(31===f||21===f||1===f)e=g.stText;else if(22===f||2===f)e=g.ndText;else if(23===f||3===f)e=g.rdText;b=d.call(b,"{o}",e);b=b.replace("{mmmm}",g.monthNames[c.getMonth()]);b=b.replace("{mm}",D(c.getMonth()+1));b=b.replace("{m}",c.getMonth()+1);b=b.replace("{yyyy}",c.getFullYear());b=b.replace("{yyy}", +c.getFullYear().toString().substring(1));b=b.replace("{yy}",c.getFullYear().toString().substring(2));return b=b.replace("{y}",parseInt(c.getFullYear().toString().substring(2)).toString())}function v(a){return null!==a&&void 0!==a&&a!==p.empty}function M(a){return v(a)&&"object"===typeof a}function P(a){return v(a)&&"boolean"===typeof a}function B(a){return v(a)&&"string"===typeof a}function F(a){return v(a)&&"function"===typeof a}function I(a){return v(a)&&"number"===typeof a}function R(a){return M(a)&& +a instanceof Array}function n(a,c,b){c=c.toLowerCase();var d="text"===c;U.hasOwnProperty(c)||(U[c]=d?C.createTextNode(p.empty):C.createElement(c));c=U[c].cloneNode(!1);v(b)&&(c.className=b);a.appendChild(c);return c}function r(a,c,b,d){a=n(a,c,b);a.innerHTML=d;return a}function T(a,c,b){var d=null;b=v(b)?b:!1;Q.getComputedStyle?d=C.defaultView.getComputedStyle(a,null).getPropertyValue(c):a.currentStyle&&(d=a.currentStyle[c]);b&&(d=parseFloat(d,10));return d}function q(a){var c=null;F(a)&&(c=a.apply(null, +[].slice.call(arguments,1)));return c}function w(a,c){return B(a)?a:c}function x(a,c){return P(a)?a:c}function y(a,c){return F(a)?a:c}function fa(a){var c=!0,b=null;try{B(a)&&(b=JSON.parse(a))}catch(d){try{b=eval("("+a+")"),F(b)&&(b=b())}catch(f){g.safeMode||(console.error("Errors in object: "+d.message+", "+f.message),c=!1),b=null}}return{parsed:c,result:b}}function Y(){for(var a=[],c=0;32>c;c++){8!==c&&12!==c&&16!==c&&20!==c||a.push("-");var b=Math.floor(16*Math.random()).toString(16);a.push(b)}return a.join(p.empty)} +function D(a){a=a.toString();return 1===a.length?"0"+a:a}function G(a){return a.getFullYear()+"-"+D(a.getMonth()+1)+"-"+D(a.getDate())}function ea(){g.safeMode=x(g.safeMode,!0);var a=g,c=g.domElementTypes,b=["*"];B(c)?(c=c.split(p.space),0===c.length&&(c=b)):c=R(c)?c:b;a.domElementTypes=c;g.stText=w(g.stText,"st");g.ndText=w(g.ndText,"nd");g.rdText=w(g.rdText,"rd");g.thText=w(g.thText,"th");g.backButtonText=w(g.backButtonText,"Back");g.nextButtonText=w(g.nextButtonText,"Next");g.refreshButtonText= +w(g.refreshButtonText,"Refresh");g.exportButtonText=w(g.exportButtonText,"Export");g.lessText=w(g.lessText,"Less");g.moreText=w(g.moreText,"More");g.dateText=w(g.dateText,"Date");g.countText=w(g.countText,"Count");g.mapText=w(g.mapText,"Map");g.chartText=w(g.chartText,"Chart");N(g.monthNames,12)&&(g.monthNames="Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "));N(g.dayNames,7)&&(g.dayNames="Mon Tue Wed Thu Fri Sat Sun".split(" "))}function N(a,c){c=I(c)?c:1;return!R(a)||a.lengthb&&(a.currentView.year=b,t(a),q(a.onSetYear,a.currentView.year))}return this};this.getYear=function(a){var c=null;h.hasOwnProperty(a)&&(c=h[a].options.currentView.year);return c};this.render=function(a,c){W(X(c,a));return this};this.renderAll=function(){V();return this};this.destroyAll= +function(){for(var a in h)if(h.hasOwnProperty(a)){var c=h[a].options;c.currentView.element.innerHTML=p.empty;c.currentView.element.className=p.empty;q(c.onDestroy,c.currentView.element)}h={};return this};this.destroy=function(a){if(h.hasOwnProperty(a)){var c=h[a].options;c.currentView.element.innerHTML=p.empty;c.currentView.element.className=p.empty;q(c.onDestroy,c.currentView.element);delete h[a]}return this};this.setConfiguration=function(a){g=M(a)?a:{};ea();return this};this.getVersion=function(){return"1.5.1"}; +(function(a,c){C=a;Q=c;ea();C.addEventListener("DOMContentLoaded",function(){V()});v(Q.$heat)||(Q.$heat=this)})(document,window)})(); \ No newline at end of file diff --git a/dist/themes/heat.js.light.theme.css b/dist/themes/heat.js.light.theme.css index 75f85f24..74844af1 100644 --- a/dist/themes/heat.js.light.theme.css +++ b/dist/themes/heat.js.light.theme.css @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ :root { /* Colors */ --heat-js-color-black: #F5F5F5; diff --git a/dist/translations/heat.translations.ar.js b/dist/translations/heat.translations.ar.js index 82bc026a..ee5d31ba 100644 --- a/dist/translations/heat.translations.ar.js +++ b/dist/translations/heat.translations.ar.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.bn.js b/dist/translations/heat.translations.bn.js index 426bf251..d3d3da43 100644 --- a/dist/translations/heat.translations.bn.js +++ b/dist/translations/heat.translations.bn.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.de.js b/dist/translations/heat.translations.de.js index 0b33bd7b..edc2fb4c 100644 --- a/dist/translations/heat.translations.de.js +++ b/dist/translations/heat.translations.de.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.en.js b/dist/translations/heat.translations.en.js index a17973ed..e4410c7d 100644 --- a/dist/translations/heat.translations.en.js +++ b/dist/translations/heat.translations.en.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "st", "ndText": "nd", diff --git a/dist/translations/heat.translations.es.js b/dist/translations/heat.translations.es.js index 7eb24d0b..0e034c7b 100644 --- a/dist/translations/heat.translations.es.js +++ b/dist/translations/heat.translations.es.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.fr.js b/dist/translations/heat.translations.fr.js index a3dd8a73..38b2e441 100644 --- a/dist/translations/heat.translations.fr.js +++ b/dist/translations/heat.translations.fr.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.hi.js b/dist/translations/heat.translations.hi.js index 23d4674d..acf2587b 100644 --- a/dist/translations/heat.translations.hi.js +++ b/dist/translations/heat.translations.hi.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.ja.js b/dist/translations/heat.translations.ja.js index 5d4b1c1b..1bc06723 100644 --- a/dist/translations/heat.translations.ja.js +++ b/dist/translations/heat.translations.ja.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.pl.js b/dist/translations/heat.translations.pl.js index bab27280..6a7d363d 100644 --- a/dist/translations/heat.translations.pl.js +++ b/dist/translations/heat.translations.pl.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.pt.js b/dist/translations/heat.translations.pt.js index 3d26f6d9..accebf50 100644 --- a/dist/translations/heat.translations.pt.js +++ b/dist/translations/heat.translations.pt.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.tr.js b/dist/translations/heat.translations.tr.js index b39b1852..4a73e8f9 100644 --- a/dist/translations/heat.translations.tr.js +++ b/dist/translations/heat.translations.tr.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/dist/translations/heat.translations.zh.js b/dist/translations/heat.translations.zh.js index ef6c249c..82c3d989 100644 --- a/dist/translations/heat.translations.zh.js +++ b/dist/translations/heat.translations.zh.js @@ -1,4 +1,4 @@ -/*! Heat.js v1.5.0 | (c) Bunoon 2024 | MIT License */ +/*! Heat.js v1.5.1 | (c) Bunoon 2024 | MIT License */ $heat.setConfiguration( { "stText": "", "ndText": "", diff --git a/docs/CHANGE_LOG.md b/docs/CHANGE_LOG.md index 32f8cc5d..276238c9 100644 --- a/docs/CHANGE_LOG.md +++ b/docs/CHANGE_LOG.md @@ -1,5 +1,18 @@ # Heat.js - Change Log: +## Version 1.5.1: +- Fixed an error in the binding option custom triggers documentation. +- Fixed the chart view showing the border at the bottom of each bar. +- Fixed the binding option "showMonthNames" not being used for the chart view. +- Added extra values for the Y axis on the chart view (now shows five values in total). +- Removed dead code that is no longer needed. +- Fixed the overflow CSS properties for the chart and map being the wrong type. +- Added a new binding option called "showChartYLabels", which states if the chart Y axis labels should be shown (defaults to true). +- Added arrows to the title and year text in the title bar (to help show that a drop-down menu is available for each). + +
+ + ## Version 1.5.0: #### **New Features:** diff --git a/docs/binding/CUSTOM_TRIGGERS.md b/docs/binding/CUSTOM_TRIGGERS.md index 8180f659..d9324e80 100644 --- a/docs/binding/CUSTOM_TRIGGERS.md +++ b/docs/binding/CUSTOM_TRIGGERS.md @@ -87,7 +87,7 @@ Fires when data for a heatmap is removed. ***Parameter:*** element: '*Object*' - The element that the data was removed from.
-### options.oReset( *element* ): +### options.onReset( *element* ): Fires when data for a heatmap is reset.
***Parameter:*** element: '*Object*' - The element that the data was reset for. diff --git a/docs/binding/OPTIONS.md b/docs/binding/OPTIONS.md index 4ac827e8..9949e72e 100644 --- a/docs/binding/OPTIONS.md +++ b/docs/binding/OPTIONS.md @@ -29,6 +29,7 @@ Below is a list of all the options supported in the "data-heat-options" binding | *number* | extraSelectionYears | States the extra years that should be included in the year drop-down list (defaults to 50). | | *boolean* | showYearSelectionDropDown | States if the year selection drop-down menu is shown (defaults to true). | | *boolean* | view | States the view that should be shown by default (defaults to "map", also accepts "chart"). | +| *boolean* | showChartYLabels | States if the chart Y axis labels should be shown (defaults to true). |
diff --git a/docs/images/main.png b/docs/images/main.png index 242940ae..cf3bb452 100644 Binary files a/docs/images/main.png and b/docs/images/main.png differ diff --git a/heat.js.nuspec b/heat.js.nuspec index bc1d1fa9..4c9e8d30 100644 --- a/heat.js.nuspec +++ b/heat.js.nuspec @@ -2,7 +2,7 @@ jHeat.js - 1.5.0 + 1.5.1 Heat.js A lightweight JavaScript library that generates customizable heat maps to visualize date-based activity and trends. William Troup diff --git a/package.json b/package.json index dff6a6d6..74c34c0c 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "jheat.js", "title": "Heat.js", "description": "A lightweight JavaScript library that generates customizable heat maps to visualize date-based activity and trends.", - "version": "1.5.0", + "version": "1.5.1", "main": "dist/heat.js", "homepage": "https://www.william-troup.com/heat-js/", "author": { diff --git a/src/heat.js b/src/heat.js index e2a8a7a0..8ab299a3 100644 --- a/src/heat.js +++ b/src/heat.js @@ -4,7 +4,7 @@ * A lightweight JavaScript library that generates customizable heat maps to visualize date-based activity and trends. * * @file observe.js - * @version v1.5.0 + * @version v1.5.1 * @author Bunoon * @license MIT License * @copyright Bunoon 2024 @@ -226,39 +226,44 @@ function renderControlTitleBar( bindingOptions ) { if ( bindingOptions.showTitle || bindingOptions.showYearSelector || bindingOptions.showRefreshButton || bindingOptions.showExportButton ) { - var titleBar = createElement( bindingOptions.currentView.element, "div", "title-bar" ); - + var titleBar = createElement( bindingOptions.currentView.element, "div", "title-bar" ), + title = createElement( titleBar, "div", "title" ); + + createElement( title, "div", "down-arrow" ); + if ( bindingOptions.showTitle ) { - var title = createElementWithHTML( titleBar, "div", "title", bindingOptions.titleText ), - titlesList = createElement( title, "div", "titles-list" ), - titles = createElement( titlesList, "div", "titles" ), - optionMap = createElementWithHTML( titles, "div", "title", _configuration.mapText ), - optionChart = createElementWithHTML( titles, "div", "title", _configuration.chartText ); - - if ( bindingOptions.currentView.view !== _elements_View_Map ) { - optionMap.onclick = function() { - bindingOptions.currentView.view = _elements_View_Map; - - renderControlContainer( bindingOptions ); - fireCustomTrigger( bindingOptions.onNextYear, bindingOptions.currentView.year ); - }; - - } else { - optionMap.className += _string.space + "title-active"; - } + title.innerHTML += bindingOptions.titleText; + } - if ( bindingOptions.currentView.view !== _elements_View_Chart ) { - optionChart.onclick = function() { - bindingOptions.currentView.view = _elements_View_Chart; - - renderControlContainer( bindingOptions ); - fireCustomTrigger( bindingOptions.onNextYear, bindingOptions.currentView.year ); - }; + var titlesList = createElement( title, "div", "titles-list" ), + titles = createElement( titlesList, "div", "titles" ), + optionMap = createElementWithHTML( titles, "div", "title", _configuration.mapText ), + optionChart = createElementWithHTML( titles, "div", "title", _configuration.chartText ); - } else { - optionChart.className += _string.space + "title-active"; - } + if ( bindingOptions.currentView.view !== _elements_View_Map ) { + optionMap.onclick = function() { + bindingOptions.currentView.view = _elements_View_Map; + + renderControlContainer( bindingOptions ); + fireCustomTrigger( bindingOptions.onNextYear, bindingOptions.currentView.year ); + }; + + } else { + optionMap.className += _string.space + "title-active"; + } + + if ( bindingOptions.currentView.view !== _elements_View_Chart ) { + optionChart.onclick = function() { + bindingOptions.currentView.view = _elements_View_Chart; + + renderControlContainer( bindingOptions ); + fireCustomTrigger( bindingOptions.onNextYear, bindingOptions.currentView.year ); + }; + + } else { + optionChart.className += _string.space + "title-active"; } + if ( bindingOptions.showExportButton ) { var exportData = createElementWithHTML( titleBar, "button", "export", _configuration.exportButtonText ); @@ -290,6 +295,8 @@ bindingOptions.currentView.yearText = createElementWithHTML( titleBar, "div", "year-text", bindingOptions.currentView.year ); + createElement( bindingOptions.currentView.yearText, "div", "down-arrow" ); + if ( bindingOptions.showYearSelectionDropDown ) { var yearList = createElement( bindingOptions.currentView.yearText, "div", "years-list" ), years = createElement( yearList, "div", "years" ), @@ -484,7 +491,6 @@ function renderControlChart( bindingOptions ) { var chart = createElement( bindingOptions.currentView.chartContents, "div", "chart" ), - chartMonths = createElement( bindingOptions.currentView.chartContents, "div", "chart-months " ), labels = createElement( chart, "div", "labels" ), dayLines = createElement( chart, "div", "day-lines" ), mapRangeColors = bindingOptions.mapRangeColors.sort( function( a, b ) { @@ -494,18 +500,28 @@ pixelsPerNumbers = bindingOptions.currentView.mapContents.offsetHeight / largestValueForCurrentYear, currentYear = bindingOptions.currentView.year, totalDays = 0, - dayLine = null, + labelsWidth = 0; + + if ( largestValueForCurrentYear > 0 && bindingOptions.showChartYLabels ) { + createElementWithHTML( labels, "div", "label-0", largestValueForCurrentYear.toString() ); + createElementWithHTML( labels, "div", "label-25", ( Math.floor( largestValueForCurrentYear / 4 ) * 3 ).toString() ); + createElementWithHTML( labels, "div", "label-50", Math.floor( largestValueForCurrentYear / 2 ).toString() ); + createElementWithHTML( labels, "div", "label-75", Math.floor( largestValueForCurrentYear / 4 ).toString() ); + createElementWithHTML( labels, "div", "label-100", "0" ); + labelsWidth = labels.offsetWidth + getStyleValueByName( labels, "margin-right", true ); - if ( largestValueForCurrentYear > 0 ) { - createElementWithHTML( labels, "div", "label-top", largestValueForCurrentYear.toString() ); - createElementWithHTML( labels, "div", "label-middle", Math.floor( largestValueForCurrentYear / 2 ).toString() ); - createElementWithHTML( labels, "div", "label-bottom", "0" ); + } else { + labels.parentNode.removeChild( labels ); + labels = null; } if ( largestValueForCurrentYear === 0 ) { chart.style.minHeight = bindingOptions.currentView.mapContents.offsetHeight + "px"; - labels.style.display = "none"; + + if ( isDefined( labels ) ) { + labels.style.display = "none"; + } } else { var totalMonths = 0; @@ -519,7 +535,7 @@ for ( var dayIndex = 0; dayIndex < totalDaysInMonth; dayIndex++ ) { if ( bindingOptions.daysToShow.indexOf( actualDay ) > -1 ) { - dayLine = renderControlChartDay( dayLines, bindingOptions, dayIndex + 1, monthIndex1, currentYear, mapRangeColors, pixelsPerNumbers ); + renderControlChartDay( dayLines, bindingOptions, dayIndex + 1, monthIndex1, currentYear, mapRangeColors, pixelsPerNumbers ); } if ( ( dayIndex + 1 ) % 7 === 0 ) { @@ -532,20 +548,23 @@ } } - var linesWidth = dayLines.offsetWidth / totalMonths; + if ( bindingOptions.showMonthNames ) { + var chartMonths = createElement( bindingOptions.currentView.chartContents, "div", "chart-months " ), + linesWidth = dayLines.offsetWidth / totalMonths; - for ( var monthIndex2 = 0; monthIndex2 < 12; monthIndex2++ ) { - if ( bindingOptions.monthsToShow.indexOf( monthIndex2 + 1 ) > -1 ) { - var monthName = createElementWithHTML( chartMonths, "div", "month-name", _configuration.monthNames[ monthIndex2 ] ); - monthName.style.marginLeft = labelsWidth + ( linesWidth * monthIndex2 ) + "px"; + for ( var monthIndex2 = 0; monthIndex2 < 12; monthIndex2++ ) { + if ( bindingOptions.monthsToShow.indexOf( monthIndex2 + 1 ) > -1 ) { + var monthName = createElementWithHTML( chartMonths, "div", "month-name", _configuration.monthNames[ monthIndex2 ] ); + monthName.style.marginLeft = labelsWidth + ( linesWidth * monthIndex2 ) + "px"; + } } - } - chartMonths.style.width = dayLines.offsetWidth + "px"; + chartMonths.style.width = dayLines.offsetWidth + "px"; - var monthNameSpace = createElement( chartMonths, "div", "month-name-space" ); - monthNameSpace.style.height = chartMonths.offsetHeight + "px"; - monthNameSpace.style.width = labelsWidth + "px"; + var monthNameSpace = createElement( chartMonths, "div", "month-name-space" ); + monthNameSpace.style.height = chartMonths.offsetHeight + "px"; + monthNameSpace.style.width = labelsWidth + "px"; + } if ( bindingOptions.keepScrollPositions ) { bindingOptions.currentView.chartContents.scrollLeft = bindingOptions.currentView.chartContentsScrollLeft; @@ -567,6 +586,7 @@ } dayLine.style.height = ( dateCount * pixelsPerNumbers ) + "px"; + dayLine.style.setProperty( "border-bottom-width", "0", "important" ); if ( isDefinedFunction( bindingOptions.onDayClick ) ) { dayLine.onclick = function() { @@ -582,8 +602,6 @@ if ( isDefined( useMapRangeColor ) && isHeatMapColorVisible( bindingOptions, useMapRangeColor.id ) ) { dayLine.className += _string.space + useMapRangeColor.cssClassName; } - - return dayLine; } @@ -818,6 +836,7 @@ options.extraSelectionYears = getDefaultNumber( options.extraSelectionYears, 50 ); options.showYearSelectionDropDown = getDefaultBoolean( options.showYearSelectionDropDown, true ); options.view = getDefaultString( options.view, null ); + options.showChartYLabels = getDefaultBoolean( options.showChartYLabels, true ); if ( isInvalidOptionArray( options.monthsToShow ) ) { options.monthsToShow = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 ]; @@ -1657,7 +1676,7 @@ * @returns {string} The version number. */ this.getVersion = function() { - return "1.5.0"; + return "1.5.1"; }; diff --git a/src/heat.js.scss b/src/heat.js.scss index 8eb8f007..e161f7c4 100644 --- a/src/heat.js.scss +++ b/src/heat.js.scss @@ -1,5 +1,5 @@ /* - * Heat.js Library v1.5.0 + * Heat.js Library v1.5.1 * * Copyright 2024 Bunoon * Released under the MIT License @@ -81,7 +81,7 @@ /* ------------------------------------------------------------------------- - Heat.js - Buttons + Heat.js - Mixins ------------------------------------------------------------------------- */ @@ -115,6 +115,25 @@ } } +@mixin down-arrow($left-right-border-size: 8px, $border-top-size: 14px, $left: true, $margin-size: var(--heat-js-spacing)) { + div.down-arrow { + display: inline-block; + width: 0; + height: 0; + border-left: $left-right-border-size solid transparent; + border-right: $left-right-border-size solid transparent; + border-top: $border-top-size solid var(--heat-js-color-white); + + @if ($left) { + margin-right: $margin-size; + } + @else { + margin-left: $margin-size; + } + } +} + + /* ------------------------------------------------------------------------- Heat.js - Container @@ -171,6 +190,8 @@ div.heat-js { padding-bottom: $title-margin; cursor: pointer; + @include down-arrow; + &:hover div.titles-list { display: block; } @@ -245,6 +266,8 @@ div.heat-js { padding-bottom: $year-margin; cursor: pointer; + @include down-arrow( 6px, 9px, false, calc( var(--heat-js-spacing) / 2 ) ); + &:hover div.years-list { display: block; } @@ -320,7 +343,8 @@ div.heat-js { div.heat-js { div.map-contents { - overflow-y: scroll; + overflow-x: scroll; + overflow-y: hidden; div.map { display: inline-flex; @@ -436,7 +460,8 @@ div.heat-js { div.heat-js { div.chart-contents { display: flex; - overflow-y: scroll; + overflow-x: scroll; + overflow-y: hidden; text-wrap: nowrap; white-space: nowrap; @@ -458,9 +483,11 @@ div.heat-js { display: block; } - div.label-top, - div.label-middle, - div.label-bottom { + div.label-0, + div.label-25, + div.label-50, + div.label-75, + div.label-100 { font-weight: var(--heat-js-text-bold-weight); text-align: left !important; height: var(--heat-js-day-size); @@ -471,16 +498,26 @@ div.heat-js { left: 0; } - div.label-top { + div.label-0 { top: 0; } - div.label-middle { + div.label-25 { + top: 25%; + transform: translateY(-25%); + } + + div.label-50 { top: 50%; transform: translateY(-50%); } - div.label-bottom { + div.label-75 { + top: 75%; + transform: translateY(-75%); + } + + div.label-100 { bottom: 0; } }