browsercms-artirix 4.0.0.rc1.art4

data/app/assets/javascripts/cms/new_content_button.js

@@ -0,0 +1,27 @@
+//= require 'cms/namespace'
+
+Cms.NewContentButton = function() {
+
+};
+
+// Setting the 'New Page' path should update the global menu
+Cms.NewContentButton.prototype.addPagePath = function(path) {
+  $('#new-content-button').attr('href', path);
+  $('.add-page-button').attr('href', path);
+};
+
+Cms.NewContentButton.prototype.addSectionPath = function(path) {
+  $('.add-link-button').attr('href', path);
+};
+
+Cms.NewContentButton.prototype.addLinkPath = function(path) {
+  $('.add-section-button').attr('href', path);
+};
+
+Cms.NewContentButton.prototype.updateButtons = function(selectedElement) {
+  this.addPagePath(selectedElement.data('add-page-path'));
+  this.addLinkPath(selectedElement.data('add-link-path'));
+  this.addSectionPath(selectedElement.data('add-section-path'));
+};
+
+var newContentButton = new Cms.NewContentButton();

data/app/assets/javascripts/cms/page_editor.js

@@ -0,0 +1,189 @@
+//= require 'jquery'
+//= require 'jquery_ujs'
+//= require 'cms/core_library'
+//= require 'bootstrap/modal'
+//= require 'bcms/ckeditor'
+//= require 'bcms/ckeditor_inline'
+//= require 'cms/ajax'
+
+// Since we are within the page editing iframe, add a 'target=_top' to all links so they refresh the entire page.
+jQuery(function($){
+  $('a').attr('target', '_top');
+});
+
+jQuery(function($){
+  $.cms_editor = {
+    // Returns the widget that a user has currently selected.
+    // @return [JQuery.Element]
+    selectedElement: function() {
+      var editor = CKEDITOR.currentInstance;
+      return $(editor.element.$);
+    },
+    selectedConnector: function() {
+      var parents = $.cms_editor.selectedElement().parents();
+      return $.cms_editor.selectedElement().parents(".connector");
+    },
+    // Reload the parent window
+    reload: function() {
+      window.parent.location.reload();
+    },
+    deleteContent: function() {
+      var sc = $.cms_editor.selectedConnector();
+      var remove_path = sc.data('remove');
+      $.cms_ajax.delete({
+        url: remove_path,
+        success: function() {
+          sc.remove();
+        },
+        beforeSend: $.cms_ajax.asJSON()
+      });
+    },
+    // Move content up or down. Will save any updates (after moving).
+    //
+    // @param [String] direction 'move-up' or 'move-down'
+    moveContent: function(editor, direction) {
+      var reload = function() {
+        $.cms_editor.reload();
+      };
+      var path = $.cms_editor.selectedConnector().data(direction);
+      $.cms_ajax.put({
+        url: path,
+        success: function() {
+          if (editor.checkDirty()) {
+            $.cms_editor.saveChanges(editor, reload);
+          } else {
+            reload.apply();
+          }
+        }
+		//,beforeSend: $.cms_ajax.asJSON()
+      });
+
+    },
+    updatePageStatus: function(data) {
+      // Update the Page Status indicator
+      var status_label = $('#page-status-label', window.parent.document);
+      status_label.removeClass('draft published');
+      status_label.addClass(data.page_status);
+      status_label.html(data.status_label);
+
+      // Enable the Publish button (if the page is in draft)
+      if (data.page_status === 'draft-status') {
+        var publish_button = $('#publish_button', window.parent.document);
+        publish_button.removeClass('disabled');
+      }
+
+      // Update the paths for connectors, so that they can be moved after ending.
+      var connectors = $("[data-container='" + data.container + "'] .connector");
+      for(var i = 0; i < connectors.length; i++){
+        $(connectors[i]).attr('data-move-up', data.routes[i].move_up);
+        $(connectors[i]).attr('data-move-down', data.routes[i].move_down);
+        $(connectors[i]).attr('data-remove', data.routes[i].remove);
+      }
+
+      // Update Page Title
+      window.parent.document.title = data.page_title;
+    },
+    // Saves the changes using AJAX for the given editor.
+    //
+    // @param [CKEditor] editor
+    saveChanges: function(currentEditor, afterSave) {
+      var block_id = currentEditor.name;
+      var block = $("#" + block_id);
+      var attribute = block.data('attribute');
+      var content_name = block.data('content-name');
+      var container = block.parents('.cms-container').data('container');
+      // Ensure the selected content is not gone, or skip updating.
+      if (content_name == null) {
+        return;
+      }
+      var content_id = block.data('id');
+      var data = currentEditor.getData();
+      var message = {
+        page_id: block.data('page-id'),
+        container: container,
+        content: {}
+      };
+      message["content"][attribute] = data;
+      var path = '/cms/inline_content/' + content_id + "?content_name=" + content_name;
+
+      $.cms_ajax.put({
+        url: path,
+        success: function(data) {
+          $.cms_editor.updatePageStatus(data);
+          currentEditor.resetDirty();
+          if (afterSave) {
+            afterSave.apply();
+          }
+        },
+        data: message
+		//,beforeSend: $.cms_ajax.asJS()
+      });
+    }
+  };
+});
+
+// On Ready
+jQuery(function($){
+
+  // Click the 'Add Content' button (PLUS) when editing content.
+  $('.cms-add-content').click(function() {
+    $('#modal-add-content', window.parent.document).modal({
+      remote: $(this).data('remote')
+    });
+  });
+
+  CKEDITOR.disableAutoInline = true;
+
+  // Titles
+  $("#page_title").each(function() {
+    var id = $(this).attr('id');
+    CKEDITOR.inline(id, {
+      toolbar: 'page_title',
+      on: {
+        blur: function(event) {
+          $.cms_editor.saveChanges(event.editor);
+        }
+      }
+    });
+  });
+
+  // Create editors for each content-block on the page.
+  $(".content-block").each(function() {
+    var id = $(this).attr('id');
+    editor = CKEDITOR.inline(id, {
+      toolbar: 'inline',
+      on: {
+        blur: function(event) {
+          $.cms_editor.saveChanges(event.editor);
+        }
+      }
+    });
+
+  });
+
+
+  /* warn user on leaving if he changed text */
+//    var warn_on_leave = false;
+//    CKEDITOR.on('currentInstance', function () {
+//        try {
+//            CKEDITOR.currentInstance.on('key', function () {
+//                warn_on_leave = true;
+//            });
+//        } catch (err) {
+//        }
+//    });
+  // show no popup when user saves changes
+//    $(document.activeElement).submit(function () {
+//        warn_on_leave = false;
+//    });
+  // show popup
+//    $(window).bind('beforeunload', function () {
+//        if (CKEDITOR.currentInstance) { // Ensure there was actually an editor here.
+//            if (CKEDITOR.currentInstance.checkDirty()) {
+//                return "Unsaved changes."
+//            }
+//        }
+//
+//    });
+
+});

