589 lines
14 KiB
JavaScript
589 lines
14 KiB
JavaScript
var ModelSwiper=null;
|
|
var ProfileSwiper=null;
|
|
|
|
function OnInit()
|
|
{
|
|
console.log(" 页面加载完成 ");
|
|
//翻译页面
|
|
TranslatePage();
|
|
|
|
//获取数据
|
|
RequestProjectInfo();
|
|
|
|
//图片滚动器的初始化
|
|
// mySwiper = new Swiper('.swiper', {
|
|
// loop:true,
|
|
// slidesPerView : 4,
|
|
// slidesPerGroup : 1,
|
|
// spaceBetween: 8,
|
|
// navigation: {
|
|
// slidesPerGroup :4,
|
|
// nextEl: '.swiper-button-next',
|
|
// prevEl: '.swiper-button-prev',
|
|
// },
|
|
// autoplay: {
|
|
// delay: 3000,
|
|
// stopOnLastSlide: false,
|
|
// disableOnInteraction: true,
|
|
// disableOnInteraction: false
|
|
// }
|
|
// });
|
|
|
|
//锚点跟踪
|
|
AddScrollEvent();
|
|
|
|
//测试代码
|
|
//ShowProjectInfo(null);
|
|
//ShowProjectInfo(TestProjectData);
|
|
//ShowProjectInfo(null);
|
|
//ShowProjectInfo(TestProjectData);
|
|
// $('#ModelPreviewList').viewer({
|
|
// title: false,
|
|
// fullsreen: false,
|
|
// zIndex: 999999,
|
|
// interval: 3000
|
|
// });
|
|
// $('#ModelPreviewList').viewer('update');
|
|
}
|
|
|
|
function AddScrollEvent()
|
|
{
|
|
//跟踪页面位置
|
|
$('#Info_Inside_Board').scroll(function(){
|
|
//checkElementDistance("Info_Inside_Board", 'Model_Basic')
|
|
//checkElementDistance("Info_Inside_Board", 'Model_Accessories');
|
|
//checkElementDistance("Info_Inside_Board", 'Model_Profile');
|
|
let ParentItem=$('#Info_Inside_Board');
|
|
|
|
let BItem=$('#Model_Basic');
|
|
let AItem=$('#Model_Accessories');
|
|
let PItem=$('#Model_Profile');
|
|
|
|
let BTop=Math.abs(BItem.offset().top - ParentItem.offset().top);
|
|
let BBottom=Math.abs(BItem.offset().top + BItem.innerHeight() - ParentItem.offset().top);
|
|
let ATop=Math.abs(AItem.offset().top - ParentItem.offset().top);
|
|
let ABottom=Math.abs(AItem.offset().top + AItem.innerHeight() - ParentItem.offset().top);
|
|
let PTop=Math.abs(PItem.offset().top - ParentItem.offset().top);
|
|
let PBottom=Math.abs(PItem.offset().top + PItem.innerHeight() - ParentItem.offset().top);
|
|
|
|
console.log('------positon-----');
|
|
console.log("B: "+BTop+'-'+BBottom);
|
|
console.log("A: "+ATop+'-'+ABottom);
|
|
console.log("P: "+PTop+'-'+PBottom);
|
|
|
|
let nMin=Math.min(BTop,BBottom,ATop,ABottom,PTop,PBottom );
|
|
|
|
if( nMin==BTop || nMin==BBottom)
|
|
{
|
|
OnMenuSelected('Model_Basic');
|
|
}
|
|
else if( nMin==ATop || nMin==ABottom)
|
|
{
|
|
OnMenuSelected('Model_Accessories');
|
|
}
|
|
else if( nMin==PTop || nMin==PBottom)
|
|
{
|
|
OnMenuSelected('Model_Profile');
|
|
}
|
|
|
|
});
|
|
}
|
|
|
|
function OnMenuClick( strID )
|
|
{
|
|
scrollLocation("Info_Inside_Board",strID);
|
|
|
|
//OnMenuSelected(strID);
|
|
}
|
|
|
|
function OnMenuSelected(strID)
|
|
{
|
|
console.log("MenuSelected: "+strID);
|
|
|
|
//UI
|
|
$('.LeftProcessBar').removeClass('ProcessBarSelected');
|
|
switch(strID)
|
|
{
|
|
case 'Model_Basic':
|
|
$('#Info_ProcessBar').addClass('ProcessBarSelected');
|
|
break;
|
|
case 'Model_Accessories':
|
|
$('#File_ProcessBar').addClass('ProcessBarSelected');
|
|
break;
|
|
case 'Model_Profile':
|
|
$('#Profile_ProcessBar').addClass('ProcessBarSelected');
|
|
break;
|
|
}
|
|
}
|
|
|
|
|
|
/*-------------自动滚动跟踪效果---------*/
|
|
function scrollLocation(FatherID, ChildID)
|
|
{
|
|
let FItem=$('#'+FatherID);
|
|
let CItem=$('#'+ChildID);
|
|
|
|
let Tmp=CItem.offset().top - FItem.offset().top + FItem.scrollTop();
|
|
|
|
// father.scrollTop(
|
|
// scrollTo.offset().top - father.offset().top + father.scrollTop()
|
|
// );
|
|
// Or you can animate the scrolling:
|
|
FItem.animate({scrollTop:Tmp}, 400);
|
|
};
|
|
|
|
/*----------处理C++的消息-------*/
|
|
function Request3MFInfo()
|
|
{
|
|
var tSend={};
|
|
tSend['sequence_id']=Math.round(new Date() / 1000);
|
|
tSend['command']="request_3mf_info";
|
|
|
|
SendWXMessage( JSON.stringify(tSend) );
|
|
}
|
|
|
|
function HandleStudio(pVal)
|
|
{
|
|
let strCmd=pVal['command'];
|
|
|
|
if(strCmd=='show_3mf_info')
|
|
{
|
|
ShowProjectInfo( pVal['model'] );
|
|
}
|
|
else if(strCmd=='clear_3mf_info')
|
|
{
|
|
ShowProjectInfo( null );
|
|
}
|
|
}
|
|
|
|
function ShowProjectInfo( p3MF )
|
|
{
|
|
if(p3MF==null)
|
|
{
|
|
$('#EmptyArea').css('display','flex');
|
|
$('#WholeArea').hide();
|
|
return;
|
|
}
|
|
|
|
//Check Data
|
|
let pModel=p3MF['model'];
|
|
let pFile=p3MF['file'];
|
|
let pProfile=p3MF['profile'];
|
|
|
|
ShowModelInfo( pModel );
|
|
ShowFileInfo( pFile );
|
|
ShowProfilelInfo(pProfile);
|
|
|
|
TranslatePage();
|
|
$('#EmptyArea').hide();
|
|
$('#WholeArea').show();
|
|
|
|
// mySwiper = new Swiper('.swiper', {
|
|
// loop:true,
|
|
// spaceBetween: 8,
|
|
// navigation: {
|
|
// slidesPerGroup :4,
|
|
// nextEl: '.swiper-button-next',
|
|
// prevEl: '.swiper-button-prev',
|
|
// },
|
|
// autoplay: {
|
|
// delay: 3000,
|
|
// stopOnLastSlide: false,
|
|
// disableOnInteraction: true,
|
|
// disableOnInteraction: false
|
|
// }
|
|
// });
|
|
|
|
AddScrollEvent();
|
|
}
|
|
|
|
function ShowModelInfo( pModel )
|
|
{
|
|
//==========Model Info==========
|
|
let sModelName=decodeURIComponent(pModel.name);
|
|
let sModelAuthor=decodeURIComponent(pModel.author);
|
|
let UploadType=pModel.upload_type.toLowerCase();
|
|
let sLicence=pModel.license.toUpperCase();
|
|
let sModelDesc=decodeURIComponent(pModel.description);
|
|
|
|
SendWXDebugInfo("Model Name: "+sModelName);
|
|
|
|
$('#ModelName').html(sModelName);
|
|
$('#ModelName').attr('title',sModelName);
|
|
$('#ModelAuthorName').html(sModelAuthor);
|
|
|
|
switch(UploadType)
|
|
{
|
|
case 'remix':
|
|
$('#ModelAuthorType').attr('tid','t93');
|
|
break;
|
|
case 'shared':
|
|
$('#ModelAuthorType').attr('tid','t94');
|
|
break;
|
|
case 'origin':
|
|
case 'profile':
|
|
default:
|
|
$('#ModelAuthorType').attr('tid','t92');
|
|
break;
|
|
}
|
|
|
|
switch(sLicence)
|
|
{
|
|
case 'CC0':
|
|
$('#ModelLicenceImg img').attr('src','img/cc-zero.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
case 'BY':
|
|
$('#ModelLicenceImg img').attr('src','img/by.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
case 'BY-SA':
|
|
$('#ModelLicenceImg img').attr('src','img/by-sa.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
case 'BY-ND':
|
|
$('#ModelLicenceImg img').attr('src','img/by-nd.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
case 'BY-NC':
|
|
$('#ModelLicenceImg img').attr('src','img/by-nc.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
case 'BY-NC-SA':
|
|
$('#ModelLicenceImg img').attr('src','img/by-nc-sa.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
case 'BY-NC-ND':
|
|
$('#ModelLicenceImg img').attr('src','img/by-nc-nd.png');
|
|
$('#ModelLicenceImg').show();
|
|
break;
|
|
default:
|
|
$('#ModelLicenceImg').hide();
|
|
break;
|
|
}
|
|
|
|
$('#Model_Desc').html( html_decode(sModelDesc) );
|
|
|
|
let ModelPreviewList=pModel.preview_img;
|
|
let TotalPreview=ModelPreviewList.length;
|
|
|
|
if( ModelSwiper!=null )
|
|
{
|
|
ModelSwiper.destroy(true,true);
|
|
ModelSwiper=null;
|
|
}
|
|
|
|
if(TotalPreview>0)
|
|
{
|
|
let htmlPreview='';
|
|
for(let pn=0;pn<TotalPreview;pn++)
|
|
{
|
|
//let FTmpPath=decodeURIComponent(ModelPreviewList[pn]);
|
|
let FTmpPath=ModelPreviewList[pn]['filepath'];
|
|
|
|
htmlPreview+='<div class="swiper-slide"><img class="Model_PrevImg" src="'+FTmpPath+'" /></div>';
|
|
}
|
|
|
|
$('#ModelPreviewList').html(htmlPreview);
|
|
$('#Model_Preview_Image').viewer({
|
|
title: false,
|
|
fullsreen: false,
|
|
zIndex: 11,
|
|
interval: 3000
|
|
});
|
|
$('#Model_Preview_Image').viewer('update');
|
|
|
|
//Initial Swiper
|
|
if(TotalPreview==1)
|
|
{
|
|
ModelSwiper = new Swiper('#Model_Preview_Image.swiper', {
|
|
spaceBetween: 8
|
|
});
|
|
|
|
$('#Model_Preview_Image .swiper-button-prev').hide();
|
|
$('#Model_Preview_Image .swiper-button-next').hide();
|
|
$('#Model_Preview_Image .swiper-pagination').hide();
|
|
}
|
|
else
|
|
{
|
|
$('#Model_Preview_Image .swiper-button-prev').show();
|
|
$('#Model_Preview_Image .swiper-button-next').show();
|
|
$('#Model_Preview_Image .swiper-pagination').show();
|
|
|
|
ModelSwiper = new Swiper('#Model_Preview_Image.swiper', {
|
|
loop:false,
|
|
spaceBetween: 8,
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
autoplay: {
|
|
delay: 3000,
|
|
stopOnLastSlide: false,
|
|
disableOnInteraction: false
|
|
},
|
|
pagination: {
|
|
el: '.swiper-pagination',
|
|
}
|
|
});
|
|
}
|
|
|
|
$('#Model_Preview_Image').show();
|
|
}
|
|
else
|
|
{
|
|
$('#Model_Preview_Image').hide();
|
|
}
|
|
}
|
|
|
|
function ShowFileInfo( pFile )
|
|
{
|
|
let pBOM=pFile['BOM'];
|
|
let pAssembly=pFile['Assembly'];
|
|
let pOther=pFile['Other'];
|
|
|
|
let BTotal=pBOM.length;
|
|
let ATotal=pAssembly.length;
|
|
let OTotal=pOther.length;
|
|
let fTotal=BTotal+ATotal+OTotal;
|
|
|
|
//Total Number
|
|
$('#FileTotalNum').html(fTotal);
|
|
$('#BOMTotalNum').html(BTotal);
|
|
$('#AssemblyTotalNum').html(ATotal);
|
|
$('#OtherFileTotalNum').html(OTotal);
|
|
|
|
//BOM
|
|
if(BTotal==0)
|
|
{
|
|
$('#FILE_BOM_List').hide();
|
|
}
|
|
else
|
|
{
|
|
ConstructFileHtml('FILE_BOM_List',pBOM);
|
|
}
|
|
|
|
//Assembly
|
|
if(ATotal==0)
|
|
{
|
|
$('#FILE_ASSEMBLY_List').hide();
|
|
}
|
|
else
|
|
{
|
|
ConstructFileHtml('FILE_ASSEMBLY_List',pAssembly);
|
|
}
|
|
|
|
//Other
|
|
if(OTotal==0)
|
|
{
|
|
$('#FILE_OTHER_List').hide();
|
|
}
|
|
else
|
|
{
|
|
ConstructFileHtml('FILE_OTHER_List',pOther);
|
|
}
|
|
|
|
//zIndex
|
|
$('.ImageIcon').viewer({
|
|
title: false,
|
|
fullsreen: false,
|
|
zIndex: 11,
|
|
interval: 3000
|
|
});
|
|
$('.ImageIcon').viewer('update');
|
|
}
|
|
|
|
|
|
var ExcelTail=['xlsx','xlsm','xlsb','csv','xls','xltx','xltm','xlt','xlam','xla'];
|
|
var PdfTail=['pdf','fdf','xfdf','xdp','ppdf','ofd'];
|
|
var ImgTail=['jpg','jpeg','bmp','gif','svg','png','bmp'];
|
|
|
|
var ImgID=0;
|
|
|
|
function ConstructFileHtml( ID, pItem )
|
|
{
|
|
let fTotal=pItem.length;
|
|
|
|
let strHtml='';
|
|
for( let f=0;f<fTotal;f++ )
|
|
{
|
|
let pOne=pItem[f];
|
|
|
|
let tPath=pOne['filepath'];
|
|
let tName=decodeURIComponent(pOne['filename']);
|
|
|
|
let sTail=getFileTail(tName).toLowerCase();
|
|
|
|
//File or Image
|
|
let strClass='FileIcon';
|
|
let ImgPath='';
|
|
|
|
if( $.inArray( sTail, ImgTail )>=0 )
|
|
{
|
|
strClass='ImageIcon';
|
|
|
|
ImgPath=tPath;
|
|
}
|
|
else if( $.inArray( sTail, ExcelTail )>=0 )
|
|
{
|
|
ImgPath='img/excel.png';
|
|
}
|
|
else if( $.inArray( sTail, PdfTail )>=0 )
|
|
{
|
|
ImgPath='img/pdf.png';
|
|
}
|
|
else
|
|
{
|
|
ImgPath='img/default.png';
|
|
}
|
|
|
|
//Add html
|
|
if( strClass!='ImageIcon' )
|
|
{
|
|
strHtml+='<div class="FileItem">'+
|
|
' <div class="'+strClass+'"><img src="'+ImgPath+'" /></div>'+
|
|
' <div class="FileText">'+
|
|
' <div class="FileName">'+tName+'</div>'+
|
|
' </div>'+
|
|
' <div class="FileMenu" onClick="OnClickOpenFile(\''+tPath+'\')"><img src="img/s.svg" /></div>'+
|
|
'</div>';
|
|
}
|
|
else
|
|
{
|
|
ImgID++;
|
|
let TmpImgID="AF"+ImgID;
|
|
|
|
strHtml+='<div class="FileItem">'+
|
|
' <div class="'+strClass+'"><img id="'+TmpImgID+'" src="'+ImgPath+'" /></div>'+
|
|
' <div class="FileText">'+
|
|
' <div class="FileName">'+tName+'</div>'+
|
|
' </div>'+
|
|
' <div class="FileMenu" onClick="OnClickOpenImage(\''+TmpImgID+'\')"><img src="img/s.svg" /></div>'+
|
|
'</div>';
|
|
}
|
|
}
|
|
|
|
$('#'+ID+' .FileListBoard').html(strHtml);
|
|
|
|
if( fTotal>0 )
|
|
$('#'+ID).show();
|
|
}
|
|
|
|
|
|
function ShowProfilelInfo( pProfile )
|
|
{
|
|
//==========Profile Info==========
|
|
let sProfileName=decodeURIComponent(pProfile.name);
|
|
let sProfileAuthor=decodeURIComponent(pProfile.author);
|
|
let sProfileDesc=decodeURIComponent(pProfile.description);
|
|
|
|
$('#ProfileName').html(sProfileName);
|
|
$('#ProfileAuthor').html(sProfileAuthor);
|
|
|
|
$('#Profile_Desc').html( html_decode(sProfileDesc) );
|
|
|
|
let ProfilePreviewList=pProfile.preview_img;
|
|
let TotalPreview=ProfilePreviewList.length;
|
|
|
|
if( ProfileSwiper!=null )
|
|
{
|
|
ProfileSwiper.destroy(true,true);
|
|
ProfileSwiper=null;
|
|
}
|
|
|
|
if(TotalPreview>0)
|
|
{
|
|
let htmlPreview='';
|
|
for(let pn=0;pn<TotalPreview;pn++)
|
|
{
|
|
let FTmpPath=ProfilePreviewList[pn]['filepath'];
|
|
|
|
htmlPreview+='<div class="swiper-slide"><img class="Model_PrevImg" src="'+FTmpPath+'" /></div>';
|
|
}
|
|
|
|
$('#ProfilePreviewList').html(htmlPreview);
|
|
$('#Profile_Preview_Image').viewer({
|
|
title: false,
|
|
fullsreen: false,
|
|
zIndex: 11,
|
|
interval: 3000
|
|
});
|
|
$('#Profile_Preview_Image').viewer("update");
|
|
|
|
//Init Profile Swiper
|
|
if(TotalPreview==1)
|
|
{
|
|
ProfileSwiper = new Swiper('#Profile_Preview_Image.swiper', {
|
|
spaceBetween: 8
|
|
});
|
|
|
|
$('#Profile_Preview_Image .swiper-button-prev').hide();
|
|
$('#Profile_Preview_Image .swiper-button-next').hide();
|
|
$('#Profile_Preview_Image .swiper-pagination').hide();
|
|
}
|
|
else
|
|
{
|
|
$('#Profile_Preview_Image .swiper-button-prev').show();
|
|
$('#Profile_Preview_Image .swiper-button-next').show();
|
|
$('#Profile_Preview_Image .swiper-pagination').show();
|
|
|
|
ProfileSwiper = new Swiper('#Profile_Preview_Image.swiper', {
|
|
loop:false,
|
|
spaceBetween: 8,
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
autoplay: {
|
|
delay: 3000,
|
|
stopOnLastSlide: false,
|
|
disableOnInteraction: false
|
|
},
|
|
pagination: {
|
|
el: '.swiper-pagination',
|
|
}
|
|
});
|
|
}
|
|
|
|
$('#Profile_Preview_Image').show();
|
|
}
|
|
else
|
|
{
|
|
$('#Profile_Preview_Image').hide();
|
|
}
|
|
}
|
|
|
|
|
|
//Push Command to C++
|
|
function RequestProjectInfo()
|
|
{
|
|
var tSend={};
|
|
tSend['sequence_id']=Math.round(new Date() / 1000);
|
|
tSend['command']="request_3mf_info";
|
|
|
|
SendWXMessage( JSON.stringify(tSend) );
|
|
}
|
|
|
|
function OnClickOpenFile( strFullPath )
|
|
{
|
|
var tSend={};
|
|
tSend['sequence_id']=Math.round(new Date() / 1000);
|
|
tSend['command']="open_3mf_accessory";
|
|
tSend['accessory_path']=strFullPath;
|
|
|
|
SendWXMessage( JSON.stringify(tSend) );
|
|
SendWXDebugInfo('----open accessory: '+strFullPath);
|
|
}
|
|
|
|
function OnClickOpenImage( F_ID )
|
|
{
|
|
$("img#"+F_ID).click();
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|