mirror of
https://github.com/Doodle3D/doodle3d-client.git
synced 2024-11-24 01:57:56 +01:00
Merge branch 'master' into develop
This commit is contained in:
peteruithoven
commit
6835a7056c
3
Makefile
3
Makefile
@ -52,7 +52,9 @@ endif
|
||||
endef
|
||||
|
||||
define Package/doodle3d-client/install
|
||||
|
||||
$(INSTALL_DIR) $(1)/www
|
||||
$(INSTALL_DIR) $(1)/www/filemanager
|
||||
$(INSTALL_DIR) $(1)/www/css
|
||||
$(INSTALL_DIR) $(1)/www/img
|
||||
#$(INSTALL_DIR) $(1)/www/js
|
||||
@ -69,6 +71,7 @@ define Package/doodle3d-client/install
|
||||
$(CP) $(PKG_BUILD_DIR)/www/css/styles.min.css $(1)/www/css/
|
||||
|
||||
$(CP) $(PKG_BUILD_DIR)/www/img/* $(1)/www/img/
|
||||
$(CP) $(PKG_BUILD_DIR)/www/filemanager/* $(1)/www/filemanager/
|
||||
|
||||
ifeq ($(CONFIG_DOODLE3D_CLIENT_MINIFY_JS),y)
|
||||
$(CP) $(PKG_BUILD_DIR)/www/js/doodle3d-client.min.js $(1)/www/js/
|
||||
|
||||
@ -5,9 +5,10 @@ Doodle3D client app
|
||||
# How to build
|
||||
|
||||
## Prerequisites
|
||||
- get `npm`, the Node.js package manager, for instance using macports on OSX.
|
||||
- (prerequisite) install Grunt: `sudo pm install -g grunt-cli`.
|
||||
- run `npm install` in the project root to install project dependencies
|
||||
- install npm, the Node.js package manager: `sudo port install npm`
|
||||
- install Grunt: `sudo npm install -g grunt-cli`
|
||||
- run `npm install` in the **project root** to install project dependencies
|
||||
|
||||
Finally run grunt to build minified css and js files. By default, it will keep
|
||||
## Build
|
||||
- run `grunt` in the project root to to build minified css and js files. By default, it will keep
|
||||
running to automatically rebuild when source files are changed.
|
||||
|
||||
41
js/AddScanDialog.js
Normal file
41
js/AddScanDialog.js
Normal file
@ -0,0 +1,41 @@
|
||||
//var shapeResolution=3;
|
||||
var shapePopup;
|
||||
|
||||
function initScanDialog() {
|
||||
scanPopup = new Popup($("#popupScan"), $("#popupMask"));
|
||||
$("#btnScanOk").on("onButtonClick", onBtnScanOk);
|
||||
$("#btnCloseScan").on("onButtonClick", onBtnCloseScan);
|
||||
}
|
||||
|
||||
function onBtnCloseScan() {
|
||||
$('#imgGuide').hide();
|
||||
$('#btnCloseScan').hide();
|
||||
}
|
||||
|
||||
function onBtnScanOk() {
|
||||
scanPopup.commit();
|
||||
}
|
||||
|
||||
function showScanDialog() {
|
||||
scanPopup.open();
|
||||
}
|
||||
|
||||
function readURL(input) {
|
||||
|
||||
if (input.files && input.files[0]) {
|
||||
var reader = new FileReader();
|
||||
|
||||
reader.onload = function (e) {
|
||||
$('#imgGuide').attr('src', e.target.result);
|
||||
$('#imgGuide').show();
|
||||
$('#btnCloseScan').show();
|
||||
scanPopup.commit();
|
||||
}
|
||||
|
||||
reader.readAsDataURL(input.files[0]);
|
||||
}
|
||||
}
|
||||
|
||||
$("#fileScan").change(function(){
|
||||
readURL(this);
|
||||
});
|
||||
@ -49,8 +49,8 @@ function initKeyboard() {
|
||||
var ch = String.fromCharCode(event.which);
|
||||
|
||||
switch (ch) {
|
||||
case 'c': clearDoodle(); break;
|
||||
case 'n': clearDoodle(); break;
|
||||
case 'c': newSketch(); break;
|
||||
case 'n': newSketch(); break;
|
||||
case 'p': print(); break;
|
||||
case 'u': oopsUndo(); break;
|
||||
case 'g': settingsWindow.downloadGcode(); break;
|
||||
@ -59,13 +59,14 @@ function initKeyboard() {
|
||||
case 'h': previewUp(true); break;
|
||||
case 'H': previewDown(true); break;
|
||||
case 's': saveSketch(); break;
|
||||
case 'L': nextDoodle(); break;
|
||||
case 'l': prevDoodle(); break;
|
||||
case 'L': nextSketch(); break;
|
||||
case 'l': prevSketch(); break;
|
||||
case '[': previewTwistLeft(); break;
|
||||
case ']': previewTwistRight(); break;
|
||||
case '|': resetTwist(); break;
|
||||
case 't': showWordArtDialog(); break;
|
||||
case 'i': showShapeDialog(); break;
|
||||
case 'T': showScanDialog(); break;
|
||||
|
||||
case ';': moveShape(-5,0); break;
|
||||
case '\'': moveShape(5,0); break;
|
||||
|
||||
12
js/Svg.js
12
js/Svg.js
@ -56,6 +56,8 @@ function loadFromSvg(svgData) {
|
||||
|
||||
clearDoodle();
|
||||
|
||||
svgData = svgData.replace("M0,0 ",""); //RC: hack
|
||||
|
||||
var p = svgData.indexOf("<path");
|
||||
if (p == -1) { console.log("loadFromSvg: could not find parsing start point"); return false; }
|
||||
p = svgData.indexOf('d="', p);
|
||||
@ -73,7 +75,17 @@ function loadFromSvg(svgData) {
|
||||
return true;
|
||||
} else { //something else, must be a pair of coordinates...
|
||||
var tx = 0, ty = 0, numberEnd = 0, len = 0;
|
||||
// var firstComma = svgData.indexOf(',', p);
|
||||
// var firstSpace = svgData.indexOf(' ', p);
|
||||
|
||||
numberEnd = svgData.indexOf(',', p);
|
||||
|
||||
////// RC: if instead of a comma a space is used between a pair use that as a separator
|
||||
var firstSpace = svgData.indexOf(' ', p);
|
||||
if (firstSpace<numberEnd) numberEnd=firstSpace;
|
||||
//console.log('numberEnd',numberEnd,firstSpace);
|
||||
////////////////
|
||||
|
||||
if (numberEnd == -1) { console.log("could not find comma in coordinate pair"); return false; }
|
||||
len = numberEnd - p;
|
||||
tx = parseFloat(svgData.substr(p, len));
|
||||
|
||||
@ -13,6 +13,7 @@ var btnSettings, btnWordArt;
|
||||
var btnToggleEdit, buttonGroupEdit, btnZoom, btnMove, btnRotate;
|
||||
var btnToggleVerticalShapes, btnHeight, btnTwist, btnShape, btnConv, btnStraight, btnSine, btnDiv;
|
||||
var buttonGroupAdd, popupWordArt;
|
||||
var btnScan, popupScan;
|
||||
|
||||
var state;
|
||||
var prevState;
|
||||
@ -43,8 +44,10 @@ function initButtonBehavior() {
|
||||
buttonGroupAdd = $("#buttonGroupAdd");
|
||||
btnShape = new Button("#btnShape");
|
||||
btnWordArt = new Button("#btnWordArt");
|
||||
btnScan = new Button("#btnScan");
|
||||
popupWordArt = $("#popupWordArt");
|
||||
popupShape = $("#popupShape");
|
||||
popupScan = $("#popupScan");
|
||||
popupMask = $("#popupMask");
|
||||
logoPanel = $("#logopanel");
|
||||
btnToggleEdit = new Button("#btnToggleEdit");
|
||||
@ -69,11 +72,12 @@ function initButtonBehavior() {
|
||||
btnAdd.on("onButtonClick", onBtnAdd);
|
||||
btnWordArt.on("onButtonClick", onBtnWordArt);
|
||||
btnShape.on("onButtonClick", onBtnShape);
|
||||
btnScan.on("onButtonClick", onBtnScan);
|
||||
btnPrint.on("onButtonClick", print);
|
||||
btnStop.on("onButtonClick", stopPrint);
|
||||
btnSave.on("onButtonClick", saveSketch);
|
||||
btnPrevious.on("onButtonClick", prevDoodle);
|
||||
btnNext.on("onButtonClick", nextDoodle);
|
||||
btnPrevious.on("onButtonClick", previousSketch);
|
||||
btnNext.on("onButtonClick", nextSketch);
|
||||
btnOops.on("onButtonHold", onBtnOops);
|
||||
// vertical shape buttons
|
||||
btnToggleVerticalShapes.on("onButtonClick", onBtnToggleVerticalShapes);
|
||||
@ -89,8 +93,10 @@ function initButtonBehavior() {
|
||||
btnZoom.on("onButtonHold", onBtnZoom);
|
||||
btnRotate.on("onButtonHold", onBtnRotate);
|
||||
|
||||
getSavedSketchStatus();
|
||||
setSketchModified(false);
|
||||
//getSavedSketchStatus();
|
||||
listSketches();
|
||||
// setSketchModified(false);
|
||||
// updateSketchButtonStates();
|
||||
|
||||
function onBtnToggleVerticalShapes() {
|
||||
var btnImg;
|
||||
@ -179,7 +185,7 @@ function initButtonBehavior() {
|
||||
}
|
||||
|
||||
function onBtnNew(e) {
|
||||
clearDoodle();
|
||||
newSketch();
|
||||
}
|
||||
|
||||
function onBtnWordArt(e) {
|
||||
@ -191,6 +197,11 @@ function initButtonBehavior() {
|
||||
buttonGroupAdd.fadeOut();
|
||||
}
|
||||
|
||||
function onBtnScan(e) {
|
||||
showScanDialog();
|
||||
buttonGroupAdd.fadeOut();
|
||||
}
|
||||
|
||||
btnSettings.on("onButtonClick", openSettingsWindow);
|
||||
|
||||
// 29-okt-2013 - we're not doing help for smartphones at the moment
|
||||
@ -414,8 +425,9 @@ function setState(newState,newHasControl) {
|
||||
btnSave.disable();
|
||||
break;
|
||||
default:
|
||||
updatePrevNextButtonState();
|
||||
if (isModified) btnSave.enable();
|
||||
// updatePrevNextButtonState();
|
||||
updateSketchButtonStates();
|
||||
if (isModified) btnSave.enable();
|
||||
break;
|
||||
}
|
||||
|
||||
|
||||
@ -157,7 +157,7 @@ function draw(_x, _y, _width) {
|
||||
function clearDoodle() {
|
||||
//console.log("f:clearDoodle");
|
||||
|
||||
updatePrevNextButtonStateOnClear();
|
||||
//updatePrevNextButtonStateOnClear();
|
||||
|
||||
_points = [];
|
||||
|
||||
@ -177,6 +177,7 @@ function clearDoodle() {
|
||||
resetVerticalShapes();
|
||||
|
||||
setSketchModified(false);
|
||||
// updateSketchButtonStates();
|
||||
}
|
||||
|
||||
function redrawDoodle(recalcBoundsAndTransforms) {
|
||||
|
||||
@ -218,6 +218,7 @@ function subsituteVariables(gcode) {
|
||||
case "makerbot_replicator2x": printerType = "r2x"; break;
|
||||
case "makerbot_thingomatic": printerType = "t6"; break;
|
||||
case "makerbot_generic": printerType = "r2"; break;
|
||||
case "_3Dison_plus": printerType = "r2"; break;
|
||||
}
|
||||
var heatedBedReplacement = (heatedbed)? "" : ";";
|
||||
|
||||
|
||||
30
js/main.js
30
js/main.js
@ -42,15 +42,26 @@ $(function() {
|
||||
if (getURLParameter("r") != "null") wifiboxIsRemote = (getURLParameter("r") == "1");
|
||||
if (getURLParameter("u") != "null") autoUpdate = (getURLParameter("u") == "1");
|
||||
|
||||
if (wifiboxIsRemote) {
|
||||
// var hostname = "http://10.0.0.45";
|
||||
var hostname = "http://192.168.5.1";
|
||||
wifiboxURL = hostname+"/d3dapi";
|
||||
wifiboxCGIBinURL = hostname+"/cgi-bin/d3dapi";
|
||||
} else {
|
||||
wifiboxURL = "http://" + window.location.host + "/d3dapi";
|
||||
wifiboxCGIBinURL = "http://" + window.location.host + "/cgi-bin/d3dapi";
|
||||
}
|
||||
var hostname;
|
||||
if (wifiboxIsRemote) hostname = 'http://192.168.5.1';
|
||||
if (getURLParameter("wifiboxURL") != "null") hostname = getURLParameter("wifiboxURL");
|
||||
if (!hostname) hostname = "http://" + window.location.host;
|
||||
|
||||
wifiboxURL = hostname+"/d3dapi";
|
||||
wifiboxCGIBinURL = hostname+"/cgi-bin/d3dapi";
|
||||
|
||||
|
||||
//var api = wifiboxURL+'/d3dapi/sketch/';
|
||||
|
||||
// if (wifiboxIsRemote) {
|
||||
// // var hostname = "http://10.0.0.45";
|
||||
// var hostname = "http://192.168.5.1";
|
||||
// wifiboxURL = hostname+"/d3dapi";
|
||||
// wifiboxCGIBinURL = hostname+"/cgi-bin/d3dapi";
|
||||
// } else {
|
||||
// wifiboxURL = "http://" + window.location.host + "/d3dapi";
|
||||
// wifiboxCGIBinURL = "http://" + window.location.host + "/cgi-bin/d3dapi";
|
||||
// }
|
||||
|
||||
if (!communicateWithWifibox) {
|
||||
sendPrintCommands = false; // 'communicateWithWifibox = false' implies this
|
||||
@ -74,6 +85,7 @@ $(function() {
|
||||
// initVerticalShapes();
|
||||
initWordArt();
|
||||
initShapeDialog();
|
||||
initScanDialog();
|
||||
|
||||
disableDragging();
|
||||
|
||||
|
||||
@ -176,6 +176,10 @@ function SettingsWindow() {
|
||||
saveAs(blob, "doodle3d.svg");
|
||||
}
|
||||
};
|
||||
|
||||
this.openFileManager = function() {
|
||||
location.href = "filemanager/"+location.search;
|
||||
}
|
||||
}
|
||||
|
||||
/*************************
|
||||
|
||||
207
js/sketches.js
207
js/sketches.js
@ -6,158 +6,95 @@
|
||||
* See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
|
||||
*/
|
||||
|
||||
var currentSketchId = 0;
|
||||
var numSavedSketches = 0;
|
||||
var curSketch = 0;
|
||||
var sketches = []; //contains fileIDs
|
||||
|
||||
function getSavedSketchStatus() {
|
||||
$.ajax({
|
||||
url: wifiboxURL + "/sketch/status",
|
||||
dataType: 'json',
|
||||
type: 'GET',
|
||||
//timeout: this.timeoutTime,
|
||||
success: function(response) {
|
||||
if (response.status == 'error' || response.status == 'fail') {
|
||||
console.log("getSavedSketchStatus fail/error: " + response.msg + " -- ", response);
|
||||
} else {
|
||||
console.log("getSavedSketchStatus success: num. saved: " + response.data.number_of_sketches + ", space available: " + response.data.available);
|
||||
numSavedSketches = response.data.number_of_sketches;
|
||||
updatePrevNextButtonStateOnClear();
|
||||
}
|
||||
}
|
||||
}).fail(function() {
|
||||
console.log("getSavedSketchStatus failed");
|
||||
});
|
||||
function previousSketch(e) {
|
||||
loadSketch(curSketch-1);
|
||||
}
|
||||
|
||||
function setSketchModified(_isModified, doNotClearCurrent) {
|
||||
function nextSketch(e) {
|
||||
loadSketch(curSketch+1);
|
||||
}
|
||||
|
||||
function newSketch(e) {
|
||||
clearDoodle();
|
||||
curSketch = sketches.length; //index of the last item + 1
|
||||
updateSketchButtonStates();
|
||||
}
|
||||
|
||||
function listSketches() {
|
||||
console.log('listSketches')
|
||||
$.get(wifiboxURL + "/sketch/list", function(data) {
|
||||
if (data.status=='success') {
|
||||
sketches = data.data.list;
|
||||
curSketch = sketches.length-1;
|
||||
setSketchModified(false);
|
||||
updateSketchButtonStates();
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function setSketchModified(_isModified) {
|
||||
isModified = _isModified;
|
||||
|
||||
// alert("isModified: " + isModified);
|
||||
//console.log("setModified: " + isModified + (typeof(doNotClearCurrent) !== 'undefined' ? " (doNotClearCurrent: "+doNotClearCurrent+")" : "")); //TEMP
|
||||
|
||||
if (isModified) btnSave.enable();
|
||||
else btnSave.disable();
|
||||
|
||||
//if (typeof(doNotClearCurrent) !== 'undefined' && !doNotClearCurrent) setCurrentSketchId(-1);
|
||||
|
||||
|
||||
//sketchModified = isModified; /// ERROR?
|
||||
updateSketchButtonStates();
|
||||
}
|
||||
|
||||
function setCurrentSketchId(sId) {
|
||||
console.log("setCurrentSketchId: " + sId + " / " + numSavedSketches);
|
||||
// var enablePrev = false;
|
||||
// var enableNext = false;
|
||||
function updateSketchButtonStates() {
|
||||
console.log('sketch: isModified',isModified,'curSketch',curSketch,'sketches.length',sketches.length);
|
||||
|
||||
currentSketchId = sId;
|
||||
|
||||
//clamp
|
||||
if (currentSketchId > numSavedSketches) currentSketchId = numSavedSketches;
|
||||
if (currentSketchId < 1) currentSketchId = 1;
|
||||
|
||||
//update textbox
|
||||
//$("#txtSketch").val(currentSketchId);
|
||||
|
||||
updatePrevNextButtonState();
|
||||
}
|
||||
|
||||
function updatePrevNextButtonStateOnClear() {
|
||||
if (numSavedSketches > 0) btnPrevious.enable();
|
||||
btnNext.disable();
|
||||
currentSketchId = numSavedSketches+1; //after the end of the list
|
||||
btnSave.disable();
|
||||
}
|
||||
|
||||
function updatePrevNextButtonState() {
|
||||
|
||||
//btnPrevious state
|
||||
if (numSavedSketches==0 || currentSketchId < 2) {
|
||||
btnPrevious.disable();
|
||||
} else {
|
||||
btnPrevious.enable();
|
||||
if (isModified) {
|
||||
btnSave.enable();
|
||||
}
|
||||
else {
|
||||
btnSave.disable();
|
||||
}
|
||||
|
||||
//btnNext state
|
||||
if (numSavedSketches==0 || currentSketchId >= numSavedSketches) {
|
||||
btnNext.disable();
|
||||
} else {
|
||||
if (curSketch<sketches.length-1) {
|
||||
btnNext.enable();
|
||||
} else {
|
||||
btnNext.disable();
|
||||
}
|
||||
|
||||
if (curSketch>0) {
|
||||
btnPrevious.enable();
|
||||
} else {
|
||||
btnPrevious.disable();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function loadSketch(sketchId) {
|
||||
function loadSketch(_curSketch) {
|
||||
curSketch = _curSketch;
|
||||
|
||||
$.ajax({
|
||||
url: wifiboxURL + "/sketch/" + sketchId,
|
||||
dataType: 'json',
|
||||
type: 'GET',
|
||||
// timeout: this.timeoutTime,
|
||||
success: function(response) {
|
||||
if (response.status == 'error' || response.status == 'fail') {
|
||||
console.log("loadSketch fail/error: " + response.msg + " -- ", response);
|
||||
} else {
|
||||
console.log("loadSketch success: loaded id #" + response.data.id, response);
|
||||
//console.log("sketch content:\n" + response.data.data);
|
||||
if (loadFromSvg(response.data.data)) {
|
||||
setSketchModified(false, true);
|
||||
setCurrentSketchId(response.data.id);
|
||||
}
|
||||
}
|
||||
if (curSketch<0) curSketch=0;
|
||||
if (curSketch>sketches.length-1) curSketch=sketches.length-1;
|
||||
|
||||
var id = sketches[curSketch];
|
||||
|
||||
console.log('sketch: loadSketch curSketch',curSketch,'id',id);
|
||||
|
||||
$.get(wifiboxURL + "/sketch", {id:id}, function(response) {
|
||||
if (response.status=='success') {
|
||||
console.log('sketch: loaded',response);
|
||||
var svgData = response.data.data;
|
||||
loadFromSvg(svgData);
|
||||
setSketchModified(false);
|
||||
} else {
|
||||
console.log('error loading sketch: ',response);
|
||||
listSketches();
|
||||
}
|
||||
}).fail(function() {
|
||||
console.log("loadSketch failed: ", response);
|
||||
});
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
function saveSketch() {
|
||||
svg = saveToSvg();
|
||||
console.log("generated SVG [" + _points.length + " points, " + svg.length + " bytes]:\n" + svg);
|
||||
console.log("sketch: saveSketch");
|
||||
var svgData = saveToSvg();
|
||||
|
||||
$.post(wifiboxURL + "/sketch", {data: svgData}, function(response) {
|
||||
console.log("sketch: saveSketch: response",response);
|
||||
listSketches();
|
||||
})
|
||||
|
||||
$.ajax({
|
||||
url: wifiboxURL + "/sketch",
|
||||
dataType: 'json',
|
||||
type: 'POST',
|
||||
data: { data: svg },
|
||||
//timeout: this.timeoutTime,
|
||||
success: function(response) {
|
||||
if (response.status == 'error' || response.status == 'fail') {
|
||||
console.log("saveSketch fail/error: " + response.msg + " -- ", response);
|
||||
} else {
|
||||
console.log("saveSketch success: saved with id #" + response.data.id, response);
|
||||
setSketchModified(false, true);
|
||||
numSavedSketches = response.data.id;
|
||||
setCurrentSketchId(response.data.id);
|
||||
}
|
||||
}
|
||||
}).fail(function() {
|
||||
console.log("saveSketch failed: ", response);
|
||||
});
|
||||
}
|
||||
|
||||
function prevDoodle(e) {
|
||||
console.log("f:prevDoodle(): " + currentSketchId + " / " + numSavedSketches);
|
||||
//alert('prev ' + numSavedSketches);
|
||||
//return;
|
||||
|
||||
//TODO: if (enabled) {
|
||||
var sketchId = (currentSketchId > 0) ? currentSketchId : numSavedSketches;
|
||||
if (sketchId > 1) sketchId--;
|
||||
|
||||
|
||||
//alert(sketchId);
|
||||
|
||||
loadSketch(sketchId);
|
||||
//}
|
||||
}
|
||||
|
||||
function nextDoodle(e) {
|
||||
console.log("f:nextDoodle()");
|
||||
//alert('next ' + numSavedSketches);
|
||||
//return;
|
||||
|
||||
//TODO: if (enabled) {
|
||||
var sketchId = (currentSketchId > 0) ? currentSketchId : numSavedSketches;
|
||||
if (sketchId < numSavedSketches) sketchId++;
|
||||
loadSketch(sketchId);
|
||||
//}
|
||||
}
|
||||
|
||||
@ -57,6 +57,7 @@
|
||||
left: 0;
|
||||
width: 78%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#mycanvas {
|
||||
@ -127,4 +128,24 @@
|
||||
|
||||
}
|
||||
|
||||
#mycanvas {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
#imgGuide {
|
||||
// z-index: -1000;
|
||||
// position: absolute;
|
||||
// -webkit-filter: contrast(400%);
|
||||
//-webkit-filter: brightness(100%);
|
||||
// opacity: 50%;
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
pointer-events:none;
|
||||
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
|
||||
@ -130,6 +130,16 @@
|
||||
left: 4px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#btnCloseScan {
|
||||
top: 4px;
|
||||
right: 8px;
|
||||
position: absolute;
|
||||
display: none;
|
||||
opacity: 0.7;
|
||||
filter: alpha(opacity=70);
|
||||
}
|
||||
|
||||
#buttonGroupEdit {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
@ -163,10 +173,10 @@
|
||||
margin-top: -60%;
|
||||
margin-left: 70%;
|
||||
width: 200%;
|
||||
max-width: 140px; /*fixme: can this grow based on it's content?*/
|
||||
max-width: 240px; /*fixme: can this grow based on it's content?*/
|
||||
padding: 5% 0 5% 5%;
|
||||
#btnWordArt, #btnShape {
|
||||
width: 45%;
|
||||
#btnWordArt, #btnShape, #btnScan {
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -47,6 +47,21 @@
|
||||
}
|
||||
}
|
||||
|
||||
#popupScan {
|
||||
width: 330px;
|
||||
height:210px;
|
||||
margin-left: -165px;
|
||||
margin-top: -105px;
|
||||
|
||||
input[type="file"] {
|
||||
width: 98%;
|
||||
}
|
||||
#btnScanOk {
|
||||
float: right;
|
||||
margin: 15px 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
#popupShape {
|
||||
width: 310px;
|
||||
margin-left: -155px;
|
||||
|
||||
@ -17,6 +17,7 @@ body,th,td {
|
||||
/*min-width: 370px;*/
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: scroll;
|
||||
}
|
||||
/*form#settingsForm {*/
|
||||
/*width: 100% auto;*/
|
||||
|
||||
49
www/filemanager/css/style.css
Normal file
49
www/filemanager/css/style.css
Normal file
@ -0,0 +1,49 @@
|
||||
body {
|
||||
font-family: Helvetica, Abel, Arial;
|
||||
font-size: 1em;
|
||||
|
||||
-webkit-user-select: none; /* webkit (safari, chrome) browsers */
|
||||
-moz-user-select: none; /* mozilla browsers */
|
||||
-khtml-user-select: none; /* webkit (konqueror) browsers */
|
||||
-ms-user-select: none; /* IE10+ */
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
div.item {
|
||||
width:150px;
|
||||
height:130px;
|
||||
border:1px solid black;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
background-color: white;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
div.item.selected {
|
||||
background-color: #7cf;
|
||||
}
|
||||
|
||||
div.item input[type='checkbox'] {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#frmUpload {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
input[type='file'] {
|
||||
width: 1px;
|
||||
opacity:0
|
||||
}
|
||||
|
||||
#txtInfo {
|
||||
float: right;
|
||||
/*display: inline-block;*/
|
||||
}
|
||||
|
||||
img#logo {
|
||||
cursor: pointer;
|
||||
}
|
||||
30
www/filemanager/index.html
Normal file
30
www/filemanager/index.html
Normal file
@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Doodle3D</title>
|
||||
<link href="css/style.css" rel="stylesheet" media="screen">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<img id="logo" src="../img/logo/doodle3d.png" height="25">
|
||||
<hr>
|
||||
<button id="btnSelectAll">Select all</button>
|
||||
<button id="btnDeselectAll">Deselect all</button>
|
||||
<button id="btnDelete">Delete</button>
|
||||
<button id="btnDownload">Download</button> <!-- <a id="link" href="#">Download</a> -->
|
||||
|
||||
<form id="frmUpload"><button id="btnUpload">Upload</button><input id="uploads" type="file" accept="image/svg+xml" multiple/></form>
|
||||
|
||||
<span id="txtInfo"></span>
|
||||
|
||||
<hr>
|
||||
<form>
|
||||
<div id="svgContainer"></div>
|
||||
</form>
|
||||
|
||||
<script src="../js/libs/jquery-1-9-1.min.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
267
www/filemanager/js/main.js
Normal file
267
www/filemanager/js/main.js
Normal file
@ -0,0 +1,267 @@
|
||||
/*
|
||||
* This file is part of the Doodle3D project (http://doodle3d.com).
|
||||
*
|
||||
* Copyright (c) 2014, Doodle3D
|
||||
* This software is licensed under the terms of the GNU GPL v2 or later.
|
||||
* See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
|
||||
*/
|
||||
|
||||
// http://stackoverflow.com/questions/1403888/get-url-parameter-with-jquery
|
||||
function getURLParameter(name) {
|
||||
return decodeURI((new RegExp('[&?]'+name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]);
|
||||
}
|
||||
|
||||
var wifiboxURL = "";
|
||||
|
||||
if (getURLParameter("r") != "null") wifiboxURL = 'http://192.168.5.1';
|
||||
if (getURLParameter("wifiboxURL") != "null") wifiboxURL = getURLParameter("wifiboxURL");
|
||||
|
||||
var api = wifiboxURL+'/d3dapi/sketch/';
|
||||
|
||||
$("#logo").click(onLogoClick)
|
||||
$("#btnDelete").click(deleteSelectedSketches);
|
||||
$("#btnSelectAll").click(selectAll);
|
||||
$("#btnDeselectAll").click(deselectAll);
|
||||
$("#uploads").change(upload);
|
||||
$("#btnDownload").click(download);
|
||||
|
||||
$("#btnUpload").click(function(e) {
|
||||
e.preventDefault();
|
||||
$("#uploads").trigger('click');
|
||||
});
|
||||
|
||||
var isBusy = true;
|
||||
|
||||
updateButtonStates();
|
||||
|
||||
$.get(api+'list', function(data) { //?id=00003
|
||||
|
||||
if (data.status=='success') {
|
||||
var list = data.data.list;
|
||||
// list.reverse();
|
||||
|
||||
isBusy = true;
|
||||
updateButtonStates();
|
||||
updateStatusMessage('loading '+list.length+' sketches...');
|
||||
|
||||
loadSketch(list, function() {
|
||||
console.log('done');
|
||||
isBusy = false;
|
||||
updateFreeSpace();
|
||||
updateButtonStates();
|
||||
});
|
||||
|
||||
} else {
|
||||
console.log('failure',data)
|
||||
}
|
||||
|
||||
}).fail(function(status) {
|
||||
alert("Error ("+status.status+") connecting to "+api+'list');
|
||||
console.log(status);
|
||||
});
|
||||
|
||||
function onLogoClick() {
|
||||
location.href='/'+location.search;
|
||||
}
|
||||
|
||||
function loadSketch(list,cb) {
|
||||
var id = list.pop();
|
||||
|
||||
$.get(api+'?id='+id, function(data) {
|
||||
|
||||
if (data.status=='success') {
|
||||
addItem(id,data.data.data);
|
||||
}
|
||||
|
||||
updateStatusMessage('loading '+list.length+' sketches...');
|
||||
|
||||
if (list.length>0) {
|
||||
loadSketch(list,function() {
|
||||
cb();
|
||||
})
|
||||
} else {
|
||||
cb();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function addItem(id,svgData,doPrepend) {
|
||||
var path;
|
||||
|
||||
if (!svgData) path = "";
|
||||
else if (typeof(svgData)!='string') path = "";
|
||||
else if (svgData.indexOf("CDATA")==-1) path = "";
|
||||
else path = svgData.split('d="')[1].split('"')[0];
|
||||
|
||||
var item = $('<div class="item" data="'+id+'" title="'+id+'">');
|
||||
var svg = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 640 540"><path fill="none" stroke="black" stroke-width="2" d="'+path+'"></path></svg>';
|
||||
|
||||
item.click(function() {
|
||||
$(this).toggleClass('selected');
|
||||
console.log($(this).attr("data"));
|
||||
updateButtonStates();
|
||||
})
|
||||
item.append(svg);
|
||||
|
||||
if (doPrepend) $('#svgContainer').prepend(item);
|
||||
else $('#svgContainer').append(item);
|
||||
item.hide().fadeIn();
|
||||
|
||||
updateButtonStates();
|
||||
}
|
||||
|
||||
function deleteSketches(list,cb) {
|
||||
var id = list.pop();
|
||||
|
||||
$.post(api+'delete', {id:id}, function(data) {
|
||||
|
||||
$('.item[data='+id+']').fadeOut('slow',function() {
|
||||
$(this).remove(); //remove when effect is finished
|
||||
});
|
||||
|
||||
updateStatusMessage("Deleting " + list.length + ' sketches...');
|
||||
|
||||
if (list.length>0) {
|
||||
deleteSketches(list,cb);
|
||||
} else {
|
||||
cb();
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function deleteSelectedSketches() {
|
||||
if (confirm('Do you want to delete '+$('.item.selected').length+' drawings?')) {
|
||||
|
||||
var ids = [];
|
||||
$('.item.selected').map(function(){
|
||||
ids.push($(this).attr('data'));
|
||||
});
|
||||
|
||||
isBusy = true;
|
||||
updateButtonStates();
|
||||
|
||||
deleteSketches(ids,function() {
|
||||
console.log('done deleting sketches');
|
||||
isBusy = false;
|
||||
updateButtonStates();
|
||||
updateFreeSpace();
|
||||
});
|
||||
|
||||
deselectAll();
|
||||
updateButtonStates();
|
||||
}
|
||||
}
|
||||
|
||||
function selectAll() {
|
||||
$('.item').addClass('selected');
|
||||
updateButtonStates();
|
||||
}
|
||||
|
||||
function deselectAll() {
|
||||
$('.item').removeClass('selected');
|
||||
updateButtonStates();
|
||||
}
|
||||
|
||||
function updateButtonStates() {
|
||||
var numItems = $('.item').length;
|
||||
var numSelected = $('.item.selected').length;
|
||||
var noSelection = numSelected==0;
|
||||
|
||||
$("#btnDelete").attr("disabled",isBusy || noSelection);
|
||||
$("#btnDownload").attr("disabled",isBusy || noSelection);
|
||||
$("#btnDeselectAll").attr("disabled",isBusy || noSelection);
|
||||
$("#btnSelectAll").attr("disabled",isBusy || numItems==0);
|
||||
$("#btnUpload").attr("disabled",isBusy || !noSelection);
|
||||
$("#btnDelete").text("Delete" + (noSelection ? "" : " ("+numSelected+")"));
|
||||
$("#btnDownload").text("Download" + (noSelection ? "" : " ("+numSelected+")"));
|
||||
}
|
||||
|
||||
function uploadFile(files, index, next) {
|
||||
var reader = new FileReader();
|
||||
reader.readAsText(files[index], "UTF-8");
|
||||
reader.onload = function (evt) {
|
||||
console.log("onload",index); //,files[index],evt.target);
|
||||
|
||||
//process file
|
||||
var svg = convertSvg(evt.target.result);
|
||||
|
||||
$.post(api, {data:svg}, function(data) {
|
||||
if (data.status=='success') {
|
||||
var id = data.data.id;
|
||||
addItem(id,svg,true);
|
||||
|
||||
updateStatusMessage('uploading '+(files.length-index)+' sketches...');
|
||||
|
||||
if (index<files.length-1) {
|
||||
uploadFile(files, index+1, next);
|
||||
} else {
|
||||
next(); //no more files, call back
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
reader.onerror = function (evt) {
|
||||
console.log("onerror");
|
||||
next(); //stop processing file(s), call back/
|
||||
}
|
||||
}
|
||||
|
||||
function upload() {
|
||||
var files = $("#uploads")[0].files
|
||||
var reader = new FileReader();
|
||||
var cur = 0;
|
||||
isBusy = true;
|
||||
updateButtonStates();
|
||||
updateStatusMessage("Uploading " + files.length + " files");
|
||||
|
||||
uploadFile(files, cur, function() {
|
||||
console.log("done");
|
||||
isBusy = false;
|
||||
updateButtonStates();
|
||||
updateFreeSpace();
|
||||
$("#frmUpload")[0].reset();
|
||||
})
|
||||
}
|
||||
|
||||
function updateFreeSpace() {
|
||||
$.get(api+'status', function(data) { //?id=00003
|
||||
if (data.status=='success') {
|
||||
var numSketches = data.data.number_of_sketches;
|
||||
var freeKb = Math.round(data.data.available/1024);
|
||||
updateStatusMessage(numSketches+" sketches, "+freeKb+"k bytes free");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function updateStatusMessage(msg) {
|
||||
$("#txtInfo").text(msg);
|
||||
}
|
||||
|
||||
function convertSvg(svg) {
|
||||
if (!svg) return "";
|
||||
if (typeof(svg)!='string') return "";
|
||||
if (svg.indexOf("CDATA")>-1) return svg; //assume this SVG is already ok
|
||||
|
||||
//this fixes SVG's created by the kunstcentraal app
|
||||
var re = /([a-zA-Z])\s?([0-9]{1,}) ([0-9]{1,})/g;
|
||||
svg = svg.replace(re,"$1$2,$3");
|
||||
re = /<\/svg>/g;
|
||||
svg = svg.replace(re,"<!--<![CDATA[d3d-keys {\"height\":5,\"outlineShape\":\"none\",\"twist\":0}]]>-->\n</svg>");
|
||||
|
||||
svg = svg.replace("M0,0 ",""); //RC: hack
|
||||
|
||||
return svg;
|
||||
}
|
||||
|
||||
function download() {
|
||||
$('.item.selected').each(function() {
|
||||
var id = $(this).attr('data');
|
||||
var svgData = $(this).html();
|
||||
console.log('downloading',id);
|
||||
$('<a target="_blank" href="data:image/svg+xml,'+encodeURIComponent(svgData)+'" download="'+id+'.svg">')[0].click();
|
||||
});
|
||||
}
|
||||
|
||||
BIN
www/img/buttons/btnClose.png
Normal file
BIN
www/img/buttons/btnClose.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
www/img/buttons/btnGuide.png
Normal file
BIN
www/img/buttons/btnGuide.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
BIN
www/img/buttons/btnScan.png
Normal file
BIN
www/img/buttons/btnScan.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
@ -40,6 +40,7 @@
|
||||
<div id="buttonGroupAdd" class="buttonGroup">
|
||||
<img id="btnWordArt" class="btn" src="img/buttons/btnWordArt.png" />
|
||||
<img id="btnShape" class="btn" src="img/buttons/btnShape.png" />
|
||||
<img id="btnScan" class="btn" src="img/buttons/btnGuide.png" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -75,10 +76,12 @@
|
||||
</div>
|
||||
|
||||
<div id="drawareacontainer">
|
||||
|
||||
<div id="canvasContainers">
|
||||
|
||||
<div id="mycanvasContainer">
|
||||
<img id="imgGuide">
|
||||
<canvas id="mycanvas"></canvas>
|
||||
<img id="btnCloseScan" class="btn" src="img/buttons/btnClose.png" />
|
||||
</div>
|
||||
|
||||
<div id="previewContainer">
|
||||
@ -125,6 +128,15 @@
|
||||
<img id="btnWordArtOk" class="btn" src="img/buttons/btnOk.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="popup" id="popupScan">
|
||||
<div class="content">
|
||||
<h1>Use photo as a guide</h1>
|
||||
<input id="fileScan" type="file"/>
|
||||
<!-- <input id="txtDummy" type="text"/> -->
|
||||
<img id="btnScanOk" class="btn" src="img/buttons/btnOk.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="popup" id="popupShape">
|
||||
<div class="content">
|
||||
|
||||
@ -173,14 +173,20 @@
|
||||
<small id="updateInfo"></small>
|
||||
</fieldset>
|
||||
|
||||
<fieldset id="debugPanel">
|
||||
<legend>Debug</legend>
|
||||
<input type="button" onclick="settingsWindow.downloadlogs()" name="downloadlogs" value="Download logs" class="button" id="downloadlogs"/>
|
||||
<fieldset id="extraPanel">
|
||||
<legend>Sketches</legend>
|
||||
<input type="button" onclick="settingsWindow.openFileManager()" name="btnFileMgr" value="Open FileManager" class="button" id="btnFileMgr"/>
|
||||
<input type="button" onclick="settingsWindow.downloadGcode()" name="downloadGcode" value="Download GCODE" class="button" id="downloadGcode"/>
|
||||
<input type="button" onclick="settingsWindow.downloadSvg()" name="downloadSvg" value="Download SVG" class="button" id="downloadSvg"/>
|
||||
</fieldset>
|
||||
|
||||
<fieldset id="restorePanel">
|
||||
</fieldset>
|
||||
|
||||
<fieldset id="debugPanel">
|
||||
<legend>Debug</legend>
|
||||
<input type="button" onclick="settingsWindow.downloadlogs()" name="downloadlogs" value="Download logs" class="button" id="downloadlogs"
|
||||
/>
|
||||
</fieldset>
|
||||
|
||||
<fieldset id="restorePanel">
|
||||
<legend>Restore</legend>
|
||||
<input type="button" name="restoresettings" value="Restore settings to defaults" class="button" id="restoreSettings"/>
|
||||
<span id="restoreState"></span>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user