Permalink
Browse files

ENHANCEMENT: Add disabled state to preview buttons and add watermark …

…for the current state being viewed (TRAC:7214)
  • Loading branch information...
1 parent de4a865 commit 92484581e31df7c4a3b1017247fdf055ff42890f Ryan O'Hara committed May 3, 2012
@@ -164,7 +164,7 @@
this.find('iframe').hide();
this.find('.cms-preview-toggle a').html('«');
this.find('.cms-preview-controls').hide();
- containerEl.find('.cms-menu').expandPanel();
+ containerEl.find('.cms-menu').expandPanel();
// Already triggered through panel toggle above
// containerEl.redraw();
@@ -237,24 +237,29 @@
}
}
});
-
+
$('.cms-preview .cms-preview-states').entwine({
onmatch: function() {
this.find('a').addClass('ss-ui-button');
- this.find('.active a').addClass('ui-state-highlight');
+ this.find('.active a').addClass('ui-state-disabled');
+ this.find('.cms-preview-watermark').show();
+ this.find('.active .cms-preview-watermark').hide();
}
});
-
+
$('.cms-preview .cms-preview-states a').entwine({
onclick: function(e) {
e.preventDefault();
this.parents('.cms-preview').loadUrl(this.attr('href'));
- this.addClass('ui-state-highlight');
- this.parents('.cms-preview-states').find('a').not(this).removeClass('ui-state-highlight');
-
+ this.addClass('ui-state-disabled');
+ this.parents('.cms-preview-states').find('a').not(this).removeClass('ui-state-disabled');
+ //This hides all watermarks
+ this.parents('.cms-preview-states').find('.cms-preview-watermark').hide();
+ //Show the watermark for the current state
+ this.siblings('.cms-preview-watermark').show();
}
});
-
+
$('.cms-preview-toggle-link').entwine({
onclick: function(e) {
e.preventDefault();
View
@@ -366,6 +366,19 @@ form.small .field, .field.small {
border: 1px solid $color-button-highlight-border;
}
+ &.ui-state-disabled {
+ color: lighten($color-text-dark, 20%);
+ border-color: darken($color-button-disabled, 20%);
+ border-top-color: darken($color-button-disabled, 60%);
+ cursor: default;
+ @include background(
+ linear-gradient(color-stops(
+ darken($color-button-disabled, 5%),
+ lighten($color-button-disabled, 10%)
+ ))
+ );
+ }
+
&.ss-ui-action-minor {
background: none;
border: 0;
View
@@ -847,6 +847,24 @@ body.cms {
width: 100%;
height: 100%;
}
+
+ .cms-preview-watermark {
+ z-index: 99;
+ position: fixed;
+ right: 60px;
+ top: 30px;
+ opacity: 0.3;
+ padding: .4em 1em;
+ cursor: default;
+ font-weight: bold;
+ text-decoration: none;
+ line-height: $grid-y * 2;
+ color: lighten($color-text-dark, 10%);
+ border: 1px solid #AAAAAA;
+ border-radius:12px;
+ background-color: white;
+ text-shadow: lighten($color-tab, 5%) 0 1px 0;
+ }
.cms-preview-controls {
z-index: 99;
@@ -4,7 +4,9 @@
</a>
<ul class="cms-preview-states">
<% control Items %>
- <li class="$Class<% if isActive %> active<% end_if %>">$HTML</li>
+ <li class="<% if isActive %> active<% end_if %>">$HTML
+ <% if WatermarkHTML %><span class="cms-preview-watermark">$WatermarkHTML</span><% end_if %>
+ </li>
<% end_control %>
</ul>
<a href="$Record.Link" target="_blank" class="cms-preview-popup-link">

0 comments on commit 9248458

Please sign in to comment.