default font and font description
* Use interface font as default font * Work with a `Pango.FontDescription` instead of separate font properties.
This commit is contained in:
abakkk
parent
5af13a1e12
commit
f9769c11f2
52
area.js
52
area.js
|
|
@ -37,6 +37,7 @@ const Main = imports.ui.main;
|
|||
const Screenshot = imports.ui.screenshot;
|
||||
|
||||
const Me = ExtensionUtils.getCurrentExtension();
|
||||
const Convenience = ExtensionUtils.getSettings ? ExtensionUtils : Me.imports.convenience;
|
||||
const Elements = Me.imports.elements;
|
||||
const Files = Me.imports.files;
|
||||
const Menu = Me.imports.menu;
|
||||
|
|
@ -84,16 +85,14 @@ var DrawingArea = new Lang.Class({
|
|||
|
||||
this.elements = [];
|
||||
this.undoneElements = [];
|
||||
this.defaultFontFamily = 'Cantarell';
|
||||
this.currentElement = null;
|
||||
this.currentTool = Shapes.NONE;
|
||||
this.currentImage = 0;
|
||||
this.currentFontFamily = this.defaultFontFamily;
|
||||
this.currentFontStyle = Pango.Style.NORMAL;
|
||||
this.currentFontWeight = Pango.Weight.NORMAL;
|
||||
this.currentFontStretch = Pango.Stretch.NORMAL;
|
||||
this.currentFontVariant = Pango.Variant.NORMAL;
|
||||
this.currentTextRightAligned = false;
|
||||
this.currentTextRightAligned = Clutter.get_default_text_direction() == Clutter.TextDirection.RTL;
|
||||
let fontName = St.Settings && St.Settings.get().font_name || Convenience.getSettings('org.gnome.desktop.interface').get_string('font-name');
|
||||
this.currentFont = Pango.FontDescription.from_string(fontName);
|
||||
this.currentFont.unset_fields(Pango.FontMask.SIZE);
|
||||
this.defaultFontFamily = this.currentFont.get_family();
|
||||
this.currentLineWidth = 5;
|
||||
this.currentLineJoin = Cairo.LineJoin.ROUND;
|
||||
this.currentLineCap = Cairo.LineCap.ROUND;
|
||||
|
|
@ -104,8 +103,6 @@ var DrawingArea = new Lang.Class({
|
|||
this.textHasCursor = false;
|
||||
this.dashedLine = false;
|
||||
this.fill = false;
|
||||
this.newThemeAttributes = {};
|
||||
this.oldThemeAttributes = {};
|
||||
|
||||
this.connect('destroy', this._onDestroy.bind(this));
|
||||
this.connect('notify::reactive', this._onReactiveChanged.bind(this));
|
||||
|
|
@ -154,6 +151,30 @@ var DrawingArea = new Lang.Class({
|
|||
this.colors.push(Clutter.Color.get_static(Clutter.StaticColor.WHITE));
|
||||
},
|
||||
|
||||
get currentFontFamily() {
|
||||
return this.currentFont.get_family();
|
||||
},
|
||||
|
||||
set currentFontFamily(family) {
|
||||
this.currentFont.set_family(family);
|
||||
},
|
||||
|
||||
get currentFontStyle() {
|
||||
return this.currentFont.get_style();
|
||||
},
|
||||
|
||||
set currentFontStyle(style) {
|
||||
this.currentFont.set_style(style);
|
||||
},
|
||||
|
||||
get currentFontWeight() {
|
||||
return this.currentFont.get_weight();
|
||||
},
|
||||
|
||||
set currentFontWeight(weight) {
|
||||
this.currentFont.set_weight(weight);
|
||||
},
|
||||
|
||||
get hasManipulationTool() {
|
||||
// No Object.values method in GS 3.24.
|
||||
return Object.keys(Manipulations).map(key => Manipulations[key]).indexOf(this.currentTool) != -1;
|
||||
|
|
@ -573,12 +594,7 @@ var DrawingArea = new Lang.Class({
|
|||
shape: this.currentTool,
|
||||
color: this.currentColor.to_string(),
|
||||
eraser: eraser,
|
||||
font: {
|
||||
family: this.currentFontFamily,
|
||||
weight: this.currentFontWeight,
|
||||
style: this.currentFontStyle,
|
||||
stretch: this.currentFontStretch,
|
||||
variant: this.currentFontVariant },
|
||||
font: this.currentFont.to_string(),
|
||||
text: _("Text"),
|
||||
textRightAligned: this.currentTextRightAligned,
|
||||
points: []
|
||||
|
|
@ -930,7 +946,7 @@ var DrawingArea = new Lang.Class({
|
|||
let index = fontWeights.indexOf(this.currentFontWeight);
|
||||
this.currentFontWeight = index == fontWeights.length - 1 ? fontWeights[0] : fontWeights[index + 1];
|
||||
if (this.currentElement && this.currentElement.font) {
|
||||
this.currentElement.font.weight = this.currentFontWeight;
|
||||
this.currentElement.font.set_weight(this.currentFontWeight);
|
||||
this._redisplay();
|
||||
}
|
||||
this.emit('show-osd', null, `<span font_weight="${this.currentFontWeight}">` +
|
||||
|
|
@ -940,7 +956,7 @@ var DrawingArea = new Lang.Class({
|
|||
switchFontStyle: function() {
|
||||
this.currentFontStyle = this.currentFontStyle == 2 ? 0 : this.currentFontStyle + 1;
|
||||
if (this.currentElement && this.currentElement.font) {
|
||||
this.currentElement.font.style = this.currentFontStyle;
|
||||
this.currentElement.font.set_style(this.currentFontStyle);
|
||||
this._redisplay();
|
||||
}
|
||||
this.emit('show-osd', null, `<span font_style="${FontStyleNames[this.currentFontStyle].toLowerCase()}">` +
|
||||
|
|
@ -954,7 +970,7 @@ var DrawingArea = new Lang.Class({
|
|||
else
|
||||
this.currentFontFamily = (index == this.fontFamilies.length - 1) ? this.fontFamilies[0] : this.fontFamilies[index + 1];
|
||||
if (this.currentElement && this.currentElement.font) {
|
||||
this.currentElement.font.family = this.currentFontFamily;
|
||||
this.currentElement.font.set_family(this.currentFontFamily);
|
||||
this._redisplay();
|
||||
}
|
||||
this.emit('show-osd', null, `<span font_family="${this.currentFontFamily}">${_(this.currentFontFamily)}</span>`, "", -1, false);
|
||||
|
|
|
|||
60
elements.js
60
elements.js
|
|
@ -44,8 +44,6 @@ var FillRuleNames = { 0: 'Nonzero', 1: 'Evenodd' };
|
|||
var FontWeightNames = Object.assign(reverseEnumeration(Pango.Weight), { 200: "Ultra-light", 350: "Semi-light", 600: "Semi-bold", 800: "Ultra-bold" });
|
||||
delete FontWeightNames[Pango.Weight.ULTRAHEAVY];
|
||||
var FontStyleNames = reverseEnumeration(Pango.Style);
|
||||
const FontStretchNames = reverseEnumeration(Pango.Stretch);
|
||||
const FontVariantNames = reverseEnumeration(Pango.Variant);
|
||||
|
||||
var getPangoFontFamilies = function() {
|
||||
return PangoCairo.font_map_get_default().list_families().map(fontFamily => fontFamily.get_name()).sort((a,b) => a.localeCompare(b));
|
||||
|
|
@ -85,6 +83,17 @@ const _DrawingElement = new Lang.Class({
|
|||
this.font.weight = 400;
|
||||
if (params.font && params.font.weight === 1)
|
||||
this.font.weight = 700;
|
||||
if (params.font && typeof params.font != 'string') {
|
||||
// compatibility with v6.2-
|
||||
let font = new Pango.FontDescription();
|
||||
['family', 'weight', 'style', 'stretch', 'variant'].forEach(attribute => {
|
||||
if (params.font[attribute] !== undefined)
|
||||
try {
|
||||
font[`set_${attribute}`](params.font[attribute]);
|
||||
} catch(e) {}
|
||||
});
|
||||
this.font = font.to_string();
|
||||
}
|
||||
|
||||
if (params.transform && params.transform.center) {
|
||||
let angle = (params.transform.angle || 0) + (params.transform.startAngle || 0);
|
||||
|
|
@ -594,7 +603,15 @@ const TextElement = new Lang.Class({
|
|||
Name: 'DrawOnYourScreenTextElement',
|
||||
Extends: _DrawingElement,
|
||||
|
||||
_init: function(params) {
|
||||
this.parent(params);
|
||||
this.font = Pango.FontDescription.from_string(this.font);
|
||||
},
|
||||
|
||||
toJSON: function() {
|
||||
// The font size is useless because it is always computed from the points during cairo/svg building.
|
||||
this.font.unset_fields(Pango.FontMask.SIZE);
|
||||
|
||||
return {
|
||||
shape: this.shape,
|
||||
color: this.color,
|
||||
|
|
@ -603,7 +620,7 @@ const TextElement = new Lang.Class({
|
|||
text: this.text,
|
||||
lineIndex: this.lineIndex !== undefined ? this.lineIndex : undefined,
|
||||
textRightAligned: this.textRightAligned,
|
||||
font: this.font,
|
||||
font: this.font.to_string(),
|
||||
points: this.points.map((point) => [Math.round(point[0]*100)/100, Math.round(point[1]*100)/100])
|
||||
};
|
||||
},
|
||||
|
|
@ -630,15 +647,8 @@ const TextElement = new Lang.Class({
|
|||
if (this.points.length == 2) {
|
||||
let layout = PangoCairo.create_layout(cr);
|
||||
let fontSize = this.height * Pango.SCALE;
|
||||
let fontDescription = new Pango.FontDescription();
|
||||
fontDescription.set_absolute_size(fontSize);
|
||||
['family', 'weight', 'style', 'stretch', 'variant'].forEach(attribute => {
|
||||
if (this.font[attribute] !== undefined)
|
||||
try {
|
||||
fontDescription[`set_${attribute}`](this.font[attribute]);
|
||||
} catch(e) {}
|
||||
});
|
||||
layout.set_font_description(fontDescription);
|
||||
this.font.set_absolute_size(fontSize);
|
||||
layout.set_font_description(this.font);
|
||||
layout.set_text(this.text, -1);
|
||||
this.textWidth = layout.get_pixel_size()[0];
|
||||
cr.moveTo(this.x, this.y - layout.get_baseline() / Pango.SCALE);
|
||||
|
|
@ -681,19 +691,21 @@ const TextElement = new Lang.Class({
|
|||
attributes = `fill="${color}" ` +
|
||||
`stroke="transparent" ` +
|
||||
`stroke-opacity="0" ` +
|
||||
`font-size="${height}"`;
|
||||
|
||||
if (this.font.family)
|
||||
attributes += ` font-family="${this.font.family}"`;
|
||||
if (this.font.weight && this.font.weight != Pango.Weight.NORMAL)
|
||||
attributes += ` font-weight="${this.font.weight}"`;
|
||||
if (this.font.style && FontStyleNames[this.font.style])
|
||||
attributes += ` font-style="${FontStyleNames[this.font.style].toLowerCase()}"`;
|
||||
if (FontStretchNames[this.font.stretch] && this.font.stretch != Pango.Stretch.NORMAL)
|
||||
attributes += ` font-stretch="${FontStretchNames[this.font.stretch].toLowerCase()}"`;
|
||||
if (this.font.variant && FontVariantNames[this.font.variant])
|
||||
attributes += ` font-variant="${FontVariantNames[this.font.variant].toLowerCase()}"`;
|
||||
`font-size="${height}" ` +
|
||||
`font-family="${this.font.get_family()}"`;
|
||||
|
||||
// this.font.to_string() is not valid to fill the svg 'font' shorthand property.
|
||||
// Each property must be filled separately.
|
||||
['Stretch', 'Style', 'Variant'].forEach(attribute => {
|
||||
let lower = attribute.toLowerCase();
|
||||
if (this.font[`get_${lower}`]() != Pango[attribute].NORMAL) {
|
||||
let font = new Pango.FontDescription();
|
||||
font[`set_${lower}`](this.font[`get_${lower}`]());
|
||||
attributes += ` font-${lower}="${font.to_string()}"`;
|
||||
}
|
||||
});
|
||||
if (this.font.get_weight() != Pango.Weight.NORMAL)
|
||||
attributes += ` font-weight="${this.font.get_weight()}"`;
|
||||
row += `<text ${attributes} x="${x}" `;
|
||||
row += `y="${y}"${transAttribute}>${this.text}</text>`;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue