Skip to content

Commit 4d0b4fa

Browse files
committed
Initial commit of basic theme.
Signed-off-by: Jason Lewis <jason.lewis1991@gmail.com>
1 parent beef313 commit 4d0b4fa

13 files changed

Lines changed: 1999 additions & 0 deletions

File tree

themes/basic/public/css/theme.css

Lines changed: 1493 additions & 0 deletions
Large diffs are not rendered by default.
22.6 KB
Loading
1.69 KB
Loading
847 Bytes
Loading
15.2 KB
Loading

themes/basic/public/js/jquery-ui.js

Lines changed: 17 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

themes/basic/public/js/jquery.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

themes/basic/public/js/leaner.js

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
(function($){
2+
$.fn.extend({
3+
leaner: function(options) {
4+
5+
var close = function (id){
6+
$("#lean-overlay").fadeOut(200);
7+
$('#box-modal').hide();
8+
};
9+
10+
var center = function(width, height)
11+
{
12+
$('#box-modal').css({
13+
'display' : 'block',
14+
'position' : 'fixed',
15+
'opacity' : 0,
16+
'z-index': 11000,
17+
'left' : 50 + '%',
18+
'margin-left' : -(width / 2) + "px",
19+
'top' : 50 + '%',
20+
'margin-top' : -(height / 2) + "px"
21+
});
22+
}
23+
24+
var defaults = {
25+
top: 100,
26+
overlay: 0.7
27+
};
28+
29+
$("body").append($("<div id='lean-overlay'></div>")).append($("<div id='box-modal'><div id='box-close'></div><div id='box-content'></div></div>"));
30+
31+
options = $.extend({}, defaults, options);
32+
33+
return this.each(function() {
34+
35+
$(this).click(function(e) {
36+
37+
$('#box-modal').show().find('#box-content').html('<div class="loading"></div>');
38+
39+
center($('#box-modal').outerWidth(), $('#box-modal').outerHeight());
40+
41+
$('#box-modal').find('#box-content').load($(this).attr("href") + ' .content', function()
42+
{
43+
$("#lean-overlay, #box-close").click(function() {
44+
close();
45+
});
46+
47+
$(document).one('keydown', function(e) {
48+
if(e.keyCode == 27) {
49+
close();
50+
}
51+
});
52+
53+
var overlay = $('#lean-overlay');
54+
55+
overlay.css({ 'display' : 'block', opacity : 0 });
56+
overlay.fadeTo(200, options.overlay);
57+
58+
center($('#box-modal').outerWidth(), $('#box-modal').outerHeight());
59+
60+
$('#box-modal').fadeTo(200, 1);
61+
});
62+
63+
e.preventDefault();
64+
});
65+
});
66+
}
67+
});
68+
})(jQuery);

themes/basic/public/js/theme.js

