Rename to Pydashie
This commit is contained in:
Stephen Brown
17
.project
Normal file
17
.project
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<projectDescription>
|
||||||
|
<name>PyDashie</name>
|
||||||
|
<comment></comment>
|
||||||
|
<projects>
|
||||||
|
</projects>
|
||||||
|
<buildSpec>
|
||||||
|
<buildCommand>
|
||||||
|
<name>org.python.pydev.PyDevBuilder</name>
|
||||||
|
<arguments>
|
||||||
|
</arguments>
|
||||||
|
</buildCommand>
|
||||||
|
</buildSpec>
|
||||||
|
<natures>
|
||||||
|
<nature>org.python.pydev.pythonNature</nature>
|
||||||
|
</natures>
|
||||||
|
</projectDescription>
|
||||||
10
.pydevproject
Normal file
10
.pydevproject
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<?eclipse-pydev version="1.0"?>
|
||||||
|
|
||||||
|
<pydev_project>
|
||||||
|
<pydev_pathproperty name="org.python.pydev.PROJECT_SOURCE_PATH">
|
||||||
|
<path>/PyDashie</path>
|
||||||
|
</pydev_pathproperty>
|
||||||
|
<pydev_property name="org.python.pydev.PYTHON_PROJECT_VERSION">python 2.7</pydev_property>
|
||||||
|
<pydev_property name="org.python.pydev.PYTHON_PROJECT_INTERPRETER">Default</pydev_property>
|
||||||
|
</pydev_project>
|
||||||
@@ -1,18 +1,18 @@
|
|||||||
console.log("Yeah! The dashboard has started!")
|
console.log("Yeah! The dashboard has started!")
|
||||||
|
|
||||||
Dashing.on 'ready', ->
|
Dashing.on 'ready', ->
|
||||||
Dashing.widget_margins ||= [5, 5]
|
Dashing.widget_margins ||= [5, 5]
|
||||||
Dashing.widget_base_dimensions ||= [300, 360]
|
Dashing.widget_base_dimensions ||= [300, 360]
|
||||||
Dashing.numColumns ||= 4
|
Dashing.numColumns ||= 4
|
||||||
|
|
||||||
contentWidth = (Dashing.widget_base_dimensions[0] + Dashing.widget_margins[0] * 2) * Dashing.numColumns
|
contentWidth = (Dashing.widget_base_dimensions[0] + Dashing.widget_margins[0] * 2) * Dashing.numColumns
|
||||||
|
|
||||||
Batman.setImmediate ->
|
Batman.setImmediate ->
|
||||||
$('.gridster').width(contentWidth)
|
$('.gridster').width(contentWidth)
|
||||||
$('.gridster ul:first').gridster
|
$('.gridster ul:first').gridster
|
||||||
widget_margins: Dashing.widget_margins
|
widget_margins: Dashing.widget_margins
|
||||||
widget_base_dimensions: Dashing.widget_base_dimensions
|
widget_base_dimensions: Dashing.widget_base_dimensions
|
||||||
avoid_overlapped_widgets: !Dashing.customGridsterLayout
|
avoid_overlapped_widgets: !Dashing.customGridsterLayout
|
||||||
draggable:
|
draggable:
|
||||||
stop: Dashing.showGridsterInstructions
|
stop: Dashing.showGridsterInstructions
|
||||||
start: -> Dashing.currentWidgetPositions = Dashing.getWidgetPositions()
|
start: -> Dashing.currentWidgetPositions = Dashing.getWidgetPositions()
|
||||||
File diff suppressed because one or more lines are too long
@@ -1,161 +1,161 @@
|
|||||||
(function() {
|
(function() {
|
||||||
|
|
||||||
Batman.extend(Batman.DOM, {
|
Batman.extend(Batman.DOM, {
|
||||||
querySelectorAll: function(node, selector) {
|
querySelectorAll: function(node, selector) {
|
||||||
return jQuery(selector, node);
|
return jQuery(selector, node);
|
||||||
},
|
},
|
||||||
querySelector: function(node, selector) {
|
querySelector: function(node, selector) {
|
||||||
return jQuery(selector, node)[0];
|
return jQuery(selector, node)[0];
|
||||||
},
|
},
|
||||||
setInnerHTML: function(node, html) {
|
setInnerHTML: function(node, html) {
|
||||||
var child, childNodes, result, _i, _j, _len, _len1;
|
var child, childNodes, result, _i, _j, _len, _len1;
|
||||||
childNodes = (function() {
|
childNodes = (function() {
|
||||||
var _i, _len, _ref, _results;
|
var _i, _len, _ref, _results;
|
||||||
_ref = node.childNodes;
|
_ref = node.childNodes;
|
||||||
_results = [];
|
_results = [];
|
||||||
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
||||||
child = _ref[_i];
|
child = _ref[_i];
|
||||||
_results.push(child);
|
_results.push(child);
|
||||||
}
|
}
|
||||||
return _results;
|
return _results;
|
||||||
})();
|
})();
|
||||||
for (_i = 0, _len = childNodes.length; _i < _len; _i++) {
|
for (_i = 0, _len = childNodes.length; _i < _len; _i++) {
|
||||||
child = childNodes[_i];
|
child = childNodes[_i];
|
||||||
Batman.DOM.willRemoveNode(child);
|
Batman.DOM.willRemoveNode(child);
|
||||||
}
|
}
|
||||||
result = jQuery(node).html(html);
|
result = jQuery(node).html(html);
|
||||||
for (_j = 0, _len1 = childNodes.length; _j < _len1; _j++) {
|
for (_j = 0, _len1 = childNodes.length; _j < _len1; _j++) {
|
||||||
child = childNodes[_j];
|
child = childNodes[_j];
|
||||||
Batman.DOM.didRemoveNode(child);
|
Batman.DOM.didRemoveNode(child);
|
||||||
}
|
}
|
||||||
return result;
|
return result;
|
||||||
},
|
},
|
||||||
removeNode: function(node) {
|
removeNode: function(node) {
|
||||||
var _ref;
|
var _ref;
|
||||||
Batman.DOM.willRemoveNode(node);
|
Batman.DOM.willRemoveNode(node);
|
||||||
if ((_ref = node.parentNode) != null) {
|
if ((_ref = node.parentNode) != null) {
|
||||||
_ref.removeChild(node);
|
_ref.removeChild(node);
|
||||||
}
|
}
|
||||||
return Batman.DOM.didRemoveNode(node);
|
return Batman.DOM.didRemoveNode(node);
|
||||||
},
|
},
|
||||||
destroyNode: function(node) {
|
destroyNode: function(node) {
|
||||||
Batman.DOM.willDestroyNode(node);
|
Batman.DOM.willDestroyNode(node);
|
||||||
Batman.DOM.willRemoveNode(node);
|
Batman.DOM.willRemoveNode(node);
|
||||||
jQuery(node).remove();
|
jQuery(node).remove();
|
||||||
Batman.DOM.didRemoveNode(node);
|
Batman.DOM.didRemoveNode(node);
|
||||||
return Batman.DOM.didDestroyNode(node);
|
return Batman.DOM.didDestroyNode(node);
|
||||||
},
|
},
|
||||||
appendChild: function(parent, child) {
|
appendChild: function(parent, child) {
|
||||||
Batman.DOM.willInsertNode(child);
|
Batman.DOM.willInsertNode(child);
|
||||||
jQuery(parent).append(child);
|
jQuery(parent).append(child);
|
||||||
return Batman.DOM.didInsertNode(child);
|
return Batman.DOM.didInsertNode(child);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
Batman.Request.prototype._parseResponseHeaders = function(xhr) {
|
Batman.Request.prototype._parseResponseHeaders = function(xhr) {
|
||||||
var headers;
|
var headers;
|
||||||
return headers = xhr.getAllResponseHeaders().split('\n').reduce(function(acc, header) {
|
return headers = xhr.getAllResponseHeaders().split('\n').reduce(function(acc, header) {
|
||||||
var key, matches, value;
|
var key, matches, value;
|
||||||
if (matches = header.match(/([^:]*):\s*(.*)/)) {
|
if (matches = header.match(/([^:]*):\s*(.*)/)) {
|
||||||
key = matches[1];
|
key = matches[1];
|
||||||
value = matches[2];
|
value = matches[2];
|
||||||
acc[key] = value;
|
acc[key] = value;
|
||||||
}
|
}
|
||||||
return acc;
|
return acc;
|
||||||
}, {});
|
}, {});
|
||||||
};
|
};
|
||||||
|
|
||||||
Batman.Request.prototype._prepareOptions = function(data) {
|
Batman.Request.prototype._prepareOptions = function(data) {
|
||||||
var options, _ref,
|
var options, _ref,
|
||||||
_this = this;
|
_this = this;
|
||||||
options = {
|
options = {
|
||||||
url: this.get('url'),
|
url: this.get('url'),
|
||||||
type: this.get('method'),
|
type: this.get('method'),
|
||||||
dataType: this.get('type'),
|
dataType: this.get('type'),
|
||||||
data: data || this.get('data'),
|
data: data || this.get('data'),
|
||||||
username: this.get('username'),
|
username: this.get('username'),
|
||||||
password: this.get('password'),
|
password: this.get('password'),
|
||||||
headers: this.get('headers'),
|
headers: this.get('headers'),
|
||||||
beforeSend: function() {
|
beforeSend: function() {
|
||||||
return _this.fire('loading');
|
return _this.fire('loading');
|
||||||
},
|
},
|
||||||
success: function(response, textStatus, xhr) {
|
success: function(response, textStatus, xhr) {
|
||||||
_this.mixin({
|
_this.mixin({
|
||||||
xhr: xhr,
|
xhr: xhr,
|
||||||
status: xhr.status,
|
status: xhr.status,
|
||||||
response: response,
|
response: response,
|
||||||
responseHeaders: _this._parseResponseHeaders(xhr)
|
responseHeaders: _this._parseResponseHeaders(xhr)
|
||||||
});
|
});
|
||||||
return _this.fire('success', response);
|
return _this.fire('success', response);
|
||||||
},
|
},
|
||||||
error: function(xhr, status, error) {
|
error: function(xhr, status, error) {
|
||||||
_this.mixin({
|
_this.mixin({
|
||||||
xhr: xhr,
|
xhr: xhr,
|
||||||
status: xhr.status,
|
status: xhr.status,
|
||||||
response: xhr.responseText,
|
response: xhr.responseText,
|
||||||
responseHeaders: _this._parseResponseHeaders(xhr)
|
responseHeaders: _this._parseResponseHeaders(xhr)
|
||||||
});
|
});
|
||||||
xhr.request = _this;
|
xhr.request = _this;
|
||||||
return _this.fire('error', xhr);
|
return _this.fire('error', xhr);
|
||||||
},
|
},
|
||||||
complete: function() {
|
complete: function() {
|
||||||
return _this.fire('loaded');
|
return _this.fire('loaded');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
if ((_ref = this.get('method')) === 'PUT' || _ref === 'POST') {
|
if ((_ref = this.get('method')) === 'PUT' || _ref === 'POST') {
|
||||||
if (!this.hasFileUploads()) {
|
if (!this.hasFileUploads()) {
|
||||||
options.contentType = this.get('contentType');
|
options.contentType = this.get('contentType');
|
||||||
if (typeof options.data === 'object') {
|
if (typeof options.data === 'object') {
|
||||||
options.processData = false;
|
options.processData = false;
|
||||||
options.data = Batman.URI.queryFromParams(options.data);
|
options.data = Batman.URI.queryFromParams(options.data);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
options.contentType = false;
|
options.contentType = false;
|
||||||
options.processData = false;
|
options.processData = false;
|
||||||
options.data = this.constructor.objectToFormData(options.data);
|
options.data = this.constructor.objectToFormData(options.data);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return options;
|
return options;
|
||||||
};
|
};
|
||||||
|
|
||||||
Batman.Request.prototype.send = function(data) {
|
Batman.Request.prototype.send = function(data) {
|
||||||
return jQuery.ajax(this._prepareOptions(data));
|
return jQuery.ajax(this._prepareOptions(data));
|
||||||
};
|
};
|
||||||
|
|
||||||
Batman.mixins.animation = {
|
Batman.mixins.animation = {
|
||||||
show: function(addToParent) {
|
show: function(addToParent) {
|
||||||
var jq, show, _ref, _ref1;
|
var jq, show, _ref, _ref1;
|
||||||
jq = $(this);
|
jq = $(this);
|
||||||
show = function() {
|
show = function() {
|
||||||
return jq.show(600);
|
return jq.show(600);
|
||||||
};
|
};
|
||||||
if (addToParent) {
|
if (addToParent) {
|
||||||
if ((_ref = addToParent.append) != null) {
|
if ((_ref = addToParent.append) != null) {
|
||||||
_ref.appendChild(this);
|
_ref.appendChild(this);
|
||||||
}
|
}
|
||||||
if ((_ref1 = addToParent.before) != null) {
|
if ((_ref1 = addToParent.before) != null) {
|
||||||
_ref1.parentNode.insertBefore(this, addToParent.before);
|
_ref1.parentNode.insertBefore(this, addToParent.before);
|
||||||
}
|
}
|
||||||
jq.hide();
|
jq.hide();
|
||||||
setTimeout(show, 0);
|
setTimeout(show, 0);
|
||||||
} else {
|
} else {
|
||||||
show();
|
show();
|
||||||
}
|
}
|
||||||
return this;
|
return this;
|
||||||
},
|
},
|
||||||
hide: function(removeFromParent) {
|
hide: function(removeFromParent) {
|
||||||
var _this = this;
|
var _this = this;
|
||||||
$(this).hide(600, function() {
|
$(this).hide(600, function() {
|
||||||
var _ref;
|
var _ref;
|
||||||
if (removeFromParent) {
|
if (removeFromParent) {
|
||||||
if ((_ref = _this.parentNode) != null) {
|
if ((_ref = _this.parentNode) != null) {
|
||||||
_ref.removeChild(_this);
|
_ref.removeChild(_this);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return Batman.DOM.didRemoveNode(_this);
|
return Batman.DOM.didRemoveNode(_this);
|
||||||
});
|
});
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
}).call(this);
|
}).call(this);
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@@ -1,110 +1,110 @@
|
|||||||
#= require jquery
|
#= require jquery
|
||||||
#= require es5-shim
|
#= require es5-shim
|
||||||
#= require batman
|
#= require batman
|
||||||
#= require batman.jquery
|
#= require batman.jquery
|
||||||
|
|
||||||
|
|
||||||
Batman.Filters.prettyNumber = (num) ->
|
Batman.Filters.prettyNumber = (num) ->
|
||||||
num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") unless isNaN(num)
|
num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") unless isNaN(num)
|
||||||
|
|
||||||
Batman.Filters.dashize = (str) ->
|
Batman.Filters.dashize = (str) ->
|
||||||
dashes_rx1 = /([A-Z]+)([A-Z][a-z])/g;
|
dashes_rx1 = /([A-Z]+)([A-Z][a-z])/g;
|
||||||
dashes_rx2 = /([a-z\d])([A-Z])/g;
|
dashes_rx2 = /([a-z\d])([A-Z])/g;
|
||||||
|
|
||||||
return str.replace(dashes_rx1, '$1_$2').replace(dashes_rx2, '$1_$2').replace('_', '-').toLowerCase()
|
return str.replace(dashes_rx1, '$1_$2').replace(dashes_rx2, '$1_$2').replace('_', '-').toLowerCase()
|
||||||
|
|
||||||
Batman.Filters.shortenedNumber = (num) ->
|
Batman.Filters.shortenedNumber = (num) ->
|
||||||
return num if isNaN(num)
|
return num if isNaN(num)
|
||||||
if num >= 1000000000
|
if num >= 1000000000
|
||||||
(num / 1000000000).toFixed(1) + 'B'
|
(num / 1000000000).toFixed(1) + 'B'
|
||||||
else if num >= 1000000
|
else if num >= 1000000
|
||||||
(num / 1000000).toFixed(1) + 'M'
|
(num / 1000000).toFixed(1) + 'M'
|
||||||
else if num >= 1000
|
else if num >= 1000
|
||||||
(num / 1000).toFixed(1) + 'K'
|
(num / 1000).toFixed(1) + 'K'
|
||||||
else
|
else
|
||||||
num
|
num
|
||||||
|
|
||||||
class window.Dashing extends Batman.App
|
class window.Dashing extends Batman.App
|
||||||
@root ->
|
@root ->
|
||||||
Dashing.params = Batman.URI.paramsFromQuery(window.location.search.slice(1));
|
Dashing.params = Batman.URI.paramsFromQuery(window.location.search.slice(1));
|
||||||
|
|
||||||
class Dashing.Widget extends Batman.View
|
class Dashing.Widget extends Batman.View
|
||||||
constructor: ->
|
constructor: ->
|
||||||
# Set the view path
|
# Set the view path
|
||||||
@constructor::source = Batman.Filters.underscore(@constructor.name)
|
@constructor::source = Batman.Filters.underscore(@constructor.name)
|
||||||
super
|
super
|
||||||
|
|
||||||
@mixin($(@node).data())
|
@mixin($(@node).data())
|
||||||
Dashing.widgets[@id] ||= []
|
Dashing.widgets[@id] ||= []
|
||||||
Dashing.widgets[@id].push(@)
|
Dashing.widgets[@id].push(@)
|
||||||
@mixin(Dashing.lastEvents[@id]) # in case the events from the server came before the widget was rendered
|
@mixin(Dashing.lastEvents[@id]) # in case the events from the server came before the widget was rendered
|
||||||
|
|
||||||
type = Batman.Filters.dashize(@view)
|
type = Batman.Filters.dashize(@view)
|
||||||
$(@node).addClass("widget widget-#{type} #{@id}")
|
$(@node).addClass("widget widget-#{type} #{@id}")
|
||||||
|
|
||||||
@accessor 'updatedAtMessage', ->
|
@accessor 'updatedAtMessage', ->
|
||||||
if updatedAt = @get('updatedAt')
|
if updatedAt = @get('updatedAt')
|
||||||
timestamp = updatedAt.toString().match(/\d*:\d*/)[0]
|
timestamp = updatedAt.toString().match(/\d*:\d*/)[0]
|
||||||
"Last updated at #{timestamp}"
|
"Last updated at #{timestamp}"
|
||||||
|
|
||||||
@::on 'ready', ->
|
@::on 'ready', ->
|
||||||
Dashing.Widget.fire 'ready'
|
Dashing.Widget.fire 'ready'
|
||||||
|
|
||||||
receiveData: (data) =>
|
receiveData: (data) =>
|
||||||
@mixin(data)
|
@mixin(data)
|
||||||
@onData(data)
|
@onData(data)
|
||||||
|
|
||||||
onData: (data) =>
|
onData: (data) =>
|
||||||
# Widgets override this to handle incoming data
|
# Widgets override this to handle incoming data
|
||||||
|
|
||||||
Dashing.AnimatedValue =
|
Dashing.AnimatedValue =
|
||||||
get: Batman.Property.defaultAccessor.get
|
get: Batman.Property.defaultAccessor.get
|
||||||
set: (k, to) ->
|
set: (k, to) ->
|
||||||
if !to? || isNaN(to)
|
if !to? || isNaN(to)
|
||||||
@[k] = to
|
@[k] = to
|
||||||
else
|
else
|
||||||
timer = "interval_#{k}"
|
timer = "interval_#{k}"
|
||||||
num = if (!isNaN(@[k]) && @[k]?) then @[k] else 0
|
num = if (!isNaN(@[k]) && @[k]?) then @[k] else 0
|
||||||
unless @[timer] || num == to
|
unless @[timer] || num == to
|
||||||
to = parseFloat(to)
|
to = parseFloat(to)
|
||||||
num = parseFloat(num)
|
num = parseFloat(num)
|
||||||
up = to > num
|
up = to > num
|
||||||
num_interval = Math.abs(num - to) / 90
|
num_interval = Math.abs(num - to) / 90
|
||||||
@[timer] =
|
@[timer] =
|
||||||
setInterval =>
|
setInterval =>
|
||||||
num = if up then Math.ceil(num+num_interval) else Math.floor(num-num_interval)
|
num = if up then Math.ceil(num+num_interval) else Math.floor(num-num_interval)
|
||||||
if (up && num > to) || (!up && num < to)
|
if (up && num > to) || (!up && num < to)
|
||||||
num = to
|
num = to
|
||||||
clearInterval(@[timer])
|
clearInterval(@[timer])
|
||||||
@[timer] = null
|
@[timer] = null
|
||||||
delete @[timer]
|
delete @[timer]
|
||||||
@[k] = num
|
@[k] = num
|
||||||
@set k, to
|
@set k, to
|
||||||
, 10
|
, 10
|
||||||
@[k] = num
|
@[k] = num
|
||||||
|
|
||||||
Dashing.widgets = widgets = {}
|
Dashing.widgets = widgets = {}
|
||||||
Dashing.lastEvents = lastEvents = {}
|
Dashing.lastEvents = lastEvents = {}
|
||||||
Dashing.debugMode = false
|
Dashing.debugMode = false
|
||||||
|
|
||||||
source = new EventSource('/events')
|
source = new EventSource('/events')
|
||||||
source.addEventListener 'open', (e) ->
|
source.addEventListener 'open', (e) ->
|
||||||
console.log("Connection opened")
|
console.log("Connection opened")
|
||||||
|
|
||||||
source.addEventListener 'error', (e)->
|
source.addEventListener 'error', (e)->
|
||||||
console.log("Connection error")
|
console.log("Connection error")
|
||||||
if (e.readyState == EventSource.CLOSED)
|
if (e.readyState == EventSource.CLOSED)
|
||||||
console.log("Connection closed")
|
console.log("Connection closed")
|
||||||
|
|
||||||
source.addEventListener 'message', (e) =>
|
source.addEventListener 'message', (e) =>
|
||||||
data = JSON.parse(e.data)
|
data = JSON.parse(e.data)
|
||||||
if Dashing.debugMode
|
if Dashing.debugMode
|
||||||
console.log("Received data for #{data.id}", data)
|
console.log("Received data for #{data.id}", data)
|
||||||
lastEvents[data.id] = data
|
lastEvents[data.id] = data
|
||||||
if widgets[data.id]?.length > 0
|
if widgets[data.id]?.length > 0
|
||||||
for widget in widgets[data.id]
|
for widget in widgets[data.id]
|
||||||
widget.receiveData(data)
|
widget.receiveData(data)
|
||||||
|
|
||||||
|
|
||||||
$(document).ready ->
|
$(document).ready ->
|
||||||
Dashing.run()
|
Dashing.run()
|
||||||
@@ -1,37 +1,37 @@
|
|||||||
#= require_directory ./gridster
|
#= require_directory ./gridster
|
||||||
|
|
||||||
# This file enables gridster integration (http://gridster.net/)
|
# This file enables gridster integration (http://gridster.net/)
|
||||||
# Delete it if you'd rather handle the layout yourself.
|
# Delete it if you'd rather handle the layout yourself.
|
||||||
# You'll miss out on a lot if you do, but we won't hold it against you.
|
# You'll miss out on a lot if you do, but we won't hold it against you.
|
||||||
|
|
||||||
Dashing.gridsterLayout = (positions) ->
|
Dashing.gridsterLayout = (positions) ->
|
||||||
Dashing.customGridsterLayout = true
|
Dashing.customGridsterLayout = true
|
||||||
positions = positions.replace(/^"|"$/g, '')
|
positions = positions.replace(/^"|"$/g, '')
|
||||||
positions = $.parseJSON(positions)
|
positions = $.parseJSON(positions)
|
||||||
widgets = $("[data-row^=]")
|
widgets = $("[data-row^=]")
|
||||||
for widget, index in widgets
|
for widget, index in widgets
|
||||||
$(widget).attr('data-row', positions[index].row)
|
$(widget).attr('data-row', positions[index].row)
|
||||||
$(widget).attr('data-col', positions[index].col)
|
$(widget).attr('data-col', positions[index].col)
|
||||||
|
|
||||||
Dashing.getWidgetPositions = ->
|
Dashing.getWidgetPositions = ->
|
||||||
$(".gridster ul:first").gridster().data('gridster').serialize()
|
$(".gridster ul:first").gridster().data('gridster').serialize()
|
||||||
|
|
||||||
Dashing.showGridsterInstructions = ->
|
Dashing.showGridsterInstructions = ->
|
||||||
newWidgetPositions = Dashing.getWidgetPositions()
|
newWidgetPositions = Dashing.getWidgetPositions()
|
||||||
|
|
||||||
unless JSON.stringify(newWidgetPositions) == JSON.stringify(Dashing.currentWidgetPositions)
|
unless JSON.stringify(newWidgetPositions) == JSON.stringify(Dashing.currentWidgetPositions)
|
||||||
Dashing.currentWidgetPositions = newWidgetPositions
|
Dashing.currentWidgetPositions = newWidgetPositions
|
||||||
$('#save-gridster').slideDown()
|
$('#save-gridster').slideDown()
|
||||||
$('#gridster-code').text("
|
$('#gridster-code').text("
|
||||||
<script type='text/javascript'>\n
|
<script type='text/javascript'>\n
|
||||||
$(function() {\n
|
$(function() {\n
|
||||||
\ \ Dashing.gridsterLayout('#{JSON.stringify(Dashing.currentWidgetPositions)}')\n
|
\ \ Dashing.gridsterLayout('#{JSON.stringify(Dashing.currentWidgetPositions)}')\n
|
||||||
});\n
|
});\n
|
||||||
</script>
|
</script>
|
||||||
")
|
")
|
||||||
|
|
||||||
$ ->
|
$ ->
|
||||||
$('#save-gridster').leanModal()
|
$('#save-gridster').leanModal()
|
||||||
|
|
||||||
$('#save-gridster').click ->
|
$('#save-gridster').click ->
|
||||||
$('#save-gridster').slideUp()
|
$('#save-gridster').slideUp()
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -1,5 +1,5 @@
|
|||||||
// leanModal v1.1 by Ray Stone - http://finelysliced.com.au
|
// leanModal v1.1 by Ray Stone - http://finelysliced.com.au
|
||||||
// Dual licensed under the MIT and GPL
|
// Dual licensed under the MIT and GPL
|
||||||
|
|
||||||
(function($){$.fn.extend({leanModal:function(options){var defaults={top:100,overlay:0.5,closeButton:null};var overlay=$("<div id='lean_overlay'></div>");$("body").append(overlay);options=$.extend(defaults,options);return this.each(function(){var o=options;$(this).click(function(e){var modal_id=$(this).attr("href");$("#lean_overlay").click(function(){close_modal(modal_id)});$(o.closeButton).click(function(){close_modal(modal_id)});var modal_height=$(modal_id).outerHeight();var modal_width=$(modal_id).outerWidth();
|
(function($){$.fn.extend({leanModal:function(options){var defaults={top:100,overlay:0.5,closeButton:null};var overlay=$("<div id='lean_overlay'></div>");$("body").append(overlay);options=$.extend(defaults,options);return this.each(function(){var o=options;$(this).click(function(e){var modal_id=$(this).attr("href");$("#lean_overlay").click(function(){close_modal(modal_id)});$(o.closeButton).click(function(){close_modal(modal_id)});var modal_height=$(modal_id).outerHeight();var modal_width=$(modal_id).outerWidth();
|
||||||
$("#lean_overlay").css({"display":"block",opacity:0});$("#lean_overlay").fadeTo(200,o.overlay);$(modal_id).css({"display":"block","position":"fixed","opacity":0,"z-index":11000,"left":50+"%","margin-left":-(modal_width/2)+"px","top":o.top+"px"});$(modal_id).fadeTo(200,1);e.preventDefault()})});function close_modal(modal_id){$("#lean_overlay").fadeOut(200);$(modal_id).css({"display":"none"})}}})})(jQuery);
|
$("#lean_overlay").css({"display":"block",opacity:0});$("#lean_overlay").fadeTo(200,o.overlay);$(modal_id).css({"display":"block","position":"fixed","opacity":0,"z-index":11000,"left":50+"%","margin-left":-(modal_width/2)+"px","top":o.top+"px"});$(modal_id).fadeTo(200,1);e.preventDefault()})});function close_modal(modal_id){$("#lean_overlay").fadeOut(200);$(modal_id).css({"display":"none"})}}})})(jQuery);
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -1,255 +1,255 @@
|
|||||||
/*
|
/*
|
||||||
//=require_directory .
|
//=require_directory .
|
||||||
//=require_tree ../../widgets
|
//=require_tree ../../widgets
|
||||||
*/
|
*/
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #222;
|
$background-color: #222;
|
||||||
$text-color: #fff;
|
$text-color: #fff;
|
||||||
|
|
||||||
$background-warning-color-1: #e82711;
|
$background-warning-color-1: #e82711;
|
||||||
$background-warning-color-2: #9b2d23;
|
$background-warning-color-2: #9b2d23;
|
||||||
$text-warning-color: #fff;
|
$text-warning-color: #fff;
|
||||||
|
|
||||||
$background-danger-color-1: #eeae32;
|
$background-danger-color-1: #eeae32;
|
||||||
$background-danger-color-2: #ff9618;
|
$background-danger-color-2: #ff9618;
|
||||||
$text-danger-color: #fff;
|
$text-danger-color: #fff;
|
||||||
|
|
||||||
@-webkit-keyframes status-warning-background {
|
@-webkit-keyframes status-warning-background {
|
||||||
0% { background-color: $background-warning-color-1; }
|
0% { background-color: $background-warning-color-1; }
|
||||||
50% { background-color: $background-warning-color-2; }
|
50% { background-color: $background-warning-color-2; }
|
||||||
100% { background-color: $background-warning-color-1; }
|
100% { background-color: $background-warning-color-1; }
|
||||||
}
|
}
|
||||||
@-webkit-keyframes status-danger-background {
|
@-webkit-keyframes status-danger-background {
|
||||||
0% { background-color: $background-danger-color-1; }
|
0% { background-color: $background-danger-color-1; }
|
||||||
50% { background-color: $background-danger-color-2; }
|
50% { background-color: $background-danger-color-2; }
|
||||||
100% { background-color: $background-danger-color-1; }
|
100% { background-color: $background-danger-color-1; }
|
||||||
}
|
}
|
||||||
@mixin animation($animation-name, $duration, $function, $animation-iteration-count:""){
|
@mixin animation($animation-name, $duration, $function, $animation-iteration-count:""){
|
||||||
-webkit-animation: $animation-name $duration $function #{$animation-iteration-count};
|
-webkit-animation: $animation-name $duration $function #{$animation-iteration-count};
|
||||||
-moz-animation: $animation-name $duration $function #{$animation-iteration-count};
|
-moz-animation: $animation-name $duration $function #{$animation-iteration-count};
|
||||||
-ms-animation: $animation-name $duration $function #{$animation-iteration-count};
|
-ms-animation: $animation-name $duration $function #{$animation-iteration-count};
|
||||||
}
|
}
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Base styles
|
// Base styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
html {
|
html {
|
||||||
font-size: 100%;
|
font-size: 100%;
|
||||||
-webkit-text-size-adjust: 100%;
|
-webkit-text-size-adjust: 100%;
|
||||||
-ms-text-size-adjust: 100%;
|
-ms-text-size-adjust: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
color: $text-color;
|
color: $text-color;
|
||||||
font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
b, strong {
|
b, strong {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
border: 0;
|
border: 0;
|
||||||
-ms-interpolation-mode: bicubic;
|
-ms-interpolation-mode: bicubic;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
img, object {
|
img, object {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
iframe {
|
iframe {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
border-spacing: 0;
|
border-spacing: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
td {
|
td {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul, ol {
|
ul, ol {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, p {
|
h1, h2, h3, h4, h5, p {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
h1 {
|
h1 {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 30px;
|
font-size: 30px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
h2 {
|
h2 {
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
font-size: 76px;
|
font-size: 76px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
color: $text-color;
|
color: $text-color;
|
||||||
}
|
}
|
||||||
h3 {
|
h3 {
|
||||||
font-size: 25px;
|
font-size: 25px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: $text-color;
|
color: $text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Base widget styles
|
// Base widget styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.gridster {
|
.gridster {
|
||||||
margin: 0px auto;
|
margin: 0px auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon-background {
|
.icon-background {
|
||||||
width: 100%!important;
|
width: 100%!important;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
opacity: 0.1;
|
opacity: 0.1;
|
||||||
font-size: 275px;
|
font-size: 275px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-nostyle {
|
.list-nostyle {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gridster ul {
|
.gridster ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gs_w {
|
.gs_w {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: table;
|
display: table;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.widget {
|
.widget {
|
||||||
padding: 25px 12px;
|
padding: 25px 12px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: table-cell;
|
display: table-cell;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.widget.status-warning {
|
.widget.status-warning {
|
||||||
background-color: $background-warning-color-1;
|
background-color: $background-warning-color-1;
|
||||||
@include animation(status-warning-background, 2s, ease, infinite);
|
@include animation(status-warning-background, 2s, ease, infinite);
|
||||||
|
|
||||||
.icon-warning-sign {
|
.icon-warning-sign {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title, .more-info {
|
.title, .more-info {
|
||||||
color: $text-warning-color;
|
color: $text-warning-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.widget.status-danger {
|
.widget.status-danger {
|
||||||
color: $text-danger-color;
|
color: $text-danger-color;
|
||||||
background-color: $background-danger-color-1;
|
background-color: $background-danger-color-1;
|
||||||
@include animation(status-danger-background, 2s, ease, infinite);
|
@include animation(status-danger-background, 2s, ease, infinite);
|
||||||
|
|
||||||
.icon-warning-sign {
|
.icon-warning-sign {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title, .more-info {
|
.title, .more-info {
|
||||||
color: $text-danger-color;
|
color: $text-danger-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 32px;
|
bottom: 32px;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.updated-at {
|
.updated-at {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 12px;
|
bottom: 12px;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#save-gridster {
|
#save-gridster {
|
||||||
display: none;
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
margin: 0px auto;
|
margin: 0px auto;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
background: black;
|
background: black;
|
||||||
width: 190px;
|
width: 190px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border: 1px solid white;
|
border: 1px solid white;
|
||||||
border-top: 0px;
|
border-top: 0px;
|
||||||
margin-left: -95px;
|
margin-left: -95px;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#save-gridster:hover {
|
#save-gridster:hover {
|
||||||
padding-top: 25px;
|
padding-top: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#saving-instructions {
|
#saving-instructions {
|
||||||
display: none;
|
display: none;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
width: 500px;
|
width: 500px;
|
||||||
height: 122px;
|
height: 122px;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
background: white;
|
background: white;
|
||||||
top: 100px;
|
top: 100px;
|
||||||
color: black;
|
color: black;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
padding-bottom: 4px;
|
padding-bottom: 4px;
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
width: 494px;
|
width: 494px;
|
||||||
height: 80px;
|
height: 80px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#lean_overlay {
|
#lean_overlay {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index:100;
|
z-index:100;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
height:100%;
|
height:100%;
|
||||||
width:100%;
|
width:100%;
|
||||||
background: #000;
|
background: #000;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#container {
|
#container {
|
||||||
padding-top: 5px;
|
padding-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Clearfix
|
// Clearfix
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
|
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
|
||||||
.clearfix:after { clear: both; }
|
.clearfix:after { clear: both; }
|
||||||
.clearfix { zoom: 1; }
|
.clearfix { zoom: 1; }
|
||||||
|
|
||||||
@@ -1,303 +1,303 @@
|
|||||||
/* Font Awesome
|
/* Font Awesome
|
||||||
the iconic font designed for use with Twitter Bootstrap
|
the iconic font designed for use with Twitter Bootstrap
|
||||||
-------------------------------------------------------
|
-------------------------------------------------------
|
||||||
The full suite of pictographic icons, examples, and documentation
|
The full suite of pictographic icons, examples, and documentation
|
||||||
can be found at: http://fortawesome.github.com/Font-Awesome/
|
can be found at: http://fortawesome.github.com/Font-Awesome/
|
||||||
|
|
||||||
License
|
License
|
||||||
-------------------------------------------------------
|
-------------------------------------------------------
|
||||||
The Font Awesome webfont, CSS, and LESS files are licensed under CC BY 3.0:
|
The Font Awesome webfont, CSS, and LESS files are licensed under CC BY 3.0:
|
||||||
http://creativecommons.org/licenses/by/3.0/ A mention of
|
http://creativecommons.org/licenses/by/3.0/ A mention of
|
||||||
'Font Awesome - http://fortawesome.github.com/Font-Awesome' in human-readable
|
'Font Awesome - http://fortawesome.github.com/Font-Awesome' in human-readable
|
||||||
source code is considered acceptable attribution (most common on the web).
|
source code is considered acceptable attribution (most common on the web).
|
||||||
If human readable source code is not available to the end user, a mention in
|
If human readable source code is not available to the end user, a mention in
|
||||||
an 'About' or 'Credits' screen is considered acceptable (most common in desktop
|
an 'About' or 'Credits' screen is considered acceptable (most common in desktop
|
||||||
or mobile software).
|
or mobile software).
|
||||||
|
|
||||||
Contact
|
Contact
|
||||||
-------------------------------------------------------
|
-------------------------------------------------------
|
||||||
Email: dave@davegandy.com
|
Email: dave@davegandy.com
|
||||||
Twitter: http://twitter.com/fortaweso_me
|
Twitter: http://twitter.com/fortaweso_me
|
||||||
Work: http://lemonwi.se co-founder
|
Work: http://lemonwi.se co-founder
|
||||||
|
|
||||||
*/
|
*/
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "FontAwesome";
|
font-family: "FontAwesome";
|
||||||
src: url('/assets/fontawesome-webfont.eot');
|
src: url('/assets/fontawesome-webfont.eot');
|
||||||
src: url('/assets/fontawesome-webfont.eot?#iefix') format('eot'), url('/assets/fontawesome-webfont.woff') format('woff'), url('/assets/fontawesome-webfont.ttf') format('truetype'), url('/assets/fontawesome-webfont.svg#FontAwesome') format('svg');
|
src: url('/assets/fontawesome-webfont.eot?#iefix') format('eot'), url('/assets/fontawesome-webfont.woff') format('woff'), url('/assets/fontawesome-webfont.ttf') format('truetype'), url('/assets/fontawesome-webfont.svg#FontAwesome') format('svg');
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Font Awesome styles
|
/* Font Awesome styles
|
||||||
------------------------------------------------------- */
|
------------------------------------------------------- */
|
||||||
[class^="icon-"]:before, [class*=" icon-"]:before {
|
[class^="icon-"]:before, [class*=" icon-"]:before {
|
||||||
font-family: FontAwesome;
|
font-family: FontAwesome;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
text-decoration: inherit;
|
text-decoration: inherit;
|
||||||
}
|
}
|
||||||
a [class^="icon-"], a [class*=" icon-"] {
|
a [class^="icon-"], a [class*=" icon-"] {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
text-decoration: inherit;
|
text-decoration: inherit;
|
||||||
}
|
}
|
||||||
/* makes the font 33% larger relative to the icon container */
|
/* makes the font 33% larger relative to the icon container */
|
||||||
.icon-large:before {
|
.icon-large:before {
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
font-size: 1.3333333333333333em;
|
font-size: 1.3333333333333333em;
|
||||||
}
|
}
|
||||||
.btn [class^="icon-"], .btn [class*=" icon-"] {
|
.btn [class^="icon-"], .btn [class*=" icon-"] {
|
||||||
/* keeps button heights with and without icons the same */
|
/* keeps button heights with and without icons the same */
|
||||||
|
|
||||||
line-height: .9em;
|
line-height: .9em;
|
||||||
}
|
}
|
||||||
li [class^="icon-"], li [class*=" icon-"] {
|
li [class^="icon-"], li [class*=" icon-"] {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 1.25em;
|
width: 1.25em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
li .icon-large[class^="icon-"], li .icon-large[class*=" icon-"] {
|
li .icon-large[class^="icon-"], li .icon-large[class*=" icon-"] {
|
||||||
/* 1.5 increased font size for icon-large * 1.25 width */
|
/* 1.5 increased font size for icon-large * 1.25 width */
|
||||||
|
|
||||||
width: 1.875em;
|
width: 1.875em;
|
||||||
}
|
}
|
||||||
li[class^="icon-"], li[class*=" icon-"] {
|
li[class^="icon-"], li[class*=" icon-"] {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
}
|
}
|
||||||
li[class^="icon-"]:before, li[class*=" icon-"]:before {
|
li[class^="icon-"]:before, li[class*=" icon-"]:before {
|
||||||
text-indent: -2em;
|
text-indent: -2em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
li[class^="icon-"].icon-large:before, li[class*=" icon-"].icon-large:before {
|
li[class^="icon-"].icon-large:before, li[class*=" icon-"].icon-large:before {
|
||||||
text-indent: -1.3333333333333333em;
|
text-indent: -1.3333333333333333em;
|
||||||
}
|
}
|
||||||
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
|
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
|
||||||
readers do not read off random characters that represent icons */
|
readers do not read off random characters that represent icons */
|
||||||
.icon-glass:before { content: "\f000"; }
|
.icon-glass:before { content: "\f000"; }
|
||||||
.icon-music:before { content: "\f001"; }
|
.icon-music:before { content: "\f001"; }
|
||||||
.icon-search:before { content: "\f002"; }
|
.icon-search:before { content: "\f002"; }
|
||||||
.icon-envelope:before { content: "\f003"; }
|
.icon-envelope:before { content: "\f003"; }
|
||||||
.icon-heart:before { content: "\f004"; }
|
.icon-heart:before { content: "\f004"; }
|
||||||
.icon-star:before { content: "\f005"; }
|
.icon-star:before { content: "\f005"; }
|
||||||
.icon-star-empty:before { content: "\f006"; }
|
.icon-star-empty:before { content: "\f006"; }
|
||||||
.icon-user:before { content: "\f007"; }
|
.icon-user:before { content: "\f007"; }
|
||||||
.icon-film:before { content: "\f008"; }
|
.icon-film:before { content: "\f008"; }
|
||||||
.icon-th-large:before { content: "\f009"; }
|
.icon-th-large:before { content: "\f009"; }
|
||||||
.icon-th:before { content: "\f00a"; }
|
.icon-th:before { content: "\f00a"; }
|
||||||
.icon-th-list:before { content: "\f00b"; }
|
.icon-th-list:before { content: "\f00b"; }
|
||||||
.icon-ok:before { content: "\f00c"; }
|
.icon-ok:before { content: "\f00c"; }
|
||||||
.icon-remove:before { content: "\f00d"; }
|
.icon-remove:before { content: "\f00d"; }
|
||||||
.icon-zoom-in:before { content: "\f00e"; }
|
.icon-zoom-in:before { content: "\f00e"; }
|
||||||
|
|
||||||
.icon-zoom-out:before { content: "\f010"; }
|
.icon-zoom-out:before { content: "\f010"; }
|
||||||
.icon-off:before { content: "\f011"; }
|
.icon-off:before { content: "\f011"; }
|
||||||
.icon-signal:before { content: "\f012"; }
|
.icon-signal:before { content: "\f012"; }
|
||||||
.icon-cog:before { content: "\f013"; }
|
.icon-cog:before { content: "\f013"; }
|
||||||
.icon-trash:before { content: "\f014"; }
|
.icon-trash:before { content: "\f014"; }
|
||||||
.icon-home:before { content: "\f015"; }
|
.icon-home:before { content: "\f015"; }
|
||||||
.icon-file:before { content: "\f016"; }
|
.icon-file:before { content: "\f016"; }
|
||||||
.icon-time:before { content: "\f017"; }
|
.icon-time:before { content: "\f017"; }
|
||||||
.icon-road:before { content: "\f018"; }
|
.icon-road:before { content: "\f018"; }
|
||||||
.icon-download-alt:before { content: "\f019"; }
|
.icon-download-alt:before { content: "\f019"; }
|
||||||
.icon-download:before { content: "\f01a"; }
|
.icon-download:before { content: "\f01a"; }
|
||||||
.icon-upload:before { content: "\f01b"; }
|
.icon-upload:before { content: "\f01b"; }
|
||||||
.icon-inbox:before { content: "\f01c"; }
|
.icon-inbox:before { content: "\f01c"; }
|
||||||
.icon-play-circle:before { content: "\f01d"; }
|
.icon-play-circle:before { content: "\f01d"; }
|
||||||
.icon-repeat:before { content: "\f01e"; }
|
.icon-repeat:before { content: "\f01e"; }
|
||||||
|
|
||||||
/* \f020 doesn't work in Safari. all shifted one down */
|
/* \f020 doesn't work in Safari. all shifted one down */
|
||||||
.icon-refresh:before { content: "\f021"; }
|
.icon-refresh:before { content: "\f021"; }
|
||||||
.icon-list-alt:before { content: "\f022"; }
|
.icon-list-alt:before { content: "\f022"; }
|
||||||
.icon-lock:before { content: "\f023"; }
|
.icon-lock:before { content: "\f023"; }
|
||||||
.icon-flag:before { content: "\f024"; }
|
.icon-flag:before { content: "\f024"; }
|
||||||
.icon-headphones:before { content: "\f025"; }
|
.icon-headphones:before { content: "\f025"; }
|
||||||
.icon-volume-off:before { content: "\f026"; }
|
.icon-volume-off:before { content: "\f026"; }
|
||||||
.icon-volume-down:before { content: "\f027"; }
|
.icon-volume-down:before { content: "\f027"; }
|
||||||
.icon-volume-up:before { content: "\f028"; }
|
.icon-volume-up:before { content: "\f028"; }
|
||||||
.icon-qrcode:before { content: "\f029"; }
|
.icon-qrcode:before { content: "\f029"; }
|
||||||
.icon-barcode:before { content: "\f02a"; }
|
.icon-barcode:before { content: "\f02a"; }
|
||||||
.icon-tag:before { content: "\f02b"; }
|
.icon-tag:before { content: "\f02b"; }
|
||||||
.icon-tags:before { content: "\f02c"; }
|
.icon-tags:before { content: "\f02c"; }
|
||||||
.icon-book:before { content: "\f02d"; }
|
.icon-book:before { content: "\f02d"; }
|
||||||
.icon-bookmark:before { content: "\f02e"; }
|
.icon-bookmark:before { content: "\f02e"; }
|
||||||
.icon-print:before { content: "\f02f"; }
|
.icon-print:before { content: "\f02f"; }
|
||||||
|
|
||||||
.icon-camera:before { content: "\f030"; }
|
.icon-camera:before { content: "\f030"; }
|
||||||
.icon-font:before { content: "\f031"; }
|
.icon-font:before { content: "\f031"; }
|
||||||
.icon-bold:before { content: "\f032"; }
|
.icon-bold:before { content: "\f032"; }
|
||||||
.icon-italic:before { content: "\f033"; }
|
.icon-italic:before { content: "\f033"; }
|
||||||
.icon-text-height:before { content: "\f034"; }
|
.icon-text-height:before { content: "\f034"; }
|
||||||
.icon-text-width:before { content: "\f035"; }
|
.icon-text-width:before { content: "\f035"; }
|
||||||
.icon-align-left:before { content: "\f036"; }
|
.icon-align-left:before { content: "\f036"; }
|
||||||
.icon-align-center:before { content: "\f037"; }
|
.icon-align-center:before { content: "\f037"; }
|
||||||
.icon-align-right:before { content: "\f038"; }
|
.icon-align-right:before { content: "\f038"; }
|
||||||
.icon-align-justify:before { content: "\f039"; }
|
.icon-align-justify:before { content: "\f039"; }
|
||||||
.icon-list:before { content: "\f03a"; }
|
.icon-list:before { content: "\f03a"; }
|
||||||
.icon-indent-left:before { content: "\f03b"; }
|
.icon-indent-left:before { content: "\f03b"; }
|
||||||
.icon-indent-right:before { content: "\f03c"; }
|
.icon-indent-right:before { content: "\f03c"; }
|
||||||
.icon-facetime-video:before { content: "\f03d"; }
|
.icon-facetime-video:before { content: "\f03d"; }
|
||||||
.icon-picture:before { content: "\f03e"; }
|
.icon-picture:before { content: "\f03e"; }
|
||||||
|
|
||||||
.icon-pencil:before { content: "\f040"; }
|
.icon-pencil:before { content: "\f040"; }
|
||||||
.icon-map-marker:before { content: "\f041"; }
|
.icon-map-marker:before { content: "\f041"; }
|
||||||
.icon-adjust:before { content: "\f042"; }
|
.icon-adjust:before { content: "\f042"; }
|
||||||
.icon-tint:before { content: "\f043"; }
|
.icon-tint:before { content: "\f043"; }
|
||||||
.icon-edit:before { content: "\f044"; }
|
.icon-edit:before { content: "\f044"; }
|
||||||
.icon-share:before { content: "\f045"; }
|
.icon-share:before { content: "\f045"; }
|
||||||
.icon-check:before { content: "\f046"; }
|
.icon-check:before { content: "\f046"; }
|
||||||
.icon-move:before { content: "\f047"; }
|
.icon-move:before { content: "\f047"; }
|
||||||
.icon-step-backward:before { content: "\f048"; }
|
.icon-step-backward:before { content: "\f048"; }
|
||||||
.icon-fast-backward:before { content: "\f049"; }
|
.icon-fast-backward:before { content: "\f049"; }
|
||||||
.icon-backward:before { content: "\f04a"; }
|
.icon-backward:before { content: "\f04a"; }
|
||||||
.icon-play:before { content: "\f04b"; }
|
.icon-play:before { content: "\f04b"; }
|
||||||
.icon-pause:before { content: "\f04c"; }
|
.icon-pause:before { content: "\f04c"; }
|
||||||
.icon-stop:before { content: "\f04d"; }
|
.icon-stop:before { content: "\f04d"; }
|
||||||
.icon-forward:before { content: "\f04e"; }
|
.icon-forward:before { content: "\f04e"; }
|
||||||
|
|
||||||
.icon-fast-forward:before { content: "\f050"; }
|
.icon-fast-forward:before { content: "\f050"; }
|
||||||
.icon-step-forward:before { content: "\f051"; }
|
.icon-step-forward:before { content: "\f051"; }
|
||||||
.icon-eject:before { content: "\f052"; }
|
.icon-eject:before { content: "\f052"; }
|
||||||
.icon-chevron-left:before { content: "\f053"; }
|
.icon-chevron-left:before { content: "\f053"; }
|
||||||
.icon-chevron-right:before { content: "\f054"; }
|
.icon-chevron-right:before { content: "\f054"; }
|
||||||
.icon-plus-sign:before { content: "\f055"; }
|
.icon-plus-sign:before { content: "\f055"; }
|
||||||
.icon-minus-sign:before { content: "\f056"; }
|
.icon-minus-sign:before { content: "\f056"; }
|
||||||
.icon-remove-sign:before { content: "\f057"; }
|
.icon-remove-sign:before { content: "\f057"; }
|
||||||
.icon-ok-sign:before { content: "\f058"; }
|
.icon-ok-sign:before { content: "\f058"; }
|
||||||
.icon-question-sign:before { content: "\f059"; }
|
.icon-question-sign:before { content: "\f059"; }
|
||||||
.icon-info-sign:before { content: "\f05a"; }
|
.icon-info-sign:before { content: "\f05a"; }
|
||||||
.icon-screenshot:before { content: "\f05b"; }
|
.icon-screenshot:before { content: "\f05b"; }
|
||||||
.icon-remove-circle:before { content: "\f05c"; }
|
.icon-remove-circle:before { content: "\f05c"; }
|
||||||
.icon-ok-circle:before { content: "\f05d"; }
|
.icon-ok-circle:before { content: "\f05d"; }
|
||||||
.icon-ban-circle:before { content: "\f05e"; }
|
.icon-ban-circle:before { content: "\f05e"; }
|
||||||
|
|
||||||
.icon-arrow-left:before { content: "\f060"; }
|
.icon-arrow-left:before { content: "\f060"; }
|
||||||
.icon-arrow-right:before { content: "\f061"; }
|
.icon-arrow-right:before { content: "\f061"; }
|
||||||
.icon-arrow-up:before { content: "\f062"; }
|
.icon-arrow-up:before { content: "\f062"; }
|
||||||
.icon-arrow-down:before { content: "\f063"; }
|
.icon-arrow-down:before { content: "\f063"; }
|
||||||
.icon-share-alt:before { content: "\f064"; }
|
.icon-share-alt:before { content: "\f064"; }
|
||||||
.icon-resize-full:before { content: "\f065"; }
|
.icon-resize-full:before { content: "\f065"; }
|
||||||
.icon-resize-small:before { content: "\f066"; }
|
.icon-resize-small:before { content: "\f066"; }
|
||||||
.icon-plus:before { content: "\f067"; }
|
.icon-plus:before { content: "\f067"; }
|
||||||
.icon-minus:before { content: "\f068"; }
|
.icon-minus:before { content: "\f068"; }
|
||||||
.icon-asterisk:before { content: "\f069"; }
|
.icon-asterisk:before { content: "\f069"; }
|
||||||
.icon-exclamation-sign:before { content: "\f06a"; }
|
.icon-exclamation-sign:before { content: "\f06a"; }
|
||||||
.icon-gift:before { content: "\f06b"; }
|
.icon-gift:before { content: "\f06b"; }
|
||||||
.icon-leaf:before { content: "\f06c"; }
|
.icon-leaf:before { content: "\f06c"; }
|
||||||
.icon-fire:before { content: "\f06d"; }
|
.icon-fire:before { content: "\f06d"; }
|
||||||
.icon-eye-open:before { content: "\f06e"; }
|
.icon-eye-open:before { content: "\f06e"; }
|
||||||
|
|
||||||
.icon-eye-close:before { content: "\f070"; }
|
.icon-eye-close:before { content: "\f070"; }
|
||||||
.icon-warning-sign:before { content: "\f071"; }
|
.icon-warning-sign:before { content: "\f071"; }
|
||||||
.icon-plane:before { content: "\f072"; }
|
.icon-plane:before { content: "\f072"; }
|
||||||
.icon-calendar:before { content: "\f073"; }
|
.icon-calendar:before { content: "\f073"; }
|
||||||
.icon-random:before { content: "\f074"; }
|
.icon-random:before { content: "\f074"; }
|
||||||
.icon-comment:before { content: "\f075"; }
|
.icon-comment:before { content: "\f075"; }
|
||||||
.icon-magnet:before { content: "\f076"; }
|
.icon-magnet:before { content: "\f076"; }
|
||||||
.icon-chevron-up:before { content: "\f077"; }
|
.icon-chevron-up:before { content: "\f077"; }
|
||||||
.icon-chevron-down:before { content: "\f078"; }
|
.icon-chevron-down:before { content: "\f078"; }
|
||||||
.icon-retweet:before { content: "\f079"; }
|
.icon-retweet:before { content: "\f079"; }
|
||||||
.icon-shopping-cart:before { content: "\f07a"; }
|
.icon-shopping-cart:before { content: "\f07a"; }
|
||||||
.icon-folder-close:before { content: "\f07b"; }
|
.icon-folder-close:before { content: "\f07b"; }
|
||||||
.icon-folder-open:before { content: "\f07c"; }
|
.icon-folder-open:before { content: "\f07c"; }
|
||||||
.icon-resize-vertical:before { content: "\f07d"; }
|
.icon-resize-vertical:before { content: "\f07d"; }
|
||||||
.icon-resize-horizontal:before { content: "\f07e"; }
|
.icon-resize-horizontal:before { content: "\f07e"; }
|
||||||
|
|
||||||
.icon-bar-chart:before { content: "\f080"; }
|
.icon-bar-chart:before { content: "\f080"; }
|
||||||
.icon-twitter-sign:before { content: "\f081"; }
|
.icon-twitter-sign:before { content: "\f081"; }
|
||||||
.icon-facebook-sign:before { content: "\f082"; }
|
.icon-facebook-sign:before { content: "\f082"; }
|
||||||
.icon-camera-retro:before { content: "\f083"; }
|
.icon-camera-retro:before { content: "\f083"; }
|
||||||
.icon-key:before { content: "\f084"; }
|
.icon-key:before { content: "\f084"; }
|
||||||
.icon-cogs:before { content: "\f085"; }
|
.icon-cogs:before { content: "\f085"; }
|
||||||
.icon-comments:before { content: "\f086"; }
|
.icon-comments:before { content: "\f086"; }
|
||||||
.icon-thumbs-up:before { content: "\f087"; }
|
.icon-thumbs-up:before { content: "\f087"; }
|
||||||
.icon-thumbs-down:before { content: "\f088"; }
|
.icon-thumbs-down:before { content: "\f088"; }
|
||||||
.icon-star-half:before { content: "\f089"; }
|
.icon-star-half:before { content: "\f089"; }
|
||||||
.icon-heart-empty:before { content: "\f08a"; }
|
.icon-heart-empty:before { content: "\f08a"; }
|
||||||
.icon-signout:before { content: "\f08b"; }
|
.icon-signout:before { content: "\f08b"; }
|
||||||
.icon-linkedin-sign:before { content: "\f08c"; }
|
.icon-linkedin-sign:before { content: "\f08c"; }
|
||||||
.icon-pushpin:before { content: "\f08d"; }
|
.icon-pushpin:before { content: "\f08d"; }
|
||||||
.icon-external-link:before { content: "\f08e"; }
|
.icon-external-link:before { content: "\f08e"; }
|
||||||
|
|
||||||
.icon-signin:before { content: "\f090"; }
|
.icon-signin:before { content: "\f090"; }
|
||||||
.icon-trophy:before { content: "\f091"; }
|
.icon-trophy:before { content: "\f091"; }
|
||||||
.icon-github-sign:before { content: "\f092"; }
|
.icon-github-sign:before { content: "\f092"; }
|
||||||
.icon-upload-alt:before { content: "\f093"; }
|
.icon-upload-alt:before { content: "\f093"; }
|
||||||
.icon-lemon:before { content: "\f094"; }
|
.icon-lemon:before { content: "\f094"; }
|
||||||
.icon-phone:before { content: "\f095"; }
|
.icon-phone:before { content: "\f095"; }
|
||||||
.icon-check-empty:before { content: "\f096"; }
|
.icon-check-empty:before { content: "\f096"; }
|
||||||
.icon-bookmark-empty:before { content: "\f097"; }
|
.icon-bookmark-empty:before { content: "\f097"; }
|
||||||
.icon-phone-sign:before { content: "\f098"; }
|
.icon-phone-sign:before { content: "\f098"; }
|
||||||
.icon-twitter:before { content: "\f099"; }
|
.icon-twitter:before { content: "\f099"; }
|
||||||
.icon-facebook:before { content: "\f09a"; }
|
.icon-facebook:before { content: "\f09a"; }
|
||||||
.icon-github:before { content: "\f09b"; }
|
.icon-github:before { content: "\f09b"; }
|
||||||
.icon-unlock:before { content: "\f09c"; }
|
.icon-unlock:before { content: "\f09c"; }
|
||||||
.icon-credit-card:before { content: "\f09d"; }
|
.icon-credit-card:before { content: "\f09d"; }
|
||||||
.icon-rss:before { content: "\f09e"; }
|
.icon-rss:before { content: "\f09e"; }
|
||||||
|
|
||||||
.icon-hdd:before { content: "\f0a0"; }
|
.icon-hdd:before { content: "\f0a0"; }
|
||||||
.icon-bullhorn:before { content: "\f0a1"; }
|
.icon-bullhorn:before { content: "\f0a1"; }
|
||||||
.icon-bell:before { content: "\f0a2"; }
|
.icon-bell:before { content: "\f0a2"; }
|
||||||
.icon-certificate:before { content: "\f0a3"; }
|
.icon-certificate:before { content: "\f0a3"; }
|
||||||
.icon-hand-right:before { content: "\f0a4"; }
|
.icon-hand-right:before { content: "\f0a4"; }
|
||||||
.icon-hand-left:before { content: "\f0a5"; }
|
.icon-hand-left:before { content: "\f0a5"; }
|
||||||
.icon-hand-up:before { content: "\f0a6"; }
|
.icon-hand-up:before { content: "\f0a6"; }
|
||||||
.icon-hand-down:before { content: "\f0a7"; }
|
.icon-hand-down:before { content: "\f0a7"; }
|
||||||
.icon-circle-arrow-left:before { content: "\f0a8"; }
|
.icon-circle-arrow-left:before { content: "\f0a8"; }
|
||||||
.icon-circle-arrow-right:before { content: "\f0a9"; }
|
.icon-circle-arrow-right:before { content: "\f0a9"; }
|
||||||
.icon-circle-arrow-up:before { content: "\f0aa"; }
|
.icon-circle-arrow-up:before { content: "\f0aa"; }
|
||||||
.icon-circle-arrow-down:before { content: "\f0ab"; }
|
.icon-circle-arrow-down:before { content: "\f0ab"; }
|
||||||
.icon-globe:before { content: "\f0ac"; }
|
.icon-globe:before { content: "\f0ac"; }
|
||||||
.icon-wrench:before { content: "\f0ad"; }
|
.icon-wrench:before { content: "\f0ad"; }
|
||||||
.icon-tasks:before { content: "\f0ae"; }
|
.icon-tasks:before { content: "\f0ae"; }
|
||||||
|
|
||||||
.icon-filter:before { content: "\f0b0"; }
|
.icon-filter:before { content: "\f0b0"; }
|
||||||
.icon-briefcase:before { content: "\f0b1"; }
|
.icon-briefcase:before { content: "\f0b1"; }
|
||||||
.icon-fullscreen:before { content: "\f0b2"; }
|
.icon-fullscreen:before { content: "\f0b2"; }
|
||||||
|
|
||||||
.icon-group:before { content: "\f0c0"; }
|
.icon-group:before { content: "\f0c0"; }
|
||||||
.icon-link:before { content: "\f0c1"; }
|
.icon-link:before { content: "\f0c1"; }
|
||||||
.icon-cloud:before { content: "\f0c2"; }
|
.icon-cloud:before { content: "\f0c2"; }
|
||||||
.icon-beaker:before { content: "\f0c3"; }
|
.icon-beaker:before { content: "\f0c3"; }
|
||||||
.icon-cut:before { content: "\f0c4"; }
|
.icon-cut:before { content: "\f0c4"; }
|
||||||
.icon-copy:before { content: "\f0c5"; }
|
.icon-copy:before { content: "\f0c5"; }
|
||||||
.icon-paper-clip:before { content: "\f0c6"; }
|
.icon-paper-clip:before { content: "\f0c6"; }
|
||||||
.icon-save:before { content: "\f0c7"; }
|
.icon-save:before { content: "\f0c7"; }
|
||||||
.icon-sign-blank:before { content: "\f0c8"; }
|
.icon-sign-blank:before { content: "\f0c8"; }
|
||||||
.icon-reorder:before { content: "\f0c9"; }
|
.icon-reorder:before { content: "\f0c9"; }
|
||||||
.icon-list-ul:before { content: "\f0ca"; }
|
.icon-list-ul:before { content: "\f0ca"; }
|
||||||
.icon-list-ol:before { content: "\f0cb"; }
|
.icon-list-ol:before { content: "\f0cb"; }
|
||||||
.icon-strikethrough:before { content: "\f0cc"; }
|
.icon-strikethrough:before { content: "\f0cc"; }
|
||||||
.icon-underline:before { content: "\f0cd"; }
|
.icon-underline:before { content: "\f0cd"; }
|
||||||
.icon-table:before { content: "\f0ce"; }
|
.icon-table:before { content: "\f0ce"; }
|
||||||
|
|
||||||
.icon-magic:before { content: "\f0d0"; }
|
.icon-magic:before { content: "\f0d0"; }
|
||||||
.icon-truck:before { content: "\f0d1"; }
|
.icon-truck:before { content: "\f0d1"; }
|
||||||
.icon-pinterest:before { content: "\f0d2"; }
|
.icon-pinterest:before { content: "\f0d2"; }
|
||||||
.icon-pinterest-sign:before { content: "\f0d3"; }
|
.icon-pinterest-sign:before { content: "\f0d3"; }
|
||||||
.icon-google-plus-sign:before { content: "\f0d4"; }
|
.icon-google-plus-sign:before { content: "\f0d4"; }
|
||||||
.icon-google-plus:before { content: "\f0d5"; }
|
.icon-google-plus:before { content: "\f0d5"; }
|
||||||
.icon-money:before { content: "\f0d6"; }
|
.icon-money:before { content: "\f0d6"; }
|
||||||
.icon-caret-down:before { content: "\f0d7"; }
|
.icon-caret-down:before { content: "\f0d7"; }
|
||||||
.icon-caret-up:before { content: "\f0d8"; }
|
.icon-caret-up:before { content: "\f0d8"; }
|
||||||
.icon-caret-left:before { content: "\f0d9"; }
|
.icon-caret-left:before { content: "\f0d9"; }
|
||||||
.icon-caret-right:before { content: "\f0da"; }
|
.icon-caret-right:before { content: "\f0da"; }
|
||||||
.icon-columns:before { content: "\f0db"; }
|
.icon-columns:before { content: "\f0db"; }
|
||||||
.icon-sort:before { content: "\f0dc"; }
|
.icon-sort:before { content: "\f0dc"; }
|
||||||
.icon-sort-down:before { content: "\f0dd"; }
|
.icon-sort-down:before { content: "\f0dd"; }
|
||||||
.icon-sort-up:before { content: "\f0de"; }
|
.icon-sort-up:before { content: "\f0de"; }
|
||||||
|
|
||||||
.icon-envelope-alt:before { content: "\f0e0"; }
|
.icon-envelope-alt:before { content: "\f0e0"; }
|
||||||
.icon-linkedin:before { content: "\f0e1"; }
|
.icon-linkedin:before { content: "\f0e1"; }
|
||||||
.icon-undo:before { content: "\f0e2"; }
|
.icon-undo:before { content: "\f0e2"; }
|
||||||
.icon-legal:before { content: "\f0e3"; }
|
.icon-legal:before { content: "\f0e3"; }
|
||||||
.icon-dashboard:before { content: "\f0e4"; }
|
.icon-dashboard:before { content: "\f0e4"; }
|
||||||
.icon-comment-alt:before { content: "\f0e5"; }
|
.icon-comment-alt:before { content: "\f0e5"; }
|
||||||
.icon-comments-alt:before { content: "\f0e6"; }
|
.icon-comments-alt:before { content: "\f0e6"; }
|
||||||
.icon-bolt:before { content: "\f0e7"; }
|
.icon-bolt:before { content: "\f0e7"; }
|
||||||
.icon-sitemap:before { content: "\f0e8"; }
|
.icon-sitemap:before { content: "\f0e8"; }
|
||||||
.icon-umbrella:before { content: "\f0e9"; }
|
.icon-umbrella:before { content: "\f0e9"; }
|
||||||
.icon-paste:before { content: "\f0ea"; }
|
.icon-paste:before { content: "\f0ea"; }
|
||||||
|
|
||||||
.icon-user-md:before { content: "\f200"; }
|
.icon-user-md:before { content: "\f200"; }
|
||||||
@@ -1,57 +1,57 @@
|
|||||||
/*! gridster.js - v0.1.0 - 2012-08-14
|
/*! gridster.js - v0.1.0 - 2012-08-14
|
||||||
* http://gridster.net/
|
* http://gridster.net/
|
||||||
* Copyright (c) 2012 ducksboard; Licensed MIT */
|
* Copyright (c) 2012 ducksboard; Licensed MIT */
|
||||||
|
|
||||||
.gridster {
|
.gridster {
|
||||||
position:relative;
|
position:relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gridster > * {
|
.gridster > * {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
-webkit-transition: height .4s;
|
-webkit-transition: height .4s;
|
||||||
-moz-transition: height .4s;
|
-moz-transition: height .4s;
|
||||||
-o-transition: height .4s;
|
-o-transition: height .4s;
|
||||||
-ms-transition: height .4s;
|
-ms-transition: height .4s;
|
||||||
transition: height .4s;
|
transition: height .4s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gridster .gs_w{
|
.gridster .gs_w{
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ready .gs_w:not(.preview-holder) {
|
.ready .gs_w:not(.preview-holder) {
|
||||||
-webkit-transition: opacity .3s, left .3s, top .3s;
|
-webkit-transition: opacity .3s, left .3s, top .3s;
|
||||||
-moz-transition: opacity .3s, left .3s, top .3s;
|
-moz-transition: opacity .3s, left .3s, top .3s;
|
||||||
-o-transition: opacity .3s, left .3s, top .3s;
|
-o-transition: opacity .3s, left .3s, top .3s;
|
||||||
transition: opacity .3s, left .3s, top .3s;
|
transition: opacity .3s, left .3s, top .3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gridster .preview-holder {
|
.gridster .preview-holder {
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border-color: #fff;
|
border-color: #fff;
|
||||||
opacity: 0.3;
|
opacity: 0.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gridster .player-revert {
|
.gridster .player-revert {
|
||||||
z-index: 10!important;
|
z-index: 10!important;
|
||||||
-webkit-transition: left .3s, top .3s!important;
|
-webkit-transition: left .3s, top .3s!important;
|
||||||
-moz-transition: left .3s, top .3s!important;
|
-moz-transition: left .3s, top .3s!important;
|
||||||
-o-transition: left .3s, top .3s!important;
|
-o-transition: left .3s, top .3s!important;
|
||||||
transition: left .3s, top .3s!important;
|
transition: left .3s, top .3s!important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gridster .dragging {
|
.gridster .dragging {
|
||||||
z-index: 10!important;
|
z-index: 10!important;
|
||||||
-webkit-transition: all 0s !important;
|
-webkit-transition: all 0s !important;
|
||||||
-moz-transition: all 0s !important;
|
-moz-transition: all 0s !important;
|
||||||
-o-transition: all 0s !important;
|
-o-transition: all 0s !important;
|
||||||
transition: all 0s !important;
|
transition: all 0s !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Uncomment this if you set helper : "clone" in draggable options */
|
/* Uncomment this if you set helper : "clone" in draggable options */
|
||||||
/*.gridster .player {
|
/*.gridster .player {
|
||||||
opacity:0;
|
opacity:0;
|
||||||
}*/
|
}*/
|
||||||
124
pydashie/main.py
Normal file
124
pydashie/main.py
Normal file
@@ -0,0 +1,124 @@
|
|||||||
|
import os
|
||||||
|
import json
|
||||||
|
import random
|
||||||
|
import Queue
|
||||||
|
import datetime
|
||||||
|
import collections
|
||||||
|
import coffeescript
|
||||||
|
|
||||||
|
from repeated_timer import RepeatedTimer
|
||||||
|
|
||||||
|
from flask import Flask, render_template, Response
|
||||||
|
app = Flask(__name__)
|
||||||
|
|
||||||
|
events_queue = Queue.Queue()
|
||||||
|
items = collections.deque()
|
||||||
|
seedX = 0
|
||||||
|
|
||||||
|
@app.route("/")
|
||||||
|
def hello():
|
||||||
|
return render_template('main.html', title='pyDashie Dashboard')
|
||||||
|
|
||||||
|
@app.route("/assets/application.js")
|
||||||
|
def javascripts():
|
||||||
|
# scripts = [
|
||||||
|
# 'assets/javascripts/jquery.js',
|
||||||
|
# 'assets/javascripts/es5-shim.js',
|
||||||
|
# 'assets/javascripts/d3.v2.min.js',
|
||||||
|
# 'assets/javascripts/batman.js',
|
||||||
|
# 'assets/javascripts/batman.jquery.js',
|
||||||
|
# 'assets/javascripts/jquery.gridster.js',
|
||||||
|
# 'assets/javascripts/jquery.leanModal.min.js',
|
||||||
|
# 'assets/javascripts/dashing.coffee',
|
||||||
|
# 'assets/javascripts/jquery.knob.js',
|
||||||
|
# 'assets/javascripts/rickshaw.min.js',
|
||||||
|
# 'assets/javascripts/application.coffee',
|
||||||
|
# 'assets/javascripts/dashing.gridster.coffee'
|
||||||
|
# ]
|
||||||
|
scripts = ['assets/javascripts/application.js']
|
||||||
|
|
||||||
|
base_directory = os.getcwd()
|
||||||
|
full_paths = [os.path.join(base_directory, script_name) for script_name in scripts]
|
||||||
|
output = ''
|
||||||
|
for path in full_paths:
|
||||||
|
if '.coffee' in path:
|
||||||
|
print('Compiling Coffee on %s ' % path)
|
||||||
|
output = output + coffeescript.compile(open(path).read())
|
||||||
|
else:
|
||||||
|
output = output + open(path).read()
|
||||||
|
return Response(output, mimetype='application/javascript')
|
||||||
|
|
||||||
|
@app.route('/assets/application.css')
|
||||||
|
def application_css():
|
||||||
|
scripts = [
|
||||||
|
'assets/stylesheets/application.css',
|
||||||
|
]
|
||||||
|
base_directory = os.getcwd()
|
||||||
|
full_paths = [os.path.join(base_directory, script_name) for script_name in scripts]
|
||||||
|
output = ''
|
||||||
|
for path in full_paths:
|
||||||
|
output = output + open(path).read()
|
||||||
|
return Response(output, mimetype='text/css')
|
||||||
|
|
||||||
|
@app.route('/views/<widget_name>.html')
|
||||||
|
def widget_html(widget_name):
|
||||||
|
base_directory = os.getcwd()
|
||||||
|
path = os.path.join(base_directory, 'widgets', widget_name, '%s.html' % widget_name)
|
||||||
|
return open(path).read()
|
||||||
|
|
||||||
|
|
||||||
|
@app.route('/events')
|
||||||
|
def events():
|
||||||
|
return Response(pop_queue(), mimetype='text/event-stream')
|
||||||
|
|
||||||
|
def pop_queue():
|
||||||
|
while True:
|
||||||
|
yield events_queue.get()
|
||||||
|
|
||||||
|
def sample_synergy():
|
||||||
|
synergy_data = {'value': random.randint(0, 100),
|
||||||
|
'id': 'synergy',
|
||||||
|
'updateAt': datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S +0000')}
|
||||||
|
formatted_json = 'data: %s\n\n' % (json.dumps(synergy_data))
|
||||||
|
events_queue.put(formatted_json)
|
||||||
|
|
||||||
|
def sample_buzzwords():
|
||||||
|
items = [
|
||||||
|
{'label': 'Test',
|
||||||
|
'value': random.randint(0, 20)},
|
||||||
|
{'label': 'Test2',
|
||||||
|
'value': random.randint(0, 20)},
|
||||||
|
]
|
||||||
|
item_data = {'items': items,
|
||||||
|
'id': 'buzzwords',
|
||||||
|
'updateAt': datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S +0000')}
|
||||||
|
formatted_json = 'data: %s\n\n' % (json.dumps(item_data))
|
||||||
|
events_queue.put(formatted_json)
|
||||||
|
|
||||||
|
def sample_convergence():
|
||||||
|
print 'Added convergence'
|
||||||
|
global seedX
|
||||||
|
if not seedX:
|
||||||
|
seedX = 0
|
||||||
|
items.append({'x':seedX,
|
||||||
|
'y':random.randint(0,20)})
|
||||||
|
seedX += 1
|
||||||
|
if len(items) > 10:
|
||||||
|
items.popleft()
|
||||||
|
item_data = {'points': list(items),
|
||||||
|
'id': 'convergence',
|
||||||
|
'updateAt': datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S +0000')}
|
||||||
|
formatted_json = 'data: %s\n\n' % (json.dumps(item_data))
|
||||||
|
events_queue.put(formatted_json)
|
||||||
|
|
||||||
|
if __name__ == "__main__":
|
||||||
|
rt = RepeatedTimer(1, sample_synergy)
|
||||||
|
rt2 = RepeatedTimer(1, sample_buzzwords)
|
||||||
|
rt3 = RepeatedTimer(1, sample_convergence)
|
||||||
|
try:
|
||||||
|
print 'Before app run'
|
||||||
|
app.run(debug=True, port=5000, threaded=True)
|
||||||
|
finally:
|
||||||
|
rt.stop()
|
||||||
|
rt2.stop()
|
||||||
|
rt3.stop()
|
||||||
@@ -1,71 +1,101 @@
|
|||||||
import os
|
import os
|
||||||
import time
|
import json
|
||||||
import random
|
import time
|
||||||
import datetime
|
import random
|
||||||
import coffeescript
|
import Queue
|
||||||
|
import datetime
|
||||||
from flask import Flask, render_template, Response
|
import coffeescript
|
||||||
app = Flask(__name__)
|
|
||||||
|
#from repeated_timer import RepeatedTimer
|
||||||
@app.route("/")
|
|
||||||
def hello():
|
from flask import Flask, render_template, Response
|
||||||
return render_template('main.html')
|
app = Flask(__name__)
|
||||||
|
|
||||||
@app.route("/assets/application.js")
|
#events_queue = Queue.Queue()
|
||||||
def javascripts():
|
|
||||||
# scripts = [
|
@app.route("/")
|
||||||
# 'assets/javascripts/jquery.js',
|
def hello():
|
||||||
# 'assets/javascripts/es5-shim.js',
|
return render_template('main.html')
|
||||||
# 'assets/javascripts/d3.v2.min.js',
|
|
||||||
# 'assets/javascripts/batman.js',
|
@app.route("/assets/application.js")
|
||||||
# 'assets/javascripts/batman.jquery.js',
|
def javascripts():
|
||||||
# 'assets/javascripts/jquery.gridster.js',
|
# scripts = [
|
||||||
# 'assets/javascripts/jquery.leanModal.min.js',
|
# 'assets/javascripts/jquery.js',
|
||||||
# 'assets/javascripts/dashing.coffee',
|
# 'assets/javascripts/es5-shim.js',
|
||||||
# 'assets/javascripts/jquery.knob.js',
|
# 'assets/javascripts/d3.v2.min.js',
|
||||||
# 'assets/javascripts/rickshaw.min.js',
|
# 'assets/javascripts/batman.js',
|
||||||
# 'assets/javascripts/application.coffee',
|
# 'assets/javascripts/batman.jquery.js',
|
||||||
# 'assets/javascripts/dashing.gridster.coffee'
|
# 'assets/javascripts/jquery.gridster.js',
|
||||||
# ]
|
# 'assets/javascripts/jquery.leanModal.min.js',
|
||||||
scripts = ['assets/javascripts/application.js']
|
# 'assets/javascripts/dashing.coffee',
|
||||||
|
# 'assets/javascripts/jquery.knob.js',
|
||||||
base_directory = os.getcwd()
|
# 'assets/javascripts/rickshaw.min.js',
|
||||||
full_paths = [os.path.join(base_directory, script_name) for script_name in scripts]
|
# 'assets/javascripts/application.coffee',
|
||||||
output = ''
|
# 'assets/javascripts/dashing.gridster.coffee'
|
||||||
for path in full_paths:
|
# ]
|
||||||
if '.coffee' in path:
|
scripts = ['assets/javascripts/application.js']
|
||||||
print('Compiling Coffee on %s ' % path)
|
|
||||||
output = output + coffeescript.compile(open(path).read())
|
base_directory = os.getcwd()
|
||||||
else:
|
full_paths = [os.path.join(base_directory, script_name) for script_name in scripts]
|
||||||
output = output + open(path).read()
|
output = ''
|
||||||
return Response(output, mimetype='application/javascript')
|
for path in full_paths:
|
||||||
|
if '.coffee' in path:
|
||||||
@app.route('/assets/application.css')
|
print('Compiling Coffee on %s ' % path)
|
||||||
def application_css():
|
output = output + coffeescript.compile(open(path).read())
|
||||||
scripts = [
|
else:
|
||||||
'assets/stylesheets/application.css',
|
output = output + open(path).read()
|
||||||
]
|
return Response(output, mimetype='application/javascript')
|
||||||
base_directory = os.getcwd()
|
|
||||||
full_paths = [os.path.join(base_directory, script_name) for script_name in scripts]
|
@app.route('/assets/application.css')
|
||||||
output = ''
|
def application_css():
|
||||||
for path in full_paths:
|
scripts = [
|
||||||
output = output + open(path).read()
|
'assets/stylesheets/application.css',
|
||||||
return Response(output, mimetype='text/css')
|
]
|
||||||
|
base_directory = os.getcwd()
|
||||||
@app.route('/views/<widget_name>.html')
|
full_paths = [os.path.join(base_directory, script_name) for script_name in scripts]
|
||||||
def widget_html(widget_name):
|
output = ''
|
||||||
base_directory = os.getcwd()
|
for path in full_paths:
|
||||||
path = os.path.join(base_directory, 'widgets', widget_name, '%s.html' % widget_name)
|
output = output + open(path).read()
|
||||||
return open(path).read()
|
return Response(output, mimetype='text/css')
|
||||||
|
|
||||||
@app.route('/events')
|
@app.route('/views/<widget_name>.html')
|
||||||
def events():
|
def widget_html(widget_name):
|
||||||
def generate():
|
base_directory = os.getcwd()
|
||||||
while True:
|
path = os.path.join(base_directory, 'widgets', widget_name, '%s.html' % widget_name)
|
||||||
timeString = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S +0000')
|
return open(path).read()
|
||||||
yield 'data: {"value":%s,"id":"synergy","updatedAt":"%s"}\n\n' % (random.randint(0, 100), timeString)
|
|
||||||
time.sleep(2)
|
#@app.route('/events')
|
||||||
return Response(generate(), mimetype='text/event-stream')
|
#def events():
|
||||||
|
# print 'In Events'
|
||||||
if __name__ == "__main__":
|
# return Response(pop_queue(), mimetype='text/event-stream')
|
||||||
app.run(debug=True, port=5000, threaded=True)
|
@app.route('/events')
|
||||||
|
def events():
|
||||||
|
def generate():
|
||||||
|
while True:
|
||||||
|
timeString = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S +0000')
|
||||||
|
yield 'data: {"value":%s,"id":"synergy","updatedAt":"%s"}\n\n' % (random.randint(0, 100), timeString)
|
||||||
|
time.sleep(2)
|
||||||
|
return Response(generate(), mimetype='text/event-stream')
|
||||||
|
|
||||||
|
#def pop_queue():
|
||||||
|
# print 'In Pop Queue'
|
||||||
|
# while True:
|
||||||
|
# yield sample_widgets()#events_queue.get()
|
||||||
|
# time.sleep(2)
|
||||||
|
# print 'Read from Queue'
|
||||||
|
#
|
||||||
|
#def sample_widgets():
|
||||||
|
# synergy_data = {'value': random.randint(0, 100),
|
||||||
|
# 'id': 'synergy',
|
||||||
|
# 'updateAt': datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S +0000')}
|
||||||
|
# events_queue.put('data: {%s}\n\n' % (json.dumps(synergy_data)))
|
||||||
|
# print 'Put some data in Queue'
|
||||||
|
#
|
||||||
|
if __name__ == "__main__":
|
||||||
|
#rt = RepeatedTimer(1, sample_widgets)
|
||||||
|
app.run(debug=True, port=5000, threaded=True)
|
||||||
|
# try:
|
||||||
|
# print 'Before app run'
|
||||||
|
#
|
||||||
|
# finally:
|
||||||
|
# pass#rt.stop()
|
||||||
26
pydashie/repeated_timer.py
Normal file
26
pydashie/repeated_timer.py
Normal file
@@ -0,0 +1,26 @@
|
|||||||
|
from threading import Timer
|
||||||
|
|
||||||
|
class RepeatedTimer(object):
|
||||||
|
def __init__(self, interval, function, *args, **kwargs):
|
||||||
|
self._timer = None
|
||||||
|
self.interval = interval
|
||||||
|
self.function = function
|
||||||
|
self.args = args
|
||||||
|
self.kwargs = kwargs
|
||||||
|
self.is_running = False
|
||||||
|
self.start()
|
||||||
|
|
||||||
|
def _run(self):
|
||||||
|
self.is_running = False
|
||||||
|
self.start()
|
||||||
|
self.function(*self.args, **self.kwargs)
|
||||||
|
|
||||||
|
def start(self):
|
||||||
|
if not self.is_running:
|
||||||
|
self._timer = Timer(self.interval, self._run)
|
||||||
|
self._timer.start()
|
||||||
|
self.is_running = True
|
||||||
|
|
||||||
|
def stop(self):
|
||||||
|
self._timer.cancel()
|
||||||
|
self.is_running = False
|
||||||
BIN
pydashie/repeated_timer.pyc
Normal file
BIN
pydashie/repeated_timer.pyc
Normal file
Binary file not shown.
@@ -1,45 +1,45 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8"/>
|
<meta charset="utf-8"/>
|
||||||
<meta name="description" content="">
|
<meta name="description" content="">
|
||||||
<meta name="viewport" content="width=device-width">
|
<meta name="viewport" content="width=device-width">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
|
||||||
<title>{{title}}</title>
|
<title>{{title}}</title>
|
||||||
|
|
||||||
<!-- The javascript and css are managed by sprockets. The files can be found in the /assets folder-->
|
<!-- The javascript and css are managed by sprockets. The files can be found in the /assets folder-->
|
||||||
<script type="text/javascript" src="/assets/application.js"></script>
|
<script type="text/javascript" ssrc="/assets/application.js"></script>
|
||||||
<link rel="stylesheet" href="/assets/application.css">
|
<link rel="stylesheet" href="/assets/application.css">
|
||||||
|
|
||||||
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
|
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
|
||||||
<link rel="icon" href="/assets/favicon.ico">
|
<link rel="icon" href="/assets/favicon.ico">
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="container">
|
<div id="container">
|
||||||
<div class="gridster">
|
<div class="gridster">
|
||||||
<ul>
|
<ul>
|
||||||
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
|
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
|
||||||
<div data-id="welcome" data-view="Text" data-title="Hello" data-text="This is your shiny new dashboard." data-moreinfo="Protip: You can drag the widgets around!"></div>
|
<div data-id="welcome" data-view="Text" data-title="Hello" data-text="This is your shiny new (python powered) dashboard." data-moreinfo="Protip: You can drag the widgets around!"></div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
|
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
|
||||||
<div data-id="synergy" data-view="Meter" data-title="Synergy" data-min="0" data-max="100"></div>
|
<div data-id="synergy" data-view="Meter" data-title="Synergy" data-min="0" data-max="100"></div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li data-row="1" data-col="1" data-sizex="1" data-sizey="2">
|
<li data-row="1" data-col="1" data-sizex="1" data-sizey="2">
|
||||||
<div data-id="buzzwords" data-view="List" data-unordered="true" data-title="Buzzwords" data-moreinfo="# of times said around the office"></div>
|
<div data-id="buzzwords" data-view="List" data-unordered="true" data-title="Buzzwords" data-moreinfo="# of times said around the office"></div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
|
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
|
||||||
<div data-id="valuation" data-view="Number" data-title="Current Valuation" data-moreinfo="In billions" data-prefix="$"></div>
|
<div data-id="valuation" data-view="Number" data-title="Current Valuation" data-moreinfo="In billions" data-prefix="$"></div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
|
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
|
||||||
<div data-id="convergence" data-view="Graph" data-title="Convergence" style="background-color:#ff9618"></div>
|
<div data-id="convergence" data-view="Graph" data-title="Convergence" style="background-color:#ff9618"></div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@@ -1,18 +1,18 @@
|
|||||||
class Dashing.Clock extends Dashing.Widget
|
class Dashing.Clock extends Dashing.Widget
|
||||||
|
|
||||||
ready: ->
|
ready: ->
|
||||||
setInterval(@startTime, 500)
|
setInterval(@startTime, 500)
|
||||||
|
|
||||||
startTime: =>
|
startTime: =>
|
||||||
today = new Date()
|
today = new Date()
|
||||||
|
|
||||||
h = today.getHours()
|
h = today.getHours()
|
||||||
m = today.getMinutes()
|
m = today.getMinutes()
|
||||||
s = today.getSeconds()
|
s = today.getSeconds()
|
||||||
m = @formatTime(m)
|
m = @formatTime(m)
|
||||||
s = @formatTime(s)
|
s = @formatTime(s)
|
||||||
@set('time', h + ":" + m + ":" + s)
|
@set('time', h + ":" + m + ":" + s)
|
||||||
@set('date', today.toDateString())
|
@set('date', today.toDateString())
|
||||||
|
|
||||||
formatTime: (i) ->
|
formatTime: (i) ->
|
||||||
if i < 10 then "0" + i else i
|
if i < 10 then "0" + i else i
|
||||||
@@ -1,2 +1,2 @@
|
|||||||
<h1 data-bind="date"></h1>
|
<h1 data-bind="date"></h1>
|
||||||
<h2 data-bind="time"></h2>
|
<h2 data-bind="time"></h2>
|
||||||
@@ -1,13 +1,13 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #dc5945;
|
$background-color: #dc5945;
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-clock styles
|
// Widget-clock styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-clock {
|
.widget-clock {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,24 +1,24 @@
|
|||||||
class Dashing.Comments extends Dashing.Widget
|
class Dashing.Comments extends Dashing.Widget
|
||||||
|
|
||||||
@accessor 'quote', ->
|
@accessor 'quote', ->
|
||||||
"“#{@get('current_comment')?.body}”"
|
"“#{@get('current_comment')?.body}”"
|
||||||
|
|
||||||
ready: ->
|
ready: ->
|
||||||
@currentIndex = 0
|
@currentIndex = 0
|
||||||
@commentElem = $(@node).find('.comment-container')
|
@commentElem = $(@node).find('.comment-container')
|
||||||
@nextComment()
|
@nextComment()
|
||||||
@startCarousel()
|
@startCarousel()
|
||||||
|
|
||||||
onData: (data) ->
|
onData: (data) ->
|
||||||
@currentIndex = 0
|
@currentIndex = 0
|
||||||
|
|
||||||
startCarousel: ->
|
startCarousel: ->
|
||||||
setInterval(@nextComment, 8000)
|
setInterval(@nextComment, 8000)
|
||||||
|
|
||||||
nextComment: =>
|
nextComment: =>
|
||||||
comments = @get('comments')
|
comments = @get('comments')
|
||||||
if comments
|
if comments
|
||||||
@commentElem.fadeOut =>
|
@commentElem.fadeOut =>
|
||||||
@currentIndex = (@currentIndex + 1) % comments.length
|
@currentIndex = (@currentIndex + 1) % comments.length
|
||||||
@set 'current_comment', comments[@currentIndex]
|
@set 'current_comment', comments[@currentIndex]
|
||||||
@commentElem.fadeIn()
|
@commentElem.fadeIn()
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<h1 class="title" data-bind="title"></h1>
|
<h1 class="title" data-bind="title"></h1>
|
||||||
<div class="comment-container">
|
<div class="comment-container">
|
||||||
<h3><img data-bind-src='current_comment.avatar'/><span data-bind='current_comment.name' class="name"></span></h3>
|
<h3><img data-bind-src='current_comment.avatar'/><span data-bind='current_comment.name' class="name"></span></h3>
|
||||||
<p class="comment" data-bind='quote'></p>
|
<p class="comment" data-bind='quote'></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="more-info" data-bind="moreinfo | raw"></p>
|
<p class="more-info" data-bind="moreinfo | raw"></p>
|
||||||
@@ -1,33 +1,33 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #eb9c3c;
|
$background-color: #eb9c3c;
|
||||||
|
|
||||||
$title-color: rgba(255, 255, 255, 0.7);
|
$title-color: rgba(255, 255, 255, 0.7);
|
||||||
$moreinfo-color: rgba(255, 255, 255, 0.7);
|
$moreinfo-color: rgba(255, 255, 255, 0.7);
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-comment styles
|
// Widget-comment styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-comments {
|
.widget-comments {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: $title-color;
|
color: $title-color;
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.name {
|
.name {
|
||||||
padding-left: 5px;
|
padding-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.comment-container {
|
.comment-container {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
color: $moreinfo-color;
|
color: $moreinfo-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,35 +1,35 @@
|
|||||||
class Dashing.Graph extends Dashing.Widget
|
class Dashing.Graph extends Dashing.Widget
|
||||||
|
|
||||||
@accessor 'current', ->
|
@accessor 'current', ->
|
||||||
return @get('displayedValue') if @get('displayedValue')
|
return @get('displayedValue') if @get('displayedValue')
|
||||||
points = @get('points')
|
points = @get('points')
|
||||||
if points
|
if points
|
||||||
points[points.length - 1].y
|
points[points.length - 1].y
|
||||||
|
|
||||||
ready: ->
|
ready: ->
|
||||||
container = $(@node).parent()
|
container = $(@node).parent()
|
||||||
# Gross hacks. Let's fix this.
|
# Gross hacks. Let's fix this.
|
||||||
width = (Dashing.widget_base_dimensions[0] * container.data("sizex")) + Dashing.widget_margins[0] * 2 * (container.data("sizex") - 1)
|
width = (Dashing.widget_base_dimensions[0] * container.data("sizex")) + Dashing.widget_margins[0] * 2 * (container.data("sizex") - 1)
|
||||||
height = (Dashing.widget_base_dimensions[1] * container.data("sizey"))
|
height = (Dashing.widget_base_dimensions[1] * container.data("sizey"))
|
||||||
@graph = new Rickshaw.Graph(
|
@graph = new Rickshaw.Graph(
|
||||||
element: @node
|
element: @node
|
||||||
width: width
|
width: width
|
||||||
height: height
|
height: height
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
data: [{x:0, y:0}]
|
data: [{x:0, y:0}]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
|
|
||||||
@graph.series[0].data = @get('points') if @get('points')
|
@graph.series[0].data = @get('points') if @get('points')
|
||||||
|
|
||||||
x_axis = new Rickshaw.Graph.Axis.Time(graph: @graph)
|
x_axis = new Rickshaw.Graph.Axis.Time(graph: @graph)
|
||||||
y_axis = new Rickshaw.Graph.Axis.Y(graph: @graph, tickFormat: Rickshaw.Fixtures.Number.formatKMBT)
|
y_axis = new Rickshaw.Graph.Axis.Y(graph: @graph, tickFormat: Rickshaw.Fixtures.Number.formatKMBT)
|
||||||
@graph.render()
|
@graph.render()
|
||||||
|
|
||||||
onData: (data) ->
|
onData: (data) ->
|
||||||
if @graph
|
if @graph
|
||||||
@graph.series[0].data = data.points
|
@graph.series[0].data = data.points
|
||||||
@graph.render()
|
@graph.render()
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<h1 class="title" data-bind="title"></h1>
|
<h1 class="title" data-bind="title"></h1>
|
||||||
|
|
||||||
<h2 class="value" data-bind="current | prettyNumber | prepend prefix"></h2>
|
<h2 class="value" data-bind="current | prettyNumber | prepend prefix"></h2>
|
||||||
|
|
||||||
<p class="more-info" data-bind="moreinfo"></p>
|
<p class="more-info" data-bind="moreinfo"></p>
|
||||||
@@ -1,65 +1,65 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #dc5945;
|
$background-color: #dc5945;
|
||||||
|
|
||||||
$title-color: rgba(255, 255, 255, 0.7);
|
$title-color: rgba(255, 255, 255, 0.7);
|
||||||
$moreinfo-color: rgba(255, 255, 255, 0.3);
|
$moreinfo-color: rgba(255, 255, 255, 0.3);
|
||||||
$tick-color: rgba(0, 0, 0, 0.4);
|
$tick-color: rgba(0, 0, 0, 0.4);
|
||||||
|
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-graph styles
|
// Widget-graph styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-graph {
|
.widget-graph {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
fill-opacity: 0.4;
|
fill-opacity: 0.4;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title, .value {
|
.title, .value {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 99;
|
z-index: 99;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: $title-color;
|
color: $title-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
color: $moreinfo-color;
|
color: $moreinfo-color;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.x_tick {
|
.x_tick {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
.title {
|
.title {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
color: $tick-color;
|
color: $tick-color;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
padding-bottom: 3px;
|
padding-bottom: 3px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.y_ticks {
|
.y_ticks {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
fill: $tick-color;
|
fill: $tick-color;
|
||||||
fill-opacity: 1;
|
fill-opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.domain {
|
.domain {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,9 +1,9 @@
|
|||||||
class Dashing.Iframe extends Dashing.Widget
|
class Dashing.Iframe extends Dashing.Widget
|
||||||
|
|
||||||
ready: ->
|
ready: ->
|
||||||
# This is fired when the widget is done being rendered
|
# This is fired when the widget is done being rendered
|
||||||
|
|
||||||
onData: (data) ->
|
onData: (data) ->
|
||||||
# Handle incoming data
|
# Handle incoming data
|
||||||
# You can access the html node of this widget with `@node`
|
# You can access the html node of this widget with `@node`
|
||||||
# Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in.
|
# Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in.
|
||||||
@@ -1,8 +1,8 @@
|
|||||||
.widget-iframe {
|
.widget-iframe {
|
||||||
padding: 3px 0px 0px 0px !important;
|
padding: 3px 0px 0px 0px !important;
|
||||||
|
|
||||||
iframe {
|
iframe {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -1,9 +1,9 @@
|
|||||||
class Dashing.Image extends Dashing.Widget
|
class Dashing.Image extends Dashing.Widget
|
||||||
|
|
||||||
ready: ->
|
ready: ->
|
||||||
# This is fired when the widget is done being rendered
|
# This is fired when the widget is done being rendered
|
||||||
|
|
||||||
onData: (data) ->
|
onData: (data) ->
|
||||||
# Handle incoming data
|
# Handle incoming data
|
||||||
# You can access the html node of this widget with `@node`
|
# You can access the html node of this widget with `@node`
|
||||||
# Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in.
|
# Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in.
|
||||||
@@ -1,13 +1,13 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #4b4b4b;
|
$background-color: #4b4b4b;
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-image styles
|
// Widget-image styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-image {
|
.widget-image {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
class Dashing.List extends Dashing.Widget
|
class Dashing.List extends Dashing.Widget
|
||||||
ready: ->
|
ready: ->
|
||||||
if @get('unordered')
|
if @get('unordered')
|
||||||
$(@node).find('ol').remove()
|
$(@node).find('ol').remove()
|
||||||
else
|
else
|
||||||
$(@node).find('ul').remove()
|
$(@node).find('ul').remove()
|
||||||
@@ -1,18 +1,18 @@
|
|||||||
<h1 class="title" data-bind="title"></h1>
|
<h1 class="title" data-bind="title"></h1>
|
||||||
|
|
||||||
<ol>
|
<ol>
|
||||||
<li data-foreach-item="items">
|
<li data-foreach-item="items">
|
||||||
<span class="label" data-bind="item.label"></span>
|
<span class="label" data-bind="item.label"></span>
|
||||||
<span class="value" data-bind="item.value"></span>
|
<span class="value" data-bind="item.value"></span>
|
||||||
</li>
|
</li>
|
||||||
</ol>
|
</ol>
|
||||||
|
|
||||||
<ul class="list-nostyle">
|
<ul class="list-nostyle">
|
||||||
<li data-foreach-item="items">
|
<li data-foreach-item="items">
|
||||||
<span class="label" data-bind="item.label"></span>
|
<span class="label" data-bind="item.label"></span>
|
||||||
<span class="value" data-bind="item.value"></span>
|
<span class="value" data-bind="item.value"></span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<p class="more-info" data-bind="moreinfo"></p>
|
<p class="more-info" data-bind="moreinfo"></p>
|
||||||
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
||||||
@@ -1,60 +1,60 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #12b0c5;
|
$background-color: #12b0c5;
|
||||||
$value-color: #fff;
|
$value-color: #fff;
|
||||||
|
|
||||||
$title-color: rgba(255, 255, 255, 0.7);
|
$title-color: rgba(255, 255, 255, 0.7);
|
||||||
$label-color: rgba(255, 255, 255, 0.7);
|
$label-color: rgba(255, 255, 255, 0.7);
|
||||||
$moreinfo-color: rgba(255, 255, 255, 0.7);
|
$moreinfo-color: rgba(255, 255, 255, 0.7);
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-list styles
|
// Widget-list styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-list {
|
.widget-list {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: $title-color;
|
color: $title-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
ol, ul {
|
ol, ul {
|
||||||
margin: 0 15px;
|
margin: 0 15px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
color: $label-color;
|
color: $label-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
ol {
|
ol {
|
||||||
list-style-position: inside;
|
list-style-position: inside;
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-nostyle {
|
.list-nostyle {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label {
|
.label {
|
||||||
color: $label-color;
|
color: $label-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.value {
|
.value {
|
||||||
float: right;
|
float: right;
|
||||||
margin-left: 12px;
|
margin-left: 12px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: $value-color;
|
color: $value-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.updated-at {
|
.updated-at {
|
||||||
color: rgba(0, 0, 0, 0.3);
|
color: rgba(0, 0, 0, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
color: $moreinfo-color;
|
color: $moreinfo-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,14 +1,14 @@
|
|||||||
class Dashing.Meter extends Dashing.Widget
|
class Dashing.Meter extends Dashing.Widget
|
||||||
|
|
||||||
@accessor 'value', Dashing.AnimatedValue
|
@accessor 'value', Dashing.AnimatedValue
|
||||||
|
|
||||||
constructor: ->
|
constructor: ->
|
||||||
super
|
super
|
||||||
@observe 'value', (value) ->
|
@observe 'value', (value) ->
|
||||||
$(@node).find(".meter").val(value).trigger('change')
|
$(@node).find(".meter").val(value).trigger('change')
|
||||||
|
|
||||||
ready: ->
|
ready: ->
|
||||||
meter = $(@node).find(".meter")
|
meter = $(@node).find(".meter")
|
||||||
meter.attr("data-bgcolor", meter.css("background-color"))
|
meter.attr("data-bgcolor", meter.css("background-color"))
|
||||||
meter.attr("data-fgcolor", meter.css("color"))
|
meter.attr("data-fgcolor", meter.css("color"))
|
||||||
meter.knob()
|
meter.knob()
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<h1 class="title" data-bind="title"></h1>
|
<h1 class="title" data-bind="title"></h1>
|
||||||
|
|
||||||
<input class="meter" data-angleOffset=-125 data-angleArc=250 data-width=200 data-readOnly=true data-bind-value="value | shortenedNumber" data-bind-data-min="min" data-bind-data-max="max">
|
<input class="meter" data-angleOffset=-125 data-angleArc=250 data-width=200 data-readOnly=true data-bind-value="value | shortenedNumber" data-bind-data-min="min" data-bind-data-max="max">
|
||||||
|
|
||||||
<p class="more-info" data-bind="moreinfo"></p>
|
<p class="more-info" data-bind="moreinfo"></p>
|
||||||
|
|
||||||
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
||||||
@@ -1,35 +1,35 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #9c4274;
|
$background-color: #9c4274;
|
||||||
|
|
||||||
$title-color: rgba(255, 255, 255, 0.7);
|
$title-color: rgba(255, 255, 255, 0.7);
|
||||||
$moreinfo-color: rgba(255, 255, 255, 0.3);
|
$moreinfo-color: rgba(255, 255, 255, 0.3);
|
||||||
|
|
||||||
$meter-background: darken($background-color, 15%);
|
$meter-background: darken($background-color, 15%);
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-meter styles
|
// Widget-meter styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-meter {
|
.widget-meter {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
|
|
||||||
input.meter {
|
input.meter {
|
||||||
background-color: $meter-background;
|
background-color: $meter-background;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: $title-color;
|
color: $title-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
color: $moreinfo-color;
|
color: $moreinfo-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.updated-at {
|
.updated-at {
|
||||||
color: rgba(0, 0, 0, 0.3);
|
color: rgba(0, 0, 0, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,20 +1,20 @@
|
|||||||
class Dashing.Number extends Dashing.Widget
|
class Dashing.Number extends Dashing.Widget
|
||||||
@accessor 'current', Dashing.AnimatedValue
|
@accessor 'current', Dashing.AnimatedValue
|
||||||
|
|
||||||
@accessor 'difference', ->
|
@accessor 'difference', ->
|
||||||
if @get('last')
|
if @get('last')
|
||||||
last = parseInt(@get('last'))
|
last = parseInt(@get('last'))
|
||||||
current = parseInt(@get('current'))
|
current = parseInt(@get('current'))
|
||||||
if last != 0
|
if last != 0
|
||||||
diff = Math.abs(Math.round((current - last) / last * 100))
|
diff = Math.abs(Math.round((current - last) / last * 100))
|
||||||
"#{diff}%"
|
"#{diff}%"
|
||||||
else
|
else
|
||||||
""
|
""
|
||||||
|
|
||||||
@accessor 'arrow', ->
|
@accessor 'arrow', ->
|
||||||
if @get('last')
|
if @get('last')
|
||||||
if parseInt(@get('current')) > parseInt(@get('last')) then 'icon-arrow-up' else 'icon-arrow-down'
|
if parseInt(@get('current')) > parseInt(@get('last')) then 'icon-arrow-up' else 'icon-arrow-down'
|
||||||
|
|
||||||
onData: (data) ->
|
onData: (data) ->
|
||||||
if data.status
|
if data.status
|
||||||
$(@get('node')).addClass("status-#{data.status}")
|
$(@get('node')).addClass("status-#{data.status}")
|
||||||
@@ -1,11 +1,11 @@
|
|||||||
<h1 class="title" data-bind="title"></h1>
|
<h1 class="title" data-bind="title"></h1>
|
||||||
|
|
||||||
<h2 class="value" data-bind="current | shortenedNumber | prepend prefix"></h2>
|
<h2 class="value" data-bind="current | shortenedNumber | prepend prefix"></h2>
|
||||||
|
|
||||||
<p class="change-rate">
|
<p class="change-rate">
|
||||||
<i data-bind-class="arrow"></i><span data-bind="difference"></span>
|
<i data-bind-class="arrow"></i><span data-bind="difference"></span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p class="more-info" data-bind="moreinfo | raw"></p>
|
<p class="more-info" data-bind="moreinfo | raw"></p>
|
||||||
|
|
||||||
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
||||||
@@ -1,39 +1,39 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #47bbb3;
|
$background-color: #47bbb3;
|
||||||
$value-color: #fff;
|
$value-color: #fff;
|
||||||
|
|
||||||
$title-color: rgba(255, 255, 255, 0.7);;
|
$title-color: rgba(255, 255, 255, 0.7);;
|
||||||
$moreinfo-color: rgba(255, 255, 255, 0.7);;
|
$moreinfo-color: rgba(255, 255, 255, 0.7);;
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-number styles
|
// Widget-number styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-number {
|
.widget-number {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: $title-color;
|
color: $title-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.value {
|
.value {
|
||||||
color: $value-color;
|
color: $value-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.change-rate {
|
.change-rate {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 30px;
|
font-size: 30px;
|
||||||
color: $value-color;
|
color: $value-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
color: $moreinfo-color;
|
color: $moreinfo-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.updated-at {
|
.updated-at {
|
||||||
color: rgba(0, 0, 0, 0.3);
|
color: rgba(0, 0, 0, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<h1 class="title" data-bind="title"></h1>
|
<h1 class="title" data-bind="title"></h1>
|
||||||
|
|
||||||
<h3 data-bind="text | raw"></h3>
|
<h3 data-bind="text | raw"></h3>
|
||||||
|
|
||||||
<p class="more-info" data-bind="moreinfo | raw"></p>
|
<p class="more-info" data-bind="moreinfo | raw"></p>
|
||||||
|
|
||||||
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
<p class="updated-at" data-bind="updatedAtMessage"></p>
|
||||||
@@ -1,32 +1,32 @@
|
|||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Sass declarations
|
// Sass declarations
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
$background-color: #ec663c;
|
$background-color: #ec663c;
|
||||||
|
|
||||||
$title-color: rgba(255, 255, 255, 0.7);
|
$title-color: rgba(255, 255, 255, 0.7);
|
||||||
$moreinfo-color: rgba(255, 255, 255, 0.7);
|
$moreinfo-color: rgba(255, 255, 255, 0.7);
|
||||||
|
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
// Widget-text styles
|
// Widget-text styles
|
||||||
// ----------------------------------------------------------------------------
|
// ----------------------------------------------------------------------------
|
||||||
.widget-text {
|
.widget-text {
|
||||||
|
|
||||||
background-color: $background-color;
|
background-color: $background-color;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: $title-color;
|
color: $title-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more-info {
|
.more-info {
|
||||||
color: $moreinfo-color;
|
color: $moreinfo-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.updated-at {
|
.updated-at {
|
||||||
color: rgba(255, 255, 255, 0.7);
|
color: rgba(255, 255, 255, 0.7);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
&.large h3 {
|
&.large h3 {
|
||||||
font-size: 65px;
|
font-size: 65px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
18
setup.py
18
setup.py
@@ -1,9 +1,9 @@
|
|||||||
from distutils.core import setup
|
from distutils.core import setup
|
||||||
|
|
||||||
setup(
|
setup(
|
||||||
name='PyDashy',
|
name='PyDashie',
|
||||||
version='0.1dev',
|
version='0.1dev',
|
||||||
packages=['pydashy',],
|
packages=['pydashie',],
|
||||||
license='MIT',
|
license='MIT',
|
||||||
long_description=open('README.txt').read(),
|
long_description=open('README.txt').read(),
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user