Leisuretimedock/blessing-skin-server
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added real-time 2d preview

Browse Source
This commit is contained in:
printempw 2016-02-10 18:59:14 +08:00
parent 9caab363d2
commit 15b9715aef
3 changed files with 28 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
assets/css/user.style.css
View File

@ -2,7 +2,7 @@
* @Author: prpr
* @Date: 2016-01-21 19:12:06
* @Last Modified by: prpr
* @Last Modified time: 2016-02-05 18:50:36
* @Last Modified time: 2016-02-10 15:41:59
*/
.home-menu-blur {
@ -100,7 +100,7 @@ input[type=radio] {
.container {
position: initial !important;
}
#skinpreview > p {
#preview-2d > p {
height: 64px;
line-height: 64px;
}

25
assets/js/user.utils.js
View File

@ -2,7 +2,7 @@
* @Author: prpr
* @Date: 2016-01-21 13:56:40
* @Last Modified by: prpr
* @Last Modified time: 2016-02-07 10:25:41
* @Last Modified time: 2016-02-10 18:54:54
*/
'use strict';
@ -33,8 +33,11 @@ function handleFiles(files, type) {
}
if (type == "skin") {
MSP.changeSkin(img.src);
var model = $('#model-alex').prop('checked') ? "alex" : "steve";
change2dTexture(model, img.src);
} else {
MSP.changeCape(img.src);
change2dTexture('cape', img.src);
}
};
img.onerror = function () {
@ -76,21 +79,19 @@ $("[title='Rotation']").click(function(){
function show2dPreview() {
$('#canvas3d').remove();
$('.operations').hide();
$("#skinpreview").html($('<p>Steve 模型的皮肤：</p>').append($('<img />').addClass('skin2d').attr('src', '../skin/'+docCookies.getItem('uname')+'-steve.png?v='+Math.random())));
$("#skinpreview").append($('<p>Alex 模型的皮肤：</p>').append($('<img />').addClass('skin2d').attr('src', '../skin/'+docCookies.getItem('uname')+'-alex.png?v='+Math.random())));
$("#skinpreview").append($('<p>披风：</p>').append($('<img />').addClass('skin2d').attr('src', '../cape/'+docCookies.getItem('uname')+'.png?v='+Math.random())));
$('#preview').html('3D Preview').attr('href', 'javascript:show3dPreview();');
$('#preview-2d').show();
$('#preview').html('3D 皮肤预览').attr('href', 'javascript:show3dPreview();');
}
function show3dPreview() {
$('#skinpreview').html('');
$('#preview-2d').hide();
$('.operations').show();
init3dCanvas()
$('#preview').html('2D Preview').attr('href', 'javascript:show2dPreview();');
$('#preview').html('2D 皮肤预览').attr('href', 'javascript:show2dPreview();');
}
$("#upload").click(function(){
var model = $('#model-steve').prop('checked') ? "steve" : "alex";
var model = $('#model-alex').prop('checked') ? "alex" : "steve";
var skin_file = $('#skininput').get(0).files[0];
var cape_file = $('#capeinput').get(0).files[0];
var form_data = new FormData();
@ -147,3 +148,11 @@ function changeModel(uname) {
});
}
$(document).ready(function(){
$('#preview-2d').hide();
$('#model-steve').prop('checked', true);
});
function change2dTexture(type, file) {
$('#'+type).attr('src', file);
}

11
user/preview.php
View File

@ -3,10 +3,17 @@
* @Author: prpr
* @Date: 2016-02-04 19:37:21
* @Last Modified by: prpr
* @Last Modified time: 2016-02-06 23:24:56
* @Last Modified time: 2016-02-10 18:37:35
*/
?>
<div id="skinpreview"></div>
<div id="skinpreview">
<div id="preview-2d">
<p>Steve 模型的皮肤：<img id="steve" class="skin2d" src="<?php echo "../textures/".$user->getTexture('skin');?>" /></p>
<p>Alex 模型的皮肤：<img id="alex" class="skin2d" src="<?php echo "../textures/".$user->getTexture('alex');?>" /></p>
<p>披风：<img id="cape" class="skin2d" src="<?php echo "../textures/".$user->getTexture('cape');?>" /></p>
</div>
</div>
<script type="text/javascript" src="../libs/three.js"></script>
<script type="text/javascript" src="../libs/three.msp.js"></script>
<?php