How to Use the New Javascript

Keryth987

So, cna someone please explain how to use this new capability? What goes in the JavaScript Box and what goes on the webpage?

thaen

I'm copying this from nuadaria's post on the other thread ...

https://forums.obsidianportal.com/discussion/comment/47515/#Comment_47515

 

if(document.getElementsByClassName('wiki-edit').length < 1){
    var siblingDiv = document.getElementsByClassName('wiki-page-container');
    var div = document.createElement('div');
    div.innerHTML = '<div class="wiki-edit"><a class="button" href="'+window.location.href+'/edit">Edit This Page</a></div>';

    siblingDiv[0].parentNode.insertBefore(div, siblingDiv.nextSibling);
}

Copy that code exactly, and then paste it in the Campaign Settings -> Advanced -> Custom JavaScript box.

Then click Save.

Then go to any Wiki Page in your Campaign, and scroll down to the bottom of the main section, and you'll see the button for "Edit This Page".  You'll probably want to add some CSS to position it, but otherwise, it should work as is.

You don't need to put anything on the Wiki Pages themselves to make this work.  Part of the power here is similar to the Custom CSS where you make change in one place (the Advanced tab) and it affects (or can affect) everything in the Campaign.

Does that answer the question?

 

Keryth987

Seems to work. So I just add things java wise there and thats it then?

thaen

Yeah, just like Custom CSS.  (Let me know if I'm not fully understanding your question?)

Just noting, "Java" and "JavaScript" are two separate programming languages.  So, if you were googling for some "Java" code to show a popup, that code wouldn't work.  But, if you were googling for some "JavaScript" code to show a popup, that code would work.

 

Glyph3x

So could we create a separate HTML page then and call it using JS? For A side nav bar for example, so it doesnt have to have it repasted on each page

thaen

@Glyph3x, yep, this could be used for that.  For that specific example, a side nav bar, we already have the Custom Navigation feature (in the Campaign Settings -> Advanced), which enables you to replace the side nav bar with whatever HTML you want.  Let me know if I'm not making sense.

JOHAN255

Just noting, "Java" and "JavaScript" are two separate programming languages. So, if you were googling for some "Java" code to show a popup, that code wouldn't work. But, if you were googling for some "JavaScript" code to show a popup, that code would work.

Jamesmillere

To use a new capability, place the JavaScript code related to the capability in the JavaScript box. This includes declaring variables, defining functions, implementing event listeners, and utilizing APIs or external libraries if necessary. On the any Python webpage, include the JavaScript file using the script tag and create HTML elements that will interact with the capability or display its output. Add event listeners to the appropriate HTML elements, and specify where the output should appear. Test the implementation, considering the specific guidelines or documentation provided for the capability.