Skip to content

php / ccb-lantern

Go to a project
Commit 7728d8f1 by doszhang
Options

dos

parent f1d371b3
Showing with 62 additions and 60 deletions
Public/static/js/common.js
......@@ -432,9 +432,11 @@ function calculationWrap() {
}
function createPoster() {
//初始化海报canvas
let canvasinfo = initCanvas('.poster-canvas-block', 'posterCanvas', 640 * 2, 1238 * 2, true);
posterCanvas = canvasinfo[0];
posterCtx = canvasinfo[1];
//计算每行文字数量
wrapNum = calculationWrap();
$('.poster-list-page').show();
$('.poster-page .poster-canvas-block').append($('<img class="posterImg" src="" />'));
......@@ -443,66 +445,66 @@ function createPoster() {
createList('.poster-list-page .poster-list', flagStack[i], i + 1, wrapNum);
}
let flagListHeight = $('.poster-list-page .poster-list').height();
flagListHeight = (flagListHeight / fontSize) * 20;
flagListHeight = flagListHeight + 20;
let topHalfHeight = 489;
let bottomHalfHeight = 368;
let posterCanvasHeight = 0;
flagListHeight = flagListHeight + 60;
if (flagListHeight < 383) {
posterCanvasHeight = topHalfHeight + 383 + bottomHalfHeight;
flagListHeight = 383;
} else {
posterCanvasHeight = topHalfHeight + flagListHeight + bottomHalfHeight;
}
$('#posterCanvas').remove();
canvasinfo = initCanvas('.poster-canvas-block', 'posterCanvas', 640 * 2, posterCanvasHeight * 2, true);
posterCanvas = canvasinfo[0];
posterCtx = canvasinfo[1];
$('#posterCanvas').css('height', pxToRem(posterCanvasHeight));
posterCtx.fillStyle = bgColor;
posterCtx.fillRect(0, 0, posterCanvas.width, posterCanvas.height);
//45 107
let topHalf = new Image();
topHalf.src = "/Public/static/image2/poster-tophalf.png";
topHalf.onload = function () {
//画海报上半部分
posterCtx.drawImage(topHalf, pxToRem(45 * 2), pxToRem(107 * 2), pxToRem(550 * 2), pxToRem(382 * 2));
posterCtx.save();
posterCtx.restore();
//画海报中部背景
posterCtx.fillStyle = '#f4f4f4';
posterCtx.fillRect(pxToRem(45 * 2), pxToRem(489 * 2), pxToRem(550 * 2), pxToRem(flagListHeight * 2));
posterCtx.save();
posterCtx.restore();
//画海报底部
let bottomHalf = new Image();
bottomHalf.src = "/Public/static/image2/poster-bottomhalf.png";
bottomHalf.onload = function () {
bottomHalfTop = pxToRem(487) + pxToRem(flagListHeight);
$('.poster-tip').css('top', bottomHalfTop + pxToRem(181));
posterCtx.drawImage(bottomHalf, pxToRem(45 * 2), bottomHalfTop * 2, pxToRem(550 * 2), pxToRem(238 * 2));
drawFlagItem(pxToRem(489 + 20));
let decorate = new Image();
decorate.src = checkedDecorate;
decorate.onload = function () {
posterCtx.drawImage(decorate, pxToRem(170 * 2), pxToRem(305 * 2), pxToRem(300 * 2), pxToRem(150 * 2));
flagTextDraw(posterCtx, signature, pxToRem(40 * 2), '#222222', pxToRem(230 * 2), (bottomHalfTop + pxToRem(103)) * 2, 'font');
flagTextDraw(posterCtx, getTime(), pxToRem(20 * 2), '#222222', pxToRem(230 * 2), (bottomHalfTop + pxToRem(136)) * 2);
setTimeout(function () {
$('.posterImg').attr('src', getManBase64(posterCanvas)).css('height', pxToRem(posterCanvasHeight));
}, 1000);
}
}
}
// let flagListHeight = $('.poster-list-page .poster-list').height();
// flagListHeight = (flagListHeight / fontSize) * 20;
// flagListHeight = flagListHeight + 20;
// let topHalfHeight = 489;
// let bottomHalfHeight = 368;
// let posterCanvasHeight = 0;
// flagListHeight = flagListHeight + 60;
// if (flagListHeight < 383) {
// posterCanvasHeight = topHalfHeight + 383 + bottomHalfHeight;
// flagListHeight = 383;
// } else {
// posterCanvasHeight = topHalfHeight + flagListHeight + bottomHalfHeight;
// }
// $('#posterCanvas').remove();
// canvasinfo = initCanvas('.poster-canvas-block', 'posterCanvas', 640 * 2, posterCanvasHeight * 2, true);
// posterCanvas = canvasinfo[0];
// posterCtx = canvasinfo[1];
// $('#posterCanvas').css('height', pxToRem(posterCanvasHeight));
// posterCtx.fillStyle = bgColor;
// posterCtx.fillRect(0, 0, posterCanvas.width, posterCanvas.height);
// //45 107
// let topHalf = new Image();
// topHalf.src = "/Public/static/image2/poster-tophalf.png";
// topHalf.onload = function () {
// //画海报上半部分
// posterCtx.drawImage(topHalf, pxToRem(45 * 2), pxToRem(107 * 2), pxToRem(550 * 2), pxToRem(350 * 2));
// posterCtx.save();
// posterCtx.restore();
// //画海报中部背景
// posterCtx.fillStyle = '#ffffff';
// posterCtx.fillRect(pxToRem(45 * 2), pxToRem(488 * 2), pxToRem(550 * 2), pxToRem(flagListHeight * 2));
// posterCtx.save();
// posterCtx.restore();
// //画海报底部
// let bottomHalf = new Image();
// bottomHalf.src = "/Public/static/image2/poster-bottomhalf.png";
// bottomHalf.onload = function () {
// bottomHalfTop = pxToRem(487) + pxToRem(flagListHeight);
// $('.poster-tip').css('top', bottomHalfTop + pxToRem(181));
// posterCtx.drawImage(bottomHalf, pxToRem(45 * 2), bottomHalfTop * 2, pxToRem(550 * 2), pxToRem(207 * 2));
// drawFlagItem(pxToRem(489 + 20));
// let decorate = new Image();
// decorate.src = checkedDecorate;
// decorate.onload = function () {
// posterCtx.drawImage(decorate, pxToRem(170 * 2), pxToRem(305 * 2), pxToRem(300 * 2), pxToRem(150 * 2));
// flagTextDraw(posterCtx, signature, pxToRem(40 * 2), '#222222', pxToRem(230 * 2), (bottomHalfTop + pxToRem(103)) * 2, 'font');
// flagTextDraw(posterCtx, getTime(), pxToRem(20 * 2), '#222222', pxToRem(230 * 2), (bottomHalfTop + pxToRem(136)) * 2);
// setTimeout(function () {
// $('.posterImg').attr('src', getManBase64(posterCanvas)).css('height', pxToRem(posterCanvasHeight));
// }, 1000);
// }
// }
// }
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment