fix(window): pin/unpin icons are swapped in Window component telerik/kendo#7059

Author: jivanova

src/kendo.window.js

@@ -152,10 +152,6 @@
 
                 that._position();
 
-                if (options.pinned) {
-                    that.pin(true);
-                }
-
                 if (content) {
                     that.refresh(content);
                 }
@@ -185,6 +181,10 @@
 
                 this._draggable();
 
+                if (options.pinned) {
+                    that.pin();
+                }
+
                 id = element.attr("id");
                 if (id) {
                     id = id + "_wnd_title";
@@ -365,12 +365,15 @@
             },
 
             _actions: function() {
-                var actions = this.options.actions;
+                var options = this.options;
+                var actions = options.actions;
+                var pinned = options.pinned;
                 var titlebar = this.wrapper.children(KWINDOWTITLEBAR);
                 var container = titlebar.find(".k-window-actions");
                 var windowSpecificCommands = [ "maximize", "minimize" ];
 
                 actions = $.map(actions, function(action) {
+                    action = !pinned && action.toLowerCase() === "pin" ? "unpin" : action;
                     return { name: (windowSpecificCommands.indexOf(action.toLowerCase()) > - 1) ? "window-" + action : action };
                 });
 
@@ -544,8 +547,8 @@
                     "k-i-window-minimize": "minimize",
                     "k-i-window-restore": "restore",
                     "k-i-refresh": "refresh",
-                    "k-i-pin": "pin",
-                    "k-i-unpin": "unpin"
+                    "k-i-pin": "unpin",
+                    "k-i-unpin": "pin"
                 }[iconClass];
             },
 
@@ -1058,18 +1061,19 @@
                 return this.options.isMinimized;
             },
 
-            pin: function(force) {
+            pin: function() {
                 var that = this,
                     win = $(window),
                     wrapper = that.wrapper,
                     top = parseInt(wrapper.css("top"), 10),
                     left = parseInt(wrapper.css("left"), 10);
 
-                if (force || !that.options.pinned && !that.options.isMaximized) {
+                if (!that.options.isMaximized) {
                     wrapper.css({position: "fixed", top: top - win.scrollTop(), left: left - win.scrollLeft()});
-                    wrapper.children(KWINDOWTITLEBAR).find(KPIN).addClass("k-i-unpin").removeClass("k-i-pin");
+                    wrapper.children(KWINDOWTITLEBAR).find(KUNPIN).addClass("k-i-pin").removeClass("k-i-unpin");
 
                     that.options.pinned = true;
+                    that.options.draggable = false;
                 }
             },
 
@@ -1080,11 +1084,12 @@
                     top = parseInt(wrapper.css("top"), 10),
                     left = parseInt(wrapper.css("left"), 10);
 
-                if (that.options.pinned && !that.options.isMaximized) {
+                if (!that.options.isMaximized) {
                     wrapper.css({position: "", top: top + win.scrollTop(), left: left + win.scrollLeft()});
-                    wrapper.children(KWINDOWTITLEBAR).find(KUNPIN).addClass("k-i-pin").removeClass("k-i-unpin");
+                    wrapper.children(KWINDOWTITLEBAR).find(KPIN).addClass("k-i-unpin").removeClass("k-i-pin");
 
                     that.options.pinned = false;
+                    that.options.draggable = true;
                 }
             },
 
@@ -1483,7 +1488,7 @@
                     actions = element.find(".k-window-actions"),
                     containerOffset = kendo.getOffset(wnd.appendTo);
 
-                this._preventDragging = wnd.trigger(DRAGSTART);
+                this._preventDragging = wnd.trigger(DRAGSTART) || !wnd.options.draggable;
                 if (this._preventDragging) {
                     return;
                 }

tests/window/api.js

@@ -546,13 +546,13 @@
             actions: ["Pin"]
         });
 
-        equal(dialog.wrapper.find(".k-i-pin").length, 1);
-        equal(dialog.wrapper.find(".k-i-unpin").length, 0);
+        equal(dialog.wrapper.find(".k-i-unpin").length, 1);
+        equal(dialog.wrapper.find(".k-i-pin").length, 0);
 
         dialog.pin();
 
-        equal(dialog.wrapper.find(".k-i-unpin").length, 1);
-        equal(dialog.wrapper.find(".k-i-pin").length, 0);
+        equal(dialog.wrapper.find(".k-i-pin").length, 1);
+        equal(dialog.wrapper.find(".k-i-unpin").length, 0);
     });
 
     test("pin() substracts the browser scroll position from the wrapper's top and left styles", function() {
@@ -604,13 +604,13 @@
             pinned: true
         });
 
-        equal(dialog.wrapper.find(".k-i-unpin").length, 1);
-        equal(dialog.wrapper.find(".k-i-pin").length, 0);
+        equal(dialog.wrapper.find(".k-i-pin").length, 1);
+        equal(dialog.wrapper.find(".k-i-unpin").length, 0);
 
         dialog.unpin();
 
-        equal(dialog.wrapper.find(".k-i-pin").length, 1);
-        equal(dialog.wrapper.find(".k-i-unpin").length, 0);
+        equal(dialog.wrapper.find(".k-i-unpin").length, 1);
+        equal(dialog.wrapper.find(".k-i-pin").length, 0);
     });
 
     test("unpin() adds the browser scroll position to the wrapper's top and left styles", function() {
@@ -777,7 +777,7 @@
         dialog.maximize();
         dialog.restore();
 
-        equal(dialog.wrapper.find(".k-i-pin:visible").length, 1);
+        equal(dialog.wrapper.find(".k-i-unpin:visible").length, 1);
     });
 
     test("restore() removes the k-window-maximized class", function() {

tests/window/initialization.js

@@ -420,7 +420,7 @@
 
     test("creating pinned window with a Pin command adds an Unpin button", function() {
         var dialog = createWindow({ pinned: true, actions: ["Pin"] });
-        equal(dialog.wrapper.find(".k-i-unpin").length, 1);
+        equal(dialog.wrapper.find(".k-i-pin").length, 1);
     });
 
     test("creating window with an int zero top position applies a top style", function() {