Commit 7feeb3b3 by doszhang

dos

parent 1af3b436

4 KB | W: | H:

4 KB | W: | H:

Public/static/image2/._poster.jpg
Public/static/image2/._poster.jpg
Public/static/image2/._poster.jpg
Public/static/image2/._poster.jpg
  • 2-up
  • Swipe
  • Onion skin
...@@ -48,24 +48,24 @@ var myCanvas; ...@@ -48,24 +48,24 @@ var myCanvas;
var username = ''; var username = '';
preloadimages(preloadImageList, function () { preloadimages(preloadImageList, function () {
}, function (progress) { }, function (progress) {
}); });
$('input[name=username]').attr('placeholder','点击输入您的名字'); $('input[name=username]').attr('placeholder', '点击输入您的名字');
$('.canvas-block').html('<canvas id="myCanvas" width="'+ pxchange(315) +'" height="'+ pxchange(316) +'"></canvas><img class="posterimg" />'); $('.canvas-block').html('<canvas id="myCanvas" width="' + pxchange(315) + '" height="' + pxchange(316) + '"></canvas><img class="posterimg" />');
$('.page1').show(); $('.page1').show();
$(document).ready(function () { $(document).ready(function () {
$("input").on("blur",function(){ $("input").on("blur", function () {
window.scroll(0,0);//失焦后强制让页面归位 window.scroll(0, 0); //失焦后强制让页面归位
}); });
$('input').on('input',onInput) $('input').on('input', onInput)
function getLength(str) { function getLength(str) {
return str.replace(/[^ -~]/g, 'AA').length; return str.replace(/[^ -~]/g, 'AA').length;
} }
...@@ -90,26 +90,25 @@ $(document).ready(function () { ...@@ -90,26 +90,25 @@ $(document).ready(function () {
window.onInput = onInput; window.onInput = onInput;
$('.btn-create').on('click',function() { $('.btn-create').on('click', function () {
username = $('input[name=username]').val(); username = $('input[name=username]').val();
initCanvas(); initCanvas();
if(username.match(/^\s*$/)) if (username.match(/^\s*$/)) {
{
$('#notification_area').remove(); $('#notification_area').remove();
my_notify('您还没有输入名字'); my_notify('您还没有输入名字');
return false; return false;
} }
checkWord(username,function(){ checkWord(username, function () {
my_notify('正在生成海报,请稍后',999999); my_notify('正在生成海报,请稍后', 999999);
var img = new Image(); var img = new Image();
img.src = 'Public/static/image2/poster.jpg'; img.src = 'Public/static/image2/poster.png';
img.onload = function () { img.onload = function () {
ctx.drawImage(img, 0, 0, myCanvas.width, myCanvas.height); ctx.drawImage(img, 0, 0, myCanvas.width, myCanvas.height);
txtDraw(ctx, username, pxchange(158), pxchange(238), pxchange(40), 'normal', '#ffffff'); txtDraw(ctx, username, pxchange(158), pxchange(238), pxchange(40), 'normal', '#ffffff');
$('.posterimg').show(); $('.posterimg').show();
$('.posterimg').attr('src',getManBase64()); $('.posterimg').attr('src', getManBase64());
$('.username').hide(); $('.username').hide();
$('.tip').show(); $('.tip').show();
$('.btn-create').hide(); $('.btn-create').hide();
...@@ -119,10 +118,10 @@ $(document).ready(function () { ...@@ -119,10 +118,10 @@ $(document).ready(function () {
}); });
}); });
$('.btn-retry').on('click',function(){ $('.btn-retry').on('click', function () {
ctx.clearRect(0,0,myCanvas.width,myCanvas.height); ctx.clearRect(0, 0, myCanvas.width, myCanvas.height);
$('.posterimg').hide(); $('.posterimg').hide();
$('.posterimg').attr('src',''); $('.posterimg').attr('src', '');
$('input[name=username]').val(''); $('input[name=username]').val('');
$('.username').show(); $('.username').show();
$('.tip').hide(); $('.tip').hide();
...@@ -131,20 +130,17 @@ $(document).ready(function () { ...@@ -131,20 +130,17 @@ $(document).ready(function () {
}); });
}); });
function checkWord(name,callback) { function checkWord(name, callback) {
$.ajax({ $.ajax({
url: '/index/checkWord', url: '/index/checkWord',
type: 'POST', type: 'POST',
data:{ data: {
name:name name: name
}, },
success: function(resp){ success: function (resp) {
if(resp.status == 1) if (resp.status == 1) {
{
callback(); callback();
} } else {
else
{
$('#notification_area').remove(); $('#notification_area').remove();
my_notify(resp.msg); my_notify(resp.msg);
} }
...@@ -160,7 +156,7 @@ function txtDraw(ctx, content, x, y, fontsize, fontweight, color) { ...@@ -160,7 +156,7 @@ function txtDraw(ctx, content, x, y, fontsize, fontweight, color) {
x = x * 4; x = x * 4;
y = y * 4; y = y * 4;
fontsize = fontsize * 4; fontsize = fontsize * 4;
ctx.font = fontweight + ' '+fontsize+'px fzlt'; ctx.font = fontweight + ' ' + fontsize + 'px fzlt';
var width = ctx.measureText(content).width; var width = ctx.measureText(content).width;
var cx = x - width / 2; var cx = x - width / 2;
...@@ -185,13 +181,12 @@ function txtDraw(ctx, content, x, y, fontsize, fontweight, color) { ...@@ -185,13 +181,12 @@ function txtDraw(ctx, content, x, y, fontsize, fontweight, color) {
function initCanvas() { function initCanvas() {
myCanvas = $('#myCanvas')[0]; myCanvas = $('#myCanvas')[0];
ctx = myCanvas.getContext("2d"); ctx = myCanvas.getContext("2d");
ctx.scale(2,2); ctx.scale(2, 2);
myCanvas.width = pxchange(1260); myCanvas.width = pxchange(1260);
myCanvas.height = pxchange(1264); myCanvas.height = pxchange(1264);
} }
function pxchange(px) function pxchange(px) {
{
var rem = px / 20; var rem = px / 20;
var fontSize = parseFloat($('html').css('fontSize')); var fontSize = parseFloat($('html').css('fontSize'));
return rem * fontSize; return rem * fontSize;
...@@ -200,7 +195,7 @@ function pxchange(px) ...@@ -200,7 +195,7 @@ function pxchange(px)
//获取随机数方法 //获取随机数方法
//min 最小值 //min 最小值
//max 最大值 //max 最大值
function RandomNumBoth(Min,Max){ function RandomNumBoth(Min, Max) {
var Range = Max - Min; var Range = Max - Min;
var Rand = Math.random(); var Rand = Math.random();
var num = Min + Math.round(Rand * Range); //四舍五入 var num = Min + Math.round(Rand * Range); //四舍五入
......
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