Posts

HTML Renderer (Emacs)

Image
  Emacs: A non-intrusive browser An Elisp implementation of HTML rendering using SVG. The browser functionality is an extension of eww . For Javascript, you can use either NodeJS or QuickJS as a JS interpreter . Developer Note: The entry point is shr-render.   Table Colspan example Rowspan example Sample Table <html>   <body>     <table border="1">       <tr bgcolor="#9acd32">         <th style="text-align:left">Title</th>         <th style="text-align:left">Artist</th>       </tr>       <tr>         <td>Empire Burlesque</td>         <td>Bob Dylan</td>       </tr>     </table>   </body> </html...
Post a Comment
Read more

The Oval Editor (Emacs)

Image
   The Oval Editor is a feature which allows the user to combine text with advanced formatting and drawings seamlessly in Emacs. This is an amalgamation of several disparate features developed over a period of time . It is also available as a single package in my Emacs fork . Draw and Scribble Notes in GNU Emacs   Text inside a shape (uses librsvg fork ) Context menu   Variable fonts Faux Bold and Italics   Annotate Completion Candidates   Text wrap at fixed pixel width in edit mode (only available in my Emacs fork) Symbol selector     (require 'formula)    Use M-x formula-draw to start drawing in a buffer. Select rectangle shape by pressing r. You can use the grid lines to align the shapes. You may exit the drawing mode by pressing q. Double-click on the shape to start editing the text inside a shape. The editing area is restricted to the width of the enclosing shape. Use right-click context menu to apply formatting. The demo use...
Post a Comment
Read more

Variable Font in Emacs

Image
Variable fonts are an evolution of the OpenType font specification that enables many different variations of a typeface to be incorporated into a single file, rather than having a separate font file for every width, weight, or style. Please note that the fonts are designed for readability. These are not simple geometric transformations. Hence, the fonts may or may not support full range of variations specified by the standards. Font weight ranges from 100 to 900 for variable fonts. For static fonts, this range is between 0 to 215. You can use FcWeightToOpenTypeDouble() for converting static font weight to variable font weight. Font width ranges from 50 to 200. This is a percentage value. For example, ultra-expanded is 200% of normal width. This is same for static font. In Emacs, use :weight and :width face attributes for setting the values. cairo_font_options_set_variations() Cairo API can be used to render these variations in Emacs. Please note that the sequence of axes - wght...
Post a Comment
Read more

Faux Bold and Italic

Image
Faux bold and italic using Freetype API   Modern Outline fonts (Truetype and Opentype) have a separate file for each weight and style for better readability. They are usually suffixed as normal, Bold, Italic and Bold-Italic. This means that one cannot render these variants if the font files are missing. From the end user perspective this is annoying at times. Following APIs can be used to generate faux bold and italic variants.   Freetype API   cairo_ft_font_face_set_synthesize (font_face, CAIRO_FT_SYNTHESIZE_BOLD                      | CAIRO_FT_SYNTHESIZE_OBLIQUE);   Cairo transformation API Use x-stretch transformation for bold and skew transformation for italic. cairo_matrix_t font_matrix;   font_matrix.xx *= 1.5; // Bold - stretch font_matrix.xy = -5;     // Italic - skew   Harfbuzz API This didn't work for me.  hb_font_set_synthetic_slant(fon...
Post a Comment
Read more

Annotate completion candidates (GNU Emacs)

Image
GNU Emacs supports annotation for completion candidates. An annotation is a small bit of useful information shown next to a completion candidate which a package developer can use to provide additional help to the user while making a selection. e.g. while selecting a command, this is usually the keyboard shortcut. In the following example, annotation is used to display a sample text with the candidate font-family applied.  (defun test ()   (interactive)   (let* (( completion-extra-properties           `(:annotation-function         (lambda (a)           (propertize " (OIly10)" 'face               `(:family ,a :background "grey"))))))     (completing-read "Font family: " (font-family-list))     ))   By default , Emacs uses completions-annotations face for the annotation...
Post a Comment
Read more

Text along a path (GNU Emacs)

Image
  SVG 2 specifications allows flowing text along a curve via textPath element. This opens up possibilities for cool text effects e.g. Formula Editor in GNU Emacs . GNU Emacs uses librsvg for SVG rendering on GNU/Linux. This fix for librsvg was  available in 2014 [4]. But this wasn't applied for some reason. Librsvg has moved to Rust since then. The code below is pre-Rust version of librsvg. sample.svg <?xml version="1.0" encoding="UTF-8"?> <svg height="300" width="800" xmlns="http://www.w3.org/2000/svg"      xmlns:xlink="http://www.w3.org/1999/xlink">     <path id="my_path1" d="M 50 100 Q 25 10 180 100 T 350 100 T 520 100 T 690 100" fill="transparent" />     <text>         <textPath xlink:href ="#my_path1" font-size="34"> Text along a path looks awesome!!         </textPath>     </text> </svg> ...
Post a Comment
Read more

Context Menu is Personal (GNU Emacs)

Image
  Define custom menu based on your preferences. Note the definition of visibility conditions ( :visible keyword) and sub-menu ( More ). They are helpful in reducing the clutter. (Note: There are some placeholders in the code below.) (easy-menu-define my-menu global-map "My context menu"   '("Context Menu"     ["Cut"   kill-region :visible (region-active-p)]     ;; ["Copy"  kill-ring-save t] ;; Menu copies by default for further action     ["Paste" yank :visible (not (region-active-p))]     ["Open    " org-open-at-point t]     ["Calculate    " calc-grab-region t]     ["Execute    " (lambda () (interactive)             (shell-command-on-region (region-beginning) (region-end) "sh")) t]     ["Search Web" (lambda () (interactive) (eww (car kill-ring))) t]     ...
Post a Comment
Read more