Arduino Community Logo: Arduino.landARDUINO.LANDModuinoJS Library

What is Moduino?

In need of a user friendly Arduino forum?

Why not try my new modification system and instantly transform the forum It can make elements easier on the eye,add missing features, and not to mention significantly reduce the amount of scrolling.

Just to mention a few...

  • Syntax highlighting (and resizeable code boxes).
  • Reduction in the size of page elements.
  • De-cluttering of thread posts.
  • Bookmark favourite links.
  • Request new features.
  • Stylized quotes.

Moduino is an open source JavaScript project aimed at allowing users of the Arduino forums (http://forum.arduino.cc) to apply custom themes which improve the look and feel of the forums.

If like me, you are an Arduino nut spending heaps of time browsing and contributing to the forums, then this tool may be just what you're looking for. With the recent upgrades to the forum, some features we were used to have changed dramatically or disappeared altogether This project will hopefully rectify a lot of these problems, however its destined to be more than just a fix.

The main motivation behind this project is the need for a touch-screen friendly design. Mainly to allow my tablet to navigate the forums easier, but when using my PC, I want to optimize the screen usage I'm planning a method of implementing themes so users can create their own designs with different fonts/colours/modifications Then cool features like themes for people with vision/motor impairments can be easily implemented.

Once modifications and new features have had the chance to be tested on a multitude of different browsers, this project could be used to vote and pitch updates to the forum administrators. This project could also be open for testing certain new features that the Arduino administrators have developed and tested in their development I'm completely open to new improvements and features. You can either use GitHub or post a message in the Arduino.cc forum discussion thread to get your ideas implemented!

Compare screenshots:
  • Hover over to zoom.
  • Click to view full size.

Forum Index
OriginalModified
A long thread
OriginalModified
Programming questions index
OriginalModified

What can it do?

There are currently 30 modifications available and each one can be controlled manually in the configuration Some mods have custom values which can be tweaked, however most are simply true/false combinations.

Global forum modifications.

Root index modifications.

Forum index modifications.

In thread modifications.

How to use it!

Before even mentioning how to start using Moduino, you must ensure your browser has JavaScript enabled. If JavaScript is available you'll see a green check mark below. Otherwise a red cross signifies that its not running In the event that JavaScript is disabled, visit enable-javascript.com for a detailed run-downon how to enable the language for the most popular browsers.

JavaScript seems to be disabled.

This section contains information on how to set up Moduino to run automatically when you visit the forum. If you want to take it for a spin before installing anything, visit the next section:Take Moduino for a test drive. In fact once AJAX page transitions have been implemented you may not have to install any of the applications mentioned here at all. This is of course requiring that a tab for the forum be open all the time keeping Moduino active. I know this isn't the best method for all of us, including me, however many people do seem to leave their browsers open all the time.

If you do not have the privacy or prefer to open your browser when needed, then there are a few applications available which can automate the process of stating Moduino while browsing the forum.

Google Chrome/Chromium based

This is a Google Chrome extension and is extremely simple to use. Once installed, simply follow a few simple instructions to set up CJS for Google Chrome.

  • Visit any forum page and click the cjs icon located at the top right corner of the browser.
  • In the pop-up that appears, there will be a text box you can paste the Moduino autoloader into.
  • Ensure that the check box marked "Enable cjs for this host" is selected.
  • Do not select any of the predefined jQuery scripts. This is important as the forum already loads jQuery, loading a second version removes any handlers the forum may have set.
  • Click Save and the pop-up should close and refresh the page automatically.
  • Moduino is now ready to go!

Custom JavaScript for websites

Below is a link to the autoloader script. Simply copy the code and paste it into the Custom JavaScript for websites dialog.

FireFox

This application is specific to FireFox browsers. It may seem involved however the setup for Moduino is fairly straight forward. To install GreaseMonkey for FireFix follow these steps.

  • Open FireFox
  • Access the Add-ons menu: Add-ons
  • Select Get Add-ons and use the search bar (top right) to search for 'GreaseMonkey'.
  • Click Install once found. You may have to restart your browser. FireFix should provide a prompt to restart, using this will preserve any currently open tabs. Otherwise you can manually close and reopen the browser.

Below is a link to the autoloader script. Simply copy the code and paste it into the Custom JavaScript for websites dialog.

Once installed, it is a simple process to set up Moduino in FireFox.

  • In the same Add-ons window used above, there should now be an option labelled User Scripts. Select it and find the option New User Script....
  • With the new script dialog open, enter the text Moduino (or anything else) into the first two text fields labelled Name & Namespace, then click Ok.
  • A new dialog will appear containing some commented code. Delete the text already there and paste in the autoloader code (link at top right, of this section).
  • Click Save and the close the dialog, returning to the User Scripts main page.
  • Select the item you have just created and click Options. If nothing happens, ensure the item is enabled (button to the right).
  • In the dialog which appears, click Add next to the list labelled Included Pages. Insert the text //forum.arduino.cc/* into the dialog that appears then select Ok.
  • Close the options, and you're done! Any forum page you visit will automatically have Moduino inserted for you!

Internet Explorer

Unfortunately, getting a user script to run on Internet Explorer is a lot harder than in other browsers You can run code in its JavaScript console, however automating the process has proved a challenge In the section below, you'll find instructions for testing Moduino via the console in Internet Explorer.

An extension called iMacros can run user scripts apparently, however I'm still investigating whether this is possible using their free version A few other applications have this claim to fame, however they all seem incompatible with IE11 If there is demand for an Internet Explorer solution, I'll look into building a basic extension that will automatically run Moduino whilst browsing the Arduino.cc forums If you have any other ideas or would like to help, stop by the discussion thread and let me know!.

Take Moduino for a test drive.

Running the system on a single forum page is easily done using your browsers built-in JavaScript console This method is compatible with Windows, Linux, & Mac PC's. Small devices using Android OS and Apples IOS maynot have a browser which includes a JavaScript console.

The JavaScript console allows you to run JavaScript in the context of the page in which the console is opened To test this platform you will first need to open up an Arduino forum page (anything from the forum: forum.arduino.cc) Once loaded you can open the console and paste in the source code. Instructions for opening the console in the most popular browsers are below with links to the source code you need to start Moduino.

Google Chrome/Chromium

There are two ways you can open the JavaScript console in Google Chrome.The quickest method is to use a keyboard short cut:

SystemCombo
WindowsCtrlShiftJ
MacCmdOptJ
LinuxCtrlShiftJ

Or you can access it through the menu:More toolsJavaScript console

Either one of these links can be used. Simply copy the code and paste it into the JavaScript console while viewing the forum.

Grab the source code from the links to the right, hit enter once pasted in to start the process. On the first load the source code will have to be downloaded and cached, so a small delay may be noticed. Subsequent loads will be faster. This also applies to the first time you view code that needs highlighting.

Firefox

Firefox browsers call their JavaScript console a Web Console. You can use a hot-key combo or the menus to access the Web console. The use of the console is very similar to the JavaScript console found in Google Chrome.

SystemCombo
WindowsCtrlShiftK
MacCmdOptK
LinuxCtrlShiftK

Or you can access it through the menu (All systems):ToolsWeb DeveloperWeb ConsoleLinux and Windows can also use the FireFox menu:DeveloperWeb Console

Either one of these links can be used. Simply copy the code and paste it into the Web console while viewing the forum.

Grab the source code from the links to the right, hit enter once pasted in to start the process. On the first load the source code will have to be downloaded and cached, so a small delay may be noticed. Subsequent loads will be faster. This also applies to the first time you view code that needs highlighting.

Internet Explorer

Please note, Moduino needs an additional fixes to allow every modification to function correctly These fixes are not far off however.

Internet Explorer has no direct short-cut to its JavaScript console, instead you first need to open the Developer Tools using either a keyboard hot key, or through the menu system.

Once open, you can select the tab labelled Console. Initially the DOM Explorer tab is selected, the Console tab is located directly after it either to the right or below depending on the tab orientation.

SystemShort-cut
AllF12

Or you can access it through the menu (All systems):ToolsDeveloper ToolsLatests version of Internet Explorer have a tool menu shortcut button on the right hand side of the toolbar:Developer Tools

Either one of these links can be used. Simply copy the code and paste it into the Web console while viewing the forum.

Grab the source code from the links to the right, hit enter once pasted in to start the process. On the first load the source code will have to be downloaded and cached, so a small delay may be noticed. Subsequent loads will be faster. This also applies to the first time you view code that needs highlighting.

Safari

Safari browsers do have a JavaScript console which they call the Error console.However the debugging tools which the console is a part of are only available ifyou have already enabled 'Developer mode' in the settings.To verify your configuration, or to enable the developer tools,follow the menus and enable the option shown below:

SafariPreferencesAdvancedShow Develop menu in menu bar

Once the developer tools are enabled, you'll be able to access the Error console usinga keyboard short cut or through the menu system.

SystemCombo
WindowsCtrlShiftC
MacCmdOptC

You should also see the `Develop` selection in the main menu bar. You can open the console from this menu.DevelopShow Error Console

Either one of these links can be used. Simply copy the code and paste it into the JavaScript console while viewing the forum.

Grab the source code from the links to the right, hit enter once pasted in to start the process. On the first load the source code will have to be downloaded and cached, so a small delay may be noticed. Subsequent loads will be faster. This also applies to the first time you view code that needs highlighting.

Interested in what you see? Learn how to have Moduino run automatically on every forum page you visit.View the instructions in the previous section to Setup Moduino.

Want to contribute?

There are many ways you could help out with Moduino, my focus is to have this project become a group effort, I've just done the initial stages. If you are a keen JavaScript programmer, you could help write new features or apply bug/browser fixes. As the software is hosted on GitHub, you can fork the project and create a pull request where I can 'pull' the new code directly in. If you haven't a clue what JavaScript is, or how to use GitHub, you can post a discussion on the Arduino.cc forum in this projects discussion thread I appreciate all input, especially requests relating to:

There is so much more development to come, keep your eyes peeled!

Change Log

V 0.1.7 May 19, 2015

V 0.1.6 May 05, 2015

V 0.1.4 Feb 22, 2015

V 0.1.2 Feb 13, 2015

V 0.1.1 Jan 11, 2015

V 0.0.43 Jan 01, 2015

V 0.0.40 Dec 27, 2014

V 0.0.39 Dec 8, 2014

V 0.0.32 Nov 12, 2014

V 0.0.1 Nov 8, 2014

Designed & created by Christopher Andrews. 2014