HT for Web Serialization Manual

Index

Overview
Class Basics
Serialization

Overview

HT for Web provides ht.JSONSerializer serialization function for data model ht.DataModel to serialize the Data objects and attributes serialized into JSON format contained in DataModel and providing deserialization build the function of DataModel data object at the same time. This manual describes the basic class definition rules for the HT for Web, the basic use of the ht.JSONSerializer, and the serialization and deserialization cases of custom classes and attributes.

Class Basics

The JavaScript language does not provide rigorous language level support for object classes, and the HT design of a package system for users to choose from.

The steps for defining and using the com.hightopo.Person class are as follows:

Defining package directory structure
// define package com = {}; com.hightopo = {};
Defining class constructors
// define Person class constructor com.hightopo.Person = function (firstName, lastName){
com.hightopo.Person.superClass.constructor.call(this); this.setFirstName(firstName); this.setLastName(lastName); };
Defining class properties and functions
// define Person class properties and methods ht.Default.def('com.hightopo.Person', Object, { firstName: null, lastName: null, getFirstName: function (){ return this.firstName; }, setFirstName: function (firstName){ this.firstName = firstName; }, getLastName: function (){ return this.lastName; }, setLastName: function (lastName){ this.lastName = lastName; }, getDescription: function (){ return 'firstName:' + this.firstName + ' lastName:' + this.lastName; } });
Building objects and function calls
var person = new com.hightopo.Person('eric', 'lin'); console.log('FirstName - ' + person.getFirstName()); console.log('LastName - ' + person.getLastName()); console.log('Description - ' + person.getDescription());
Output result
FirstName - eric LastName - lin Description - firstName:eric lastName:lin

The steps to define and use the subclass com.hightopo.Student of com.hightopo.Person are as follows:

Defining class constructors
// define Student class constructor com.hightopo.Student = function (firstName, lastName, grade){ com.hightopo.Student.superClass.constructor.call(this, firstName, lastName); this.setGrade(grade); };
Defining class properties and functions
// define Student class properties and methods ht.Default.def('com.hightopo.Student', com.hightopo.Person, { grade: null, getGrade: function (){ return this.grade; }, setGrade: function (grade){ this.grade = grade; }, // override getDescription method
getDescription: function (){ var desc = com.hightopo.Student.superClass.getDescription.call(this); return desc + ' grade:' + this.grade; }
});
Building objects and function calls
var student = new com.hightopo.Student('ben', 'lin', 2); console.log('FirstName - ' + student.getFirstName()); console.log('LastName - ' + student.getLastName()); console.log('Grade - ' + student.getGrade()); console.log('Description - ' + student.getDescription());
Output result
FirstName - ben LastName - lin Grade - 2 Description - firstName:ben lastName:lin grade:2

Serialization

ht.JSONSerializer can serialize and deserialize in JSON format for Data object and the attr property of the DataModel, HT will predefined the get/set attributes of classes, serialized style and attr properties, and the JSONSerializer function is as follow:

toJSON() Function returns the serialized JSON object
serialize(space) Returns the string contents of the JSON object after serialization, space as a blank indent value, and defaults to 2
deserialize(json, rootParent, setId) Deserializes and joins the deserialized object to DataModel
- json: This parameter can be a JSON object, or a string JSON object
- rootParent: If the parent of the deserialized data object is NULL, call data.setParent(rootParent) to set parent for it
- setId: Specify whether to use JSON i information as Data id attribute, default to false means automatically generate id by Data constructor
isSerializable(data) Returns true represents serialization of all objects in default, overloading the function to customize whether data participates in serialization
getProperties(data) Returns the map object of type Object, key for get/set attribute to be serialized
getStyles(data) Returns the map object of type Object, key for style attribute to be serialized
getAttrs(data) Returns the map object of type Object, key for attr attribute to be serialized

The string JSON parameter often occurs because the wrapping information causes an error in parsing, in which case the string parameter is preprocessed by json.replace(/\n/g,"").

