diff options
| -rwxr-xr-x | view/theme/diabook/communityhome.tpl | 34 | ||||
| -rw-r--r-- | view/theme/diabook/config.php | 21 | ||||
| -rw-r--r-- | view/theme/diabook/js/jquery.mapquery.mqZoomSlider.js | 85 | ||||
| -rw-r--r-- | view/theme/diabook/js/jquery.mousewheel.js | 84 | ||||
| -rwxr-xr-x | view/theme/diabook/theme.php | 63 | ||||
| -rw-r--r-- | view/theme/diabook/theme_settings.tpl | 6 |
6 files changed, 269 insertions, 24 deletions
diff --git a/view/theme/diabook/communityhome.tpl b/view/theme/diabook/communityhome.tpl index 1749181fc..eb4385722 100755 --- a/view/theme/diabook/communityhome.tpl +++ b/view/theme/diabook/communityhome.tpl @@ -8,6 +8,32 @@ </form> </div> +<div id="mapcontrol" style="display:none;"> +<form id="mapform" action="network" method="post" > +<span style="width: 500px;position: relative;float: right;right:20px;"><p>this ist still under development. +the idea is to provide a map with different layers(e.g. earth population, atomic power plants, wheat growing acreages, sunrise or what you want) +and markers(events, demos, friends, anything, that is intersting for you). +These layer and markers should be importable and deletable by the user.</p> +<p>help on this feature is very appreciated. i am not that good in js so it's a start, but needs tweaks and further dev. +just contact me, if you are intesrested in joining</p> +<p>http://localhost/friendica/profile/thomas</p> +<p>this is build with <b>mapquery</b> http://mapquery.org/ and +<b>openlayers</b>http://openlayers.org/</p> +</span> +<div id="map2" style="height:350px;width:350px;"></div> +<div id="mouseposition" style="width: 350px;"></div> +<div id="zoom"> +zoom:<input type="text" id="mapzoom" value=""></input> +</div> +{{inc field_input.tpl with $field=$ELZoom}}{{endinc}} +{{inc field_input.tpl with $field=$ELPosX}}{{endinc}} +{{inc field_input.tpl with $field=$ELPosY}}{{endinc}} +<div class="settings-submit-wrapper"> +<input id="mapsub" type="submit" value="$sub" class="settings-submit" name="diabook-settings-map-sub"></input> +</div> +</form> +</div> + <div id="pos_null" style="margin-bottom:-30px;"> </div> @@ -17,6 +43,7 @@ {{ if $page }} <div>$page</div> {{ endif }} +</div> <div id="close_profiles"> {{ if $comunity_profiles_title }} @@ -122,13 +149,6 @@ $nv.search <div id="map" style="height:165px;width:165px;margin-left:3px;margin-top:3px;margin-bottom:1px;"> </div> <div style="font-size:9px;margin-left:3px;">Data CC-By-SA by <a href="http://openstreetmap.org/">OpenStreetMap</a></div> -<div id="mapcontrol" style="display:none;"> -<div id="map2" style="height:350px;width:350px;"></div> -<div id="mouseposition" style="width: 350px;"></div> -<div id="zoom"></div> - -</div> -</div> {{ endif }} </div> </div>
\ No newline at end of file diff --git a/view/theme/diabook/config.php b/view/theme/diabook/config.php index e6c2681e3..40a539079 100644 --- a/view/theme/diabook/config.php +++ b/view/theme/diabook/config.php @@ -14,8 +14,11 @@ function theme_content(&$a){ $resolution = get_pconfig(local_user(), 'diabook', 'resolution' ); $color = get_pconfig(local_user(), 'diabook', 'color' ); $TSearchTerm = get_pconfig(local_user(), 'diabook', 'TSearchTerm' ); + $ELZoom = get_pconfig(local_user(), 'diabook', 'ELZoom' ); + $ELPosX = get_pconfig(local_user(), 'diabook', 'ELPosX' ); + $ELPosY = get_pconfig(local_user(), 'diabook', 'ELPosY' ); - return diabook_form($a,$font_size, $line_height, $resolution, $color, $TSearchTerm); + return diabook_form($a,$font_size, $line_height, $resolution, $color, $TSearchTerm, $ELZoom, $ELPosX, $ELPosY); } function theme_post(&$a){ @@ -28,6 +31,9 @@ function theme_post(&$a){ set_pconfig(local_user(), 'diabook', 'resolution', $_POST['diabook_resolution']); set_pconfig(local_user(), 'diabook', 'color', $_POST['diabook_color']); set_pconfig(local_user(), 'diabook', 'TSearchTerm', $_POST['diabook_TSearchTerm']); + set_pconfig(local_user(), 'diabook', 'ELZoom', $_POST['diabook_ELZoom']); + set_pconfig(local_user(), 'diabook', 'ELPosX', $_POST['diabook_ELPosX']); + set_pconfig(local_user(), 'diabook', 'ELPosY', $_POST['diabook_ELPosY']); } } @@ -38,8 +44,11 @@ function theme_admin(&$a){ $resolution = get_config('diabook', 'resolution' ); $color = get_config('diabook', 'color' ); $TSearchTerm = get_config('diabook', 'TSearchTerm' ); + $ELZoom = get_config('diabook', 'ELZoom' ); + $ELPosX = get_config('diabook', 'ELPosX' ); + $ELPosY = get_config('diabook', 'ELPosY' ); - return diabook_form($a,$font_size, $line_height, $resolution, $color, $TSearchTerm); + return diabook_form($a,$font_size, $line_height, $resolution, $color, $TSearchTerm, $ELZoom, $ELPosX, $ELPosY); } function theme_admin_post(&$a){ @@ -49,11 +58,14 @@ function theme_admin_post(&$a){ set_config('diabook', 'resolution', $_POST['diabook_resolution']); set_config('diabook', 'color', $_POST['diabook_color']); set_config('diabook', 'TSearchTerm', $_POST['diabook_TSearchTerm']); + set_config('diabook', 'ELZoom', $_POST['diabook_ELZoom']); + set_config('diabook', 'ELPosX', $_POST['diabook_ELPosX']); + set_config('diabook', 'ELPosY', $_POST['diabook_ELPosY']); } } -function diabook_form(&$a, $font_size, $line_height, $resolution, $color, $TSearchTerm){ +function diabook_form(&$a, $font_size, $line_height, $resolution, $color, $TSearchTerm, $ELZoom, $ELPosX, $ELPosY){ $line_heights = array( "1.3"=>"1.3", "---"=>"---", @@ -100,6 +112,9 @@ function diabook_form(&$a, $font_size, $line_height, $resolution, $color, $TSear '$resolution' => array('diabook_resolution', t('Set resolution for middle column'), $resolution, '', $resolutions), '$color' => array('diabook_color', t('Set color scheme'), $color, '', $colors), '$TSearchTerm' => array('diabook_TSearchTerm', t('Set twitter search term'), $TSearchTerm, '', $TSearchTerm), + '$ELZoom' => array('diabook_ELZoom', t('Set zoomfactor for Earth Layer'), $ELZoom, '', $ELZoom), + '$ELPosX' => array('diabook_ELPosX', t('Set longitude (X) for Earth Layer'), $ELPosX, '', $ELPosX), + '$ELPosY' => array('diabook_ELPosY', t('Set latitude (Y) for Earth Layer'), $ELPosY, '', $ELPosY), )); return $o; } diff --git a/view/theme/diabook/js/jquery.mapquery.mqZoomSlider.js b/view/theme/diabook/js/jquery.mapquery.mqZoomSlider.js new file mode 100644 index 000000000..ebdce3bf3 --- /dev/null +++ b/view/theme/diabook/js/jquery.mapquery.mqZoomSlider.js @@ -0,0 +1,85 @@ +/* Copyright (c) 2011 by MapQuery Contributors (see AUTHORS for + * full list of contributors). Published under the MIT license. + * See https://github.com/mapquery/mapquery/blob/master/LICENSE for the + * full text of the license. */ + + +/** +#jquery.mapquery.mqZoomSlider.js +The file containing the mqZoomSlider Widget + +### *$('selector')*.`mqZoomSlider([options])` +_version added 0.1_ +####**Description**: create a widget to show a zoom slider + + + **options**: + - **map**: the mapquery instance + +>Returns: widget + + +The mqZoomSlider widget allows us to display a vertical zoom slider. + + + $('#zoomslider').mqZoomSlider({ + map: '#map' + }); + + */ +(function($) { +$.template('mqZoomSlider', + '<div class="mq-zoomslider ui-widget ui-helper-clearfix ">'+ + '<div class="mq-zoomslider-slider"></div>'+ + '</div>'); + +$.widget("mapQuery.mqZoomSlider", { + options: { + // The MapQuery instance + map: undefined + + }, + _create: function() { + var map; + var zoom; + var numzoomlevels; + var self = this; + var element = this.element; + + //get the mapquery object + map = $(this.options.map).data('mapQuery'); + + $.tmpl('mqZoomSlider').appendTo(element); + + numzoomlevels = map.options.numZoomLevels; + $(".mq-zoomslider-slider", element).slider({ + max: numzoomlevels, + min:2, + orientation: 'vertical', + step: 1, + value: numzoomlevels - map.center().zoom, + slide: function(event, ui) { + map.center({zoom:numzoomlevels-ui.value}); + }, + change: function(event, ui) { + map.center({zoom:numzoomlevels-ui.value}); + } + }); + map.bind("zoomend", + {widget:self,map:map,control:element}, + self._onZoomEnd); + + }, + _destroy: function() { + this.element.removeClass(' ui-widget ui-helper-clearfix ' + + 'ui-corner-all') + .empty(); + }, + _zoomEnd: function (element,map) { + var slider = element.find('.mq-zoomslider-slider'); + slider.slider('value',map.options.numZoomLevels-map.center().zoom); + }, + _onZoomEnd: function(evt) { + evt.data.widget._zoomEnd(evt.data.control,evt.data.map); + } +}); +})(jQuery);
\ No newline at end of file diff --git a/view/theme/diabook/js/jquery.mousewheel.js b/view/theme/diabook/js/jquery.mousewheel.js new file mode 100644 index 000000000..f1d5f72fd --- /dev/null +++ b/view/theme/diabook/js/jquery.mousewheel.js @@ -0,0 +1,84 @@ +/*! Copyright (c) 2011 Brandon Aaron (http://brandonaaron.net) + * Licensed under the MIT License (LICENSE.txt). + * + * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers. + * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix. + * Thanks to: Seamus Leahy for adding deltaX and deltaY + * + * Version: 3.0.6 + * + * Requires: 1.2.2+ + */ + +(function($) { + +var types = ['DOMMouseScroll', 'mousewheel']; + +if ($.event.fixHooks) { + for ( var i=types.length; i; ) { + $.event.fixHooks[ types[--i] ] = $.event.mouseHooks; + } +} + +$.event.special.mousewheel = { + setup: function() { + if ( this.addEventListener ) { + for ( var i=types.length; i; ) { + this.addEventListener( types[--i], handler, false ); + } + } else { + this.onmousewheel = handler; + } + }, + + teardown: function() { + if ( this.removeEventListener ) { + for ( var i=types.length; i; ) { + this.removeEventListener( types[--i], handler, false ); + } + } else { + this.onmousewheel = null; + } + } +}; + +$.fn.extend({ + mousewheel: function(fn) { + return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel"); + }, + + unmousewheel: function(fn) { + return this.unbind("mousewheel", fn); + } +}); + + +function handler(event) { + var orgEvent = event || window.event, args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true, deltaX = 0, deltaY = 0; + event = $.event.fix(orgEvent); + event.type = "mousewheel"; + + // Old school scrollwheel delta + if ( orgEvent.wheelDelta ) { delta = orgEvent.wheelDelta/120; } + if ( orgEvent.detail ) { delta = -orgEvent.detail/3; } + + // New school multidimensional scroll (touchpads) deltas + deltaY = delta; + + // Gecko + if ( orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) { + deltaY = 0; + deltaX = -1*delta; + } + + // Webkit + if ( orgEvent.wheelDeltaY !== undefined ) { deltaY = orgEvent.wheelDeltaY/120; } + if ( orgEvent.wheelDeltaX !== undefined ) { deltaX = -1*orgEvent.wheelDeltaX/120; } + + // Add event and delta to the front of the arguments + args.unshift(event, delta, deltaX, deltaY); + + return ($.event.dispatch || $.event.handle).apply(this, args); +} + +})(jQuery);
\ No newline at end of file diff --git a/view/theme/diabook/theme.php b/view/theme/diabook/theme.php index f6c9dd7c1..dc9800343 100755 --- a/view/theme/diabook/theme.php +++ b/view/theme/diabook/theme.php @@ -3,7 +3,7 @@ /* * Name: Diabook * Description: Diabook: report bugs and request here: http://pad.toktan.org/p/diabook or contact me : thomas_bierey@friendica.eu - * Version: (Version: 1.025) + * Version: (Version: 1.026) * Author: */ @@ -13,7 +13,7 @@ $a = get_app(); function diabook_init(&$a) { //print diabook-version for debugging -$diabook_version = "Diabook (Version: 1.025)"; +$diabook_version = "Diabook (Version: 1.026)"; $a->page['htmlhead'] .= sprintf('<META NAME="theme" CONTENT="%s"/>', $diabook_version); //change css on network and profilepages @@ -114,7 +114,7 @@ if ($color=="dark") $color_path = "/diabook-dark/"; $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $imageresizeJS); //load jquery.ui.js - if($ccCookie != "9") { + if($ccCookie != "10") { $jqueryuiJS = $a->get_baseurl($ssl_state)."/view/theme/diabook/js/jquery-ui-1.8.20.custom.min.js"; $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $jqueryuiJS); } @@ -126,7 +126,7 @@ if ($color=="dark") $color_path = "/diabook-dark/"; } //load jquery.mapquery.js - $_COOKIE['close_mapquery'] = "1"; + if($_COOKIE['close_mapquery'] != "1") { $mqtmplJS = $a->get_baseurl($ssl_state)."/view/theme/diabook/js/jquery.tmpl.js"; $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $mqtmplJS); @@ -136,8 +136,8 @@ if ($color=="dark") $color_path = "/diabook-dark/"; $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $openlayersJS); $mqmouseposJS = $a->get_baseurl($ssl_state)."/view/theme/diabook/js/jquery.mapquery.mqMousePosition.js"; $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $mqmouseposJS); - $mqzoomsliderJS = $a->get_baseurl($ssl_state)."/view/theme/diabook/js/jquery.mapquery.mqZoomSlider.js"; - $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $mqzoomsliderJS); + $mousewheelJS = $a->get_baseurl($ssl_state)."/view/theme/diabook/js/jquery.mousewheel.js"; + $a->page['htmlhead'] .= sprintf('<script language="JavaScript" src="%s" ></script>', $mousewheelJS); } @@ -156,8 +156,23 @@ if ($color=="dark") $color_path = "/diabook-dark/"; }); </script>'; //check if mapquerybox is active and print - $_COOKIE['close_mapquery'] = "1"; + if($_COOKIE['close_mapquery'] != "1") { + $ELZoom=false; + $ELPosX=false; + $ELPosy=false; + $site_ELZoom = get_config("diabook", "ELZoom" ); + $site_ELPosX = get_config("diabook", "ELPosX" ); + $site_ELPosY = get_config("diabook", "ELPosY" ); + $ELZoom = get_pconfig(local_user(), "diabook", "ELZoom"); + $ELPosX = get_pconfig(local_user(), "diabook", "ELPosX"); + $ELPosY = get_pconfig(local_user(), "diabook", "ELPosY"); + if ($ELZoom===false) $ELZoom=$site_ELZoom; + if ($ELPosX===false) $ELPosX=$site_ELPosX; + if ($ELPosY===false) $ELPosY=$site_ELPosY; + if ($ELZoom===false) $ELZoom="0"; + if ($ELPosX===false) $ELPosX="0"; + if ($ELPosY===false) $ELPosY="0"; $a->page['htmlhead'] .= ' <script> @@ -166,7 +181,7 @@ if ($color=="dark") $color_path = "/diabook-dark/"; layers:[{ //add layers to your map; you need to define at least one to be able to see anything on the map type:"osm" //add a layer of the type osm (OpenStreetMap) }], - center:({zoom:8,position:[11.7,52.2]}), + center:({zoom:'.$ELZoom.',position:['.$ELPosX.','.$ELPosY.']}), }); }); @@ -174,7 +189,7 @@ if ($color=="dark") $color_path = "/diabook-dark/"; function open_mapcontrol() { $("div#mapcontrol").attr("style","display: block;width:900px;height:600px;"); $("#map2").mapQuery({layers:[{type:"osm"}], - center:({zoom:8,position:[11.7,52.2]})}); + center:({zoom:'.$ELZoom.',position:['.$ELPosX.','.$ELPosY.']})}); $("#mouseposition").mqMousePosition({ map: "#map2", @@ -185,8 +200,13 @@ if ($color=="dark") $color_path = "/diabook-dark/"; map = $("#map2").mapQuery().data("mapQuery"); - alert(map.center().zoom); - + textarea = document.getElementById("mapzoom"); + + + $("#map2").bind("mousewheel", function(event, delta) { + if (delta > 0 || delta < 0){ + textarea.value = map.center().zoom; } + }); }; </script>'; @@ -265,7 +285,7 @@ if ($color=="dark") $color_path = "/diabook-dark/"; }); </script>'; - if($ccCookie != "9") { + if($ccCookie != "10") { $a->page['htmlhead'] .= ' <script> $("right_aside").ready(function(){ @@ -576,11 +596,26 @@ if ($color=="dark") $color_path = "/diabook-dark/"; //END Community Page //mapquery - $_COOKIE['close_mapquery'] = "1"; + if($_COOKIE['close_mapquery'] != "1") { $mapquery = array(); - $mapquery['title'] = Array("", "<a id='mapcontrol-link' href='#mapcontrol' style='text-decoration:none;' onclick='open_mapcontrol(); return false;'>".t('Earth View')."</a>", "", ""); + $mapquery['title'] = Array("", "<a id='mapcontrol-link' href='#mapcontrol' style='text-decoration:none;' onclick='open_mapcontrol(); return false;'>".t('Earth Layers')."</a>", "", ""); $aside['$mapquery'] = $mapquery; + $ELZoom = get_pconfig(local_user(), 'diabook', 'ELZoom' ); + $ELPosX = get_pconfig(local_user(), 'diabook', 'ELPosX' ); + $ELPosY = get_pconfig(local_user(), 'diabook', 'ELPosY' ); + $aside['$sub'] = t('Submit'); + $aside['$ELZoom'] = array('diabook_ELZoom', t('Set zoomfactor for Earth Layer'), $ELZoom, '', $ELZoom); + $aside['$ELPosX'] = array('diabook_ELPosX', t('Set longitude (X) for Earth Layer'), $ELPosX, '', $ELPosX); + $aside['$ELPosY'] = array('diabook_ELPosY', t('Set latitude (Y) for Earth Layer'), $ELPosY, '', $ELPosY); + $baseurl = $a->get_baseurl($ssl_state); + $aside['$baseurl'] = $baseurl; + if (isset($_POST['diabook-settings-map-sub']) && $_POST['diabook-settings-map-sub']!=''){ + set_pconfig(local_user(), 'diabook', 'ELZoom', $_POST['diabook_ELZoom']); + set_pconfig(local_user(), 'diabook', 'ELPosX', $_POST['diabook_ELPosX']); + set_pconfig(local_user(), 'diabook', 'ELPosY', $_POST['diabook_ELPosY']); + header("Location: network"); + } } //end mapquery diff --git a/view/theme/diabook/theme_settings.tpl b/view/theme/diabook/theme_settings.tpl index d08f2819c..27122857c 100644 --- a/view/theme/diabook/theme_settings.tpl +++ b/view/theme/diabook/theme_settings.tpl @@ -8,6 +8,12 @@ {{inc field_input.tpl with $field=$TSearchTerm}}{{endinc}} +{{inc field_input.tpl with $field=$ELPosX}}{{endinc}} + +{{inc field_input.tpl with $field=$ELPosY}}{{endinc}} + +{{inc field_input.tpl with $field=$ELZoom}}{{endinc}} + <div class="field select"> <a onClick="restore_boxes()" title="Restore right-hand column" style="cursor: pointer;">Restore right-hand column</a> </div> |