Moved Jonathan's JS over to jQuery

This commit is contained in:
Raoul Snyman 2010-05-27 21:40:44 +02:00
parent 4d9f429ae0
commit 2ddde15875
3 changed files with 145 additions and 50 deletions

View File

@ -1,10 +1,14 @@
<html> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<head> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<title>OpenLP Controller</title> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
<script type='text/javascript'> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OpenLP Remote Controller</title>
<script type="text/javascript" src="/files/jquery.js"></script>
<script type='text/javascript'>
function send_event(eventname, data){ function send_event(eventname, data) {
var req = new XMLHttpRequest(); /*var req = new XMLHttpRequest();
req.onreadystatechange = function() { req.onreadystatechange = function() {
if(req.readyState==4) if(req.readyState==4)
response(eventname, req); response(eventname, req);
@ -12,13 +16,41 @@ function send_event(eventname, data){
var url = ''; var url = '';
if(eventname.substr(-8) == '_request') if(eventname.substr(-8) == '_request')
url = 'request'; url = 'request';
else else
url = 'send'; url = 'send';
url += '/' + eventname; url += '/' + eventname;
if(data!=null) if(data!=null)
url += '?q=' + escape(data); url += '?q=' + escape(data);
req.open('GET', url, true); req.open('GET', url, true);
req.send(); req.send();*/
var url = "";
if (eventname.substr(-8) == "_request")
{
url = "request";
}
else
{
url = "send";
}
url += "/" + eventname;
var args = {};
if (data != null)
{
args.q = escape(data);
}
$.get(url, args, function (data, textStatus) {
if (textStatus != "success")
{
if (eventname == "remotes_poll_request")
{
send_event("remotes_poll_request");
}
}
else
{
new_response(eventname, data);
}
});
} }
function failed_response(eventname, req){ function failed_response(eventname, req){
switch(eventname){ switch(eventname){
@ -51,7 +83,7 @@ function response(eventname, req){
html += '</tr>'; html += '</tr>';
} }
html += '</table>'; html += '</table>';
document.getElementById('service').innerHTML = html; document.getElementById('service').innerHTML = html;
break; break;
case 'slidecontroller_live_text_request': case 'slidecontroller_live_text_request':
var data = eval('(' + text + ')'); var data = eval('(' + text + ')');
@ -67,7 +99,51 @@ function response(eventname, req){
html += '</td></tr>'; html += '</td></tr>';
} }
html += '</table>'; html += '</table>';
document.getElementById('currentitem').innerHTML = html; document.getElementById('currentitem').innerHTML = html;
break;
case 'remotes_poll_request':
send_event("remotes_poll_request");
send_event("servicemanager_list_request");
send_event("slidecontroller_live_text_request");
break;
}
}
function new_response(eventname, text){
switch (eventname)
{
case 'servicemanager_list_request':
var data = eval('(' + text + ')');
var table = $("<table>");
for (row in data)
{
var trow = $("<tr>").click("send_event('servicemanager_set_item', '" + row + "')");
if (data[row]['selected'])
{
trow.attr("style", "font-weight: bold");
}
trow.append($("<td>").text(parseInt(row)+1));
trow.append($("<td>").text(data[row]['title']));
trow.append($("<td>").text(data[row]['plugin']));
trow.append($("<td>").text(data[row]['notes']));
table.append(trow);
}
$("#service").html(table);
break;
case 'slidecontroller_live_text_request':
var data = eval('(' + text + ')');
var html = '<table>';
for(row in data){
html += '<tr onclick="send_event('
html += "'slidecontroller_live_set', " + row + ')"';
if(data[row]['selected'])
html += ' style="font-weight: bold"';
html += '>';
html += '<td>' + data[row]['tag'] + '</td>';
html += '<td>' + data[row]['text'].replace(/\\n/g, '<br>');
html += '</td></tr>';
}
html += '</table>';
document.getElementById('currentitem').innerHTML = html;
break; break;
case 'remotes_poll_request': case 'remotes_poll_request':
send_event("remotes_poll_request"); send_event("remotes_poll_request");
@ -83,31 +159,31 @@ send_event("remotes_poll_request");
</head> </head>
<body> <body>
<h1>OpenLP Controller</h1> <h1>OpenLP Controller</h1>
<input type='button' value='<- Previous Slide' <input type='button' value='<- Previous Slide'
onclick='send_event("slidecontroller_live_previous");' /> onclick='send_event("slidecontroller_live_previous");' />
<input type='button' value='Next Slide ->' <input type='button' value='Next Slide ->'
onclick='send_event("slidecontroller_live_next");' /> onclick='send_event("slidecontroller_live_next");' />
<br/> <br/>
<input type='button' value='<- Previous Item' <input type='button' value='<- Previous Item'
onclick='send_event("servicemanager_previous_item");' /> onclick='send_event("servicemanager_previous_item");' />
<input type='button' value='Next Item ->' <input type='button' value='Next Item ->'
onclick='send_event("servicemanager_next_item");' /> onclick='send_event("servicemanager_next_item");' />
<br/> <br/>
<input type='button' value='Blank' <input type='button' value='Blank'
onclick='send_event("slidecontroller_live_blank");' /> onclick='send_event("slidecontroller_live_blank");' />
<input type='button' value='Unblank' <input type='button' value='Unblank'
onclick='send_event("slidecontroller_live_unblank");' /> onclick='send_event("slidecontroller_live_unblank");' />
<br/> <br/>
<label>Alert text</label><input id='alert' type='text' /> <label>Alert text</label><input id='alert' type='text' />
<input type='button' value='Send' <input type='button' value='Send'
onclick='send_event("alerts_text", onclick='send_event("alerts_text",
document.getElementById("alert").value);' /> document.getElementById("alert").value);' />
<hr> <hr>
<input type='button' value='Order of service' <input type='button' value='Order of service'
onclick='send_event("servicemanager_list_request");'> onclick='send_event("servicemanager_list_request");'>
<div id='service'></div> <div id='service'></div>
<hr> <hr>
<input type='button' value='Current item' <input type='button' value='Current item'
onclick='send_event("slidecontroller_live_text_request");'> onclick='send_event("slidecontroller_live_text_request");'>
<div id='currentitem'></div> <div id='currentitem'></div>
<hr> <hr>

19
openlp/plugins/remotes/html/jquery.js vendored Executable file

File diff suppressed because one or more lines are too long

View File

@ -36,7 +36,7 @@ from openlp.core.utils import AppLocation
log = logging.getLogger(__name__) log = logging.getLogger(__name__)
class HttpServer(object): class HttpServer(object):
""" """
Ability to control OpenLP via a webbrowser Ability to control OpenLP via a webbrowser
e.g. http://localhost:4316/send/slidecontroller_live_next e.g. http://localhost:4316/send/slidecontroller_live_next
http://localhost:4316/send/alerts_text?q=your%20alert%20text http://localhost:4316/send/alerts_text?q=your%20alert%20text
@ -58,7 +58,7 @@ class HttpServer(object):
def start_tcp(self): def start_tcp(self):
""" """
Start the http server, use the port in the settings default to 4316 Start the http server, use the port in the settings default to 4316
Listen out for slide and song changes so they can be broadcast to Listen out for slide and song changes so they can be broadcast to
clients. Listen out for socket connections clients. Listen out for socket connections
""" """
log.debug(u'Start TCP server') log.debug(u'Start TCP server')
@ -66,13 +66,13 @@ class HttpServer(object):
self.parent.settingsSection + u'/remote port', self.parent.settingsSection + u'/remote port',
QtCore.QVariant(4316)).toInt()[0] QtCore.QVariant(4316)).toInt()[0]
self.server = QtNetwork.QTcpServer() self.server = QtNetwork.QTcpServer()
self.server.listen(QtNetwork.QHostAddress(QtNetwork.QHostAddress.Any), self.server.listen(QtNetwork.QHostAddress(QtNetwork.QHostAddress.Any),
port) port)
QtCore.QObject.connect(Receiver.get_receiver(), QtCore.QObject.connect(Receiver.get_receiver(),
QtCore.SIGNAL(u'slidecontroller_live_changed'), QtCore.SIGNAL(u'slidecontroller_live_changed'),
self.slide_change) self.slide_change)
QtCore.QObject.connect(Receiver.get_receiver(), QtCore.QObject.connect(Receiver.get_receiver(),
QtCore.SIGNAL(u'slidecontroller_live_started'), QtCore.SIGNAL(u'slidecontroller_live_started'),
self.item_change) self.item_change)
QtCore.QObject.connect(self.server, QtCore.QObject.connect(self.server,
QtCore.SIGNAL(u'newConnection()'), self.new_connection) QtCore.SIGNAL(u'newConnection()'), self.new_connection)
@ -91,7 +91,7 @@ class HttpServer(object):
""" """
self.current_item = items[0].title self.current_item = items[0].title
self.send_poll() self.send_poll()
def send_poll(self): def send_poll(self):
""" """
Tell the clients something has changed Tell the clients something has changed
@ -99,7 +99,7 @@ class HttpServer(object):
Receiver.send_message(u'remotes_poll_response', Receiver.send_message(u'remotes_poll_response',
{'slide': self.current_slide, {'slide': self.current_slide,
'item': self.current_item}) 'item': self.current_item})
def new_connection(self): def new_connection(self):
""" """
A new http connection has been made. Create a client object to handle A new http connection has been made. Create a client object to handle
@ -109,7 +109,7 @@ class HttpServer(object):
socket = self.server.nextPendingConnection() socket = self.server.nextPendingConnection()
if socket: if socket:
self.connections.append(HttpConnection(self, socket)) self.connections.append(HttpConnection(self, socket))
def close_connection(self, connection): def close_connection(self, connection):
""" """
The connection has been closed. Clean up The connection has been closed. Clean up
@ -123,9 +123,9 @@ class HttpServer(object):
""" """
log.debug(u'close http server') log.debug(u'close http server')
self.server.close() self.server.close()
class HttpConnection(object): class HttpConnection(object):
""" """
A single connection, this handles communication between the server A single connection, this handles communication between the server
and the client and the client
""" """
@ -133,7 +133,7 @@ class HttpConnection(object):
""" """
Initialise the http connection. Listen out for socket signals Initialise the http connection. Listen out for socket signals
""" """
log.debug(u'Initialise HttpConnection: %s' % log.debug(u'Initialise HttpConnection: %s' %
socket.peerAddress().toString()) socket.peerAddress().toString())
self.socket = socket self.socket = socket
self.parent = parent self.parent = parent
@ -175,7 +175,7 @@ class HttpConnection(object):
def serve_file(self, filename): def serve_file(self, filename):
""" """
Send a file to the socket. For now, just .html files Send a file to the socket. For now, just .html files
and must be top level inside the html folder. and must be top level inside the html folder.
If subfolders requested return 404, easier for security for the present. If subfolders requested return 404, easier for security for the present.
Ultimately for i18n, this could first look for xx/file.html before Ultimately for i18n, this could first look for xx/file.html before
@ -187,7 +187,7 @@ class HttpConnection(object):
if os.path.basename(filename) != filename: if os.path.basename(filename) != filename:
return None return None
(fileroot, ext) = os.path.splitext(filename) (fileroot, ext) = os.path.splitext(filename)
if ext != u'.html': if not ext in [u'.html', u'.js', u'.css', u'.png']:
return None return None
path = os.path.join(self.parent.html_dir, filename) path = os.path.join(self.parent.html_dir, filename)
try: try:
@ -199,7 +199,7 @@ class HttpConnection(object):
html = f.read() html = f.read()
f.close() f.close()
return html return html
def load_params(self, query): def load_params(self, query):
""" """
Decode the query string parameters sent from the browser Decode the query string parameters sent from the browser
@ -208,8 +208,8 @@ class HttpConnection(object):
if not params: if not params:
return None return None
else: else:
return params['q'] return params['q']
def process_event(self, event, params): def process_event(self, event, params):
""" """
Send a signal to openlp to perform an action. Send a signal to openlp to perform an action.
@ -217,9 +217,9 @@ class HttpConnection(object):
basic parameter checking, otherwise rogue clients could crash openlp basic parameter checking, otherwise rogue clients could crash openlp
""" """
if params: if params:
Receiver.send_message(event, params) Receiver.send_message(event, params)
else: else:
Receiver.send_message(event) Receiver.send_message(event)
return u'OK' return u'OK'
def process_request(self, event, params): def process_request(self, event, params):
@ -227,8 +227,8 @@ class HttpConnection(object):
Client has requested data. Send the signal and parameters for openlp Client has requested data. Send the signal and parameters for openlp
to handle, then listen out for a corresponding _request signal to handle, then listen out for a corresponding _request signal
which will have the data to return. which will have the data to return.
For most event timeout after 10 seconds (i.e. incase the signal For most event timeout after 10 seconds (i.e. incase the signal
recipient isn't listening) recipient isn't listening)
remotes_poll_request is a special case, this is a ajax long poll which remotes_poll_request is a special case, this is a ajax long poll which
is just waiting for slide change/song change activity. This can wait is just waiting for slide change/song change activity. This can wait
longer (one minute) longer (one minute)
@ -248,14 +248,14 @@ class HttpConnection(object):
else: else:
self.timer.start(10000) self.timer.start(10000)
if params: if params:
Receiver.send_message(event, params) Receiver.send_message(event, params)
else: else:
Receiver.send_message(event) Receiver.send_message(event)
return True return True
def process_response(self, data): def process_response(self, data):
""" """
The recipient of a _request signal has sent data. Convert this to The recipient of a _request signal has sent data. Convert this to
json and return it to client json and return it to client
""" """
if not self.socket: if not self.socket:
@ -268,7 +268,7 @@ class HttpConnection(object):
def get_200_ok(self): def get_200_ok(self):
""" """
Successful request. Send OK headers. Assume html for now. Successful request. Send OK headers. Assume html for now.
""" """
return u'HTTP/1.1 200 OK\r\n' + \ return u'HTTP/1.1 200 OK\r\n' + \
u'Content-Type: text/html; charset="utf-8"\r\n' + \ u'Content-Type: text/html; charset="utf-8"\r\n' + \
@ -284,11 +284,11 @@ class HttpConnection(object):
def get_408_timeout(self): def get_408_timeout(self):
""" """
A _request hasn't returned anything in the timeout period. A _request hasn't returned anything in the timeout period.
Return timeout Return timeout
""" """
return u'HTTP/1.1 408 Request Timeout\r\n' return u'HTTP/1.1 408 Request Timeout\r\n'
def timeout(self): def timeout(self):
""" """
Listener for timeout signal Listener for timeout signal
@ -298,14 +298,14 @@ class HttpConnection(object):
html = self.get_408_timeout() html = self.get_408_timeout()
self.socket.write(html) self.socket.write(html)
self.close() self.close()
def disconnected(self): def disconnected(self):
""" """
The client has disconnected. Tidy up The client has disconnected. Tidy up
""" """
log.debug(u'socket disconnected') log.debug(u'socket disconnected')
self.close() self.close()
def close(self): def close(self):
""" """
The server has closed the connection. Tidy up The server has closed the connection. Tidy up