utopia 2.5.5 → 2.6.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (117) hide show
  1. checksums.yaml +4 -4
  2. data/.travis.yml +1 -2
  3. data/Gemfile +1 -0
  4. data/Rakefile +2 -0
  5. data/docs/code/Utopia.html +439 -433
  6. data/docs/code/Utopia/Command.html +201 -195
  7. data/docs/code/Utopia/Command/Environment.html +244 -244
  8. data/docs/code/Utopia/Command/Server.html +202 -202
  9. data/docs/code/Utopia/Command/Server/Create.html +192 -192
  10. data/docs/code/Utopia/Command/Server/Update.html +235 -235
  11. data/docs/code/Utopia/Command/Site.html +269 -263
  12. data/docs/code/Utopia/Command/Site/Create.html +192 -192
  13. data/docs/code/Utopia/Command/Site/Update.html +246 -246
  14. data/docs/code/Utopia/Command/Top.html +244 -244
  15. data/docs/code/Utopia/Content.html +636 -630
  16. data/docs/code/Utopia/Content/Document.html +1411 -1407
  17. data/docs/code/Utopia/Content/Document/State.html +1048 -1048
  18. data/docs/code/Utopia/Content/Link.html +1023 -1023
  19. data/docs/code/Utopia/Content/Links.html +629 -623
  20. data/docs/code/Utopia/Content/MarkupParser.html +702 -702
  21. data/docs/code/Utopia/Content/MarkupParser/ParsedTag.html +375 -375
  22. data/docs/code/Utopia/Content/MarkupParser/UnbalancedTagError.html +523 -523
  23. data/docs/code/Utopia/Content/Namespace.html +416 -416
  24. data/docs/code/Utopia/Content/Node.html +952 -952
  25. data/docs/code/Utopia/Content/Node/Context.html +790 -790
  26. data/docs/code/Utopia/Content/Response.html +686 -686
  27. data/docs/code/Utopia/Content/SymbolicHash.html +365 -365
  28. data/docs/code/Utopia/Content/Tags.html +134 -134
  29. data/docs/code/Utopia/Content/UnbalancedTagError.html +270 -270
  30. data/docs/code/Utopia/ContentLength.html +298 -294
  31. data/docs/code/Utopia/Controller.html +657 -651
  32. data/docs/code/Utopia/Controller/Actions.html +260 -260
  33. data/docs/code/Utopia/Controller/Actions/Action.html +785 -779
  34. data/docs/code/Utopia/Controller/Actions/ClassMethods.html +360 -360
  35. data/docs/code/Utopia/Controller/Base.html +989 -989
  36. data/docs/code/Utopia/Controller/Respond.html +264 -254
  37. data/docs/code/Utopia/Controller/Respond/ClassMethods.html +207 -207
  38. data/docs/code/Utopia/Controller/Respond/Converter.html +219 -219
  39. data/docs/code/Utopia/Controller/Respond/Converter/Callback.html +425 -425
  40. data/docs/code/Utopia/Controller/Respond/Converter/ToJSON.html +323 -317
  41. data/docs/code/Utopia/Controller/Respond/Passthrough.html +266 -260
  42. data/docs/code/Utopia/Controller/Respond/Responder.html +449 -443
  43. data/docs/code/Utopia/Controller/Rewrite.html +260 -260
  44. data/docs/code/Utopia/Controller/Rewrite/ClassMethods.html +216 -216
  45. data/docs/code/Utopia/Controller/Rewrite/ExtractPrefixRule.html +303 -303
  46. data/docs/code/Utopia/Controller/Rewrite/Rewriter.html +402 -402
  47. data/docs/code/Utopia/Controller/Rewrite/Rule.html +193 -193
  48. data/docs/code/Utopia/Controller/Variables.html +428 -428
  49. data/docs/code/Utopia/Controllers.html +216 -216
  50. data/docs/code/Utopia/Exceptions.html +125 -125
  51. data/docs/code/Utopia/Exceptions/Handler.html +405 -405
  52. data/docs/code/Utopia/Exceptions/Mailer.html +400 -394
  53. data/docs/code/Utopia/Extensions.html +116 -116
  54. data/docs/code/Utopia/Extensions/ArraySplit.html +164 -164
  55. data/docs/code/Utopia/Extensions/DateTimeComparison.html +173 -173
  56. data/docs/code/Utopia/Extensions/TimeDateComparison.html +173 -173
  57. data/docs/code/Utopia/HTTP.html +193 -187
  58. data/docs/code/Utopia/HTTP/Status.html +355 -355
  59. data/docs/code/Utopia/Locale.html +522 -522
  60. data/docs/code/Utopia/Localization.html +886 -880
  61. data/docs/code/Utopia/Localization/Wrapper.html +403 -403
  62. data/docs/code/Utopia/Logger.html +185 -185
  63. data/docs/code/Utopia/Logger/CompactFormatter.html +290 -290
  64. data/docs/code/Utopia/Path.html +2562 -2556
  65. data/docs/code/Utopia/Path/Matcher.html +395 -395
  66. data/docs/code/Utopia/Path/Matcher/MatchData.html +418 -418
  67. data/docs/code/Utopia/Redirection.html +148 -142
  68. data/docs/code/Utopia/Redirection/ClientRedirect.html +594 -594
  69. data/docs/code/Utopia/Redirection/DirectoryIndex.html +265 -265
  70. data/docs/code/Utopia/Redirection/Errors.html +391 -385
  71. data/docs/code/Utopia/Redirection/Moved.html +265 -265
  72. data/docs/code/Utopia/Redirection/RequestFailure.html +201 -201
  73. data/docs/code/Utopia/Redirection/Rewrite.html +265 -265
  74. data/docs/code/Utopia/Session.html +723 -717
  75. data/docs/code/Utopia/Session/LazyHash.html +709 -709
  76. data/docs/code/Utopia/Setup.html +783 -777
  77. data/docs/code/Utopia/Static.html +516 -510
  78. data/docs/code/Utopia/Static/LocalFile.html +875 -869
  79. data/docs/code/Utopia/Static/MimeTypeLoader.html +427 -427
  80. data/docs/code/Utopia/Static/MimeTypeLoader/ExpansionError.html +123 -123
  81. data/docs/code/_index.html +757 -757
  82. data/docs/code/class_list.html +51 -51
  83. data/docs/code/css/full_list.css +58 -58
  84. data/docs/code/css/style.css +496 -499
  85. data/docs/code/file.README.html +72 -70
  86. data/docs/code/file_list.html +56 -56
  87. data/docs/code/frames.html +17 -17
  88. data/docs/code/index.html +72 -70
  89. data/docs/code/js/app.js +292 -248
  90. data/docs/code/js/full_list.js +216 -216
  91. data/docs/code/js/jquery.js +3 -3
  92. data/docs/code/method_list.html +3443 -3443
  93. data/docs/code/top-level-namespace.html +109 -109
  94. data/docs/index.html +2 -2
  95. data/docs/wiki.html +2 -2
  96. data/docs/wiki/edit.html +1 -1
  97. data/docs/wiki/javascript.html +153 -0
  98. data/docs/wiki/javascript/index.html +153 -0
  99. data/documentation/.yarnrc +1 -0
  100. data/documentation/Gemfile +1 -0
  101. data/documentation/config/environment.rb +1 -0
  102. data/documentation/pages/wiki/content.md +1 -1
  103. data/documentation/pages/wiki/javascript/content.md +75 -0
  104. data/documentation/pages/wiki/links.yaml +3 -1
  105. data/lib/utopia/command/site.rb +4 -4
  106. data/lib/utopia/version.rb +1 -1
  107. data/setup/site/.yarnrc +1 -0
  108. data/setup/site/tasks/yarn.rake +32 -0
  109. data/spec/utopia/command_spec.rb +2 -2
  110. metadata +8 -9
  111. data/docs/wiki/bower-integration.html +0 -74
  112. data/docs/wiki/bower-integration/index.html +0 -74
  113. data/documentation/.bowerrc +0 -4
  114. data/documentation/pages/wiki/bower-integration/content.md +0 -25
  115. data/setup/.bowerrc +0 -3
  116. data/setup/site/.bowerrc +0 -4
  117. data/setup/site/tasks/bower.rake +0 -45
