Foramtting function for JavaScript strings

Brian Paulson — Fri, 08 Aug 2014 00:00:00 UTC

The project I work on has been around for about 10 years now. Due to the nature of the work a lot of the updates that should happen don’t due to how work is paid for. I am currently working on the task of taking our application that was mainly built and used by customers for IE 6 and making that work in all of the latest major browsers. As you can imagine there is a lot of problems that we are running into.

One issue that I was dealing with recently was a large section of code that takes an array of JSON objects and pushes the data into a table. The code was building each row, cell and all the attribute individually in a loop, as well we use a lot of non-standard attributes on elements. Not only was this just not working and was not rebuilding the full table.

I began trying to work out a solution where I could define a string representing the table row I was creating with the locations where I needed the data to be placed (think printf or any number of methods in many programming languages.) After several iterations I had a working solution but didn’t want to have to call the function as much as I just wanted to apply the formatting to the string, the result is the function below.

  String.prototype.format = function() {
      var s = this.toString();
      for (var i = 0; i < arguments.length; i++) {       
        var reg = new RegExp("\\{" + i + "\\}", "gm");             
        s = s.replace(reg, arguments[i]);
      }

      return s;
    }

As you can see from the code we are replacing points in the strings formatted like this {1} with elements from the array. an actual string example would be like the section below for say making a table. Then simply call the rowTemplate.format(arguments) to have all your values inserted in to the string, and using jQuery insert the table into the DOM.

  var rowTemplate = '<tr style="background:#ddd;cursor:pointer;" attribute1="{0}" attribute2="{1}"><td>{2}</td><td>{3}</td><td>{4}</td><td>{5}</td><td>{6}</td><td>{7}</td></tr>';

    rowTemplate.format(attribute1, attribute2,cell1,cell2,cell3,cell4,cell5,cell6);

Complete example

HTML table

<table>
    <tbody id="mytableBody">
        <tr>
            <td></td>
        </tr>
    </tbody>
</table>

JavaScript

  String.prototype.format = function() {
      var s = this.toString();
      for (var i = 0; i < arguments.length; i++) {       
        var reg = new RegExp("\\{" + i + "\\}", "gm");             
        s = s.replace(reg, arguments[i]);
      }

      return s;
    }

   var table = $("#mytableBody");
    var rowTemplate = '<tr style="background:#ddd;cursor:pointer;" attribute1="{0}" attribute2="{1}"><td>{2}</td><td>{3}</td><td>{4}</td><td>{5}</td><td>{6}</td><td>{7}</td></tr>';

    table.append(rowTemplate.format(attribute1, attribute2,cell1,cell2,cell3,cell4,cell5,cell6));

A clean solution for a common problem that seems to have a million different methods to accomplish. Hope this solution works for you please comment if you have any suggestions on making it better.

Cuberific A rubiks cube timer application

Brian Paulson — Sat, 21 Jun 2014 00:00:00 UTC

Cuberific

Cuberific is a Rubik’s Cube timer web application. The back end service is written in Go Golang.org. The front end is an Angular JS application. On the web server front Nginx was used to serve the Angular JS application and proxy the Go web service. For the database MongoDB was used.

THIS APPLICATION IS NOT READY FOR PRODUCTION USE

Shortcuts were taken with some aspects of security and would need to be fixed before used in production.

Currently no password to connect to mongo
API Security needs more work.

Disclaimer

If you find and errors with this documentation please let me know and I will update the document ASAP. As well if you modify the code and wish to have it added to the repository issue pull requests.

Also keep in mind I was learning both Angular and GO when working on this application so it may not be a perfect example of how to write Go/Angular code properly. With that said I have a couple thousand solves in my local server that I have been running.

Prerequisites

Golang http://golang.org/
Nginx http://nginx.org/
MongoDB http://www.mongodb.org/
GOHOME and GOPATH Environment variables set correctly

Getting the code

