pageflow 14.0.0 → 14.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 53b1ec3afc77304b2749528b6c1bb9d40cfd60716f653fa46a5d9693e721cddb
-  data.tar.gz: ccb398e3bb105e3315dac05230f55b693e3514bb3a94258a78bf4e59dc124310
+  metadata.gz: 26efef4a8054a381429f740caba05bcd9478e6051c513d122169851841f8075a
+  data.tar.gz: ad96598509d90638857b6434bff2f31cb83563a2291aba9adc40537415d86202
 SHA512:
-  metadata.gz: b242b3b3c2325e4285b8ef20463ff847ade31f42a53dd3b5c6b68894fd3d690780df0eaa662ed17bb60a8160f907c9042f28e4c524e8f577b097f91eb44fe0b3
-  data.tar.gz: d899b10166573a330b7568ce9a61fa784937677c74b96ab7e55cf25454bfd76fda71da56fd4ab28793406bd855f748cf3343b7b6c3b02e561b650aed5e679fb2
+  metadata.gz: e98f4d0a5071282045e89bc9ac92d4654d6868b974237e755d6b1206048791c30f5768830ba54aeafcb7c3991b7ae328ce4fe9fadf2495d6bc515c16cb357553
+  data.tar.gz: f3322825d98421689c84aba34d8a40113768f8bba6bacad5728b9748e48ae86689c56a73faadbee19d4017c4ce20c16a29dc002f74583e3eebb63032efbd02dc

data/CHANGELOG.md

@@ -1,98 +1,67 @@
 # CHANGELOG
 
-### Version 14.0.0
+  
+### Version 14.1.0
 
-2019-04-08
+2019-05-20
 
