/**
* MLJLib
* MeshLabJS Library
*
* Copyright(C) 2015
* Paolo Cignoni
* Visual Computing Lab
* ISTI - CNR
*
* All rights reserved.
*
* This program is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License as published by the Free Software
* Foundation; either version 2 of the License, or (at your option) any later
* version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
* FOR A PARTICULAR PURPOSE. See theGNU General Public License
* (http://www.gnu.org/licenses/gpl.txt) for more details.
*
*/
/**
* @file Defines and installs the SceneBar widget
* @author Stefano Gabriele
*/
(function (component) {
/**
* @class Create a new SceneBar widget
* @augments MLJ.gui.Widget
* @private
* @memberOf MLJ.gui.widget
* @author Stefano Gabriele
*/
var _SceneBar = function () {
var _toolBar = new component.ToolBar();
var _dialog = new component.Dialog({
title:"Save mesh", modal:true, draggable: false, resizable:false
});
var _html = "<div id='mlj-save-dialog'><label for='filename'>Name:</label><br/>";
_html += "<input id='filename' type='text'/>";
_html += "<label for='extension'>Extension:</label><br/>";
_html += "<select id='extension'>";
var ext;
for(var key in MLJ.core.File.SupportedExtensions) {
ext = MLJ.core.File.SupportedExtensions[key];
_html +="<option name='"+ext+"'>"+ext+"</option>";
}
_html += "</select>";
_html += "Compress? <input name='zip' id='zipCheck' type='checkbox' value='1'>"
_html += "<div id='button-wrapper'><button id='mlj-save-dialog-button'>Save</button></div></div>";
_dialog.appendContent(_html);
var _dialogUpload = new component.Dialog({
title:"Upload mesh", modal:true, draggable: false, resizable:false
});
var _html = "<div id='mlj-upload-dialog'>";
_html += "<br/><label for='website'>Website:</label> ";
_html += "<select id='website' style='width: 150px; margin-left: 10px;'>";
var ext;
for(var key in MLJ.core.File.SupportedWebsites) {
ext = MLJ.core.File.SupportedWebsites[key];
_html +="<option name='"+ext+"'>"+ext+"</option>";
}
_html += "</select>";
_html += "<div id='button-wrapper'><button id='mlj-upload-dialog-button'>Upload</button></div></div>";
_dialogUpload.appendContent(_html);
function init() {
var open = new component.FileButton({
tooltip: "Open mesh file",
icon: "img/icons/IcoMoon-Free-master/PNG/48px/0049-folder-open.png",
multiple: true
});
var save = new component.Button({
tooltip: "Save mesh file",
icon: "img/icons/IcoMoon-Free-master/PNG/48px/0099-floppy-disk.png"
});
MLJ.gui.disabledOnSceneEmpty(save);
var reload = new component.Button({
tooltip: "Reload mesh file",
icon: "img/icons/IcoMoon-Free-master/PNG/48px/0133-spinner11.png"
});
MLJ.gui.disabledOnSceneEmpty(reload);
//The reload button must be disalbed if the layer is created by a
//creation filter
MLJ.gui.disabledOnCreationFilterMesh(reload);
var snapshot = new component.Button({
tooltip: "Take snapshot",
icon: "img/icons/IcoMoon-Free-master/PNG/48px/0016-camera.png"
});
MLJ.gui.disabledOnSceneEmpty(snapshot);
var deleteLayer = new component.Button({
tooltip: "Delete current layer",
icon: "img/icons/IcoMoon-Free-master/PNG/48px/0173-bin.png"
});
var resetTrackball = new component.Button({
tooltip: "Reset trackball",
icon: "img/icons/home.png"
});
var uploadToWebsite = new component.Button({
tooltip: "Upload to website",
icon: "img/icons/IcoMoon-Free-master/PNG/48px/0199-upload2.png"
// icon: "img/icons/upload-arrow.png"
});
var doc = new component.Button({
tooltip: "Go to the documentation page",
icon: "img/icons/question.png",
right:true
});
var git = new component.Button({
tooltip: "Go to the Github page",
icon: "img/icons/github.png",
right:true
});
MLJ.gui.disabledOnSceneEmpty(deleteLayer);
MLJ.gui.disabledOnSceneEmpty(resetTrackball);
MLJ.gui.disabledOnSceneEmpty(uploadToWebsite);
_toolBar.add(open, save, uploadToWebsite, reload, resetTrackball, snapshot, deleteLayer);
_toolBar.add(doc,git);
// SCENE BAR EVENT HANDLERS
open.onChange(function (input) {
MLJ.core.File.openMeshFile(input.files);
});
doc.onClick(function () {
var win = window.open("./doc/html/", '_blank');
win.focus();
});
git.onClick(function () {
var win = window.open("https://github.com/cnr-isti-vclab/meshlabjs", '_blank');
win.focus();
});
save.onClick(function () {
var layer = MLJ.core.Scene.getSelectedLayer();
//Name = meshInfo[0], extension = meshInfo[meshInfo.length-1]
var meshInfo = layer.name.split(".");
_dialog.show();
$('#mlj-save-dialog > #filename').val(meshInfo[0]);
$('#mlj-save-dialog > #extension option[name=".'+meshInfo[meshInfo.length-1]+'"]')
.attr('selected','selected');
$('#mlj-save-dialog-button').click(function() {
var name = $('#mlj-save-dialog > #filename').val();
var extension = $('#mlj-save-dialog > #extension').val();
if($('#mlj-save-dialog > #zipCheck').is(':checked')){
// console.log("COMPRESS");
MLJ.core.File.saveMeshFileZip(layer, name+extension, name+".zip");
}
else{
// console.log("DO NOT COMPRESS");
MLJ.core.File.saveMeshFile(layer, name+extension);
}
_dialog.destroy();
$(this).off();
});
});
reload.onClick(function () {
var mf = MLJ.core.Scene.getSelectedLayer();
MLJ.core.File.reloadMeshFile(mf);
});
snapshot.onClick(function () {
MLJ.core.Scene.takeSnapshot();
});
deleteLayer.onClick(function() {
MLJ.core.plugin.Manager.executeLayerFilter("Layer Delete", MLJ.core.Scene.getSelectedLayer())
})
resetTrackball.onClick(function() {
MLJ.core.Scene.resetTrackball();
})
uploadToWebsite.onClick(function() {
//TODO
var layer = MLJ.core.Scene.getSelectedLayer();
//Name = meshInfo[0], extension = meshInfo[meshInfo.length-1]
var meshInfo = layer.name.split(".");
_dialogUpload.show();
$('#mlj-upload-dialog-button').click(function() {
var website = $('#mlj-upload-dialog > #website').val();
if(website === MLJ.core.File.SupportedWebsites["SKF"]){
var sketchFabDialog = new component.Dialog({
title:"Upload to Sketchfab", modal:true, draggable: false, resizable:false
});
// sketchFabDialog.appendContent("<div id=prova> YOLO </div>");
var _html = "<div id='sketchfabUpload'>";
_html += "Extension: <select id='extension'>";
var ext;
for(var key in MLJ.core.File.SupportedSketchfabExtensions) {
ext = MLJ.core.File.SupportedSketchfabExtensions[key];
_html +="<option name='"+ext+"'>"+ext+"</option>";
}
_html += "</select>";
_html += " Compress? <input name='zip' id='zipCheck' type='checkbox' value='1'>"
_html += "<form id='the-form' action='https://api.sketchfab.com/v2/models' enctype='multipart/form-data'>";
// _html += "Upload your model file: <br> <input name='modelFile' type='file'> <br><br>";
_html += "<br> API Token: <input name='token' id='token' type='text'>";
_html += "<br><br> Model name: <p id='nameCounter'> 48 </p> <input name='name' id='name' type='text' maxlength='48'>";
_html += "<br><br> Model description: <p id='descriptionCounter'> 810 </p> <textarea name='description' id='description' rows='3' maxlength='810'></textarea>";
_html += "<br><br> Tags (space separated): <input name='tags' type='text'>";
_html += "<br><br> Private? (Pro only) <input name='private' id='private' type='checkbox' value='1'>";
_html += "<br><br> Password (Pro only): <p id='passwordCounter'> 64 </p> <input name='password' id='password' type='password' maxlength='64'>";
_html += "<br><br> <p> Max file size: Free 50 MB; Pro 200 MB; Business 500 MB</p>";
_html += "<input name='Submit' id='uploadButton' type='submit' value='Upload'></form>";
sketchFabDialog.appendContent(_html);
sketchFabDialog.show();
$('#sketchfabUpload #name').val(meshInfo[0]);
$('#sketchfabUpload #extension option[name=".'+meshInfo[meshInfo.length-1]+'"]').attr('selected','selected');
$("#private").prop('checked', false);
$("#password").prop('disabled', false);
$("#private").change(function() {
if(this.checked) {
$("#password").prop('disabled', false);
}
else {
$("#password").prop('disabled', true);
}
});
var characterCounter = function() {
var text_remaining = $(this).attr('maxLength') - $(this).val().length;
var counterId = $(this).attr('id') +"Counter";
if(text_remaining <= 10){
$('#'+counterId).addClass("overflow");
$('#'+counterId).text(text_remaining);
}
else{
$('#'+counterId).text(text_remaining);
$('#'+counterId).removeClass("overflow");
}
};
$('#name').keyup(characterCounter);
$('#nameCounter').text($('#name').attr('maxLength') - $('#name').val().length);
$('#description').keyup(characterCounter);
$('#password').keyup(characterCounter);
$('#uploadButton').prop('disabled', true);
$('#token').keyup(function() {
if($(this).val().length <= 0){
$('#uploadButton').prop('disabled', true);
}
else{
$('#uploadButton').prop('disabled', false);
}
});
$('#the-form').submit(function(event) {
event.preventDefault();
var extension = $('#sketchfabUpload > #extension').val();
var zipBool = $('#sketchfabUpload > #zipCheck').is(':checked');
var statusUpdateDialog = new component.Dialog({ title:"Upload to Sketchfab", modal:true, draggable: false, resizable:false });
_html = "<p style='display:inline'>Status:</p> <p id='status' style='display:inline'> </p>";
_html += "<div id='sketchfabProgressBar'> <div id='progressBar'> <div id='pBarLabel'>0%</div> </div> </div>"
_html += "<button id='exitUpdateButton' type='button'> Cancel </button>";
statusUpdateDialog.appendContent(_html);
statusUpdateDialog.show();
MLJ.core.File.uploadToSketchfab(layer, extension, zipBool, statusUpdateDialog);
sketchFabDialog.destroy();
});
}
_dialogUpload.destroy();
$(this).off();
});
})
}
/**
* @author Stefano Gabriele
*/
this._make = function () {
_toolBar.$.attr("id", "mlj-scenebar-widget");
return _toolBar.$;
};
init();
MLJ.gui.Widget.call(this);
};
MLJ.extend(MLJ.gui.Widget, _SceneBar);
//Install widget
MLJ.gui.installWidget("SceneBar", new _SceneBar());
})(MLJ.gui.component);