Veerapat's IT journey: July 2013

Tuesday, July 30, 2013

JavaScript control attributes for Windows Store Apps (data-win-* attributes)

Lately, I have done something mostly related to Windows Store App and I'm also interested in JavaScript. This language is very powerful in so many ways. It's easy to entry, you just have a browser and a text editor then your can start develop something. However, JavaScript is easy to start, but it is not easy to be mastered. I'm not a JavaScript professional, not even a web developer. But when compared the learning curve between JavaScript and Strong-Typed Languages (such as Java, C#). By the way, this post is not about language technologies.

JavaScript is powerful enough to make it be a one of native languages of Windows Store App. In this post would like to give introduction about added-on attributes to make html elements transformed into Windows Store controls.

The first one is "data-win-control". It is a very important attribute to create WinJS controls by giving them a control name then call process UI to apply controls on the startup. This attribute can't not be used on iframe element.

HTML

<div data-win-control="controlName" />

JavaScript

(function( ) {

    document.addEventListener("DOMContentLoaded", function(e) {
        WinJS.UI.processAll();
    });

})();

The next one is "data-win-options". It can receive a JavaScript object to set that control properties.

HTML

<div 
    data-win-control="control" 
    data-win-options="{ property1 : value1, property2 : value2}">
</div>

It can also do binding data as XAML does using "data-win-bind" (with some code in JavaScript side).

HTML

    <element data-win-bind="elementProperty1 : dataSourceProperty1; elementProperty2: dataSourceProperty2" />

To make elements can't be selected, use "data-win-selectable" property. It is just a true / false value. By default, all input elements and elements with the contentEditable attribute set to true are selectable.

HTML

<div data-win-selectable="true" ...

The controls can be binded with external resources for localization or other purposes using "data-win-res".

HTML

<p data-win-res="{textContent: 'String1'}"></p>

For the "data-win-fragmentLoad" property, the document said that this will be removed from the next version of Windows Library for JavaScript. So, I think we should not use it.

Reference: Windows Library for JavaScript control attributes

Wednesday, July 24, 2013

JavaScript class and namespace

The following links are the basic link provide the information how to create namspace and class in JavaScript.

The following example is to show how to create basic namespace and class. The namespace is name "NS" then create class in that namespace "Sound". Sound class has instance variable "name". and class variable "Variable". Also has the class method "Method1" and "Method2" which can be used like static method in Java or C#. After that this html page will be processed when document loaded and print out "love story 3".

<!DOCTYPE html>
<html>
 <head>
  <title>Test</title>
  <script type="text/javascript">
  var NS = NS || {};
  
  NS.Sound = function (name) {
   this.name = name;
  }
  
  NS.Sound.Variable = [];
  
  NS.Sound.Method1 = function () {
   NS.Sound.Variable.push(1);
   NS.Sound.Variable.push(2);
   NS.Sound.Variable.push(3);
  }
  
  NS.Sound.Method2 = function () {
   return NS.Sound.Variable.length;
  }
  
  function onLoad() {
   var sound = new NS.Sound("lovestory");
   var div = document.getElementById("content");
   
   NS.Sound.Method1();
   var content = sound.name + " " + NS.Sound.Method2();
   
   div.innerHTML = content;
  }
  
  document.addEventListener("DOMContentLoaded", onLoad, false);
  </script>
 </head>
 <body>
  <div id="content"></div>
 </body>
</html>

Monday, July 8, 2013

Download ISO files from IIS

Normally IIS won't allow the clients to contact unknown extensions in the server. ISO is not set by IIS default. In order to do that, we need to configure MIME Types on IIS with the following steps:

- Open IIS.

- Select the the server then select MIME Types.

- Add .iso extension as application/octet-stream.

- Ok

After that you can access ISO as octet steam which can be applied to almost any binary file.

Thursday, July 4, 2013

Step-by-Step Guide for Setting Up Windows Server 2012 Domain Controller

To set up domain controller, can take a look on the following link: http://social.technet.microsoft.com/wiki/contents/articles/12370.step-by-step-guide-for-setting-up-windows-server-2012-domain-controller.aspx.

Veerapat's IT journey

Pages

Profile

Tuesday, July 30, 2013

JavaScript control attributes for Windows Store Apps (data-win-* attributes)

Wednesday, July 24, 2013

JavaScript class and namespace

Monday, July 8, 2013

Download ISO files from IIS

Thursday, July 4, 2013

Step-by-Step Guide for Setting Up Windows Server 2012 Domain Controller