XOxygen Framework - chigc/documentation GitHub Wiki

  1. Installing the Oxygen Framework

  2. Quick Introduction to Oxygen Framework Development

1. Installing the Oxygen Framework

Prerequisites

  • Oxygen XML Editor is installed.
  • Github Desktop

Step 1: Get the Framework data

  • Open Github Deskop
  • Clone the Software Repository (in a directory easy to find ;))

Step 2: Associate the Framework

  1. Open the Oxygen Editor
  2. Navigate to Options > Preferences > Document Type Association > Locations // 'Optionen > Einstellungen > Dokumententypen-Zuordnung > Orte'.
  3. Click Add // 'Hinzufügen', browse to the cloned repository folder and navigate to the Folder frameworks.
  4. Click OK.
  5. At the bottom of the page switch from text mode (XML code view) to author mode (framework view) to see the rendered file.

Options > Preferences > Document Type Association > Locations

Step 2.5 (Optional but Recommended) - Author Mode View as 'First View'

- Open `Options > Preferences > Editor > Edit Modes` // 'Optionen > Einstellungen > Bearbeitungsmodus.
- Set `XML Editor > Edit` to "Author" (instead of "Text").
- Click `OK`.

Options > Preferences > Editor > Edit Modes

Step 3: Test if everything went to plan

  • Open any Manuscript TEI.
  • The framework was correctly assigned if it looks like this (if not, something went wrong):

XML file rendered correctly

2. Quick Introduction to Oxygen Framework Development

Files and Folders

  • software/frameworks/framework/layout.css (to render the XML file)
  • software/frameworks/framework/compendium.framework (framework main file, updated automatically, do not edit manually!)
  • software/frameworks/framework/icons (icons used for buttons etc.)
  • software/frameworks/framework/templates/template.xml (master XML used as a template when creating new files)

Useful Framework Options / Settings

  1. Customise the framework:

    • Open Options > Preferences > Document Type Association.
    • Select 'Compendium' and click Edit.
  2. Associate CSS file:

    • Go to Author > CSS.
  3. Change / add framework actions:

    • Go to Author > Actions.
    • Set ID, name, and description (use sensible names for IDs, e.g., "tag_ELEMENT", "add_ELEMENT", "delete_ELEMENT", "insert_ELEMENT").
    • Set an icon from the icons folder (use framework variable: ${framework}/icons/icon.png).
    • Optional: Restrict availability through xpath condition (= button/action only available if the cursor is placed in a position matching the xpath).
    • Select the action (e.g., InsertFragmentOperation to insert an empty element, such as adding a paragraph; InsertOrReplaceFragmentOperation to wrap text in an element, such as <hi>; DeleteElementOperation to delete an element).
    • Provide XML fragment (add TEI namespace xmlns="http://www.tei-c.org/ns/1.0" to the outer element; use ${selection} variable to tag selected text).
  4. Add buttons to the menu:

    • Go to Author > Contextual Menu.

Useful CSS Controls

  • visibility: -oxy-collapse-text; = hide text content of an element.
  • visibility: visible; = show text content of an element.
  • oxy_editor(type, text, edit, '#text') = edit the text content of an element.
  • oxy_editor(type, text, edit, @url) = edit the value of the @url attribute.
  • oxy_editor(type, combo) = create a dropdown menu.
  • oxy_editor(type, label) = add a label to a form.
  • oxy_editor(type, button, actionID, add_p) = call framework actions from CSS (here "add_p").
  • oxy_xpath() = to select content/values more dynamically.

Useful Links (External)