From a810ad5b2e9bc3debffffde58b0aaeadbf6729d6 Mon Sep 17 00:00:00 2001 From: Leif Johansson Date: Thu, 2 Jun 2011 00:28:36 +0200 Subject: A simple widget-info view using syntaxhighlighter. --- src/meetingtools/urls.py | 1 + src/site-media/css/shCore.css | 226 +++++ src/site-media/css/shThemeDefault.css | 117 +++ src/site-media/js/shAutoloader.js | 130 +++ src/site-media/js/shBrushXml.js | 69 ++ src/site-media/js/shCore.js | 1721 +++++++++++++++++++++++++++++++++ src/site-media/js/shLegacy.js | 157 +++ src/site-media/js/xregexp-min.js | 2 + src/templates/apps/room/widget.html | 51 + src/templates/base.html | 10 + 10 files changed, 2484 insertions(+) create mode 100644 src/site-media/css/shCore.css create mode 100644 src/site-media/css/shThemeDefault.css create mode 100644 src/site-media/js/shAutoloader.js create mode 100644 src/site-media/js/shBrushXml.js create mode 100644 src/site-media/js/shCore.js create mode 100644 src/site-media/js/shLegacy.js create mode 100644 src/site-media/js/xregexp-min.js create mode 100644 src/templates/apps/room/widget.html diff --git a/src/meetingtools/urls.py b/src/meetingtools/urls.py index 703b49a..bfac344 100644 --- a/src/meetingtools/urls.py +++ b/src/meetingtools/urls.py @@ -37,6 +37,7 @@ urlpatterns = patterns('', (r'^room/(\d+)/recordings\.(?:atom)$',AtomRecordingFeed()), (r'^room/(\d+)/recordings\.(?:rss)$',RSSRecordingField()), (r'^room/\+(.+)$','meetingtools.apps.room.views.list_by_tag'), + (r'^widget/?\+?(.*)$','meetingtools.apps.room.views.widget'), # Uncomment the admin/doc line below to enable admin documentation: # (r'^admin/doc/', include('django.contrib.admindocs.urls')), diff --git a/src/site-media/css/shCore.css b/src/site-media/css/shCore.css new file mode 100644 index 0000000..34f6864 --- /dev/null +++ b/src/site-media/css/shCore.css @@ -0,0 +1,226 @@ +/** + * SyntaxHighlighter + * http://alexgorbatchev.com/SyntaxHighlighter + * + * SyntaxHighlighter is donationware. If you are using it, please donate. + * http://alexgorbatchev.com/SyntaxHighlighter/donate.html + * + * @version + * 3.0.83 (July 02 2010) + * + * @copyright + * Copyright (C) 2004-2010 Alex Gorbatchev. + * + * @license + * Dual licensed under the MIT and GPL licenses. + */ +.syntaxhighlighter a, +.syntaxhighlighter div, +.syntaxhighlighter code, +.syntaxhighlighter table, +.syntaxhighlighter table td, +.syntaxhighlighter table tr, +.syntaxhighlighter table tbody, +.syntaxhighlighter table thead, +.syntaxhighlighter table caption, +.syntaxhighlighter textarea { + -moz-border-radius: 0 0 0 0 !important; + -webkit-border-radius: 0 0 0 0 !important; + background: none !important; + border: 0 !important; + bottom: auto !important; + float: none !important; + height: auto !important; + left: auto !important; + line-height: 1.1em !important; + margin: 0 !important; + outline: 0 !important; + overflow: visible !important; + padding: 0 !important; + position: static !important; + right: auto !important; + text-align: left !important; + top: auto !important; + vertical-align: baseline !important; + width: auto !important; + box-sizing: content-box !important; + font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important; + font-weight: normal !important; + font-style: normal !important; + font-size: 1em !important; + min-height: inherit !important; + min-height: auto !important; +} + +.syntaxhighlighter { + width: 100% !important; + margin: 1em 0 1em 0 !important; + position: relative !important; + overflow: auto !important; + font-size: 1em !important; +} +.syntaxhighlighter.source { + overflow: hidden !important; +} +.syntaxhighlighter .bold { + font-weight: bold !important; +} +.syntaxhighlighter .italic { + font-style: italic !important; +} +.syntaxhighlighter .line { + white-space: pre !important; +} +.syntaxhighlighter table { + width: 100% !important; +} +.syntaxhighlighter table caption { + text-align: left !important; + padding: .5em 0 0.5em 1em !important; +} +.syntaxhighlighter table td.code { + width: 100% !important; +} +.syntaxhighlighter table td.code .container { + position: relative !important; +} +.syntaxhighlighter table td.code .container textarea { + box-sizing: border-box !important; + position: absolute !important; + left: 0 !important; + top: 0 !important; + width: 100% !important; + height: 100% !important; + border: none !important; + background: white !important; + padding-left: 1em !important; + overflow: hidden !important; + white-space: pre !important; +} +.syntaxhighlighter table td.gutter .line { + text-align: right !important; + padding: 0 0.5em 0 1em !important; +} +.syntaxhighlighter table td.code .line { + padding: 0 1em !important; +} +.syntaxhighlighter.nogutter td.code .container textarea, .syntaxhighlighter.nogutter td.code .line { + padding-left: 0em !important; +} +.syntaxhighlighter.show { + display: block !important; +} +.syntaxhighlighter.collapsed table { + display: none !important; +} +.syntaxhighlighter.collapsed .toolbar { + padding: 0.1em 0.8em 0em 0.8em !important; + font-size: 1em !important; + position: static !important; + width: auto !important; + height: auto !important; +} +.syntaxhighlighter.collapsed .toolbar span { + display: inline !important; + margin-right: 1em !important; +} +.syntaxhighlighter.collapsed .toolbar span a { + padding: 0 !important; + display: none !important; +} +.syntaxhighlighter.collapsed .toolbar span a.expandSource { + display: inline !important; +} +.syntaxhighlighter .toolbar { + position: absolute !important; + right: 1px !important; + top: 1px !important; + width: 11px !important; + height: 11px !important; + font-size: 10px !important; + z-index: 10 !important; +} +.syntaxhighlighter .toolbar span.title { + display: inline !important; +} +.syntaxhighlighter .toolbar a { + display: block !important; + text-align: center !important; + text-decoration: none !important; + padding-top: 1px !important; +} +.syntaxhighlighter .toolbar a.expandSource { + display: none !important; +} +.syntaxhighlighter.ie { + font-size: .9em !important; + padding: 1px 0 1px 0 !important; +} +.syntaxhighlighter.ie .toolbar { + line-height: 8px !important; +} +.syntaxhighlighter.ie .toolbar a { + padding-top: 0px !important; +} +.syntaxhighlighter.printing .line.alt1 .content, +.syntaxhighlighter.printing .line.alt2 .content, +.syntaxhighlighter.printing .line.highlighted .number, +.syntaxhighlighter.printing .line.highlighted.alt1 .content, +.syntaxhighlighter.printing .line.highlighted.alt2 .content { + background: none !important; +} +.syntaxhighlighter.printing .line .number { + color: #bbbbbb !important; +} +.syntaxhighlighter.printing .line .content { + color: black !important; +} +.syntaxhighlighter.printing .toolbar { + display: none !important; +} +.syntaxhighlighter.printing a { + text-decoration: none !important; +} +.syntaxhighlighter.printing .plain, .syntaxhighlighter.printing .plain a { + color: black !important; +} +.syntaxhighlighter.printing .comments, .syntaxhighlighter.printing .comments a { + color: #008200 !important; +} +.syntaxhighlighter.printing .string, .syntaxhighlighter.printing .string a { + color: blue !important; +} +.syntaxhighlighter.printing .keyword { + color: #006699 !important; + font-weight: bold !important; +} +.syntaxhighlighter.printing .preprocessor { + color: gray !important; +} +.syntaxhighlighter.printing .variable { + color: #aa7700 !important; +} +.syntaxhighlighter.printing .value { + color: #009900 !important; +} +.syntaxhighlighter.printing .functions { + color: #ff1493 !important; +} +.syntaxhighlighter.printing .constants { + color: #0066cc !important; +} +.syntaxhighlighter.printing .script { + font-weight: bold !important; +} +.syntaxhighlighter.printing .color1, .syntaxhighlighter.printing .color1 a { + color: gray !important; +} +.syntaxhighlighter.printing .color2, .syntaxhighlighter.printing .color2 a { + color: #ff1493 !important; +} +.syntaxhighlighter.printing .color3, .syntaxhighlighter.printing .color3 a { + color: red !important; +} +.syntaxhighlighter.printing .break, .syntaxhighlighter.printing .break a { + color: black !important; +} diff --git a/src/site-media/css/shThemeDefault.css b/src/site-media/css/shThemeDefault.css new file mode 100644 index 0000000..1365411 --- /dev/null +++ b/src/site-media/css/shThemeDefault.css @@ -0,0 +1,117 @@ +/** + * SyntaxHighlighter + * http://alexgorbatchev.com/SyntaxHighlighter + * + * SyntaxHighlighter is donationware. If you are using it, please donate. + * http://alexgorbatchev.com/SyntaxHighlighter/donate.html + * + * @version + * 3.0.83 (July 02 2010) + * + * @copyright + * Copyright (C) 2004-2010 Alex Gorbatchev. + * + * @license + * Dual licensed under the MIT and GPL licenses. + */ +.syntaxhighlighter { + background-color: white !important; +} +.syntaxhighlighter .line.alt1 { + background-color: white !important; +} +.syntaxhighlighter .line.alt2 { + background-color: white !important; +} +.syntaxhighlighter .line.highlighted.alt1, .syntaxhighlighter .line.highlighted.alt2 { + background-color: #e0e0e0 !important; +} +.syntaxhighlighter .line.highlighted.number { + color: black !important; +} +.syntaxhighlighter table caption { + color: black !important; +} +.syntaxhighlighter .gutter { + color: #afafaf !important; +} +.syntaxhighlighter .gutter .line { + border-right: 3px solid #6ce26c !important; +} +.syntaxhighlighter .gutter .line.highlighted { + background-color: #6ce26c !important; + color: white !important; +} +.syntaxhighlighter.printing .line .content { + border: none !important; +} +.syntaxhighlighter.collapsed { + overflow: visible !important; +} +.syntaxhighlighter.collapsed .toolbar { + color: blue !important; + background: white !important; + border: 1px solid #6ce26c !important; +} +.syntaxhighlighter.collapsed .toolbar a { + color: blue !important; +} +.syntaxhighlighter.collapsed .toolbar a:hover { + color: red !important; +} +.syntaxhighlighter .toolbar { + color: white !important; + background: #6ce26c !important; + border: none !important; +} +.syntaxhighlighter .toolbar a { + color: white !important; +} +.syntaxhighlighter .toolbar a:hover { + color: black !important; +} +.syntaxhighlighter .plain, .syntaxhighlighter .plain a { + color: black !important; +} +.syntaxhighlighter .comments, .syntaxhighlighter .comments a { + color: #008200 !important; +} +.syntaxhighlighter .string, .syntaxhighlighter .string a { + color: blue !important; +} +.syntaxhighlighter .keyword { + color: #006699 !important; +} +.syntaxhighlighter .preprocessor { + color: gray !important; +} +.syntaxhighlighter .variable { + color: #aa7700 !important; +} +.syntaxhighlighter .value { + color: #009900 !important; +} +.syntaxhighlighter .functions { + color: #ff1493 !important; +} +.syntaxhighlighter .constants { + color: #0066cc !important; +} +.syntaxhighlighter .script { + font-weight: bold !important; + color: #006699 !important; + background-color: none !important; +} +.syntaxhighlighter .color1, .syntaxhighlighter .color1 a { + color: gray !important; +} +.syntaxhighlighter .color2, .syntaxhighlighter .color2 a { + color: #ff1493 !important; +} +.syntaxhighlighter .color3, .syntaxhighlighter .color3 a { + color: red !important; +} + +.syntaxhighlighter .keyword { + font-weight: bold !important; +} diff --git a/src/site-media/js/shAutoloader.js b/src/site-media/js/shAutoloader.js new file mode 100644 index 0000000..3a95449 --- /dev/null +++ b/src/site-media/js/shAutoloader.js @@ -0,0 +1,130 @@ +/** + * SyntaxHighlighter + * http://alexgorbatchev.com/SyntaxHighlighter + * + * SyntaxHighlighter is donationware. If you are using it, please donate. + * http://alexgorbatchev.com/SyntaxHighlighter/donate.html + * + * @version + * 3.0.83 (July 02 2010) + * + * @copyright + * Copyright (C) 2004-2010 Alex Gorbatchev. + * + * @license + * Dual licensed under the MIT and GPL licenses. + */ +(function() { + +var sh = SyntaxHighlighter; + +/** + * Provides functionality to dynamically load only the brushes that a needed to render the current page. + * + * There are two syntaxes that autoload understands. For example: + * + * SyntaxHighlighter.autoloader( + * [ 'applescript', 'Scripts/shBrushAppleScript.js' ], + * [ 'actionscript3', 'as3', 'Scripts/shBrushAS3.js' ] + * ); + * + * or a more easily comprehendable one: + * + * SyntaxHighlighter.autoloader( + * 'applescript Scripts/shBrushAppleScript.js', + * 'actionscript3 as3 Scripts/shBrushAS3.js' + * ); + */ +sh.autoloader = function() +{ + var list = arguments, + elements = sh.findElements(), + brushes = {}, + scripts = {}, + all = SyntaxHighlighter.all, + allCalled = false, + allParams = null, + i + ; + + SyntaxHighlighter.all = function(params) + { + allParams = params; + allCalled = true; + }; + + function addBrush(aliases, url) + { + for (var i = 0; i < aliases.length; i++) + brushes[aliases[i]] = url; + }; + + function getAliases(item) + { + return item.pop + ? item + : item.split(/\s+/) + ; + } + + // create table of aliases and script urls + for (i = 0; i < list.length; i++) + { + var aliases = getAliases(list[i]), + url = aliases.pop() + ; + + addBrush(aliases, url); + } + + // dynamically add tags. */ + scriptScriptTags : { left: /(<|<)\s*script.*?(>|>)/gi, right: /(<|<)\/\s*script\s*(>|>)/gi } + }, + + toolbar: { + /** + * Generates HTML markup for the toolbar. + * @param {Highlighter} highlighter Highlighter instance. + * @return {String} Returns HTML markup. + */ + getHtml: function(highlighter) + { + var html = '
', + items = sh.toolbar.items, + list = items.list + ; + + function defaultGetHtml(highlighter, name) + { + return sh.toolbar.getButtonHtml(highlighter, name, sh.config.strings[name]); + }; + + for (var i = 0; i < list.length; i++) + html += (items[list[i]].getHtml || defaultGetHtml)(highlighter, list[i]); + + html += '
'; + + return html; + }, + + /** + * Generates HTML markup for a regular button in the toolbar. + * @param {Highlighter} highlighter Highlighter instance. + * @param {String} commandName Command name that would be executed. + * @param {String} label Label text to display. + * @return {String} Returns HTML markup. + */ + getButtonHtml: function(highlighter, commandName, label) + { + return '' + label + '' + ; + }, + + /** + * Event handler for a toolbar anchor. + */ + handler: function(e) + { + var target = e.target, + className = target.className || '' + ; + + function getValue(name) + { + var r = new RegExp(name + '_(\\w+)'), + match = r.exec(className) + ; + + return match ? match[1] : null; + }; + + var highlighter = getHighlighterById(findParentElement(target, '.syntaxhighlighter').id), + commandName = getValue('command') + ; + + // execute the toolbar command + if (highlighter && commandName) + sh.toolbar.items[commandName].execute(highlighter); + + // disable default A click behaviour + e.preventDefault(); + }, + + /** Collection of toolbar items. */ + items : { + // Ordered lis of items in the toolbar. Can't expect `for (var n in items)` to be consistent. + list: ['expandSource', 'help'], + + expandSource: { + getHtml: function(highlighter) + { + if (highlighter.getParam('collapse') != true) + return ''; + + var title = highlighter.getParam('title'); + return sh.toolbar.getButtonHtml(highlighter, 'expandSource', title ? title : sh.config.strings.expandSource); + }, + + execute: function(highlighter) + { + var div = getHighlighterDivById(highlighter.id); + removeClass(div, 'collapsed'); + } + }, + + /** Command to display the about dialog window. */ + help: { + execute: function(highlighter) + { + var wnd = popup('', '_blank', 500, 250, 'scrollbars=0'), + doc = wnd.document + ; + + doc.write(sh.config.strings.aboutDialog); + doc.close(); + wnd.focus(); + } + } + } + }, + + /** + * Finds all elements on the page which should be processes by SyntaxHighlighter. + * + * @param {Object} globalParams Optional parameters which override element's + * parameters. Only used if element is specified. + * + * @param {Object} element Optional element to highlight. If none is + * provided, all elements in the current document + * are returned which qualify. + * + * @return {Array} Returns list of { target: DOMElement, params: Object } objects. + */ + findElements: function(globalParams, element) + { + var elements = element ? [element] : toArray(document.getElementsByTagName(sh.config.tagName)), + conf = sh.config, + result = [] + ; + + // support for + + + + + + +{% endblock %} +{% block content %} +

{{title}}

+ +
+
+

+ The meetingtools jquery widget allows you to easily embed lists of meetings in your own + web page using the popular jQuery javascript library. +

+
+ +

Copy the sample html below in order to list rooms tagged with {{tags}}.

+ +
+<html>
+   <head>
+      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
+      <script type="text/javascript" src="{% baseurl %}/{% prefix %}js/jquery.meetingtools.js"></script>
+      <link href="{% baseurl %}/{% prefix %}css/jquery.meetingtools.css" rel="stylesheet" type="text/css" />
+      <script type="text/javascript">
+         $(function() {
+            $("#meetings").meetingtools({tags: '{{tags}}',url: '{% baseurl %}/{% prefix %}'});
+         });
+      </script>
+   </head>
+   <body>
+      <h1>Meetings...</h1>
+      <div id="meetings"/>
+   </body>
+</html>
+
+ +

+ Change the tags option in the call to 'meetingtools' in order to list other rooms. Override + the CSS elements in jquery.meetingtools.css in order to apply your own skin to the generated html. +

+{% endblock %} \ No newline at end of file diff --git a/src/templates/base.html b/src/templates/base.html index 61a9b7b..818e137 100644 --- a/src/templates/base.html +++ b/src/templates/base.html @@ -88,6 +88,16 @@
  • SUNET Community Support
    • +
  • + +
    • {% block validators %}{% endblock %} -- cgit v1.1