StdJS 0.2.1リリース、汎用javascriptライブラリ

StdJS 0.2.1は、バージョン0.2に存在するいくつかの既知のバグを修正するとともに、いくつかの新しい方法を追加し、一部の機能を更新した.
 
 

機能の追加:

 
1.Std.cssモジュールは、指定したcss名に対するブラウザのサポート状況をテストする静的メソッドsupportを追加し、ブラウザが指定した名前のcss属性をサポートしている場合、trueを返し、そうでない場合falseを返します.
 

//true
Std.css.support("fontSize");
Std.css.support("font-size");
//false
Std.css.support("boxWidth");
//true
Std.css.support("animation",true);

 
 
 
2.Std.timerモジュールには、指定関数を実行するための静的メソッドtestが追加する、関数の実行回数を指定し、実行が完了すると、この関数の実行にかかる時間を返すことができる.
 

//         
Std.timer.test(function(){
    for(var i=0;i<100000000;i++){
    }
});

 
 
 
3.Std.domモジュールは、オブジェクトがdocumentオブジェクトであるか否かを判断するBoolean値を返す静的方法isDocumentを追加する.
 
4.Std.domモジュールは、指定する要素の文書ルート要素を取得するための静的メソッドdocumentElementを追加し、渡されたパラメータがDOM要素ではなくdocumentである場合、documentを返す.documentElement、windowの場合はwindowを返します.document.documentElement
 
 

機能の更新:

 
1.Std.domのメンバーメソッドinsertを更新し、2番目のパラメータまたは2番目のパラメータが空でない場合、デフォルトで末尾に挿入する.
2.Std.domのメンバーメソッドを更新addClass,removeClass,toggleClass,classNameがdocumentとwindowで操作している間にdocumentElementに直接移行
 
 

バグ修正:

 
1.Std.domメンバーメソッドaddClassがクラス名を追加するときにスペースを追加できるバグを修正しました2.Std.domを修復しました.unitedモジュールはcssセレクタによって要素を取得する際にchromeの下で重複するバグ3を取得する可能性がある.Std.domのメンバーメソッドinsertが最後のインデックス位置に挿入された不正なバグ4を修正しました.Std.domのメンバーメソッドを修正しましたhasFocusはdocumentが焦点を失った後に結果の不正確なバグ5を取得しました.Std.uiのlayoutモジュールinsertメソッド挿入エラーのバグ6を修正しました.Std.uiを修復するlockerモジュールにスクロールバーがある場合はページ全体のバグ7を隠すことができない.Std.domのメンバーメソッドmouseを修正しました.documentとwindowオブジェクトでエラーが発生し、unselectオプションが機能しないバグ
 
 
StdJSドキュメントアドレス:
 
http://doc.stdjs.com/action_documentation.location_documentation&ID=8
 
 

いくつかのStdJSコードの例

 

/*
*     div      10 HTML abc span   ,    body.
*/
var abc = new Std.dom("div>span{abc}*10","body")

 

<!--
  css selector     html  ,           html
-->
<script type="text/std-css-selector" render-here="true">
    (.header > .title + .navigation) +
    (.body > .content > span{body content}) +
    (.footer > .links > (a[href='#']{link1} + a[href='#']{link2}))
</script>

 

<!--
 css selector         UI     , JS     80%   
-->

<script type="text/std-ui" std-name="test">
GridLayout[rows=3][columns=2] > (
    (Label{  :} + LineEdit#name) +
    (Label{  :} + DateTimeEdit#dateTime) +
    (Label{  :} + TextEdit#text)
)
</script>

 

/*
*              ,            Std.main   
* Std.require            
*/

//3       
Std.require("1.js","1.css","123.png");

//3       ,             
Std.require(["1.js","1.css","123.png"]);

 

/*
*           ,                   ,       
*           ,                .
*/
Std.source("StdJS","http://source.stdjs.com");

//      ui.Window          
Std.use("ui.Window",function(){
    //...
});

//      ,         ,           "ui.Button","ui.ToolBar"
var func1 = Std.func(function(){
    //....
},{
    packages:["ui.Button","ui.ToolBar"]
});
                 

 

/*
*                 css  .
*                 ,               
*                 style link     css
*/
Std.css({
    body:{
        color:"red",
        transform:"skewY(-6deg)"
    },
    span:{
        color:"black"
    },
    "#content":{
        '>':{
            p:{
                lineHeight:"20px"
            }
        }
    }
});

 

<!--
  html    Std.animation.keyframes CSS3               ..
StdJS          ,       ,             
                    
-->

<script type="text/std-animation">
@keyframes testKeyframe{
    0%{
      width:50px;
      height:100px;
      background:red;
    }
    50%{
      width:90px;
      height:120px;
      background:blue;
      color:red;
      animation-timing-function:ease;
    }
    100%{
      height:150px;
      width:300px;
      background:green;
      color:blue;
    }
}
</script>

 

<!--
     ,      ,     JS  
-->

<script type="text/std-template" std-name="tpl1">
    <?@include 'header.tpl'?>
    <div class="title"><?=title?></div>
    <?#each abc as index,value?>
    <div class="item">
        <div class="_index"><?=index?></div>
        <div class="_value"><?=value?></div>
    </div>
    <?/each?>
</script>

<script>
    Std.main(function(){
        Std.template("tpl1").renderTo("body",{
            abc:["first","second","last"],
            title:"title text"
        });
    })
</script>

 

/*
*       ,A B,  B    A
*   B     A     ,      ,option    ,   
*          ,              
*/
var A = Std.module({
    model:"events",
    option:{
        width:32,
        height:32,
        name:"test"
    },
    static:{
        func1:function(){
            console.log("static func1");
        },
        func2:function(){
            console.log("static func2");
        }
    },
    public:{
        func1:function(){
            console.log("func1_A");
        },
        func2:function(){
            console.log(this.opts.name);
        }
    },
    main:function(option){
        this.init_opts(option);
        console.log("main_a");
    }
});

//    B,    A,        func1
var B = Std.module({
    parent:A,
    option:{
        name:"testB"
    },
    extend:{
        func1:function(){
            console.log("func1_B")
        }
    },
    main:function(){
        console.log("main_b");
    }
})

//    A   
var a = new A({width:44});

//    B   
var b = new B({width:56});

 
StdJSサイト:http://www.stdjs.com