FWD » Core Development » User Interface

=== modified file 'src/com/goldencode/p2j/ui/client/driver/web/res/p2j.js'

--- src/com/goldencode/p2j/ui/client/driver/web/res/p2j.js	2015-10-22 23:14:19 +0000

+++ src/com/goldencode/p2j/ui/client/driver/web/res/p2j.js	2015-12-15 19:48:22 +0000

@@ -19,6 +19,8 @@

 **                  common clipboard logic.  Added p2j.fonts.

 ** 007 SBI 20150901 Modifications to initialization order.

 ** 008 SBI 20151020 Increased logging buffer size.

+** 009 SBI 20151215 Fixed to take into an account that for Chrome an element style object has only

+**                  the "getter" access function. 

 */

 "use strict";

@@ -135,9 +137,16 @@

          {

             if (typeof source[prop] == "object")

             {

-               target[prop] = {};

-               

-               setOwnPropertiesTo(target[prop], source[prop]);

+               if (prop === "style" && target.setAttribute !== undefined

+                  && typeof target.setAttribute === "function")

+               {

+                  setStyleForElement(target, source[prop]);

+               }

+               else

+               {

+                  target[prop] = {};

+                  setOwnPropertiesTo(target[prop], source[prop]);

+               }

             }

             else

             {

@@ -148,6 +157,68 @@

    }

    /**

+    * Returns the string representation of all own object's properties in the following format:

+    * [key1 : value1[; key2 : value2] ...]

+    * 

+    * @param    {Object} styleObj

+    *           The custom object that holds the target style properties.

+    *

+    * @return   The object's properties as a "key1 : value1; key2 : value2 ..." string.

+    */

+   function toProperties(styleObj)

+   {

+      var clsDef = "";

+      if (!styleObj)

+      {

+         return clsDef;

+      }

+      

+      for (var prop in styleObj)

+      {

+         if (styleObj.hasOwnProperty(prop))

+         {

+            if (typeof styleObj[prop] !== "object")

+            {

+               clsDef += (prop + ":" + styleObj[prop] + ";");

+            }

+         }

+      }

+      

+      return clsDef;

+   }

+   

+   /**

+    * Sets the provided style properties for the given html element.

+    * 

+    * @param    {HtmlElement} element

+    *           The DOM element which will be the parent for the new canvas. If not provided, the

+    *           default container element will be used.

+    * @param    {Object} styleObj

+    *           The custom object that holds the target style properties.

+    */

+   function setStyleForElement(element, styleObj)

+   {

+      if (element["styleObj"] === undefined)

+      {

+         element["styleObj"] = styleObj;

+      }

+      else

+      {

+         // override common properties

+         for (var prop in styleObj)

+         {

+            if (styleObj.hasOwnProperty(prop))

+            {

+               element["styleObj"][prop] = styleObj[prop];

+            }

+         }

+      }

+      element.setAttribute("style", toProperties(element["styleObj"]));

+   }

+   

+   me.setStyleForElement = setStyleForElement;

+   

+   /**

     * Helper function to crate a new canvas as a child of the given element and with

     * caller-defined optional settings.

     *

=== modified file 'src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.virtual_desktop.js'

--- src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.virtual_desktop.js	2015-10-22 23:14:19 +0000

+++ src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.virtual_desktop.js	2015-12-15 19:46:52 +0000

@@ -11,6 +11,8 @@

 ** -#- -I- --Date-- ------------------------------Description----------------------------------

 ** 001 SBI 20150906 The virtual desktop to create task bar and drop zones.

 ** 002 SBI 20151020 Fix for disabling old task icons.

+** 003 SBI 20151215 Fixed to take into an account that for Chrome an element style object has only

+**                  the "getter" access function. 

 */

 "use strict";

@@ -77,9 +79,7 @@

    /** the parent element for the virtual desktop */

    var desktop = document.createElement("div");

-   desktop.style["position"] = "fixed";

-   desktop.style["top"]  = "0px";

-   desktop.style["left"] = "0px";

+   p2j.setStyleForElement(desktop, {position : "fixed", top : "0px", left : "0px"});

    var body = document.body;

    body.appendChild(desktop);

@@ -109,14 +109,15 @@

       var bottom = document.createElement("div");

       bottom.className = dockClassName;

-      bottom.style["position"] = "fixed";

-      

-      bottom.style["bottom"]  = "0px";

-      

-      bottom.style["height"] = height + "px";

-      bottom.style["width"]  = "100%";

-

-      bottom.style.zIndex = MAX_Z_INDEX;

+      p2j.setStyleForElement(bottom,

+                               {

+                                  position : "fixed",

+                                  left     : "0px",

+                                  bottom   : "0px",

+                                  height   : height + "px",

+                                  width    : "100%",

+                                  "z-index"  : MAX_Z_INDEX

+                               });

       return bottom;

    };

