dos

Public/static/js/common.js

@@ -158,12 +158,31 @@ function createPoster() {
         headimg.src = window.getImageUrl + '?url=' + encodeURI(user_header_url);
         headimg.onload = function () {
             // posterCtx.drawImage(headimg, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52));
-            drawRoundRect(posterCtx, designPxToRealPx(5), designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52), headimg);
+            drawRoundedRect(posterCtx, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52), designPxToRealPx(5),
+                '#0f5188');
+            drawRoundRectImg(posterCtx, designPxToRealPx(5), designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52), headimg);
         }
     }
 }
 
-function drawRoundRect(ctx, r, x, y, w, h, img) {
+function drawRoundedRect(ctx, x, y, width, height, r, fill, stroke) {
+    ctx.save();
+    ctx.beginPath(); // draw top and top right corner 
+    ctx.moveTo(x + r, y);
+    ctx.arcTo(x + width, y, x + width, y + r, r); // draw right side and bottom right corner 
+    ctx.arcTo(x + width, y + height, x + width - r, y + height, r); // draw bottom and bottom left corner 
+    ctx.arcTo(x, y + height, x, y + height - r, r); // draw left and top left corner 
+    ctx.arcTo(x, y, x + r, y, r);
+    if (fill) {
+        ctx.fill();
+    }
+    if (stroke) {
+        ctx.stroke();
+    }
+    ctx.restore();
+}
+
+function drawRoundRectImg(ctx, r, x, y, w, h, img) {
     ctx.save()
     if (w < 2 * r) r = w / 2
     if (h < 2 * r) r = h / 2