Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

LiveReload N&N for JBT 4.1.0.Alpha2 #46

Closed
wants to merge 3 commits into from

2 participants

@xcoulon

including an update to link that page from index.html

@maxandersen
Owner

This looks good but how about adding your youtube/screencast for this into N&N?

@maxandersen
Owner

squashed and merged.

@maxandersen maxandersen closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.
View
BIN  whatsnew/images/livereload_openwithbrowser.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  whatsnew/images/livereload_server_configuration.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  whatsnew/images/livereload_serversview.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
8 whatsnew/index.html
@@ -48,6 +48,14 @@
</td>
</tr>
+<tr>
+ <td valign="top" align="left">
+ <p align="right"><b>4.1.0.Alpha2</b>
+ <td valign="top">
+ <p><a href="livereload/livereload-news-1.0.0.Alpha2.html">LiveReload</a></p>
+ </td>
+ </tr>
+
<tr>
<td valign="top" align="left">
<p align="right"><b>4.1.0.Alpha1</b>
View
109 whatsnew/livereload/livereload-news-1.0.0.Alpha2.html
@@ -0,0 +1,109 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Language" content="en-us" />
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+<link rel="stylesheet" href="../whatsnew.css" />
+<title>JBossTools LiveReload 1.0.0.Alpha What's New</title>
+<script type="text/javascript">
+ var _gaq = _gaq || [];
+ _gaq.push([ '_setAccount', 'UA-17645367-5' ]);
+ _gaq.push([ '_trackPageview' ]);
+
+ (function() {
+ var ga = document.createElement('script');
+ ga.type = 'text/javascript';
+ ga.async = true;
+ ga.src = ('https:' == document.location.protocol ? 'https://ssl'
+ : 'http://www')
+ + '.google-analytics.com/ga.js';
+ var s = document.getElementsByTagName('script')[0];
+ s.parentNode.insertBefore(ga, s);
+ })();
+</script>
+</head>
+<body>
+ <h1>JBossTools LiveReload 1.0.0.Alpha What's New</h1>
+
+ <table border="0" cellpadding="10" cellspacing="0" width="80%">
+ <tr>
+ <td colspan="2">
+ <hr />
+ <h3>General</h3>
+ <hr />
+ </td>
+ </tr>
+ <tr>
+ <td valign="top" align="right"><a name="itemname3"
+ id="itemname3"></a><b>Directory Mode Support</b></td>
+ <td valign="top">
+ <p>
+ JBossTools LiveReload is a server-side implementation of the <a
+ href="http://feedback.livereload.com/knowledgebase/articles/86174-livereload-protocol">LiveReload
+ protocol</a>.
+ </p>
+ <p>As a user, you first need to create a "LiveReload" server in
+ the Servers View and start it.</p>
+ <p>
+ <img src="../images/livereload_serversview.png" />
+ </p> By default, the Livereload server and the browser extension
+ communicate with Web Sockets over the 35729 port, but this can be
+ configured.
+ <p>
+ <img src="../images/livereload_server_configuration.png" />
+ </p> Then, you just have to select a file in your workspace and in the
+ contextual menu, use the "Open With>Web Browser" command.
+ <p>
+ <img src="../images/livereload_openwithbrowser.png" />
+ </p>
+
+ <p>The file will open in your default Web Browser. From there,
+ you active the LiveReload extension (see below for instruction on
+ how to install it on Chrome and Firefox), then each time you save
+ the file, it is automatically refreshed in the browser.</p>
+
+ <p>The LiveReload server will send "reload" commands to the
+ connected Web Browser(s) each time an HTML / CSS / JavaScript or
+ image file is changed in the workspace, so you just need a single
+ server for all your projects.</p>
+ <p>And yes, you can have multiple browsers connected at the same
+ time and refreshed at the same time ;-)</p>
+
+ <h3>See the plugin in action</h3>
+ <p>This following little screencast</a> demos the new LiveReload feature.
+ It shows how to create a new LiveReload server and then, shows how the 2 browsers (FireFox and Chrome) are instantly refreshed when a .html or .css file is changed, without having to click on the 'refresh' button of each browser.</p>
+
+ <p><iframe width="560" height="315" src="http://www.youtube.com/embed/CUwZixfRYyg" frameborder="0" allowfullscreen></iframe>
+ </p>
+
+ <h3>Installing the Browser Extension</h3>
+ <p>
+ Chrome users can install the v.2.0.9 extension <a
+ href="https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei/details">from
+ the Chrome Marketplace</a>.
+ </p>
+ <p>
+ Firefox users may hit an <a
+ href="http://stackoverflow.com/questions/8710613/livereload-not-working-guard-firefox">issue</a>
+ with the <a
+ href="http://download.livereload.com/2.0.8/LiveReload-2.0.8.xpi">LiveReload
+ extension v.2.0.8</a>: the browser disconnects just after it has
+ connected, which means that the server cannot push refresh commands
+ to it. <br />A workaround is to install the v.2.0.9 extension that
+ is available <a
+ href="https://github.com/downloads/siasia/livereload-extensions/LiveReload-2.0.9.xpi">here
+ instead</a>.
+ </p>
+
+ </td>
+
+ </tr>
+ </table>
+
+</body>
+
+</html>
+
+
Something went wrong with that request. Please try again.