Initial release

resources/web/model/css/dark.css

@@ -0,0 +1,68 @@
+body
+{
+	background-color:#242428;
+	color: #B3B3B5;
+}
+
+a
+{
+	color: #009688;
+}
+
+.ZScrol::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
+    background-color: #939594;
+}
+
+.ZScrol::-webkit-scrollbar-track {/*滚动条里面轨道*/
+        background: #161817;
+}
+
+#EmptyArea img
+{
+	content:url(../img/null2.png);
+}
+
+.Text_Title
+{
+	color: #EFEFF0;
+}
+
+.Text_Value
+{
+	color: #B3B3B5;
+}
+
+.Text_TitleBoard
+{
+	border-bottom: 1px solid #54545A;
+}
+
+.LeftProcessBar
+{
+	border-left: 2px solid #4C4C55;
+}
+
+.ProcessBarSelected
+{
+	border-left-color:#009688;
+}
+
+.Block_BKGA
+{
+	background-color:#36363C;
+}
+
+.InfoBlock
+{
+	background-color:#36363C;
+}
+
+.File_Board
+{
+	background-color:#242428;
+}
+
+.FileItem
+{
+	background-color:#36363C;
+}

resources/web/model/img/edit.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M17.5,8.5v8c0,.55-.45,1-1,1H2.5c-.55,0-1-.45-1-1V2.5c0-.55.45-1,1-1h8M4.5,12.5v2h2L17.09,3.91c.55-.55.55-1.45,0-2s-1.45-.55-2,0L4.5,12.5Z" style="fill:none; stroke:#949494; stroke-linecap:square; stroke-linejoin:round;"/></svg>

resources/web/model/img/file_g.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M12.5,17.5H2.5c-.55,0-1-.45-1-1V2.5c0-.55.45-1,1-1h7l4,4v11c0,.55-.45,1-1,1Z" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/><path d="M13.5,5.5h-3c-.55,0-1-.45-1-1V1.5" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/><polyline points="12.5 1.5 15.5 4.5 15.5 17.5" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/><polyline points="14.5 1.5 17.5 4.5 17.5 17.5" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/></svg>

resources/web/model/img/file_h.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M12.5,17.5H2.5c-.55,0-1-.45-1-1V2.5c0-.55.45-1,1-1h7l4,4v11c0,.55-.45,1-1,1Z" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><path d="M13.5,5.5h-3c-.55,0-1-.45-1-1V1.5" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><polyline points="12.5 1.5 15.5 4.5 15.5 17.5" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><polyline points="14.5 1.5 17.5 4.5 17.5 17.5" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/></svg>

resources/web/model/img/info_g.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><rect x="1.5" y="1.5" width="16" height="16" rx="1" ry="1" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/><path d="M7.5,3.5h8M7.5,5.5h4M7.5,8.5h8M7.5,10.5h4M7.5,15.5h4M7.5,13.5h8" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/><path d="M4.5,5.5h0c-.55,0-1-.45-1-1h0c0-.55.45-1,1-1h0c.55,0,1,.45,1,1h0c0,.55-.45,1-1,1ZM5.5,9.5h0c0-.55-.45-1-1-1h0c-.55,0-1,.45-1,1h0c0,.55.45,1,1,1h0c.55,0,1-.45,1-1ZM5.5,14.5h0c0-.55-.45-1-1-1h0c-.55,0-1,.45-1,1h0c0,.55.45,1,1,1h0c.55,0,1-.45,1-1Z" style="fill:none; stroke:#009688; stroke-linecap:round; stroke-linejoin:round;"/></svg>

resources/web/model/img/info_h.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><rect x="1.5" y="1.5" width="16" height="16" rx="1" ry="1" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><path d="M7.5,3.5h8M7.5,5.5h4M7.5,8.5h8M7.5,10.5h4M7.5,15.5h4M7.5,13.5h8" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><path d="M4.5,5.5h0c-.55,0-1-.45-1-1h0c0-.55.45-1,1-1h0c.55,0,1,.45,1,1h0c0,.55-.45,1-1,1ZM5.5,9.5h0c0-.55-.45-1-1-1h0c-.55,0-1,.45-1,1h0c0,.55.45,1,1,1h0c.55,0,1-.45,1-1ZM5.5,14.5h0c0-.55-.45-1-1-1h0c-.55,0-1,.45-1,1h0c0,.55.45,1,1,1h0c.55,0,1-.45,1-1Z" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/></svg>