-[Compare changes](https://github.com/codevise/pageflow/compare/13-x-stable...v14.0.0)
-
-See
-[changes grouped by pre releases](https://github.com/codevise/pageflow/blob/v14.0.0.rc2/CHANGELOG.md).
+[Compare changes](https://github.com/codevise/pageflow/compare/14-0-stable...v14.1.0)
 
 #### Manual Update Steps
-
-- Direct upload to S3
-  ([#1076](https://github.com/codevise/pageflow/pull/1076))
-
-  Files are now uploaded directly to S3 from the browser. The
-  following steps need to be performed:
-
-  * Update CORS-config for S3 bucket as described in
-    [`doc/setting_up_external_services.md`](https://github.com/codevise/pageflow/blob/14-0-stable/doc/setting_up_external_services.md).
-
-  * `nginx-upload-module` is no longer supported since the requests to
-    create files no longer contain uploads. Corresponding Nginx
-    configuration for Pageflow endpoints needs to be removed. Check
-    whether the `paperclip-nginx-upload` io adapter is still needed.
-
-#### Breaking Changes for Pageflow Plugins
-
-- Page DOM layout change
-  ([#1135](https://github.com/codevise/pageflow/pull/1135),
-   [#1149](https://github.com/codevise/pageflow/pull/1149),
-   [#1148](https://github.com/codevise/pageflow/pull/1148))
-
-  Page headers are now have level 3 instead of level 2. There is a new
-  helper which is recommended to render the default page header and
-  content text.
-
-  ERB template based page types need to make the following changes to
-  CSS class names in their page templates:
-
-  * `blackLayer` -> `black_layer`
-  * `backgroundArea` -> `page_background`
-  * `contentWrapper` -> `content_wrapper`
-  * `videoWrapper` -> `uncropped_media_wrapper`
-
-  The default header and content snippet
-
-        <div class="page_header">
-          <h2>
-            <span class="tagline"><%= configuration['tagline'] %></span>
-            <span class="title"><%= configuration['title'] %></span>
-            <span class="subtitle"><%= configuration['subtitle'] %></span>
-          </h2>
-          <%= background_image_tag(configuration['background_image_id'], {class: "print_image"}) %>
-        </div>
-        <div class="contentText">
-          <p><%= raw configuration['text'] %></p>
-        </div>
-
-  should be replaced with the following helper call:
-
-        <%= page_default_content(page) %>
-
-- Direct upload to S3
-  ([#1132](https://github.com/codevise/pageflow/pull/1132),
-   [#1147](https://github.com/codevise/pageflow/pull/1147))
-
-  Files are now uploaded directly to S3 from the browser. The state
-  machine defined by `HostedFile` therefore no longer includes states
-  like `uploading_to_s3`. Files which are be in state
-  `uploading_to_s3_failed` have to be migrated to the
-  `uploading_failed` state. See the migrations inside the PR for
-  examples.
-
-#### Minor Changes
-
-- Structured data for videos, audios and background images
-  ([#1145](https://github.com/codevise/pageflow/pull/1145))
-- Change header structure to improve document outline
-  ([#1139](https://github.com/codevise/pageflow/pull/1139))
-- Allow passing custom query params for collection.create
-  ([#1136](https://github.com/codevise/pageflow/pull/1136))
-- Bug fix: Setup visited pages before resolving ready
-  ([#1144](https://github.com/codevise/pageflow/pull/1144))
-- Add shared specs to pageflow-support to lint page types
-  ([#1133](https://github.com/codevise/pageflow/pull/1133),
-   [#1146](https://github.com/codevise/pageflow/pull/1146))
-- Increase max length for page tagline, title and subtitles
-  ([#1131](https://github.com/codevise/pageflow/pull/1131))
-- Include text in navigation bar links
-  ([#1129](https://github.com/codevise/pageflow/pull/1129))
-- Update chromedriver-helper to fix travis build
-  ([#1140](https://github.com/codevise/pageflow/pull/1140))
-
+- Configurable sharing providers
+  ([#1142](https://github.com/codevise/pageflow/pull/1142))
+  
+  You can now configure which sharing providers should be enabled for your stories.
+  Default providers for new and existing stories can be set via the pageflow initializer:
+  ```
+  config.default_share_providers = [:facebook, :twitter, :email]
+  ```
+
+  To restrict the set of sharing providers you can also specify which ones should
+  be available to editors:
+  ``` 
+  config.available_share_providers = [:email, :facebook, :linked_in, :twitter, :telegram, :whats_app]
+  ```
+  By default all available providers are enabled.
+  
+  For custom themes the share icons can be styled via newly introduced  SCSS-variables:
+  
+  ```
+  $share-icon-color: #7D7D7D;
+  $share-icon-hover-color: #909090;
+  $share-icon-active-color: #FFC001;
+  ```
+
+- Remove paperclip_filesystem_root config
+  ([#1150](https://github.com/codevise/pageflow/pull/1150))
+  
+  Since uploads go directly to S3 via direct upload (signed post request)
+  the `paperclip_filesystem_root` configuration is now deprecated and can be removed
+  from the pageflow initializer. 
+
+#### Editor 
+- Add lists to WYSIHTML editor
+  ([#1156](https://github.com/codevise/pageflow/pull/1156))
+- Add option to link to other pages from page text
+  ([#1154](https://github.com/codevise/pageflow/pull/1154))
+- Bug fix: Prevent page styles from applying to editor elements
+  ([#1153](https://github.com/codevise/pageflow/pull/1153))
+  
+#### Published Entries
+- Reset background color in fullscreen Safari
+  ([#1159](https://github.com/codevise/pageflow/pull/1159))
+  
+#### Custom Themes
+- Add theme variable for title color
+  ([#1157](https://github.com/codevise/pageflow/pull/1157))
+  
+#### Internals
+- Add build-edge script
+  ([#1152](https://github.com/codevise/pageflow/pull/1152))
+- Fix spec for jbuilder 2.9
+  ([#1158](https://github.com/codevise/pageflow/pull/1158))
+  
+  
 See
-[13-x-stable branch](https://github.com/codevise/pageflow/blob/13-x-stable/CHANGELOG.md)
+[14-0-stable branch](https://github.com/codevise/pageflow/blob/14-0-stable/CHANGELOG.md)
 for previous changes.

data/admins/pageflow/accounts.rb

@@ -80,7 +80,10 @@ module Pageflow
 
       def new
         @account = Account.new
-        @account.build_default_theming(default_locale: current_user.locale)
+        @account.build_default_theming(
+          default_locale: current_user.locale,
+          share_providers: Pageflow.config.default_share_providers
+        )
       end
 
       def create
@@ -147,7 +150,8 @@ module Pageflow
           :default_author,
           :default_publisher,
           :default_keywords,
-          :default_locale
+          :default_locale,
+          share_providers: []
         ] +
           permitted_attributes_for(:theming)
       end

data/app/assets/javascripts/pageflow/dist/react-client.js

@@ -17823,7 +17823,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return _react2.default.createElement(
 	    'div',
 	    { className: className(props) },
-	    _react2.default.createElement('p', { dangerouslySetInnerHTML: text(props) }),
+	    _react2.default.createElement('div', { className: 'paragraph', dangerouslySetInnerHTML: text(props) }),
 	    props.children
 	  );
 	}

data/app/assets/javascripts/pageflow/dist/react-server.js

@@ -17817,7 +17817,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return _react2.default.createElement(
 	    'div',
 	    { className: className(props) },
-	    _react2.default.createElement('p', { dangerouslySetInnerHTML: text(props) }),
+	    _react2.default.createElement('div', { className: 'paragraph', dangerouslySetInnerHTML: text(props) }),
 	    props.children
 	  );
 	}

data/app/assets/javascripts/pageflow/editor/views/configuration_editors/groups/general.js

@@ -3,7 +3,10 @@ pageflow.ConfigurationEditorTabView.groups.define('general', function() {
   this.input('hide_title', pageflow.CheckBoxInputView);
   this.input('tagline', pageflow.TextInputView, {maxLength: 5000});
   this.input('subtitle', pageflow.TextInputView, {maxLength: 5000});
-  this.input('text', pageflow.TextAreaInputView);
+  this.input('text', pageflow.TextAreaInputView, {
+    fragmentLinkInputView: pageflow.PageLinkInputView,
+    enableLists: true
+  });
   this.input('text_position', pageflow.SelectInputView, {values: pageflow.Page.textPositions});
   this.input('gradient_opacity', pageflow.SliderInputView);
   this.input('invert', pageflow.CheckBoxInputView);

data/app/assets/javascripts/pageflow/editor/views/edit_meta_data_view.js

@@ -91,6 +91,10 @@ pageflow.EditMetaDataView = Backbone.Marionette.Layout.extend({
       this.input('share_url', pageflow.TextInputView, {
         placeholder: pageflow.entry.get('pretty_url')
       });
+      this.input('share_providers', pageflow.CheckBoxGroupInputView, {
+        values: pageflow.config.availableShareProviders,
+        translationKeyPrefix: 'activerecord.values.pageflow/entry.share_providers'
+      });
     });
 
     this.listenTo(entry.configuration, 'change:theme_name', function() {

data/app/assets/javascripts/pageflow/page_types/mixins/default_page_content.js

@@ -3,6 +3,6 @@ pageflow.defaultPageContent = {
     pageElement.find('.page_header-tagline').text(configuration.get('tagline') || '');
     pageElement.find('.page_header-title').text(configuration.get('title') || '');
     pageElement.find('.page_header-subtitle').text(configuration.get('subtitle') || '');
-    pageElement.find('.page_text p').html(configuration.get('text') || '');
+    pageElement.find('.page_text .paragraph').html(configuration.get('text') || '');
   }
 };

data/app/assets/javascripts/pageflow/slideshow/page_split_layout.js

@@ -32,7 +32,7 @@ pageflow.pageSplitLayout = (function() {
 
   function getContentClientRect(pageElement, pageClientRect) {
     var pageTitle = pageElement.find('.page_header-title');
-    var pageText = pageElement.find('.page_text p');
+    var pageText = pageElement.find('.page_text .paragraph');
 
     var pageTitleClientRect = pageTitle[0].getBoundingClientRect();
     var pageTextClientRect = pageText[0].getBoundingClientRect();

data/app/assets/javascripts/pageflow/slideshow/page_widget.js

@@ -214,8 +214,9 @@
 
     _setupContentLinkTargetHandling: function() {
       this._on({
-        'click .page_text p a': function(event) {
+        'click .page_text .paragraph a': function(event) {
           var href = $(event.currentTarget).attr('href');
+          var target = PAGEFLOW_EDITOR ? '_blank' : $(event.currentTarget).attr('target');
 
           if (href[0] === '#') {
             pageflow.slides.goToByPermaId(href.substr(1));
@@ -224,8 +225,8 @@
             // There was a time when the rich text editor did not add
             // target attributes to inline links even though it should
             // have. Ensure all content links to external urls open in
-            // new tab.
-            window.open(href, '_blank');
+            // new tab, except explicitly specified otherwise by editor.
+            window.open(href, target || '_blank');
           }
 
           event.preventDefault();

data/app/assets/javascripts/pageflow/ui.js

@@ -1,6 +1,6 @@
 //= require_self
 
-//= require wysihtml5x-toolbar
+//= require wysihtml-toolbar
 //= require jquery.minicolors
 
 //= require i18n

data/app/assets/javascripts/pageflow/ui/templates/inputs/check_box_group_input.jst.ejs

@@ -0,0 +1,5 @@
+<label>
+  <span class="name"></span>
+  <span class="inline_help"></span>
+</label>
+<div class="check_boxes_container" />

data/app/assets/javascripts/pageflow/ui/templates/inputs/text_area_input.jst.ejs

@@ -11,13 +11,52 @@
   <a data-wysihtml5-command="italic" title="<%= I18n.t('pageflow.ui.templates.inputs.text_area_input.italic') %>"></a>
   <a data-wysihtml5-command="underline" title="<%= I18n.t('pageflow.ui.templates.inputs.text_area_input.underline') %>"></a>
   <a data-wysihtml5-command="createLink" title="<%= I18n.t('pageflow.ui.templates.inputs.text_area_input.create_link') %>"></a>
+  <a data-wysihtml5-command="insertOrderedList" title="<%= I18n.t('pageflow.ui.templates.inputs.text_area_input.insert_ordered_list') %>"></a>
+  <a data-wysihtml5-command="insertUnorderedList" title="<%= I18n.t('pageflow.ui.templates.inputs.text_area_input.insert_unordered_list') %>"></a>
 
   <div data-wysihtml5-dialog="createLink" class="dialog" style="display: none;">
-    <label>
-        <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.url') %>:
-      <input data-wysihtml5-dialog-field="href" value="http://">
-    </label>
-    <a data-wysihtml5-dialog-action="save"><%= I18n.t('pageflow.ui.templates.inputs.text_area_input.ok') %></a>
-    <a data-wysihtml5-dialog-action="cancel"><%= I18n.t('pageflow.ui.templates.inputs.text_area_input.cancel') %></a>
+    <div class="link_type_select">
+      <label>
+        <input type="radio" name="link_type" class="url_link_radio_button">
+        <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.link_type.url') %>
+      </label>
+      <label>
+        <input type="radio" name="link_type" class="fragment_link_radio_button">
+        <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.link_type.page_link') %>
+      </label>
+    </div>
+    <div class="url_link_panel">
+      <label>
+        <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.target') %>
+      </label>
+      <input type="text" class="display_url">
+      <div class="open_in_new_tab_section">
+        <label>
+          <input type="checkbox" class="open_in_new_tab">
+          <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.open_in_new_tab') %>
+        </label>
+        <span class="inline_help">
+          <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.open_in_new_tab_help') %>
+        </span>
+      </div>
+    </div>
+    <div class="fragment_link_panel">
+      <!-- LinkInputView is inserted here -->
+    </div>
+
+    <!-- wysihtml5 does not handle hidden fields correctly -->
+    <div class="internal">
+      <input type="text" data-wysihtml5-dialog-field="href" class="current_url" value="http://">
+      <input type="text" data-wysihtml5-dialog-field="target" class="current_target" value="_blank">
+    </div>
+
+    <a class="button" data-wysihtml5-dialog-action="save">
+      <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.save') %>
+    </a>
+    <a class="button" data-wysihtml5-dialog-action="cancel">
+      <%= I18n.t('pageflow.ui.templates.inputs.text_area_input.cancel') %>
+    </a>
+
+    <a data-wysihtml5-command="removeLink"><%= I18n.t('pageflow.ui.templates.inputs.text_area_input.remove_link') %></a>
   </div>
 </div>

data/app/assets/javascripts/pageflow/ui/views/inputs/check_box_group_input_view.js

@@ -0,0 +1,75 @@
+/**
+ * Input view for attributes storing configuration hashes with boolean values.
+ *
+ * @see {@link module:pageflow/ui.pageflow.inputView pageflow.inputView} for further options
+ * @class
+ * @memberof module:pageflow/ui
+ */
+pageflow.CheckBoxGroupInputView = Backbone.Marionette.ItemView.extend({
+  mixins: [pageflow.inputView],
+
+  template: 'pageflow/ui/templates/inputs/check_box_group_input',
+  className: 'check_box_group_input',
+
+  events: {
+    'change': 'save'
+  },
+
+  ui: {
+    label: 'label',
+    container: '.check_boxes_container'
+  },
+
+  initialize: function() {
+    if (!this.options.texts) {
+      if (!this.options.translationKeys) {
+        var translationKeyPrefix = this.options.translationKeyPrefix ||
+          pageflow.i18nUtils.findKeyWithTranslation(this.attributeTranslationKeys('values', {
+            fallbackPrefix: 'activerecord.values'
+          }));
+
+        this.options.translationKeys = _.map(this.options.values, function(value) {
+          return translationKeyPrefix + '.' + value;
+        }, this);
+      }
+
+      this.options.texts = _.map(this.options.translationKeys, function(key) {
+        return I18n.t(key);
+      });
+    }
+  },
+
+  onRender: function() {
+    this.ui.label.attr('for', this.cid);
+    this.appendOptions();
+    this.load();
+    this.listenTo(this.model, 'change:' + this.options.propertyName, this.load);
+  },
+
+  appendOptions: function () {
+    _.each(this.options.values, function(value, index) {
+      var option = '<div class="check_box">'+
+                   '<label><input type="checkbox" name="'+value+'" />'+
+                   this.options.texts[index]+'</label></div>';
+      this.ui.container.append($(option));
+    }, this);
+  },
+
+  save: function() {
+    var configured = {};
+    _.each(this.ui.container.find('input'), function(input) {
+      configured[$(input).attr('name')] = $(input).prop('checked');
+    });
+    this.model.set(this.options.propertyName, configured);
+  },
+
+  load: function() {
+    if (!this.isClosed) {
+      _.each(this.options.values, function(value) {
+        this.ui.container
+          .find('input[name="'+value+'"]')
+          .prop('checked', this.model.get(this.options.propertyName)[value]);
+      }, this);
+    }
+  }
+});

data/app/assets/javascripts/pageflow/ui/views/inputs/text_area_input_view.js

@@ -12,6 +12,11 @@
  * @param {boolean} [options.disableRichtext=false]
  *   Do not provide text formatting options.
  *
+ * @param {Backbone.View} [options.fragmentLinkInputView]
+ *   A view to select an id to use in links which only consist
+ *   of a url fragment. Will receive a model with a `linkId`
+ *   attribute.
+ *
  * @see
  * {@link module:pageflow/ui.pageflow.inputWithPlaceholderText pageflow.inputWithPlaceholderText}
  * for placeholder related options
@@ -27,11 +32,30 @@ pageflow.TextAreaInputView = Backbone.Marionette.ItemView.extend({
 
   ui: {
     input: 'textarea',
-    toolbar: '.toolbar'
+    toolbar: '.toolbar',
+
+    urlInput: '.current_url',
+    targetInput: '.current_target',
+
+    linkTypeSelection: '.link_type_select',
+    urlLinkRadioButton: '.url_link_radio_button',
+    fragmentLinkRadioButton: '.fragment_link_radio_button',
+
+    urlLinkPanel: '.url_link_panel',
+    displayUrlInput: '.display_url',
+    openInNewTabCheckBox: '.open_in_new_tab',
+
+    fragmentLinkPanel: '.fragment_link_panel',
   },
 
   events: {
-    'change': 'save'
+    'change textarea': 'save',
+
+    'click .url_link_radio_button': 'showUrlLinkPanel',
+    'click .fragment_link_radio_button': 'showFragmentLinkPanel',
+
+    'change .open_in_new_tab': 'setTargetFromOpenInNewTabCheckBox',
+    'change .display_url': 'setUrlFromDisplayUrl'
   },
 
   onRender: function() {
@@ -49,15 +73,18 @@ pageflow.TextAreaInputView = Backbone.Marionette.ItemView.extend({
           u: {unwrap: this.options.disableRichtext ? 1 : 0},
           b: {unwrap: this.options.disableRichtext ? 1 : 0},
           i: {unwrap: this.options.disableRichtext ? 1 : 0},
+          ol: {unwrap: this.options.enableLists ? 0 : 1},
+          ul: {unwrap: this.options.enableLists ? 0 : 1},
+          li: {unwrap: this.options.enableLists ? 0 : 1},
           br: {},
           a: {
             unwrap: this.options.disableLinks ? 1 : 0,
             check_attributes: {
-              href: "href"
+              href: 'href',
+              target: 'any'
             },
             set_attributes: {
-              rel: "nofollow",
-              target: "_blank"
+              rel: 'nofollow'
             }
           }
         }
@@ -68,33 +95,119 @@ pageflow.TextAreaInputView = Backbone.Marionette.ItemView.extend({
       this.ui.toolbar.find('a[data-wysihtml5-command="bold"]').hide();
       this.ui.toolbar.find('a[data-wysihtml5-command="italic"]').hide();
       this.ui.toolbar.find('a[data-wysihtml5-command="underline"]').hide();
+      this.ui.toolbar.find('a[data-wysihtml5-command="insertOrderedList"]').hide();
+      this.ui.toolbar.find('a[data-wysihtml5-command="insertUnorderedList"]').hide();
+    }
+
+    if (!this.options.enableLists) {
+      this.ui.toolbar.find('a[data-wysihtml5-command="insertOrderedList"]').hide();
+      this.ui.toolbar.find('a[data-wysihtml5-command="insertUnorderedList"]').hide();
     }
+    
     if (this.options.disableLinks) {
       this.ui.toolbar.find('a[data-wysihtml5-command="createLink"]').hide();
     }
+    else {
+      this.setupUrlLinkPanel();
+      this.setupFragmentLinkPanel();
+    }
 
     this.editor.on('change', _.bind(this.save, this));
     this.editor.on('aftercommand:composer', _.bind(this.save, this));
   },
 
+  onClose: function() {
+    this.editor.fire('destroy:composer');
+  },
+
   save: function() {
     this.model.set(this.options.propertyName, this.editor.getValue());
   },
 
   load: function() {
     this.ui.input.val(this.model.get(this.options.propertyName));
+  },
+
+  setupUrlLinkPanel: function() {
+    this.editor.on('show:dialog', _.bind(function() {
+      var currentUrl = this.ui.urlInput.val();
+
+      if (currentUrl.startsWith('#')) {
+        this.ui.displayUrlInput.val('http://');
+        this.ui.openInNewTabCheckBox.prop('checked', true);
+      }
+      else {
+        this.ui.displayUrlInput.val(currentUrl);
+        this.ui.openInNewTabCheckBox.prop('checked', this.ui.targetInput.val() !== '_self');
+      }
+    }, this));
+  },
+
+  setupFragmentLinkPanel: function() {
+    if (this.options.fragmentLinkInputView) {
+      this.fragmentLinkModel = new Backbone.Model();
+
+      this.listenTo(this.fragmentLinkModel, 'change', function(model, options) {
+        if (!options.skipCurrentUrlUpdate) {
+          this.setInputsFromFragmentLinkModel();
+        }
+      });
+
+      this.editor.on('show:dialog', _.bind(function() {
+        var currentUrl = this.ui.urlInput.val();
+        var id = currentUrl.startsWith('#') ? currentUrl.substr(1) : null;
+
+        this.fragmentLinkModel.set('linkId', id, {skipCurrentUrlUpdate: true});
+        this.initLinkTypePanels(!id);
+      }, this));
+
+      var fragmentLinkInput = new this.options.fragmentLinkInputView({
+        model: this.fragmentLinkModel,
+        propertyName: 'linkId',
+        label: I18n.t('pageflow.ui.templates.inputs.text_area_input.target'),
+        hideUnsetButton: true
+      });
+
+      this.ui.fragmentLinkPanel.append(fragmentLinkInput.render().el);
+    }
+    else {
+      this.ui.linkTypeSelection.hide();
+      this.ui.fragmentLinkPanel.hide();
+    }
+  },
+
+  initLinkTypePanels: function(isUrlLink) {
+    if (isUrlLink) {
+      this.ui.urlLinkRadioButton.prop('checked', true);
+    }
+    else {
+      this.ui.fragmentLinkRadioButton.prop('checked', true);
+    }
+
+    this.ui.toolbar.toggleClass('fragment_link_panel_active', !isUrlLink);
+  },
+
+  showUrlLinkPanel: function() {
+    this.ui.toolbar.removeClass('fragment_link_panel_active');
+    this.setUrlFromDisplayUrl();
+    this.setTargetFromOpenInNewTabCheckBox();
+  },
+
+  showFragmentLinkPanel: function() {
+    this.ui.toolbar.addClass('fragment_link_panel_active');
+    this.setInputsFromFragmentLinkModel();
+  },
+
+  setInputsFromFragmentLinkModel: function() {
+    this.ui.urlInput.val('#' + (this.fragmentLinkModel.get('linkId') || ''));
+    this.ui.targetInput.val('_self');
+  },
+
+  setUrlFromDisplayUrl: function() {
+    this.ui.urlInput.val(this.ui.displayUrlInput.val());
+  },
+
+  setTargetFromOpenInNewTabCheckBox: function() {
+    this.ui.targetInput.val(this.ui.openInNewTabCheckBox.is(':checked') ? '_blank' : '_self');
   }
 });
-
-(function() {
-  var isIE11 = navigator.userAgent.indexOf("Trident") !== -1;
-  // This browser detections is copied from wysihtml5.
-  var isGecko = navigator.userAgent.indexOf("Gecko") !== -1 && navigator.userAgent.indexOf("KHTML") === -1;
-
-  wysihtml5.browser.insertsLineBreaksOnReturn = function() {
-    // Used to be only isGecko. Unfortunately IE 11 is detected as
-    // Gecko since it says "like Gecko" in its user agent. Make sure
-    // we really are not IE 11.
-    return isGecko && !isIE11;
-  };
-}());