adapt-authoring-ui 0.0.1

package/app/modules/contextMenu/views/contextMenuView.js

@@ -0,0 +1,76 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Backbone = require('backbone');
+  var Origin = require('core/origin');
+  var ContextMenuItemView = require('./contextMenuItemView');
+
+  var ContextMenuView = Backbone.View.extend({
+    className: 'context-menu',
+    contextView : {},
+
+    initialize: function() {
+      this._isVisible = false;
+      this.listenTo(Origin, {
+        'contextMenu:open': this.toggleMenu,
+        'contextMenu:closeContextMenu remove remove:views': this.hideMenu
+      });
+      $('html').click(_.bind(this.hideMenu, this));
+      this.render();
+    },
+
+    render: function() {
+      var template = Handlebars.templates['contextMenu'];
+      $(this.el).html(template).appendTo('body');
+      return this;
+    },
+
+    renderItems: function() {
+      this.$('.context-menu-holder').empty();
+      Origin.trigger('contextMenu:empty');
+
+      _.each(this.collection.where({ type: this.type }), function(item) {
+        item.set('contextView', this.contextView);
+        new ContextMenuItemView({ model: item });
+      }, this);
+    },
+
+    toggleMenu: function(view, e) {
+      var isSameType = view && (view.model.get('_type')) === (this.contextView.model && this.contextView.model.get('_type'));
+      var isSameModel = view && (view.model.get('_id')) === (this.contextView.model && this.contextView.model.get('_id'));
+      var isSameView = view.cid === this.contextView.cid; // to make sure we don't break listeners
+      // new view, update the menu items
+      if(!isSameType || !isSameModel || !isSameView) {
+        this.setMenu(view, $(e.currentTarget));
+        return this.showMenu();
+      }
+      (this._isVisible) ? this.hideMenu() : this.showMenu();
+    },
+
+    setMenu: function(view, $parent) {
+      this.contextView = view;
+      this.type = view.model.get('_type');
+
+      this.renderItems();
+
+      this.$el.css({
+        position: 'absolute',
+        left: $parent.offset().left + $parent.width() + 10,
+        top: $parent.offset().top - ($parent.height()/2)
+      });
+    },
+
+    showMenu: function() {
+      this.$el.removeClass('display-none');
+      this._isVisible = true;
+      Origin.trigger('contextMenu:opened');
+    },
+
+    hideMenu: function() {
+      this.$el.addClass('display-none');
+      this._isVisible = false;
+      Origin.trigger('contextMenu:closed');
+    },
+  });
+
+  return ContextMenuView;
+});

package/app/modules/editor/article/index.js

@@ -0,0 +1,18 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var EditorArticleEditSidebarView = require('./views/editorArticleEditSidebarView');
+  var EditorArticleEditView = require('./views/editorArticleEditView');
+  var Helpers = require('../global/helpers');
+  var Origin = require('core/origin');
+
+  Origin.on('editor:article', async function(data) {
+    if(data.action !== 'edit') {
+      return;
+    }
+    var model = Origin.editor.data.content.findWhere({ _id: data.id });
+    var form = await Origin.scaffold.buildForm({ model });
+    Helpers.setPageTitle(model);
+    Origin.sidebar.addView(new EditorArticleEditSidebarView({ model, form }).$el);
+    Origin.contentPane.setView(EditorArticleEditView, { model, form });
+  });
+});

package/app/modules/editor/article/templates/editorArticleEdit.hbs

@@ -0,0 +1,2 @@
+<div class="article-edit-inner form-container">
+</div>

package/app/modules/editor/article/templates/editorArticleEditSidebar.hbs

@@ -0,0 +1,19 @@
+<div class="sidebar-item-inner">
+{{!--     <div class="sidebar-row sidebar-item-title">
+        <h2 class="sidebar-item-title-inner">
+            Article Edit
+        </h2>
+    </div> --}}
+    <div class="separator"></div>
+    <button class="editor-article-edit-sidebar-save action-primary">
+        <span class="editor-article-edit-sidebar-save-inner">
+            {{!-- <i class="fa fa-save"></i> --}}{{t 'app.save'}}
+        </span>
+    </button>
+    <button class="editor-article-edit-sidebar-cancel action-secondary">
+        <span class="editor-article-edit-sidebar-cancel-inner">
+            {{!-- <i class="fa fa-close"></i> --}}{{t 'app.cancel'}}
+        </span>
+    </button>
+    <div class="separator"></div>
+</div>

