Safely using CSS/JS libraries - Revision history

Bablakeluke at 11:24, 2 March 2017

2017-03-02T11:24:14Z

Bablakeluke at 20:25, 1 March 2017

2017-03-01T20:25:46Z

Bablakeluke: /* Referencing them */

2017-03-01T16:05:48Z

‎Referencing them

Bablakeluke: /* Add local copies to your project */

2017-03-01T15:57:28Z

‎Add local copies to your project

Bablakeluke: /* Add local copies to your project */

2017-03-01T15:56:26Z

‎Add local copies to your project

Bablakeluke: /* Add local copies to your project */

2017-03-01T15:56:07Z

‎Add local copies to your project

Bablakeluke: /* Referencing them */

2017-03-01T15:54:40Z

‎Referencing them

Bablakeluke: Created page with "PowerUI is now at the point where it can make use of a range of existing libraries. These libraries are typically available for the web, so the classic method to include them..."

2017-03-01T15:53:24Z

Created page with "PowerUI is now at the point where it can make use of a range of existing libraries. These libraries are typically available for the web, so the classic method to include them..."

New page

PowerUI is now at the point where it can make use of a range of existing libraries. These libraries are typically available for the web, so the classic method to include them is via a link to a ''remote site'':

<syntaxhighlight lang="html">


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

</syntaxhighlight>

'''Don't do this in PowerUI.''' You're creating an internet requirement where it's often entirely unnecessary. Just imagine if somebody found they couldn't run your app on a plane, for example, despite it appearing to be offline.

== Add local copies to your project ==

Drop in the .css and .js files into any folder (or sub-folder) of any Resources folder in your project - here's some examples:

Assets/Resources/CSS/myStyle.css.bytes
Assets/UI's/Resources/jQuery-min.js.bytes

''You can have as many Resources folders as you want/ need to organise your project as you wish.''

Then '''rename them''' so Unity doesn't think .js is UnityScript (Unity completely ignores .css too). We recommend adding .bytes onto the end as that way future changes to Unity won't break your naming schemes.

== Referencing them ==

By default, PowerUI's custom resources:// protocol is used. So, the path you use is relative to the parent Resources folder, minus .bytes:

<syntaxhighlight lang="html">


<link href='CSS/myStyle.css'></link>

<script src="jQuery-min.js"></script>

</syntaxhighlight>

@@ Line 8: / Line 8: @@
 </syntaxhighlight>
-'''Don't do this in PowerUI.''' It'll work, but you're creating an internet requirement where it's often entirely unnecessary, and it breaks some assumptions PowerUI makes for performance reasons. Just imagine if somebody found they couldn't run your app on a plane, for example, despite it appearing to be offline.
+'''Don't do this in PowerUI.''' It'll work, but you're creating an internet requirement where it's often entirely unnecessary. For example - somebody wants to use your app on a plane, but they find out they can't (and it's unclear why) because the UI doesn't show up.
 == Add local copies to your project ==

← Older revision		Revision as of 15:54, 1 March 2017
Line 31:		Line 31:

	<script src="jQuery-min.js"></script>		<script src="jQuery-min.js"></script>
		+
		+	</syntaxhighlight>
		+
		+
		+	If your document.location isn't relative to resources already, then you can specify the full path if needed:
		+
		+	<syntaxhighlight lang="html">
		+
		+	<!-- Local referencing in PowerUI - explicitly using resources://. -->
		+	<link href='resources://CSS/myStyle.css'></link>
		+
		+	<script src="resources://jQuery-min.js"></script>

	</syntaxhighlight>		</syntaxhighlight>

@@ Line 24: / Line 24: @@
 == Referencing them ==
-By default, PowerUI's custom resources:// protocol is used. So, the path you use is relative to the parent Resources folder, minus .bytes:
+By default, PowerUI's custom [[Resources_Protocol|resources:// protocol]] is used. So, the path you use is relative to the parent Resources folder, minus .bytes:
 <syntaxhighlight lang="html">

@@ Line 12: / Line 12: @@
 == Add local copies to your project ==
-Drop in the .css and .js files into any folder (or sub-folder) of any Resources folder in your project - here's some examples:
+Drop in the .css and .js files into any folder (or sub-folder) of any Resources folder in your project and '''rename them''' (we recommend adding .bytes to the end) - here's some examples:
 Assets/Resources/CSS/myStyle.css.bytes
@@ Line 20: / Line 20: @@
 ''You can have as many Resources folders as you want to organise your project as you wish.''
-Then '''rename them''' so Unity doesn't think .js is UnityScript (Unity completely ignores .css too). We recommend adding .bytes onto the end as that way future changes to Unity won't break your naming schemes.
+They're renamed so Unity doesn't think .js is UnityScript (Unity completely ignores .css too).
 == Referencing them ==

@@ Line 18: / Line 18: @@
 Assets/UI's/Resources/jQuery-min.js.bytes
-''You can have as many Resources folders as you want/ need to organise your project as you wish.''
+''You can have as many Resources folders as you want to organise your project as you wish.''
 Then '''rename them''' so Unity doesn't think .js is UnityScript (Unity completely ignores .css too). We recommend adding .bytes onto the end as that way future changes to Unity won't break your naming schemes.

← Older revision		Revision as of 15:56, 1 March 2017
Line 15:		Line 15:

	Assets/Resources/CSS/myStyle.css.bytes		Assets/Resources/CSS/myStyle.css.bytes
		+
	Assets/UI's/Resources/jQuery-min.js.bytes		Assets/UI's/Resources/jQuery-min.js.bytes