Google Closure - Blogs
X
02Feb

Google Closure

Introduction

Closure is a collection of tools for building rich web applications in JavaScript.Google closure make it significantly easier to maintain a large JavaScript codebase. Using Closure essentially extends JavaScript to include features available in other programming languages, such as namespaces, type checking, and data hiding.

Google closure libraries are used to create html template which can be called in javascript.In the next steps I will be explaining how to create html template,how to convert the template to google closure library file and using of that template.

The basic advantage of google closure libraries is that the minimized file size and fast response with the browser.

Note: Please make sure that java compiler is installed in your machine to compile the google template

1 Creating google closure template

In this part i am explaining about creating a html template which displays data coming from server side.

Open a text document and paste the code placed below and save it as example.soy

* Parameterized CSS for .templatedata template.
* @param maincss //CSS background color for the even rows
*/
{namespace canarys.templates}
/**
* @param tempdatas //Data to be displayed
*/
{template .displaydivdata}
{foreach $tempdata in $tempdatas}
{$tempdata.tempheader}
  • {foreach $mystring in $tempdata.displaypoints}
    • {$mystring}
    • {/foreach}
{/foreach}

{/template}

 
This template is in canarys.templates namespace and it can be called in program as canarys.templates.displaydivdata. Save the file as example.soy
 
2.Creating batch file
 
Open a text file and paste the code placed below and name it as compile_example.bat which is a batch file and run this  in java compiler, creates a temporary javascript   file and compiled javascript file.
 
rem echo off
echo Please wait compiling ...
rem compiling the soy files

"C:\Program Files (x86)\Java\jdk1.8.0_05\bin\java" -jar ../closure-templates/SoyToJsSrcCompiler.jar --shouldGenerateJsdoc --shouldProvideRequireSoyNamespaces --outputPathFormat example.soy.js  example.soy 2>soy_err.log

rem Creating the concatenated script file (test_v2.html)

..\PortablePython\app\python  ../closure-library/closure/bin/calcdeps.py -p ../closure-library/ -i ../closure-templates/javascript/soyutils_usegoog.js -i example.soy.js -o script  > example-temp.js 2>err_temp.log

rem Creating the compiled version of the concatenated script file (test_v3.html)

..\PortablePython\app\python  ../closure-library/closure/bin/calcdeps.py -p ../closure-library/ -i ../closure-templates/javascript/soyutils_usegoog.js -i example.soy.js  -o compiled  -c ../closure-compiler/compiler.jar   >example-compiled.js 2>err_compile.log

rem Creating the unit testable version of the concatenated script file (test_unitTest.html)


echo Done
 
This will generate example-temp.js(Human readable) file and example-compiled.js file.

3.Using closure template in  application

Now we can use this comiled template in our application as below

@using gclnp.Models
@model StringClass
@{
 Layout = null;
}



 


 

 

 

 
The final output will be shown as below
 
Output

 

 

 

 

 

Related

Connect apps and integrate data with workflows using Azure Logic Apps

Implementing complex business process has been made easy. Logic Apps in azure provide a way to imple...

Read More >

TFS to VSTS Migrations

The next evolution of TFSWhether you’re a startup or Enterprise or you’re a team of just...

Read More >

CfMD services -Dynamics NAV

CfMD services help ISVs minimize the time and effort needed to get their software solution through t...

Read More >

Upcoming Webinar - Offshore support to North American Dynamics NAV partners

Offshore support to North American Dynamics NAV partners whose customers are moving to NAV '16Wh...

Read More >

Microsoft Azure Consultant

·         Executing technical feasibility as...

Read More >

Customer Feedback

Your feedback is important to us. Please share your experience working with Canarys & the journe...

Read More >

Threading

Multi-taskingIt is a concept of performing multiple tasks over a certain period of time by executing...

Read More >

Partnership Program

We understand that the world of technology is changing rapidly from day to day and businesses have m...

Read More >

Partnership Program

The Canarys Partner Program:Canarys is all set to expand its business reach across the Globe and is ...

Read More >

Upcoming Webinar US - Plugging for Cloud, Right or Wrong

Plugging for Cloud, Right or Wrong?Cloud computing continues to be one of the most advertising topic...

Read More >

Share

Try DevOpSmartBoard Ultimate complete Azure DevOps End-to end reporting tool

Sign Up

  • Recent
  • Popular
  • Tag
Tags
Monthly Archive
Subscribe
Name

Text/HTML
Contact Us
  • *
  • *