Using AI to generate Oracle APEX Theme Roller Styles v.2

I’ve previously blogged on this subject, however I found that as new versions of the Universal Theme appeared, it meant that that approach no longer worked. Here is an approach that is hopefully future proof.

It works on APEX 24.2 at least.

Obtain a Full Theme Style

1. Run an APEX application and open up Theme Roller with Vita Style

2. Press F12 and open up the browser console

3. Run this at the console to jiggle the Theme Roller settings to encourage production of a full theme style.

    // Function to trigger change event on an input
    function triggerChange(input) {
      var originalValue = input.val();
      input.val(originalValue + ' ').trigger('change').val(originalValue).trigger('change');
    }
   
    // Select all input elements in the Theme Roller
    $('#theme-roller-pe').find('input').each(function() {
      triggerChange($(this));
    });
   
    // Select all select elements in the Theme Roller
    $('#theme-roller-pe').find('select:not([data-property-id="currentTheme.id"])').each(function() {
      var $select = $(this);
      var originalIndex = $select.prop('selectedIndex');
      $select.prop('selectedIndex', (originalIndex + 1) % $select.find('option').length).trigger('change')
             .prop('selectedIndex', originalIndex).trigger('change');
    });
   
    console.log('All Done');
   

4. Wait about 10 seconds for this to appear

    All Done
   

5. Use Theme Roller > Kebab Icon > Export and export this Theme Style to file

Use AI to Generate a Theme Style

1. Open up your favorite AI e.g ChatGPT. I use Perplexity

2. Use a variation of this prompt

    Create a modern & vibrant theme style by adjusting the following Universal Theme Roller config... 
    DO NOT ADD ANY COMMENT
    DO NOT HALLUCIATE ANY FIELDS
    DO NOT ADD, REMOVE OR CHANGE ANY ATTRIBUTE NAMES... ONLY CHANGE THE VALUES
   
    <paste in the contents of the export file>
   

3. Save the response in a new .json file

Import the AI generated Theme Style

1. Click Theme Roller > Kebab Icon > Import

2. Select the file and import it

Success

What do you think of this Minty Theme Style?

ENJOY!

Whats the picture? A Tree climbing out of a rock in Hornbeam Park, just down here. Visit Yorkshire!