Skip to main content

Posts

Showing posts with the label Javascript

How I did customize "rasa-nlu-trainer" as my own tool

Background I wanted to have a tool for human beings to classify intents and extract entities of texts which were obtained from a raw dataset such as Rocket.chat's conversation, Maluuba Frames or here. Then, the output (labeled texts) could be consumed by an NLU tool such as Rasa NLU.

rasa-nlu-trainer was a potential one which I didn't need to build an app from scratch. However, I needed to add more of my own features to fulfill my needs. They were:

1. Loading/displaying raw texts stored by a database such as MongoDB
2. Manually labeling intents and entities for the loaded texts
3. Persisting labeled texts into the database

I firstly did look up what rasa-nlu-trainer's technologies were used in order to see how to implement my mentioned features.
At first glancerasa-nlu-trainer was bootstrapped with Create React App. Create React App is a tool to create a React app with no build configuration, as it said. This tool is also recommended by the official React.js tutorial. I ac…

4 Remarkable Notes for JSF Apps Using HTML5

In the previous post, I've already shared with you how my team consults clients by using a HTML prototype. This post is about the used technologies for reusing the provided HTML template and communicating with backend.
What is the issue when using HTML elements with Primefaces components? Primefaces is a great extension for developing JSF web apps. However, it is really frustrating in case we have to make it work with an existing HTML template. Why?
- Primefaces has its own theme for styling.
- Primefaces changes the HTML structure.
Therefore, that would be a huge effort to use the Primefaces' components to replicate the elements of the HTML template; especially it is impossible for images drawing by "canvas" tag.

That requires us to find a better approach. Since Java EE 7 (introducing JSF 2.2 included), it supports to use HTML5 elements. The idea is that JSF components don't effect the style and HTML structure, so we can easily reuse the provided HTML template.…

Adding a default text to the beginning of an text area

I have a text area where I can enter a SQL statement. The text "SELECT TOP 1" is used at the begining of the sql statement as a default prefix that can not be removed.


In order to archive this functionality, I found three options:

1. Use an inputMask and build a pattern for the entered text. We can use the prefix inside the text area:

http://jsfiddle.net/SEXAj/2130/

2. Create an javascript event listener on event "input" and calculate to prevent the prefix is removed

http://jsfiddle.net/sarbbottam/TUc94/

3. Use another html tag like "div"/"span" that contains the prefix and calculate the suitable position

+ Tag "span": http://jsfiddle.net/4YzZy/
+ Tag "div": http://jsfiddle.net/215b34fs/

I chose the 3rd approach with tag "div" because it's the most easiest solution and suitable for me at that monment.

References:
[1]. http://stackoverflow.com/questions/24846041/how-do-i-add-a-default-text-to-the-beginning-of-an-htm…

[Snippet] Generate a new unique "name" string from an existing list

Suppose that we have a list of employees. Everytime, we want to add new employee into this list, the name of the employee will be generated with the following rules:
- the name of the new one is set to "[originalname] 1" - in case the name already exist, "[originalname] 2" is used, and so on.
Here is my code snippet by Javascript:
var employees =[ {id: 1, name: 'name'}, {id: 2, name: 'name 1'}, {id: 3, name: 'name 2'}, {id: 5, name: 'name 4'} ]; var commonUtils = { isExistName: function(_name, _collection, _prop) { for(var i = 0; i< _collection.length; i++){ if(_collection[i][_prop].localeCompare(_name)==0){ return true; } } return false; }, generateNewName: function(_name, _collection, _prop){ var i = 1; var searching = true; while (searching) { var newName = _name+ " " + i; if (!this.isExistName(newName, _collection, _prop)) { …

JQuery - Fixed Element during Scroll

I want to keep the position of an element likes a component on right side when I scroll down because of a very long content. Please take look at the code by visit the following link:

http://jsfiddle.net/p3unbmdy/

Javascript function:
$("#container").bind('scroll', function() { var fromTop = 50; var scrollVal = $("#container").scrollTop(); var top = 0; if ( scrollVal > fromTop) { top = scrollVal - fromTop; $('#rightElement').css({'position':'absolute','right':'1em','top' :top+'px'}); } else { $('#rightElement').css({'position':'static','top':'0px'}); } });

Only allow input number value with autoNumeric.js

autoNumeric is a jQuery plugin that automatically formats currency and numbers as you type on form inputs. I used autoNumeric 1.9.21 for demo code.

1. Dowload autoNumeric.js file from https://github.com/BobKnothe/autoNumeric
2. Import to project
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="js/autoNumeric.js"></script> 3. Define a function to use it
<script type="text/javascript"> /* only number is accepted */ function txtNumberOnly_Mask() { var inputOrgNumber = $("#numberTxt"); inputOrgNumber.each(function() { $(this).autoNumeric({ aSep : '', aDec: '.', vMin : '0.00' }); }); } </script>
4. Call the function by event
<form> <input type="text" value="" id="numberTxt"/>(only number) </form> <script type="te…