Lines changed: 170 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
var FEATHER = {};
2+
3+
(function($)
4+
{
5+
/**
6+
* Register the leaner modal that works for this theme.
7+
*/
8+
$('a.popup-ui').leaner();
9+
10+
/**
11+
* Register the tooltips that appear throughout the theme.
12+
*/
13+
$('.tooltip-ui').tooltip({ 'position': 'top', 'offset': 2, 'live': true });
14+
$('.tooltip-ui-right').tooltip({ 'position': 'right', 'offset': 4, 'live': true });
15+
$('.tooltip-ui-places').tooltip({ 'position': 'bottomLeft', 'offset': 3, 'width': 350 });
16+
$('.tooltip-ui-footer').tooltip({ 'position': 'right', 'offset': 5, 'width': 350 });
17+
18+
/**
19+
* Assign the auto complete plugin to our discussion participants input box.
20+
*/
21+
(function($)
22+
{
23+
var properties = {
24+
cache: {},
25+
participants: [],
26+
elements: {
27+
input: $('.discussion-participants').find('input#participants'),
28+
auto: $('.discussion-participants').find('.autocomplete'),
29+
anyone: $('.participants').find('.anyone'),
30+
participants: $('.participants'),
31+
loading: $('<div>').attr('class', 'loading')
32+
}
33+
}
34+
35+
function add(participant)
36+
{
37+
// Hide the default 'anyone can participate' message.
38+
properties.elements.anyone.hide();
39+
40+
// Loop over each participant and if they are the same as the one trying to be
41+
// added then forget it! They can only be added once.
42+
for(var i = 0; i < properties.participants.length; ++i)
43+
{
44+
if(properties.participants[i] == participant.value)
45+
{
46+
return;
47+
}
48+
}
49+
50+
// Add the participants name to the participants array.
51+
properties.participants.push(participant.value);
52+
53+
// Add the participants avatar to the participants div.
54+
properties.elements.participants.append($('<img>').attr({
55+
'src': participant.avatar + '?d=mm',
56+
'class': 'tooltip-ui',
57+
'title': participant.value
58+
}).data('name', participant.value).fadeIn('fast'));
59+
}
60+
61+
/**
62+
* If there is some comma separated names already in the participants input box we'll poll a request
63+
* to the API to get all of the users details, we need their avatar.
64+
*/
65+
if(properties.elements.input.val().length)
66+
{
67+
var array = $.map(properties.elements.input.val().split(','), $.trim);
68+
69+
properties.elements.input.val('');
70+
71+
properties.elements.anyone.hide().after(properties.elements.loading);
72+
73+
$.getJSON(app.base + '/api/v1/user/bunch.json', { data: JSON.stringify(array) }, function(data, status, xhr)
74+
{
75+
properties.elements.loading.fadeOut('fast', function()
76+
{
77+
for(var i = 0; i < data.length; ++i)
78+
{
79+
setTimeout(add, (i + 1) * 150, { value: data[i].username, avatar: data[i].avatar });
80+
}
81+
});
82+
});
83+
}
84+
85+
properties.elements.input.autocomplete({
86+
source: function(request, response)
87+
{
88+
if(request.term in properties.cache)
89+
{
90+
response(properties.cache[request.term]);
91+
92+
return;
93+
}
94+
95+
$.getJSON(app.base + '/api/v1/user/find.json', request, function(data, status, xhr)
96+
{
97+
var store = [];
98+
99+
for(var i = 0; i < data.length; ++i)
100+
{
101+
store.push({
102+
'value': data[i].username,
103+
'avatar': data[i].avatar
104+
});
105+
}
106+
107+
properties.cache[request.term] = store;
108+
109+
response(store);
110+
});
111+
},
112+
appendTo: properties.elements.auto,
113+
position: { my: "left top", at: "left bottom", collision: "none", offset: "0 14px" },
114+
autoFocus: true,
115+
116+
// When we show the results highlight the typed text in the matched results.
117+
open: function (e, ui)
118+
{
119+
var data = properties.elements.input.data('autocomplete');
120+
121+
data.menu.element.find('a').each(function()
122+
{
123+
$(this).html($(this).text().replace(new RegExp('(' + data.term.split(' ').join('|') + ')', 'gi'), '<strong>$1</strong>'));
124+
});
125+
},
126+
127+
// When an item is selected we'll add to the array of participants, then we'll add the
128+
// users avatar to the participants div.
129+
select: function(e, ui)
130+
{
131+
e.preventDefault();
132+
133+
add(ui.item);
134+
135+
properties.elements.input.val('').autocomplete('close');
136+
}
137+
});
138+
139+
// Attach an event handler to any clicking events of any images inside the participants div,
140+
// we'll then remove the user from the selected participants.
141+
properties.elements.participants.find('img').live('click', function()
142+
{
143+
var name = $(this).data('name');
144+
145+
for(var i = 0; i < properties.participants.length; ++i)
146+
{
147+
if(properties.participants[i] == name) break;
148+
}
149+
150+
properties.participants.splice(i, 1);
151+
152+
$(this).fadeOut('fast', function()
153+
{
154+
// If there are no participants, show the default text.
155+
if(properties.participants.length == 0) $('.participants').find('.anyone').show();
156+
});
157+
});
158+
159+
// Attach an event handler to the submission of the form so we can inject another form field
160+
// with a comma separated list of participants.
161+
$('.manage-discussion').find('form').on('submit', function(e)
162+
{
163+
$(this).find('input[name=participants]').after($('<input>').attr({
164+
name: 'participants',
165+
type: 'hidden',
166+
value: properties.participants.join(',')
167+
}));
168+
});
169+
})($);
170+
})(jQuery);

