PageRenderTime 45ms CodeModel.GetById 23ms RepoModel.GetById 0ms app.codeStats 0ms

/app/views/graphiql/rails/editors/show.html.erb

https://gitlab.com/markglenfletcher/gitlab-ee
Ruby HTML | 99 lines | 96 code | 3 blank | 0 comment | 5 complexity | 6aceba87f04b8ff3458e04d861e527ad MD5 | raw file
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>GraphiQL</title>
  5. <%= stylesheet_link_tag("graphiql/rails/application") %>
  6. <%# TODO: This file was included to fix a CSP failure. Please remove when https://github.com/rmosolgo/graphiql-rails/pull/71 will be released %>
  7. <%= javascript_include_tag("graphiql/rails/application", nonce: true) %>
  8. </head>
  9. <body>
  10. <div id="graphiql-container">
  11. Loading...
  12. </div>
  13. <%= javascript_tag nonce: true do -%>
  14. var parameters = {};
  15. <% if GraphiQL::Rails.config.query_params %>
  16. // Parse the search string to get url parameters.
  17. var search = window.location.search;
  18. search.substr(1).split('&').forEach(function (entry) {
  19. var eq = entry.indexOf('=');
  20. if (eq >= 0) {
  21. parameters[decodeURIComponent(entry.slice(0, eq))] =
  22. decodeURIComponent(entry.slice(eq + 1));
  23. }
  24. });
  25. // if variables was provided, try to format it.
  26. if (parameters.variables) {
  27. try {
  28. parameters.variables =
  29. JSON.stringify(JSON.parse(parameters.variables), null, 2);
  30. } catch (e) {
  31. // Do nothing, we want to display the invalid JSON as a string, rather
  32. // than present an error.
  33. }
  34. }
  35. // When the query and variables string is edited, update the URL bar so
  36. // that it can be easily shared
  37. function onEditQuery(newQuery) {
  38. parameters.query = newQuery;
  39. updateURL();
  40. }
  41. function onEditVariables(newVariables) {
  42. parameters.variables = newVariables;
  43. updateURL();
  44. }
  45. function updateURL() {
  46. var newSearch = '?' + Object.keys(parameters).map(function (key) {
  47. return encodeURIComponent(key) + '=' +
  48. encodeURIComponent(parameters[key]);
  49. }).join('&');
  50. history.replaceState(null, null, newSearch);
  51. }
  52. <% end %>
  53. // Defines a GraphQL fetcher using the fetch API.
  54. var graphQLEndpoint = "<%= graphql_endpoint_path %>";
  55. function graphQLFetcher(graphQLParams) {
  56. return fetch(graphQLEndpoint, {
  57. method: 'post',
  58. headers: <%= raw JSON.pretty_generate(GraphiQL::Rails.config.resolve_headers(self)) %>,
  59. body: JSON.stringify(graphQLParams),
  60. credentials: 'include',
  61. }).then(function(response) {
  62. return response.text();
  63. }).then(function(text) {
  64. try {
  65. return JSON.parse(text);
  66. } catch(error) {
  67. return {
  68. "message": "The server responded with invalid JSON, this is probably a server-side error",
  69. "response": text,
  70. };
  71. }
  72. })
  73. }
  74. <% if GraphiQL::Rails.config.initial_query %>
  75. var defaultQuery = "<%= GraphiQL::Rails.config.initial_query.gsub("\n", '\n').gsub('"', '\"').html_safe %>";
  76. <% else %>
  77. var defaultQuery = undefined
  78. <% end %>
  79. // Render <GraphiQL /> into the body.
  80. ReactDOM.render(
  81. React.createElement(GraphiQL, {
  82. fetcher: graphQLFetcher,
  83. defaultQuery: defaultQuery,
  84. <% if GraphiQL::Rails.config.query_params %>
  85. query: parameters.query,
  86. variables: parameters.variables,
  87. onEditQuery: onEditQuery,
  88. onEditVariables: onEditVariables
  89. <% end %>
  90. }),
  91. document.getElementById("graphiql-container")
  92. );
  93. <% end -%>
  94. </body>
  95. </html>