clockd3js - npm Package Compare versions

Comparing version 0.0.61 to 0.0.71

Clock.js

@@ -29,3 +29,3 @@ const d3 = require("d3");
   const _clock = _root_element.append("svg")
-    .attr("id", "clock-d3js")
+    .classed("clock-d3js", true)
     .attr("width", _width)
@@ -37,2 +37,3 @@ .attr("height", _height)
 
+  let _dark_mode = params.dark_mode || false;
 
@@ -112,3 +113,3 @@ const time = d3.timeFormat(params.time_format || "%H:%M:%S")
       .attr("transform", `translate(${_width / 2}, ${_height / 2})`)
-      .attr("stroke", row_type === "second" ? "red" : "black")
+      .attr("stroke", row_type === "second" ? "red" : (_dark_mode ? "white" : "black"))
       .attr("stroke-width", row_types[row_type].stroke_width)
@@ -125,2 +126,7 @@
   const drawCircle = (class_name, radius) => {
+    let stroke = "black";
+    if(class_name === "main-circle" && !_show_main_circle) {
+      stroke = "transparent"
+    }
+
     _clock.append("circle")
@@ -131,6 +137,15 @@ .classed(class_name, true)
       .attr("r", radius)
-      .attr("stroke", "black")
-      .attr("fill", "none")
+      .attr("stroke", _dark_mode ? "white" : stroke)
+      .attr("fill", _dark_mode ? "black" : "none")
   }
 
+  const drawCircles = () => {
+    const circles = {
+      "main-circle": _radius,
+      "center-circle": _center_point_radius
+    };
+
+    Object.keys(circles).map(circle_class => drawCircle(circle_class, circles[circle_class]));
+  }
+
   /**
@@ -184,3 +199,3 @@ * расчитывает внутренний радиус для tick'ов на часах
       .attr("d", arc)
-      .attr("stroke", "black")
+      .attr("stroke", _dark_mode ? "white" : "black")
       .attr("stroke-width", tick_params[type].stroke_width)
@@ -200,2 +215,3 @@
         .style("text-anchor", "middle")
+        .attr("fill", _dark_mode ? "white" : "black")
         .text(({index}) => _hours[index])
@@ -254,3 +270,3 @@ }
               .attr("height", 25)
-              .attr("fill", "white")
+              .attr("fill", _dark_mode ? "black" : "white")
 
@@ -296,2 +312,3 @@ info_g.append("text")
       .attr("cursor", "pointer")
+      .attr("fill", _dark_mode ? "white" : "black")
   }
@@ -316,3 +333,7 @@
   this.setText = (text, link = "") => {
-    appendText(text, link, "clock-link");
+    // добавляем текст в последнюю очередь - нужно для dark_mode
+    // без timeout'a чёрный фон закрасит текст
+    setTimeout(() => {
+      appendText(text, link, "clock-link");
+    }, 0);
 
@@ -327,6 +348,3 @@ return this;
   this.draw = () => {
-    if(_show_main_circle) {
-      drawCircle("main-circle", _radius);
-    }
-    drawCircle("center-circle", _center_point_radius);
+    drawCircles();
 
@@ -333,0 +351,0 @@ ["hour", "minute"].map(time_type => drawTicks(time_type));

package.json

 {
   "name": "clockd3js",
-  "version": "0.0.61",
+  "version": "0.0.71",
   "description": "Clock writen with d3js",
@@ -5,0 +5,0 @@ "main": "Clock.js",

README.md

@@ -21,2 +21,3 @@ # Clockd3js
   show_hour: false,
+  dark_mode: true,
   times: [
@@ -51,2 +52,3 @@ {start: "07:20", end: "07:45", name: "Breakfast", color: "blue"},
 times|Array|time intervals to show on clock|[ ]
+dark_mode|Boolean|clock dark mode|false
 
@@ -53,0 +55,0 @@ **Methods**

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

13703

increased by6.09%

Lines of code

292

increased by5.42%

Number of lines in readme file

60

increased by3.45%

No dependency changes