Mod-sdk suggestions project

Hi!

I’ve been messing around with the mod-sdk images for the plugins interface.

I got some interesting results and would like to share with the developers. They may be useful for future upgrades:

  • Japanese and Boxy transparent color: It is possible to create effects with any background color, or even choose a background image.
  • Boxy custom size: You can change the pedal size

Everything was implemented with html5 + css3. Js was used only to leave the dynamic page. However, I use css vars and flexbox (which does require browsers updated to the latest versions). As I use images with relative address, Google chrome gets buggy, so check out firefox!

Japanese is buggy, Boxy is ok.

Github project: https://github.com/PedalPi/Mod-sdk-HTML5
Online demo: https://pedalpi.github.io/Mod-sdk-HTML5/
Play online: http://dabblet.com/gist/0a91ce222d9e3e002bf40e328838c3af [link updated]

I await suggestions and reviews!

3 Likes

this looks useful for me, since I’m about to start working on putting my plugins on MOD. Where chrome gets buggy, will that be a problem for chrome users once the plugin is done or does it only effect the SDK?

I like what you are doing since I am really rotten at web development.Thanks for making strides in this department, I hope they continue :slight_smile:

Nice one! I did not know what to expect when reading your description, but the results look very cool. Always a good thing to make customising easier (on a creative platform).

My implementation is based on the latest CSS specs I know (like css variables, available for about 60% of the population).
Even relatively recent devices can not work, as most likely Carla.

What I have here is more proof of concept. It is risky MOD Devices to replace some things and decrease compatibility with web devices.

Of course, ideas can be adapted. For example, the problem in chrome can be easily solved (while Google itself does not solve) if the path of the images is absolute, rather than relative. Css variables can be partially replaced by SASS, LESS or a manual processing like - I think - is done by MOD.

What he was really trying to bring was:

  • Create a simple html to represent a pedal - not that the current form is complicated;
  • Give the possibility of choosing the color you want or the background image you want;
  • Do not limit the amount of knobs;
  • Possibility to create the effect with html and see the result (the dabblet site in the first forum post).

And about the Mod project as a whole: (below I just clever thoughts on the project)

  • Decrease the need for a python server for static pages -> Leave client-side processing; It can unravel - possibly insignificantly - the Modduo
  • Remove jQuery;
  • Use of ECMA 2016 (class, let, const …)

Anyway, I have some thoughts on the implementation and I would like to share ^^


I like what you are doing since I am really rotten at web development.Thanks for making strides in this department, I hope they continue :slight_smile:

Thanks!

Nice one! I did not know what to expect when reading your description, but the results look very cool. Always a good thing to make customising easier (on a creative platform).

I did not really try so hard to describe what I was trying to do - it might not have been clear to me either.

I think I described it in a better way: Mod-sdk suggestions project

Thanks for the time spent commenting!

Cheers, mate! I especially liked the colour example. Always impressive when you click and something happens… :smile:

As for compatibility: This is IMHO not a deal breaker unless it is “optimised for 1024x768 and Internet Explorer 5.0”. Modern browsers are freely available for all platforms and should be updated regularly anyway. It might be good to consider mobile variants though.