@@ -1,110 +1,110 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>
7
- Top Level Namespace
8
-
9
- &mdash; Documentation by YARD 0.9.12
10
-
11
- </title>
12
-
13
- <link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8" />
14
-
15
- <link rel="stylesheet" href="css/common.css" type="text/css" charset="utf-8" />
16
-
17
- <script type="text/javascript" charset="utf-8">
18
- pathId = "";
19
- relpath = '';
20
- </script>
21
-
22
-
23
- <script type="text/javascript" charset="utf-8" src="js/jquery.js"></script>
24
-
25
- <script type="text/javascript" charset="utf-8" src="js/app.js"></script>
26
-
27
-
28
- </head>
29
- <body>
30
- <div class="nav_wrap">
31
- <iframe id="nav" src="class_list.html?1"></iframe>
32
- <div id="resizer"></div>
33
- </div>
34
-
35
- <div id="main" tabindex="-1">
36
- <div id="header">
37
- <div id="menu">
38
-
39
- <a href="_index.html">Index</a> &raquo;
40
-
41
-
42
- <span class="title">Top Level Namespace</span>
43
-
44
- </div>
45
-
46
- <div id="search">
47
-
48
- <a class="full_list_link" id="class_list_link"
49
- href="class_list.html">
50
-
51
- <svg width="24" height="24">
52
- <rect x="0" y="4" width="24" height="4" rx="1" ry="1"></rect>
53
- <rect x="0" y="12" width="24" height="4" rx="1" ry="1"></rect>
54
- <rect x="0" y="20" width="24" height="4" rx="1" ry="1"></rect>
55
- </svg>
56
- </a>
57
-
58
- </div>
59
- <div class="clear"></div>
60
- </div>
61
-
62
- <div id="content"><h1>Top Level Namespace
63
-
64
-
65
-
66
- </h1>
67
- <div class="box_info">
68
-
69
-
70
-
71
-
72
-
73
-
74
-
75
-
76
-
77
-
78
-
79
- </div>
80
-
81
- <h2>Defined Under Namespace</h2>
82
- <p class="children">
83
-
84
-
85
- <strong class="modules">Modules:</strong> <span class='object_link'><a href="Utopia.html" title="Utopia (module)">Utopia</a></span>
86
-
87
-
88
-
89
-
90
- </p>
91
-
92
-
93
-
94
-
95
-
96
-
97
-
98
-
99
-
100
- </div>
101
-
102
- <div id="footer">
103
- Generated on Sat Mar 24 21:17:19 2018 by
104
- <a href="http://yardoc.org" title="Yay! A Ruby Documentation Tool" target="_parent">yard</a>
105
- 0.9.12 (ruby-2.5.0).
106
- </div>
107
-
108
- </div>
109
- </body>
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>
7
+ Top Level Namespace
8
+
9
+ &mdash; Documentation by YARD 0.9.18
10
+
11
+ </title>
12
+
13
+ <link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8" />
14
+
15
+ <link rel="stylesheet" href="css/common.css" type="text/css" charset="utf-8" />
16
+
17
+ <script type="text/javascript" charset="utf-8">
18
+ pathId = "";
19
+ relpath = '';
20
+ </script>
21
+
22
+
23
+ <script type="text/javascript" charset="utf-8" src="js/jquery.js"></script>
24
+
25
+ <script type="text/javascript" charset="utf-8" src="js/app.js"></script>
26
+
27
+
28
+ </head>
29
+ <body>
30
+ <div class="nav_wrap">
31
+ <iframe id="nav" src="class_list.html?1"></iframe>
32
+ <div id="resizer"></div>
33
+ </div>
34
+
35
+ <div id="main" tabindex="-1">
36
+ <div id="header">
37
+ <div id="menu">
38
+
39
+ <a href="_index.html">Index</a> &raquo;
40
+
41
+
42
+ <span class="title">Top Level Namespace</span>
43
+
44
+ </div>
45
+
46
+ <div id="search">
47
+
48
+ <a class="full_list_link" id="class_list_link"
49
+ href="class_list.html">
50
+
51
+ <svg width="24" height="24">
52
+ <rect x="0" y="4" width="24" height="4" rx="1" ry="1"></rect>
53
+ <rect x="0" y="12" width="24" height="4" rx="1" ry="1"></rect>
54
+ <rect x="0" y="20" width="24" height="4" rx="1" ry="1"></rect>
55
+ </svg>
56
+ </a>
57
+
58
+ </div>
59
+ <div class="clear"></div>
60
+ </div>
61
+
62
+ <div id="content"><h1>Top Level Namespace
63
+
64
+
65
+
66
+ </h1>
67
+ <div class="box_info">
68
+
69
+
70
+
71
+
72
+
73
+
74
+
75
+
76
+
77
+
78
+
79
+ </div>
80
+
81
+ <h2>Defined Under Namespace</h2>
82
+ <p class="children">
83
+
84
+
85
+ <strong class="modules">Modules:</strong> <span class='object_link'><a href="Utopia.html" title="Utopia (module)">Utopia</a></span>
86
+
87
+
88
+
89
+
90
+ </p>
91
+
92
+
93
+
94
+
95
+
96
+
97
+
98
+
99
+
100
+ </div>
101
+
102
+ <div id="footer">
103
+ Generated on Sat Mar 9 12:01:52 2019 by
104
+ <a href="http://yardoc.org" title="Yay! A Ruby Documentation Tool" target="_parent">yard</a>
105
+ 0.9.18 (ruby-2.6.1).
106
+ </div>
107
+
108
+ </div>
109
+ </body>
110
110
  </html>
