From 817621a4f8dba785a8e97350400282d6f6228d8b Mon Sep 17 00:00:00 2001 From: sanj Date: Thu, 4 Nov 2010 01:52:08 +0530 Subject: [PATCH] disable zoom, remove image gallery, size images, highlight correctly --- vurbanism/static/css/colorbox.css | 4 +- vurbanism/static/css/images/overlay_trans.png | Bin 0 -> 172 bytes vurbanism/static/css/vurbanism.css | 22 ++++++--- vurbanism/static/js/vurbanism.js | 42 ++++++++++++++---- vurbanism/templates/flyovers.html | 16 ++++--- 5 files changed, 63 insertions(+), 21 deletions(-) create mode 100644 vurbanism/static/css/images/overlay_trans.png diff --git a/vurbanism/static/css/colorbox.css b/vurbanism/static/css/colorbox.css index a9e6b44..2a69308 100644 --- a/vurbanism/static/css/colorbox.css +++ b/vurbanism/static/css/colorbox.css @@ -4,7 +4,7 @@ Avoid changing this area to maintain compatability with future versions of ColorBox. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} -#cboxOverlay{position:fixed; width:100%; height:100%;} +#cboxOverlay{position:fixed; width:100%; height:100%} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative; overflow:hidden;} #cboxLoadedContent{overflow:auto;} @@ -18,7 +18,7 @@ The following rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, so that the structure easier to understand. */ -#cboxOverlay{background:url(images/overlay.png) 0 0 repeat;} +#cboxOverlay{background:url(images/overlay_trans.png) 0 0 repeat;} #colorbox{} #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) -100px 0 no-repeat;} #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) -129px 0 no-repeat;} diff --git a/vurbanism/static/css/images/overlay_trans.png b/vurbanism/static/css/images/overlay_trans.png new file mode 100644 index 0000000000000000000000000000000000000000..9a72826779520395ffc36e20319bbcadf29988d3 GIT binary patch literal 172 zcmeAS@N?(olHy`uVBq!ia0vp^av;pX1|+Qw)-3{3jKx9jP7LeL$-D$|*pj^6T^Rm@ z;DWu&Cj&(|3p^r=85p>QL70(Y)*K0-AbW|YuPgg4Ze|f-Q?v9|ZlI8kr;B5V$MLsk z4H+2}cn)l6I{Wi`Bg;A4&c-=eQ3cUTV%mdK II;Vst0OW-+qW}N^ literal 0 HcmV?d00001 diff --git a/vurbanism/static/css/vurbanism.css b/vurbanism/static/css/vurbanism.css index 14fb6b3..6499c99 100644 --- a/vurbanism/static/css/vurbanism.css +++ b/vurbanism/static/css/vurbanism.css @@ -54,18 +54,25 @@ a img { .imageWrapper { float: left; width: 120px; - height: 120px; text-align: center; } +.videosWrapper { + padding: 10px; +} + .videoWrapper { float: left; - width: 400px; + width: 180px; text-align: center; } .videoWrapper img { - width: 340px; + width: 140px; +} + +.imageWrapper img { + width: 100px; } .imagesWrapper { @@ -136,11 +143,10 @@ a img { .imageWrapper .mapSelect img { width: 100px; - height: 100px; } .videoWrapper .mapSelect img { - width: 400px; + width: 140px; } .textsWrapper .mapSelect { @@ -173,3 +179,9 @@ a img { width: 80%; height: 100px; } + +.highlightOverlay { + position: absolute; + background: #2A0AB3; + cursor: pointer; +} diff --git a/vurbanism/static/js/vurbanism.js b/vurbanism/static/js/vurbanism.js index ff98473..a0732c1 100644 --- a/vurbanism/static/js/vurbanism.js +++ b/vurbanism/static/js/vurbanism.js @@ -39,7 +39,9 @@ var map, currentlySelectedFeature, jsonLayer, mapControl, zoomControl; $(function() { var center = new OpenLayers.LonLat(72.855211097628413, 19.010775291486027); - map = new OpenLayers.Map('map'); + map = new OpenLayers.Map('map', { + 'controls': [] + }); var layers = []; layers[0] = new OpenLayers.Layer.Google( "Google Streets", // the default @@ -72,9 +74,25 @@ $(function() { function onFeatureSelect(f) { - var id = f.feature.attributes.id; -// $('img').removeClass('mapSelect'); - $('[data-id=' + id + ']').addClass("mapSelect"); + var id = f.feature.attributes.id; + $('.highlightOverlay').hide().remove(); + // $('img').removeClass('mapSelect'); + var $img = $('[data-id=' + id + ']'); + var offset = $img.find('img').offset(); + var height = $img.find('img').height(); + var width = $img.find('img').width(); + var overlayCss = { + 'top': parseInt(offset.top) + "px", + 'left': parseInt(offset.left) + "px", + 'width': width + "px", + 'height': height + "px", + 'display': 'none' + } + $('
').addClass('highlightOverlay').css(overlayCss).appendTo('body').fadeTo(100, 0.5).click(function() { + $img.click(); + }); +// currentlySelectedFeature = f; +// .addClass("mapSelect"); /* var id = f.feature.attributes.id; $.getJSON("flyover", {'id': id}, function(json) { @@ -88,8 +106,11 @@ function onFeatureSelect(f) { } function onFeatureUnselect(f) { + + currentlySelectedFeature = false; var id = f.feature.attributes.id; - $('[data-id=' + id + ']').removeClass("mapSelect"); + $('.highlightOverlay').hide(); +// $('[data-id=' + id + ']').removeClass("mapSelect"); } //will highlight the feature id's passed in arr @@ -206,7 +227,7 @@ $(function() { }); //trigger click on "About" on page load: - $('#aboutBtn').click(); +// $('#aboutBtn').click(); }); function getFlyoverById(id) { @@ -223,12 +244,17 @@ $('.flyoverImage').live("mouseover", function() { var id = $(this).attr("data-id"); // console.log(id); var flyover = getFlyoverById(id); + if (flyover == currentlySelectedFeature) { + return false; + } mapControl.select(flyover); - currentlySelectedFeature = flyover; + $(this).data("flyover", flyover); +// currentlySelectedFeature = flyover; }); $('.flyoverImage').live("mouseout", function() { - mapControl.unselect(currentlySelectedFeature); +// console.log(currentlySelectedFeature); + mapControl.unselect($(this).data("flyover")); }); $('#submitQuestions').live("click", function() { diff --git a/vurbanism/templates/flyovers.html b/vurbanism/templates/flyovers.html index 3dffd2c..bb0f909 100644 --- a/vurbanism/templates/flyovers.html +++ b/vurbanism/templates/flyovers.html @@ -6,7 +6,7 @@ - Vertical Urbanism: Flyovers in Mumbai + Vertical Urbanism: Flyovers and Skywalks in Mumbai @@ -22,7 +22,7 @@
<% for (var i=0; i
- + <%= img.caption %>
@@ -76,8 +76,12 @@ Harris with the assistance of Savitri Medhatul. The website was devised by Andrew Harris and created by Sanjay Bhangar.The research was funded by the UK’s Economic and Social Research Council and the Urban Laboratory of University College London.

- Urban Lab Logo - ESRC Logo + + Urban Lab Logo + + + ESRC Logo +
@@ -118,7 +122,7 @@ University College London.

Signs Piers - Columns + Skywalk Columns End surfaces @@ -143,7 +147,7 @@ University College London.

Life underneath Storing / Selling Stills underneath - Sounds + Ground Sounds