data/app/assets/javascripts/cms/page_toolbar.js

@@ -0,0 +1,13 @@
+//
+//  Required javascript for editing pages. Similar to toolbar.js, but adds additional features.
+//
+//= require jquery
+//= require jquery.ui.all
+//= require jquery.cookie
+//= require jquery.selectbox
+//= require jquery.exists
+//= require jquery.taglist
+//= require cms/core_library
+//= require cms/attachment_manager
+//= require bootstrap
+//= require cms/toolbar

data/app/assets/javascripts/cms/site.js

@@ -0,0 +1,2 @@
+// The public javascript functions that must be available to guest users.
+//= require 'cms/user'

data/app/assets/javascripts/cms/sitemap.js

@@ -0,0 +1,219 @@
+//= require 'jquery'
+//= require 'jquery.ui.all'
+//= require 'jquery.cookie'
+//= require 'bootstrap'
+//= require 'cms/ajax'
+//= require 'underscore'
+//= require 'cms/new_content_button'
+
+// Sitemap uses JQuery.Draggable/Droppable to handling moving elements, with custom code below.
+// Open/Close are handled as code below.
+var Sitemap = function() {
+};
+
+// Name of cookie that stores SectionNode ids that should be opened.
+Sitemap.STATE = 'cms.sitemap.open_folders';
+
+Sitemap.prototype.select = function(selectedRow) {
+  $('.nav-list-span').removeClass('active');
+  selectedRow.addClass('active');
+  newContentButton.updateButtons(selectedRow);
+};
+
+// Different Content types have different behaviors when double clicked.
+Sitemap.prototype._doubleClick = function(event) {
+  var type = $(event.target).data('type');
+  switch(type) {
+    case 'section':
+    case 'link':
+      $('#properties-button')[0].click();
+      break;
+    default:
+      $('#edit-button')[0].click();
+  }
+};
+
+// @param [Number] node_id
+// @param [Number] target_node_id
+// @param [Number] position A 1 based position for order
+Sitemap.prototype.moveTo = function(node_id, target_node_id, position) {
+  var path = "/cms/section_nodes/" + node_id + '/move_to_position'
+  $.cms_ajax.put({
+    url: path,
+    data: {
+      target_node_id: target_node_id,
+      position: position
+    },
+    success: function(result) {
+      //console.log(result);
+    }
+  });
+};
+
+// @param [Selector] Determines if a section is open.
+Sitemap.prototype.isOpen = function(row) {
+  return row.find('.type-icon').hasClass('icon-folder-open');
+};
+
+// @param [Selector] link A selected link (<a>)
+// @param [String] icon The full name of the icon (icon-folder-open)
+Sitemap.prototype.changeIcon = function(row, icon) {
+  row.find('.type-icon').attr('class', 'type-icon').addClass(icon);
+};
+
+// @param [Number] id
+Sitemap.prototype.saveAsOpened = function(id) {
+  $.cookieSet.add(Sitemap.STATE, id);
+};
+
+// @param [Number] id
+Sitemap.prototype.saveAsClosed = function(id) {
+  $.cookieSet.remove(Sitemap.STATE, id);
+};
+
+// Reopen all sections that the user was last working with.
+Sitemap.prototype.restoreOpenState = function() {
+  var section_node_ids = $.cookieSet.get(Sitemap.STATE);
+  _.each(section_node_ids, function(id) {
+    var row = $('.nav-list-span[data-id=' + id + ']');
+    sitemap.open(row, {animate: false});
+  });
+};
+
+// Determines if the selected row is a Folder or not.
+Sitemap.prototype.isFolder = function(row) {
+  return row.data('type') == 'folder';
+};
+
+Sitemap.prototype.isClosable = function(row) {
+  return row.data('closable') == true;
+};
+
+// @param [Selector] link
+// @param [Object] options
+Sitemap.prototype.open = function(row, options) {
+  options = options || {}
+  _.defaults(options, {animate: true});
+  this.changeIcon(row, 'icon-folder-open');
+  var siblings = row.siblings('.children');
+  if (options.animate) {
+    siblings.slideToggle();
+  }
+  else {
+    siblings.show();
+  }
+  this.saveAsOpened(row.data('id'));
+};
+
+// Attempts to open the given row. Will skip if the item cannot or is already open.
+Sitemap.prototype.attemptOpen = function(row, options) {
+  if (this.isClosable(row) && !this.isOpen(row)) {
+    this.open(row, options);
+  }
+};
+
+Sitemap.prototype.close = function(row) {
+  this.changeIcon(row, 'icon-folder');
+  row.siblings('.children').slideToggle();
+  this.saveAsClosed(row.data('id'));
+};
+
+Sitemap.prototype.toggleOpen = function(row) {
+  if (!this.isClosable(row)) {
+    return;
+  }
+  if (this.isOpen(row)) {
+    this.close(row);
+  } else {
+    this.open(row);
+  }
+};
+
+Sitemap.prototype.updateDepth = function(element, newDepth) {
+  var depthClass = "level-" + newDepth;
+  element.attr('class', 'ui-draggable ui-droppable nav-list-span').addClass(depthClass);
+  element.attr('data-depth', newDepth);
+};
+
+var sitemap = new Sitemap();
+
+// Enable dragging of items around the sitemap.
+jQuery(function($){
+  if ($('#sitemap').exists()) {
+
+    $('#sitemap .draggable').draggable({
+      containment: '#sitemap',
+      revert: true,
+      revertDuration: 0,
+      axis: 'y',
+      delay: 250,
+      cursor: 'move',
+      stack: '.nav-list-span'
+    });
+
+    $('#sitemap .nav-list-span').droppable({
+      hoverClass: "droppable",
+      drop: function(event, ui) {
+        var elementToMove = ui.draggable.parents('.nav-list').first();
+        var elementDroppedOn = $(this).parents('.nav-list').first();
+        var targetDepth = $(this).data('depth');
+
+
+        if (sitemap.isFolder($(this))) {
+          // Drop INTO sections
+          sitemap.attemptOpen($(this));
+          sitemap.updateDepth(ui.draggable, targetDepth + 1);
+          elementDroppedOn.find('li').first().append(elementToMove);
+          var newParentId = $(this).data('id');
+        } else {
+          sitemap.updateDepth(ui.draggable, targetDepth);
+          // Drop AFTER pages
+          var newParentId = elementDroppedOn.parents('.nav-list:first').find('.nav-list-span:first').data('id');
+          elementToMove.insertAfter(elementDroppedOn);
+        }
+
+        // Move item on server
+        var nodeIdToMove = ui.draggable.data('id');
+        var newPosition = elementToMove.index();
+        console.log("Move section_node", nodeIdToMove, " to parent:", newParentId, 'at position', newPosition);
+        sitemap.moveTo(nodeIdToMove, newParentId, newPosition);
+
+        // Need a manual delay otherwise the animation happens before the insert.
+        window.setTimeout(function() {
+          ui.draggable.effect({effect: 'highlight', duration: 500, color: '#0079c1'});
+        }, 250);
+      }
+    });
+  }
+});
+
+// Open/close folders when rows are clicked.
+jQuery(function($){
+  // Ensure this only loads on sitemap page.
+  if ($('#sitemap').exists()) {
+    sitemap.restoreOpenState();
+    $('.nav-list-span').on('click', function(event) {
+      sitemap.toggleOpen($(this));
+      sitemap.select($(this));
+    });
+  }
+
+});
+
+// Make Sitemap filters show specific content types.
+jQuery(function($){
+  $('#sitemap li[data-nodetype]').hide();
+  $('#filtershow').change(function() {
+    $('#sitemap li[data-nodetype]').slideUp();
+    var what = $(this).val();
+    if (what == "none") {
+      $('#sitemap li[data-nodetype]').slideUp();
+    } else if (what == "all") {
+      $('#sitemap li[data-nodetype]').slideDown();
+      $('#sitemap li[data-nodetype]').parents('li').children('a[data-toggle]').click();
+    } else {
+      $('#sitemap li[data-nodetype="' + what + '"]').slideDown();
+      $('#sitemap li[data-nodetype="' + what + '"]').parents('li').children('a[data-toggle]').click();
+    }
+  });
+});

