explanations for the conversion popup.

This commit is contained in:
Teja 2015-08-16 13:58:10 +02:00
parent 86570f7e4d
commit 236d2cd7fc
3 changed files with 69 additions and 3 deletions

View file

@ -73,3 +73,15 @@ svg text {
color: #999;
font-size: smaller;
}
#dialog_vector_graphics_conversion .hint {
font-style: italic;
font-size: smaller;
margin-top: 4px;
background-color: #fafafa;
}
#dialog_vector_graphics_conversion .hint .icon {
font-size: large;
padding-right: .5em;
}

View file

@ -24,6 +24,7 @@ $(function(){
self.defaultProfile = undefined;
// expert settings
self.showHints = ko.observable(false);
self.showExpertSettings = ko.observable(false);
self.gcodeFilename = ko.observable();
self.pierceTime = ko.observable(0);

View file

@ -16,6 +16,12 @@
<input id="svgtogcode_intensity" class="slider_manual_input" type="text" data-bind="value: laserIntensity, valueUpdate: 'keyup'">
</div>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Sets the intensity of the laser. The more intensity the deeper the effect on the material.
Cutting needs higher intensities than engraving.
The effect in general is dependent from the material and its color and surface.
</div>
</div>
<div class="control-group">
<label class="control-label">{{ _('Speed') }} (<span data-bind="text: minSpeed">20</span> - <span data-bind="text: maxSpeed">3000</span>)</label>
@ -25,7 +31,14 @@
<input id="svgtogcode_feedrate" class="slider_manual_input" type="text" data-bind="value: laserSpeed, valueUpdate: 'keyup'">
</div>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Sets the velocity of the laserhead. The slower the movement the deeper the effect on the material.
Cutting needs slower movement than engraving.
The effect in general is dependent from the material and its color and surface.
</div>
</div>
<div class="control-group" data-bind="visible: showExpertSettings ">
<label class="control-label">{{ _('Pierce Time (ms)') }} </label>
<div class="controls">
@ -33,6 +46,12 @@
<input type="text" data-bind="value: pierceTime">
</div>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Some (especially bright) materials require the laser to dwell a little until the surface has absorbed enough energy to be affected.
This parameter sets the amount of time in milliseconds the movement is paused after the laser is switched on.
If the result shows gaps in lines for example increase this value carefully. The higher the value the higher the risk of material ignition.
</div>
</div>
</div>
@ -47,6 +66,11 @@
<input id="svgtogcode_img_intensity_black" class="img_intensity_input" type="number" min="0" max="1000" data-bind="value: imgIntensityBlack">
</div>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
The intensity range used for engraving pixel graphics. Bright/white pixels use the left (lower) value, dark/black pixels the right (higher) value.
Equal values do not vary the laser intensity related to the pixel brightness.
</div>
<label class="control-label">{{ _('Engraving speed') }}</label>
<div class="controls">
@ -56,14 +80,26 @@
<input id="svgtogcode_img_feedrate_black" class="img_intensity_input" type="number" min="30" data-bind="value: imgFeedrateBlack">
</div>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
The movement velocity range used for engraving pixel graphics. Bright/white pixels use the left (higher) value, dark/black pixels the right (lower) value.
Equal values do not vary the laser velocity related to the pixel brightness.
</div>
</div>
<div class="control-group" data-bind="visible: showExpertSettings">
<label class="control-label">{{ _('Line distance') }}</label>
<div class="controls">
<div class="input-append">
<input id="svgtogcode_img_feedrate_white" class="img_intensity_input" type="number" max="0.5" min="0.1" step="0.05" data-bind="value: beamDiameter">mm
<input id="svgtogcode_img_line_dist" class="img_intensity_input" type="number" max="0.5" min="0.1" step="0.05" data-bind="value: beamDiameter">mm
</div>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Pixel / raster engravings are done line by line. This sets the distance between the single lines.
Smaller values allow finer engravings but require a more precise focus and are slower.
</div>
<p >{{ _('Image Preprocessing') }}</p>
<div class="controls">
@ -83,12 +119,20 @@
<input id="svgtogcode_contrast_slider" type="text" data-bind="value: imgContrast" >
</div>
<div style="clear:both"></div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Increases the image contrast before converting to gcode.
</div>
<label class="control-label">{{ _('Sharpening') }}</label>
<div class="controls img_slider">
<input id="svgtogcode_sharpening_slider" class="uninitialized" type="text" data-bind="value: imgSharpening">
</div>
<div style="clear:both"></div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Sharpens the image before converting to gcode.
</div>
</div>
<label class="control-label">{{ _('Dithering') }}</label>
@ -97,6 +141,12 @@
<input type="checkbox" data-bind="checked: imgDithering">{{ _('Dithering') }}
</label>
</div>
<div class="controls alert alert-info hint" data-bind="visible: showHints">
<span class="icon icon-question-sign" aria-hidden="true"></span>
Converts the image to solely black and white pixels.
Use this if the laser effect on your material is not able to transfer grayscales.
</div>
</div>
</div>
@ -117,10 +167,13 @@
</div>
</div>
<div class="modal-footer">
<div class="pull-left">
<div class="pull-left" style="text-align:left;">
<label class="checkbox">
<input type="checkbox" data-bind="checked: showExpertSettings">show advanced settings
</label>
<label class="checkbox">
<input type="checkbox" data-bind="checked: showHints">show explanations
</label>
</div>
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">{{ _('Cancel') }}</a>