Skip to content

Commit

Permalink
GUI: Toolbar updates
Browse files Browse the repository at this point in the history
  • Loading branch information
andersevenrud committed Nov 13, 2014
1 parent fc988dc commit 19a5465
Show file tree
Hide file tree
Showing 5 changed files with 118 additions and 36 deletions.
16 changes: 16 additions & 0 deletions src/javascript/gui/richtext.js
Original file line number Diff line number Diff line change
Expand Up @@ -152,6 +152,15 @@
return false;
};

RichText.prototype.commandValue = function(q) {
try {
return this.getDocument().queryCommandValue(q);
} catch ( e ) {
console.warn('RichText::commandValue()', q, 'error', e, e.stack);
}
return null;
};

RichText.prototype.setContent = function(c) {
this.hasChanged = false;
this.strlen = c.length;
Expand Down Expand Up @@ -188,6 +197,13 @@
return null;
};

RichText.prototype.getWindow = function() {
if ( this.$view ) {
return this.$view.contentWindow;
}
return null;
};

RichText.prototype.blur = function() {
if ( !GUIElement.prototype.blur.apply(this, arguments) ) { return false; }
if ( this.$view && this.$view.contentWindow ) {
Expand Down
16 changes: 5 additions & 11 deletions src/javascript/gui/toolbar.js
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,10 @@
var item = self.items[i] || null;
var el = document.createElement('li');

if ( item ) {
self.items[i]._element = el;
}

if ( !item ) {
el.className = 'Separator ' + i;
self.$container.appendChild(el);
Expand Down Expand Up @@ -149,17 +153,7 @@
};

ToolBar.prototype.getItem = function(name) {
var result = null;
if ( this.$container ) {
this.$container.childNodes.forEach(function(child, i) {
if ( (new RegExp(name)).test(child.className) ) {
result = child;
return false;
}
return true;
});
}
return result;
return this.items[name];
};

/////////////////////////////////////////////////////////////////////////////
Expand Down
6 changes: 3 additions & 3 deletions src/javascript/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -423,9 +423,9 @@
}

var hex = [
(r).toString( 16 ),
(g).toString( 16 ),
(b).toString( 16 )
parseInt(r, 10).toString( 16 ),
parseInt(g, 10).toString( 16 ),
parseInt(b, 10).toString( 16 )
];

Object.keys(hex).forEach(function(i) {
Expand Down
10 changes: 5 additions & 5 deletions src/packages/default/Draw/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -349,22 +349,22 @@
self.currentStyle[type] = hex;
if ( toolBar ) {
var className = (type == "fg") ? "foregroundColor" : "backgroundColor";
toolBar.getItem(className).getElementsByClassName('Color')[0].style.backgroundColor = hex;
toolBar.getItem(className)._element.getElementsByClassName('Color')[0].style.backgroundColor = hex;
}
};

var _selectLineJoin = function(type) {
var txt = {round: "Round", miter: "Miter", bevel: "Bevel"};
self.currentStyle.lineJoin = type;
if ( toolBar ) {
toolBar.getItem('lineJoin').getElementsByClassName('LineJoin')[0].innerHTML = _(txt[type]);
toolBar.getItem('lineJoin')._element.getElementsByClassName('LineJoin')[0].innerHTML = _(txt[type]);
}
};

var _selectLineWidth = function(width) {
self.currentStyle.lineWidth = width;
if ( toolBar ) {
toolBar.getItem('lineWidth').getElementsByClassName('LineWidth')[0].innerHTML = width;
toolBar.getItem('lineWidth')._element.getElementsByClassName('LineWidth')[0].innerHTML = width;
}
};

Expand All @@ -375,7 +375,7 @@
self.currentStyle.stroke = !self.currentStyle.stroke;
}
if ( toolBar ) {
toolBar.getItem('enableStroke').getElementsByClassName('EnableStroke')[0].innerHTML = _(self.currentStyle.stroke ? "Stroked" : "No stroke");
toolBar.getItem('enableStroke')._element.getElementsByClassName('EnableStroke')[0].innerHTML = _(self.currentStyle.stroke ? "Stroked" : "No stroke");
}
};

Expand Down Expand Up @@ -916,7 +916,7 @@
var toolBar = this._getGUIElement('ApplicationDrawToolBar');
if ( toolBar ) {
var className = (type == "fg") ? "foregroundColor" : "backgroundColor";
toolBar.getItem(className).getElementsByClassName('Color')[0].style.backgroundColor = val;
toolBar.getItem(className)._element.getElementsByClassName('Color')[0].style.backgroundColor = val;
}

