diff options
| author | Danielle Madeley <danielle.madeley@collabora.co.uk> | 2011-07-29 14:23:21 +1000 |
|---|---|---|
| committer | Danielle Madeley <danielle.madeley@collabora.co.uk> | 2011-07-29 14:23:21 +1000 |
| commit | e1ae13450cf3ad12df82bd6a2111eedd6d169ef7 (patch) | |
| tree | f924dbe81d9b1881af8ba6c574b1d0e4a348ece2 /data | |
| parent | e10a0655a4eb8c36f232d533078bcf6b8e7fdbd0 (diff) | |
| download | telepathy-account-widgets-e1ae13450cf3ad12df82bd6a2111eedd6d169ef7.tar.gz | |
Add a webview widget for displaying the log
The widget is currently bolted in alongside the existing log display widget
for comparison. This includes some debugging cruft like showing the secret
notebook tabs.
The webview is populated from the store_events treestore, allowing all of the
existing node-management and ordering code to be used. Attempting to replace
this logic in Javascript was demonstratably too hard. This approach keeps the
Javascript code down to the 4 GtkTreeModel signals.
TODO:
- icons
- pretty printed dates
- expanders
- supporting smileys, links, etc.
- using the correct font, etc.
- removing the debugging
Diffstat (limited to 'data')
| -rw-r--r-- | data/Makefile.am | 5 | ||||
| -rw-r--r-- | data/empathy-log-window.html | 126 |
2 files changed, 130 insertions, 1 deletions
diff --git a/data/Makefile.am b/data/Makefile.am index 88de4f09..d652ca9e 100644 --- a/data/Makefile.am +++ b/data/Makefile.am @@ -58,7 +58,10 @@ clientfile_DATA = \ Empathy.FileTransfer.client htmldir = $(datadir)/empathy -html_DATA = Template.html +html_DATA = \ + Template.html \ + empathy-log-window.html \ + $(NULL) EXTRA_DIST = \ $(convert_DATA) \ diff --git a/data/empathy-log-window.html b/data/empathy-log-window.html new file mode 100644 index 00000000..ef01df34 --- /dev/null +++ b/data/empathy-log-window.html @@ -0,0 +1,126 @@ +<html> + <head> + <style type="text/css"> +html, body, div, p { + /* FIXME: how do we set the application font? */ + padding: 0; + margin: 0; +} + +div.row { + margin-left: 1em; +} + </style> + <script type="text/javascript"> +function filterNodes (node, tagName) +{ + var out = new Array(); + + for (var i = 0; i < node.childNodes.length; i++) + { + var elem = node.childNodes[i]; + + if (elem.tagName == tagName) + out.push(elem); + } + + return out; +} + +function getNodes(node) +{ + return filterNodes(node, 'DIV'); +} + +function getContent(node) +{ + return filterNodes(node, 'P')[0]; +} + +function insertRow (path, text) +{ + var treeview = document.getElementById('treeview'); + var parentnode = treeview; + var i; + + // walk the tree + for (i = 0; i < path.length - 1; i++) + parentnode = getNodes(parentnode)[path[i]]; + + // create a new node + var newnode = document.createElement('div'); + newnode.setAttribute('class', 'row'); + + // insert the new node into the tree + var nodes = getNodes(parentnode); + + // console.log("path = " + path); + // console.log("i = " + i + ", path[i] = " + path[i] + ", nodes.length = " + + // nodes.length); + + if (path[i] >= nodes.length) + parentnode.appendChild(newnode); + else + parentnode.insertBefore(newnode, nodes[path[i]]); + + var contents = document.createElement('p'); + newnode.appendChild(contents); + contents.innerHTML = text; +} + +function changeRow (path, text) +{ + var treeview = document.getElementById('treeview'); + var node = treeview; + + // console.log("path = " + path + ", text = '" + text + "'"); + + // walk the tree + for (var i = 0; i < path.length; i++) + node = getNodes(node)[path[i]]; + + // set the contents + var contents = getContent(node); + contents.innerHTML = text; +} + +function deleteRow (path) +{ + var treeview = document.getElementById('treeview'); + var node = treeview; + + // walk the tree + for (var i = 0; i < path.length; i++) + node = getNodes(node)[path[i]]; + + node.parentNode.removeChild(node); +} + +function reorderRows (path, new_order) +{ + var treeview = document.getElementById('treeview'); + var node = treeview; + + // walk the tree + for (var i = 0; i < path.length; i++) + node = getNodes(node)[path[i]]; + + var nodes = getNodes(node); + + // remove all the nodes from the DOM + for (var i = 0; i < nodes.length; i++) + node.removeChild(nodes[i]); + + // put them back in the new order + // For reference: new_order[new_pos] = old_pos + for (var i = 0; i < nodes.length; i++) + node.appendChild(nodes[new_order[i]]); +} + </script> + </head> + + <body> + <div id="treeview"> + </div> + </body> +</html> |