summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorJoakim Reinert <mail@jreinert.com>2015-04-19 00:40:45 +0200
committerFlorian Pritz <bluewind@xinu.at>2015-05-05 12:21:27 +0200
commit645ac23ebea2ff1fe6f585a4f8fea27c3928be0e (patch)
tree48a7a74ef530fbb2004fce50115505259cce1177
parentfe68477d8b60bc9303dd2bcd542915ac05e3fac6 (diff)
Refactor tab width input
-rw-r--r--data/js/application.js5
-rw-r--r--data/js/script.js35
-rw-r--r--data/js/tabwidth-input.js37
-rw-r--r--data/js/util.js16
4 files changed, 57 insertions, 36 deletions
diff --git a/data/js/application.js b/data/js/application.js
index 3118f96bb..2ae412051 100644
--- a/data/js/application.js
+++ b/data/js/application.js
@@ -5,9 +5,10 @@ define(
'require',
'util',
'lexer-input',
+ 'tabwidth-input',
'vendor'
],
- function (require, Util, LexerInput) {
+ function (require, Util, LexerInput, TabwidthInput) {
require(['script']);
var App = {
// Gets called for every request (before page load)
@@ -21,6 +22,8 @@ define(
*/
onPageLoaded: function (config) {
Util.highlightLineFromHash();
+ Util.setTabwidthFromLocalStorage();
+ TabwidthInput.initialize();
LexerInput.initialize(config.lexers);
},
diff --git a/data/js/script.js b/data/js/script.js
index 242456971..242cf74de 100644
--- a/data/js/script.js
+++ b/data/js/script.js
@@ -1,40 +1,5 @@
(function($) {
$(function() {
- $('a.tabwidth-toggle').on('click', function (event) {
- setTimeout(function () {
- $(event.target).siblings('.dropdown-menu').find('input').trigger('focus');
- }, 0);
- });
-
- var setTabwidth = function (value) {
- value = value || 8;
- $('span.tabwidth-value').html(value);
- $('.tabwidth-form input').val(value);
- $('.highlight pre').css('tab-size', value);
- localStorage.setItem('tabwidth', value);
- };
-
- $(document).ready(function () {
- setTabwidth(localStorage.getItem('tabwidth'));
- });
-
- $('form.tabwidth-form').on('submit', function (event) {
- var value = $(event.target).find('input').val();
- setTabwidth(value);
- $(event.target).parents('.open').removeClass('open');
- event.preventDefault();
- });
-
- $('form.tabwidth-form input').on('change', function (event) {
- var value = $(event.target).val();
- setTabwidth(value);
- event.preventDefault();
- });
-
- $('form.tabwidth-form input').on('click', function (event) {
- event.stopImmediatePropagation();
- });
-
$('[rel="tooltip"]').tooltip({
placement: 'bottom',
container: 'body',
diff --git a/data/js/tabwidth-input.js b/data/js/tabwidth-input.js
new file mode 100644
index 000000000..62e2bb3f2
--- /dev/null
+++ b/data/js/tabwidth-input.js
@@ -0,0 +1,37 @@
+(function () {
+'use strict';
+define(['jquery', 'util'], function ($, Util) {
+ var PrivateFunctions = {
+ setupEvents: function () {
+ $('.tabwidth-toggle').on('click', _.bind(function (event) {
+ Util.focusDropdownInput(event.target);
+ }, Util));
+
+ $('form.tabwidth-form input').on('click', function (event) {
+ // Suppress blur event on dropdown toggle
+ event.stopImmediatePropagation();
+ });
+
+ $('form.tabwidth-form').on('submit', function (event) {
+ var value = $(event.target).find('input').val();
+ Util.setTabwidth(value);
+ $(event.target).parents('.open').removeClass('open');
+ event.preventDefault();
+ });
+
+ $('form.tabwidth-form input').on('change', function (event) {
+ var value = $(event.target).val();
+ Util.setTabwidth(value);
+ event.preventDefault();
+ });
+ }
+ };
+ var TabwidthInput = {
+ initialize: function () {
+ PrivateFunctions.setupEvents();
+ }
+ };
+
+ return TabwidthInput;
+});
+})();
diff --git a/data/js/util.js b/data/js/util.js
index 810bc4167..6c88edb2d 100644
--- a/data/js/util.js
+++ b/data/js/util.js
@@ -27,6 +27,22 @@ define(['jquery'], function () {
}
PrivateFunctions.highlightLine(hash);
+ },
+ focusDropdownInput: function (target) {
+ setTimeout(function () {
+ var dropDown = $(target).siblings('.dropdown-menu');
+ dropDown.find('input').trigger('focus');
+ }, 0);
+ },
+ setTabwidth: function (value) {
+ value = value || 8;
+ $('span.tabwidth-value').html(value);
+ $('.tabwidth-form input').val(value);
+ $('.highlight pre').css('tab-size', value);
+ localStorage.setItem('tabwidth', value);
+ },
+ setTabwidthFromLocalStorage: function () {
+ this.setTabwidth(localStorage.getItem('tabwidth'));
}
};
return Util;