[ADD] WIP link combo

bzr revid: xmo@openerp.com-20131028152342-5clhbwwwfcdxxxq0
This commit is contained in:
Xavier Morel 2013-10-28 16:23:42 +01:00
parent 2196a69a61
commit 0db0f20bda
2 changed files with 154 additions and 11 deletions

View File

@ -129,7 +129,6 @@
element = selection.getSelectedElement(),
elementPath = editor.elementPath( element ),
counter = [ 0, 0, 0, 0 ];
this.showAll();
this.unmarkAll();
for ( var name in styles ) {

View File

@ -174,6 +174,157 @@
}
});
CKEDITOR.plugins.add('bootstrapcombo', {
requires: 'richcombo',
init: function (editor) {
var config = editor.config;
editor.ui.addRichCombo('BootstrapLinkCombo', {
// default title
label: "Links",
// hover
title: "Link styling",
toolbar: 'styles,10',
allowedContent: ['a'],
panel: {
css: [
'/website/static/lib/bootstrap/css/bootstrap.css',
CKEDITOR.skin.getPath( 'editor' )
].concat( config.contentsCss ),
multiSelect: true,
},
types: {
'basic': 'btn-default',
'primary': 'btn-primary',
'success': 'btn-success',
'info': 'btn-info',
'warning': 'btn-warning',
'danger': 'btn-danger',
},
sizes: {
'large': 'btn-lg',
'default': '',
'small': 'btn-sm',
'extra small': 'btn-xs',
},
init: function () {
this.add('', 'Reset');
this.startGroup("Types");
for(var type in this.types) {
if (!this.types.hasOwnProperty(type)) { continue; }
var cls = this.types[type];
var el = _.str.sprintf(
'<span class="btn %s">%s</span>',
cls, type);
this.add(type, el);
}
this.startGroup("Sizes");
for (var size in this.sizes) {
if (!this.sizes.hasOwnProperty(size)) { continue; }
cls = this.sizes[size];
el = _.str.sprintf(
'<span class="btn btn-default %s">%s</span>',
cls, size);
this.add(size, el);
}
this.commit();
},
onRender: function () {
var self = this;
editor.on('selectionChange', function (e) {
var path = e.data.path, el;
if (!(el = path.contains('a'))) {
self.element = null;
self.disable();
return;
}
self.enable();
// This is crap, but getting the currently selected
// element from within onOpen absolutely does not
// work, so store the "current" element in the
// widget instead
self.element = el;
});
setTimeout(function () {
// Because I can't find any normal hook where the
// bloody button's bloody element is available
self.disable();
}, 0);
},
onOpen: function () {
this.showAll();
this.unmarkAll();
for(var val in this.types) {
if (!this.types.hasOwnProperty(val)) { continue; }
var cls = this.types[val];
if (!this.element.hasClass(cls)) { continue; }
this.mark(val);
break;
}
var found;
for(val in this.sizes) {
if (!this.sizes.hasOwnProperty(val)) { continue; }
cls = this.sizes[val];
if (!cls || !this.element.hasClass(cls)) { continue; }
found = true;
this.mark(val);
break;
}
if (!found && this.element.hasClass('btn')) {
this.mark('default');
}
},
onClick: function (value) {
editor.focus();
editor.fire('saveShapshot');
// basic btn setup
var el = this.element;
if (!el.hasClass('btn')) {
el.addClass('btn');
el.addClass('btn-default');
}
if (!value) {
this.setClass(this.types);
this.setClass(this.sizes);
el.removeClass('btn');
} else if (value in this.types) {
this.setClass(this.types, value);
} else if (value in this.sizes) {
this.setClass(this.sizes, value);
}
editor.fire('saveShapshot');
},
setClass: function (classMap, value) {
var element = this.element;
_(classMap).each(function (cls) {
if (!cls) { return; }
element.removeClass(cls);
}.bind(this));
var cls = classMap[value];
if (cls) {
element.addClass(cls);
}
}
});
},
});
var editor = new website.EditorBar();
var $body = $(document.body);
editor.prependTo($body).then(function () {
@ -566,7 +717,7 @@
fillEmptyBlocks: false,
filebrowserImageUploadUrl: "/website/attach",
// Support for sharedSpaces in 4.x
extraPlugins: 'sharedspace,customdialogs,tablebutton,oeref',
extraPlugins: 'sharedspace,customdialogs,tablebutton,oeref,bootstrapcombo',
// Place toolbar in controlled location
sharedSpaces: { top: 'oe_rte_toolbar' },
toolbar: [{
@ -588,7 +739,7 @@
"Image", "TableButton"
]},{
name: 'styles', items: [
"Styles"
"Styles", "BootstrapLinkCombo"
]}
],
// styles dropdown in toolbar
@ -601,14 +752,7 @@
{name: "Heading 5", element: 'h5'},
{name: "Heading 6", element: 'h6'},
{name: "Formatted", element: 'pre'},
{name: "Address", element: 'address'},
// emphasis
{name: "Muted", element: 'span', attributes: {'class': 'text-muted'}},
{name: "Primary", element: 'span', attributes: {'class': 'text-primary'}},
{name: "Warning", element: 'span', attributes: {'class': 'text-warning'}},
{name: "Danger", element: 'span', attributes: {'class': 'text-danger'}},
{name: "Success", element: 'span', attributes: {'class': 'text-success'}},
{name: "Info", element: 'span', attributes: {'class': 'text-info'}}
{name: "Address", element: 'address'}
],
};
},