OSDN Git Service

Support a fill attribute of the SMIL Animation
authordhrname <dhrname@users.sourceforge.jp>
Sun, 17 May 2015 14:05:02 +0000 (23:05 +0900)
committerdhrname <dhrname@users.sourceforge.jp>
Sun, 17 May 2015 14:05:02 +0000 (23:05 +0900)
org/w3c/dom/smil.js
tool/Spec/spec/SvgDomSpec.js

index 0f8a67e..44f386a 100644 (file)
@@ -834,22 +834,58 @@ base("$calcMode").up("$attribute").mix( {
   /*指定された属性の規定値*/\r
   defaultValue: "",\r
   \r
+  /*もともと属性がターゲットの要素につけられていたかどうか*/\r
+  isDefault: false,\r
+  \r
   /*initメソッドで使われるアニメーション関数*/\r
-  setFrame: function () {\r
+  _setFrame: function (frame) {\r
     this.element.setAttributeNS(null, this.attrName, this.to);\r
   },\r
   \r
+  /*アニメーションが終了したかどうか*/\r
+  isEnd: false,\r
+  \r
+  /*アニメが終了した際の後処理*/\r
+  _setEndFrame: function(frame) {\r
+              if ( ( frame < (this.begin + this.activeTime) ) || this.isEnd) {\r
+                /*アニメーションが終了間近でなければ凍結の処理をしない*/\r
+                return;\r
+              }\r
+              this.isEnd = true;\r
+              /*アニメーションを凍結せずに、もとに戻す*/\r
+              if ((this.fill === "remove") && this.isDefault) {\r
+                this.element.setAttributeNS(null, this.attrName, this.defaultValue);\r
+              } else if ((this.fill === "remove") && !this.isDefault) {\r
+                this.element.removeAttributeNS(null, this.attrName);\r
+              }\r
+  },\r
+  \r
   init: function(ele) {\r
     var line = this.push(ele);\r
     if (ele && ele.getAttributeNS) {\r
       this.to = ele.getAttributeNS(null, "to") || "";\r
       this.attrName = ele.getAttributeNS(null, "attributeName") || "";\r
+      this.fill = ele.getAttributeNS(null, "fill") || "remove";\r
     }\r
     var thisele = this.element;\r
     if (line && thisele) {\r
+      this.isDefault = thisele.hasAttributeNS(null, this.attrName);\r
       this.defaultValue = thisele.getAttributeNS(null, this.attrName)\r
          || thisele.ownerDocument.defaultView.getComputedStyle(thisele, "").getPropertyValue(this.attrName);\r
-      line.setFrame = this.setFrame.bind(this);\r
+      line.addLine(\r
+       { setFrame: this._setFrame.bind(this),\r
+         begin: 1,\r
+         activeTime: 1\r
+       }\r
+      );\r
+      this.activeTime = line.activeTime;\r
+      this.begin = line.begin;\r
+      base("$frame").addLine(\r
+        { setFrame: this._setEndFrame.bind(this),\r
+          begin: 1,\r
+          activeTime: 1\r
+        }\r
+      );\r
     }\r
     line = thisele = void 0;\r
   }\r
index 570bca5..11e5699 100644 (file)
@@ -3592,11 +3592,12 @@ describe("SMIL Animation Spec", function() {
         expect($set.to).toBe("");\r
         expect($set.attrName).toBe("");\r
         expect($set.defaultValue).toBe("");\r
+        expect($set.isDefault).toBeFalsy();\r
         $set.init();\r
         $set.init(ele);\r
         expect($set.to).toBe("");\r
         expect($set.attrName).toBe("");\r
-      \r
+        expect($set.isDefault).toBeFalsy();\r
       } );\r
       /*同値分割をして、有効同値クラスを調べておく (Equivalence partitioning, the following is the valid partion)*/\r
       it("should be this for the value (the valid partion on a spline mode )", function() {\r
@@ -3615,11 +3616,13 @@ describe("SMIL Animation Spec", function() {
         ele.parentNode.setAttributeNS(null, "tt1", "undef");\r
         $set.init(ele);\r
         expect($set.defaultValue).toBe("undef");\r
+        expect($set.isDefault).toBeTruthy();\r
 \r
         ele.setAttributeNS(null, "attributeName", "font-size");\r
         ele.parentNode.style.setProperty("font-size", "12px");\r
         $set.init(ele);\r
         expect($set.defaultValue).toBe("12px");\r
+        expect($set.isDefault).toBeFalsy();\r
       } );\r
       /*無効同値クラスを調べておく (Equivalence partitioning, the following is the invalid partion)*/\r
       it("should be this for the value (the invalid partion on a spline mode )", function() {\r
@@ -3646,6 +3649,7 @@ describe("SMIL Animation Spec", function() {
       } );\r
       /*境界条件を調べておく (limit value analysis)*/\r
       it("should be this for the value  (limit value analysis)", function() {\r
+        expect($set.isEnd).toBeFalsy();\r
         ele.setAttributeNS(null, "dur", "1s");\r
         ele.setAttributeNS(null, "attributeName", "fill");\r
         ele.setAttributeNS(null, "to", "red");\r
@@ -3655,6 +3659,24 @@ describe("SMIL Animation Spec", function() {
       } );\r
       /*同値分割をして、有効同値クラスを調べておく (Equivalence partitioning, the following is the valid partion)*/\r
       it("should be this for the value (the valid partion on a spline mode )", function() {\r
+        ele.setAttributeNS(null, "begin", "1s");\r
+        ele.setAttributeNS(null, "dur", "1s");\r
+        ele.setAttributeNS(null, "attributeName", "fill");\r
+        ele.setAttributeNS(null, "to", "red");\r
+        $set.init(ele);\r
+        var f = function(num) {\r
+          frame.setFrame(num);\r
+          expect(ele.parentNode.getAttributeNS(null, "fill") || null).toBeNull();\r
+        }\r
+        f(0);\r
+        f(1);\r
+        f(23);\r
+        frame.setFrame(24);\r
+        expect(ele.parentNode.getAttributeNS(null, "fill")).toBe("red");\r
+        frame.setFrame(25);\r
+        expect(ele.parentNode.getAttributeNS(null, "fill")).toBe("red");\r
+        frame.setFrame(48);\r
+        expect(ele.parentNode.getAttributeNS(null, "fill") || null).toBeNull();\r
       } );\r
       /*無効同値クラスを調べておく (Equivalence partitioning, the following is the invalid partion)*/\r
       it("should be this for the value (the invalid partion on a spline mode )", function() {\r