grab pictures from camera feature
This commit is contained in:
Teja
parent
9f1c277777
commit
84a90edd95
8 changed files with 137 additions and 39 deletions
|
|
@ -235,7 +235,7 @@ class SvgToGcodePlugin(octoprint.plugin.SlicerPlugin,
|
|||
|
||||
def get_assets(self):
|
||||
return dict(
|
||||
js=[ "js/convert.js", "js/working_area.js", "js/gcode_parser.js", "js/lib/snap.svg-min.js", "js/matrix_oven.js", "js/drag_scale_rotate.js"],
|
||||
js=[ "js/convert.js", "js/working_area.js", "js/gcode_parser.js", "js/lib/snap.svg-min.js", "js/lib/photobooth_min.js", "js/matrix_oven.js", "js/drag_scale_rotate.js"],
|
||||
less=["less/svgtogcode.less"],
|
||||
css=["css/svgtogcode.css", "css/mrbeam.css"]
|
||||
)
|
||||
|
|
|
|||
|
|
@ -85,3 +85,9 @@ svg text {
|
|||
font-size: large;
|
||||
padding-right: .5em;
|
||||
}
|
||||
|
||||
#photo_preview {
|
||||
width: 80vw;
|
||||
height: 70vh;
|
||||
margin: auto;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -392,7 +392,13 @@ $(function(){
|
|||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
self.placePhoto = function (dataUrl) {
|
||||
// upload
|
||||
|
||||
// place
|
||||
};
|
||||
|
||||
self.placeIMG = function (file) {
|
||||
var url = self._getIMGserveUrl(file);
|
||||
var img = new Image();
|
||||
|
|
|
|||
|
|
@ -603,6 +603,88 @@ $(function() {
|
|||
}, 1000);
|
||||
});
|
||||
|
||||
$('#take_photo_dialog').on('hide', function () {
|
||||
$('#photo_preview').data("photobooth").destroy();
|
||||
});
|
||||
|
||||
|
||||
$('#take_photo_dialog').on('shown', function () {
|
||||
$('#photo_preview').photobooth();
|
||||
var w = $('#photo_preview').width();
|
||||
var h = $('#photo_preview').height();
|
||||
$('#photo_preview').data('photobooth').resize(w, h);
|
||||
});
|
||||
|
||||
$('#photo_preview').on("image", function (event, dataUrl) {
|
||||
var photoBlob = self.dataUriToBlob(dataUrl);
|
||||
var t = new Date();
|
||||
var yyyy = t.getFullYear().toString();
|
||||
var mm = (t.getMonth()+1).toString(); // getMonth() is zero-based
|
||||
var dd = t.getDate().toString();
|
||||
var hh = t.getHours().toString();
|
||||
var m = t.getMinutes().toString();
|
||||
var date = yyyy + (mm[1]?mm:"0"+mm[0]) + (dd[1]?dd:"0"+dd[0]) + '_' + (hh[1]?hh:"0"+hh[0])+(m[1]?m:"0"+m[0]); // padding
|
||||
|
||||
var filename = "Photo_" + date + ".png";
|
||||
var data = new FormData();
|
||||
data.append('file', photoBlob, filename);
|
||||
|
||||
jQuery.ajax({
|
||||
url: API_BASEURL + "files/local",
|
||||
data: data,
|
||||
cache: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
type: 'POST',
|
||||
success: function(data, resp){
|
||||
gcode_upload_done(resp, {result: data});
|
||||
$('#take_photo_dialog').modal("hide");
|
||||
},
|
||||
fail: gcode_upload_fail,
|
||||
progressall: gcode_upload_progress
|
||||
});
|
||||
});
|
||||
|
||||
self.takePhoto = function () {
|
||||
$('#take_photo_dialog').modal("show");
|
||||
};
|
||||
|
||||
self.hasCamera = function () {
|
||||
var fGetUserMedia = (
|
||||
navigator.getUserMedia ||
|
||||
navigator.webkitGetUserMedia ||
|
||||
navigator.mozGetUserMedia ||
|
||||
navigator.oGetUserMedia ||
|
||||
navigator.msieGetUserMedia ||
|
||||
false
|
||||
);
|
||||
return !!fGetUserMedia;
|
||||
};
|
||||
|
||||
self.dataUriToBlob = function(dataURI) {
|
||||
// serialize the base64/URLEncoded data
|
||||
var byteString;
|
||||
if (dataURI.split(',')[0].indexOf('base64') >= 0) {
|
||||
byteString = atob(dataURI.split(',')[1]);
|
||||
}
|
||||
else {
|
||||
byteString = unescape(dataURI.split(',')[1]);
|
||||
}
|
||||
|
||||
// parse the mime type
|
||||
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
|
||||
|
||||
// construct a Blob of the image data
|
||||
var array = [];
|
||||
for (var i = 0; i < byteString.length; i++) {
|
||||
array.push(byteString.charCodeAt(i));
|
||||
}
|
||||
return new Blob(
|
||||
[new Uint8Array(array)],
|
||||
{type: mimeString}
|
||||
);
|
||||
};
|
||||
|
||||
self.requestData();
|
||||
};
|
||||
|
||||
|
|
|
|||
12
src/octoprint/templates/dialogs/take_photo.jinja2
Normal file
12
src/octoprint/templates/dialogs/take_photo.jinja2
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
<div id="take_photo_dialog" class="modal hide fade" >
|
||||
<div class="modal-header">
|
||||
<a href="#" class="close" data-dismiss="modal" aria-hidden="true">×</a>
|
||||
<h3>{{ _('Please smile') }}</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="photo_preview"></div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">{{ _('Cancel') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -15,27 +15,6 @@
|
|||
{% include 'initscript.jinja2' %}
|
||||
</head>
|
||||
<body>
|
||||
<!--<<<<<<< HEAD
|
||||
<div id="navbar" class="navbar navbar-static-top">
|
||||
<div class="navbar-inner" data-bind="css: appearance.color">
|
||||
<div class="container">
|
||||
<a class="brand" href="#"> <span xdata-bind="text: appearance.brand"></span></a>
|
||||
<div class="nav-collapse">
|
||||
Navbar
|
||||
<ul class="nav pull-right">
|
||||
{% for data in navbarEntries %}
|
||||
{% if "custom_bindings" not in data or data["custom_bindings"] %} ko allowBindings: false {% endif %}
|
||||
<li id="{{ data._div }}"
|
||||
{% if "data_bind" in data %}data-bind="{{ data.data_bind }}"{% endif %}
|
||||
{% if "classes" in data %}class="{{ data.classes|join(' ') }}"{% endif %}
|
||||
{% if "styles" in data %}style="{{ data.styles|join(', ') }}"{% endif %}
|
||||
>
|
||||
{% include data.template ignore missing %}
|
||||
</li>
|
||||
{% if "custom_bindings" not in data or data["custom_bindings"] %} /ko {% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
=======-->
|
||||
<div class="page-container">
|
||||
<div id="navbar" class="navbar navbar-static-top">
|
||||
<div class="navbar-inner" data-bind="css: appearanceClasses">
|
||||
|
|
@ -143,21 +122,6 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!--<<<<<<< HEAD
|
||||
<div class="footer">
|
||||
<ul class="pull-left muted">
|
||||
<li><small>{{ _('Version') }}: <span class="version">{{ display_version }}</span></small></li>
|
||||
</ul>
|
||||
<ul class="pull-right">
|
||||
<li><a href="http://www.mr-beam.org"><i class="icon-home"></i> {{ _('Homepage') }}</a></li>
|
||||
<li><a href="https://github.com/mrbeam/OctoPrint/"><i class="icon-download"></i> {{ _('Sourcecode') }}</a></li>
|
||||
<li><a href="https://wiki.mr-beam.org"><i class="icon-book"></i> {{ _('Documentation') }}</a></li>
|
||||
<li><a href="https://github.com/mrbeam/OctoPrint/issues"><i class="icon-flag"></i> {{ _('Bugs and Requests') }}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
=======
|
||||
>>>>>>> upstream/maintenance-->
|
||||
|
||||
<!-- Dialogs -->
|
||||
{% include 'dialogs/confirmation.jinja2' %}
|
||||
|
|
|
|||
|
|
@ -494,11 +494,16 @@
|
|||
<div style="display: none;" data-bind="visible: loginState.isUser">
|
||||
<div class="row-fluid upload-buttons">
|
||||
|
||||
<span class="btn btn-primary fileinput-button span12" data-bind="css: {disabled: !$root.loginState.isUser()}" style="margin-bottom: 10px">
|
||||
<span class="btn btn-primary fileinput-button " data-bind="css: {disabled: !$root.loginState.isUser(), span12: !hasCamera(), span8: hasCamera()}" style="margin-bottom: 10px">
|
||||
<i class="icon-upload-alt icon-white"></i>
|
||||
<span>{{ _('Upload') }}</span>
|
||||
<input id="gcode_upload" type="file" name="file" class="fileinput-button" data-bind="enable: loginState.isUser()">
|
||||
</span>
|
||||
<a class="btn btn-primary span4" href="#" role="button" data-bind="visible:hasCamera(), css: {disabled: !$root.loginState.isUser()}, click: takePhoto" >
|
||||
<i class="icon-camera icon-white"></i>
|
||||
<span>{{ _('Photo') }}</span>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
<div id="gcode_upload_progress" class="progress" style="width: 100%;">
|
||||
<div class="bar" style="width: 0%"></div>
|
||||
|
|
@ -715,6 +720,7 @@
|
|||
{#% include 'dialogs/settings.jinja2' %#}
|
||||
{% include 'dialogs/slicing.jinja2' %}
|
||||
{% include 'dialogs/usersettings.jinja2' %}
|
||||
{% include 'dialogs/take_photo.jinja2' %}
|
||||
<!-- End of dialogs -->
|
||||
|
||||
<!-- Overlays -->
|
||||
|
|
|
|||
Loading…
Reference in a new issue