themes/basic/public/js/tooltip.js

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
/**
2+
* Tooltip for jQuery by Jason Lewis
3+
* -----------------------------------------
4+
* This is a simple tooltip plugin for jQuery which allows tooltips on elements with an arrow
5+
* at multiple positions of the tooltip.
6+
*
7+
* @author Jason Lewis
8+
* @copyright 2011 - 2012 Jason Lewis
9+
* @version 1.0
10+
* @license 3-clause BSD
11+
*/
12+
(function($){
13+
$.fn.tooltip = function(opts){
14+
15+
var options = $.extend({}, $.fn.tooltip.defaults, opts),
16+
elements = {
17+
container: $('<div class="tooltip-container"></div>'),
18+
wrapper: $('<div class="tooltip-wrapper"></div>'),
19+
arrow: $('<div class="tooltip-arrow"></div>'),
20+
content: $('<div class="tooltip-content"></div>')
21+
},
22+
binder = options.live ? 'live' : 'bind',
23+
title = '';
24+
25+
// Append the tooltip contents to the body
26+
$('body').append(elements.container.html(elements.wrapper.html(elements.arrow).append(elements.content)));
27+
28+
// Set some options
29+
elements.container.css({ maxWidth: options.width + 'px' });
30+
31+
return this[binder]({
32+
mouseover: function(){
33+
var elm = $(this);
34+
title = elm.attr(options.attr);
35+
36+
if(title.length > 0){
37+
elements.content.text(title);
38+
elm.attr(options.attr, '');
39+
40+
var dimensions = {
41+
top: elm.offset().top,
42+
left: elm.offset().left,
43+
width: elm.outerWidth(),
44+
height: elm.outerHeight(),
45+
actualWidth: elm.outerWidth(true),
46+
actualHeight: elm.outerHeight(true),
47+
arrow: {
48+
width: elements.arrow.outerWidth() / 2,
49+
height: elements.arrow.outerHeight() / 2
50+
}
51+
},
52+
offsets = {};
53+
54+
// Determine the position.
55+
switch(options.position.charAt(0)){
56+
case 'b':
57+
elements.container.addClass('arrow-b');
58+
offsets = {
59+
top: (dimensions.top + dimensions.height) + dimensions.arrow.height + options.offset,
60+
left: dimensions.left + (dimensions.width / 2) - (elements.container.outerWidth() / 2)
61+
};
62+
break;
63+
case 't':
64+
elements.container.addClass('arrow-t');
65+
offsets = {
66+
top: (dimensions.top - elements.container.outerHeight(true)) - dimensions.arrow.height - options.offset,
67+
left: dimensions.left + (dimensions.width / 2) - (elements.container.outerWidth() / 2)
68+
};
69+
break;
70+
case 'l':
71+
elements.container.addClass('arrow-l');
72+
offsets = {
73+
top: dimensions.top + (dimensions.height / 2) - (elements.container.outerHeight() / 2),
74+
left: dimensions.left - elements.container.outerWidth(true) - dimensions.arrow.width - options.offset
75+
};
76+
break;
77+
case 'r':
78+
elements.container.addClass('arrow-r');
79+
offsets = {
80+
top: dimensions.top + (dimensions.height / 2) - (elements.container.outerHeight() / 2),
81+
left: dimensions.left + dimensions.width + dimensions.arrow.width + options.offset
82+
};
83+
break;
84+
}
85+
86+
if(options.position == 'topLeft' || options.position == 'bottomLeft')
87+
{
88+
offsets.left += (elements.container.outerWidth() / 2) - (dimensions.width / 2);
89+
90+
elements.arrow.css('left', elements.arrow.outerWidth());
91+
}
92+
else if(options.position == 'topRight' || options.position == 'bottomRight')
93+
{
94+
offsets.left = (dimensions.left + dimensions.width) - elements.container.outerWidth();
95+
96+
elements.arrow.css('left', elements.container.outerWidth() - elements.arrow.outerWidth());
97+
}
98+
else if(options.position == 'rightTop' || options.position == 'leftTop')
99+
{
100+
offsets.top = dimensions.top;
101+
elements.arrow.css('top', dimensions.height / 2);
102+
}
103+
104+
elements.container.css(offsets).show();
105+
}
106+
},
107+
mouseout: function(){
108+
elements.container.hide();
109+
110+
$(this).attr(options.attr, title);
111+
}
112+
});
113+
114+
return this;
115+
};
116+
117+
// Default Options
118+
$.fn.tooltip.defaults = {
119+
width: 300,
120+
offset: 0,
121+
live: false,
122+
position: 'top',
123+
attr: 'title'
124+
};
125+
})(jQuery);

0 commit comments

Comments
 (0)