From 67b0ffd09c51291cda1e72ed82044a03ceda2bc1 Mon Sep 17 00:00:00 2001 From: Dave Cranwell Date: Thu, 5 Feb 2015 11:40:37 +0000 Subject: [PATCH 1/2] beginning styling of stream menus --- .../static/wagtailadmin/js/blocks/sequence.js | 3 + .../static/wagtailadmin/js/blocks/stream.js | 8 ++ .../scss/layouts/page-editor.scss | 128 ++++++++++++------ .../wagtailadmin/block_forms/stream_menu.html | 12 +- 4 files changed, 103 insertions(+), 48 deletions(-) diff --git a/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/sequence.js b/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/sequence.js index 8d21a752f..2ced19a9f 100644 --- a/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/sequence.js +++ b/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/sequence.js @@ -10,6 +10,8 @@ For example, they don't assume the presence of a 'delete' button - it's up to th var self = {}; self.prefix = prefix; self.container = $('#' + self.prefix + '-container'); + self.menu = $('.stream-menu', self.container); + var indexField = $('#' + self.prefix + '-order'); self.delete = function() { @@ -28,6 +30,7 @@ For example, they don't assume the presence of a 'delete' button - it's up to th self.container.fadeOut(); }; self._markAdded = function() { + self.menu.addClass('closed'); self.container.hide(); self.container.slideDown(); }; diff --git a/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/stream.js b/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/stream.js index 47649e3bd..0099b2312 100644 --- a/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/stream.js +++ b/wagtail/wagtailadmin/static/wagtailadmin/js/blocks/stream.js @@ -12,6 +12,14 @@ listMemberTemplates[childBlock.name] = template; } + $('.stream-menu').addClass('stream-menu-closed'); + $(document).on('mouseover','.stream-menu',function(){ + $(this).removeClass('stream-menu-closed'); + }).on('mouseout', '.stream-menu', function(){ + $(this).addClass('stream-menu-closed') + }); + + return function(elementPrefix) { var sequence = Sequence({ 'prefix': elementPrefix, diff --git a/wagtail/wagtailadmin/static/wagtailadmin/scss/layouts/page-editor.scss b/wagtail/wagtailadmin/static/wagtailadmin/scss/layouts/page-editor.scss index 299eb4317..561e2dadf 100644 --- a/wagtail/wagtailadmin/static/wagtailadmin/scss/layouts/page-editor.scss +++ b/wagtail/wagtailadmin/static/wagtailadmin/scss/layouts/page-editor.scss @@ -192,74 +192,116 @@ padding-left:0; padding-right:0; } - - /* Object controls */ - .stream-controls{ - position:absolute; - z-index:1; - right:1em; - top:1em; - color:white; - overflow:hidden; - @include border-radius(2px); - - li{ - background-color: $color-teal; - float:left; - cursor:pointer; - margin-right:1px; - - &:last-child{ - margin-right:0; - } - } - - .disabled{ - display:none; - } - } - + .fields > li > .field > label{ display:none; } .sequence{ + position:relative; @include clearfix; - margin:1em 0; - border:1px solid lighten($color-grey-4, 3%); - padding:0 1.5em; + + .sequence{ /* YUK! */ + padding:0 1.5em; + margin:1em 0; + border:1px solid lighten($color-grey-4, 3%); + } } + + .sequence-inner{ + overflow:hidden; + + .sequence-inner{ /* YUK! */ + @include column(10); + } + } + .sequence-member{ + @include clearfix; position:relative; padding:1em 1.5em; border-bottom:1px solid lighten($color-grey-4, 3%); margin:0 -1.5em; + .inner{ + @include clearfix; + } + .inner > .struct-block > label{ display:block; width:100%; float:none; } - } - .sequence-inner{ - @include column(10); - - &:nth-of-type(1){ - @include column(12); - padding:0; - } - } - + } .struct-block > ul > li{ /* duplicates forms.scss ln.568 */ @include clearfix(); padding-top:0.5em; padding-bottom:1.2em; } - - - } + /* Object controls */ + .stream-controls{ + position:absolute; + z-index:1; + right:1em; + top:1em; + color:white; + overflow:hidden; + @include border-radius(2px); + + li{ + background-color: $color-teal; + float:left; + cursor:pointer; + margin-right:1px; + + &:last-child{ + margin-right:0; + } + } + + .disabled{ + display:none; + } + } + + /* Menu of other blocks to be added at each position */ + .stream-menu{ + position:relative; + overflow:hidden; + + ul{ + @include clearfix; + padding:1em; + background-color:$color-grey-5; + } + + &.stream-menu-closed{ + ul{ + height:0px; + } + + &:before{ + margin-top:-0.5em; + font-family:wagtail; + content:"B"; + width:2em; + height:2em; + display:block; + position:relative; + left:0;right:0; + margin:auto; + z-index:5; + color:$color-teal; + font-size:1.7em; + line-height:2em; + text-align:center; + } + } + } + + /* special panel for the publishing fields, requires a bit more pizzazz */ &.publishing{ h2:before{ diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/block_forms/stream_menu.html b/wagtail/wagtailadmin/templates/wagtailadmin/block_forms/stream_menu.html index 69fafb2c9..921f35504 100644 --- a/wagtail/wagtailadmin/templates/wagtailadmin/block_forms/stream_menu.html +++ b/wagtail/wagtailadmin/templates/wagtailadmin/block_forms/stream_menu.html @@ -1,5 +1,7 @@ - +
+ +
From 36ed0ec99d49b97384ebaa4ded6911e3104d3f0b Mon Sep 17 00:00:00 2001 From: Karl Hobley Date: Thu, 5 Feb 2015 11:46:44 +0000 Subject: [PATCH 2/2] Added tests for FieldBlock --- wagtail/wagtailadmin/tests/test_blocks.py | 55 +++++++++++++++++++++++ 1 file changed, 55 insertions(+) create mode 100644 wagtail/wagtailadmin/tests/test_blocks.py diff --git a/wagtail/wagtailadmin/tests/test_blocks.py b/wagtail/wagtailadmin/tests/test_blocks.py new file mode 100644 index 000000000..eb9c74a1f --- /dev/null +++ b/wagtail/wagtailadmin/tests/test_blocks.py @@ -0,0 +1,55 @@ +import unittest + +from django import forms +from django.core.exceptions import ValidationError + +from wagtail.wagtailadmin import blocks + + +class TestFieldBlock(unittest.TestCase): + def test_charfield_render(self): + block = blocks.FieldBlock(forms.CharField()) + html = block.render("Hello world!") + + self.assertEqual(html, "Hello world!") + + def test_charfield_render_form(self): + block = blocks.FieldBlock(forms.CharField()) + html = block.render_form("Hello world!") + + self.assertIn('
', html) + self.assertIn('', html) + + def test_charfield_render_form_with_prefix(self): + block = blocks.FieldBlock(forms.CharField()) + html = block.render_form("Hello world!", prefix='foo') + + self.assertIn('', html) + + def test_charfield_render_form_with_error(self): + block = blocks.FieldBlock(forms.CharField()) + html = block.render_form("Hello world!", error=ValidationError("This field is required.")) + + self.assertIn('This field is required.', html) + + @unittest.expectedFailure + def test_choicefield_render(self): + block = blocks.FieldBlock(forms.ChoiceField(choices=( + ('choice-1', "Choice 1"), + ('choice-2', "Choice 2"), + ))) + html = block.render('choice-2') + + self.assertEqual(html, "Choice 2") + + def test_choicefield_render_form(self): + block = blocks.FieldBlock(forms.ChoiceField(choices=( + ('choice-1', "Choice 1"), + ('choice-2', "Choice 2"), + ))) + html = block.render_form('choice-2') + + self.assertIn('
', html) + self.assertIn('