package/app/modules/editor/article/views/editorArticleEditSidebarView.js

@@ -0,0 +1,32 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Backbone = require('backbone');
+  var Origin = require('core/origin');
+  var SidebarItemView = require('modules/sidebar/views/sidebarItemView');
+
+  var EditorArticleEditSidebarView = SidebarItemView.extend({
+    events: {
+      'click .editor-article-edit-sidebar-save': 'saveEditing',
+      'click .editor-article-edit-sidebar-cancel': 'cancelEditing'
+    },
+
+    postRender: function() {
+
+    },
+
+    saveEditing: function(event) {
+      event && event.preventDefault();
+      this.updateButton('.editor-article-edit-sidebar-save', Origin.l10n.t('app.saving'));
+      Origin.trigger('editorArticleEditSidebar:views:save');
+    },
+
+    cancelEditing: function(event) {
+      event && event.preventDefault();
+      Backbone.history.history.back();
+    }
+  }, {
+    template: 'editorArticleEditSidebar'
+  });
+
+  return EditorArticleEditSidebarView;
+});

package/app/modules/editor/article/views/editorArticleEditView.js

@@ -0,0 +1,19 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Backbone = require('backbone');
+  var Origin = require('core/origin');
+  var EditorOriginView = require('../../global/views/editorOriginView');
+
+  var EditorArticleEditView = EditorOriginView.extend({
+    className: "article-edit",
+    tagName: "div",
+
+    preRender: function() {
+      this.listenTo(Origin, 'editorArticleEditSidebar:views:save', this.save);
+    }
+  }, {
+    template: 'editorArticleEdit'
+  });
+
+  return EditorArticleEditView;
+});

package/app/modules/editor/block/index.js

@@ -0,0 +1,18 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var EditorBlockEditSidebarView = require('./views/editorBlockEditSidebarView');
+  var EditorBlockEditView = require('./views/editorBlockEditView');
+  var Helpers = require('../global/helpers');
+  var Origin = require('core/origin');
+
+  Origin.on('editor:block', async function(data) {
+    if(data.action !== 'edit') {
+      return;
+    }
+    var model = Origin.editor.data.content.findWhere({ _id: data.id });
+    var form = await Origin.scaffold.buildForm({ model });
+    Helpers.setPageTitle(model);
+    Origin.sidebar.addView(new EditorBlockEditSidebarView({ model, form }).$el);
+    Origin.contentPane.setView(EditorBlockEditView, { model, form });
+  });
+});

package/app/modules/editor/block/templates/editorBlockEdit.hbs

@@ -0,0 +1,2 @@
+<div class="block-edit-inner form-container">
+</div>

package/app/modules/editor/block/templates/editorBlockEditSidebar.hbs

@@ -0,0 +1,19 @@
+<div class="sidebar-item-inner">
+{{!--     <div class="sidebar-row sidebar-item-title">
+        <h2 class="sidebar-item-title-inner">
+            Block Edit
+        </h2>
+    </div> --}}
+    <div class="separator"></div>
+    <button class="editor-block-edit-sidebar-save action-primary">
+        <span class="editor-block-edit-sidebar-save-inner">
+            {{!-- <i class="fa fa-save"></i> --}}{{t 'app.save'}}
+        </span>
+    </button>
+    <button class="editor-block-edit-sidebar-cancel action-secondary">
+        <span class="editor-block-edit-sidebar-cancel-inner">
+            {{!-- <i class="fa fa-close"></i> --}}{{t 'app.cancel'}}
+        </span>
+    </button>
+    <div class="separator"></div>
+</div>

package/app/modules/editor/block/views/editorBlockEditSidebarView.js

@@ -0,0 +1,28 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Backbone = require('backbone');
+  var Origin = require('core/origin');
+  var SidebarItemView = require('modules/sidebar/views/sidebarItemView');
+
+  var EditorBlockEditSidebarView = SidebarItemView.extend({
+    events: {
+      'click .editor-block-edit-sidebar-save': 'saveEditing',
+      'click .editor-block-edit-sidebar-cancel': 'cancelEditing'
+    },
+
+    saveEditing: function(event) {
+      event && event.preventDefault();
+      this.updateButton('.editor-block-edit-sidebar-save', Origin.l10n.t('app.saving'));
+      Origin.trigger('editorBlockEditSidebar:views:save');
+    },
+
+    cancelEditing: function(event) {
+      event && event.preventDefault();
+      Backbone.history.history.back();
+    }
+  }, {
+    template: 'editorBlockEditSidebar'
+  });
+
+  return EditorBlockEditSidebarView;
+});

