Skip to content

Commit

Permalink
Made changes based on code review.
Browse files Browse the repository at this point in the history
  • Loading branch information
Michael Mathews committed Sep 25, 2009
1 parent 3eae42b commit b7238cc
Show file tree
Hide file tree
Showing 2 changed files with 74 additions and 97 deletions.
67 changes: 30 additions & 37 deletions src/widgets/editor/editor.js
View file
Expand Up @@ -942,27 +942,28 @@ Idler.prototype._stop = function() {
this.icon = this.element.get(".editor-toolbar-dropdown");

// create overlaymenu child obect - this is used as the menu when the drop-down tool-link is clicked on
this.overlayMenu = new glow.widgets.Editor.Toolbar.OverlayMenu({
menuItems: opts.menuItems,
onClick: function(e) {

// change the dropdown tool-link label
that.label(that.overlayMenu.menuItems[that.overlayMenu.selected].title);

// fire tool-link - again, this is done from the overlayMenu because the tool-link isn't being interacted with
//events.fire(that, "activate");
that.press();
//events.fire(that, "deactivate");
//that.deactivate();

if (glow.env.ie) {
that.editor.editArea.contentWindow.focus();
this.overlayMenu = new glow.widgets.Editor.Toolbar.OverlayMenu(
this,
{
menuItems: opts.menuItems,
onClick: function(e) {

// change the dropdown tool-link label
that.label(that.overlayMenu.menuItems[that.overlayMenu.selected].title);

// fire tool-link - again, this is done from the overlayMenu because the tool-link isn't being interacted with
//events.fire(that, "activate");
that.press();
//events.fire(that, "deactivate");
//that.deactivate();

if (glow.env.ie) {
that.editor.editArea.contentWindow.focus();
}

}

}
},
this); // passed into dropDown param - could refactor this out at a later date?

);

// getter/setter for the label of the tool-link
this.label = function(newLabel) {
Expand Down Expand Up @@ -1105,23 +1106,20 @@ Idler.prototype._stop = function() {
@type Number
@description Indicates index value of selected menu item
*/
glow.widgets.Editor.Toolbar.OverlayMenu = function(opts, dropDown) { /*debug*///console.log("new glow.widgets.Editor.Toolbar.OverlayMenu("+opts+", "+dropDown+")");

var overlayMenuContents = glow.dom.create("<ul></ul>"), // html for the overlay
overlayMenu; // object to return
var that = this;
glow.widgets.Editor.Toolbar.OverlayMenu = function(dropDown, opts) { /*debug*///console.log("new glow.widgets.Editor.Toolbar.OverlayMenu("+opts+", "+dropDown+")");

var overlayMenuContents = glow.dom.create('<ul></ul>'), // html for the overlay
overlayMenu,
that = this;

// default function requires a glow.dom.nodeList passed in, will return the html of the nodeList
// This param allows you to customise how each menuItem looks
// DON'T THINK WE NEED THIS?
opts.formatItem = opts.formatItem || function(o) { return o.html(); };



// default empty function for onclick
opts.onClick = opts.onClick || function() {};


// create an overlay that we will use for the menu
overlayMenu = new glow.widgets.Overlay(overlayMenuContents, {
className: 'overlayMenu',
Expand All @@ -1141,12 +1139,10 @@ Idler.prototype._stop = function() {
// Add opts.menuItems onto the overlayMenu. This make
overlayMenu.menuItems = opts.menuItems;


// param to tell user the index value of the selected menuItem.
// default value is null as nothing has been selected yet.
overlayMenu.selected = null;


// add menuItems onto overlayMenu HTML as <li>s
var z = 0;
for (menuItem in overlayMenu.menuItems) {
Expand All @@ -1159,19 +1155,17 @@ Idler.prototype._stop = function() {
if (menuItem.selected == true) {
overlayMenu.selected = z;
}
z++
z++;
}


// when the overlayMenu is hidden by clicking on the mask then deactivate the dropDown tool-link
events.addListener(overlayMenu, "hide", function(){
events.addListener(overlayMenu, 'hide', function(){
if (dropDown.isActive == true) {
events.fire(dropDown, "deactivate");
events.fire(dropDown, 'deactivate');
dropDown.isActive = false;
}
});


// pass in a tag, and if the tag matches one of the tags in the menuItems return the matching menuItem's title
overlayMenu.getTitleFromTag = function(tag) {
for (menuItem in overlayMenu.menuItems) {
Expand All @@ -1184,7 +1178,6 @@ Idler.prototype._stop = function() {
return null;
}


var arrLi = overlayMenu.container.get("li");
events.addListener(overlayMenuContents, "mouseover", function(e) {
_highlightMenuItem($(e.source), arrLi);
Expand All @@ -1204,7 +1197,7 @@ Idler.prototype._stop = function() {
return false
});

events.addListener(overlayMenuContents, "keydown", function(e){
events.addListener(overlayMenuContents, "keydown", function(e) {

var toolLink = dropDown.element.get("a");
switch(e.key) {
Expand Down Expand Up @@ -1430,7 +1423,7 @@ Idler.prototype._stop = function() {
},
{
title: localeModule.NORMAL_TITLE,
template: '<li>{title}</li>',
template: '<li class="normal">{title}</li>',
tag: 'p',
selected: true
}
Expand Down
104 changes: 44 additions & 60 deletions src/widgets/widgets.editor.css
View file
@@ -1,5 +1,8 @@
/* EDITOR */
.glowCSSVERSION-editor {border: 1px solid #000;}
.glowCSSVERSION-editor {
border: 1px solid #000;
font-size: medium;
}

.glowCSSVERSION-editor .editor-toolbar
{
Expand All @@ -8,7 +11,6 @@
margin: 0;
padding: 0;
background-color: #EFEFEF;
/*height: 28px;*/
}

.glowCSSVERSION-editor .editor-toolbar legend { display: none; }
Expand All @@ -28,8 +30,6 @@
list-style: none;
float: left;
display: block;
/*width: 26px;
height: 24px;*/
margin: 0 !important;
padding: 0 !important;
}
Expand All @@ -39,8 +39,6 @@
display: block;
margin: 0;
padding: 0;
/*width: 26px;
height: 24px;*/
overflow: hidden;
}

Expand Down Expand Up @@ -77,18 +75,18 @@
.glowCSSVERSION-editor .editor-toolbar-item .active .editor-toolbar-icon { background-position: 0px -85px; }
.glowCSSVERSION-editor .editor-toolbar-item .hover .editor-toolbar-icon { background-position: 0px -56px; }


/* DROPDOWN */

.glowCSSVERSION-editor .editor-toolbar-dropdown {
display: block;
width: 84px;
margin: 0 3px 0 3px;
}

.glowCSSVERSION-editor .editor-toolbar-dropdown a {
color: black;
text-decoration: none;
font: 13px arial;
font: 0.75em arial;
}
.glowCSSVERSION-editor .editor-toolbar-dropdown span span {
display: block;
Expand All @@ -97,46 +95,45 @@
height: 16px;
line-height: 16px;
margin: 3px 0 0 2px;
background: #fff url(images/editor/menuarrow.png) no-repeat scroll right 8px;
-moz-background-clip: border;
-moz-background-inline-policy: continuous;
-moz-background-origin: padding;
background: #fff url(images/editor/menuarrow.png) no-repeat right 8px;

overflow: hidden;
}
.glowCSSVERSION-editor .editor-toolbar-dropdown .disabled span {
background: #aaa url(images/editor/menuarrow.png) no-repeat scroll right -10px;
background: #aaa url(images/editor/menuarrow.png) no-repeat right -10px;
}
.glowCSSVERSION-editor .editor-toolbar-dropdown .hover span {
background: #fff url(images/editor/menuarrow.png) no-repeat scroll right 8px;
.glowCSSVERSION-editor .editor-toolbar-dropdown .hover span {
background: #fff url(images/editor/menuarrow.png) no-repeat right 8px;
}
.glowCSSVERSION-editor .editor-toolbar-dropdown .active span span {
.glowCSSVERSION-editor .editor-toolbar-dropdown .active span span {
border: 1px solid #aaa;
}
.glowCSSVERSION-editor .editor-toolbar-dropdown .active span {
background: #ccc url(images/editor/menuarrow.png) no-repeat scroll right 8px;
.glowCSSVERSION-editor .editor-toolbar-dropdown .active span {
background: #ccc url(images/editor/menuarrow.png) no-repeat right 8px;
}

.overlayMenu {
.glowCSSVERSION-overlay.overlayMenu {
background: #ccc; border: 1px solid #b1b1b1;
font: 13px arial;
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
}
.overlayMenu ul
{

.glowCSSVERSION-overlay.overlayMenu ul {
list-style: none;
margin: 0;
padding: 0;
}

.overlayMenu ul li {
.glowCSSVERSION-overlay.overlayMenu ul li {
padding: 2px 4px 2px 4px;
outline: none;
}

.overlayMenu ul li.highlighted { background: #999; cursor: pointer; }
.overlayMenu ul .heading1 { font-size: 18px; }
.overlayMenu ul .heading2 { font-size: 16px; }
.overlayMenu ul .heading3 { font-size: 14px; }
.overlayMenu ul li { font-size: 12px; }
/*.overlayMenu ul li a {display: block; border: 1px solid; font-size: 1em;}*/
.glowCSSVERSION-overlay.overlayMenu li.highlighted { background: #999; cursor: pointer; }
.glowCSSVERSION-overlay.overlayMenu .heading1 { font-size: 1.2em; }
.glowCSSVERSION-overlay.overlayMenu .heading2 { font-size: 1.1em; }
.glowCSSVERSION-overlay.overlayMenu .heading3 { font-size: 1.0em; }
.glowCSSVERSION-overlay.overlayMenu .normal { font-size: 0.9em; }

/* DROPDOWN DARK */

Expand All @@ -146,49 +143,36 @@
color: #fff;
}

.glowCSSVERSION-editor .editor-dark .editor-toolbar-dropdown .hover span span {
.glowCSSVERSION-editor .editor-dark .editor-toolbar-dropdown .hover span span {
border: 1px solid #ccc;
}

.overlayMenu-dark {
.glowCSSVERSION-editor .editor-toolbar-dropdown .hover span span {
border: 1px solid #999;
}

.glowCSSVERSION-overlay.overlayMenu-dark {
background: #333; border: 1px solid #ccc;
color: #fff;
}
.overlayMenu-dark ul li.highlighted { background: #000; }
.glowCSSVERSION-overlay.overlayMenu-dark ul li.highlighted { background: #000; }

/*
.glowCSSVERSION-editor .editor-toolbar-item .default .italics-button { background-position: 0px 0px; }
.glowCSSVERSION-editor .editor-toolbar-item .disabled .italics-button { background-position: 0px -28px; }
.glowCSSVERSION-editor .editor-toolbar-item .active .italics-button { background-position: 0px -85px; }
.glowCSSVERSION-editor .editor-toolbar-item .hover .italics-button { background-position: 0px -56px; }
.glowCSSVERSION-editor .editor-toolbar-item .default .strike-button { background-position: 0px 0px; }
.glowCSSVERSION-editor .editor-toolbar-item .disabled .strike-button { background-position: 0px -28px; }
.glowCSSVERSION-editor .editor-toolbar-item .active .strike-button { background-position: 0px -85px; }
.glowCSSVERSION-editor .editor-toolbar-item .hover .strike-button { background-position: 0px -56px; }
.glowCSSVERSION-editor .editor-toolbar-item .default .blockquote-button { background-position: 0px 0px; }
.glowCSSVERSION-editor .editor-toolbar-item .disabled .blockquote-button { background-position: 0px -28px; }
.glowCSSVERSION-editor .editor-toolbar-item .active .blockquote-button { background-position: 0px -85px; }
.glowCSSVERSION-editor .editor-toolbar-item .hover .blockquote-button { background-position: 0px -56px; }
*/
.glowCSSVERSION-editor .glowCSSVERSION-hidden {position: absolute; left: -2500px; width: 1px;}

.glowCSSVERSION-editor .glowCSSVERSION-hidden { position: absolute; left: -2500px; width: 1px; }

/* without images */
.glowCSSVERSION-basic .glowCSSVERSION-editor .editor-toolbar-icon span { border: none; height: auto; overflow: normal; width: auto; }
.glowCSSVERSION-basic .glowCSSVERSION-editor .editor-toolbar-item .hover span span {border: 1px solid #000;}
.glowCSSVERSION-basic .glowCSSVERSION-editor .editor-toolbar-item .hover span span { border: 1px solid #000; }

.glowCSSVERSION-editor iframe {border: 0; margin: 0; padding: 0; width: 100%;}
.glowCSSVERSION-editor iframe { border: 0; margin: 0; padding: 0; width: 100%; }

/* dark theme */
.editor-dark .editor-toolbar {background: #333; color: #fff;}
.editor-dark .editor-toolbar-item .bold-button { background-image: url(images/editor/dark-button-bold.png); }
.editor-dark .editor-toolbar-item .italics-button { background-image: url(images/editor/dark-button-italics.png); }
.editor-dark .editor-toolbar-item .strike-button { background-image: url(images/editor/dark-button-strike.png); }
.editor-dark .editor-toolbar-item .blockquote-button { background-image: url(images/editor/dark-button-blockquote.png); }
.editor-dark .editor-toolbar-item .blockquote-button { background-image: url(images/editor/dark-button-blockquote.png); }
.editor-dark .editor-toolbar-item .unorderedlist-button { background-image: url(images/editor/dark-button-unorderedlist.png); }
.editor-dark .editor-toolbar-item .orderedlist-button { background-image: url(images/editor/dark-button-orderedlist.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar { background: #333; color: #fff; }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .bold-button { background-image: url(images/editor/dark-button-bold.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .italics-button { background-image: url(images/editor/dark-button-italics.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .strike-button { background-image: url(images/editor/dark-button-strike.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .blockquote-button { background-image: url(images/editor/dark-button-blockquote.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .blockquote-button { background-image: url(images/editor/dark-button-blockquote.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .unorderedlist-button { background-image: url(images/editor/dark-button-unorderedlist.png); }
.glowCSSVERSION-editor .editor-dark .editor-toolbar-item .orderedlist-button { background-image: url(images/editor/dark-button-orderedlist.png); }

/* END EDITOR */

0 comments on commit b7238cc

Please sign in to comment.