this._focus();
Expand Down
106 changes: 89 additions & 17 deletions src/packages/default/Writer/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
* @author Anders Evenrud <[email protected]>
* @licence Simplified BSD License
*/
(function(Application, Window, GUI, Dialogs, VFS) {
(function(Application, Window, GUI, Dialogs, VFS, Utils) {
'use strict';

/////////////////////////////////////////////////////////////////////////////
Expand Down Expand Up @@ -86,6 +86,7 @@
// Create window contents here
var mb = this._addGUIElement(new GUI.MenuBar('WriterMenuBar'), root);
var tb = this._addGUIElement(new GUI.ToolBar('WriterToolBar'), root);
var rt;

var _createIcon = function(i) {
return OSjs.API.getThemeResource(i, 'icon');
Expand All @@ -105,23 +106,29 @@
}], self);
};

var _setFont = function(name, size) {
self.command('fontName', name);
self.command('fontSize', size);
self.font = name;
self.fontSize = size;
tb.getItem('font').getElementsByTagName('span')[0].style.fontFamily = name;
tb.getItem('font').getElementsByTagName('span')[0].innerHTML = name + ' (' + size + ')';
var _setFont = function(name, size, nocommand) {
if ( !nocommand ) {
self.command('fontName', name);
self.command('fontSize', size);
}
self.font = name || self.font;
self.fontSize = size || self.fontSize;
tb.getItem('font')._element.getElementsByTagName('span')[0].style.fontFamily = self.font;
tb.getItem('font')._element.getElementsByTagName('span')[0].innerHTML = self.font + ' (' + self.fontSize.toString() + ')';
};
var _setTextColor = function(hex) {
self.command('foreColor', hex);
var _setTextColor = function(hex, nocommand) {
if ( !nocommand ) {
self.command('foreColor', hex);
}
self.textColor = hex;
tb.getItem('textColor').getElementsByTagName('span')[0].style.color = hex;
tb.getItem('textColor')._element.getElementsByTagName('span')[0].style.color = hex;
};
var _setBackColor = function(hex) {
self.command('hiliteColor', hex);
var _setBackColor = function(hex, nocommand) {
if ( !nocommand ) {
self.command('hiliteColor', hex);
}
self.backColor = hex;
tb.getItem('backColor').getElementsByTagName('span')[0].style.backgroundColor = hex;
tb.getItem('backColor')._element.getElementsByTagName('span')[0].style.backgroundColor = hex;
};

var _action = function(ev, el, name, item) {
Expand Down Expand Up @@ -150,6 +157,64 @@
}
};

function _updateToolbar() {
if ( rt ) {
var styles = {
fontName: rt.commandValue('fontName').replace(/^\'/, '').replace(/\'$/, ''),
fontSize: rt.commandValue('fontSize'),
foreColor: rt.commandValue('foreColor'),
hiliteColor: rt.commandValue('hiliteColor'),
justifyLeft: rt.commandValue('justifyLeft'),
justifyCenter: rt.commandValue('justifyCenter'),
justifyRight: rt.commandValue('justifyRight'),
bold: rt.commandValue('bold'),
italic: rt.commandValue('italic'),
underline: rt.commandValue('underline'),
strikeThrough: rt.commandValue('strikeThrough')
};

if ( !styles.foreColor.match(/^\#/) ) {
var tmp = styles.foreColor.replace(/\s/g, '').replace(/^rgb\(/, '').replace(/\)$/, '').split(',');
if ( tmp.length > 2 ) {
styles.foreColor = Utils.convertToHEX.apply(Utils, tmp);
} else {
styles.foreColor = self.textColor;
}
}

if ( !styles.hiliteColor.match(/^\#/) ) {
var tmp = styles.hiliteColor.replace(/\s/g, '').replace(/^rgb\(/, '').replace(/\)$/, '').split(',');
if ( tmp.length > 2 ) {
styles.hiliteColor = Utils.convertToHEX.apply(Utils, tmp);
} else {
styles.hiliteColor = self.backColor;
}
}

_setBackColor(styles.hiliteColor, true);
_setTextColor(styles.foreColor, true);
_setFont(styles.fontName, styles.fontSize, true);

/*
if ( tb ) {
Utils.$removeClass(tb.getItem('justifyLeft')._element, 'Active');
Utils.$removeClass(tb.getItem('justifyCenter')._element, 'Active');
Utils.$removeClass(tb.getItem('justifyRight')._element, 'Active');
if ( styles.justifyLeft ) {
Utils.$addClass(tb.getItem('justifyLeft')._element, 'Active');
}
if ( styles.justifyCenter ) {
Utils.$addClass(tb.getItem('justifyCenter')._element, 'Active');
}
if ( styles.justifyRight ) {
Utils.$addClass(tb.getItem('justifyRight')._element, 'Active');
}
}
*/
}
}

tb.addItem('bold', {toggleable: true, title: OSjs.API._('LBL_BOLD'), onClick: _action, icon: _createIcon('actions/format-text-bold.png')});
tb.addItem('italic', {toggleable: true, title: OSjs.API._('LBL_ITALIC'), onClick: _action, icon: _createIcon('actions/format-text-italic.png')});
tb.addItem('underline', {toggleable: true, title: OSjs.API._('LBL_UNDERLINE'), onClick: _action, icon: _createIcon('actions/format-text-underline.png')});
Expand All @@ -170,7 +235,14 @@
tb.render();
tb.addItem('indent', {title: OSjs.API._('LBL_INDENT'), onClick: _action, icon: _createIcon('actions/gtk-indent-ltr.png')});

var rt = this._addGUIElement(new GUI.RichText('WriterRichText'), root);
rt = this._addGUIElement(new GUI.RichText('WriterRichText', {onInited: function() {
rt.getWindow().addEventListener('selectstart', function() {
_updateToolbar();
});
rt.getWindow().addEventListener('mouseup', function() {
_updateToolbar();
});
}}), root);

/*
var sb = this._addGUIElement(new GUI.StatusBar('WriterStatusBar'), root);
Expand Down Expand Up @@ -267,7 +339,7 @@

var t = DEFAULT_FILENAME;
if ( file ) {
t = OSjs.Utils.filename(file);
t = Utils.filename(file);
}

this._setTitle(this.title + " - " + t);
Expand Down Expand Up @@ -376,4 +448,4 @@
OSjs.Applications = OSjs.Applications || {};
OSjs.Applications.ApplicationWriter = ApplicationWriter;

})(OSjs.Helpers.DefaultApplication, OSjs.Helpers.DefaultApplicationWindow, OSjs.GUI, OSjs.Dialogs, OSjs.VFS);
})(OSjs.Helpers.DefaultApplication, OSjs.Helpers.DefaultApplicationWindow, OSjs.GUI, OSjs.Dialogs, OSjs.VFS, OSjs.Utils);

0 comments on commit 19a5465

Please sign in to comment.