<h3>{{ _('Machine Profiles') }}</h3>
<div id="laserCutterProfiles">
	
<table class="table table-striped table-hover table-condensed table-hover" id="settings_laserCutterProfiles_profiles">
    <thead>
    <tr>
        <th class="settings_printerProfiles_profiles_name">{{ _('Name') }}</th>
        <th class="settings_printerProfiles_profiles_model">{{ _('Model') }}</th>
        <th class="settings_printerProfiles_profiles_action">{{ _('Action') }}</th>
    </tr>
    </thead>
    <tbody data-bind="foreach: profiles.paginatedItems">
    <tr data-bind="attr: {title: name}">
        <td class="settings_printerProfiles_profiles_name" data-bind="click: function() { $root.makeDefault($data); }" style="cursor:pointer"><span class="icon-ok" data-bind="invisible: !isdefault()"></span> <span data-bind="text: name"></span></td>
        <td class="settings_printerProfiles_profiles_model" data-bind="text: model, click: function() { $root.makeDefault($data); }" style="cursor:pointer"></td>
        <td class="settings_printerProfiles_profiles_action">
<!--            <a href="#" class="icon-star" title="{{ _('Select profile') }}" data-bind="click: function() { $root.makeDefault($data); }"></a>&nbsp;|&nbsp;-->
			<a href="#" class="icon-pencil" title="{{ _('Edit Profile') }}" data-bind="css: {disabled:$root.isReadOnly($data)}, click: function() { if(!$root.isReadOnly($data)) $root.showEditProfileDialog($data); }"></a>&nbsp;|&nbsp;<a href="#" class="icon-trash" title="{{ _('Delete Profile') }}" data-bind="css: {disabled:$root.isReadOnly($data)}, click: function() { if(!$root.isReadOnly($data)) $root.removeProfile($data); }"></a>
        </td>
    </tr>
    </tbody>
</table>

<div class="pagination pagination-mini pagination-centered">
    <ul>
        <li data-bind="css: {disabled: profiles.currentPage() === 0}"><a href="#" data-bind="click: profiles.prevPage">«</a></li>
    </ul>
    <ul data-bind="foreach: profiles.pages">
        <li data-bind="css: { active: $data.number === $root.profiles.currentPage(), disabled: $data.number === -1 }"><a href="#" data-bind="text: $data.text, click: function() { $root.profiles.changePage($data.number); }"></a></li>
    </ul>
    <ul>
        <li data-bind="css: {disabled: profiles.currentPage() === profiles.lastPage()}"><a href="#" data-bind="click: profiles.nextPage">»</a></li>
    </ul>
</div>


<button class="btn pull-right" data-bind="click: function() { $root.showEditProfileDialog(); }">{{ _('Add Profile...') }}</button>

<div id="settings_laserCutterProfiles_editDialog" class="modal hide fade">
    <div class="modal-header">
        <a href="#" class="close" data-dismiss="modal" aria-hidden="true">&times;</a>
        <h3 class="modal-title"></h3>
    </div>
    <div class="modal-body">
        <form class="form-horizontal">
            <div class="control-group">
                <label class="control-label">{{ _('Name') }}</label>
                <div class="controls">
                    <input type="text" data-bind="value: editorName">
                </div>
            </div>
            <div class="control-group" style="display:none;">
                <label class="control-label">{{ _('Identifier') }}</label>
                <div class="controls">
                    <input type="hidden" data-bind="value: editorIdentifier, enable: $root.editorNew, css: {disabled: !$root.editorNew()}">
                </div>
            </div>
            <div class="control-group">
                <label class="control-label">{{ _('Model') }}</label>
                <div class="controls">
                    <input type="text" data-bind="value: editorModel">
                </div>
            </div>

            <div class="control-group">
                <label class="control-label">{{ _('Working Area Size') }}</label>
                <div class="controls form-inline">
                    <label>{{ _('X') }}</label>
                    <div class="input-append">
                        <input type="number" step="1" class="input-mini text-right" data-bind="value: editorVolumeWidth">
                        <span class="add-on">mm</span>
                    </div>
                </div>
                <div class="controls form-inline">
                    <label>{{ _('Y') }}</label>
                    <div class="input-append">
                        <input type="number" step="1" class="input-mini text-right" data-bind="value: editorVolumeDepth">
                        <span class="add-on">mm</span>
                    </div>
                </div>
<!--                <div class="controls form-inline">
                    <label>{{ _('Z') }}</label>
                    <div class="input-append">
                        <input type="number" step="0.01" class="input-mini text-right" data-bind="value: editorVolumeHeight">
                        <span class="add-on">mm</span>
                    </div>
                </div>-->
            </div>
            <div class="control-group">
                <label class="control-label">{{ _('Z-Axis') }}</label>
                <div class="controls">
                    <input type="checkbox" data-bind="checked: editorZAxis">
                </div>
            </div>
            <div class="control-group">
                <label class="control-label">{{ _('Axis') }}</label>
                <div class="controls form-inline">
                    <label>{{ _('X') }}</label>
                    <div class="input-append">
                        <input type="number" class="input-mini text-right" data-bind="value: editorAxisXSpeed">
                        <span class="add-on">mm/min</span>
                    </div>
                    <label class="checkbox">
                        <input type="checkbox" data-bind="checked: editorAxisXInverted"> {{ _('Invert control') }}
                    </label>
                </div>
                <div class="controls form-inline">
                    <label>{{ _('Y') }}</label>
                    <div class="input-append">
                        <input type="number" class="input-mini text-right" data-bind="value: editorAxisYSpeed">
                        <span class="add-on">mm/min</span>
                    </div>
                    <label class="checkbox">
                        <input type="checkbox" data-bind="checked: editorAxisYInverted"> {{ _('Invert control') }}
                    </label>
                </div>
                <div class="controls form-inline">
                    <label>{{ _('Z') }}</label>
                    <div class="input-append">
                        <input type="number" class="input-mini text-right" data-bind="value: editorAxisZSpeed">
                        <span class="add-on">mm/min</span>
                    </div>
                    <label class="checkbox">
                        <input type="checkbox" data-bind="checked: editorAxisZInverted"> {{ _('Invert control') }}
                    </label>
                </div>

            </div>
        </form>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">{{ _('Abort') }}</button>
        <button class="btn btn-primary btn-confirm">{{ _('Confirm') }}</button>
    </div>
</div>
</div>
