Fix add links.

This commit is contained in:
Paulo Veiga 2011-10-08 20:36:47 -03:00
parent 52587c0eaa
commit 5d1ab3cb6e
19 changed files with 333 additions and 306 deletions

View File

@ -110,7 +110,8 @@
<filelist dir="${basedir}/src/main/javascript/" files="BubbleTip.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="Icon.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="LinkIcon.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="Note.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="NoteIcon.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="ActionIcon.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="ImageIcon.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="model/IconModel.js"/>
@ -130,7 +131,7 @@
<filelist dir="${basedir}/src/main/javascript/commands/"
files="AddTopicCommand.js"/>
<filelist dir="${basedir}/src/main/javascript/"
files="commands/AddLinkToTopicCommand.js"/>
files="commands/ChangeLinkToTopicCommand.js"/>
<filelist dir="${basedir}/src/main/javascript/"
files="commands/RemoveLinkFromTopicCommand.js"/>
<filelist dir="${basedir}/src/main/javascript/"
@ -189,6 +190,8 @@
<filelist dir="${basedir}/src/main/javascript/widget/" files="NoteEditor.js"/>
<filelist dir="${basedir}/src/main/javascript/widget/" files="LinkEditor.js"/>
<filelist dir="${basedir}/src/main/javascript/widget/" files="FloatingTip.js"/>
<filelist dir="${basedir}/src/main/javascript/widget/" files="LinkIconTooltip.js"/>
<filelist dir="${basedir}/src/main/javascript/"
files="widget/ColorPickerPanel.js"/>

View File