@@ -135,15 +136,15 @@

    {

       var right = document.createElement("div");

       right.className = dockClassName;

-      right.style["position"] = "fixed";

-      

-      right.style["right"] = "0px";

-      right.style["top"]   = "0px";

-      

-      right.style["height"] = "100%";

-      right.style["width"]  = width + "px";

-

-      right.style.zIndex = MIN_Z_INDEX;

+      p2j.setStyleForElement(right,

+                              {

+                                 position : "fixed",

+                                 right    : "0px",

+                                 top      : "0px",

+                                 height   : "100%",

+                                 width    : width + "px",

+                                 "z-index"  : MIN_Z_INDEX

+                              });

       return right;

    };

@@ -161,13 +162,13 @@

       var peer = document.createElement("div");

       peer.id = id;

       peer.tabIndex = 1;

-      peer.style["position"] = "relative";

-      

-      peer.style["height"] = "100%";

-      peer.style["width"]  = "100%";

-      

-      peer.style.zIndex = MAX_Z_INDEX;

-      

+      p2j.setStyleForElement(peer,

+            {

+               position : "relative",

+               height   : "100%",

+               width    : "100%",

+               "z-index"  : MAX_Z_INDEX

+            });

       peer.draggable = true;

       return peer;

    };

@@ -239,9 +240,12 @@

       var canvas = document.createElement('canvas');

       canvas.className="canvas";

-      canvas.style["height"] = "100%";

-      canvas.style["width"]  = "100%";

-      canvas.style.zIndex = MAX_Z_INDEX;

+      p2j.setStyleForElement(canvas,

+            {

+               height   : "100%",

+               width    : "100%",

+               "z-index"  : MAX_Z_INDEX

+            });

       peer.appendChild(canvas);

       var ctx = canvas.getContext('2d', {alpha : true});

@@ -958,7 +962,10 @@

          var cls = event.target.className;

           if ( cls.indexOf(DOCK_CLASS_NAME) >= 0)

           {

-             event.target.style["background"] = getTransparentColor(background, 0.5);

+             p2j.setStyleForElement(event.target,

+                   {

+                      background : getTransparentColor(background, 0.5)

+                   });

           }

       }, false);

@@ -971,7 +978,10 @@

          if ( cls.indexOf(DOCK_CLASS_NAME) >= 0 )

          {

-            event.target.style["background"] = getTransparentColor(background, 0.0);

+            p2j.setStyleForElement(event.target,

+                  {

+                     background : getTransparentColor(background, 0.0)

+                  });

          }

       }, false);

@@ -988,14 +998,23 @@

             try

             {

                event.target.appendChild(dragged);

-               event.target.style.zIndex = MAX_Z_INDEX;

-               parent.style["background"] = getTransparentColor(background, 0.0);

-               parent.style.zIndex = MIN_Z_INDEX;

+               p2j.setStyleForElement(event.target,

+                     {

+                        "z-index" : MAX_Z_INDEX

+                     });

+               p2j.setStyleForElement(parent,

+                     {

+                        background : getTransparentColor(background, 0.0),

+                        "z-index"    : MIN_Z_INDEX

+                     });

             }

             catch(e)

             {

                parent.addChild(dragged);

-               parent.style.zIndex = MAX_Z_INDEX;

+               p2j.setStyleForElement(parent,

+                     {

+                        "z-index"    : MAX_Z_INDEX

+                     });

             }

             draw();

          }