data/docs/index.html CHANGED
@@ -50,7 +50,7 @@
50
50
  <li><a href="wiki/faq/what-is-xnode/index.html">What is <code>.xnode</code>?</a></li>
51
51
  </ul>
52
52
  </li>
53
- <li><a href="wiki/bower-integration/index.html">Installing JavaScript Libraries</a></li>
53
+ <li><a href="wiki/javascript/index.html">Installing JavaScript Libraries</a></li>
54
54
  <li><a href="wiki/testing/index.html">Website Tests</a></li>
55
55
  <li><a href="wiki/updating-utopia/index.html">Updating Your Site</a></li>
56
56
  </ul>
@@ -84,7 +84,7 @@
84
84
 
85
85
 
86
86
  <footer>
87
- Last Modified: 2018-01-26 09:29:57 +1300 —
87
+ Last Modified: 2019-03-09 11:28:57 +1300 —
88
88
  </footer>
89
89
 
90
90
  </div>
data/docs/wiki.html CHANGED
@@ -50,7 +50,7 @@
50
50
  <li><a href="wiki/faq/what-is-xnode/index.html">What is <code>.xnode</code>?</a></li>
51
51
  </ul>
52
52
  </li>
53
- <li><a href="wiki/bower-integration/index.html">Installing JavaScript Libraries</a></li>
53
+ <li><a href="wiki/javascript/index.html">Installing JavaScript Libraries</a></li>
54
54
  <li><a href="wiki/testing/index.html">Website Tests</a></li>