@ -27,7 +27,7 @@ mindplot.ActionDispatcher = new Class({
throw "method must be implemented.";
},
addLinkToTopic: function(topicId, url) {
changeLinkToTopic: function(topicId, url) {
throw "method must be implemented.";
},

View File

@ -99,6 +99,7 @@ mindplot.IconGroup = new Class({
removeIconByUrl : function(url) {
var icon = this._findIconFromUrl(url);
$assert(icon,'icon could not be found');
this._removeIcon(icon);
},

View File

@ -18,179 +18,40 @@
mindplot.LinkIcon = new Class({
Extends:mindplot.Icon,
initialize:function(urlModel, topic, designer) {
$assert(urlModel, "urlModel can not be null");
$assert(designer, "designer can not be null");
$assert(topic, "topic can not be null");
Extends: mindplot.Icon,
initialize : function(topic, linkModel) {
$assert(topic, 'topic can not be null');
$assert(linkModel, 'linkModel can not be null');
this.parent(mindplot.LinkIcon.IMAGE_URL);
var divContainer = designer.getWorkSpace().getScreenManager().getContainer();
var bubbleTip = mindplot.BubbleTip.getInstance(divContainer);
this._linkModel = urlModel;
this._noteModel = linkModel;
this._topic = topic;
this._designer = designer;
var image = this.getImage();
var imgContainer = new Element('div').setStyles({textAlign:'center', cursor:'pointer'});
this._img = new Element('img');
var url = urlModel.getUrl();
this._img.src = 'http://open.thumbshots.org/image.pxf?url=' + url;
if (url.indexOf('http:') == -1) {
url = 'http://' + url;
}
this._img.alt = url;
this._url = url;
var openWindow = function() {
var wOpen;
var sOptions;
sOptions = 'status=yes,menubar=yes,scrollbars=yes,resizable=yes,toolbar=yes';
sOptions = sOptions + ',width=' + (screen.availWidth - 10).toString();
sOptions = sOptions + ',height=' + (screen.availHeight - 122).toString();
sOptions = sOptions + ',screenX=0,screenY=0,left=0,top=0';
var url = this._img.alt;
wOpen = window.open(url, "link", "width=100px, height=100px");
wOpen.focus();
wOpen.moveTo(0, 0);
wOpen.resizeTo(screen.availWidth, screen.availHeight);
};
this._img.addEvent('click', openWindow.bindWithEvent(this));
this._img.inject(imgContainer);
var attribution = new Element('div').setStyles({fontSize:10, textAlign:"center"});
attribution.innerHTML = "<a href='http://www.thumbshots.org' target='_blank' title='About Thumbshots thumbnails' style='color:#08468F'>About Thumbshots thumbnails</a>";
var container = new Element('div');
var element = new Element('div').setStyles({borderBottom:'1px solid #e5e5e5'});
var title = new Element('div').setStyles({fontSize:12, textAlign:'center'});
this._link = new Element('span');
this._link.href = url;
this._link.innerHTML = url;
this._link.setStyle("text-decoration", "underline");
this._link.setStyle("cursor", "pointer");
this._link.inject(title);
this._link.addEvent('click', openWindow.bindWithEvent(this));
title.inject(element);
imgContainer.inject(element);
attribution.inject(element);
element.inject(container);
if (!$defined(designer._readOnly) || ($defined(designer._readOnly) && !designer._readOnly)) {
var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'center'});
var editBtn = new Element('input', {type:'button', 'class':'btn-primary', value:'Edit'}).addClass('button').inject(buttonContainer);
var removeBtn = new Element('input', {type:'button', value:'Remove','class':'btn-primary'}).addClass('button').inject(buttonContainer);
editBtn.setStyle("margin-right", "3px");
removeBtn.setStyle("margin-left", "3px");
removeBtn.addEvent('click', function(event) {
var actionDispatcher = mindplot.ActionDispatcher.getInstance();
actionDispatcher.removeLinkFromTopic(this._topic.getId());
bubbleTip.forceClose();
}.bindWithEvent(this));
var okButtonId = 'okLinkButtonId';
editBtn.addEvent('click', function(event) {
var topic = this._topic;
var designer = this._designer;
var link = this;
var okFunction = function(e) {
var result = false;
var url = urlInput.value;
if ("" != url.trim()) {
link._img.src = 'http://open.thumbshots.org/image.pxf?url=' + url;
link._img.alt = url;
link._link.href = url;
link._link.innerHTML = url;
this._linkModel.setUrl(url);
result = true;
}
return result;
};
var msg = new Element('div');
var urlText = new Element('div').inject(msg);
urlText.innerHTML = "URL:";
var formElem = new Element('form', {'action': 'none', 'id':'linkFormId'});
var urlInput = new Element('input', {'type': 'text', 'size':30,'value':url});
urlInput.inject(formElem);
formElem.inject(msg);
formElem.addEvent('submit', function(e) {
$(okButtonId).fireEvent('click', e);
e = new Event(e);
e.stop();
});
var dialog = mindplot.LinkIcon.buildDialog(designer, okFunction, okButtonId);
dialog.adopt(msg).show();
}.bindWithEvent(this));
buttonContainer.inject(container);
}
var linkIcon = this;
image.addEvent('mouseover', function(event) {
bubbleTip.open(event, container, linkIcon);
});
image.addEvent('mousemove', function(event) {
bubbleTip.updatePosition(event);
});
image.addEvent('mouseout', function(event) {
bubbleTip.close(event);
});
this._registerEvents();
},
getUrl : function() {
return this._url;
_registerEvents : function() {
this._image.setCursor('pointer');
// Add on click event to open the editor ...
this.addEvent('click', function(event) {
this._topic.showLinkEditor();
event.stopPropagation();
}.bind(this));
this._tip = new mindplot.widget.LinkIconTooltip(this);
},
getModel : function() {
return this._linkModel;
return this._noteModel;
},
remove : function() {
var actionDispatcher = mindplot.ActionDispatcher.getInstance();
actionDispatcher.removeLinkFromTopic(this._topic.getId());
}
});
mindplot.LinkIcon.buildDialog = function(designer, okFunction, okButtonId) {
var windoo = new Windoo({
title: 'Write link URL',
theme: Windoo.Themes.wise,
modal:true,
buttons:{'menu':false, 'close':false, 'minimize':false, 'roll':false, 'maximize':false},
destroyOnClose:true,
height:130
});
var cancel = new Element('input', {'type': 'button', 'class':'btn-primary', 'value': 'Cancel'}).setStyle('margin-right', "5px");
cancel.setStyle('margin-left', "5px");
cancel.addEvent('click', function(event) {
$(document).addEvent('keydown', designer.keyEventHandler.bindWithEvent(designer));
windoo.close();
}.bindWithEvent(this));
var ok = new Element('input', {'type': 'button', 'class':'btn-primary','value': 'Ok','id':okButtonId}).setStyle('marginRight', 10);
ok.addEvent('click', function(event) {
var couldBeUpdated = okFunction.attempt();
if (couldBeUpdated) {
$(document).addEvent('keydown', designer.keyEventHandler.bindWithEvent(designer));
windoo.close();
}
}.bindWithEvent(this));
var panel = new Element('div', {'styles': {'padding-top': 10, 'text-align': 'right'}}).adopt(ok, cancel);
windoo.addPanel(panel);
$(document).removeEvents('keydown');
return windoo;
};
mindplot.LinkIcon.IMAGE_URL = "../images/world_link.png";

View File

@ -16,12 +16,12 @@
* limitations under the License.
*/
mindplot.Note = new Class({
mindplot.NoteIcon = new Class({
Extends: mindplot.Icon,
initialize : function(topic, noteModel) {
$assert(topic, 'topic can not be null');
this.parent(mindplot.Note.IMAGE_URL);
this.parent(mindplot.NoteIcon.IMAGE_URL);
this._noteModel = noteModel;
this._topic = topic;
@ -37,7 +37,7 @@ mindplot.Note = new Class({
event.stopPropagation();
}.bind(this));
this.tip = new mindplot.widget.FloatingTip(this.getImage()._peer._native, {
this._tip = new mindplot.widget.FloatingTip(this.getImage()._peer._native, {
// Content can also be a function of the target element!
content: function() {
var result = new Element('div');
@ -82,5 +82,5 @@ mindplot.Note = new Class({
}
});
mindplot.Note.IMAGE_URL = "../images/note.png";
mindplot.NoteIcon.IMAGE_URL = "../images/note.png";

View File

@ -33,8 +33,8 @@ mindplot.StandaloneActionDispatcher = new Class({
this.execute(command);
},
addLinkToTopic: function(topicId, url) {
var command = new mindplot.commands.AddLinkToTopicCommand(topicId, url);
changeLinkToTopic: function(topicId, url) {
var command = new mindplot.commands.ChangeLinkToTopicCommand(topicId, url);
this.execute(command);
},

View File

@ -280,7 +280,6 @@ mindplot.Topic = new Class({
//Links
var links = model.getLinks();
for (var i = 0; i < links.length; i++) {
this._hasLink = true;
this._link = new mindplot.LinkIcon(links[i], this, designer);
result.addIcon(this._link);
}
@ -288,22 +287,21 @@ mindplot.Topic = new Class({
//Notes
var notes = model.getNotes();
for (var j = 0; j < notes.length; j++) {
this._hasNote = true;
this._note = new mindplot.Note(this, notes[j]);
this._note = new mindplot.NoteIcon(this, notes[j]);
result.addIcon(this._note);
}
return result;
},
addLink : function(url, designer) {
addLink : function(url) {
var iconGroup = this.getOrBuildIconGroup();
var model = this.getModel();
var linkModel = model.createLink(url);
model.addLink(linkModel);
this._link = new mindplot.LinkIcon(linkModel, this, designer);
this._link = new mindplot.LinkIcon(this, linkModel);
iconGroup.addIcon(this._link);
this._hasLink = true;
this._adjustShapes();
},
@ -314,9 +312,8 @@ mindplot.Topic = new Class({
var noteModel = model.createNote(text);
model.addNote(noteModel);
this._note = new mindplot.Note(this, noteModel);
this._note = new mindplot.NoteIcon(this, noteModel);
iconGroup.addIcon(this._note);
this._hasNote = true;
this._adjustShapes();
},
@ -349,19 +346,18 @@ mindplot.Topic = new Class({
},
removeLink : function() {
// Update model ...
var model = this.getModel();
var links = model.getLinks();
model._removeLink(links[0]);
// Remove UI ...
var iconGroup = this.getIconGroup();
if ($defined(iconGroup)) {
iconGroup.removeIcon(mindplot.LinkIcon.IMAGE_URL);
if (iconGroup.getIcons().length == 0) {
this.get2DElement().removeChild(iconGroup.getNativeElement());
this._iconsGroup = null;
}
iconGroup.removeIconByUrl(mindplot.LinkIcon.IMAGE_URL);
}
this._link = null;
this._hasLink = false;
this._adjustShapes();
},
@ -374,16 +370,19 @@ mindplot.Topic = new Class({
// Remove UI ...
var iconGroup = this.getIconGroup();
if ($defined(iconGroup)) {
iconGroup.removeIconByUrl(mindplot.Note.IMAGE_URL);
iconGroup.removeIconByUrl(mindplot.NoteIcon.IMAGE_URL);
}
this._note = null;
this._hasNote = false;
this._adjustShapes();
},
hasNote : function() {
return this._hasNote;
return this.getModel().getNotes().length != 0;
},
hasLink : function() {
return this.getModel().getLinks().length != 0;
},
addRelationship : function(relationship) {
@ -747,9 +746,8 @@ mindplot.Topic = new Class({
}
}
};
this.closeEditors();
var editor = new mindplot.widget.NoteEditor(editorModel);
this.closeEditors();
editor.show();
},
@ -759,22 +757,22 @@ mindplot.Topic = new Class({
var model = this.getModel();
var editorModel = {
getValue : function() {
// var notes = model.getNotes();
// var result;
// if (notes.length > 0)
// result = notes[0].getText();
//
// return result;
var links = model.getLinks();
var result;
if (links.length > 0)
result = links[0].getUrl();
return result;
},
setValue : function(value) {
// var dispatcher = mindplot.ActionDispatcher.getInstance();
// if (!$defined(value)) {
// dispatcher.removeNoteFromTopic(topicId);
// }
// else {
// dispatcher.changeNoteToTopic(topicId, value);
// }
var dispatcher = mindplot.ActionDispatcher.getInstance();
if (!$defined(value)) {
dispatcher.removeLinkFromTopic(topicId);
}
else {
dispatcher.changeLinkToTopic(topicId, value);
}
}
};

View File

@ -16,7 +16,7 @@
* limitations under the License.
*/
mindplot.commands.AddLinkToTopicCommand = new Class({
mindplot.commands.ChangeLinkToTopicCommand = new Class({
Extends:mindplot.Command,
initialize: function(topicId, url) {
$assert(topicId, 'topicId can not be null');
@ -24,12 +24,25 @@ mindplot.commands.AddLinkToTopicCommand = new Class({
this._url = url;
this._id = mindplot.Command._nextUUID();
},
execute: function(commandContext) {
var topic = commandContext.findTopics(this._objectsIds)[0];
topic.addLink(this._url, commandContext._designer);
if (topic.hasLink()) {
var model = topic.getModel();
var link = model.getLinks()[0];
this._oldUrl = link.getUrl();
topic.removeLink();
}
topic.addLink(this._url);
},
undoExecute: function(commandContext) {
var topic = commandContext.findTopics(this._objectsIds)[0];
topic.removeLink();
if (this._oldtext) {
topic.removeLink();
topic.addLink(this._oldUrl);
} else {
topic.removeLink();
}
}
});

View File

@ -25,7 +25,8 @@ mindplot.commands.ChangeNoteToTopicCommand = new Class({
this._oldtext = null;
this._id = mindplot.Command._nextUUID();
},
execute: function(commandContext) {
execute: function(commandContext) {
var topic = commandContext.findTopics(this._objectsIds)[0];
if (topic.hasNote()) {
var model = topic.getModel();
@ -35,6 +36,7 @@ mindplot.commands.ChangeNoteToTopicCommand = new Class({
}
topic.addNote(this._text);
},
undoExecute: function(commandContext) {
var topic = commandContext.findTopics(this._objectsIds)[0];
if (this._oldtext) {

View File

@ -22,11 +22,15 @@ mindplot.commands.RemoveLinkFromTopicCommand = new Class({
$assert(topicId, 'topicId can not be null');
this._objectsIds = topicId;
},
execute: function(commandContext) {
var topic = commandContext.findTopics(this._objectsIds)[0];
this._url = topic._link.getUrl();
var model = topic.getModel();
var links = model.getLinks()[0];
this._text = links.getUrl();
topic.removeLink();
},
undoExecute: function(commandContext) {
var topic = commandContext.findTopics(this._objectsIds)[0];
topic.addLink(this._url, commandContext._designer);

View File

@ -33,11 +33,7 @@ var MooDialog = new Class({
onBeforeClose: function(){
this.wrapper.setStyle('display', 'none');
this.fireEvent('hide');
}/*,
onOpen: function(){},
onClose: function(){},
onShow: function(){},
onHide: function(){}*/
}
},
initialize: function(options){

View File

@ -20,9 +20,8 @@ mindplot.model.LinkModel = new Class({
initialize : function(url, topic) {
$assert(url, 'url can not be null');
$assert(topic, 'mindmap can not be null');
this._url = url;
this._topic = topic;
this.setUrl(url);
},
getUrl : function() {
@ -31,7 +30,8 @@ mindplot.model.LinkModel = new Class({
setUrl : function(url) {
$assert(url, 'url can not be null');
this._url = url;
this._url = this._fixUrl(url);
this._type = this._url.contains('mailto:') ? 'mail' : 'url';
},
getTopic : function() {
@ -41,4 +41,12 @@ mindplot.model.LinkModel = new Class({
isLinkModel : function() {
return true;
}
,
_fixUrl : function(url) {
var result = url;
if (!result.contains('http://') && !result.contains('https://') && !result.contains('mailto://')) {
result = "http://" + result;
}
return result;
}
});

View File

@ -34,7 +34,7 @@ mindplot.widget.FloatingTip = new Class({
showOn: 'mouseenter',
hideOn: 'mouseleave',
showDelay: 500,
hideDelay: 0,
hideDelay: 250,
className: 'floating-tip',
offset: {x: 0, y: 0},
fx: { 'duration': 'short' }
@ -71,9 +71,13 @@ mindplot.widget.FloatingTip = new Class({
return this;
}
var tip = this._create(element);
if (tip == null) return this;
if (tip == null)
return this;
element.store('floatingtip', tip);
this._animate(tip, 'in');
tip.addEvent(this.options.showOn, this.boundShow);
tip.addEvent(this.options.hideOn, this.boundHide);
this.fireEvent('show', [tip, element]);
return this;
},

View File

@ -64,25 +64,36 @@ mindplot.widget.LinkEditor = new Class({
var result = new Element('div');
var form = new Element('form', {'action': 'none', 'id':'linkFormId'});
// Add textarea ...
var textArea = new Element('textarea', {placeholder: 'Write your note here ...'});
if (model.getValue() != null)
textArea.value = model.getValue();
// Add combo ...
var select = new Element('select');
select.setStyles({margin: '5px'});
new Element('option', {text:'URL'}).inject(select);
new Element('option', {text:'Mail'}).inject(select);
select.inject(form);
textArea.setStyles({'width':'100%', 'height':80,resize: 'none'
});
textArea.inject(form);
// Add Input ...
var input = new Element('input', {placeholder: 'http://www.example.com/',type:'url',required:true});
if (model.getValue() != null)
input.value = model.getValue();
input.setStyles({'width':'70%'});
input.inject(form);
// Register submit event ...
form.addEvent('submit', function(event) {
event.stopPropagation();
event.preventDefault();
model.setValue(input.value);
this.close();
}.bind(this));
// Add buttons ...
var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'center'});
// Create accept button ...
var okButton = new Element('input', {type:'button', value:'Accept','class':'btn-primary'});
var okButton = new Element('input', {type:'submit', value:'Accept','class':'btn-primary'});
okButton.addClass('button');
okButton.addEvent('click', function() {
model.setValue(textArea.value);
this.close();
}.bind(this));
okButton.inject(buttonContainer);
// Create remove button ...
@ -91,16 +102,16 @@ mindplot.widget.LinkEditor = new Class({
rmButton.setStyle('margin', '5px');
rmButton.addClass('button');
rmButton.inject(buttonContainer);
rmButton.addEvent('click', function() {
rmButton.addEvent('click', function(event) {
model.setValue(null);
event.stopPropagation();
this.close();
}.bind(this));
buttonContainer.inject(form);
}
// Create cancel button ...
var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-primary'});
var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-secondary'});
cButton.setStyle('margin', '5px');
cButton.addClass('button');
cButton.inject(buttonContainer);

View File

@ -0,0 +1,91 @@
/*
* Copyright [2011] [wisemapping]
*
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
* It is basically the Apache License, Version 2.0 (the "License") plus the
* "powered by wisemapping" text requirement on every single page;
* you may not use this file except in compliance with the License.
* You may obtain a copy of the license at
*
* http://www.wisemapping.org/license
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
mindplot.widget.LinkIconTooltip = new Class({
Extends: mindplot.widget.FloatingTip,
initialize : function(linkIcon) {
$assert(linkIcon, "linkIcon can not be null");
this.parent(linkIcon.getImage()._peer._native, {
// Content can also be a function of the target element!
content: this._buildContent.pass(linkIcon, this),
html: true,
position: 'bottom',
arrowOffset : 10,
center: true,
arrowSize: 15,
offset : {x:10,y:20}
});
},
_buildContent : function(linkIcon) {
var result = new Element('div');
result.setStyles({
padding:'5px',
width:'100%'
});
var title = new Element('div', {text:'Link'});
title.setStyles({
'font-weight':'bold',
color:'black',
'padding-bottom':'5px',
width: '100px'
});
title.inject(result);
var text = new Element('div', {text: "URL: " + linkIcon.getModel().getUrl()});
text.setStyles({
'white-space': 'pre-wrap',
'word-wrap': 'break-word'
}
);
text.inject(result);
var imgContainer = new Element('div');
imgContainer.setStyles({
width: '100%',
textAlign: 'center',
'padding-bottom':'5px',
'padding-top': '5px'
});
var img = new Element('img', {
src: 'http://open.thumbshots.org/image.pxf?url=' + linkIcon.getModel().getUrl(),
img : linkIcon.getModel().getUrl(),
alt : linkIcon.getModel().getUrl()
}
);
img.setStyles({
padding: '5px'
}
);
var link = new Element('a', {
href : linkIcon.getModel().getUrl(),
alt : 'Open in new window ...',
target : '_blank'
});
img.inject(link);
link.inject(imgContainer);
imgContainer.inject(result);
return result;
}
});

View File

@ -65,24 +65,33 @@ mindplot.widget.NoteEditor = new Class({
var form = new Element('form', {'action': 'none', 'id':'noteFormId'});
// Add textarea ...
var textArea = new Element('textarea', {placeholder: 'Write your note here ...'});
var textArea = new Element('textarea', {placeholder: 'Write your note here ...',required:true});
if (model.getValue() != null)
textArea.value = model.getValue();
textArea.setStyles({'width':'100%', 'height':80,resize: 'none'
textArea.setStyles({
'width':'100%',
'height':80
,resize: 'none'
});
textArea.inject(form);
// Register submit event ...
form.addEvent('submit', function(event) {
event.preventDefault();
event.stopPropagation();
model.setValue(textArea.value);
this.close();
}.bind(this));
// Add buttons ...
var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'center'});
// Create accept button ...
var okButton = new Element('input', {type:'button', value:'Accept','class':'btn-primary'});
var okButton = new Element('input', {type:'submit', value:'Accept','class':'btn-primary'});
okButton.addClass('button');
okButton.addEvent('click', function() {
model.setValue(textArea.value);
this.close();
}.bind(this));
okButton.inject(buttonContainer);
// Create remove button ...
@ -100,7 +109,7 @@ mindplot.widget.NoteEditor = new Class({
// Create cancel button ...
var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-primary'});
var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-secondary'});
cButton.setStyle('margin', '5px');
cButton.addClass('button');
cButton.inject(buttonContainer);

View File

@ -39,7 +39,7 @@ web2d.Group = new Class({
}
if (element == this) {
throw "It's not posible to add the group as a child of itself";
throw "It's not possible to add the group as a child of itself";
}
var elementType = element.getType();

View File

@ -130,7 +130,7 @@ h1 {
}
h3 {
/* use as subhead on main body */
/* use as subhead on main body */
clear: left;
font-style: normal;
font-size: 130%;
@ -138,7 +138,7 @@ h3 {
}
h4 {
/* use as headers in footer */
/* use as headers in footer */
font-weight: bold;
font-size: 120%;
border-bottom: 1px solid #8e9181;
@ -249,7 +249,7 @@ span#headerSubTitle {
}
div#headerButtons a:hover {
/*text-decoration: underline;*/
/*text-decoration: underline;*/
color: #7e72ad;
}
@ -346,57 +346,84 @@ div#printLogo {
}
.btn-primary {
cursor: pointer;
display: inline-block;
background-color: #e6e6e6;
background-repeat: no-repeat;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
padding: 5px 14px 6px;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
color: #333;
font-size: 13px;
line-height: normal;
border: 1px solid #ccc;
border-bottom-color: #bbb;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-webkit-transition: 0.1s linear all;
-moz-transition: 0.1s linear all;
-ms-transition: 0.1s linear all;
-o-transition: 0.1s linear all;
transition: 0.1s linear all;
color: #ffffff;
background-color: #0064cd;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd));
background-image: -moz-linear-gradient(top, #049cdb, #0064cd);
background-image: -ms-linear-gradient(top, #049cdb, #0064cd);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd));
background-image: -webkit-linear-gradient(top, #049cdb, #0064cd);
background-image: -o-linear-gradient(top, #049cdb, #0064cd);
background-image: linear-gradient(top, #049cdb, #0064cd);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
border-color: #0064cd #0064cd #003f81;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
cursor: pointer;
display: inline-block;
padding: 5px 14px 6px;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
color: #333;
font-size: 13px;
line-height: normal;
border: 1px solid #ccc;
border-bottom-color: #bbb;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-webkit-transition: 0.1s linear all;
-moz-transition: 0.1s linear all;
-ms-transition: 0.1s linear all;
-o-transition: 0.1s linear all;
transition: 0.1s linear all;
color: #ffffff;
background-color: #0064cd;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd));
background-image: -moz-linear-gradient(top, #049cdb, #0064cd);
background-image: -ms-linear-gradient(top, #049cdb, #0064cd);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd));
background-image: -webkit-linear-gradient(top, #049cdb, #0064cd);
background-image: -o-linear-gradient(top, #049cdb, #0064cd);
background-image: linear-gradient(top, #049cdb, #0064cd);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#049cdb', endColorstr = '#0064cd', GradientType = 0);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
border-color: #0064cd #0064cd #003f81;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}
.btn-primary:hover {
background-position: 0 -15px;
/*color: #333;*/
text-decoration: none;
background-position: 0 -15px;
text-decoration: none;
}
.btn-secondary {
cursor: pointer;
display: inline-block;
background-color: #e6e6e6;
background-repeat: no-repeat;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#e6e6e6', GradientType = 0);
padding: 5px 14px 6px;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
color: #333;
font-size: 13px;
line-height: normal;
border: 1px solid #ccc;
border-bottom-color: #bbb;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-webkit-transition: 0.1s linear all;
-moz-transition: 0.1s linear all;
-ms-transition: 0.1s linear all;
-o-transition: 0.1s linear all;
transition: 0.1s linear all;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.btn-secondary:hover {
background-position: 0 -15px;
text-decoration: none;
}
div#paypal {
float: left;
@ -610,30 +637,28 @@ span.fieldRequired {
padding: 5px;
}
div.installCFG {
width:100%;
font-size:130%;
width: 100%;
font-size: 130%;
}
div.installCFG h1{
width:100%;
font-size:130%;
div.installCFG h1 {
width: 100%;
font-size: 130%;
}
div.installCFG h2{
font-size:100%;
border-bottom:0 solid black;
div.installCFG h2 {
font-size: 100%;
border-bottom: 0 solid black;
}
.chromeFrameInstallDefaultStyle {
position:relative;
left:0;
top:0;
margin:0;
position: relative;
left: 0;
top: 0;
margin: 0;
}
.floating-tip {
background-color: #dfcf3c;
padding: 5px 15px;
@ -645,4 +670,5 @@ div.installCFG h2{
-webkit-border-radius: 3px;
border-radius: 3px;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 957 B