Google Blockly and AngularJS

1.3k views Asked by At

I need to give a group of power users a way to create and save a math formula that will later be run as part of a shopping cart check-out routine. I'm must assume the power uses are not programmers but can follow simple instructions. The formulas will not change often but must be under the control of the power users, not system administrators or programmers.

A visual language UI seems like a good match for this sort of requirement, an environment that a power user can relate to that in the end generates JavaScript code that the check-out routine will be able to eval( myFormula ).

myFormula for example:

In this example fee is specified something like... input type="number" ng-model="fee" and gross would be entered at the time of check-out (excluding a test function before saving formula).

... then in a separate text box the formula would look something like the following (where I'm assuming fee was saved at 0.05.

var youPay = IF gross > 1000 THAN fee * gross ELSE 50

The youPay result will be displayed to the person checking out. In this example if the gross was less that $1000 a base amount of $50 would apply otherwise they would pay five percent of the gross

Does anyone have any comments about the Google Blockly project or other solutions that might help? Perhaps an Excel to JavaScript code generator where the Excel formula could be tested prior to saving in my application.

And then there will be another layer of this solution that will need to make sure the formula does not create security issues or introduce bugs that might crash the check-out application.

1

There are 1 answers

2
Tinly On

that sounds like a good application for the blockly framework. A formula like the one you provided can be created with the blockly code demo at https://blockly-demo.appspot.com/static/demos/code/index.html wich you could use as a starting point to kickstart your project. Withouth further modification it would look something like this: https://i.stack.imgur.com/AXOJy.png (i don't have enough reputation to embedd images in the posting..)

What you would have to do is telling blockly about your predefined variables so the user could choose them from the dropdown and add something like a save button to generate the code and save it somewhere. Maybe there are some modifications needed in the way blockly generates javascript because it's really designed to generate little but complete scripts in opposite to your need to just generate a little part of a bigger script. But modifications to the code generators are pretty easy in blockly.

hope that helps a little.