Fixed up lightbox display - warvox - VoIP based wardialing tool, forked from rapid7/warvox.
(DIR) Log
(DIR) Files
(DIR) Refs
(DIR) README
---
(DIR) commit 4fc4e0581fc91a4856e94c089aa1f34c4f2aa001
(DIR) parent 13450230bbbb5422710e2640661828c46f043df3
(HTM) Author: HD Moore <hd_moore@rapid7.com>
Date: Wed, 26 Dec 2012 23:47:14 -0600
Fixed up lightbox display
Diffstat:
M app/assets/javascripts/application… | 2 +-
M app/assets/javascripts/jquery.ligh… | 69 +++++++++++++++----------------
M app/helpers/application_helper.rb | 38 ++++++++++++++++----------------
M app/views/analyze/view.html.erb | 6 +++---
M app/views/analyze/view_matches.htm… | 6 +++---
5 files changed, 60 insertions(+), 61 deletions(-)
---
(DIR) diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
@@ -2,5 +2,5 @@
// This file is automatically included by javascript_include_tag :defaults
//= require jquery
//= require jquery_ujs
+//= require jquery.lightbox-0.5
//= require highcharts
-// require_tree
(DIR) diff --git a/app/assets/javascripts/jquery.lightbox-0.5.js b/app/assets/javascripts/jquery.lightbox-0.5.js
@@ -27,11 +27,11 @@
// Configuration related to navigation
fixedNavigation: false, // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.
// Configuration related to images
- imageLoading: 'images/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon
- imageBtnPrev: 'images/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image
- imageBtnNext: 'images/lightbox-btn-next.gif', // (string) Path and the name of the next button image
- imageBtnClose: 'images/lightbox-btn-close.gif', // (string) Path and the name of the close btn
- imageBlank: 'images/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel)
+ imageLoading: '/assets/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon
+ imageBtnPrev: '/assets/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image
+ imageBtnNext: '/assets/lightbox-btn-next.gif', // (string) Path and the name of the next button image
+ imageBtnClose: '/assets/lightbox-btn-close.gif', // (string) Path and the name of the close btn
+ imageBlank: '/assets/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel)
// Configuration related to container image box
containerBorderSize: 10, // (integer) If you adjust the padding in the CSS for the container, #lightbox-container-image-box, you will need to update this value
containerResizeSpeed: 400, // (integer) Specify the resize duration of container image. These number are miliseconds. 400 is default.
@@ -42,7 +42,7 @@
keyToClose: 'c', // (string) (c = close) Letter to close the jQuery lightBox interface. Beyond this letter, the letter X and the SCAPE key is used to.
keyToPrev: 'p', // (string) (p = previous) Letter to show the previous image
keyToNext: 'n', // (string) (n = next) Letter to show the next image.
- // Don´t alter these variables in any way
+ // Don't alter these variables in any way
imageArray: [],
activeImage: 0
},settings);
@@ -72,11 +72,11 @@
settings.imageArray.length = 0;
// Unset image active information
settings.activeImage = 0;
- // We have an image set? Or just an image? Let´s see it.
+ // We have an image set? Or just an image? Let's see it.
if ( jQueryMatchedObj.length == 1 ) {
settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));
} else {
- // Add an Array (as many as we have), with href and title atributes, inside the Array that storage the images references
+ // Add an Array (as many as we have), with href and title atributes, inside the Array that storage the images references
for ( var i = 0; i < jQueryMatchedObj.length; i++ ) {
settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));
}
@@ -102,7 +102,7 @@
</div>
<div id="lightbox-loading">
<a href="#" id="lightbox-loading-link">
- <img src="../images/lightbox-ico-loading.gif">
+ <img src="..//assets/lightbox-ico-loading.gif">
</a>
</div>
</div>
@@ -115,7 +115,7 @@
</div>
<div id="lightbox-secNav">
<a href="#" id="lightbox-secNav-btnClose">
- <img src="../images/lightbox-btn-close.gif">
+ <img src="..//assets/lightbox-btn-close.gif">
</a>
</div>
</div>
@@ -125,7 +125,7 @@
*/
function _set_interface() {
// Apply the HTML markup into body tag
- $('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="' + settings.imageLoading + '"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="' + settings.imageBtnClose + '"></a></div></div></div></div>');
+ $('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="' + settings.imageLoading + '"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="' + settings.imageBtnClose + '"></a></div></div></div></div>');
// Get page sizes
var arrPageSizes = ___getPageSize();
// Style overlay and show it
@@ -144,7 +144,7 @@
}).show();
// Assigning click events in elements to close overlay
$('#jquery-overlay,#jquery-lightbox').click(function() {
- _finish();
+ _finish();
});
// Assign the _finish function to lightbox-loading-link and lightbox-secNav-btnClose objects
$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() {
@@ -170,7 +170,7 @@
});
}
/**
- * Prepares image exibition; doing a image´s preloader to calculate it´s size
+ * Prepares image exibition; doing a image???s preloader to calculate it???s size
*
*/
function _set_image_to_view() { // show the loading
@@ -196,16 +196,16 @@
/**
* Perfomance an effect in the image container resizing it
*
- * @param integer intImageWidth The image´s width that will be showed
- * @param integer intImageHeight The image´s height that will be showed
+ * @param integer intImageWidth The image???s width that will be showed
+ * @param integer intImageHeight The image???s height that will be showed
*/
function _resize_container_image_box(intImageWidth,intImageHeight) {
// Get current width and height
var intCurrentWidth = $('#lightbox-container-image-box').width();
var intCurrentHeight = $('#lightbox-container-image-box').height();
// Get the width and height of the selected image plus the padding
- var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); // Plus the image´s width and the left and right padding value
- var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); // Plus the image´s height and the left and right padding value
+ var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); // Plus the image???s width and the left and right padding value
+ var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); // Plus the image???s height and the left and right padding value
// Diferences
var intDiffW = intCurrentWidth - intWidth;
var intDiffH = intCurrentHeight - intHeight;
@@ -215,9 +215,9 @@
if ( $.browser.msie ) {
___pause(250);
} else {
- ___pause(100);
+ ___pause(100);
}
- }
+ }
$('#lightbox-container-image-data-box').css({ width: intImageWidth });
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ height: intImageHeight + (settings.containerBorderSize * 2) });
};
@@ -246,7 +246,7 @@
// If we have a image set, display 'Image X of X'
if ( settings.imageArray.length > 1 ) {
$('#lightbox-image-details-currentNumber').html(settings.txtImage + ' ' + ( settings.activeImage + 1 ) + ' ' + settings.txtOf + ' ' + settings.imageArray.length).show();
- }
+ }
}
/**
* Display the button navigations
@@ -255,9 +255,9 @@
function _set_navigation() {
$('#lightbox-nav').show();
- // Instead to define this configuration in CSS file, we define here. And it´s need to IE. Just.
+ // Instead to define this configuration in CSS file, we define here. And it???s need to IE. Just.
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
-
+
// Show the prev button, if not the first image in set
if ( settings.activeImage != 0 ) {
if ( settings.fixedNavigation ) {
@@ -281,7 +281,7 @@
});
}
}
-
+
// Show the next button, if not the last image in set
if ( settings.activeImage != ( settings.imageArray.length -1 ) ) {
if ( settings.fixedNavigation ) {
@@ -346,7 +346,7 @@
}
// Verify the key to show the previous image
if ( ( key == settings.keyToPrev ) || ( keycode == 37 ) ) {
- // If we´re not showing the first image, call the previous
+ // If we???re not showing the first image, call the previous
if ( settings.activeImage != 0 ) {
settings.activeImage = settings.activeImage - 1;
_set_image_to_view();
@@ -355,7 +355,7 @@
}
// Verify the key to show the next image
if ( ( key == settings.keyToNext ) || ( keycode == 39 ) ) {
- // If we´re not showing the last image, call the next
+ // If we???re not showing the last image, call the next
if ( settings.activeImage != ( settings.imageArray.length - 1 ) ) {
settings.activeImage = settings.activeImage + 1;
_set_image_to_view();
@@ -395,7 +395,7 @@
*/
function ___getPageSize() {
var xScroll, yScroll;
- if (window.innerHeight && window.scrollMaxY) {
+ if (window.innerHeight && window.scrollMaxY) {
xScroll = window.innerWidth + window.scrollMaxX;
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
@@ -408,7 +408,7 @@
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
if(document.documentElement.clientWidth){
- windowWidth = document.documentElement.clientWidth;
+ windowWidth = document.documentElement.clientWidth;
} else {
windowWidth = self.innerWidth;
}
@@ -419,16 +419,16 @@
} else if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
- }
+ }
// for small pages with total height less then height of the viewport
if(yScroll < windowHeight){
pageHeight = windowHeight;
- } else {
+ } else {
pageHeight = yScroll;
}
// for small pages with total width less then width of the viewport
- if(xScroll < windowWidth){
- pageWidth = xScroll;
+ if(xScroll < windowWidth){
+ pageWidth = xScroll;
} else {
pageWidth = windowWidth;
}
@@ -451,7 +451,7 @@
xScroll = document.documentElement.scrollLeft;
} else if (document.body) {// all other Explorers
yScroll = document.body.scrollTop;
- xScroll = document.body.scrollLeft;
+ xScroll = document.body.scrollLeft;
}
arrayPageScroll = new Array(xScroll,yScroll);
return arrayPageScroll;
@@ -461,7 +461,7 @@
*
*/
function ___pause(ms) {
- var date = new Date();
+ var date = new Date();
curDate = null;
do { var curDate = new Date(); }
while ( curDate - date < ms);
@@ -469,4 +469,4 @@
// Return the jQuery object for chaining. The unbind method is used to avoid click conflict when the plugin is called more than once
return this.unbind('click').click(_initialize);
};
-})(jQuery); // Call and execute the function immediately passing the jQuery object
-\ No newline at end of file
+})(jQuery); // Call and execute the function immediately passing the jQuery object
(DIR) diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
@@ -2,33 +2,33 @@
module ApplicationHelper
def get_sections
-
+
count = 0
html = ""
asection = nil
- sections =
+ sections =
[
{ :name => 'Home', :link => '/', :controller => 'home', :subsections => [
] },
{ :name => 'Jobs' , :link => '/dial_jobs/', :controller => 'dial_jobs', :subsections => [
- #
+ #
] },
{ :name => 'Results', :link => '/dial_results/', :controller => 'dial_results', :subsections => [
- #
+ #
] },
{ :name => 'Analysis', :link => '/analyze/', :controller => 'analyze', :subsections => [
- #
- ] },
+ #
+ ] },
{ :name => 'Providers', :link => '/providers/', :controller => 'providers', :subsections => [
- #
+ #
] },
{ :name => 'About', :link => '/home/about/', :controller => 'home/about', :subsections => [
- #
- ] }
+ #
+ ] }
]
-
+
html << "<div id='sections_container'>\n"
html << "<ul id='sections_ul'>\n"
sections.each do |section|
@@ -40,7 +40,7 @@ module ApplicationHelper
html << "<li><a #{lactive} href='#{section[:link]}'>#{section[:name]}</a></li>";
end
html << "\n</ul></div>\n"
-
+
count = 0
html << "<div id='subsections_container'>\n"
html << "<ul id='subsections_ul'>\n"
@@ -50,21 +50,21 @@ module ApplicationHelper
html << "\n</ul></div>\n"
raw(html)
end
-
+
def select_tag_for_filter(nvpairs, params)
_url = ( url_for :overwrite_params => { }).split('?')[0]
- _html = %{<label for="show">Filter: </label>}
- _html << %{<select name="show" id="show"}
- _html << %{onchange="window.location='#{_url}' + '?show=' + this.value">}
+ _html = %{<label for="show">Filter: </label> }
+ _html << %{<select name="show" id="show" }
+ _html << %{onchange="window.location='#{_url}' + '?show=' + this.value"> }
nvpairs.each do |pair|
- _html << %{<option value="#{pair[:scope]}"}
+ _html << %{<option value="#{pair[:scope]}" }
if params[:show] == pair[:scope] || ((params[:show].nil? || params[:show].empty?) && pair[:scope] == "all")
- _html << %{ selected="selected"}
+ _html << %{ selected="selected" }
end
- _html << %{>#{pair[:label]}}
+ _html << %{>#{pair[:label]} }
_html << %{</option>}
end
_html << %{</select>}
raw(_html)
- end
+ end
end
(DIR) diff --git a/app/views/analyze/view.html.erb b/app/views/analyze/view.html.erb
@@ -41,8 +41,8 @@
</td>
<td align='center'>
<b><%=h dial_result.line_type.upcase %></b><br/>
- <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_sig_dots")%>" rel="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_sig")%>" /></a>
- <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_freq")%>" rel="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_freq")%>" /></a><br/>
+ <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_sig_dots")%>" class="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_sig")%>" /></a>
+ <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_freq")%>" class="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_freq")%>" /></a><br/>
<% (dial_result.signatures||"").split("\n").each do |s|
sid,mat,name = s.split(':', 3)
str = [mat.to_i * 6.4, 255].min
@@ -63,6 +63,6 @@
<script type="text/javascript">
$(function() {
// Use this example, or...
- $('a[@rel*=lightbox]').lightBox();
+ $('a.lightbox').lightBox();
});
</script>
(DIR) diff --git a/app/views/analyze/view_matches.html.erb b/app/views/analyze/view_matches.html.erb
@@ -78,8 +78,8 @@
</td>
<td align='center'>
<b><%=h dial_result.line_type.upcase %></b><br/>
- <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_sig_dots")%>" rel="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_sig")%>" /></a>
- <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_freq")%>" rel="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_freq")%>" /></a><br/>
+ <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_sig_dots")%>" class="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_sig")%>" /></a>
+ <a href="<%=resource_analyze_path(@job_id, dial_result.id, "big_freq")%>" class="lightbox"><img src="<%=resource_analyze_path(@job_id, dial_result.id, "small_freq")%>" /></a><br/>
<% (dial_result.signatures||"").split("\n").each do |s|
sid,mat,name = s.split(':', 3)
str = [mat.to_i * 6.4, 255].min
@@ -98,6 +98,6 @@
<script type="text/javascript">
$(function() {
// Use this example, or...
- $('a[@rel*=lightbox]').lightBox();
+ $('a.lightbox').lightBox();
});
</script>