{"action":"created","issue":{"url":"https://api.github.com/repos/miguel-perez/smoothState.js/issues/103","labels_url":"https://api.github.com/repos/miguel-perez/smoothState.js/issues/103/labels{/name}","comments_url":"https://api.github.com/repos/miguel-perez/smoothState.js/issues/103/comments","events_url":"https://api.github.com/repos/miguel-perez/smoothState.js/issues/103/events","html_url":"https://github.com/miguel-perez/smoothState.js/issues/103","id":46854987,"number":103,"title":"Update DOM elements outside of $container","user":{"login":"pudgereyem","id":468498,"avatar_url":"https://avatars.githubusercontent.com/u/468498?v=3","gravatar_id":"","url":"https://api.github.com/users/pudgereyem","html_url":"https://github.com/pudgereyem","followers_url":"https://api.github.com/users/pudgereyem/followers","following_url":"https://api.github.com/users/pudgereyem/following{/other_user}","gists_url":"https://api.github.com/users/pudgereyem/gists{/gist_id}","starred_url":"https://api.github.com/users/pudgereyem/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pudgereyem/subscriptions","organizations_url":"https://api.github.com/users/pudgereyem/orgs","repos_url":"https://api.github.com/users/pudgereyem/repos","events_url":"https://api.github.com/users/pudgereyem/events{/privacy}","received_events_url":"https://api.github.com/users/pudgereyem/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/miguel-perez/smoothState.js/labels/duplicate","name":"duplicate","color":"cccccc"},{"url":"https://api.github.com/repos/miguel-perez/smoothState.js/labels/enhancement","name":"enhancement","color":"006b75"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":14,"created_at":"2014-10-26T21:14:39Z","updated_at":"2015-12-01T06:38:44Z","closed_at":"2015-05-24T21:05:40Z","body":"## smoothState.js version tested:\r\n - Version 0.5.1\r\n\r\n## Description\r\nOn the website I'm building now I have information attached to `<body>` such as `id`, `classes` and `styles`. Like below:\r\n\r\n`<body id=\"project-name\" class=\"project single theme-dark\" style=\"background:white\">`\r\n\r\n..in order to control the page's:\r\n\r\n- background color\r\n- color theme (dark/white).\r\n\r\nI initialize smoothState on a div #main and when I click a link everything under #main gets updated. The problem is that `body` not gets updated.\r\n\r\n## Possible solution:\r\nMy first approach to fix this was to use the callback `onEnd`, but none of the variables passed to the `render` function (`url, $container, $content`) holds any information about the `<body>`.  At least to my knowledge – am I missing something?\r\n\r\nSince I couldn't solve this with the callback functions I made changes to jquery.smoothState.js. What I did was to extend the `storePageIn` function, adding information to the object variable with a new key `meta`. See code below:\r\n\r\n```\r\nstorePageIn: function (object, url, $html) {\r\n    $html = ($html instanceof jQuery) ? $html : utility.htmlDoc($html);\r\n    // Add meta information\r\n    // Added by @pudgereyem\r\n    var meta = {}\r\n    meta.bodyId = $html.find( 'body' ).attr( 'id' );\r\n    meta.bodyClasses = $html.find( 'body' ).attr( 'class' );\r\n    meta.bodyCSS = $html.find( 'body' ).attr( 'style' );\r\n\r\n    object[url] = { // Content is indexed by the url\r\n        status: \"loaded\",\r\n        title: $html.find(\"title\").text(), // Stores the title of the page\r\n        html: $html, // Stores the contents of the page\r\n        meta: meta\r\n    };\r\n    return object;\r\n},\r\n```\r\n\r\n..and then I also extended the function `updateContent` to actually update `body`:\r\n\r\n```\r\n/** Updates the contents from cache[url] */\r\nupdateContent = function (url) {\r\n    // If the content has been requested and is done:\r\n    var containerId = '#' + $container.prop('id'),\r\n        $content    = utility.getContentById(containerId, cache[url].html);\r\n\r\n    if($content) {\r\n        document.title = cache[url].title;\r\n\r\n        // Update body ID, classes and style\r\n        // Added by @pudgereyem\r\n        $body.removeClass().addClass(cache[url].meta.bodyClasses);\r\n        $body.attr('id', cache[url].meta.bodyId);\r\n        $body.attr('style', cache[url].meta.bodyCSS);\r\n...\r\n```\r\n\r\n## Discussion\r\n- Wouldn't it make sense if the callbacks provided offer the complete ajax response from the page that gets fetched? So users have greater freedom and not having to change the actual code of this script.\r\n\r\n- What do you think about extending the code with `meta information` about the page being fetched like I suggested above?"},"comment":{"url":"https://api.github.com/repos/miguel-perez/smoothState.js/issues/comments/160871528","html_url":"https://github.com/miguel-perez/smoothState.js/issues/103#issuecomment-160871528","issue_url":"https://api.github.com/repos/miguel-perez/smoothState.js/issues/103","id":160871528,"user":{"login":"pudgereyem","id":468498,"avatar_url":"https://avatars.githubusercontent.com/u/468498?v=3","gravatar_id":"","url":"https://api.github.com/users/pudgereyem","html_url":"https://github.com/pudgereyem","followers_url":"https://api.github.com/users/pudgereyem/followers","following_url":"https://api.github.com/users/pudgereyem/following{/other_user}","gists_url":"https://api.github.com/users/pudgereyem/gists{/gist_id}","starred_url":"https://api.github.com/users/pudgereyem/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pudgereyem/subscriptions","organizations_url":"https://api.github.com/users/pudgereyem/orgs","repos_url":"https://api.github.com/users/pudgereyem/repos","events_url":"https://api.github.com/users/pudgereyem/events{/privacy}","received_events_url":"https://api.github.com/users/pudgereyem/received_events","type":"User","site_admin":false},"created_at":"2015-12-01T06:38:44Z","updated_at":"2015-12-01T06:38:44Z","body":"@daltonrooney Awesome, glad to hear!"}}