mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity

Wrapped applicationSettings in FORM

Browse Source
This commit is contained in:
jdescottes 2015-02-23 00:32:34 +01:00
parent 8592cd2e53
commit 4f2f01ea36
2 changed files with 58 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/js/controller/settings/ApplicationSettingsController.js
View File

@ -38,6 +38,10 @@
var maxFpsInput = document.querySelector('.max-fps-input');
maxFpsInput.value = pskl.UserSettings.get(pskl.UserSettings.MAX_FPS);
this.addEventListener(maxFpsInput, 'change', this.onMaxFpsChange_);
// Form
this.applicationSettingsForm = document.querySelector('[name="application-settings-form"]');
this.addEventListener(this.applicationSettingsForm, 'submit', this.onFormSubmit_);
};
ns.ApplicationSettingsController.prototype.onGridWidthChange_ = function (evt) {
@ -72,4 +76,9 @@
}
};
ns.ApplicationSettingsController.prototype.onFormSubmit_ = function (evt) {
evt.preventDefault();
$.publish(Events.CLOSE_SETTINGS_DRAWER);
};
})();

94
src/templates/settings/application.html
View File

@ -1,51 +1,55 @@
<div class="settings-section">
<div class="settings-title">
General
</div>
<div class="settings-item">
<label>Background:</label>
<div class="background-picker-wrapper">
<div class="background-picker light-picker-background" data-background="light-canvas-background"
rel="tooltip" data-placement="bottom" title="light / high contrast">
</div>
<div class="background-picker medium-picker-background" data-background="medium-canvas-background"
rel="tooltip" data-placement="bottom" title="medium / high contrast">
</div>
<div class="background-picker lowcont-medium-picker-background" data-background="lowcont-medium-canvas-background"
rel="tooltip" data-placement="bottom" title="medium / low contrast">
</div>
<div class="background-picker lowcont-dark-picker-background" data-background="lowcont-dark-canvas-background"
rel="tooltip" data-placement="bottom" title="dark / low contrast">
<form action="" method="POST" name="application-settings-form">
<div class="settings-section">
<div class="settings-title">
General
</div>
<div class="settings-item">
<label>Background:</label>
<div class="background-picker-wrapper">
<div class="background-picker light-picker-background" data-background="light-canvas-background"
rel="tooltip" data-placement="bottom" title="light / high contrast">
</div>
<div class="background-picker medium-picker-background" data-background="medium-canvas-background"
rel="tooltip" data-placement="bottom" title="medium / high contrast">
</div>
<div class="background-picker lowcont-medium-picker-background" data-background="lowcont-medium-canvas-background"
rel="tooltip" data-placement="bottom" title="medium / low contrast">
</div>
<div class="background-picker lowcont-dark-picker-background" data-background="lowcont-dark-canvas-background"
rel="tooltip" data-placement="bottom" title="dark / low contrast">
</div>
</div>
</div>
</div>
<div class="settings-item">
<label for="grid-width">Grid :</label>
<select id="grid-width" class="grid-width-select">
<option value="0">Disabled</option>
<option value="1">1px</option>
<option value="2">2px</option>
<option value="3">3px</option>
<option value="4">4px</option>
</select>
</div>
</div>
<div class="settings-section">
<div class="settings-title">
Preview
<div class="settings-item">
<label for="grid-width">Grid :</label>
<select id="grid-width" class="grid-width-select">
<option value="0">Disabled</option>
<option value="1">1px</option>
<option value="2">2px</option>
<option value="3">3px</option>
<option value="4">4px</option>
</select>
</div>
</div>
<div class="settings-item">
<label>
<input type="checkbox" value="1" class="tiled-preview-checkbox" name="tiled-preview-checkbox"/>
Repeated preview
</label>
</div>
<div class="settings-section">
<div class="settings-title">
Preview
</div>
<div class="settings-item">
<label for="tiled-preview">Maximum FPS </label>
<input type="text" class="textfield textfield-small max-fps-input" name="max-fps"/>
</div>
</div>
<div class="settings-item">
<label>
<input type="checkbox" value="1" class="tiled-preview-checkbox" name="tiled-preview-checkbox"/>
Repeated preview
</label>
</div>
<div class="settings-item">
<label for="tiled-preview">Maximum FPS </label>
<input type="text" class="textfield textfield-small max-fps-input" name="max-fps"/>
</div>
<input type="submit" class="button button-primary" value="Save" />
</div>
</form>