data/app/assets/javascripts/cms/toolbar.js

@@ -0,0 +1,21 @@
+//
+//  A manifest file for all CMS toolbar related js.
+//= require jquery
+//= require jquery.ui.all
+//= require jquery.cookie
+//= require jquery.selectbox
+//= require jquery.exists
+//= require jquery.taglist
+//= require cms/core_library
+//= require cms/attachment_manager
+//= require bootstrap
+//= require cms/ajax
+
+
+// Add an information popup to the Edit Properties button on the Page Toolbar
+$(function () {
+    $('#edit_properties_button').popover({placement:'bottom'});
+});
+
+
+

data/app/assets/javascripts/cms/user.js

@@ -0,0 +1,40 @@
+//= require 'jquery.exists'
+//= require 'cms/namespace'
+
+Cms.User = function() {
+};
+
+// Find the current user and then take action based on whether the current user is authenticated or not.
+// @todo - Avoid repeated AJAX calls to find the user if this is involved multiple times.
+//
+// @param [ObjectLiteral] options
+// @option options [Function] :authenticated Call for authenticated users.
+// @option options [Function] :guest (Optional) Call for guests.
+//
+// @example  Cms.User.current({
+//    authenticated: function(user){ alert("Hello " + user.first_name);
+// }); 
+Cms.User.current = function(handler) {
+  $.getJSON('/cms/user.json', function(user) {
+//    console.log("current_user", user);
+    if (user.is_logged_in) {
+      handler.authenticated(user);
+    } else if (handler.guest) {
+      handler.guest(user);
+    }
+  });
+};
+
+// Default Handler for login portlet. Hide the form, show 'Hello $full_name'
+jQuery(function($){
+  if ($('.login-portlet').exists()) {
+    Cms.User.current({
+        authenticated: function(user) {
+          $('.authenticated').show().find('.user-name').html(user.full_name);
+          $('.guest').hide();
+        }
+      }
+    );
+  }
+});
+

