pingu_98/MrDraw
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

first preview draft

Browse source
This commit is contained in:
Teja 2015-01-14 15:21:02 +01:00
parent 59368ca240
commit 0c68913e56
8 changed files with 101 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/octoprint/plugins/svgtogcode/__init__.py
View file

@ -146,7 +146,7 @@ class SvgToGcodePlugin(octoprint.plugin.SlicerPlugin,
def get_assets(self):
return {
"js": ["js/svgtogcode.js", "js/convert.js", "js/working_area.js"],
"js": ["js/svgtogcode.js", "js/convert.js", "js/working_area.js", "js/lib/snap.svg-min.js"],
"less": ["less/svgtogcode.less"],
"css": ["css/svgtogcode.css"]
}

20
src/octoprint/plugins/svgtogcode/static/js/lib/snap.svg-min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

43
src/octoprint/plugins/svgtogcode/static/js/working_area.js
View file

@ -59,6 +59,14 @@ function WorkingAreaViewModel(loginStateViewModel, settingsViewModel, printerSta
return self.settings.printer_bedDimensionX() / self.workingAreaWidth();
});
self.scaleMatrix = ko.computed(function(){
var m = new Snap.Matrix();
m.scale(25.4/90 * 1/self.px2mm_factor());
return m;
});
self.placedDesigns = ko.observableArray([]);
self.trigger_resize = function(){
self.availableHeight(document.documentElement.clientHeight - $('body>nav').outerHeight() - $('footer>*').outerHeight() - 39); // magic number
self.availableWidth($('#workingarea div.span8').innerWidth());
@ -99,6 +107,41 @@ function WorkingAreaViewModel(loginStateViewModel, settingsViewModel, printerSta
};
//self.getDivDimensions(); // init
self.placeSVG = function(url){
console.log("workingarea", url);
Snap.load(url, function (f) {
var newSvg = f.select("g");
var id = self.generateId(url);
newSvg.attr("id", id);
snap.select("#scaleGroup").append(newSvg);
newSvg.drag();// Making croc draggable. Go ahead drag it around!
// Obviously drag could take event handlers too
var ref = {
id : id,
url : url
};
self.placedDesigns.push(ref);
});
};
self.init = function(){
// init snap.svg
snap = Snap('#area_preview');
};
self.generateId = function(url){
var idBase = '_'+url.substring(url.lastIndexOf('/')+1).replace('.', '-'); // _ at first place if filename starts with a digit
var suffix = 0;
var id = idBase + "-" + suffix;
while(snap.select('#'+id) !== null){
suffix += 1;
id = idBase + suffix;
}
return id;
};
}

28
src/octoprint/plugins/svgtogcode/templates/override_index.jinja2
View file

@ -271,6 +271,7 @@ var UI_API_KEY = "{{ uiApiKey }}";
<div class="btn btn-mini" data-bind="click: function() { if ($root.enableRemove($data)) { $root.removeFile($data); } else { return; } }, css: {disabled: !$root.enableRemove($data)}"><i class="icon-trash" title="{{ _('Remove') }}"></i></div>
<div class="btn btn-mini" data-bind="click: function() { if ($root.enableSelect($data)) { $root.loadFile($data, false); } else { return; } }, css: {disabled: !$root.enableSelect($data)}"><i class="icon-folder-open" title="{{ _('Load') }}"></i></div>
<div class="btn btn-mini" data-bind="click: function() { if ($root.enableSelect($data)) { $root.loadFile($data, true); } else { return; } }, css: {disabled: !$root.enableSelect($data)}"><i class="icon-fire" title="{{ _('Load and Laser') }}"></i></div>
<div class="btn btn-mini" data-bind="click: function() { $root.showFile($data); }"><i class="icon-arrow-right" title="{{ _('Preview') }}"></i></div>
</div>
</div>
</script>
@ -282,7 +283,8 @@ var UI_API_KEY = "{{ uiApiKey }}";
<div class="size">{{ _('Size') }}: <span data-bind="text: formatSize(size)"></span></div>
<div class="btn-group action-buttons">
<div class="btn btn-mini" data-bind="click: function() { if ($root.enableRemove($data)) { $root.removeFile($data); } else { return; } }, css: {disabled: !$root.enableRemove($data)}"><i class="icon-trash" title="{{ _('Remove') }}"></i></div>
<div class="btn btn-mini" data-bind="click: function() { $root.convertSVG($data); }, css: {disabled: !$root.enableSVGConversion($data)}"><i class="icon-play" title="{{ _('Convert to Laserpath') }}"></i></div>
<div class="btn btn-mini" data-bind="click: function() { $root.convertSVG($data); }, css: {disabled: !$root.enableSVGConversion($data)}"><i class="icon-play" title="{{ _('Convert to Laserpath') }}"></i></div>
<div class="btn btn-mini" data-bind="click: function() { $root.placeSVG($data); }, css: {disabled: !$root.enableSVGConversion($data)}"><i class="icon-arrow-right" title="{{ _('Use') }}"></i></div>
</div>
</div>
</script>
@ -316,14 +318,25 @@ var UI_API_KEY = "{{ uiApiKey }}";
</div>
<div class="span8">
<div id="area_preview" class="workingarea"
<svg id="area_preview" class="workingarea"
data-bind="click: move_laser,
style: {
backgroundPosition: crosshairX()+'px'+' '+crosshairY()+'px',
width: workingAreaWidth()+'px',
height: workingAreaHeight()+'px'
}">
</div>
},
attr: { transform: scaleMatrix() }
">
<g id="scaleGroup" data-bind="attr: { transform: scaleMatrix() }"></g>
</svg>
<!-- <div class="jumbotron">
<canvas id="renderPathCanvas" style="border: none;" width="512" height="512"></canvas>
<input id="timeSlider" type="text" data-slider-min="0" data-slider-max="1000" data-slider-step="1" data-slider-value="1000" />
</div>-->
</div>
</div>
</div>
@ -529,8 +542,11 @@ var UI_API_KEY = "{{ uiApiKey }}";
<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/js/gCodeReader.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='gcodeviewer/js/renderer.js') }}"></script>
<script src="{{ url_for('static', filename='js/lib/jscut/gl-matrix-2.2.0-min.js') }}"></script>
<script src="{{ url_for('static', filename='js/lib/jscut/webgl-utils.js') }}"></script>
<script src="{{ url_for('static', filename='js/lib/jscut/parseGcode.js') }}"></script>
<script src="{{ url_for('static', filename='js/lib/jscut/RenderPath.js') }}"></script>
</body>
</html>