package/app/modules/editor/block/views/editorBlockEditView.js

@@ -0,0 +1,19 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Backbone = require('backbone');
+  var Origin = require('core/origin');
+  var EditorOriginView = require('../../global/views/editorOriginView');
+
+  var EditorBlockEditView = EditorOriginView.extend({
+    className: "block-edit",
+    tagName: "div",
+
+    preRender: function() {
+      this.listenTo(Origin, 'editorBlockEditSidebar:views:save', this.save);
+    }
+  }, {
+    template: 'editorBlockEdit'
+  });
+
+  return EditorBlockEditView;
+});

package/app/modules/editor/component/index.js

@@ -0,0 +1,22 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  const EditorComponentEditSidebarView = require('./views/editorComponentEditSidebarView');
+  const EditorComponentEditView = require('./views/editorComponentEditView');
+  const Helpers = require('../global/helpers');
+  const Origin = require('core/origin');
+
+  Origin.on('editor:component', async ({ id: _id }) => {
+    if(_id === 'new' && !Origin.editor.data.newcomponent) {
+      return Origin.Notify.alert({ 
+        type: 'error', 
+        text: 'Invalid data for new component',
+        callback: () => Origin.router.navigateBack()
+      });
+    }
+    const model = _id === 'new' ? Origin.editor.data.newcomponent : Origin.editor.data.content.findWhere({ _id });
+    const form = await Origin.scaffold.buildForm({ model });
+    Helpers.setPageTitle(model);
+    Origin.sidebar.addView(new EditorComponentEditSidebarView({ model, form }).$el);
+    Origin.contentPane.setView(EditorComponentEditView, { model, form });
+  });
+});

package/app/modules/editor/component/templates/editorComponentEdit.hbs

@@ -0,0 +1,2 @@
+<div class="component-edit-inner form-container">
+</div>

package/app/modules/editor/component/templates/editorComponentEditSidebar.hbs

@@ -0,0 +1,19 @@
+<div class="sidebar-item-inner">
+{{!--     <div class="sidebar-row sidebar-item-title">
+        <h2 class="sidebar-item-title-inner">
+            Component Edit
+        </h2>
+    </div> --}}
+        <div class="separator"></div>
+        <button class="editor-component-edit-sidebar-save action-primary">
+            <span class="editor-component-edit-sidebar-save-inner">
+                {{t 'app.save'}}
+            </span>
+        </button>
+        <button class="editor-component-edit-sidebar-cancel action-secondary">
+            <span class="editor-component-edit-sidebar-cancel-inner">
+                {{t 'app.cancel'}}
+            </span>
+        </button>
+        <div class="separator"></div>
+</div>

package/app/modules/editor/component/views/editorComponentEditSidebarView.js

@@ -0,0 +1,32 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Origin = require('core/origin');
+  var SidebarItemView = require('modules/sidebar/views/sidebarItemView');
+
+  var EditorComponentEditSidebarView = SidebarItemView.extend({
+    events: {
+      'click .editor-component-edit-sidebar-save': 'saveEditing',
+      'click .editor-component-edit-sidebar-cancel': 'cancelEditing'
+    },
+
+    saveEditing: function(event) {
+      event.preventDefault();
+      this.updateButton('.editor-component-edit-sidebar-save', Origin.l10n.t('app.saving'));
+      Origin.trigger('editorComponentEditSidebar:views:save');
+    },
+
+    cancelEditing: function(event) {
+      event.preventDefault();
+      const page = this.getParent(this.getParent(this.getParent(this.model)));
+      Origin.router.navigateTo(`editor/${page.get('_courseId')}/page/${page.get('_id')}`);
+    },
+
+    getParent: function(model) {
+      return Origin.editor.data.content.findWhere({ _id: model.get('_parentId') });
+    }
+  }, {
+    template: 'editorComponentEditSidebar'
+  });
+
+  return EditorComponentEditSidebarView;
+});

package/app/modules/editor/component/views/editorComponentEditView.js