$ git clone https://github.com/spectre013/cuberific
$ cd $PATH TO CODE/src/cuberific

Get the dependencies

$ go get code.google.com/p/gorest
$ go get code.google.com/p/go.crypto
$ go get github.com/nu7hatch/gouuid
$ go get labix.org/v2/mgo

building the go service

Since this is the complete application and Cuberfic was not meant as a go library it is not set up to be used with go get.

A couple things need to be done before we can run the service.

Create a database called cuberific in your MongoDB Server.
Open main.go and go to line 386 and change the path to the solves.json (only need to do this if you want to import some solves for testing purposes)

$ cd $PATH TO CODE/src/cuberific $ go build $ cuberific

Eventually you will want to run the cuberific as a service. For now it would be best to run in the console until you have every thing working correctly.

Web Front end

Only changes that need to be made here is to add the domain for the cookies to be stored in.

Navigate to /var/www/vhosts//httpdocs/js/controllers.js and open it in your editor of choice.

Replace with the domain name / IP your are using to access the site.

Nginx conf

For a front facing server Nginx was used. Below is the site configuration that will work. Replace in the root to the path where the code is, and the in the server_name line with the domain/IP that you want Nginx to respond to.

The port in the proxy_pass line will need to change if the Go server is running on a different port.

server {
        listen 80;

        root /var/www/vhosts/<SITE_NAME>/httpdocs;
        index index.html index.htm;

        # Make site accessible from http://localhost/
        server_name <SITE_NAME>;

        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri $uri/ /index.html /api;
                # Uncomment to enable naxsi on this location
                # include /etc/nginx/naxsi.rules
        }
        location /api {
                proxy_pass        http://localhost:9090;

                proxy_set_header Host $host;
                proxy_set_header X-Real-IP  $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_redirect   off;
       }

}

start the server and navigate to http://localhost or the domain or IP used to create the server.

Getting Started

Navigate to the domain / IP used in the Nginx section and you should be presented with the web application if not please view the Nginx logs or the console that the go service is running in to look for errors.

Mongo Collections

In this file you will find the collections for mongo. This is mostly for reference as the application will create the applications as needed.

License

MIT License

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Basic Web Skeleton

Brian Paulson — Fri, 20 Jun 2014 00:00:00 UTC

Web Skeleton

Web Skeleton is a simple http/net server set up with routing, template rendering with the only external library being Mux for routing.

Implementing Web Skeleton Using Web Skeleton is simple. First use go get to install the latest version of the library.

$ go get github.com/spectre013/webskeleton

Once you have the source navigate to webskeleton directory and run.

$ go run main.go

This will start the server at http://localhost:3000

The handlers are all defined in handlers.go and rendering templates is done my calling the render function.

Render(w, "index", "Test")

the render function has the ability to render multiple templates. If you wanted to add a sidebar you would add

<? template "sidebar" . ?>

to the index.html file. In sidebar.html file you would need to define the content.

<? define "sidebar" ?>
    <!-- ... some html here ... -->
<? end ?>

then would need to add the template to the render call.

Render(w, "index,sidebar", "Test")

Go 1.3 Released

Brian Paulson — Thu, 19 Jun 2014 00:00:00 UTC

The latest Go release, version 1.3, arrives six months after 1.2, and contains no language changes. It focuses primarily on implementation work, providing precise garbage collection, a major refactoring of the compiler tool chain that results in faster builds, especially for large projects, significant performance improvements across the board, and support for DragonFly BSD, Solaris, Plan 9 and Google’s Native Client architecture (NaCl). It also has an important refinement to the memory model regarding synchronization. As always, Go 1.3 keeps the promise of compatibility, and almost everything will continue to compile and run without change when moved to 1.3.

List of changes:

supported operating systems and architectures
Changes to the memory model
Changes to the implementations and tools
Performance
Changes to the standard library

For more information on all the changes please see the release notes: Go 1.3 Release Notes

Recent Content on All About GO