data/app/assets/javascripts/jquery.exists.js

@@ -0,0 +1,5 @@
+// Determine if an element exists.
+//  i.e. if($('.some-class').exists()){ // do something }
+jQuery.fn.exists = function() {
+  return this.length > 0;
+};

data/app/assets/javascripts/jquery.taglist.js

@@ -0,0 +1,157 @@
+/*
+  jQuery taglist plugin
+
+  Defines a widget for allowing users to selecting tags in BrowserCMS. This is part of the BrowserCMS core project.
+
+  Please see the accompanying LICENSE.txt for licensing information.
+*/
+(function($){
+  $.fn.tagList = function(tags) {
+    var tagListInput = this;
+    var tagSeparator = " ";
+
+    var getTagList = function() {
+      return $('#'+$(tagListInput).attr('id')+'-tag-list');
+    }
+
+    var getCurrentTag = function() {
+      var value = $(tagListInput).val();
+      if(value == "" || value.match(/\s$/)) {
+        return ""
+      } else {
+        var tags = value.split(tagSeparator)
+        return tags[tags.length-1]
+      }
+    }
+
+    var getSelectedTag = function() {
+      return getTagList().find('li.selected')
+    }
+
+    var getFirstTag = function() {
+      return getTagList().find('li:first')
+    }
+
+    var positionAndSizeTagList = function() {
+      getTagList().css('top', $(tagListInput).offset().top+$(tagListInput).outerHeight())
+        .css('left', $(tagListInput).offset().left)
+        .css('width', $(tagListInput).outerWidth())
+    }
+
+    var createEmptyTagList = function() {
+      var id = $(tagListInput).attr('id') + '-tag-list';
+      $(tagListInput).after('<ul id="'+id+'" class="tag-list" style="display: none"></ul>')
+      positionAndSizeTagList()
+    }
+
+    var matchesInputValue = function(tag, value) {
+      return tag && value && (tag.toLowerCase().indexOf(value.toLowerCase()) == 0);
+    }
+
+    var showTagList = function(value) {
+      var html = []
+      $.each(tags, function(i, tag){
+        if(matchesInputValue(tag, value)) {
+          html.push('<li>'+tag+'</li>');
+        }
+      })
+      getTagList().html(html.join("\n")).show()
+      getTagList().find('li').click(function(){
+        selectTag(this);
+        acceptTag();
+        return false;
+      });
+    }
+
+    var updateTagList = function() {
+      var value = getCurrentTag()
+      if(value && value != "") {
+        showTagList(value)
+      } else {
+        getTagList().hide();
+      }
+    }
+
+    var handleNavKeys = function(event) {
+      switch(event.keyCode) {
+        case 38: //Up Arrow
+          selectPrevTag()
+          return false
+          break;
+        case 40: //Down Arrow
+          selectNextTag()
+          return false
+          break;
+        case 9: //Tab
+        case 13: //Return
+          return !getTagList().is(':visible') || acceptTag();
+      }
+    }
+
+    var handleInput = function(event) {
+      switch(event.keyCode) {
+        case 9:
+        case 13:
+        case 38:
+        case 40:
+          break;
+        default:
+          updateTagList();
+      }
+    }
+
+    var selectTag = function(tag) {
+      getTagList().find('li').removeClass('selected')
+      $(tag).addClass('selected')
+    }
+
+    var selectPrevTag = function() {
+      if(getSelectedTag().length > 0 && getSelectedTag().prev().length > 0) {
+        selectTag(getSelectedTag().prev())
+      } else {
+        selectTag(getFirstTag())
+      }
+    }
+
+    var selectNextTag = function() {
+      if(getSelectedTag().length > 0 && getSelectedTag().next().length > 0) {
+        selectTag(getSelectedTag().next())
+      } else {
+        selectTag(getFirstTag())
+      }
+    }
+
+    var acceptTag = function() {
+      if(getSelectedTag().length == 0) {
+        if(getTagList().find('li').length > 0) {
+          selectTag(getFirstTag())
+        } else {
+          return true;
+        }
+      }
+      var tags = $(tagListInput).val().split(tagSeparator)
+      tags.pop()
+      tags.push(getSelectedTag().text())
+      $(tagListInput).val(tags.join(tagSeparator))
+      getTagList().hide()
+      return false;
+    }
+
+    createEmptyTagList()
+    $(this).keydown(handleNavKeys).keyup(handleInput)
+    $(this).blur(function(){getTagList().fadeOut(200)})
+  }
+})(jQuery);
+
+// Autosuggest for tags
+$(function(){
+  if($(".tag_list").exists()){
+    $.ajax({
+      url: '/cms/tags',
+      dataType: 'json',
+      success: function(data){
+        $('input.tag_list').tagList(data);
+      }
+    });
+  }
+});