1
src/octoprint/server/__init__.py
View file

@ -318,6 +318,7 @@ class Server():
self._tornado_app = Application(self._router.urls + [
(r"/downloads/timelapse/([^/]*\.mpg)", util.tornado.LargeResponseHandler, dict(path=settings().getBaseFolder("timelapse"), as_attachment=True)),
(r"/downloads/files/local/([^/]*\.(gco|gcode|g))", util.tornado.LargeResponseHandler, dict(path=settings().getBaseFolder("uploads"), as_attachment=True)),
(r"/serve/files/local/([^/]*\.(gco|gcode|g|nc|svg))", util.tornado.LargeResponseHandler, dict(path=settings().getBaseFolder("uploads"), as_attachment=False)),
(r"/downloads/logs/([^/]*)", util.tornado.LargeResponseHandler, dict(path=settings().getBaseFolder("logs"), as_attachment=True, access_validation=util.tornado.access_validation_factory(app, loginManager, util.flask.admin_validator))),
(r"/downloads/camera/current", util.tornado.UrlForwardHandler, dict(url=settings().get(["webcam", "snapshot"]), as_attachment=True, access_validation=util.tornado.access_validation_factory(app, loginManager, util.flask.user_validator))),
(r".*", util.tornado.UploadStorageFallbackHandler, dict(fallback=util.tornado.WsgiInputContainer(app.wsgi_app), file_prefix="octoprint-file-upload-", file_suffix=".tmp", suffixes=upload_suffixes))

1
src/octoprint/server/api/files.py
View file

@ -274,7 +274,6 @@ def gcodeFileCommand(filename, target):
"select": [],
"slice": []
}
command, data, response = util.getJsonCommandFromRequest(request, valid_commands)
if response is not None:
return response

5
src/octoprint/static/js/app/main.js
View file

@ -69,11 +69,11 @@ $(function() {
var terminalViewModel = new TerminalViewModel(loginStateViewModel, settingsViewModel);
var slicingViewModel = new SlicingViewModel(loginStateViewModel);
var vectorConversionViewModel = new VectorConversionViewModel(loginStateViewModel, settingsViewModel);
var gcodeFilesViewModel = new GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicingViewModel, vectorConversionViewModel);
var workingAreaViewModel = new WorkingAreaViewModel(loginStateViewModel, settingsViewModel, printerStateViewModel);
var gcodeFilesViewModel = new GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicingViewModel, vectorConversionViewModel, workingAreaViewModel);
var gcodeViewModel = new GcodeViewModel(loginStateViewModel, settingsViewModel);
var navigationViewModel = new NavigationViewModel(loginStateViewModel, appearanceViewModel, settingsViewModel, usersViewModel);
var logViewModel = new LogViewModel(loginStateViewModel);
var workingAreaViewModel = new WorkingAreaViewModel(loginStateViewModel, settingsViewModel, printerStateViewModel);
var viewModelMap = {
@ -281,6 +281,7 @@ $(function() {
workingAreaViewModel.trigger_resize();
});
workingAreaViewModel.trigger_resize(); // initialize
workingAreaViewModel.init();
$(document).bind("dragover", function (e) {
var dropOverlay = $("#drop_overlay");

14
src/octoprint/static/js/app/viewmodels/files.js
View file

@ -1,10 +1,11 @@
function GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicingViewModel, vectorConversionViewModel) {
function GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicingViewModel, vectorConversionViewModel, workingAreaViewModel) {
var self = this;
self.printerState = printerStateViewModel;
self.loginState = loginStateViewModel;
self.slicing = slicingViewModel;
self.conversion = vectorConversionViewModel;
self.workingArea = workingAreaViewModel;
self.isErrorOrClosed = ko.observable(undefined);
self.isOperational = ko.observable(undefined);
@ -196,6 +197,14 @@ function GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicing
self.conversion.show(file.origin, file.name);
};
self.placeSVG = function(file) {
if (file && file["refs"] && file["refs"]["download"]) {
var url = file.refs.download.replace("downloads", "serve");
console.log("placeSVG", url);
self.workingArea.placeSVG(url);
}
};
self.initSdCard = function() {
self._sendSdCommand("init");
};
@ -220,7 +229,6 @@ function GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicing
self.downloadLink = function(data) {
if (data["refs"] && data["refs"]["download"]) {
console.log(data["refs"])
return data["refs"]["download"];
} else {
return false;
@ -342,7 +350,7 @@ function GcodeFilesViewModel(printerStateViewModel, loginStateViewModel, slicing
};
self.onUpdatedFiles = function(payload) {
console.log(payload)
console.log("onUpdatedFiles", payload)
if (payload.type == "gcode") {
self.requestData();
}