From 81e95f27db01bb6677365d49f9f18b59dd26258d Mon Sep 17 00:00:00 2001 From: marco Date: Tue, 14 May 2013 22:31:11 -0400 Subject: [PATCH] basic tab switching added --- .../coffee/src/views/module_edit.coffee | 26 +++++++++++++------ cms/static/sass/views/_unit.scss | 15 +++++++++-- cms/templates/component.html | 9 +++---- 3 files changed, 34 insertions(+), 16 deletions(-) diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee index 10e07081cb..5f935519d5 100644 --- a/cms/static/coffee/src/views/module_edit.coffee +++ b/cms/static/coffee/src/views/module_edit.coffee @@ -7,7 +7,7 @@ class CMS.Views.ModuleEdit extends Backbone.View "click .component-editor .save-button": 'clickSaveButton' "click .component-actions .edit-button": 'clickEditButton' "click .component-actions .delete-button": 'onDelete' - "click .not-set ": 'clickModeButton' + "click .mode a": 'clickModeButton' initialize: -> @onDelete = @options.onDelete @@ -28,6 +28,8 @@ class CMS.Views.ModuleEdit extends Backbone.View model: new CMS.Models.MetadataEditor(metadataEditor.data('metadata')) }); + ----> find id of the li that wraps the is-set A thinger, that thing's name, get the first word set to VAR, and then add is-active to the div whose class equals wrapper-comp-VAR + changedMetadata: -> return @metadataEditor.getModifiedMetadataValues() @@ -86,11 +88,19 @@ class CMS.Views.ModuleEdit extends Backbone.View clickModeButton: (event) -> event.preventDefault() - @$el.find("a").removeClass('not-set').addClass('is-set') + if $(this).hasClass(".is-set") + alert("Hey Sucka") + else + previousTab = @$el.find('li.active-mode .is-set') + previousTab.parent().siblings().find("a").addClass('is-set').attr({ + aria-selected: 'true', + tab-index: '1' + }) + previousTab.removeClass('is-set').attr({ + aria-selected: 'false', + tab-index: '0' + }) - previouslySetMode = @$el.siblings('li.active-mode').find('.is-set') - previouslySetMode.find("a").removeClass('is-set').addClass('not-set') - - activeTab = $component_editor.find('.xmodule_edit').find(".is-set") - activeTab.removeClass('is-set') - activeTab.siblings('.not-set').addClass('is-set') + previousTabContent = @$el.find('div.is-active') + previousTabContent.siblings().addClass('is-active') + previousTabContent.removeClass('is-active') diff --git a/cms/static/sass/views/_unit.scss b/cms/static/sass/views/_unit.scss index 655be20efc..86758c5c68 100644 --- a/cms/static/sass/views/_unit.scss +++ b/cms/static/sass/views/_unit.scss @@ -532,10 +532,21 @@ body.course.unit { } // Editor Wrapper -.wrapper-comp-editor { } +.wrapper-comp-editor { + display: none; + + &.is-active { + display: block; + } + } // Settings Wrapper .wrapper-comp-settings { + display: none; + + &.is-active { + display: block; + } //settings-list .list-input.settings-list { @@ -625,7 +636,7 @@ body.course.unit { } } - input, select { + input, select, input[type="number"] { @include placeholder($gray-l4); @include font-size(16); @include size(100%,100%); diff --git a/cms/templates/component.html b/cms/templates/component.html index ef0b62f4a4..3aa8c322df 100644 --- a/cms/templates/component.html +++ b/cms/templates/component.html @@ -3,13 +3,10 @@
Editing: Component