resources/web/model/img/profile_g.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="9.5" cy="5.5" r="4" style="fill:none; stroke:#009688; stroke-linecap:square; stroke-linejoin:round;"/><path d="M17.5,17.5c0-4.42-3.58-8-8-8S1.5,13.08,1.5,17.5h16Z" style="fill:none; stroke:#009688; stroke-linecap:square; stroke-linejoin:round;"/></svg>

resources/web/model/img/profile_h.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="9.5" cy="5.5" r="4" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><path d="M17.5,17.5c0-4.42-3.58-8-8-8S1.5,13.08,1.5,17.5h16Z" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/></svg>

resources/web/model/img/s.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M17.5,12.5v4c0,.55-.45,1-1,1H2.5c-.55,0-1-.45-1-1V2.5c0-.55.45-1,1-1h4" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><line x1="7.5" y1="11.5" x2="16.5" y2="2.5" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/><path d="M11.5,1.5h5c.55,0,1,.45,1,1v5" style="fill:none; stroke:#949494; stroke-linecap:round; stroke-linejoin:round;"/></svg>

resources/web/model/model.css

@@ -0,0 +1,383 @@
+*
+{
+	margin:0px;
+	padding: 0px;
+	border: 0px;
+	font-family: "system-ui", "Segoe UI", Roboto, Oxygen, Ubuntu, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-sans;
+	user-select: none;
+}
+
+html
+{
+	height: 100%;
+}
+
+body
+{
+	/* min-width: 1280px; ORCA fixes scrollbar appear on welcome screen */
+	height: 100%;
+	display:flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	background-color: #F4F4F4;	
+	font-size: 14px;	
+	color: #595959;	
+	line-height: 24px;
+}
+
+#EmptyArea
+{
+	/* min-width: 1280px; ORCA fixes scrollbar appear on welcome screen */
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	display: flex;
+}
+
+
+#WholeArea
+{
+	min-width: 1280px; /* ORCA fix scrollbar appears on welcome screen */
+	height:  100%;
+	position: relative;
+	overflow-y: hidden;
+	display: none;
+}
+
+.ZScrol::-webkit-scrollbar {/*滚动条整体样式*/
+    width: 8px;     /*高宽分别对应横竖滚动条的尺寸*/
+    height: 8px;
+	padding: 2px;
+}
+
+.ZScrol::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
+    border-radius: 6px;
+    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+	box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+    background-color: #AAAAAA;
+}
+
+.ZScrol::-webkit-scrollbar-track {/*滚动条里面轨道*/
+        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+	    box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+        border-radius: 10px;
+        background: #EDEDED;
+}
+
+
+.TopBottomBar
+{
+	height: 24px;
+}
+
+.FloorBottomBar
+{
+	height: 100px;
+}
+
+
+/*----Basic----*/
+.Text_Title
+{
+	font-size: 16px;
+	font-weight: 700;
+	color: black;	
+}
+
+.Text_Value
+{
+	color: black;
+}
+
+.Text_Bold
+{
+	font-weight: 700;
+}
+
+.Text_TitleBoard
+{
+	border-bottom: 1px solid #DDDDDD;
+	padding: 16px  0px;
+}
+
+.Text_TitleArea div
+{
+	height: 32px;
+	line-height: 32px;
+}
+
+#Model_Name_Line
+{
+	width: 800px;
+}
+
+#ModelNameBar
+{
+	width: 100%;
+	display: flex;
+	overflow:hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
+#ModelName
+{
+	overflow:hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;	
+}
+
+
+.Block_BKGA
+{
+	background-color: white;
+}
+
+.Block_BKGB
+{
+	background-color: #F4F4F4;
+}
+
+/*---Swiper---*/
+.swiper
+{
+    --swiper-theme-color: #ff6600;/* 设置Swiper风格 */
+    --swiper-navigation-color: #009688;/* 单独设置按钮颜色 */
+    --swiper-navigation-size: 30px;/* 设置按钮大小 */
+}
+
+/*---Left---*/
+#LeftProcessBlock
+{
+	position:fixed;
+	top: 24px;
+	width: 264px;
+	height: 160px;
+    flex-shrink: 0;
+}
+
+.LeftProcessBar
+{
+	border-left: 2px solid #DDDDDD;
+	height: 40px;
+	display: flex;
+	align-items: center;
+	cursor: pointer;
+}
+
+.LeftProcessBar img
+{
+	margin-left:18px;
+}
+
+.LeftProcessBar span
+{
+	margin-left: 20px;
+}
+
+.LeftTipIcon
+{
+	width: 20px;
+	height: 20px;
+}
+
+.ProcessBarSelected
+{
+	border-left-color:#009688;
+}
+
+.ProcessBarSelected span
+{
+	color:#009688;
+}
+
+#Info_ProcessBar.ProcessBarSelected img
+{
+	content:url("img/info_g.svg");
+}
+
+#File_ProcessBar.ProcessBarSelected img
+{
+	content:url("img/file_g.svg");
+}
+
+#Profile_ProcessBar.ProcessBarSelected img
+{
+	content:url("img/profile_g.svg");
+}
+
+
+
+/*---Right---*/
+
+/*--Basic Info--*/
+#Info_Inside_Board
+{
+	display: flex;
+	height: calc(100% - 24px);
+	overflow-y:auto;
+}
+
+.InfoBlock
+{
+	background-color: white;
+	padding: 20px 40px;
+}
+
+.InfoBlock:nth-child(n+2)
+{
+	margin-top: 8px;
+}
+
+#ModelInfoBlock
+{
+	width: 1000px;
+}
+
+#Model_Name_Area {
+	display: flex;
+	justify-content: space-between;
+	align-items: flex-end;
+}
+
+#Model_Preview_Image
+{
+	height: 480px;
+}
+
+.swiper
+{
+	margin: 24px 0px;
+}
+
+.swiper-slide
+{
+	cursor:pointer;
+	display: flex;
+	align-content: center;
+	justify-content: center;
+}
+
+.swiper-slide img
+{
+    max-width:100%;
+    max-height:100%;
+}
+
+/*---Document---*/
+#LeftEmptyBlock
+{
+
+}
+
+#Model_Desc img
+{
+	max-width:100%;
+}
+
+#Model_Accessories
+{
+}
+
+.File_Board
+{
+	background-color: #F4F4F4;
+	padding: 12px 15px;	
+}
+
+.File_Board:nth-child(n+2)
+{
+	margin-top: 16px;
+}
+
+.FileListBoard
+{
+	display: flex;
+	flex-wrap: wrap;
+}
+
+.FileItem
+{
+	width:406px;
+	background-color: white;
+	display: flex;
+	align-items: center;
+	padding: 12px 15px;
+	margin: 4px 0px;
+}
+
+.FileItem:nth-child(2n+1)
+{
+	margin-right: 16px;
+}
+
+
+.FileIcon img
+{
+	width: 36px;
+	height: 42px;
+}
+
+.ImageIcon img
+{
+	width: 36px;
+	height: 42px;
+	object-fit: cover;
+}
+
+.FileText
+{
+	width: 306px;
+	height: 40px;
+	line-height: 20px;
+	padding: 0px 16px;
+	display: flex;
+	align-items: center;
+}
+
+.FileSize
+{
+	display:none;
+}
+
+.FileName
+{
+	width: 100%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.FileMenu
+{
+	height: 32px;
+	width: 32px;
+	display: flex;
+	cursor: pointer;
+	align-items: center;
+	justify-content: center;
+}
+
+.FileMenu img
+{
+	width: 24px;
+}
+
+
+/*---Profile---*/
+#Profile_Preview_Image
+{
+	height: 480px;
+}
+
+.viewer-button
+{
+	background-color: rgba(255,0,0,.5)!important;
+}
+
+#AddModelInfoBtn
+{
+	margin-top: 20px;
+}

resources/web/model/model.js

@@ -0,0 +1,602 @@
+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);
+	
+	if( pModel.hasOwnProperty('model_id') )
+	{
+		let m_id=pModel['model_id']+'';
+		UpdateModelID( m_id.trim() );
+	}
+	
+	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();
+}
+
+function OnClickEditProjectInfo()
+{
+	var tSend={};
+	tSend['sequence_id']=Math.round(new Date() / 1000);
+	tSend['command']="edit_project_info";
+		
+	SendWXMessage( JSON.stringify(tSend) );		
+}
+
+
+
+
+
+