55
55
  <li><a href="wiki/updating-utopia/index.html">Updating Your Site</a></li>
56
56
  </ul>
@@ -84,7 +84,7 @@
84
84
 
85
85
 
86
86
  <footer>
87
- Last Modified: 2018-01-26 09:29:57 +1300 —
87
+ Last Modified: 2019-03-09 11:28:57 +1300 —
88
88
  </footer>
89
89
 
90
90
  </div>
data/docs/wiki/edit.html CHANGED
@@ -73,7 +73,7 @@ Reading these pages in order will give you an overview of the design of Utopia,
73
73
  - [Server Setup](server-setup/)
74
74
  - [Your First Page](your-first-page/)
75
75
  - [What is `.xnode`?](faq/what-is-xnode/)
76
- - [Installing JavaScript Libraries](bower-integration/)
76
+ - [Installing JavaScript Libraries](javascript/)
77
77
  - [Website Tests](testing/)
78
78
  - [Updating Your Site](updating-utopia/)
79
79
 
@@ -0,0 +1,153 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+
5
+ <title>Javascript - Utopia</title>
6
+
7
+ <meta charset="UTF-8"/>
8
+
9
+ <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"/>
10
+
11
+ <link rel="icon" type="image/png" href="../_static/icon.png"/>
12
+ <link rel="stylesheet" href="../_static/site.css" type="text/css" media="screen"/>
13
+
14
+ <script src="../_components/jquery/jquery.min.js"></script>
15
+ <script src="../_components/jquery-syntax/jquery.syntax.min.js"></script>
16
+
17
+ <script type="text/javascript">
18
+ //<![CDATA[
19
+ jQuery(function($) {
20
+ $.syntax();
21
+ });
22
+ //]]>
23
+ </script>
24
+ </head>
25
+
26
+ <body class="">
27
+ <header>
28
+ <img src="../_static/utopia.svg"/>
29
+ </header>
30
+
31
+ <div id="page">
32
+
33
+ <nav>
34
+ › <a href="../wiki.html">Wiki</a> › <a href="javascript.html">JavaScript</a></nav>
35
+
36
+
37
+ <h1 id="yarn-integration">Yarn Integration</h1>
38
+
39
+ <p>Utopia integrates with Yarn and provides a rake task to simplify deployment packages distributed using <code>yarn</code> that implement the <code>dist</code> sub-directory convention.</p>
40
+
41
+ <p>By default, utopia includes a <code>.yarnrc</code> file which installs modules into <code>lib/components</code>. This code can then be copied into <code>public/_components</code> using <code>rake yarn:update</code>.</p>
42
+
43
+ <h2 id="installing-yarn">Installing Yarn</h2>
44
+
45
+ <p>If you don’t already have yarn installed, make sure you have npm installed and then run the following command:</p>
46
+
47
+ <pre><code>$ sudo npm install -g yarn
48
+ </code></pre>
49
+
50
+ <h2 id="installing-jquery">Installing jQuery</h2>
51
+
52
+ <p>Firstly, ensure your project has a <code>package.json</code> file:</p>
53
+
54
+ <pre><code>$ yarn init
55
+ </code></pre>
56
+
57
+ <p>Then install jquery using <code>yarn</code>:</p>
58
+
59
+ <pre><code>$ bower install jquery
60
+ </code></pre>
61
+
62
+ <p>Copy the distribution scripts to <code>public/_components</code>:</p>
63
+
64
+ <pre><code>$ rake yarn:update
65
+ </code></pre>
66
+
67
+ <p>Then add the appropriate <code>&lt;script&gt;</code> tags to <code>pages/_page.xnode</code>:</p>
68
+
69
+ <pre><code class="language-html">&lt;script type=&quot;text/javascript&quot; src=&quot;/_components/jquery/jquery.min.js&quot;&gt;&lt;/script&gt;
70
+ </code></pre>
71
+
72
+ <h3 id="what-does-rake-yarnupdate-do">What does <code>rake yarn:update</code> do?</h3>
73
+
74
+ <p>This task copies only the contents of the <code>dist</code> directory. This ensures that you only get files intended for distribution. If the bower package doesn’t have a <code>dist</code> directory, the entire contents is copied.</p>
75
+
76
+ <pre><code class="syntax brush-ruby">
77
+ namespace :yarn do
78
+ desc 'Load the .bowerrc file and setup the environment for other tasks.'
79
+ task :environment do
80
+ @yarn_package_root = SITE_ROOT + &quot;lib/components&quot;
81
+ @yarn_install_root = SITE_ROOT + &quot;public/_components&quot;
82
+ end
83
+
84
+ desc 'Update the bower packages and link into the public directory.'
85
+ task :update =&gt; :environment do
86
+ require 'fileutils'
87
+ require 'utopia/path'
88
+
89
+ @yarn_package_root.children.select(&amp;:directory?).collect(&amp;:basename).each do |package_directory|
90
+ install_path = @yarn_install_root + package_directory
91
+ package_path = @yarn_package_root + package_directory
92
+ dist_path = package_path + 'dist'
93
+
94
+ FileUtils::Verbose.rm_rf install_path
95
+ FileUtils::Verbose.mkpath(install_path.dirname)
96
+
97
+ # If a package has a dist directory, we only symlink that... otherwise we have to do the entire package, and hope that bower's ignore was setup correctly:
98
+ if File.exist? dist_path
99
+ link_path = Utopia::Path.shortest_path(dist_path, install_path)
100
+ else
101
+ link_path = Utopia::Path.shortest_path(package_path, install_path)
102
+ end
103
+
104
+ FileUtils::Verbose.cp_r File.expand_path(link_path, install_path), install_path
105
+ end
106
+ end
107
+ end
108
+ </code></pre>
109
+
110
+
111
+ <h2 id="using-javascript">Using JavaScript</h2>
112
+
113
+ <p>You can use JavaScript by embedding it directly into your HTML, or by creating a JavaScript source file and referencing that.</p>
114
+
115
+ <h3 id="embedding-code">Embedding Code</h3>
116
+
117
+ <p>In your HTML view:</p>
118
+
119
+ <pre><code class="language-trenni">&lt;html&gt;
120
+ &lt;body&gt;
121
+ &lt;script type=&quot;text/javascript&quot;&gt;
122
+ //&lt;![CDATA[
123
+ console.log(&quot;Hello World&quot;)
124
+ //]]&gt;
125
+ &lt;/script&gt;
126
+ &lt;/body&gt;
127
+ &lt;/html&gt;
128
+ </code></pre>
129
+
130
+ <h3 id="external-script">External Script</h3>
131
+
132
+ <p>In <code>script.js</code>:</p>
133
+
134
+ <pre><code class="language-javascript">console.log("Hello World")
135
+ </code></pre>
136
+
137
+ <p>In your HTML view:</p>
138
+
139
+ <pre><code class="language-trenni">&lt;html&gt;
140
+ &lt;body&gt;
141
+ &lt;script type=&quot;text/javascript&quot; src=&quot;script.js&quot;&gt;&lt;/script&gt;
142
+ &lt;/body&gt;
143
+ &lt;/html&gt;
144
+ </code></pre>
145
+
146
+
147
+ <footer>
148
+ Last Modified: 2019-03-09 11:29:35 +1300 —
149
+ </footer>
150
+
151
+ </div>
152
+ </body>
153
+ </html>
@@ -0,0 +1,153 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+
5
+ <title>Javascript - Utopia</title>
6
+
7
+ <meta charset="UTF-8"/>
8
+
9
+ <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"/>
10
+
11
+ <link rel="icon" type="image/png" href="../../_static/icon.png"/>
12
+ <link rel="stylesheet" href="../../_static/site.css" type="text/css" media="screen"/>
13
+
14
+ <script src="../../_components/jquery/jquery.min.js"></script>
15
+ <script src="../../_components/jquery-syntax/jquery.syntax.min.js"></script>
16
+
17
+ <script type="text/javascript">
18
+ //<![CDATA[
19
+ jQuery(function($) {
20
+ $.syntax();
21
+ });
22
+ //]]>
23
+ </script>
24
+ </head>
25
+
26
+ <body class="">
27
+ <header>
28
+ <img src="../../_static/utopia.svg"/>
29
+ </header>
30
+
31
+ <div id="page">
32
+
33
+ <nav>
34
+ › <a href="../../wiki.html">Wiki</a> › <a href="../javascript.html">JavaScript</a></nav>
35
+
36
+
37
+ <h1 id="yarn-integration">Yarn Integration</h1>
38
+
39
+ <p>Utopia integrates with Yarn and provides a rake task to simplify deployment packages distributed using <code>yarn</code> that implement the <code>dist</code> sub-directory convention.</p>
40
+
41
+ <p>By default, utopia includes a <code>.yarnrc</code> file which installs modules into <code>lib/components</code>. This code can then be copied into <code>public/_components</code> using <code>rake yarn:update</code>.</p>
42
+
43
+ <h2 id="installing-yarn">Installing Yarn</h2>
44
+
45
+ <p>If you don’t already have yarn installed, make sure you have npm installed and then run the following command:</p>
46
+
47
+ <pre><code>$ sudo npm install -g yarn
48
+ </code></pre>
49
+
50
+ <h2 id="installing-jquery">Installing jQuery</h2>
51
+
52
+ <p>Firstly, ensure your project has a <code>package.json</code> file:</p>
53
+
54
+ <pre><code>$ yarn init
55
+ </code></pre>
56
+
57
+ <p>Then install jquery using <code>yarn</code>:</p>
58
+
59
+ <pre><code>$ bower install jquery
60
+ </code></pre>
61
+
62
+ <p>Copy the distribution scripts to <code>public/_components</code>:</p>
63
+
64
+ <pre><code>$ rake yarn:update
65
+ </code></pre>
66
+
67
+ <p>Then add the appropriate <code>&lt;script&gt;</code> tags to <code>pages/_page.xnode</code>:</p>
68
+
69
+ <pre><code class="language-html">&lt;script type=&quot;text/javascript&quot; src=&quot;/_components/jquery/jquery.min.js&quot;&gt;&lt;/script&gt;
70
+ </code></pre>
71
+
72
+ <h3 id="what-does-rake-yarnupdate-do">What does <code>rake yarn:update</code> do?</h3>
73
+
74
+ <p>This task copies only the contents of the <code>dist</code> directory. This ensures that you only get files intended for distribution. If the bower package doesn’t have a <code>dist</code> directory, the entire contents is copied.</p>
75
+
76
+ <pre><code class="syntax brush-ruby">
77
+ namespace :yarn do
78
+ desc 'Load the .bowerrc file and setup the environment for other tasks.'
79
+ task :environment do
80
+ @yarn_package_root = SITE_ROOT + &quot;lib/components&quot;
81
+ @yarn_install_root = SITE_ROOT + &quot;public/_components&quot;
82
+ end
83
+
84
+ desc 'Update the bower packages and link into the public directory.'
85
+ task :update =&gt; :environment do
86
+ require 'fileutils'
87
+ require 'utopia/path'
88
+
89
+ @yarn_package_root.children.select(&amp;:directory?).collect(&amp;:basename).each do |package_directory|
90
+ install_path = @yarn_install_root + package_directory
91
+ package_path = @yarn_package_root + package_directory
92
+ dist_path = package_path + 'dist'
93
+
94
+ FileUtils::Verbose.rm_rf install_path
95
+ FileUtils::Verbose.mkpath(install_path.dirname)
96
+
97
+ # If a package has a dist directory, we only symlink that... otherwise we have to do the entire package, and hope that bower's ignore was setup correctly:
98
+ if File.exist? dist_path
99
+ link_path = Utopia::Path.shortest_path(dist_path, install_path)
100
+ else
101
+ link_path = Utopia::Path.shortest_path(package_path, install_path)
102
+ end
103
+
104
+ FileUtils::Verbose.cp_r File.expand_path(link_path, install_path), install_path
105
+ end
106
+ end
107
+ end
108
+ </code></pre>
109
+
110
+
111
+ <h2 id="using-javascript">Using JavaScript</h2>
112
+
113
+ <p>You can use JavaScript by embedding it directly into your HTML, or by creating a JavaScript source file and referencing that.</p>
114
+
115
+ <h3 id="embedding-code">Embedding Code</h3>
116
+
117
+ <p>In your HTML view:</p>
118
+
119
+ <pre><code class="language-trenni">&lt;html&gt;
120
+ &lt;body&gt;
121
+ &lt;script type=&quot;text/javascript&quot;&gt;
122
+ //&lt;![CDATA[
123
+ console.log(&quot;Hello World&quot;)
124
+ //]]&gt;
125
+ &lt;/script&gt;
126
+ &lt;/body&gt;
127
+ &lt;/html&gt;
128
+ </code></pre>
129
+
130
+ <h3 id="external-script">External Script</h3>
131
+
132
+ <p>In <code>script.js</code>:</p>
133
+
134
+ <pre><code class="language-javascript">console.log("Hello World")
135
+ </code></pre>
136
+
137
+ <p>In your HTML view:</p>
138
+
139
+ <pre><code class="language-trenni">&lt;html&gt;
140
+ &lt;body&gt;
141
+ &lt;script type=&quot;text/javascript&quot; src=&quot;script.js&quot;&gt;&lt;/script&gt;
142
+ &lt;/body&gt;
143
+ &lt;/html&gt;
144
+ </code></pre>
145
+
146
+
147
+ <footer>
148
+ Last Modified: 2019-03-09 11:29:35 +1300 —
149
+ </footer>
150
+
151
+ </div>
152
+ </body>
153
+ </html>