The following are the default implementation logic for the get/set, style and attr properties that serialize the related function, can customized overload, the default implementation calls the corresponding function of the Data object, therefore it can change the logic by overloading the implementation of the Data object type.

The default logic of ht.JSONSerializer:

getProperties: function (data){        
    return data.getSerializableProperties();
},
getStyles: function (data){
    return data.getSerializableStyles();
},
getAttrs: function (data){
    return data.getSerializableAttrs();
},

The default logic of ht.Data:

getSerializableProperties: function (){
    return {
        name: 1,
        displayName: 1, 
        icon: 1, 
        toolTip: 1, 
        parent: 1,
        layer: 1,
        tag: 1,
        adjustChildrenToTop: 1            
    };
},
getSerializableStyles: function (){            
    var name, map = {};
    for (name in this._styleMap) {            
        map[name] = 1;
    }
    return map; 
},
getSerializableAttrs: function (){
    var name, map = {};
    for (name in this._attrObject) {            
        map[name] = 1;
    }
    return map; 
}

The default logic of ht.Edge:

getSerializableProperties: function (){
    var map = ht.Edge.superClass.getSerializableProperties.call(this);        
    addMethod(map, {
        source: 1,
        target: 1
    });                
    return map;
}

The following code is a convenient function encapsulated by the DataModel class, and if you do not need to customize the serialization logic, directly manipulate the serialization related function of DataModel.

serialize: function (space){
    return (new ht.JSONSerializer(this)).serialize(space);
},
toJSON: function (){       
    return (new ht.JSONSerializer(this)).toJSON();
},
deserialize: function (json, rootParent, setId) {
    (new ht.JSONSerializer(this)).deserialize(json, rootParent, setId);
}

The following example constructs the subclasses MyData inheritance in ht.Data, if overloaded with getSerializableProperties functions, increased the storage of age properties, and if overloaded getSerializableAttrs functions, stored only attr2 properties, after var jsonString = dataModel.serialize(); serialization and dataModel.deserialize(jsonString) deserialization, attr1 is lost, and all other properties recover to the original value.

The example code is as follows:

// define package
com = {};
com.hightopo = {};

// define MyData
var MyData = com.hightopo.MyData = function (age, attr1, attr2){    
    MyData.superClass.constructor.call(this);
    this.setAge(age);
    this.setAttr('attr1', attr1);
    this.setAttr('attr2', attr2);
};
ht.Default.def('com.hightopo.MyData', ht.Data, {
    _age: 1,
    getAge: function (){
        return this._age;
    },
    setAge: function (age){
        if(age !== this._age){
            var oldValue = this._age;
            this._age = age;
            this.firePropertyChange('age', oldValue, age);
        }
    },
    getSerializableProperties: function (){
        var map = MyData.superClass.getSerializableProperties.call(this);        
        map.age = true;              
        return map;
    },
    getSerializableAttrs: function (){
        return {
            attr2: 1
        }; 
    }                         
});                

var dataModel = new ht.DataModel();
dataModel.setAttr('website', 'www.hightopo.com');                

var data = new MyData(34, 'tw', 'ht');
data.setTag('20130301');
dataModel.add(data);                                                  

var jsonString = dataModel.serialize();
console.log(jsonString); 

dataModel.clear();
dataModel.setAttr('website', null);
dataModel.deserialize(jsonString);
data = dataModel.getDataByTag('20130301');

console.log(data.getAge());
console.log(data.getAttr('attr1'));
console.log(data.getAttr('attr2'));
console.log(dataModel.getAttr('website'));

The results of the operation are as follows:

{
  "v": "2.8",
  "d": [
    {
      "c": "com.hightopo.MyData",
      "i": 3,
      "p": {
        "tag": "20130301",
        "age": 34
      },
      "a": {
        "attr2": "ht"
      }
    }
  ],
  "a": {
    "website": "www.hightopo.com"
  }
} 

34 
undefined 
ht 
www.hightopo.com

Welcom to communicate with service@hightopo.com