{"action":"created","issue":{"url":"https://api.github.com/repos/timcreative/get-shit-done-pro/issues/18","repository_url":"https://api.github.com/repos/timcreative/get-shit-done-pro","labels_url":"https://api.github.com/repos/timcreative/get-shit-done-pro/issues/18/labels{/name}","comments_url":"https://api.github.com/repos/timcreative/get-shit-done-pro/issues/18/comments","events_url":"https://api.github.com/repos/timcreative/get-shit-done-pro/issues/18/events","html_url":"https://github.com/timcreative/get-shit-done-pro/issues/18","id":65778254,"number":18,"title":"Feature Request: Revert State/Retry Morphing button","user":{"login":"egroenen","id":8152600,"avatar_url":"https://avatars.githubusercontent.com/u/8152600?v=3","gravatar_id":"","url":"https://api.github.com/users/egroenen","html_url":"https://github.com/egroenen","followers_url":"https://api.github.com/users/egroenen/followers","following_url":"https://api.github.com/users/egroenen/following{/other_user}","gists_url":"https://api.github.com/users/egroenen/gists{/gist_id}","starred_url":"https://api.github.com/users/egroenen/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/egroenen/subscriptions","organizations_url":"https://api.github.com/users/egroenen/orgs","repos_url":"https://api.github.com/users/egroenen/repos","events_url":"https://api.github.com/users/egroenen/events{/privacy}","received_events_url":"https://api.github.com/users/egroenen/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/timcreative/get-shit-done-pro/labels/feature","name":"feature","color":"207de5"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":3,"created_at":"2015-04-01T21:00:26Z","updated_at":"2016-05-18T00:08:50Z","closed_at":null,"body":"At the moment once you click on a morphing button all of the changes are permanent, so the button can only ever be used once.\r\n\r\nIt would be nice to be able to set a state which reverted the state of the button (possibly after a delay or whatever).\r\n\r\nIt isn't too hard reverting the classes etc, the only tricky bit is where onclick the html contents of the button are zapped. That will require a redesign to avoid zapping it so that it can be reinstated.\r\n\r\nMight I also suggest better documentation for your own javascript additions, one example is barely enough, we are forced to delve into your code, which slows down development."},"comment":{"url":"https://api.github.com/repos/timcreative/get-shit-done-pro/issues/comments/219890515","html_url":"https://github.com/timcreative/get-shit-done-pro/issues/18#issuecomment-219890515","issue_url":"https://api.github.com/repos/timcreative/get-shit-done-pro/issues/18","id":219890515,"user":{"login":"shibbs1","id":4123977,"avatar_url":"https://avatars.githubusercontent.com/u/4123977?v=3","gravatar_id":"","url":"https://api.github.com/users/shibbs1","html_url":"https://github.com/shibbs1","followers_url":"https://api.github.com/users/shibbs1/followers","following_url":"https://api.github.com/users/shibbs1/following{/other_user}","gists_url":"https://api.github.com/users/shibbs1/gists{/gist_id}","starred_url":"https://api.github.com/users/shibbs1/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/shibbs1/subscriptions","organizations_url":"https://api.github.com/users/shibbs1/orgs","repos_url":"https://api.github.com/users/shibbs1/repos","events_url":"https://api.github.com/users/shibbs1/events{/privacy}","received_events_url":"https://api.github.com/users/shibbs1/received_events","type":"User","site_admin":false},"created_at":"2016-05-18T00:08:49Z","updated_at":"2016-05-18T00:08:49Z","body":"> For those who are interested, here is a fix (hack). \r\nI added a new 'action' (resetState) to gsdk-morphing.js. \r\n\r\n`}else if(option.action == 'resetState') {\r\n              $item = $(this);\r\n              $item.removeClass(\"resize\").removeAttr('style');\r\n              $parent = $item.parent('.btn-morphing');\r\n              $parent.removeClass('morphing-' + state);\r\n              $span = $parent.find('.fa');\r\n              $span.removeClass(icon).removeClass('visible');\r\n              $path = $parent.find('path');\r\n              $path.removeAttr('style');\r\n              $svg = $parent.find('svg');\r\n              $svg.removeAttr('style');\r\n              $item.text(option.title);\r\n          }`\r\n\r\nOnce this is added, then in my site/login.js file where I animate the morphin button I added two helper classes:\r\n\r\n`function setMorphButton($button, $icon, $state) {\r\n    $button.morphingButton({\r\n        action: 'setState',\r\n        icon: $icon,\r\n        state: $state\r\n    });\r\n}\r\n`\r\n\r\n`function resetMorphButton($button, $title, $icon, $state) {\r\n    $button.morphingButton({\r\n        action: 'resetState',\r\n        title: $title,\r\n        icon: $icon,\r\n        state: $state\r\n    });\r\n}`\r\n\r\nThen, they are called like this for error:\r\n\r\n```\r\nsetMorphButton($button,'fa-times', 'error');\r\n// do some ajax respnse validation \r\n// reset the button to it's original state\r\n                    setTimeout(function(){\r\n                        resetMorphButton($button, 'Login','fa-time', 'error');\r\n                    }, 1000);\r\n```\r\n\r\nor for success:\r\n`setMorphButton($button,'fa-check', 'success');\r\n                    setTimeout(function () {\r\n                        resetMorphButton($button, 'Login','fa-check', 'success');\r\n                    }, 1000);`\r\n\r\n(attaching the two files). Hope it helps!\r\n[morphing-reset.zip](https://github.com/timcreative/get-shit-done-pro/files/269403/morphing-reset.zip)"}}