@@ -0,0 +1,23 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Origin = require('core/origin');
+  var EditorOriginView = require('../../global/views/editorOriginView');
+
+  var EditorComponentEditView = EditorOriginView.extend({
+    className: "component-edit",
+    tagName: "div",
+    
+    preRender: function() {
+      this.listenTo(Origin, 'editorComponentEditSidebar:views:save', this.save);
+    },
+
+    cancel: function (event) {
+      event && event.preventDefault();
+      Origin.trigger('editorSidebarView:removeEditView', this.model);
+    }
+  }, {
+    template: 'editorComponentEdit'
+  });
+
+  return EditorComponentEditView;
+});

package/app/modules/editor/config/index.js

@@ -0,0 +1,15 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var EditorConfigEditSidebarView = require('./views/editorConfigEditSidebarView');
+  var EditorConfigEditView = require('./views/editorConfigEditView');
+  var Helpers = require('../global/helpers');
+  var Origin = require('core/origin');
+
+  Origin.on('editor:config', async function(data) {
+    var model = Origin.editor.data.config;
+    var form = await Origin.scaffold.buildForm({ model });
+    Helpers.setPageTitle(model);
+    Origin.sidebar.addView(new EditorConfigEditSidebarView({ form }).$el);
+    Origin.contentPane.setView(EditorConfigEditView, { model, form });
+  });
+});

package/app/modules/editor/config/templates/editorConfigEdit.hbs

@@ -0,0 +1 @@
+<div class="config-edit-inner form-container"></div>

package/app/modules/editor/config/templates/editorConfigEditSidebar.hbs

@@ -0,0 +1,10 @@
+<div class="sidebar-item-inner">
+  <div class="separator"></div>
+  <button class="editor-config-edit-sidebar-save action-primary">
+    <span class="editor-config-edit-sidebar-save-inner">{{t 'app.save'}}</span>
+  </button>
+  <button class="editor-config-edit-sidebar-cancel action-secondary">
+    <span class="editor-config-edit-sidebar-cancel-inner">{{t 'app.cancel'}}</span>
+  </button>
+  <div class="separator"></div>
+</div>

package/app/modules/editor/config/views/editorConfigEditSidebarView.js

@@ -0,0 +1,28 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Backbone = require('backbone');
+  var Origin = require('core/origin');
+  var SidebarItemView = require('modules/sidebar/views/sidebarItemView');
+
+  var EditorConfigEditSidebarView = SidebarItemView.extend({
+    events: {
+      'click .editor-config-edit-sidebar-save': 'saveEditing',
+      'click .editor-config-edit-sidebar-cancel': 'cancelEditing'
+    },
+
+    saveEditing: function(event) {
+      event && event.preventDefault();
+      this.updateButton('.editor-config-edit-sidebar-save', Origin.l10n.t('app.saving'));
+      Origin.trigger('editorConfigEditSidebar:views:save');
+    },
+
+    cancelEditing: function(event) {
+      event && event.preventDefault();
+      Backbone.history.history.back();
+    }
+  }, {
+    template: 'editorConfigEditSidebar'
+  });
+
+  return EditorConfigEditSidebarView;
+});

package/app/modules/editor/config/views/editorConfigEditView.js

@@ -0,0 +1,28 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+define(function(require) {
+  var Origin = require('core/origin');
+  var EditorOriginView = require('../../global/views/editorOriginView');
+
+  var EditorConfigEditView = EditorOriginView.extend({
+    className: "config-edit",
+    tagName: "div",
+
+    preRender: function() {
+      this.listenTo(Origin, {
+        'editorSidebarView:removeEditView': this.remove,
+        'editorConfigEditSidebar:views:save': this.save
+      });
+    },
+
+    getAttributesToSave: function() {
+      var changed = this.model.changedAttributes();
+      if(changed) {
+        return Object.assign(changed, { _id: this.model.get('_id'), _courseId: this.model.get('_courseId') });
+      }
+    }
+  }, {
+    template: 'editorConfigEdit'
+  });
+
+  return EditorConfigEditView;
+});

package/app/modules/editor/contentObject/index.js

