From 61afa65d4e5e1ea908d90e45364fbb4e0bcfeb56 Mon Sep 17 00:00:00 2001
From: Luke Bennett <lukeeeebennettplus@gmail.com>
Date: Fri, 2 Sep 2016 19:42:42 +0100
Subject: Added soft wrap logic and button to editor

Added tests

Added awesomeeeeee icons
---
 app/assets/javascripts/blob_edit/edit_blob.js | 43 +++++++++++++++++++++++++++
 app/assets/stylesheets/pages/editor.scss      |  1 +
 2 files changed, 44 insertions(+)

(limited to 'app/assets')

diff --git a/app/assets/javascripts/blob_edit/edit_blob.js b/app/assets/javascripts/blob_edit/edit_blob.js
index b846bab0424..8f4a2c7ae84 100644
--- a/app/assets/javascripts/blob_edit/edit_blob.js
+++ b/app/assets/javascripts/blob_edit/edit_blob.js
@@ -22,6 +22,7 @@
       // submitted textarea
       })(this));
       this.initModePanesAndLinks();
+      this.initSoftWrap();
       new BlobLicenseSelectors({
         editor: this.editor
       });
@@ -50,6 +51,7 @@
       this.$editModePanes.hide();
       currentPane.fadeIn(200);
       if (paneId === "#preview") {
+        this.$toggleButton.hide();
         return $.post(currentLink.data("preview-url"), {
           content: this.editor.getValue()
         }, function(response) {
@@ -57,10 +59,51 @@
           return currentPane.syntaxHighlight();
         });
       } else {
+        this.$toggleButton.show();
         return this.editor.focus();
       }
     };
 
+    EditBlob.prototype.initSoftWrap = function() {
+      this.isExplicitySelected = false
+      this.$filePathInput = $('#file_path, #file_name');
+      this.$toggleButton = $('.soft-wrap-toggle');
+      this.$toggleText = $('span', this.$toggleButton);
+      this.$noWrapIcon = $('.no-wrap-icon', this.$toggleButton);
+      this.$softWrapIcon = $('.soft-wrap-icon', this.$toggleButton);
+      this.checkFilePathIsCode();
+      this.$filePathInput.on('keyup', _.debounce(this.checkFilePathIsCode.bind(this), 300));
+      this.$toggleButton.on('click', this.clickSoftWrapButton.bind(this));
+    };
+
+    EditBlob.prototype.toggleSoftWrap = function(forceToggle) {
+      if (_.isBoolean(forceToggle)) {
+        this.isSoftWrapped = forceToggle;
+      } else {
+        this.isSoftWrapped = !this.isSoftWrapped;
+      }
+      if(this.isSoftWrapped) {
+        this.$toggleText.text('No wrap');
+        this.$noWrapIcon.removeClass('hidden');
+        this.$softWrapIcon.addClass('hidden');
+      } else {
+        this.$toggleText.text('Soft wrap');
+        this.$softWrapIcon.removeClass('hidden');
+        this.$noWrapIcon.addClass('hidden');
+      }
+      this.editor.getSession().setUseWrapMode(this.isSoftWrapped);
+    };
+
+    EditBlob.prototype.checkFilePathIsCode = function() {
+      var isNotCode = /^(.*?\.(txt|md)|[^.]*?)$/i.test(this.$filePathInput.val());
+      if (!this.isExplicitySelected) this.toggleSoftWrap(isNotCode);
+    };
+
+    EditBlob.prototype.clickSoftWrapButton = function() {
+      if (!this.isExplicitySelected) this.isExplicitySelected = true;
+      this.toggleSoftWrap();
+    };
+
     return EditBlob;
 
   })();
diff --git a/app/assets/stylesheets/pages/editor.scss b/app/assets/stylesheets/pages/editor.scss
index 1aa4e06d975..ffd6089c100 100644
--- a/app/assets/stylesheets/pages/editor.scss
+++ b/app/assets/stylesheets/pages/editor.scss
@@ -59,6 +59,7 @@
   }
 
   .encoding-selector,
+  .soft-wrap-toggle,
   .license-selector,
   .gitignore-selector,
   .gitlab-ci-yml-selector {
-- 
cgit v1.2.1