Can an HTML, CSS, and Javascript combination be used to create a sidebar addon for LibreOffice?

Is it possible to create sidebar add-ons for LibreOffice/OpenOffice using HTML, CSS, and Javascript?

Alternatively, could we utilize the UNO API and an embedded browser to run a web app within LibreOffice for seamless interaction? We have already developed a single base for Google Apps and Microsoft Office as a web app. If we can incorporate a browser and the UNO API, we could easily extend our platform to include LibreOffice as well. Has anyone tried this approach before?

I would greatly appreciate any ideas or assistance. :)

Here is a sample of the app that I will be adapting (with placeholder data):

Google Apps:

https://i.sstatic.net/2RUaY.png

Excel for iPad

https://i.sstatic.net/cKnWA.png

Excel for Mac

https://i.sstatic.net/ZTHhQ.png

Excel Online (Office 365)

https://i.sstatic.net/e78SB.png

Answer №1

To construct a panel through an extension (not the C++ core), please refer to the step-by-step instructions provided on this webpage.

The central file that must be generated is known as Sidebar.xcu. In addition, various other files are required for the process. A comprehensive example featuring all these files can be found further down the same page.

Although the sample code is Java-based, it might be more straightforward to build the entire sidebar using Java rather than relying on Javascript/CSS/HTML. Nevertheless, the option to develop extensions with Javascript is also available.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Enhance a collection by incorporating methods to the result of an angular resource query

After executing a query, I am left with an array from the resource: .factory('Books', function($resource){ var Books = $resource('/authors/:authorId/books'); return Books; }) I was wondering if there is a way to incorporate pr ...

Having trouble submitting ajax form data through nodemailer

Hey there, Recently, I created a web app using node.js and express. Everything seems to be working fine except for one issue - I am struggling to get the JSON data sent by AJAX into Nodemailer. Despite confirming that my AJAX is successfully sending the ...

Utilizing JavaScript's Facebook Connect feature on a Ruby on Rails website

My ruby-on-rails web application is in need of integrating "Facebook connect" functionality to enable users to share various activities on Facebook. Are there any Javascript methods I can use for this purpose? Any demos you can suggest? In addition, I wou ...

What methods can I employ to utilize PHP or JS/HTML for posting to two separate URLs simultaneously?

Is it possible to submit a form from one button to two different locations? I am looking for a solution to achieve this. After clicking the submit button on a form, the form tag looks like this: <FORM ACTION="http:site.com/servlets/RequestServlet" met ...

Jumping Iframe Anchor Link in Src

I'm facing a challenge with an iframe positioned in the center of a webpage. I want to show content from another page within the iframe, but not starting at the very top. To achieve this, I inserted an anchor into the src of my iframe, linked to an a ...

Is there a way to deactivate a JavaScript function on a specific webpage using CSS?

I've implemented a JavaScript function that triggers a pop-up alert whenever a user attempts to navigate away from the site by clicking on an external link: $("a[target='_blank']").click( function() { return confirm('Please don&apo ...

Splitting JavaScript Arrays: Exploring Efficient Division

I'm attempting to develop a recursive function that divides an array in half until it only consists of lengths of 3 and 2. After dividing, I want to neatly organize all the new arrays into another array. My idea is to find a way to determine the numb ...

Steps for opening a new tab in Selenium version 3.141.59

While using selenium 3.141.59, I attempted to open a new tab by utilizing the following method: Actions action = new Actions(driver); action.keyDown(Keys.CONTROL).sendKeys(Keys.TAB).build().perform(); and driver.findElement(By.cssSelector("body")).se ...

Guide to retrieving a specific cookie value with socket.io

I have successfully retrieved all cookies using the socket.request.headers.cookie. Upon console logging, the output appears as follows: PHPSESSID=mtklg8k81cpkop5ug6aechbb34; user=77; io=1Klg6xgTRXhb2OWiAAAA Now, I am trying to extract only the value of ...

What is the best way to update the root page title when loading ajax content?

Help needed with AJAX script to load content from external page I am using the following AJAX script to retrieve content from a specific div on an external page and display it in a corresponding div on my main page. $(function() { var newHash ...

Error encountered in parsing JSON: abrupt end of data (JavaScript)

I have been working on a few functions that are responsible for parsing JSON data, both external and internal, and displaying it on a local webpage using the localStorage feature. While I have successfully displayed the external JSON data, I am running int ...

Stop or abort any pending API requests in Restangular

I am currently working with an API service: var SearchSuggestionApi = function (Restangular) { return { getSuggestion: function (keyword) { return Restangular.one('search').customGET(null, {keyword:keyword}); } }; }; SearchS ...

Getting a value from strings.xml within a retrofit interface - a simple guide

We have been utilizing the retrofit android client library for handling network requests to our server. However, I am facing a challenge in trying to access values stored in the strings.xml file from the interface class we designed for retrofit. Below is ...

Steps for resetting data() on a route without parameters:

Having trouble restarting a route on a new editor I have a specific route /editor as well as /editor?_id=dasd448846acsca The /editor route consists of a simple form with empty inputs, while the /editor?_id=dasd448846acsca route has the same component bu ...

Guide on effectively incorporating CSS and JS files packaged as an NPM module using gulp

How can I efficiently incorporate CSS and JS files from an NPM package, installed via gulp, into my index.html file? I have used NPM to install the Materialize CSS framework by running: npm install --save-dev materialize-css Now, I need to include the CS ...

Manipulating elements within nested JSON structures, including adding, updating, and deleting values

My current project involves developing a diagram/tree graph generator using two libraries: GraphView for generating the graph and ZoomLayout for view navigation. The goal of this project is to save JSON data in an AWS database and then display a list of al ...

The function `open` is not a valid prop for the `Dialog` component

Upon clicking an icon, a dialog box containing a form should appear for either adding a tab or deleting a specific tab. I have utilized reactjs, redux, and material-ui for the components. While I am able to display the dialog box when the icon is clicked, ...

HTML & Javascript |iOS| - Eliminate emojis

Right now, I have an HTML textarea element that enables users to input text, which works well. However, the issue is that users are able to input emojis. I am wondering if there is a way to remove these emojis after they have been entered by the user, or ...

Navigating through Selenium: The ultimate guide to clicking the login button within a popup

https://i.sstatic.net/hc6vQ.png This unique image displays a flex-made popup. Flash objects are being identified using FlashFireBug (https://addons.mozilla.org/en-us/firefox/addon/flashfirebug/) to obtain their object IDs for use in Selenium: https://i.ss ...

It is not possible to include external JavaScript in a Vue.js web page

Trying to integrate a Google Translate widget onto my webpage has been a bit challenging. Initially, when I added it to a normal webpage, it worked smoothly using the following code: <div class="google_translate" id="google_translate_element"></d ...