@@ -0,0 +1,68 @@
+// LICENCE https://github.com/adaptlearning/adapt_authoring/blob/master/LICENSE
+/**
+ * This module handles both sections/menus and pages.
+ */
+define(function(require) {
+  var EditorMenuSidebarView = require('./views/editorMenuSidebarView');
+  var EditorPageEditSidebarView = require('./views/editorPageEditSidebarView');
+  var EditorPageEditView = require('./views/editorPageEditView');
+  var EditorPageSidebarView = require('./views/editorPageSidebarView');
+  var EditorView = require('../global/views/editorView');
+  var Helpers = require('../global/helpers');
+  var Origin = require('core/origin');
+
+  Origin.on('editor:contentObject', function(data) {
+    var route = function() {
+      if(data.action === 'edit') {
+        return renderContentObjectEdit(data);
+      }
+      if(data.id) {
+        return renderPageStructure(data);
+      } 
+      renderMenuStructure(data);
+    }
+    if(!data.id) {
+      return route();
+    }
+    data.model = Origin.editor.data.content.findWhere({ _id: data.id });
+    Helpers.setPageTitle(data.model);
+    route();
+  });
+
+  async function renderContentObjectEdit(data) {
+    Helpers.setPageTitle(data.model);
+    var form = await Origin.scaffold.buildForm({ model: data.model });
+    Origin.sidebar.addView(new EditorPageEditSidebarView({ form: form }).$el);
+    Origin.contentPane.setView(EditorPageEditView, { model: data.model, form: form });
+  }
+
+  function renderPageStructure(data) {
+    Helpers.setPageTitle(data.model);
+
+    Origin.sidebar.addView(new EditorPageSidebarView().$el, {
+      backButtonText: Origin.l10n.t('app.backtomenu'),
+      backButtonRoute: "#/editor/" + Origin.location.route1 + "/menu"
+    });
+    Origin.contentPane.setView(EditorView, {
+      currentCourseId: Origin.location.route1,
+      currentView: 'page',
+      currentPageId: data.id
+    });
+  }
+
+  function renderMenuStructure(data) {
+    Helpers.setPageTitle(Origin.editor.data.course);
+
+    Origin.editor.scrollTo = 0;
+
+    Origin.sidebar.addView(new EditorMenuSidebarView().$el, {
+      backButtonText: Origin.l10n.t('app.backtoprojects'),
+      backButtonRoute: '#/projects'
+    });
+    Origin.contentPane.setView(EditorView, {
+      currentCourseId: Origin.location.route1,
+      currentView: 'menu',
+      currentPageId: data.id
+    });
+  }
+});

package/app/modules/editor/contentObject/less/editing-overlay-component-list.less

@@ -0,0 +1,60 @@
+.editing-overlay-component-select-body {
+    border-bottom: 1px solid #b7caed;
+    background-color:#f3f3f3;
+}
+
+.editing-overlay-component-select-body-inner {
+    padding:30px;
+}
+
+.editing-overlay-component-item {
+    position:relative;
+    overflow:hidden;
+    border-bottom: 1px solid #b7caed;
+}
+
+.editing-overlay-component-option {
+    position:relative;
+    z-index:10;
+    border:none;
+    display:block;
+    width:100%;
+    padding:0px;
+    text-align:left;
+    background-color:#e8e8e8;
+    transition:background-color 0.2s;
+    &:hover {
+        background-color:#aaa;
+    }
+    &.selected {
+        background-color:#999;
+    }
+}
+
+.editing-overlay-component-option-inner {
+    padding:10px 30px;
+}
+
+.editing-overlay-component-layout {
+    position:absolute;
+    z-index:5;
+    left:0px;
+    top:0px;
+    height:100%;
+}
+
+.editing-overlay-component-layout-option {
+    border:none;
+    border-right:1px solid #ccc;
+    padding:0px 10px;
+    float:left;
+    background-color: @white;
+    color:#3e4960;
+    transition:background-color 0.2s;
+    &:hover {
+        background-color:#444;
+    }
+    &.selected {
+        background-color:#111;
+    }
+}

package/app/modules/editor/contentObject/less/editing-overlay-panel.less

@@ -0,0 +1,25 @@
+.editing-overlay-panel {
+}
+
+.editing-overlay-panel-collapsed {
+	display:none;
+}
+
+.editing-overlay-panel-title {
+	display:block;
+	background-color: @white;
+    color:#3e4960;
+	border-bottom:1px solid #454545;
+}
+
+.editing-overlay-panel-title-inner {
+	padding:30px;
+}
+
+.editing-overlay-panel-content {
+	border-bottom:1px solid #454545;
+}
+
+.editing-overlay-panel-content-inner {
+	padding:30px;
+}