Search Results

Search found 1524 results on 61 pages for 'styles'.

Page 61/61 | < Previous Page | 57 58 59 60 61 

• Asset Pipeline acting up

  - by Abram

  Ok, so my asset pipeline has suddenly started acting up on my development machine. JS functions that previously worked are now throwing "not a function" errors.. I know I must be doing something wrong. A minute ago the datatables jquery function was working, then it was throwing an error, then it was working, and now it's not working or throwing an error. Here is my application.js //= require jquery //= require jquery-ui //= require jquery_ujs //= require_self //= require_tree . //= require dataTables/jquery.dataTables //= require dataTables/jquery.dataTables.bootstrap //= require bootstrap //= require bootstrap-tooltip //= require bootstrap-popover //= require bootstrap-tab //= require bootstrap-modal //= require bootstrap-alert //= require bootstrap-dropdown //= require jquery.ui.addresspicker //= require raty //= require jquery.alphanumeric //= require jquery.formrestrict //= require select2 //= require chosen/chosen.jquery //= require highcharts //= require jquery.lazyload Here is some of my layout header: <%= stylesheet_link_tag "application", media: "all" %> <%= yield(:scripthead) %> <%= javascript_include_tag "application" %> <%= csrf_meta_tags %> <%= yield(:head) %> Above I am using the yield to load up online scripts from google as they're only needed on some pages, and generally slow down the site if included in the application layout. I tried removing the yield but things were still broken, even after clearing the browser cache and running rake assets:clean (just to be on the safe side). Here's what shows up between CSS and metatags (for a page with nothin in the yield scripthead): <script src="/assets/jquery.js?body=1" type="text/javascript"></script> <script src="/assets/jquery-ui.js?body=1" type="text/javascript"></script> <script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script> <script src="/assets/application.js?body=1" type="text/javascript"></script> <script src="/assets/aidmodels.js?body=1" type="text/javascript"></script> <script src="/assets/audio.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-alert.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-dropdown.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-modal.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-popover.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-tab.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-tooltip.js?body=1" type="text/javascript"></script> <script src="/assets/branches.js?body=1" type="text/javascript"></script> <script src="/assets/charts.js?body=1" type="text/javascript"></script> <script src="/assets/chosen/backup_chosen.jquery.js?body=1" type="text/javascript"></script> <script src="/assets/chosen/chosen.jquery.js?body=1" type="text/javascript"></script> <script src="/assets/consumers.js?body=1" type="text/javascript"></script> <script src="/assets/dispensers.js?body=1" type="text/javascript"></script> <script src="/assets/favorites.js?body=1" type="text/javascript"></script> <script src="/assets/features.js?body=1" type="text/javascript"></script> <script src="/assets/generic_styles.js?body=1" type="text/javascript"></script> <script src="/assets/gmaps4rails/gmaps4rails.base.js?body=1" type="text/javascript"></script> <script src="/assets/gmaps4rails/gmaps4rails.bing.js?body=1" type="text/javascript"></script> <script src="/assets/gmaps4rails/gmaps4rails.googlemaps.js?body=1" type="text/javascript"></script> <script src="/assets/gmaps4rails/gmaps4rails.mapquest.js?body=1" type="text/javascript"></script> <script src="/assets/gmaps4rails/gmaps4rails.openlayers.js?body=1" type="text/javascript"></script> <script src="/assets/highcharts.js?body=1" type="text/javascript"></script> <script src="/assets/jquery-ui-1.8.18.custom.min.js?body=1" type="text/javascript"></script> <script src="/assets/jquery.alphanumeric.js?body=1" type="text/javascript"></script> <script src="/assets/jquery.formrestrict.js?body=1" type="text/javascript"></script> <script src="/assets/jquery.lazyload.js?body=1" type="text/javascript"></script> <script src="/assets/jquery.ui.addresspicker.js?body=1" type="text/javascript"></script> <script src="/assets/likes.js?body=1" type="text/javascript"></script> <script src="/assets/messages.js?body=1" type="text/javascript"></script> <script src="/assets/overalls.js?body=1" type="text/javascript"></script> <script src="/assets/pages.js?body=1" type="text/javascript"></script> <script src="/assets/questions.js?body=1" type="text/javascript"></script> <script src="/assets/raty.js?body=1" type="text/javascript"></script> <script src="/assets/reviews.js?body=1" type="text/javascript"></script> <script src="/assets/sessions.js?body=1" type="text/javascript"></script> <script src="/assets/styles.js?body=1" type="text/javascript"></script> <script src="/assets/tickets.js?body=1" type="text/javascript"></script> <script src="/assets/universities.js?body=1" type="text/javascript"></script> <script src="/assets/users.js?body=1" type="text/javascript"></script> <script src="/assets/dataTables/jquery.dataTables.js?body=1" type="text/javascript"></script> <script src="/assets/dataTables/jquery.dataTables.bootstrap.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-transition.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-affix.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-button.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-carousel.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-collapse.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-scrollspy.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap-typeahead.js?body=1" type="text/javascript"></script> <script src="/assets/bootstrap.js?body=1" type="text/javascript"></script> <script src="/assets/select2.js?body=1" type="text/javascript"></script> From application.rb: config.assets.initialize_on_precompile = false # Enable the asset pipeline config.assets.enabled = true config.action_controller.assets_dir = "#{File.dirname(File.dirname(__FILE__))}/public" # Version of your assets, change this if you want to expire all your assets config.assets.version = '1.0' I'm sorry, I'm not sure what else to include to help with this puzzle, but any advise would be appreciated. I was having no problems before I started trying to upload to heroku and now everything's gone haywire. EDIT: In the console at the moment I'm seeing Uncaught TypeError: Cannot read property 'Constructor' of undefined bootstrap-popover.js:33 Uncaught ReferenceError: google is not defined jquery.ui.addresspicker.js:25 Uncaught TypeError: Object [object Object] has no method 'popover' overall:476

  Read the article

• Passing XML markers to Google Map

  - by djmadscribbler

  I've been creating a V3 Google map based on this example from Mike Williams http://www.geocodezip.com/v3_MW_example_map3.html I've run into a bit of a problem though. If I have no parameters in my URL then I get the error "id is undefined idmarkers [id.toLowerCase()] = marker;" in Firebug and only one marker will show up. If I have a parameter (?id=105 for example) then all the sidebar links say 105 (or whatever the parameter in the URL was) instead of their respective label as listed in the XML file and a random infowindow will be opened instead of the window for the id in the URL. Here is my javascript: var map = null; var lastmarker = null; // ========== Read paramaters that have been passed in ========== // Before we go looking for the passed parameters, set some defaults // in case there are no parameters var id; var index = -1; // these set the initial center, zoom and maptype for the map // if it is not specified in the query string var lat = 42.194741; var lng = -121.700301; var zoom = 18; var maptype = google.maps.MapTypeId.HYBRID; function MapTypeId2UrlValue(maptype) { var urlValue = 'm'; switch (maptype) { case google.maps.MapTypeId.HYBRID: urlValue = 'h'; break; case google.maps.MapTypeId.SATELLITE: urlValue = 'k'; break; case google.maps.MapTypeId.TERRAIN: urlValue = 't'; break; default: case google.maps.MapTypeId.ROADMAP: urlValue = 'm'; break; } return urlValue; } // If there are any parameters at eh end of the URL, they will be in location.search // looking something like "?marker=3" // skip the first character, we are not interested in the "?" var query = location.search.substring(1); // split the rest at each "&" character to give a list of "argname=value" pairs var pairs = query.split("&"); for (var i = 0; i < pairs.length; i++) { // break each pair at the first "=" to obtain the argname and value var pos = pairs[i].indexOf("="); var argname = pairs[i].substring(0, pos).toLowerCase(); var value = pairs[i].substring(pos + 1).toLowerCase(); // process each possible argname - use unescape() if theres any chance of spaces if (argname == "id") { id = unescape(value); } if (argname == "marker") { index = parseFloat(value); } if (argname == "lat") { lat = parseFloat(value); } if (argname == "lng") { lng = parseFloat(value); } if (argname == "zoom") { zoom = parseInt(value); } if (argname == "type") { // from the v3 documentation 8/24/2010 // HYBRID This map type displays a transparent layer of major streets on satellite images. // ROADMAP This map type displays a normal street map. // SATELLITE This map type displays satellite images. // TERRAIN This map type displays maps with physical features such as terrain and vegetation. if (value == "m") { maptype = google.maps.MapTypeId.ROADMAP; } if (value == "k") { maptype = google.maps.MapTypeId.SATELLITE; } if (value == "h") { maptype = google.maps.MapTypeId.HYBRID; } if (value == "t") { maptype = google.maps.MapTypeId.TERRAIN; } } } // this variable will collect the html which will eventually be placed in the side_bar var side_bar_html = ""; // arrays to hold copies of the markers and html used by the side_bar // because the function closure trick doesnt work there var gmarkers = []; var idmarkers = []; // global "map" variable var map = null; // A function to create the marker and set up the event window function function createMarker(point, icon, label, html) { var contentString = html; var marker = new google.maps.Marker({ position: point, map: map, title: label, icon: icon, zIndex: Math.round(point.lat() * -100000) << 5 }); marker.id = id; marker.index = gmarkers.length; google.maps.event.addListener(marker, 'click', function () { lastmarker = new Object; lastmarker.id = marker.id; lastmarker.index = marker.index; infowindow.setContent(contentString); infowindow.open(map, marker); }); // save the info we need to use later for the side_bar gmarkers.push(marker); idmarkers[id.toLowerCase()] = marker; // add a line to the side_bar html side_bar_html += '<a href="javascript:myclick(' + (gmarkers.length - 1) + ')">' + id + '<\/a><br>'; } // This function picks up the click and opens the corresponding info window function myclick(i) { google.maps.event.trigger(gmarkers[i], "click"); } function makeLink() { var mapinfo = "lat=" + map.getCenter().lat().toFixed(6) + "&lng=" + map.getCenter().lng().toFixed(6) + "&zoom=" + map.getZoom() + "&type=" + MapTypeId2UrlValue(map.getMapTypeId()); if (lastmarker) { var a = "/about/map/default.aspx?id=" + lastmarker.id + "&" + mapinfo; var b = "/about/map/default.aspx?marker=" + lastmarker.index + "&" + mapinfo; } else { var a = "/about/map/default.aspx?" + mapinfo; var b = a; } document.getElementById("idlink").innerHTML = '<a href="' + a + '" id=url target=_new>- Link directly to this page by id</a> (id in xml file also entry &quot;name&quot; in sidebar menu)'; document.getElementById("indexlink").innerHTML = '<a href="' + b + '" id=url target=_new>- Link directly to this page by index</a> (position in gmarkers array)'; } function initialize() { // create the map var myOptions = { zoom: zoom, center: new google.maps.LatLng(lat, lng), mapTypeId: maptype, mapTypeControlOptions: { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU }, navigationControl: true, mapTypeId: google.maps.MapTypeId.HYBRID }; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var stylesarray = [ { featureType: "poi", elementType: "labels", stylers: [ { visibility: "off" } ] }, { featureType: "landscape.man_made", elementType: "labels", stylers: [ { visibility: "off" } ] } ]; var options = map.setOptions({ styles: stylesarray }); // Make the link the first time when the page opens makeLink(); // Make the link again whenever the map changes google.maps.event.addListener(map, 'maptypeid_changed', makeLink); google.maps.event.addListener(map, 'center_changed', makeLink); google.maps.event.addListener(map, 'bounds_changed', makeLink); google.maps.event.addListener(map, 'zoom_changed', makeLink); google.maps.event.addListener(map, 'click', function () { lastmarker = null; makeLink(); infowindow.close(); }); // Read the data from example.xml downloadUrl("example.xml", function (doc) { var xmlDoc = xmlParse(doc); var markers = xmlDoc.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { // obtain the attribues of each marker var lat = parseFloat(markers[i].getAttribute("lat")); var lng = parseFloat(markers[i].getAttribute("lng")); var point = new google.maps.LatLng(lat, lng); var html = markers[i].getAttribute("html"); var label = markers[i].getAttribute("label"); var icon = markers[i].getAttribute("icon"); // create the marker var marker = createMarker(point, icon, label, html); } // put the assembled side_bar_html contents into the side_bar div document.getElementById("side_bar").innerHTML = side_bar_html; // ========= If a parameter was passed, open the info window ========== if (id) { if (idmarkers[id]) { google.maps.event.trigger(idmarkers[id], "click"); } else { alert("id " + id + " does not match any marker"); } } if (index > -1) { if (index < gmarkers.length) { google.maps.event.trigger(gmarkers[index], "click"); } else { alert("marker " + index + " does not exist"); } } }); } var infowindow = new google.maps.InfoWindow( { size: new google.maps.Size(150, 50) }); google.maps.event.addDomListener(window, "load", initialize); And here is an example of my XML formatting <marker lat="42.196175" lng="-121.699224" html="This is the information about 104" iconimage="/about/map/images/104.png" label="104" />

  Read the article

• How to customize and reuse a DataGridColumnHeader style?

  - by instcode

  Hi all, I'm trying to customize the column headers of a DataGrid to show sub-column headers as in the following screenshot: I've made a style for 2 sub-column as in the following XAML: <UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" xmlns:primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data" xmlns:sl="clr-namespace:UI" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" x:Class="UI.ColumnHeaderGrid" mc:Ignorable="d"> <UserControl.Resources> <Style x:Key="SplitColumnHeaderStyle" TargetType="primitives:DataGridColumnHeader"> <Setter Property="Foreground" Value="#FF000000"/> <Setter Property="HorizontalContentAlignment" Value="Center"/> <Setter Property="VerticalContentAlignment" Value="Center"/> <Setter Property="IsTabStop" Value="False"/> <Setter Property="SeparatorBrush" Value="#FFC9CACA"/> <Setter Property="Padding" Value="4"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="primitives:DataGridColumnHeader"> <Grid x:Name="Root"> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <Rectangle x:Name="BackgroundRectangle" Fill="#FF1F3B53" Stretch="Fill" Grid.ColumnSpan="2"/> <Rectangle x:Name="BackgroundGradient" Stretch="Fill" Grid.ColumnSpan="2"> <Rectangle.Fill> <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"> <GradientStop Color="#FCFFFFFF" Offset="0.015"/> <GradientStop Color="#F7FFFFFF" Offset="0.375"/> <GradientStop Color="#E5FFFFFF" Offset="0.6"/> <GradientStop Color="#D1FFFFFF" Offset="1"/> </LinearGradientBrush> </Rectangle.Fill> </Rectangle> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition Width="1"/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition/> <RowDefinition/> </Grid.RowDefinitions> <TextBlock Grid.Row="0" Grid.ColumnSpan="3" Text="Headers" TextAlignment="Center"/> <Rectangle Grid.Row="1" Grid.ColumnSpan="3" Fill="{TemplateBinding SeparatorBrush}" Height="1"/> <TextBlock Grid.Row="2" Grid.Column="0" Text="Header 1" TextAlignment="Center"/> <Rectangle Grid.Row="2" Grid.Column="1" Fill="{TemplateBinding SeparatorBrush}" Width="1"/> <TextBlock Grid.Row="2" Grid.Column="2" Text="Header 2" TextAlignment="Center"/> <Path x:Name="SortIcon" Grid.Column="2" Fill="#FF444444" Stretch="Uniform" HorizontalAlignment="Left" Margin="4,0,0,0" VerticalAlignment="Center" Width="8" Opacity="0" RenderTransformOrigin=".5,.5" Data="F1 M -5.215,6.099L 5.215,6.099L 0,0L -5.215,6.099 Z "/> </Grid> <Rectangle x:Name="VerticalSeparator" Fill="{TemplateBinding SeparatorBrush}" VerticalAlignment="Stretch" Width="1" Visibility="{TemplateBinding SeparatorVisibility}" Grid.Column="1"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Resources> <data:DataGrid x:Name="LayoutRoot"> <data:DataGrid.Columns> <data:DataGridTemplateColumn HeaderStyle="{StaticResource SplitColumnHeaderStyle}"> <data:DataGridTemplateColumn.CellTemplate> <DataTemplate> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Border Grid.Column="0" BorderBrush="#FFC9CACA" BorderThickness="0,0,0,0"> <TextBlock Grid.Column="0" Text="{Binding GridData.Column1}"/> </Border> <Border Grid.Column="1" BorderBrush="#FFC9CACA" BorderThickness="1,0,0,0"> <TextBlock Grid.Column="0" Text="{Binding GridData.Column2}"/> </Border> </Grid> </DataTemplate> </data:DataGridTemplateColumn.CellTemplate> </data:DataGridTemplateColumn> </data:DataGrid.Columns> </data:DataGrid> Now I want to reuse & extend this style to support 2-6 sub-column headers but I don't know if there is a way to do this, like ContentPresenter "overriding": <Style x:Key="SplitColumnHeaderStyle" TargetType="primitives:DataGridColumnHeader"> <Setter property="Template"> <Setter.Value> ... <ContentPresenter Content="{TemplateBinding Content}".../> ... </Setter.Value> </Setter> </Style> <Style x:Key="TwoSubColumnHeaderStyle" BasedOn="SplitColumnHeaderStyle"> <Setter property="Content"> <Setter.Value> <Grid 2x2.../> </Setter.Value> </Setter> </Style> <Style x:Key="ThreeSubColumnHeaderStyle" BasedOn="SplitColumnHeaderStyle"> <Setter property="Content"> <Setter.Value> <Grid 2x3.../> </Setter.Value> </Setter> </Style> Anyway, please help me on these issues: Given the template above, how to support more sub-column headers without having to create new new new new template for each? Assume that the issue above is solved. How could I attach column names outside the styles? I see that some parts, properties & visualization rules in the XAML are just copies from the original Silverlight component's style, i.e. BackgroundGradient, BackgroundRectangle, VisualStateManager... They must be there in order to support default behaviors or effects but... does anyone know how to remove them, but keep all the default behaviors/effects? Please be specific because I'm just getting start with C# & Silverlight. Thanks.

  Read the article

• How to find an entry-level job after you already have a graduate degree?

  - by Uri

  Note: I asked this question in early 2009. A couple of months later, I found a great job. I've previously updated this question with some tips for whoever ends up in a similar situation, and now cleaned it up a little for the benefit of the fresh batch of graduates. Original post: In my early 20s I abandoned a great C++ development career path in a major company to go to graduate school and get a research masters (3 years). I did another year in industrial research, and then moved to the US to attend graduate school again, getting another masters and a Ph.D in software engineering from a top school (another 6 years down the drain). I was coding the whole way throughout my degrees (core Java and Eclipse plug-ins) and working on research related to software engineering (usability of APIs). I ended up graduating the year of the recession, with a son on the way and the prospects of no healthcare. Academic jobs and industrial research jobs are quite scarce. Initially, I was naive, thinking that with my background, I could easily find a coding job. Big mistake. It turns out that I'm in a complicated position. Entry level positions are usually offered to college undergraduates. I attended my school's career fairs, but you could immediately see signs of Ph.D. aversion and overqualification issues. Some of the recruiters I spoke with explicitly told me that they wanted 20 year olds with clean slates, and some were looking for interns since they are in various forms of hiring freezes. I managed to get a couple of interviews from these career fairs and through recruiters. However, since I've been out of school for a long time and programming primarily in Java, I am also no longer proficient in C/C++ and the usual range of college-level interview questions that everyone uses. I had no problems with this when I was 19 and interviewing for my first job since a lot of what you do in C is manipulate pointers and I was coding C++ for fun and for school. Later I was routinely doing pointer manipulation on the job, and during my first masters taught college courses with data structures and C++. But even though I remember many properties of C++ well, it's been close to ten years since I regularly used C++ and pointers. As a Java developer I rarely had to work at this level, but experience in OOD and in writing good maintainable code is meaningless for C++ interviews. Reading books as a refresh and looking at sample code did not do the trick. I also looked at mid-to-senior level Java positions, but most of them focused on J2EE APIs rather than on core Java and required a certain number of years in industrial positions. Coding research tools and prior C++ experience doesn't count. So that sends me back to entry-level jobs that are posted through job-boards, and these are not common (mostly they are Monster junk), and small companies are even less likely to answer a Ph.D. compared to the giants who participate in top-10 career fairs. Even worse, in many companies initial screening is done by HR folks who really don't want to deal with anything anomalous like a Ph.D. Any tips on how I should approach this intractable position? For example, what should I write in cover letters? Note that while immigration is not an issue for me, I cannot go freelance as I need the benefits (and in particular group health insurance). During my studies I had no time to contribute to open-source projects or maintain a popular blog, so even if I invested in that now there would be no immediate benefit. Updates: In the two months after posting this I received several offers to work as a core Java developer in the financial industry and accepted one from a firm where I am working to this day. For those who find themselves in similar situations, here are my tips: Give up on trying to find an entry level positions. You can't undo time. Accept the fact that there is Ph.D. discrimination in the job market (some might say rightfully so). It is legal to discriminate based on education. No point fighting it. The most important tip is to focus on the language you are comfortable with. The sad truth about programming in a particular language is that it is not like riding a bike. If you haven't used a language in the last few years, and can't actually apply it routinely (not just as a refresher) before you start your search, it is going to be very difficult to do well in an interview. Now that I'm interviewing others, I routinely see it in folks with a mixed C++/Java background. We maintain "a shadow" of the old language but end up with a weird mix that makes it hard to interview on either. Entry-level folks are at an advantage here since they usually have one language. Memory can help you do great in a screening interview, but without recent day-to-day experience, code tests will be difficult. Despite the supposed relation, core Java programming and J2EE programming are two different things with different skillsets. If you come from academia, you likely have very little J2EE experience and may find it hard to get accepted for a J2EE job. J2EE jobs seem to have a larger list of acronyms in their requirements. In addition, from interviewing J2EE developers it seems that for many there is a focus on mastering specific APIs and architectures, whereas core Java development tends to be secondary. In the same way that I can no longer manipulate pointers well, a J2EE developer may have difficulties doing low level Java manipulation. This puts you at a relative advantage in competing for core Java jobs! If you are able to work for startups (in terms of family life and stability) or migrate to startup-rich areas such as the west coast, you can find many exciting opportunities where advanced degrees are a benefit. I've since been approached by several startups, although I had to decline. Work through a recruiter if possible. They have direct contacts with the hiring parties, allowing you to "stand out". It is better to get a clear yes/no confirmation from a recruiter on whether a company might be interested in interviewing you, than it is to send your resume and hope that someone will ever see it. Recruiters are also a great way of bypassing HR. However, also beware of recruiters. They have a vested interest and will go to various shady practices and pressure tactics. To find a good recruiter, talk to a friend who declined a job offer he got through a recruiter. A good recruiter, to me, is measured in how they handle that. Interview for the jobs that require your core strength. If you're rusty or entirely unfamiliar with a technology around which the job revolves, you're probably not a good match. Yes, you probably have the talent to master them, but most companies would want "instant gratification". I got my offers from companies that wanted core Java developer. I didn't do well on places that wanted advance C++ because I am too rusty and not up to date on recent libraries. I also didn't hear from companies that wanted lots of J2EE experience, and that's ok. Finding companies that want core Java without web is harder, but exists in specific industries (e.g., finance, defense). This requires a lot more legwork in terms of search, but these jobs do exist. There are different interview styles. Some companies focus on puzzles, some companies focus on algorithms, and some companies focus on design and coding skills. I had the most success in places where the questions were the most related to the function I would have been performing. Pick companies accordingly as well.

  Read the article

• $_GET['page'] loading content incorrectly

  - by s32ialx

  OK so here is my previous post PHP Templated Site w/ file_get_content links now i got that issue resolved BUT the problem is now that the content loads it displays UNDER the div i placed #CONTENT# inside so the styles are being ignored and it's posting #CONTENT# outside the divs at positions 0,0 any suggestions? Found out whats happening by using "View Source" seems that it's putting all of the #CONTENT#, content that's being loaded in front of the tag. Like this <doctype...> <div class="home"> blah blah </div> <head> <script src=""></script> </head> <body> <div class="header"></div> <div class="contents"> #CONTENT# < where content SHOULD load </div> <div class="footer"></div> </body> so anyone got a fix? OK so a better description I'll add relevant screen-shots Whats happening is /* file.class.php */ <?php $file = new file(); class file{ var $path = "templates/clean"; var $ext = "tpl"; function loadfile($filename){ return file_get_contents($this->path . "/" . $filename . "." . $this->ext); } function css($val,$content='',$contentvar='#CSS#') { if(is_array($val)) { $css = 'style="'; foreach($val as $p) { $css .= $p . ";"; } $css .= '"'; } else { $css = 'style="' . $val . '"'; } if($content!='') { return str_replace($contentvar,' ' . $css,$content); } else { return $css; } } function setsize($content,$width='-1',$height='-1',$border='-1'){ $css = ''; if($width!='-1') { $css = $css . "width=\"".$width."\""; } if($height!='-1') { $css = $css . "height=\"".$height."\""; } if($border!='-1') { $css = $css . "border=\"" . $border . "\""; } return str_replace('#SIZE#',' ' . $css,$content); } function setcontent($content,$newcontent,$vartoreplace='#CONTENT#'){ $val = str_replace($vartoreplace,$newcontent,$content); return $val; } function p($content) { $v = $content; $v = str_replace('#CONTENT#','',$v); $v = str_replace('#SIZE#','',$v); print $v; } } if (isset($_GET['page'])) { $content = $_GET['page'].'.php'; } else { $content = 'main.php'; } ?> is calling for a file_get_contents at the bottom which I use in /* index.php */ <?php include('classes/file.class.php'); // load the templates $header = $file->loadfile('header'); $body = $file->loadfile('body'); $footer = $file->loadfile('footer'); // fill body.tpl #CONTENT# slot with $content $body = $file->setcontent($body, $content); // cleanup and output the full page $file->p($header . $body . $footer); ?> and loads into /* body.tpl */ <div id="bodys"> <div id="bodt"></div> <div id="bodm"> <div id="contents"> #CONTENT# </div> </div> <div id="bodb"></div> </div> but the issue is as follows the $content loads properly img tags etc <h2> tags etc but CSS styling is TOTALY ignored for position width z-index etc. and as follows here's the screen-shot JUST incase you require the css for where $content is being loaded #bodys { top:91px; position:absolute; width:100%; } #bodt { margin-left:auto; margin-right:auto; top:3px; position:relative; width:820px; height:42px; background-image:url('images/pagetop.png'); background-repeat:no-repeat; z-index: 0; } #bodm { margin-left:auto; margin-right:auto; top:3px; position:relative; width:820px; background-image:url('images/pagemid.png'); background-repeat:repeat-y; z-index: 0; } #bodb { margin-left:auto; margin-right:auto; bottom:-42px; position:relative; width:820px; height:42px; background-image:url('images/pagebot.png'); background-repeat:no-repeat; z-index:-1; } #menuo { position:absolute; bottom:-2px; z-index:199; } #contents { position:relative; top:5px; left:25px; width:770px; z-index:10; overflow: auto; color: #000000; line-height: 1.3em; font-size: 12px; } #content { position:absolute; top:5px; left:25px; width:760px; z-index:1; color: #000000; line-height: 1.3em; font-size: 12px; } #contents p{ margin-bottom: 0.7em; } #contents a{ font-weight:bold; color: #6fa5fd; border-bottom: 1px dotted #6fa5fd; }

  Read the article

• Grid overlayed on image using javascript, need help getting grid coordinates.

  - by Alos

  Hi I am fairly new to javascript and could use some help, I am trying to overlay a grid on top of an image and then be able to have the user click on the grid and get the grid coordinate from the box that the user clicked. I have been working with the code from the following stackoverflow question: Creating a grid overlay over image. link text Here is the code that I have so far: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> </script> <script type="text/javascript"> var SetGrid = function(el, sz, nr, nc){ //get number of rows/columns according to the 'grid' size //numcols = el.getSize().x/sz; //numrows = el.getSize().y/sz; numcols = 48; numrows = 32; //create table element for injecting cols/rows var gridTable = new Element('table', { 'id' : 'gridTable', 'styles' : { 'width' : el.getSize().x, 'height' : el.getSize().y, 'top' : el.getCoordinates().top, 'left' : el.getCoordinates().left } }); //inject rows/cols into gridTable for (row = 1; row<=numrows; row++){ thisRow = new Element('tr', { 'id' : row, 'class' : 'gridRow' }); for(col = 1; col<=numcols; col++){ thisCol = new Element('td', { 'id' : col, 'class' : 'gridCol0' }); //each cell gets down/up over event... down starts dragging|up stops|over draws area if down was fired thisCol.addEvents({ 'mousedown' : function(){ dragFlag = true; startRow = this.getParent().get('id'); startCol = this.get('id'); }, 'mouseup' : function(){ dragFlag = false; }, 'mouseover' : function(){ if (dragFlag==true){ this.set('class', 'gridCol'+$$('#lvlSelect .on').get('value')); } }, 'click' : function(){ //this.set('class', 'gridCol'+$$('#lvlSelect .on').get('id').substr(3, 1) ); str = $$('#lvlSelect .on').get('id'); alert(str.substr(2, 3)); } }); thisCol.inject(thisRow, 'bottom'); }; thisRow.inject(gridTable, 'bottom'); }; gridTable.inject(el.getParent()); } //sens level selector func var SetSensitivitySelector = function(el, sz, nr, nc){ $$('#lvlSelect ul li').each(function(el){ el.addEvents({ 'click' : function(){ $$('#lvlSelect ul li').set('class', ''); this.set('class', 'on'); }, 'mouseover' : function(){ el.setStyle('cursor','pointer'); }, 'mouseout' : function(){ el.setStyle('cursor',''); } }); }); } //execute window.addEvent('load', function(){ SetGrid($('imagetomap'), 32); SetSensitivitySelector(); }); var gridSize = { x: 48, y: 32 }; var img = document.getElementById('imagetomap'); img.onclick = function(e) { if (!e) e = window.event; alert(Math.floor(e.offsetX/ gridSize.x) + ', ' + Math.floor(e.offsetY / gridSize.y)); } </script> <style> #imagetomapdiv { float:left; display: block; } #gridTable { border:1px solid red; border-collapse:collapse; position:absolute; z-index:5; } #gridTable td { opacity:0.2; filter:alpha(opacity=20); } #gridTable .gridCol0 { border:1px solid gray; background-color: none; } #gridTable .gridCol1 { border:1px solid gray; background-color: green; } #gridTable .gridCol2 { border:1px solid gray; background-color: blue; } #gridTable .gridCol3 { border:1px solid gray; background-color: yellow; } #gridTable .gridCol4 { border:1px solid gray; background-color: orange; } #gridTable .gridCol5 { border:1px solid gray; background-color: red; } #lvlSelect ul {float: left; display:block; position:relative; margin-left: 20px; padding: 10px; } #lvlSelect ul li { width:40px; text-align:center; display:block; border:1px solid black; position:relative; padding: 10px; list-style:none; opacity:0.2; filter:alpha(opacity=20); } #lvlSelect ul li.on { opacity:1; filter:alpha(opacity=100); } #lvlSelect ul #li0 { background-color: none; } #lvlSelect ul #li1 { background-color: green; } #lvlSelect ul #li2 { background-color: blue; } #lvlSelect ul #li3 { background-color: yellow; } #lvlSelect ul #li4 { background-color: orange; } #lvlSelect ul #li5 { background-color: red; } </style> </div> <div id="lvlSelect"> <ul> <li value="0" id="li0">0</li> <li value="1" id="li1">1</li> <li value="2" id="li2">2</li> <li value="3" id="li3">3</li> <li value="4" id="li4">4</li> <li value="5" id="li5" class="on">5</li> </ul> </div> In this example the grid box changes color when the image is grid box is clicked, but I would like to be able to have the coordinates of the box. Any help would be great. Thank you

  Read the article

• Creating a grid overlay over image.

  - by neteus

  Hi everybody, I made a script (using mootools library) that is supposed to overlay an image with a table grid and when each grid cell is clicked/dragged over its background color changes 'highlighting' the cell. Current code creates a table and positions it over the element (el, image in this case). Table was used since I am planning to add rectangle select tool later on, and it seemed easiest way to do it. <html> <head> <title></title> <script type="text/javascript" src="mootools.js"></script> <script type="text/javascript"> var SetGrid = function(el, sz, nr, nc){ //get number of rows/columns according to the 'grid' size numcols = el.getSize().x/sz; numrows = el.getSize().y/sz; //create table element for injecting cols/rows var gridTable = new Element('table', { 'id' : 'gridTable', 'styles' : { 'width' : el.getSize().x, 'height' : el.getSize().y, 'top' : el.getCoordinates().top, 'left' : el.getCoordinates().left } }); //inject rows/cols into gridTable for (row = 1; row<=numrows; row++){ thisRow = new Element('tr', { 'id' : row, 'class' : 'gridRow' }); for(col = 1; col<=numcols; col++){ thisCol = new Element('td', { 'id' : col, 'class' : 'gridCol0' }); //each cell gets down/up over event... down starts dragging|up stops|over draws area if down was fired thisCol.addEvents({ 'mousedown' : function(){ dragFlag = true; startRow = this.getParent().get('id'); startCol = this.get('id'); }, 'mouseup' : function(){ dragFlag = false; }, 'mouseover' : function(){ if (dragFlag==true){ this.set('class', 'gridCol'+$$('#lvlSelect .on').get('value')); } }, 'click' : function(){ //this.set('class', 'gridCol'+$$('#lvlSelect .on').get('id').substr(3, 1) ); str = $$('#lvlSelect .on').get('id'); alert(str.substr(2, 3)); } }); thisCol.inject(thisRow, 'bottom'); }; thisRow.inject(gridTable, 'bottom'); }; gridTable.inject(el.getParent()); } //sens level selector func var SetSensitivitySelector = function(el, sz, nr, nc){ $$('#lvlSelect ul li').each(function(el){ el.addEvents({ 'click' : function(){ $$('#lvlSelect ul li').set('class', ''); this.set('class', 'on'); }, 'mouseover' : function(){ el.setStyle('cursor','pointer'); }, 'mouseout' : function(){ el.setStyle('cursor',''); } }); }); } //execute window.addEvent('load', function(){ SetGrid($('imagetomap'), 32); SetSensitivitySelector(); }); </script> <style> #imagetomapdiv { float:left; display: block; } #gridTable { border:1px solid red; border-collapse:collapse; position:absolute; z-index:5; } #gridTable td { opacity:0.2; filter:alpha(opacity=20); } #gridTable .gridCol0 { border:1px solid gray; background-color: none; } #gridTable .gridCol1 { border:1px solid gray; background-color: green; } #gridTable .gridCol2 { border:1px solid gray; background-color: blue; } #gridTable .gridCol3 { border:1px solid gray; background-color: yellow; } #gridTable .gridCol4 { border:1px solid gray; background-color: orange; } #gridTable .gridCol5 { border:1px solid gray; background-color: red; } #lvlSelect ul {float: left; display:block; position:relative; margin-left: 20px; padding: 10px; } #lvlSelect ul li { width:40px; text-align:center; display:block; border:1px solid black; position:relative; padding: 10px; list-style:none; opacity:0.2; filter:alpha(opacity=20); } #lvlSelect ul li.on { opacity:1; filter:alpha(opacity=100); } #lvlSelect ul #li0 { background-color: none; } #lvlSelect ul #li1 { background-color: green; } #lvlSelect ul #li2 { background-color: blue; } #lvlSelect ul #li3 { background-color: yellow; } #lvlSelect ul #li4 { background-color: orange; } #lvlSelect ul #li5 { background-color: red; } </style> </head> <body> <div id="imagetomapdiv"> <img id="imagetomap" src="1.png"> </div> <div id="lvlSelect"> <ul> <li value="0" id="li0">0</li> <li value="1" id="li1">1</li> <li value="2" id="li2">2</li> <li value="3" id="li3">3</li> <li value="4" id="li4">4</li> <li value="5" id="li5" class="on">5</li> </ul> </div> </body> </html> A 'working' example: http://72.14.186.218/~alex/motion.php There are two problems: while it works just fine in FF, IE and Chrome do not create the table if the page is refreshed. If you go back to directory root and click on the link to the file the grid table is displayed, if you hit 'refresh' button -- the script runs but the table is not injected. Secondly, although the table HTML is injected in IE, it does not display it. I tried adding nbsp's to make sure its not ignored -- to no avail. Any suggestions on improving code or help with the issues is appreciated. Thanks!

  Read the article

• Navigating MainMenu with arrow keys or controller

  - by Phil Royer

  I'm attempting to make my menu navigable with the arrow keys or via the d-pad on a controller. So Far I've had no luck. The question is: Can someone walk me through how to make my current menu or any libgdx menu keyboard accessible? I'm a bit noobish with some stuff and I come from a Javascript background. Here's an example of what I'm trying to do: http://dl.dropboxusercontent.com/u/39448/webgl/qb/qb.html For a simple menu that you can just add a few buttons to and it run out of the box use this: http://www.sadafnoor.com/blog/how-to-create-simple-menu-in-libgdx/ Or you can use my code but I use a lot of custom styles. And here's an example of my code: import aurelienribon.tweenengine.Timeline; import aurelienribon.tweenengine.Tween; import aurelienribon.tweenengine.TweenManager; import com.badlogic.gdx.Game; import com.badlogic.gdx.Gdx; import com.badlogic.gdx.Screen; import com.badlogic.gdx.graphics.GL20; import com.badlogic.gdx.graphics.Texture; import com.badlogic.gdx.graphics.g2d.Sprite; import com.badlogic.gdx.graphics.g2d.SpriteBatch; import com.badlogic.gdx.graphics.g2d.TextureAtlas; import com.badlogic.gdx.math.Vector2; import com.badlogic.gdx.scenes.scene2d.Actor; import com.badlogic.gdx.scenes.scene2d.InputEvent; import com.badlogic.gdx.scenes.scene2d.InputListener; import com.badlogic.gdx.scenes.scene2d.Stage; import com.badlogic.gdx.scenes.scene2d.ui.Skin; import com.badlogic.gdx.scenes.scene2d.ui.Table; import com.badlogic.gdx.scenes.scene2d.ui.TextButton; import com.badlogic.gdx.scenes.scene2d.utils.Align; import com.badlogic.gdx.scenes.scene2d.utils.ClickListener; import com.project.game.tween.ActorAccessor; public class MainMenu implements Screen { private SpriteBatch batch; private Sprite menuBG; private Stage stage; private TextureAtlas atlas; private Skin skin; private Table table; private TweenManager tweenManager; @Override public void render(float delta) { Gdx.gl.glClearColor(0, 0, 0, 1); Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT); batch.begin(); menuBG.draw(batch); batch.end(); //table.debug(); stage.act(delta); stage.draw(); //Table.drawDebug(stage); tweenManager.update(delta); } @Override public void resize(int width, int height) { menuBG.setSize(width, height); stage.setViewport(width, height, false); table.invalidateHierarchy(); } @Override public void resume() { } @Override public void show() { stage = new Stage(); Gdx.input.setInputProcessor(stage); batch = new SpriteBatch(); atlas = new TextureAtlas("ui/atlas.pack"); skin = new Skin(Gdx.files.internal("ui/menuSkin.json"), atlas); table = new Table(skin); table.setBounds(0, 0, Gdx.graphics.getWidth(), Gdx.graphics.getHeight()); // Set Background Texture menuBackgroundTexture = new Texture("images/mainMenuBackground.png"); menuBG = new Sprite(menuBackgroundTexture); menuBG.setSize(Gdx.graphics.getWidth(), Gdx.graphics.getHeight()); // Create Main Menu Buttons // Button Play TextButton buttonPlay = new TextButton("START", skin, "inactive"); buttonPlay.addListener(new ClickListener() { @Override public void clicked(InputEvent event, float x, float y) { ((Game) Gdx.app.getApplicationListener()).setScreen(new LevelMenu()); } }); buttonPlay.addListener(new InputListener() { public boolean keyDown (InputEvent event, int keycode) { System.out.println("down"); return true; } }); buttonPlay.padBottom(12); buttonPlay.padLeft(20); buttonPlay.getLabel().setAlignment(Align.left); // Button EXTRAS TextButton buttonExtras = new TextButton("EXTRAS", skin, "inactive"); buttonExtras.addListener(new ClickListener() { @Override public void clicked(InputEvent event, float x, float y) { ((Game) Gdx.app.getApplicationListener()).setScreen(new ExtrasMenu()); } }); buttonExtras.padBottom(12); buttonExtras.padLeft(20); buttonExtras.getLabel().setAlignment(Align.left); // Button Credits TextButton buttonCredits = new TextButton("CREDITS", skin, "inactive"); buttonCredits.addListener(new ClickListener() { @Override public void clicked(InputEvent event, float x, float y) { ((Game) Gdx.app.getApplicationListener()).setScreen(new Credits()); } }); buttonCredits.padBottom(12); buttonCredits.padLeft(20); buttonCredits.getLabel().setAlignment(Align.left); // Button Settings TextButton buttonSettings = new TextButton("SETTINGS", skin, "inactive"); buttonSettings.addListener(new ClickListener() { @Override public void clicked(InputEvent event, float x, float y) { ((Game) Gdx.app.getApplicationListener()).setScreen(new Settings()); } }); buttonSettings.padBottom(12); buttonSettings.padLeft(20); buttonSettings.getLabel().setAlignment(Align.left); // Button Exit TextButton buttonExit = new TextButton("EXIT", skin, "inactive"); buttonExit.addListener(new ClickListener() { @Override public void clicked(InputEvent event, float x, float y) { Gdx.app.exit(); } }); buttonExit.padBottom(12); buttonExit.padLeft(20); buttonExit.getLabel().setAlignment(Align.left); // Adding Heading-Buttons to the cue table.add().width(190); table.add().width((table.getWidth() / 10) * 3); table.add().width((table.getWidth() / 10) * 5).height(140).spaceBottom(50); table.add().width(190).row(); table.add().width(190); table.add(buttonPlay).spaceBottom(20).width(460).height(110); table.add().row(); table.add().width(190); table.add(buttonExtras).spaceBottom(20).width(460).height(110); table.add().row(); table.add().width(190); table.add(buttonCredits).spaceBottom(20).width(460).height(110); table.add().row(); table.add().width(190); table.add(buttonSettings).spaceBottom(20).width(460).height(110); table.add().row(); table.add().width(190); table.add(buttonExit).width(460).height(110); table.add().row(); stage.addActor(table); // Animation Settings tweenManager = new TweenManager(); Tween.registerAccessor(Actor.class, new ActorAccessor()); // Heading and Buttons Fade In Timeline.createSequence().beginSequence() .push(Tween.set(buttonPlay, ActorAccessor.ALPHA).target(0)) .push(Tween.set(buttonExtras, ActorAccessor.ALPHA).target(0)) .push(Tween.set(buttonCredits, ActorAccessor.ALPHA).target(0)) .push(Tween.set(buttonSettings, ActorAccessor.ALPHA).target(0)) .push(Tween.set(buttonExit, ActorAccessor.ALPHA).target(0)) .push(Tween.to(buttonPlay, ActorAccessor.ALPHA, .5f).target(1)) .push(Tween.to(buttonExtras, ActorAccessor.ALPHA, .5f).target(1)) .push(Tween.to(buttonCredits, ActorAccessor.ALPHA, .5f).target(1)) .push(Tween.to(buttonSettings, ActorAccessor.ALPHA, .5f).target(1)) .push(Tween.to(buttonExit, ActorAccessor.ALPHA, .5f).target(1)) .end().start(tweenManager); tweenManager.update(Gdx.graphics.getDeltaTime()); } public static Vector2 getStageLocation(Actor actor) { return actor.localToStageCoordinates(new Vector2(0, 0)); } @Override public void dispose() { stage.dispose(); atlas.dispose(); skin.dispose(); menuBG.getTexture().dispose(); } @Override public void hide() { dispose(); } @Override public void pause() { } }

  Read the article

• Table sorting & pagination with jQuery and Razor in ASP.NET MVC

  - by hajan

  Introduction jQuery enjoys living inside pages which are built on top of ASP.NET MVC Framework. The ASP.NET MVC is a place where things are organized very well and it is quite hard to make them dirty, especially because the pattern enforces you on purity (you can still make it dirty if you want so ;) ). We all know how easy is to build a HTML table with a header row, footer row and table rows showing some data. With ASP.NET MVC we can do this pretty easy, but, the result will be pure HTML table which only shows data, but does not includes sorting, pagination or some other advanced features that we were used to have in the ASP.NET WebForms GridView. Ok, there is the WebGrid MVC Helper, but what if we want to make something from pure table in our own clean style? In one of my recent projects, I’ve been using the jQuery tablesorter and tablesorter.pager plugins that go along. You don’t need to know jQuery to make this work… You need to know little CSS to create nice design for your table, but of course you can use mine from the demo… So, what you will see in this blog is how to attach this plugin to your pure html table and a div for pagination and make your table with advanced sorting and pagination features.   Demo Project Resources The resources I’m using for this demo project are shown in the following solution explorer window print screen: Content/images – folder that contains all the up/down arrow images, pagination buttons etc. You can freely replace them with your own, but keep the names the same if you don’t want to change anything in the CSS we will built later. Content/Site.css – The main css theme, where we will add the theme for our table too Controllers/HomeController.cs – The controller I’m using for this project Models/Person.cs – For this demo, I’m using Person.cs class Scripts – jquery-1.4.4.min.js, jquery.tablesorter.js, jquery.tablesorter.pager.js – required script to make the magic happens Views/Home/Index.cshtml – Index view (razor view engine) the other items are not important for the demo. ASP.NET MVC 1. Model In this demo I use only one Person class which defines Person entity with several properties. You can use your own model, maybe one which will access data from database or any other resource. Person.cs public class Person {     public string Name { get; set; }     public string Surname { get; set; }     public string Email { get; set; }     public int? Phone { get; set; }     public DateTime? DateAdded { get; set; }     public int? Age { get; set; }     public Person(string name, string surname, string email,         int? phone, DateTime? dateadded, int? age)     {         Name = name;         Surname = surname;         Email = email;         Phone = phone;         DateAdded = dateadded;         Age = age;     } } 2. View In our example, we have only one Index.chtml page where Razor View engine is used. Razor view engine is my favorite for ASP.NET MVC because it’s very intuitive, fluid and keeps your code clean. 3. Controller Since this is simple example with one page, we use one HomeController.cs where we have two methods, one of ActionResult type (Index) and another GetPeople() used to create and return list of people. HomeController.cs public class HomeController : Controller {     //     // GET: /Home/     public ActionResult Index()     {         ViewBag.People = GetPeople();         return View();     }     public List<Person> GetPeople()     {         List<Person> listPeople = new List<Person>();                  listPeople.Add(new Person("Hajan", "Selmani", "[email protected]", 070070070,DateTime.Now, 25));                     listPeople.Add(new Person("Straight", "Dean", "[email protected]", 123456789, DateTime.Now.AddDays(-5), 35));         listPeople.Add(new Person("Karsen", "Livia", "[email protected]", 46874651, DateTime.Now.AddDays(-2), 31));         listPeople.Add(new Person("Ringer", "Anne", "[email protected]", null, DateTime.Now, null));         listPeople.Add(new Person("O'Leary", "Michael", "[email protected]", 32424344, DateTime.Now, 44));         listPeople.Add(new Person("Gringlesby", "Anne", "[email protected]", null, DateTime.Now.AddDays(-9), 18));         listPeople.Add(new Person("Locksley", "Stearns", "[email protected]", 2135345, DateTime.Now, null));         listPeople.Add(new Person("DeFrance", "Michel", "[email protected]", 235325352, DateTime.Now.AddDays(-18), null));         listPeople.Add(new Person("White", "Johnson", null, null, DateTime.Now.AddDays(-22), 55));         listPeople.Add(new Person("Panteley", "Sylvia", null, 23233223, DateTime.Now.AddDays(-1), 32));         listPeople.Add(new Person("Blotchet-Halls", "Reginald", null, 323243423, DateTime.Now, 26));         listPeople.Add(new Person("Merr", "South", "[email protected]", 3232442, DateTime.Now.AddDays(-5), 85));         listPeople.Add(new Person("MacFeather", "Stearns", "[email protected]", null, DateTime.Now, null));         return listPeople;     } }   TABLE CSS/HTML DESIGN Now, lets start with the implementation. First of all, lets create the table structure and the main CSS. 1. HTML Structure @{     Layout = null;     } <!DOCTYPE html> <html> <head>     <title>ASP.NET & jQuery</title>     <!-- referencing styles, scripts and writing custom js scripts will go here --> </head> <body>     <div>         <table class="tablesorter">             <thead>                 <tr>                     <th> value </th>                 </tr>             </thead>             <tbody>                 <tr>                     <td>value</td>                 </tr>             </tbody>             <tfoot>                 <tr>                     <th> value </th>                 </tr>             </tfoot>         </table>         <div id="pager">                      </div>     </div> </body> </html> So, this is the main structure you need to create for each of your tables where you want to apply the functionality we will create. Of course the scripts are referenced once ;). As you see, our table has class tablesorter and also we have a div with id pager. In the next steps we will use both these to create the needed functionalities. The complete Index.cshtml coded to get the data from controller and display in the page is: <body>     <div>         <table class="tablesorter">             <thead>                 <tr>                     <th>Name</th>                     <th>Surname</th>                     <th>Email</th>                     <th>Phone</th>                     <th>Date Added</th>                 </tr>             </thead>             <tbody>                 @{                     foreach (var p in ViewBag.People)                     {                                 <tr>                         <td>@p.Name</td>                         <td>@p.Surname</td>                         <td>@p.Email</td>                         <td>@p.Phone</td>                         <td>@p.DateAdded</td>                     </tr>                     }                 }             </tbody>             <tfoot>                 <tr>                     <th>Name</th>                     <th>Surname</th>                     <th>Email</th>                     <th>Phone</th>                     <th>Date Added</th>                 </tr>             </tfoot>         </table>         <div id="pager" style="position: none;">             <form>             <img src="@Url.Content("~/Content/images/first.png")" class="first" />             <img src="@Url.Content("~/Content/images/prev.png")" class="prev" />             <input type="text" class="pagedisplay" />             <img src="@Url.Content("~/Content/images/next.png")" class="next" />             <img src="@Url.Content("~/Content/images/last.png")" class="last" />             <select class="pagesize">                 <option selected="selected" value="5">5</option>                 <option value="10">10</option>                 <option value="20">20</option>                 <option value="30">30</option>                 <option value="40">40</option>             </select>             </form>         </div>     </div> </body> So, mainly the structure is the same. I have added @Razor code to create table with data retrieved from the ViewBag.People which has been filled with data in the home controller. 2. CSS Design The CSS code I’ve created is: /* DEMO TABLE */ body {     font-size: 75%;     font-family: Verdana, Tahoma, Arial, "Helvetica Neue", Helvetica, Sans-Serif;     color: #232323;     background-color: #fff; } table { border-spacing:0; border:1px solid gray;} table.tablesorter thead tr .header {     background-image: url(images/bg.png);     background-repeat: no-repeat;     background-position: center right;     cursor: pointer; } table.tablesorter tbody td {     color: #3D3D3D;     padding: 4px;     background-color: #FFF;     vertical-align: top; } table.tablesorter tbody tr.odd td {     background-color:#F0F0F6; } table.tablesorter thead tr .headerSortUp {     background-image: url(images/asc.png); } table.tablesorter thead tr .headerSortDown {     background-image: url(images/desc.png); } table th { width:150px;            border:1px outset gray;            background-color:#3C78B5;            color:White;            cursor:pointer; } table thead th:hover { background-color:Yellow; color:Black;} table td { width:150px; border:1px solid gray;} PAGINATION AND SORTING Now, when everything is ready and we have the data, lets make pagination and sorting functionalities 1. jQuery Scripts referencing <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/jquery.tablesorter.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/jquery.tablesorter.pager.js")" type="text/javascript"></script> 2. jQuery Sorting and Pagination script   <script type="text/javascript">     $(function () {         $("table.tablesorter").tablesorter({ widthFixed: true, sortList: [[0, 0]] })         .tablesorterPager({ container: $("#pager"), size: $(".pagesize option:selected").val() });     }); </script> So, with only two lines of code, I’m using both tablesorter and tablesorterPager plugins, giving some options to both these. Options added: tablesorter - widthFixed: true – gives fixed width of the columns tablesorter - sortList[[0,0]] – An array of instructions for per-column sorting and direction in the format: [[columnIndex, sortDirection], ... ] where columnIndex is a zero-based index for your columns left-to-right and sortDirection is 0 for Ascending and 1 for Descending. A valid argument that sorts ascending first by column 1 and then column 2 looks like: [[0,0],[1,0]] (source: http://tablesorter.com/docs/) tablesorterPager – container: $(“#pager”) – tells the pager container, the div with id pager in our case. tablesorterPager – size: the default size of each page, where I get the default value selected, so if you put selected to any other of the options in your select list, you will have this number of rows as default per page for the table too. END RESULTS 1. Table once the page is loaded (default results per page is 5 and is automatically sorted by 1st column as sortList is specified) 2. Sorted by Phone Descending 3. Changed pagination to 10 items per page 4. Sorted by Phone and Name (use SHIFT to sort on multiple columns) 5. Sorted by Date Added 6. Page 3, 5 items per page   ADDITIONAL ENHANCEMENTS We can do additional enhancements to the table. We can make search for each column. I will cover this in one of my next blogs. Stay tuned. DEMO PROJECT You can download demo project source code from HERE.CONCLUSION Once you finish with the demo, run your page and open the source code. You will be amazed of the purity of your code.Working with pagination in client side can be very useful. One of the benefits is performance, but if you have thousands of rows in your tables, you will get opposite result when talking about performance. Hence, sometimes it is nice idea to make pagination on back-end. So, the compromise between both approaches would be best to combine both of them. I use at most up to 500 rows on client-side and once the user reach the last page, we can trigger ajax postback which can get the next 500 rows using server-side pagination of the same data. I would like to recommend the following blog post http://weblogs.asp.net/gunnarpeipman/archive/2010/09/14/returning-paged-results-from-repositories-using-pagedresult-lt-t-gt.aspx, which will help you understand how to return page results from repository. I hope this was helpful post for you. Wait for my next posts ;). Please do let me know your feedback. Best Regards, Hajan

  Read the article

• How to programmatically create customcontrol and change its values in Silverlight 4

  - by user361317

  Hi! I want to create a custom tabcontrol class which has an icon before the text, and I want to be able to change the icon in the constructor of the new tabcontrol. I use implicit styles in Silverlight 4, and the custom tabcontrol should not have any xaml of its own, just the class and the implicit xaml style in my App.xaml. I cannot, however, get this to work. This is my code: <!-- Style for generic tabcontrols --> 20,0,0,0 <Style TargetType="controls:TabItem"> <Setter Property="IsTabStop" Value="False"/> <Setter Property="Background" Value="#FFDBEDFB"/> <Setter Property="BorderBrush" Value="#FFA3AEB9"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="Padding" Value="6,2,6,2"/> <Setter Property="HorizontalContentAlignment" Value="Stretch"/> <Setter Property="VerticalContentAlignment" Value="Stretch"/> <Setter Property="MinWidth" Value="5"/> <Setter Property="MinHeight" Value="5"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="controls:TabItem"> <Grid x:Name="Root" Cursor="Hand" Height="25"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualStateGroup.Transitions> <VisualTransition GeneratedDuration="0"/> <VisualTransition GeneratedDuration="0:0:0.1" To="MouseOver"/> </VisualStateGroup.Transitions> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"> <Storyboard> <DoubleAnimationUsingKeyFrames BeginTime="0" Duration="00:00:00.001" Storyboard.TargetName="FocusVisualTop" Storyboard.TargetProperty="(UIElement.Opacity)"> <SplineDoubleKeyFrame KeyTime="0" Value="0"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualTopSelected" Storyboard.TargetProperty="(UIElement.Opacity)"> <SplineDoubleKeyFrame KeyTime="0" Value="1"/> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualTopUnSelected" Storyboard.TargetProperty="(UIElement.Opacity)"> <SplineDoubleKeyFrame KeyTime="0" Value="1"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="SelectionStates"> <VisualState x:Name="Unselected"/> <VisualState x:Name="Selected"/> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"> <Storyboard> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualTop" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"> <Storyboard> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Grid x:Name="TemplateTopUnselected" Margin="1"> <Border x:Name="BorderTop" BorderThickness="1,1,1,0"> <Border x:Name="GradientTop" BorderThickness="1,1,1,0" CornerRadius="5,5,0,0"> <Border.BorderBrush> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFB1CCEE" Offset="0"/> <GradientStop Color="#CCB1CCEE" Offset="1"/> </LinearGradientBrush> </Border.BorderBrush> <Border.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFCEE0F7" Offset="0.091"/> <GradientStop Color="#FFDEECFD" Offset="0.996"/> <GradientStop Color="White"/> </LinearGradientBrush> </Border.Background> <Grid Margin="3,3,3,2"> <Grid.RowDefinitions> <RowDefinition Height="16"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="16"/> <ColumnDefinition/> <ColumnDefinition Width="15"/> </Grid.ColumnDefinitions> <Image x:Name="TabInactiveIcon" Source="group.png" Margin="0" HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0.395"/> <ContentControl x:Name="HeaderTopUnselected" Cursor="{TemplateBinding Cursor}" Margin="3,0" FontSize="{TemplateBinding FontSize}" Foreground="#FF416AA3" IsTabStop="False" FontFamily="Tahoma" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center"/> <Button x:Name="TabInactiveCloseButton" Template="{StaticResource TabItemCloseButton}" Cursor="Hand" Height="10" HorizontalAlignment="Right" Margin="0" VerticalAlignment="Top" Width="10" Content="Button" Grid.Column="2" d:LayoutOverrides="GridBox"/> </Grid> </Border> </Border> <Border x:Name="DisabledVisualTopUnSelected" IsHitTestVisible="false" Opacity="0" Background="#8CFFFFFF" CornerRadius="3,3,0,0"/> </Grid> <Border x:Name="FocusVisualElement" Margin="-1" IsHitTestVisible="false" Visibility="Collapsed" BorderBrush="#FF6DBDD1" BorderThickness="1" CornerRadius="3,3,0,0"/> <Grid x:Name="TemplateTopSelected" Margin="0,0,0,-3" Visibility="Collapsed"> <Border x:Name="BorderTop1" BorderThickness="1,1,1,0"> <Border x:Name="GradientTop1" BorderThickness="1,1,1,0" CornerRadius="5,5,0,0"> <Border.BorderBrush> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFB1CCEE" Offset="0"/> <GradientStop Color="#CAB1CCEE" Offset="1"/> </LinearGradientBrush> </Border.BorderBrush> <Border.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFCEE0F7" Offset="0.091"/> <GradientStop Color="White" Offset="0.974"/> <GradientStop Color="White"/> </LinearGradientBrush> </Border.Background> <Grid Margin="3,3,3,2"> <Grid.RowDefinitions> <RowDefinition Height="16"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="16"/> <ColumnDefinition/> <ColumnDefinition Width="15"/> </Grid.ColumnDefinitions> <Image x:Name="TabActiveIcon" Source="user.png" Margin="0" HorizontalAlignment="Center" VerticalAlignment="Center"/> <ContentControl x:Name="HeaderTopSelected" Cursor="{TemplateBinding Cursor}" Margin="3,0" FontSize="{TemplateBinding FontSize}" Foreground="#FF416AA3" IsTabStop="False" FontFamily="Tahoma" FontWeight="Bold" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center"/> <Button x:Name="TabActiveCloseButton" Template="{StaticResource TabActiveCloseButton}" Cursor="Hand" Height="10" HorizontalAlignment="Right" Margin="0" VerticalAlignment="Top" Width="10" Content="Button" Grid.Column="2" d:LayoutOverrides="GridBox"/> </Grid> </Border> </Border> <Border x:Name="FocusVisualTop" Margin="-2,-2,-2,0" IsHitTestVisible="false" Visibility="Collapsed" BorderThickness="1,1,1,0" CornerRadius="3,3,0,0"/> <Border x:Name="DisabledVisualTopSelected" Margin="-2,-2,-2,0" IsHitTestVisible="false" Opacity="0" Background="#8CFFFFFF" CornerRadius="3,3,0,0"/> </Grid> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> and my class public class ClosableTabItem : TabItem { public static readonly DependencyProperty TabIconProperty = DependencyProperty.RegisterAttached("TabInactiveIcon", typeof(Image), typeof(ClosableTabItem), null); public Image TabIcon { get { return (Image)GetValue(ClosableTabItem.TabIconProperty); } set { SetValue(ClosableTabItem.TabIconProperty, value); } } public ClosableTabItem(string header, ContentControl content, TabItemIcons icon) { // I need to be able to set the header, content and icon here } private Image GetTabIcon(TabItemIcons icon) { Image img = new Image(); switch (icon) { case TabItemIcons.User: img.Source = new BitmapImage(new Uri("/icons/user.png", UriKind.Relative)); break; case TabItemIcons.Group: img.Source = new BitmapImage(new Uri("/icons/group.png", UriKind.Relative)); break; default: break; } return img; } } This is driving me nuts, and I can't find any examples where anyone has done this without having a xaml page for the custom tab. Is this even possible? Can someone point me in the right direction? Cheers! - jonah

  Read the article

• Inheritance of templates in WPF

  - by Alxandr

  I'm trying to make sure that every child of a given element (MPF.MWindow) gets custom templates. For instance, the button should get the template defined in resMButton.xaml. As of now I'm using the following code on: (resMWindow.xaml) <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:MPF"> <Style x:Key="SystemKeyAnimations" TargetType="{x:Type Button}"> <Setter Property="Opacity" Value="0.5" /> <Setter Property="Background" Value="Transparent" /> <Style.Triggers> <EventTrigger RoutedEvent="Mouse.MouseEnter"> <BeginStoryboard> <Storyboard> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="Opacity"> <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="1.0" /> </DoubleAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> </EventTrigger> <EventTrigger RoutedEvent="Mouse.MouseLeave"> <BeginStoryboard> <Storyboard> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="Opacity"> <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="0.5" /> </DoubleAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> </EventTrigger> </Style.Triggers> </Style> <Style TargetType="{x:Type local:MWindow}"> <!-- Remove default frame appearance --> <Setter Property="WindowStyle" Value="None" /> <Setter Property="AllowsTransparency" Value="True" /> <Setter Property="Background" Value="Transparent" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:MWindow}"> <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" x:Name="ChromeBorder"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="4" /> <ColumnDefinition /> <ColumnDefinition Width="4" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="4" /> <RowDefinition /> <RowDefinition Height="4" /> </Grid.RowDefinitions> <Thumb Grid.Row="0" Grid.Column="1" x:Name="TopThumb" Cursor="SizeNS" BorderThickness="4" BorderBrush="Transparent" /> <Thumb Grid.Row="2" Grid.Column="1" x:Name="BottomThumb" Cursor="SizeNS" BorderThickness="4" BorderBrush="Transparent" /> <Thumb Grid.Row="1" Grid.Column="0" x:Name="LeftThumb" Cursor="SizeWE" BorderThickness="4" BorderBrush="Transparent" /> <Thumb Grid.Row="1" Grid.Column="2" x:Name="RightThumb" Cursor="SizeWE" BorderThickness="4" BorderBrush="Transparent" /> <Thumb Grid.Row="0" Grid.Column="0" x:Name="TopLeftThumb" Cursor="SizeNWSE" BorderThickness="5" BorderBrush="Transparent" /> <Thumb Grid.Row="0" Grid.Column="2" x:Name="TopRightThumb" Cursor="SizeNESW" BorderThickness="5" BorderBrush="Transparent" /> <Thumb Grid.Row="2" Grid.Column="0" x:Name="BottomLeftThumb" Cursor="SizeNESW" BorderThickness="5" BorderBrush="Transparent" /> <Thumb Grid.Row="2" Grid.Column="2" x:Name="BottomRightThumb" Cursor="SizeNWSE" BorderThickness="5" BorderBrush="Transparent" /> <Grid Grid.Row="1" Grid.Column="1"> <Grid.RowDefinitions> <RowDefinition Height="20" /> <RowDefinition /> </Grid.RowDefinitions> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <StackPanel Orientation="Horizontal" Grid.Column="1"> <Button Command="local:WindowCommands.Minimize" Style="{StaticResource ResourceKey=SystemKeyAnimations}"> <Button.Template> <ControlTemplate> <Canvas Width="10" Height="10" Margin="5" Background="Transparent"> <Line X1="0" X2="10" Y1="5" Y2="5" Stroke="White" StrokeThickness="2" /> </Canvas> </ControlTemplate> </Button.Template> </Button> <Button Command="local:WindowCommands.Maximize" x:Name="MaximizeButton" Style="{StaticResource ResourceKey=SystemKeyAnimations}"> <Button.Template> <ControlTemplate> <Canvas Width="10" Height="10" Margin="5" Background="Transparent"> <Rectangle Width="10" Height="10" Stroke="White" StrokeThickness="2" /> </Canvas> </ControlTemplate> </Button.Template> </Button> <Button Command="ApplicationCommands.Close" Style="{StaticResource ResourceKey=SystemKeyAnimations}"> <Button.Template> <ControlTemplate> <Canvas Width="10" Height="10" Margin="5" Background="Transparent"> <Line X1="0" X2="10" Y1="0" Y2="10" Stroke="White" StrokeThickness="2" /> <Line X1="10" X2="0" Y1="0" Y2="10" Stroke="White" StrokeThickness="2" /> </Canvas> </ControlTemplate> </Button.Template> </Button> </StackPanel> <ContentControl x:Name="TitleContentControl"> <TextBlock Text="{TemplateBinding Title}" Foreground="DarkGray" Margin="5,0" /> </ContentControl> </Grid> <ContentPresenter Content="{TemplateBinding Content}" Grid.Row="1"> <ContentPresenter.Resources> <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="/MPF;component/Themes/resMWindowContent.xaml" /> </ResourceDictionary.MergedDictionaries> </ResourceDictionary> </ContentPresenter.Resources> </ContentPresenter> </Grid> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary> As you can see during the ContentPresenter which gets the content of the window I merge in a dicrionary called resMWindowContent.xaml. The resMWindowContent.xaml looks as following: <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:MPF"> <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="/MPF;component/Themes/resMButton.xaml" /> </ResourceDictionary.MergedDictionaries> </ResourceDictionary> It simply merges in the resMButton.xaml dictionary (this is done because in the feature I will have MTextBox, mList... and I want to separate them). The resMButton.xaml looks as following: <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:MPF"> <Style TargetType="{x:Type Button}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Grid Background="Transparent"> <Rectangle Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}" Fill="{TemplateBinding Background}" /> <ContentPresenter Content="{TemplateBinding Content}" Margin="3" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary> A simple template drawing a square button. However, it isn't applied at all. My buttons remain normal, and I don't understand what I'm doing wrong. I just want every button inside the MWindow to get a special style (and in time every textbox and so forth). How do I achieve this? One note though: It's important that the styles doesn't apply to elements outside an MWindow.

  Read the article

• Jquery Flexslider - can't see navigational images (manualControl)

  - by Kim Thomas

  I've spent a lot of time looking at the post on 3/13/12 re: manual controls, but isn't getting me all the way there...probably because I don't know jquery. Sorry, newbie on board. I'm trying to get the right/left arrows to show, as well as the 1, 2, 3...at the bottom. They are there, I see the lists on Firebug, just don't know how to add them to the "hook" (?) so they appear. Here is the code I have in header: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script src="jquery.flexslider.js"></script> <script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider({ animation: "slide", slideshow: false, controlNav: true, manualControls: ".flex-control-nav li a", controlsContainer: ".flex-container" }); }); </script> Here is my html: <div class="flex-container"> <div class="flexslider"> <ul class="slides"> <li><img src="images/tah_home.jpg" alt="taylor art house home page" width="600" height="320"/> <p class="flex-caption">Taylor Art House Home Page</p></li> <li><img src="images/tah_blog.jpg" alt="taylor art house blog page" width="600" height="320" /> <p class="flex-caption">We created a blog that fits seemlessly into Taylor Art House's look</p></li> <li><img src="images/tah_artwork_page.jpg" alt="taylor art house art page" width="600" height="320" /> <p class="flex-caption">One of Taylor Art House's gallery pages, using a Wordpress plugin</p></li> <li><img src="images/tah_arch_portfolio.jpg" alt="jon taylor architecture portfolio page" width="600" height="320" /> <p class="flex-caption">We created links to toggle from TAH to Jon Taylor Architecture</p></li> </ul> </div><!--end flexsider--> </div><!--end flex-container--> Here is the Flexslider CSS: /* * jQuery FlexSlider v1.8 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php */ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .flexslider { width: 100%; margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img { max-width: 100%; display: block; } .flex-pauseplay span { text-transform: capitalize; } /* Clearfix for the .slides element */ .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .slides { display: block; } * html .slides { height: 1%; } /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child { display: block; } /* FlexSlider Default Theme *********************************/ .flexslider { width: 600px; background: #fff; border: 4px solid #999; position: relative; margin: 30px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1; } .flexslider .slides { zoom: 1; } .flexslider .slides > li { position: relative; } /* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */ .flex-container { zoom: 1; position: relative; margin-left:100px; } /* Caption style */ /* IE rgba() hack */ .flex-caption { background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1; } .flex-caption { width: 96%; padding: 2%; margin: 0; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px; } /* Direction Nav */ .flex-direction-nav { height: 0; } .flex-direction-nav li a { width: 52px; height: 52px; margin: -13px 0 0; display: block; background: url(theme/bg_direction_nav.png) no-repeat; position: absolute; top: 50%; cursor: pointer; text-indent: -999em; } .flex-direction-nav li .next { background-position: -52px 0; right: -21px; } .flex-direction-nav li .prev { left: -20px; } .flex-direction-nav li .disabled { opacity: .3; filter:alpha(opacity=30); cursor: default; } /* Control Nav */ .flex-control-nav { width: 100%; position: absolute; bottom: -30px; text-align: center; } .flex-control-nav li { margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline; } .flex-control-nav li:first-child { margin: 0; } .flex-control-nav li a { width: 13px; height: 13px; display: block; background: url(theme/bg_control_nav.png) no-repeat; cursor: pointer; text-indent: -999em; } .flex-control-nav li a:hover { background-position: 0 -13px; } .flex-control-nav li a.active { background-position: 0 -26px; cursor: default; } Here is how it appears in Firebug: <div class="flex-container"> <div class="flexslider" style="overflow: hidden;"> <ul class="slides" style="width: 1200%; margin-left: -1800px;"> <li class="clone" style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li class="clone" style="width: 600px; float: left; display: block;"> </ul> </div> <ol class="flex-control-nav"> <li> <a class="">1</a> </li> <li> <li> <li> </ol> <ul class="flex-direction-nav"> <li> <a class="prev" href="#">Previous</a> </li> <li> <a class="next" href="#">Next</a> </li> </ul> </div> Finally, here is a link to the jsFiddle file (I saw someone wanted that in other flexslider post): http://jsfiddle.net/kthms/Wxmsp/ Link to page: http://www.kajortdesigns.com/tah.php I've tried every combo of class from the CSS in the manualControl: "", but I'm just guessing. If anyone can help this newbie out, I would be very appreciative. Explicit instructions are always appreciated.

  Read the article

• compass-rails 1.03 - TypeError: can't convert nil into String

  - by Romiko

  I am running: ruby 1.9.3p392 (2013-02-22) [i386-mingw32] compass-rails 1.0.3 I used the Windows RailsInstaller to install Ruby on Rails Gemfile group :assets do gem 'sass-rails', '~> 3.2.3' gem 'coffee-rails', '~> 3.2.1' gem 'compass-rails','~> 1.0.2' # See https://github.com/sstephenson/execjs#readme for more supported runtimes # gem 'therubyracer', :platforms => :ruby gem 'uglifier', '>= 1.0.3' end I am currently experiencing issues importing sprites. My sprites are in: assets/images/source in my _shared.scss file I have: //Sprites @import "./source/*.png"; $source-sprite-dimensions: true; In my application.scss I have: /* * This is a manifest file that'll be compiled into application.css, which will include all the files * listed below. * * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. * * You're free to add application-wide styles to this file and they'll appear at the top of the * compiled file, but it's generally better to create a new file per style scope. * *= require_self */ @import "_shared.scss"; @import "baseline.scss"; @import "global.scss"; @import "normalize.scss"; @import "print.scss"; @import "desktop.scss"; @import "tablet.scss"; @import "home.css.scss"; I am also using rails server and not compass watcher. However when I browse to the page at localhost:3000/assets/application.css, I get the following error: body:before { font-weight: bold; content: "\000a TypeError: can't convert nil into String\000a (in c:\002f RangerRomOnRails\002f RangerRom\002f app\002f assets\002f stylesheets\002f desktop.scss)"; } body:after { content: "\000a C:\002f RailsInstaller\002f Ruby1.9.3\002f lib\002f ruby\002f gems\002f 1.9.1\002f gems\002f compass-0.12.2\002f lib\002f compass\002f sass_extensions\002f functions\002f image_size.rb:17:in `extname'"; } Here is the full stack trace: compass (0 .12.2) lib/compass/sass_extensions/functions/image_size.rb:17:in `extname' compass (0.12.2) lib/compass/sass_extensions/functions/image_size.rb:17:in `initialize' compass (0.12.2) lib/compass/sass_extensions/functions/image_size.rb:50:in `new' compass (0.12.2) lib/compass/sass_extensions/functions/image_size.rb:50:in `image_dimensions' compass (0.12.2) lib/compass/sass_extensions/functions/image_size.rb:4:in `image_width' sass (3.2.9) lib/sass/script/funcall.rb:112:in `_perform' sass (3.2.9) lib/sass/script/node.rb:40:in `perform' sass (3.2.9) lib/sass/tree/visitors/perform.rb:298:in `visit_prop' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:100:in `visit' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `map' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:109:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:121:in `with_environment' sass (3.2.9) lib/sass/tree/visitors/perform.rb:108:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `block in visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:320:in `visit_rule' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:100:in `visit' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `map' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:109:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:121:in `with_environment' sass (3.2.9) lib/sass/tree/visitors/perform.rb:108:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `block in visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:320:in `visit_rule' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:100:in `visit' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `map' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:109:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:121:in `with_environment' sass (3.2.9) lib/sass/tree/visitors/perform.rb:108:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `block in visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:362:in `visit_media' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:100:in `visit' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `map' sass (3.2.9) lib/sass/tree/visitors/base.rb:53:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:109:in `block in visit_children' sass (3.2.9) lib/sass/tree/visitors/perform.rb:121:in `with_environment' sass (3.2.9) lib/sass/tree/visitors/perform.rb:108:in `visit_children' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `block in visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:128:in `visit_root' sass (3.2.9) lib/sass/tree/visitors/base.rb:37:in `visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:100:in `visit' sass (3.2.9) lib/sass/tree/visitors/perform.rb:7:in `visit' sass (3.2.9) lib/sass/tree/root_node.rb:20:in `render' sass (3.2.9) lib/sass/engine.rb:315:in `_render' sass (3.2.9) lib/sass/engine.rb:262:in `render' sass-rails (3.2.6) lib/sass/rails/template_handlers.rb:106:in `evaluate' tilt (1.4.1) lib/tilt/template.rb:103:in `render' sprockets (2.2.2) lib/sprockets/context.rb:193:in `block in evaluate' sprockets (2.2.2) lib/sprockets/context.rb:190:in `each' sprockets (2.2.2) lib/sprockets/context.rb:190:in `evaluate' sprockets (2.2.2) lib/sprockets/processed_asset.rb:12:in `initialize' sprockets (2.2.2) lib/sprockets/base.rb:249:in `new' sprockets (2.2.2) lib/sprockets/base.rb:249:in `block in build_asset' sprockets (2.2.2) lib/sprockets/base.rb:270:in `circular_call_protection' sprockets (2.2.2) lib/sprockets/base.rb:248:in `build_asset' sprockets (2.2.2) lib/sprockets/index.rb:93:in `block in build_asset' sprockets (2.2.2) lib/sprockets/caching.rb:19:in `cache_asset' sprockets (2.2.2) lib/sprockets/index.rb:92:in `build_asset' sprockets (2.2.2) lib/sprockets/base.rb:169:in `find_asset' sprockets (2.2.2) lib/sprockets/index.rb:60:in `find_asset' sprockets (2.2.2) lib/sprockets/processed_asset.rb:111:in `block in resolve_dependencies' sprockets (2.2.2) lib/sprockets/processed_asset.rb:105:in `each' sprockets (2.2.2) lib/sprockets/processed_asset.rb:105:in `resolve_dependencies' sprockets (2.2.2) lib/sprockets/processed_asset.rb:97:in `build_required_assets' sprockets (2.2.2) lib/sprockets/processed_asset.rb:16:in `initialize' sprockets (2.2.2) lib/sprockets/base.rb:249:in `new' sprockets (2.2.2) lib/sprockets/base.rb:249:in `block in build_asset' sprockets (2.2.2) lib/sprockets/base.rb:270:in `circular_call_protection' sprockets (2.2.2) lib/sprockets/base.rb:248:in `build_asset' sprockets (2.2.2) lib/sprockets/index.rb:93:in `block in build_asset' sprockets (2.2.2) lib/sprockets/caching.rb:19:in `cache_asset' sprockets (2.2.2) lib/sprockets/index.rb:92:in `build_asset' sprockets (2.2.2) lib/sprockets/base.rb:169:in `find_asset' sprockets (2.2.2) lib/sprockets/index.rb:60:in `find_asset' sprockets (2.2.2) lib/sprockets/bundled_asset.rb:38:in `init_with' sprockets (2.2.2) lib/sprockets/asset.rb:24:in `from_hash' sprockets (2.2.2) lib/sprockets/caching.rb:15:in `cache_asset' sprockets (2.2.2) lib/sprockets/index.rb:92:in `build_asset' sprockets (2.2.2) lib/sprockets/base.rb:169:in `find_asset' sprockets (2.2.2) lib/sprockets/index.rb:60:in `find_asset' sprockets (2.2.2) lib/sprockets/environment.rb:78:in `find_asset' sprockets (2.2.2) lib/sprockets/base.rb:177:in `[]' actionpack (3.2.13) lib/sprockets/helpers/rails_helper.rb:126:in `asset_for' actionpack (3.2.13) lib/sprockets/helpers/rails_helper.rb:44:in `block in stylesheet_link_tag' actionpack (3.2.13) lib/sprockets/helpers/rails_helper.rb:43:in `collect' actionpack (3.2.13) lib/sprockets/helpers/rails_helper.rb:43:in `stylesheet_link_tag' app/views/layouts/application.html.erb:16:in `_app_views_layouts_application_html_erb___824639613_33845076' actionpack (3.2.13) lib/action_view/template.rb:145:in `block in render' activesupport (3.2.13) lib/active_support/notifications.rb:125:in `instrument' actionpack (3.2.13) lib/action_view/template.rb:143:in `render' actionpack (3.2.13) lib/action_view/renderer/template_renderer.rb:59:in `render_with_layout' actionpack (3.2.13) lib/action_view/renderer/template_renderer.rb:45:in `render_template' actionpack (3.2.13) lib/action_view/renderer/template_renderer.rb:18:in `render' actionpack (3.2.13) lib/action_view/renderer/renderer.rb:36:in `render_template' actionpack (3.2.13) lib/action_view/renderer/renderer.rb:17:in `render' actionpack (3.2.13) lib/abstract_controller/rendering.rb:110:in `_render_template' actionpack (3.2.13) lib/action_controller/metal/streaming.rb:225:in `_render_template' actionpack (3.2.13) lib/abstract_controller/rendering.rb:103:in `render_to_body' actionpack (3.2.13) lib/action_controller/metal/renderers.rb:28:in `render_to_body' actionpack (3.2.13) lib/action_controller/metal/compatibility.rb:50:in `render_to_body' actionpack (3.2.13) lib/abstract_controller/rendering.rb:88:in `render' actionpack (3.2.13) lib/action_controller/metal/rendering.rb:16:in `render' actionpack (3.2.13) lib/action_controller/metal/instrumentation.rb:40:in `block (2 levels) in render' activesupport (3.2.13) lib/active_support/core_ext/benchmark.rb:5:in `block in ms' C:/RailsInstaller/Ruby1.9.3/lib/ruby/1.9.1/benchmark.rb:295:in `realtime' activesupport (3.2.13) lib/active_support/core_ext/benchmark.rb:5:in `ms' actionpack (3.2.13) lib/action_controller/metal/instrumentation.rb:40:in `block in render' actionpack (3.2.13) lib/action_controller/metal/instrumentation.rb:83:in `cleanup_view_runtime' activerecord (3.2.13) lib/active_record/railties/controller_runtime.rb:24:in `cleanup_view_runtime' actionpack (3.2.13) lib/action_controller/metal/instrumentation.rb:39:in `render' actionpack (3.2.13) lib/action_controller/metal/implicit_render.rb:10:in `default_render' actionpack (3.2.13) lib/action_controller/metal/implicit_render.rb:5:in `send_action' actionpack (3.2.13) lib/abstract_controller/base.rb:167:in `process_action' actionpack (3.2.13) lib/action_controller/metal/rendering.rb:10:in `process_action' actionpack (3.2.13) lib/abstract_controller/callbacks.rb:18:in `block in process_action' activesupport (3.2.13) lib/active_support/callbacks.rb:414:in `_run__956028316__process_action__416811168__callbacks' activesupport (3.2.13) lib/active_support/callbacks.rb:405:in `__run_callback' activesupport (3.2.13) lib/active_support/callbacks.rb:385:in `_run_process_action_callbacks' activesupport (3.2.13) lib/active_support/callbacks.rb:81:in `run_callbacks' actionpack (3.2.13) lib/abstract_controller/callbacks.rb:17:in `process_action' actionpack (3.2.13) lib/action_controller/metal/rescue.rb:29:in `process_action' actionpack (3.2.13) lib/action_controller/metal/instrumentation.rb:30:in `block in process_action' activesupport (3.2.13) lib/active_support/notifications.rb:123:in `block in instrument' activesupport (3.2.13) lib/active_support/notifications/instrumenter.rb:20:in `instrument' activesupport (3.2.13) lib/active_support/notifications.rb:123:in `instrument' actionpack (3.2.13) lib/action_controller/metal/instrumentation.rb:29:in `process_action' actionpack (3.2.13) lib/action_controller/metal/params_wrapper.rb:207:in `process_action' activerecord (3.2.13) lib/active_record/railties/controller_runtime.rb:18:in `process_action' actionpack (3.2.13) lib/abstract_controller/base.rb:121:in `process' actionpack (3.2.13) lib/abstract_controller/rendering.rb:45:in `process' actionpack (3.2.13) lib/action_controller/metal.rb:203:in `dispatch' actionpack (3.2.13) lib/action_controller/metal/rack_delegation.rb:14:in `dispatch' actionpack (3.2.13) lib/action_controller/metal.rb:246:in `block in action' actionpack (3.2.13) lib/action_dispatch/routing/route_set.rb:73:in `call' actionpack (3.2.13) lib/action_dispatch/routing/route_set.rb:73:in `dispatch' actionpack (3.2.13) lib/action_dispatch/routing/route_set.rb:36:in `call' journey (1.0.4) lib/journey/router.rb:68:in `block in call' journey (1.0.4) lib/journey/router.rb:56:in `each' journey (1.0.4) lib/journey/router.rb:56:in `call' actionpack (3.2.13) lib/action_dispatch/routing/route_set.rb:612:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/best_standards_support.rb:17:in `call' rack (1.4.5) lib/rack/etag.rb:23:in `call' rack (1.4.5) lib/rack/conditionalget.rb:25:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/head.rb:14:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/params_parser.rb:21:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/flash.rb:242:in `call' rack (1.4.5) lib/rack/session/abstract/id.rb:210:in `context' rack (1.4.5) lib/rack/session/abstract/id.rb:205:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/cookies.rb:341:in `call' activerecord (3.2.13) lib/active_record/query_cache.rb:64:in `call' activerecord (3.2.13) lib/active_record/connection_adapters/abstract/connection_pool.rb:479:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/callbacks.rb:28:in `block in call' activesupport (3.2.13) lib/active_support/callbacks.rb:405:in `_run__360878605__call__248365880__callbacks' activesupport (3.2.13) lib/active_support/callbacks.rb:405:in `__run_callback' activesupport (3.2.13) lib/active_support/callbacks.rb:385:in `_run_call_callbacks' activesupport (3.2.13) lib/active_support/callbacks.rb:81:in `run_callbacks' actionpack (3.2.13) lib/action_dispatch/middleware/callbacks.rb:27:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/reloader.rb:65:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/remote_ip.rb:31:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/debug_exceptions.rb:16:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/show_exceptions.rb:56:in `call' railties (3.2.13) lib/rails/rack/logger.rb:32:in `call_app' railties (3.2.13) lib/rails/rack/logger.rb:16:in `block in call' activesupport (3.2.13) lib/active_support/tagged_logging.rb:22:in `tagged' railties (3.2.13) lib/rails/rack/logger.rb:16:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/request_id.rb:22:in `call' rack (1.4.5) lib/rack/methodoverride.rb:21:in `call' rack (1.4.5) lib/rack/runtime.rb:17:in `call' activesupport (3.2.13) lib/active_support/cache/strategy/local_cache.rb:72:in `call' rack (1.4.5) lib/rack/lock.rb:15:in `call' actionpack (3.2.13) lib/action_dispatch/middleware/static.rb:63:in `call' railties (3.2.13) lib/rails/engine.rb:479:in `call' railties (3.2.13) lib/rails/application.rb:223:in `call' rack (1.4.5) lib/rack/content_length.rb:14:in `call' railties (3.2.13) lib/rails/rack/log_tailer.rb:17:in `call' rack (1.4.5) lib/rack/handler/webrick.rb:59:in `service' C:/RailsInstaller/Ruby1.9.3/lib/ruby/1.9.1/webrick/httpserver.rb:138:in `service' C:/RailsInstaller/Ruby1.9.3/lib/ruby/1.9.1/webrick/httpserver.rb:94:in `run' C:/RailsInstaller/Ruby1.9.3/lib/ruby/1.9.1/webrick/server.rb:191:in `block in start_thread'

  Read the article

• Error Message, "The Controls collection cannot be modified because the control contains code blocks"

  - by Gogster

  I'm receiving this error on a page that previously worked fine, in fact the only change I've made to the page recently was to add another asp:TextBox and asp:RequiredFieldValidator control. The page already had numerous ASP.NET controls on it, so I cannot see why these extra controls would make a difference, anyway I shall post the code below and hopefully you can see what the error is: <%@ Control Language="C#" AutoEventWireup="true" CodeFile="MeetingGenerator.ascx.cs" Inherits="usercontrols_MeetingGenerator" %> <%@ Register TagPrefix="cc1" Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" %> <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> <div style="width:498px;height:425px;background-color:#033b2a;text-align:center;padding-top:20px;"> <asp:Label ID="lblDone" CssClass="done" runat="server"></asp:Label> <asp:Panel id="pnlAddReport" runat="server"> <div> <img src="../images/banners/add-meeting.png" alt="Add Report" /> </div> <p> <asp:ValidationSummary ID="ValidationSummary" CssClass="validationsummary" runat="server" /> <asp:TextBox ID="txtTitle" BorderStyle="None" CssClass="watermark" Width="250px" Height="22px" runat="server"></asp:TextBox> <cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" TargetControlID="txtTitle" WatermarkCssClass="watermark" WatermarkText=" Meeting title" runat="server"></cc1:TextBoxWatermarkExtender> <asp:RequiredFieldValidator ID="rfvTitle" ControlToValidate="txtTitle" Text="" ErrorMessage="Please enter the title" Display="None" InitialValue="" runat="server"></asp:RequiredFieldValidator> <asp:RequiredFieldValidator ID="rfvTitle1" ControlToValidate="txtTitle" Text="" ErrorMessage="Please enter the title" Display="None" InitialValue=" Meeting title" runat="server"></asp:RequiredFieldValidator> </p> <p> <asp:TextBox ID="txtDate" BorderStyle="None" CssClass="watermark" Width="250px" Height="22px" runat="server"></asp:TextBox> <cc1:CalendarExtender ID="ceDate" TargetControlID="txtDate" Format="dd/MM/yyyy" runat="server"> </cc1:CalendarExtender> <cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender2" TargetControlID="txtDate" WatermarkCssClass="watermark" WatermarkText=" Meeting Date" runat="server"></cc1:TextBoxWatermarkExtender> <asp:RequiredFieldValidator ID="rfvDate" ControlToValidate="txtDate" Text="" ErrorMessage="Please select the meeting date" Display="None" InitialValue="" runat="server"></asp:RequiredFieldValidator> <asp:RequiredFieldValidator ID="rfvDate1" ControlToValidate="txtDate" Text="" ErrorMessage="Please select the meeting date" Display="None" InitialValue=" Meeting Date" runat="server"></asp:RequiredFieldValidator> </p> <p> <asp:TextBox ID="txtMeetingTime" BorderStyle="None" Width="250px" Height="22px" MaxLength="5" runat="server"></asp:TextBox> <cc1:TextBoxWatermarkExtender ID="tweMeetingTime" TargetControlID="txtMeetingTime" WatermarkCssClass="watermark" WatermarkText=" Time (HH:MM)" runat="server"></cc1:TextBoxWatermarkExtender> <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="txtMeetingTime" Text="" ErrorMessage="Please enter the meeting time" Display="None" InitialValue="" runat="server"></asp:RequiredFieldValidator> <asp:RequiredFieldValidator ID="RequiredFieldValidator11" ControlToValidate="txtMeetingTime" Text="" ErrorMessage="Please enter the meeting time" Display="None" InitialValue=" Time (HH:MM)" runat="server"></asp:RequiredFieldValidator> </p> <p> <asp:TextBox ID="txtLocation" BorderStyle="None" CssClass="watermark" Width="250px" Height="22px" runat="server"></asp:TextBox> <cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender3" TargetControlID="txtLocation" WatermarkCssClass="watermark" WatermarkText=" Location" runat="server"></cc1:TextBoxWatermarkExtender> <asp:RequiredFieldValidator ID="rfvLocation" ControlToValidate="txtLocation" Text="" ErrorMessage="Please enter the location" Display="None" InitialValue="" runat="server"></asp:RequiredFieldValidator> <asp:RequiredFieldValidator ID="rfvLocation1" ControlToValidate="txtLocation" Text="" ErrorMessage="Please enter the location" Display="None" InitialValue=" Location" runat="server"></asp:RequiredFieldValidator> </p> <p> <asp:ImageButton ID="btnAddMeeting" ImageUrl="/images/buttons/addmeeting-btn.gif" runat="server" OnClick="btnAddMeeting_Click" /> </p> <p> </p> </asp:Panel> </div> <%@ Master Language="C#" MasterPageFile="/masterpages/Master.master" AutoEventWireup="true" %> <asp:content ContentPlaceHolderId="additionalhead" runat="server"> </asp:content> <asp:content ContentPlaceHolderId="additionalbody" runat="server"> <umbraco:Macro Alias="AddMeeting" runat="server"></umbraco:Macro> </asp:content> <asp:content ContentPlaceHolderId="bodyContent" runat="server"> </asp:content> <%@ Master Language="C#" AutoEventWireup="true" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title><umbraco:Item field="title" runat="server"></umbraco:Item></title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> <script type="text/javascript" src="/js/jQueryString-2.0.2-Min.js"></script> <link rel="stylesheet" type="text/css" href="/css/Styles.css" /> <link rel="stylesheet" type="text/css" href="/css/Layout.css" /> <link rel="stylesheet" type="text/css" href="/css/Forms.css" /> <script type="text/javascript" language="javascript"> $(document).ready(function () { $('#uploadAgenda').hide(); $('#uploadMinutes').hide(); $('#<%=txtSearchEAA.ClientID%>').val('Search EAA'); var st = $.getQueryString({ ID:"search" }); if (st != '') { $('#<%=txtSearchEAA.ClientID%>').val(st); }; $('#<%=txtSearchEAA.ClientID%>').click(function() { $('#<%=txtSearchEAA.ClientID%>').val(''); }); }); </script> <script type="text/C#" runat="server"> protected void btnSearch_Click(object sender, EventArgs e) { Response.Redirect("/members/search-results?search=" + txtSearchEAA.Text); } </script> <asp:ContentPlaceHolder id="additionalhead" runat="server"></asp:ContentPlaceHolder> <umbraco:Item field="AdditionalHead" runat="server"></umbraco:Item> </head> <body style="background-color:#e5e5e5;"> <script runat="server"> protected void btnLogout_Click(object sender, EventArgs e) { FormsAuthentication.SignOut(); Response.Redirect("/login"); } </script> <form id="form1" runat="server"> <asp:ContentPlaceHolder id="additionalbody" runat="server"></asp:ContentPlaceHolder> <div class="wrapper"> <div class="content"> <div class="banner"> <div class="bannerSearchSpacer"> <a href="/home"><h1><span>EAA</span></h1></a> </div> <div class="aboutEAA"> &nbsp; </div> <div class="bannerSearchAligns"> <div class="searchbox"> <asp:TextBox ID="txtSearchEAA" CssClass="watermark" Width="155px" runat="server"></asp:TextBox> </div> <div class="searchButton"> <asp:ImageButton ID="imbSearch" ImageUrl="/images/buttons/go.gif" OnClick="btnSearch_Click" runat="server" /> </div> <div style="clear:both;"></div> </div> <div class="loginBox"> <dl> <dt>Hello</dt> <dd><umbraco:Macro Alias="MemberName" runat="server"></umbraco:Macro></dd> <dt>Arena</dt> <dd><umbraco:Macro Alias="MemberArena" runat="server"></umbraco:Macro></dd> </dl> <div><asp:ImageButton ID="btnLogout" ImageUrl="/images/buttons/logout.gif" runat="server" OnClick="btnLogout_Click" /></div> </div> <div style="clear:both;"></div> </div> <div id="contentarea"> <div class="menuLeft"> <div class="menuPlaceholder"> <umbraco:Macro Alias="DynamicMenu" runat="server"></umbraco:Macro> </div> </div> <div class="mainBody"> <asp:ContentPlaceHolder id="bodyContent" runat="server"></asp:ContentPlaceHolder> </div> <div style="clear:both;"></div> </div> </div> </div> </form> <umbraco:Macro Alias="MemberAnalytics" runat="server"></umbraco:Macro> </body> </html>

  Read the article

• drop down menu will not display outside containing div in IE7..

  - by playahabana

  I am tearing my hair out over this, I have a dropdown menu using CSS and jQuery (thanks to Soh Tanaka) and it works perfectly in Firefox, Safari, Google chrome and I.E. 8, but in IE 7 it will not drop down outside the 'Banner div'. It drops below the nav div however. I have moved the nav div higher in the banner the result is the same, menu drops until it reaches the border of the banner div and then vanishes.... Below is the css. This is my first website and I have some limited understanding of what I am doing. The drop down menu includes transparent png's as links (I know, I know...but it's what the Boss wants...) please could someone take a quick scan at the below CSS and let me know what is wroong? Is this some form of the IE z-index bug? i have tried all different combinations of z-index and still I can't get a different result. . The html is below as well. Thankyou in advance #banner { position: relative; width: 62.5em; height: 12em; background-color: #46280A; background-image: url('images/includes/banner2.jpg'); background-repeat: no-repeat; background-position: center; -moz-box-shadow: -4px 6px 8px #000; -webkit-box-shadow: -4px 6px 8px #000; box-shadow: -4px 6px 8px #000; /* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=225, Color='#000000')"; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=225, Color='#000000'); z-index: 1; } /*------------------------------------SCROLLER---------------------------------------------*/ #headlines{ position: absolute; top: 1.3em; right: 2.75em; overflow: hidden; height: 2.5em; width: 24em; background-color: #000000; display: block; z-index: 3; } #news{ position: relative; height: 3.1em; line-height: 2.5em; font-size: 0.8em color: #FFFF99; white-space: nowrap; overflow: hidden; font-family: Georgia,Arial; } #scrollerglass{ position: absolute; top: 0.95em; right: 2em; height: 52px; width: 410px; border: none; padding: 0.2em 0em 0em 0em; line-height: 0.7em; text-align: center; background-image: url('images/includes/scrollerglass.png'); background-color: transparent; background-repeat: no-repeat; background-position: center; opacity: 20; z-index: 10; } #scrollerglass a i { visibility: hiddn ; } /-------------------------------------NAVIGATION-----------------------------------------/ #nav { position: absolute; top: 5.8em; left: 0.2em; font-family: trebuchet, sans-serif; font-size: 1em; line-height: 3.75em; text-align: center; color: #FFFF00; z-index: 3; } ul.navlist { list-style: none; padding: 0em; margin: 1em; float: left; width: 62.5em; background: transparent; font-size: 1em; } ul.navlist li { position: relative; /*--Declare X and Y axis base for sub navigation--*/ float: left; margin: 0em 1.4em; padding: 0em 0.7em 0em 0em; z-index: 1; } ul.navlist li a{ display: block; text-decoration: none; float: left; border: 0px solid; } ul.navlist li img{ border: 0px solid; } ul.navlist li span { trigger styles--*/ width: 1.2em; height: 5.25em; float: left; background: url(images/links/downlogo.png) no-repeat center top; } ul.navlist li span.subhover { background-position: center bottom; cursor: pointer; } ul.navlist li ul.navdrop { list-style: none; position: absolute; float: left; top: 5.3em; left: -2.4em; height: 15.0em; width: 11.25em; margin: 0; padding: 0.5em 0em 0em 0em; display: none; background-position: center; background-image: url('images/includes/slider.jpg'); background-color: transparent; background-repeat: no-repeat; -moz-box-shadow: -4px 6px 8px #000; -webkit-box-shadow: -4px 6px 8px #000; box-shadow: -4px 6px 8px #000; /* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=225, Color='#000000')"; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=225, Color='#000000'); z-index:1; } ul.navlist li ul.navdrop li{ margin: 0em 2.3em 0em 0em; padding: 1em 0em 0em 0em; width: 8em; clear: both; } html ul.navlist li ul.navdrop li a { border: 0px solid; width: 11.25em; } html ul.navlist li ul.navdrop li a:hover { background: transparent; } <div id="banner"> <div id="headlines"> <div id="news"> Whatever we want to promote </div> </div> <div id="scrollerglass"> <a href="vintagecigars.php"> <i>------s-c-r-o-l-l-e-r - - - -l-i-n-k-s--------<br /> <br>------s-c-r-o-l-l-e-r - - - -l-i-n-k-s------</i></a> </div> <div id="nav"> <ul class="navmenu"> <li><a href="index.php"><img src="images/links/home.png" alt="Home" ></a></li> <li><a href="ourbar.php"><img src="images/links/ourbar.png" alt="Our Bar" ></a> <ul class="navdrop"> <li ><a href="ourcocktails.php"><img src="images/links/cockteles.png" alt="Our Cocktails" ></a></li> <li ><a href="celebrate.php"><img src="images/links/celebrate.png" alt="Celebrate in Style" ></a></li> </ul> </li> <li><a href="ourcigars.php"><img src="images/links/ourcigars.png" alt="Our Cigars" ></a> <ul class="navdrop"> <li ><a href="edicioneslimitadas.php"><img src="images/links/edicioneslimitadas.png" alt="Edition Limitadas" ></a></li> <li ><a href="cigartasting.php"><img src="images/links/cigartasting.png" alt="Cigar Tastings" ></a></li> </ul> </li> <li><a href="personalroller.php"><img src="images/links/personalcigar.png" alt="Personal Cigar Roller" ></a></li> <li><a href="galleryentrance.php"><img src="images/links/photogallery.png" alt="Photo Gallery" ></a></li> <li><a href="contactus.php"><img src="images/links/contactus.png" alt="Contact Us" ></a></li> </ul></div></div><!--end banner-->

  Read the article

• What is wrong with my gtkrc file?

  - by PP

  I have written following gtkrc file from some other theme gtkrc file. This theme is normal theme with buttons using pixmap theme engine. I have also given background image to GtkEntry. Problem is that, When i use this theme my buttons doesn't show text one them and my entry box does not show cursor. Plus in engine "pixmap" tag I need to specify image name with it's path as I have already mentioned pixmap_path on the top of rc file but why I still need to specify the path in file = "xxx" # gtkrc file. pixmap_path "./backgrounds:./icons:./buttons:./emotions" gtk-button-images = 1 #Icon Sizes and color definitions gtk-icon-sizes = "gtk-small-toolbar=16,16:gtk-large-toolbar=24,24:gtk-button=16,16" gtk-toolbar-icon-size = GTK_ICON_SIZE_SMALL_TOOLBAR gtk_color_scheme = "fg_color:#000000\nbg_color:#848484\nbase_color:#000000\ntext_color:#000000\nselected_bg_color:#f39638\nselected_fg_color:#000000\ntooltip_bg_color:#634110\ntooltip_fg_color:#ffffff" style "theme-default" { xthickness = 10 ythickness = 10 GtkEntry::honors-transparent-bg-hint = 0 GtkMenuItem::arrow-spacing = 20 GtkMenuItem::horizontal-padding = 50 GtkMenuItem::toggle-spacing = 30 GtkOptionMenu::indicator-size = {11, 5} GtkOptionMenu::indicator-spacing = {6, 5, 4, 4} GtkTreeView::horizontal_separator = 5 GtkTreeView::odd_row_color = "#efefef" GtkTreeView::even_row_color = "#e3e3e3" GtkWidget::link-color = "#0062dc" # blue GtkWidget::visited-link-color = "#8c00dc" #purple GtkButton::default_border = { 0, 0, 0, 0 } GtkButton::child-displacement-x = 0 GtkButton::child-displacement-y = 1 GtkWidget::focus-padding = 0 GtkRange::trough-border = 0 GtkRange::slider-width = 19 GtkRange::stepper-size = 19 GtkScrollbar::min_slider_length = 36 GtkScrollbar::has-secondary-backward-stepper = 1 GtkPaned::handle_size = 8 GtkMenuBar::internal-padding = 0 GtkTreeView::expander_size = 13 #15 GtkExpander::expander_size = 13 #17 GtkScale::slider-length = 35 GtkScale::slider-width = 17 GtkScale::trough-border = 0 GtkWidget::link-color = "#0062dc" GtkWidget::visited-link-color = "#8c00dc" #purple WnckTasklist::fade-overlay-rect = 0 WnckTasklist::fade-loop-time = 5.0 # 5 seconds WnckTasklist::fade-opacity = 0.5 # final opacity #makes menu only overlap border GtkMenu::horizontal-offset = -1 #removes extra padding at top and bottom of menus. Makes menuitem overlap border GtkMenu::vertical-padding = 0 #set to the same as roundness, used for better hotspot selection of tabs GtkNotebook::tab-curvature = 2 GtkNotebook::tab-overlap = 4 GtkMenuItem::arrow-spacing = 10 GtkOptionMenu ::indicator-size = {11, 5} GtkCheckButton ::indicator-size = 16 GtkCheckButton ::indicator-spacing = 1 GtkRadioButton ::indicator-size = 16 GtkTreeView::horizontal_separator = 2 GtkTreeView::odd_row_color = "#efefef" GtkTreeView::even_row_color = "#e3e3e3" NautilusIconContainer::normal_icon_color = "#ff0000" GtkEntry::inner-border = {0, 0, 0, 0} GtkScrolledWindow::scrollbar-spacing = 0 GtkScrolledWindow::scrollbars-within-bevel = 1 fg[NORMAL] = @fg_color fg[ACTIVE] = @fg_color fg[PRELIGHT] = @fg_color fg[SELECTED] = @selected_fg_color fg[INSENSITIVE] = shade (3.0,@fg_color) bg[NORMAL] = @bg_color bg[ACTIVE] = shade (0.95,@bg_color) bg[PRELIGHT] = mix(0.92, shade (1.1,@bg_color), @selected_bg_color) bg[SELECTED] = @selected_bg_color bg[INSENSITIVE] = shade (1.06,@bg_color) base[NORMAL] = @base_color base[ACTIVE] = shade (0.65,@base_color) base[PRELIGHT] = @base_color base[SELECTED] = @selected_bg_color base[INSENSITIVE] = shade (1.025,@bg_color) text[NORMAL] = @text_color text[ACTIVE] = shade (0.95,@base_color) text[PRELIGHT] = @text_color text[SELECTED] = @selected_fg_color text[INSENSITIVE] = mix (0.675,shade (0.95,@bg_color),@fg_color) } style "theme-entry" { xthickness = 10 ythickness = 10 GtkEntry::inner-border = {10, 10, 10, 10} GtkEntry::progress-border = {10, 10, 10, 10} GtkEntry::icon-prelight = 1 GtkEntry::state-hintt = 1 #GtkEntry::honors-transparent-bg-hint = 1 text[NORMAL] = "#000000" text[ACTIVE] = "#787878" text[INSENSITIVE] = "#787878" text[SELECTED] = "#FFFFFF" engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = FALSE file = "./backgrounds/entry_background.png" border = { 0, 0, 0, 0 } stretch = TRUE } image { function = FLAT_BOX state = PRELIGHT recolorable = FALSE file = "./backgrounds/entry_background.png" border = { 0, 0, 0, 0 } stretch = TRUE } image { function = FLAT_BOX state = ACTIVE recolorable = FALSE file = "./backgrounds/entry_background.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } #----------------------------------------------- #Chat Balloon Incoming background. style "theme-event-box-top-in" { xthickness = 1 ythickness = 1 GtkEventBox::inner-border = {0, 0, 0, 0} engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = TRUE file = "./backgrounds/chat_in_top.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } style "theme-event-box-mid-in" { xthickness = 1 ythickness = 1 GtkEventBox::inner-border = {0, 0, 0, 0} engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = TRUE file = "./backgrounds/chat_in_mid.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } style "theme-event-box-bot-in" { xthickness = 1 ythickness = 1 GtkEventBox::inner-border = {0, 0, 0, 0} engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = TRUE file = "./backgrounds/chat_in_bot.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } #----------------------------------------------- #Chat Balloon Outgoing background. style "theme-event-box-top-out" { xthickness = 1 ythickness = 1 GtkEventBox::inner-border = {0, 0, 0, 0} engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = TRUE file = "./backgrounds/chat_out_top.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } style "theme-event-box-mid-out" { xthickness = 1 ythickness = 1 GtkEventBox::inner-border = {0, 0, 0, 0} engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = TRUE file = "./backgrounds/chat_out_mid.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } style "theme-event-box-bot-out" { xthickness = 1 ythickness = 1 GtkEventBox::inner-border = {0, 0, 0, 0} engine "pixmap" { image { function = FLAT_BOX state = NORMAL recolorable = TRUE file = "./backgrounds/chat_out_bot.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } style "theme-wide" = "theme-default" { xthickness = 2 ythickness = 2 } style "theme-wider" = "theme-default" { xthickness = 3 ythickness = 3 } style "theme-button" { GtkButton::inner-border = {0, 0, 0, 0} GtkWidget::focus-line-width = 0 GtkWidget::focus-padding = 0 bg[NORMAL] = "#414143" bg[ACTIVE] = "#c19676" bg[PRELIGHT] = "#7f4426" bg[SELECTED] = "#ff0000" bg[INSENSITIVE] = "#434346" fg[NORMAL] = "#ffffff" fg[INSENSITIVE] = "#000000" fg[PRELIGHT] = "#ffffff" fg[SELECTED] = "#ffffff" fg[ACTIVE] = "#ffffff" text[NORMAL] = "#ff0000" text[INSENSITIVE] = "#ff0000" text[PRELIGHT] = "#ff0000" text[SELECTED] = "#ff0000" text[INSENSITIVE] = "#434346" text[ACTIVE] = "#ff0000" base[NORMAL] = "#ff0000" base[INSENSITIVE] = "#ff0000" base[PRELIGHT] = "#ff0000" base[SELECTED] = "#ff0000" base[INSENSITIVE] = "#ff0000" engine "pixmap" { image { function = BOX state = NORMAL recolorable = TRUE file = "./buttons/LightButtonAct.png" border = { 0, 0, 0, 0 } stretch = TRUE } image { function = BOX state = PRELIGHT recolorable = TRUE file = "./buttons/LightButtonRoll.png" border = { 0, 0, 0, 0 } stretch = TRUE } image { function = BOX state = ACTIVE recolorable = TRUE file = "./buttons/LightButtonClicked.png" border = { 0, 0, 0, 0 } stretch = TRUE } image { function = BOX state = INSENSITIVE recolorable = TRUE file = "./buttons/LightButtonInact.png" border = { 0, 0, 0, 0 } stretch = TRUE } } } style "theme-toolbar" { xthickness = 2 ythickness = 2 bg[NORMAL] = shade (1.078,@bg_color) } style "theme-handlebox" { bg[NORMAL] = shade (0.95,@bg_color) } style "theme-scale" { bg[NORMAL] = shade (1.06, @bg_color) bg[PRELIGHT] = mix(0.85, shade (1.1,@bg_color), @selected_bg_color) bg[SELECTED] = "#4d4d55" } style "theme-range" { bg[NORMAL] = shade (1.12,@bg_color) bg[ACTIVE] = @bg_color bg[PRELIGHT] = mix(0.95, shade (1.10,@bg_color), @selected_bg_color) #Arrows text[NORMAL] = shade (0.275,@selected_fg_color) text[PRELIGHT] = @selected_fg_color text[ACTIVE] = shade (0.10,@selected_fg_color) text[INSENSITIVE] = mix (0.80,shade (0.90,@bg_color),@fg_color) } style "theme-notebook" = "theme-wider" { xthickness = 4 ythickness = 4 GtkNotebook::tab-curvature = 5 GtkNotebook::tab-vborder = 1 GtkNotebook::tab-overlap = 1 GtkNotebook::tab-vborder = 1 bg[NORMAL] = "#d2d2d2" bg[ACTIVE] = "#e3e3e3" bg[PRELIGHT] = "#848484" bg[SELECTED] = "#848484" bg[INSENSITIVE] = "#848484" text[PRELIGHT] = @selected_fg_color text[NORMAL] = "#000000" text[ACTIVE] = "#737373" text[SELECTED] = "#000000" text[INSENSITIVE] = "#737373" fg[PRELIGHT] = @selected_fg_color fg[NORMAL] = "#000000" fg[ACTIVE] = "#737373" fg[SELECTED] = "#000000" fg[INSENSITIVE] = "#737373" } style "theme-paned" { bg[PRELIGHT] = shade (1.1,@bg_color) } style "theme-panel" { # Menu fg[PRELIGHT] = @selected_fg_color font_name = "Bold 9" text[PRELIGHT] = @selected_fg_color } style "theme-menu" { xthickness = 0 ythickness = 0 bg[NORMAL] = shade (1.16,@bg_color) bg[SELECTED] = "#ff9a00" text[PRELIGHT] = @selected_fg_color fg[PRELIGHT] = @selected_fg_color } style "theme-menu-item" = "theme-menu" { xthickness = 3 ythickness = 3 base[SELECTED] = "#ff9a00" base[NORMAL] = "#ff9a00" base[PRELIGHT] = "#ff9a00" base[INSENSITIVE] = "#ff9a00" base[ACTIVE] = "#ff9a00" bg[SELECTED] = "#ff9a00" bg[NORMAL] = shade (1.16,@bg_color) } style "theme-menubar" { #TODO } style "theme-menubar-item" = "theme-menu-item" { #TODO bg[SELECTED] = "#ff9a00" } style "theme-tree" { xthickness = 2 ythickness = 1 font_name = "Bold 9" GtkWidget::focus-padding = 0 bg[NORMAL] = "#5a595a" bg[PRELIGHT] = "#5a595a" bg[ACTIVE] = "#5a5a5a" fg[NORMAL] = "#ffffff" fg[ACTIVE] = "#ffffff" fg[SELECTED] = "#ff9a00" fg[PRELIGHT] = "#ffffff" bg[SELECTED] = "#ff9a00" base[SELECTED] = "#ff9a00" base[NORMAL] = "#ff9a00" base[PRELIGHT] = "#ff9a00" base[INSENSITIVE] = "#ff9a00" base[ACTIVE] = "#ff9a00" text[NORMAL] = "#000000" text[PRELIGHT] = "#ff9a00" text[ACTIVE] = "#ff9a00" text[SELECTED] = "#ff9a00" text[INSENSITIVE] = "#434346" } style "theme-tree-arrow" { bg[NORMAL] = mix(0.70, shade (0.60,@bg_color), shade (0.80,@selected_bg_color)) bg[PRELIGHT] = mix(0.80, @bg_color, @selected_bg_color) } style "theme-progressbar" { font_name = "Bold" bg[SELECTED] = @selected_bg_color fg[PRELIGHT] = @selected_fg_color bg[ACTIVE] = "#fe7e00" bg[NORMAL] = "#ffba00" } style "theme-tooltips" = "theme-wider" { font_name = "Liberation sans 10" bg[NORMAL] = @tooltip_bg_color fg[NORMAL] = @tooltip_fg_color text[NORMAL] = @tooltip_fg_color } style "theme-combo" = "theme-button" { xthickness = 4 ythickness = 4 text[NORMAL] = "#fd7d00" text[INSENSITIVE] = "#8a8a8a" base[NORMAL] = "#e0e0e0" base[INSENSITIVE] = "#aeaeae" } style "theme-combo-box" = "theme-button" { xthickness = 3 ythickness = 2 bg[NORMAL] = "#343539" bg[PRELIGHT] = "#343539" bg[ACTIVE] = "#26272b" bg[INSENSITIVE] = "#404145" } style "theme-entry-combo-box" { xthickness = 6 ythickness = 3 text[NORMAL] = "#000000" text[INSENSITIVE] = "#8a8a8a" base[NORMAL] = "#ffffff" base[INSENSITIVE] = "#aeaeae" } style "theme-combo-arrow" = "theme-button" { xthickness = 1 ythickness = 1 } style "theme-view" { xthickness = 0 ythickness = 0 } style "theme-check-radio-buttons" { GtkWidget::interior-focus = 0 GtkWidget::focus-padding = 1 text[NORMAL] = "#ff0000" base[NORMAL] = "#ff0000" text[SELECTED] = "#ffffff" text[INSENSITIVE] = shade (0.625,@bg_color) base[PRELIGHT] = mix(0.80, @base_color, @selected_bg_color) bg[NORMAL] = "#438FC6" bg[INSENSITIVE] = "#aeaeae" bg[SELECTED] = "#ff8a01" } style "theme-radio-buttons" = "theme-button" { GtkWidget::interior-focus = 0 GtkWidget::focus-padding = 1 text[SELECTED] = @selected_fg_color text[INSENSITIVE] = shade (0.625,@bg_color) base[PRELIGHT] = mix(0.80, @base_color, @selected_bg_color) bg[NORMAL] = "#ffffff" bg[INSENSITIVE] = "#dcdcdc" bg[SELECTED] = @selected_bg_color } style "theme-spin-button" { bg[NORMAL] = "#d2d2d2" bg[ACTIVE] = "#868686" bg[PRELIGHT] = "#7f4426" bg[SELECTED] = shade(1.10,@selected_bg_color) bg[INSENSITIVE] = "#dcdcdc" base[NORMAL] = "#ffffff" base[INSENSITIVE] = "#dcdcdc" text[NORMAL] = "#000000" text[INSENSITIVE] = "#aeaeae" } style "theme-calendar" { xthickness = 0 ythickness = 0 bg[NORMAL] = "#676767" bg[PRELIGHT] = shade(0.92,@bg_color) bg[ACTIVE] = "#ff0000" bg[INSENSITIVE] = "#ff0000" bg[SELECTED] = "#ff0000" text[PRELIGHT] = "#000000" text[NORMAL] = "#000000" text[INSENSITIVE]= "#000000" text[SELECTED] = "#ffffff" text[ACTIVE] = "#000000" fg[NORMAL] = "#ffffff" fg[PRELIGHT] = "#ffffff" fg[INSENSITIVE] = "#ffffff" fg[SELECTED] = "#ffffff" fg[ACTIVE] = "#ffffff" base[NORMAL] = "#ff0000" base[NORMAL] = "#aeaeae" base[INSENSITIVE] = "#00ff00" base[SELECTED] = "#f3720d" base[ACTIVE] = "#f3720d" } style "theme-separator-menu-item" { xthickness = 1 ythickness = 0 GtkSeparatorMenuItem::horizontal-padding = 2 # We are setting the desired height by using wide-separators # There is no other way to get the odd height ... GtkWidget::wide-separators = 1 GtkWidget::separator-width = 1 GtkWidget::separator-height = 5 } style "theme-frame" { xthickness = 10 ythickness = 0 GtkWidget::LABEL-SIDE-PAD = 14 GtkWidget::LABEL-PAD = 23 fg[NORMAL] = "#000000" fg[ACTIVE] = "#000000" fg[PRELIGHT] = "#000000" fg[SELECTED] = "#000000" fg[INSENSITIVE] = "#000000" bg[NORMAL] = "#e2e2e2" bg[ACTIVE] = "#000000" bg[PRELIGHT] = "#000000" bg[SELECTED] = "#000000" bg[INSENSITIVE] = "#000000" base[NORMAL] = "#000000" base[ACTIVE] = "#000000" base[PRELIGHT] = "#000000" base[SELECTED] = "#000000" base[INSENSITIVE]= "#000000" text[NORMAL] = "#000000" text[ACTIVE] = "#000000" text[PRELIGHT] = "#000000" text[SELECTED] = "#000000" text[INSENSITIVE]= "#000000" } style "theme-textview" { text[NORMAL] = "#000000" text[ACTIVE] = "#000000" text[PRELIGHT] = "#000000" text[SELECTED] = "#000000" text[INSENSITIVE] = "#434648" bg[NORMAL] = "#ffffff" bg[ACTIVE] = "#ffffff" bg[PRELIGHT] = "#ffffff" bg[SELECTED] = "#ffffff" bg[INSENSITIVE] = "#ffffff" fg[NORMAL] = "#ffffff" fg[ACTIVE] = "#ffffff" fg[PRELIGHT] = "#ffffff" fg[SELECTED] = "#ffffff" fg[INSENSITIVE] = "#ffffff" base[NORMAL] = "#ffffff" base[ACTIVE] = "#ffffff" base[PRELIGHT] = "#ffffff" base[SELECTED] = "#ff9a00" base[INSENSITIVE] = "#ffffff" } style "theme-clist" { text[NORMAL] = "#000000" text[ACTIVE] = "#000000" text[PRELIGHT] = "#000000" text[SELECTED] = "#000000" text[INSENSITIVE] = "#434648" bg[NORMAL] = "#353438" bg[ACTIVE] = "#ff9a00" bg[PRELIGHT] = "#ff9a00" bg[SELECTED] = "#ff9a00" bg[INSENSITIVE] = "#ffffff" fg[NORMAL] = "#000000" fg[ACTIVE] = "#ff9a00" fg[PRELIGHT] = "#ff9a00" fg[SELECTED] = "#fdff00" fg[INSENSITIVE] = "#757575" base[NORMAL] = "#ffffff" base[ACTIVE] = "#fdff00" base[PRELIGHT] = "#000000" base[SELECTED] = "#fdff00" base[INSENSITIVE] = "#757575" } style "theme-label" { bg[NORMAL] = "#414143" bg[ACTIVE] = "#c19676" bg[PRELIGHT] = "#7f4426" bg[SELECTED] = "#000000" bg[INSENSITIVE] = "#434346" fg[NORMAL] = "#000000" fg[INSENSITIVE] = "#434346" fg[PRELIGHT] = "#000000" fg[SELECTED] = "#000000" fg[ACTIVE] = "#000000" text[NORMAL] = "#ffffff" text[INSENSITIVE] = "#434346" text[PRELIGHT] = "#ffffff" text[SELECTED] = "#ffffff" text[ACTIVE] = "#ffffff" base[NORMAL] = "#000000" base[INSENSITIVE] = "#00ff00" base[PRELIGHT] = "#0000ff" base[ACTIVE] = "#f39638" } style "theme-button-label" { bg[NORMAL] = "#414143" bg[ACTIVE] = "#c19676" bg[PRELIGHT] = "#7f4426" bg[SELECTED] = "#000000" bg[INSENSITIVE] = "#434346" fg[NORMAL] = "#ffffff" fg[INSENSITIVE] = "#434346" fg[PRELIGHT] = "#ffffff" fg[SELECTED] = "#ffffff" fg[ACTIVE] = "#ffffff" text[NORMAL] = "#000000" text[INSENSITIVE] = "#434346" text[PRELIGHT] = "#000000" text[SELECTED] = "#000000" text[ACTIVE] = "#000000" base[NORMAL] = "#000000" base[INSENSITIVE] = "#00ff00" base[PRELIGHT] = "#0000ff" base[SELECTED] = "#ff00ff" base[ACTIVE] = "#ffff00" } style "theme-button-check-radio-label" { bg[NORMAL] = "#414143" bg[ACTIVE] = "#c19676" bg[PRELIGHT] = "#7f4426" bg[SELECTED] = "#000000" bg[INSENSITIVE] = "#434346" fg[NORMAL] = "#000000" fg[INSENSITIVE] = "#434346" fg[PRELIGHT] = "#000000" fg[SELECTED] = "#000000" fg[ACTIVE] = "#000000" text[NORMAL] = "#ffffff" text[INSENSITIVE] = "#434346" text[PRELIGHT] = "#ffffff" text[SELECTED] = "#000000" text[ACTIVE] = "#ffffff" base[NORMAL] = "#000000" base[INSENSITIVE] = "#00ff00" base[PRELIGHT] = "#0000ff" base[SELECTED] = "#ff00ff" base[ACTIVE] = "#ffff00" } style "theme-table" { bg[NORMAL] = "#848484" bg[ACTIVE] = "#c19676" bg[PRELIGHT] = "#7f4426" bg[SELECTED] = "#000000" bg[INSENSITIVE] = "#434346" } style "theme-iconview" { GtkWidget::focus-line-width=1 bg[NORMAL] = "#000000" bg[ACTIVE] = "#c19676" bg[PRELIGHT] = "#c19676" bg[SELECTED] = "#c19676" bg[INSENSITIVE] = "#969696" fg[NORMAL] = "#ffffff" fg[INSENSITIVE] = "#ffffff" fg[PRELIGHT] = "#ffffff" fg[SELECTED] = "#ffffff" fg[ACTIVE] = "#ffffff" text[NORMAL] = "#000000" text[INSENSITIVE] = "#434346" text[PRELIGHT] = "#000000" text[SELECTED] = "#000000" text[ACTIVE] = "#000000" base[NORMAL] = "#ffffff" base[INSENSITIVE] = "#434346" base[PRELIGHT] = "#FAD184" base[SELECTED] = "#FAD184" base[ACTIVE] = "#FAD184" } # Set Widget styles class "GtkWidget" style "theme-default" class "GtkScale" style "theme-scale" class "GtkRange" style "theme-range" class "GtkPaned" style "theme-paned" class "GtkFrame" style "theme-frame" class "GtkMenu" style "theme-menu" class "GtkMenuBar" style "theme-menubar" class "GtkEntry" style "theme-entry" class "GtkProgressBar" style "theme-progressbar" class "GtkToolbar" style "theme-toolbar" class "GtkSeparator" style "theme-wide" class "GtkCalendar" style "theme-calendar" class "GtkTable" style "theme-table" widget_class "*<GtkMenuItem>*" style "theme-menu-item" widget_class "*<GtkMenuBar>.<GtkMenuItem>*" style "theme-menubar-item" widget_class "*<GtkSeparatorMenuItem>*" style "theme-separator-menu-item" widget_class "*<GtkLabel>" style "theme-label" widget_class "*<GtkButton>" style "theme-button" widget_class "*<GtkButton>*<GtkLabel>*" style "theme-button-label" widget_class "*<GtkCheckButton>" style "theme-check-radio-buttons" widget_class "*<GtkToggleButton>.<GtkLabel>*" style "theme-button" widget_class "*<GtkCheckButton>.<GtkLabel>*" style "theme-button-check-radio-label" widget_class "*<GtkRadioButton>.<GtkLabel>*" style "theme-button-check-radio-label" widget_class "*<GtkTextView>" style "theme-textview" widget_class "*<GtkList>" style "theme-textview" widget_class "*<GtkCList>" style "theme-clist" widget_class "*<GtkIconView>" style "theme-iconview" widget_class "*<GtkHandleBox>" style "theme-handlebox" widget_class "*<GtkNotebook>" style "theme-notebook" widget_class "*<GtkNotebook>*<GtkEventBox>" style "theme-notebook" widget_class "*<GtkNotebook>*<GtkDrawingArea>" style "theme-notebook" widget_class "*<GtkNotebook>*<GtkLayout>" style "theme-notebook" widget_class "*<GtkNotebook>*<GtkViewport>" style "theme-notebook" widget_class "*<GtkNotebook>.<GtkLabel>*" style "theme-notebook" #for tabs # Combo Box Stuff widget_class "*<GtkCombo>*" style "theme-combo" widget_class "*<GtkComboBox>*<GtkButton>" style "theme-combo-box" widget_class "*<GtkComboBoxEntry>*" style "theme-entry-combo-box" widget_class "*<GtkSpinButton>*" style "theme-spin-button" widget_class "*<GtkSpinButton>*<GtkArrow>*" style:highest "theme-tree-arrow" # Tool Tips Stuff widget "gtk-tooltip*" style "theme-tooltips" # Tree View Stuff widget_class "*<GtkTreeView>.<GtkButton>*" style "theme-tree" widget_class "*<GtkCTree>.<GtkButton>*" style "theme-tree" widget_class "*<GtkList>.<GtkButton>*" style "theme-tree" widget_class "*<GtkCList>.<GtkButton>*" style "theme-tree" # For arrow bg widget_class "*<GtkTreeView>.<GtkButton>*<GtkArrow>" style "theme-tree-arrow" widget_class "*<GtkCTree>.<GtkButton>*<GtkArrow>" style "theme-tree-arrow" widget_class "*<GtkList>.<GtkButton>*<GtkArrow>" style "theme-tree-arrow" ####################################################### ## GNOME specific ####################################################### widget_class "*.ETree.ECanvas" style "theme-tree" widget_class "*.ETable.ECanvas" style "theme-tree" style "panelbuttons" = "theme-button" { # As buttons are draw lower this helps center text xthickness = 3 ythickness = 3 } widget_class "*Panel*<GtkButton>*" style "panelbuttons" style "murrine-fg-is-text-color-workaround" { text[NORMAL] = "#000000" text[ACTIVE] = "#fdff00" text[SELECTED] = "#fdff00" text[INSENSITIVE] = "#757575" bg[SELECTED] = "#b85e03" bg[ACTIVE] = "#b85e03" bg[SELECTED] = "#b85e03" fg[SELECTED] = "#ffffff" fg[NORMAL] = "#ffffff" fg[ACTIVE] = "#ffffff" fg[INSENSITIVE] = "#434348" fg[PRELIGHT] = "#ffffff" base[SELECTED] = "#ff9a00" base[NORMAL] = "#ffffff" base[ACTIVE] = "#ff9a00" base[INSENSITIVE] = "#434348" base[PRELIGHT] = "#ffffff" } widget_class "*.<GtkTreeView>*" style "murrine-fg-is-text-color-workaround" style "murrine-combobox-text-color-workaround" { text[NORMAL] = "#FFFFF" text[PRELIGHT] = "#FFFFF" text[SELECTED] = "#FFFFF" text[ACTIVE] = "#FFFFF" text[INSENSITIVE] = "#FFFFF" } widget_class "*.<GtkComboBox>.<GtkCellView>" style "murrine-combobox-text-color-workaround" style "murrine-menuitem-text-is-fg-color-workaround" { bg[NORMAL] = "#0000ff" text[NORMAL] = "#ffffff" text[PRELIGHT] = "#ffffff"#"#FD7D00" text[SELECTED] = "#ffffff"#"#ff0000"# @selected_fg_color text[ACTIVE] = "#ffffff"#"#ff0000"# "#FD7D00" text[INSENSITIVE] = "#ffffff"#ff0000"# "#414143" } widget "*.gtk-combobox-popup-menu.*" style "murrine-menuitem-text-is-fg-color-workaround"

  Read the article

• PHP form auto response

  - by Mark

  Hi, I am using the following php code which has been given to me, it works fine, apart from the auto response bit. I know its not a lot of code I just dont know how to do it or why it snot working. Any help would be appreciated. thanks in advance. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title> - Contact Us</title> <!-- css --> <link rel="stylesheet" type="text/css" href="css/reset.css" /> <link rel="stylesheet" type="text/css" href="css/styles.css" /> <link rel="stylesheet" type="text/css" href="css/colorbox.css" /> <!-- javascript libraries --> <?php require_once('includes/js.php'); ?> </head> <body> <?php //FIll out the settings below before using this script $your_email = "(email address)"; $website = "(website name)"; //BOTS TO BLOCK $bots = "/(Indy|Blaiz|Java|libwww-perl|Python|OutfoxBot|User-Agent|PycURL|AlphaServer|T8Abot|Syntryx|WinHttp|WebBandit|nicebot)/i"; //Check if known bot is visiting if (preg_match($bots, $_SERVER["HTTP_USER_AGENT"])) { exit ("Sorry bots are not allowed here!"); } //Known Exploits $exploits = "/(content-type|bcc:|cc:|from:|reply-to:|javascript|onclick|onload)/i"; //Spam words $spam_words = "/(viagra|poker|blackjack|porn|sex)/i"; // BAD WORDS $words = "/( bitch|dick|pussy|pussies|ass|fuck|cum|cumshot|cum shot| gangbang|gang bang|god dammit|goddammit|viagra|anus|analsex )/i"; //BAD WORD/SPAM WORD/EXPLOIT BLOCKER function wordBlock($word) { //Make variables global global $words; global $exploits; global $spam_words; if (preg_match($words, $word)) { $word = preg_replace($words, "#####", $word); } if(preg_match($exploits,$word)){ $word = preg_replace($exploits,"",$word); } if(preg_match($spam_words,$word)){ $word = preg_replace($spam_words,"$$$$",$word); } return $word; } //CLean data function function dataClean($data) { $data = stripslashes(trim(rawurldecode(strip_tags($data)))); return $data; } //CREATE MAIN VARIABLES $name = (isset ($_POST['name'])) ? dataClean($_POST['name']) : FALSE; $company = (isset ($_POST['company'])) ? dataClean($_POST['company']) : FALSE; $address = (isset ($_POST['address'])) ? dataClean($_POST['address']) : FALSE; $postcode = (isset ($_POST['postcode'])) ? dataClean($_POST['postcode']) : FALSE; $phone = (isset ($_POST['phone'])) ? dataClean($_POST['phone']) : FALSE; $email = (isset ($_POST['email'])) ? dataClean($_POST['email']) : FALSE; $comment = (isset ($_POST['message'])) ? wordBlock(dataClean($_POST['message'])) : FALSE; $submit = (isset ($_POST['send'])) ? TRUE : FALSE; $email_check = "/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/i"; //$ip = $_SERVER["REMOTE_ADDR"]; $errors = array(); //Check if send button was clicked if ($submit) { if (!$name) { $errors[] = "Please enter a name!"; } if ($name) { if (!ereg("^[A-Za-z' -]*$", $name)) { $errors[] = "You may not use special characters in the name field!"; } } if (!$email) { $errors[] = "Please enter an email address!"; } if ($email) { if (!preg_match($email_check, $email)) { $errors[] = "The E-mail you entered is invalid!"; } } /* if (!$subject) { $errors[] = "Please enter an email subject!"; } */ if (!$comment) { $errors[] = "Please don't leave the message field blank!"; } //Check if any errors are present if (count($errors) > 0) { foreach ($errors AS $error) { print "&bull; $error <br />"; } } else { //MESSAGE TO SEND TO ADMIN //Create main headers $headers = "From: " . $website . " <$your_email> \n"; $headers .= "Reply-to:" . $email . " \n"; $headers .= "MIME-Version: 1.0\n"; $headers .= "Content-Transfer-Encoding: 8bit\n"; $headers .= "Content-Type: text/html; charset=UTF-8\n"; $message = ""; $message .= "<h1>New E-Mail From " . $website . "</h1><br /><br />"; $message .= "<b>Name:</b> " . $name . "<br />"; $message .= "<b>Company:</b> " . $company . "<br />"; $message .= "<b>Address:</b> " . $address . "<br />"; $message .= "<b>Postcode:</b > " . $postcode . "<br />"; $message .= "<b>Phone No:</b> " . $phone . "<br />"; $message .= "<b>E-mail:</b> " . $email . "<br />"; $message .= "<b>Message:</b> " . $comment . "<br />"; //E-mails subject $mail_subject = "Message from " . $website . ""; /* CHECK TO BE SURE FIRST E-MAIL TO ADMIN IS A SUCCESS AND SEND EMAIL TO ADMIN OTHERWISE DON'T SEND AUTO RESPONCE */ if (mail($your_email, $mail_subject, $message, $headers)) { //UNSET ALL VARIABLES unset ($name, $email, $company, $address, $postcode, $phone, $comment, $_REQUEST); //JAVASCRIPT SUCCESS MESSAGE echo " <script type='text/javascript' language='JavaScript'> alert('Your message has been sent'); </script> "; //SUCCESS MESSAGE TO SHOW IF JAVASCRIPT IS DISABLED echo "<noscript><p>THANK YOU YOUR MESSAGE HAS BEEN SENT</p></noscript>"; /* -----------------END MAIL BLOCK FOR SENDING TO ADMIN AND START AUTO RESPONCE SEND----------------- */ //AUTO RESPONCE MESSAGE //Create main headers $headers = "From: " . $website . " <$your_email> \n"; $headers .= "Reply-to:" . $your_email . " \n"; $headers .= "MIME-Version: 1.0\n"; $headers .= "Content-Transfer-Encoding: 8bit\n"; $headers .= "Content-Type: text/html; charset=UTF-8\n"; $message = ""; $message .= "<h1>Thank You For Contacting Us </h1><br /><br />"; $message .= "On behalf of <b>" . $website . "</b> we wanna thank you for contacting us and to let you know we will respond to your message as soon as possible thank you again."; //E-mails subject $mail_subject = "Thank you for contacting " . $website . ""; //Send the email mail($email, $mail_subject, $message, $headers); /* -----------------END MAIL BLOCK FOR SENDING AUTO RESPONCE ----------------- */ } else { echo " <script type='text/javascript' language='JavaScript'> alert('Sorry could not send your message'); </script> "; echo "<noscript><p style='color:red;'>SORRY COULD NOT SEND YOUR MESSAGE</p></noscript>"; } } } ?> <div id="wrapper"> <div id="grad_overlay"> <!-- Header --> <div id="header"> <a href="index.php" title="Regal Balustrades"><img src="images/regal_logo.png" alt="Regal Balustrades" /></a> <div id="strapline"> <img src="images/strapline.png" alt="Architectural metalwork systems" /> </div> </div> <!-- Navigation --> <div id="nav"> <?php require_once('includes/nav.php'); ?> </div> <!-- Content --> <div id="content"> <div id="details"> <p class="getintouch env">Get In Touch</p> <ul class="details"> <li>T. (0117) 935 3888</li> <li>F. (0117) 967 7333</li> <li>E. <a href="mailto:[email protected]" title="Contact via email">[email protected]</a></li> </ul> <p class="whereto hse">Where To Find Us</p> <ul class="details"> <li>Regal Balustrades</li> <li>Regal House, </li> <li>Honey Hill Road,</li> <li>Kingswood, </li> <li>Bristol BS15 4HG</li> </ul> </div> <div id="contact"> <h1>Contact us</h1> <p>Please use this form to request further information about Regal Balustrades and our services. To speak to a member of our staff in person, please call us on 0117 9353888</p> <div id="form"> <form method='POST' action='<?php echo "".$_SERVER['PHP_SELF'].""; ?>'> <p class='form-element'> <label for='name'>Name:</label> <input type='text' name='name' value='<?php echo "" . $_REQUEST['name'] . "";?>' /> </p> <p class='form-element'> <label for='company'>Company:</label> <input type='text' name='company' value='<?php echo "" . $_REQUEST['company'] . "";?>' /> </p> <p class='form-element'> <label for='address'>Address:</label> <textarea name='address' rows='5' id='address' class='address' ><?php echo "" . $_REQUEST['address'] . "";?></textarea> </p> <p class='form-element'> <label for='postcode'>Postcode:</label> <input type='text' name='postcode' value='<?php echo "" . $_REQUEST['postcode'] . "";?>' /> </p> <p class='form-element'> <label for='phone'>Telephone:</label> <input type='text' name='phone' value='<?php echo "" . $_REQUEST['phone'] . "";?>' /> </p> <p class='form-element'> <label for='email'>Email:</label> <input type='text' name='email' value='<?php echo "" . $_REQUEST['email'] . "";?>' /> </p> </div> <div id='form-right'> <p class='form-element'> <label for='message'>Enquiry:</label> <textarea name='message' class='enquiry' id='enquiry' rows='5' cols='40' ><?php echo "" . $_REQUEST['message'] . "";?></textarea> </p> <p class='form-element'> <input type='submit' class='submit' name='send' value='Send message' /> </p> </div> <p class='nb'><em>We will respond as soon as possible.</em></p> </form> </div> </div> </div> </div> </div> <!-- Footer --> <div id="footer-container"> <?php require_once('includes/footer.php'); ?> </div> <!-- js functions --> <script> $(document).ready(function() { $("ul#navig li:nth-child(6)").addClass("navon"); }); </script> </body> </html>

  Read the article

• Why are pieces of my HTML showing up on the page and breaking it? Is it PHP related?

  - by Jason Rhodes

  I've been building a site in PHP, HTML, CSS, and using a healthy dose of jQuery javascript. The site looks absolutely fine on my Mac browsers, but for some reason, when my client uses PC Safari, she's seeing strange bits of my HTML show up on the page. Here are some (small) screenshot examples: Figure 1: This one is just a closing </li> tag that should've been on the Media li element. Not much harm done, but strange. Figure 2: Here this was part of <div class='submenu'> and since the div tag didn't render properly, the entire contents of that div don't get styled correctly by CSS. Figure 3: This last example shows what should have been <a class='top current' href=... but for some reason half of the HTML tag stops being rendered and just gets printed out. So the rest of that list menu is completely broken. Here's the code from the header.php file itself. The main navigation section (seen in the screenshots) is further down, marked by a line of asterisks if you want to skip there. <?php // Setting up location variables if(isset($_GET['page'])) { $page = Page::find_by_slug($_GET['page']); } elseif(isset($_GET['post'])) { $page = Page::find_by_id(4); } else { $page = Page::find_by_id(1); } $post = isset($_GET['post']) ? Blogpost::find_by_slug($_GET['post']) : false; $front = $page->id == 1 ? true : false; $buildblog = $page->id == 4 ? true : false; $eventpage = $page->id == 42 ? true : false; // Setting up content edit variables $edit = isset($_GET['edit']) ? true : false; $preview = isset($_GET['preview']) ? true : false; // Finding page slug value $pageslug = $page->get_slug($loggedIn); ?> <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title> <?php if(!$post) { if($page->id != 1) { echo $page->title." | "; } echo $database->site_name(); } elseif($post) { echo "BuildBlog | ".$post->title; } ?> </title> <link href="<?php echo SITE_URL; ?>/styles/style.css" media="all" rel="stylesheet" /> <?php include(SITE_ROOT."/scripts/myJS.php"); ?> </head> <body class=" <?php if($loggedIn) { echo "logged"; } else { echo "public"; } if($front) { echo " front"; } ?>"> <?php $previewslug = str_replace("&edit", "", $pageslug); ?> <?php if($edit) { echo "<form id='editPageForm' action='?page={$previewslug}&preview' method='post'>"; } ?> <?php if($edit && !$preview) : // Edit original ?> <div id="admin_meta_nav" class="admin_meta_nav"> <ul class="center nolist"> <li class="title">Edit</li> <li class="cancel"><a class="cancel" href="?page=<?php echo $pageslug; ?>&cancel">Cancel</a></li> <li class="save"><input style='position: relative; z-index: 500' class='save' type="submit" name="newpreview" value="Preview" /></li> <li class="publish"><input style='position: relative; z-index: 500' class='publish button' type="submit" name="publishPreview" value="Publish" /></li> </ul> </div> <?php elseif($preview && !$edit) : // Preview your edits ?> <div id="admin_meta_nav" class="admin_meta_nav"> <ul class="center nolist"> <li class="title">Preview</li> <li class="cancel"><a class="cancel" href="?page=<?php echo $pageslug; ?>&cancel">Cancel</a></li> <li class="save"><a class="newpreview" href="?page=<?php echo $pageslug; ?>&preview&edit">Continue Editing</a></li> <li class="publish"><a class="publish" href="?page=<?php echo $pageslug; ?>&publishLastPreview">Publish</a></li> </ul> </div> <?php elseif($preview && $edit) : // Return to preview and continue editing ?> <div id="admin_meta_nav" class="admin_meta_nav"> <ul class="center nolist"> <li class="title">Edit Again</li> <li class="cancel"><a class="cancel" href="?page=<?php echo $pageslug; ?>&cancel">Cancel</a></li> <li class="save"><input style='position: relative; z-index: 500' class='save button' type="submit" name="newpreview" value="Preview" /></li> <li class="publish"><input style='position: relative; z-index: 500' class='publish button' type="submit" name="publishPreview" value="Publish" /></li> </ul> </div> <?php else : ?> <div id="meta_nav" class="meta_nav"> <ul class="center nolist"> <li><a href="login.php?logout">Logout</a></li> <li><a href="<?php echo SITE_URL; ?>/admin">Admin</a></li> <li><a href="<?php if($front) { echo "admin/?admin=frontpage"; } elseif($event || $eventpage) { echo "admin/?admin=events"; } elseif($buildblog) { if($post) { echo "admin/editpost.php?post={$post->id}"; } else { echo "admin/?admin=blog"; } } else { echo "?page=".$pageslug."&edit"; } ?>">Edit Mode</a></li> <li><a href="<?php echo SITE_URL; ?>/?page=donate">Donate</a></li> <li><a href="<?php echo SITE_URL; ?>/?page=calendar">Calendar</a></li> </ul> <div class="clear"></div> </div> <?php endif; ?> <div id="public_meta_nav" class="public_meta_nav"> <div class="center"> <ul class="nolist"> <li><a href="<?php echo SITE_URL; ?>/?page=donate">Donate</a></li> <li><a href="<?php echo SITE_URL; ?>/?page=calendar">Calendar</a></li> </ul> <div class="clear"></div> </div> </div> * Main Navigation Section, as seen in screenshots above, starts here ** <div class="header"> <div class="center"> <a class="front_logo" href="<?php echo SITE_URL; ?>"><?php echo $database->site_name(); ?></a> <ul class="nolist main_nav"> <?php $tops = Page::get_top_pages(); $topcount = 1; foreach($tops as $top) { $current = $top->id == $topID ? true : false; $title = $top->title == "Front Page" ? "Home" : ucwords($top->title); $url = ($top->title == "Front Page" || !$top->get_slug($loggedIn)) ? SITE_URL : SITE_URL . "/?page=".$top->get_slug($loggedIn); if(isset($_GET['post']) && $top->id == 1) { $current = false; } if(isset($_GET['post']) && $top->id == 4) { $current = true; } echo "<li"; if($topcount > 3) { echo " class='right'"; } echo "><a class='top"; if($current) { echo " current"; } echo "' href='{$url}'>{$title}</a>"; if($children = Page::get_children($top->id)) { echo "<div class='submenu'>"; echo "<div class='corner-helper'></div>"; foreach($children as $child) { echo "<ul class='nolist level1"; if(!$subchildren = Page::get_children($child->id)) { echo " nochildren"; } echo "'>"; $title = ucwords($child->title); $url = !$child->get_slug($loggedIn) ? SITE_URL : SITE_URL . "/?page=".$child->get_slug($loggedIn); if($child->has_published() || $loggedIn) { echo "<li><a class='title' href='{$url}'>{$title}</a>"; if($subchildren = Page::get_children($child->id)) { echo "<ul class='nolist level2'>"; foreach($subchildren as $subchild) { if($subchild->has_published() || $loggedIn) { $title = ucwords($subchild->title); $url = !$subchild->get_slug($loggedIn) ? SITE_URL : SITE_URL . "/?page=".$subchild->get_slug($loggedIn); echo "<li><a href='{$url}'>{$title}</a>"; } } echo "</ul>"; } echo "</li>"; } echo "</ul>"; } echo "</div>"; } echo "</li>"; $topcount++; } ?> </ul> <div class="clear"></div> </div> </div> <div id="mediaLibraryPopup" class="mediaLibraryPopup"> <h3>Media Library</h3> <ul class="box nolist"></ul> <div class="clear"></div> <a href="#" class="cancel">Cancel</a> </div> <div class="main_content"> Does anyone have any idea why the PC Safari browser would be breaking things up like this? I'm assuming it's PHP related but I cannot figure out why it would do that.

  Read the article

• Internet Explorer 8 Standards Mode Results In Broken Blank Page

  - by Agent_9191

  I'm running into a weird issue that I'm struggling to figure out what's causing the page to break. I have an internal website that's still under development (thus no link to the page) that works great in Firefox and Internet Explorer 8 in IE 7 Standards mode. But when I force it to IE 8 Standards mode the page will only display the title text in the browser tab and an otherwise completely blank page. It seems so broken that the blank page doesn't even have a context menu. The page generally looks like this: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="IE=8" http-equiv="X-UA-Compatible" /> <title>Page Title</title> <link rel="shortcut icon" href="/Images/favicon.ico" type="image/x-icon" /> <link href="/Style/main.less" rel="stylesheet" type="text/css" /> </head> <body> ... </body> </html> You may notice the .less extension for the stylesheet. This is an ASP.NET MVC application and I'm making use of DotLess. I have the HttpHandler hooked up for it in the web.config. Of course there's some additional info on the page, but (in theory) it shouldn't be causing this issue. I've run the CSS and the HTML through the W3C validators and both have come back as completely valid. I'm trying the arduous task of removing/re-adding elements until it displays, but any insight into what could cause this would help. EDIT: it appears to be something related to the DotLess stylesheet. The resulting CSS is valid according to the W3C CSS validator. EDIT 2: Digging further, and making use of IE's Developer Tools to control the styles, it appears that IE is reading a single statement twice even though it only occurs once in the output. Here's the output of the Less file: a, abbr, acronym, address, applet, b, big, caption, center, cite, code, dd, dfn, div, dl, dt, em, fieldset, font, form, html, i, iframe, img, kbd, label, legend, li, object, pre, s, samp, small, span, strike, strong, sub, sup, tbody, td, tfoot, th, thead, tr, tt, u, var { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } blockquote, q { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; quotes: none; } body { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; line-height: 1; width: 100%; background: #efebde; min-width: 600px; } del { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-decoration: line-through; } h1 { border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 2em; margin: .8em 0 .2em 0; padding: 0; } h2 { border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 1.8em; margin: .8em 0 .2em 0; padding: 0; } h3 { border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 1.6em; margin: .8em 0 .2em 0; padding: 0; } h4 { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 1.4em; } h5 { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 1.2em; } h6 { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 1em; } ins { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-decoration: none; } ol, ul { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; list-style: none; } p { border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; margin: .4em 0 .8em 0; padding: 0; } table { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; border-collapse: collapse; border-spacing: 0; } blockquote:before, blockquote:after, q:before, q:after { content: none; } :focus { outline: 0; } .bold { font-weight: bold; } .systemFont { font-family: Arial; } .labelled { font-style: italic; } .groovedBorder { border-color: #adaa9c; border-style: groove; border-width: medium; } #header, #footer { clear: both; float: left; width: 100%; } #header p, #header h1, #header h2 { padding: .4em 15px 0 15px; margin: 0; } #header ul { clear: left; float: left; width: 100%; list-style: none; margin: 10px 0 0 0; padding: 0; } #header ul li { display: inline; list-style: none; margin: 0; padding: 0; } #header ul li a { background: #eeeeee; display: block; float: left; left: 15px; line-height: 1.3em; margin: 0 0 0 1px; padding: 3px 10px; position: relative; text-align: center; text-decoration: none; } #header ul li a span { display: block; } #header ul li a:hover { background: #336699; } #header ul li a.active, #header ul li a.active:hover { background: black; font-weight: bold; } #header #logindisplay { float: right; padding-top: .5em; padding-bottom: .5em; padding-right: 1em; padding-left: 1em; } #title h1 { font-family: Arial; font-style: italic; font-size: 175%; text-align: center; margin-top: 1%; } .col1 { font-family: Arial; border-color: #adaa9c; border-style: groove; border-width: medium; min-height: 350px; float: left; overflow: hidden; position: relative; padding-top: 0; padding-bottom: 1em; padding-left: 0; padding-right: 0; } .col1 div.logo { text-align: center; } .col3 { font-family: Arial; border-color: #adaa9c; border-style: groove; border-width: medium; float: left; overflow: hidden; position: relative; } #layoutdims { clear: both; background: #eeeeee; margin: 0; padding: 6px 15px !important; text-align: right; } #company { padding-left: 10px; padding-top: 10px; margin: 0; } #company span { display: block; padding-left: 1em; } #version { padding-right: 1em; padding-top: 1em; text-align: center; } #menu li { padding: 6px; border-color: #adaa9c; border-style: groove; border-width: medium; min-width: 108px; } #menu li a.ciApp { text-decoration: none; font-size: 112.5%; font-weight: bold; font-family: Arial; color: black; } #menu li a.ciApp span { vertical-align: top; } .welcomemessage { font-size: 60.95%; } .newFeatures { overflow-y: scroll; max-height: 300px; } #newsfeed div .newsLabel { color: red; font-size: 60.95%; font-style: italic; } /************************************************************************************** This statement appears twice in Developer Tools. Disabling one disables both. Disabling it also causes the page to render. Turning it on and the page disappears again **************************************************************************************/ #newsfeed div .newFeatures { margin-left: 1em; margin-right: 1em; font-size: 60.95%; } /************************************************************************************** **************************************************************************************/ .colmask { clear: both; float: left; position: relative; overflow: hidden; width: 100%; } .colright, .colmid, .colleft { float: left; position: relative; width: 100%; } .col2 { float: left; overflow: hidden; position: relative; padding-top: 0; padding-bottom: 1em; padding-left: 0; padding-right: 0; } .threecol .colmid { right: 33%; } .threecol .colleft { right: 34%; } .threecol .col1 { width: 33%; left: 100%; } .threecol .col2 { width: 32%; left: 34%; } .threecol .col3 { width: 32%; left: 68.5%; } Notice the #newsfeed div .newFeatures identifier near the end. I don't know what's causing that as it's only appearing once in the output stream. Here's an image of it too: EDIT 3: It appears that even though it duplicates that particular selector, if I change the font-size to a whole number like 61% instead of the current 60.95% (that specific to defaultly match the existing desktop app as closely as possible) it works fine. So something specific to IE duplicating that selector block and the font-size being a percentage specific to two decimal places appears to kill IE8 Standards mode completely.

  Read the article

• Magento My Account Layout XML Problem

  - by Remy

  Hi there, I'm having issues getting the customer.xml layout file to work properly for the customer's "my account" pages. The navigation links and the previously ordered items that are usually on the left hand side of the page won't show up on the page, but if I change the reference name to "content" in the xml file, it shows up (except it's obviously then on the right hand side). I've checked the template it's referencing (2columns-left.phtml), and the getChildHtml('left') is there in the correct position. The block that's causing the problem: <customer_account> <!-- Mage_Customer --> <reference name="root"> <action method="setTemplate"><template>page/2columns-left.phtml</template></action> </reference> <reference name="left"> <action method="unsetChild"><name>catalog.navigation.all</name></action> <action method="unsetChild"><name>callout.sendcard</name></action> <action method="unsetChild"><name>callout.specialorder</name></action> <block type="customer/account_navigation" name="customer_account_navigation" before="-" template="customer/account/navigation.phtml"> <action method="addLink" translate="label" module="customer"><name>account</name><path>customer/account/</path><label>Account Dashboard</label></action> <action method="addLink" translate="label" module="customer"><name>account_edit</name><path>customer/account/edit/</path><label>Account Information</label></action> <action method="addLink" translate="label" module="customer"><name>address_book</name><path>customer/address/</path><label>Address Book</label></action> </block> <block type="sales/reorder_sidebar" name="sale.reorder.sidebar" as="reorder" template="sales/reorder/sidebar.phtml"/> <remove name="tags_popular"/> </reference> </customer_account> This was basically copied straight over from another one of our sites where this works 100%. I've tried everything I can think of (changing the name of the reference in both the template and the layout xml, for example) to no avail. The templates that the layout is referencing are obviously working because they do show up when put into the "content" area. This installation of magento is version 1.3.1.1. I appreciate any advice you have to give me... *Update: I tried changing the reference to "global_messages", and it doesn't show there either. It only seems to work in the "content" section.* Update 2: These are the results of using the "showLayout=page" query string on the page when used with Alan Storm's very handy debugging module (which you'll find in his answer below). <?xml version="1.0"?> <layout><block type="page/html" name="root" output="toHtml" template="page/3columns.phtml"> <block type="page/html_head" name="head" as="head"> <action method="addJs"> <script>prototype/prototype.js</script> </action> <action method="addJs"> <script>prototype/validation.js</script> </action> <action method="addJs"> <script>paypoint/validation.js</script> </action> <action method="addJs"> <script>scriptaculous/builder.js</script> </action> <action method="addJs"> <script>scriptaculous/effects.js</script> </action> <action method="addJs"> <script>scriptaculous/dragdrop.js</script> </action> <action method="addJs"> <script>scriptaculous/controls.js</script> </action> <action method="addJs"> <script>scriptaculous/slider.js</script> </action> <action method="addJs"> <script>varien/js.js</script> </action> <action method="addJs"> <script>varien/form.js</script> </action> <action method="addJs"> <script>varien/menu.js</script> </action> <action method="addJs"> <script>mage/translate.js</script> </action> <action method="addJs"> <script>mage/cookies.js</script> </action> <action method="addCss"> <stylesheet>css/reset.css</stylesheet> </action> <action method="addCss"> <stylesheet>css/boxes.css</stylesheet> </action> <action method="addCss"> <stylesheet>css/clears.css</stylesheet> </action> <action method="addCss"> <stylesheet>css/menu.css</stylesheet> </action> <action method="addCss"> <stylesheet>css/calendar-blue.css</stylesheet> </action> <action method="addCss"> <stylesheet>css/styles.css</stylesheet> </action> <action method="addItem"> <type>skin_css</type> <name>css/iestyles.css</name> <params/> <if>IE</if> </action> <action method="addItem"> <type>skin_css</type> <name>css/ie7.css</name> <params/> <if>IE 7</if> </action> <action method="addItem"> <type>skin_css</type> <name>css/ie7minus.css</name> <params/> <if>lt IE 7</if> </action> <action method="addItem"> <type>js</type> <name>lib/ds-sleight.js</name> <params/> <if>lt IE 7</if> </action> <action method="addItem"> <type>js</type> <name>varien/iehover-fix.js</name> <params/> <if>lt IE 7</if> </action> <action method="addCss"> <stylesheet>css/print.css</stylesheet> <params>media="print"</params> </action> </block> <block type="page/html_header" name="header" as="header"> <block type="page/template_links" name="top.links" as="topLinks"/> <block type="page/switch" name="store_language" as="store_language" template="page/switch/languages.phtml"/> <block type="core/template" name="top.nav" template="page/html/top.nav.phtml"/> </block> <block type="core/messages" name="global_messages" as="global_messages"/> <block type="core/messages" name="messages" as="messages"/> <block type="core/text_list" name="content" as="content"/> <block type="core/text_list" name="right" as="right"/> <block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml"/> <block type="core/text_list" name="before_body_end" as="before_body_end"/> </block> <block type="core/profiler" output="toHtml"/> <reference name="top.links"> <action method="addLink" translate="label title" module="customer"> <label>My Account</label> <url helper="customer/getAccountUrl"/> <title>My Account</title> <prepare/> <urlParams/> <position>10</position> </action> </reference> <reference name="root"> <action method="setTemplate"> <template>page/2columns-left.phtml</template> </action> </reference> <reference name="top.menu"> <block type="catalog/navigation" name="catalog.topnav" template="catalog/navigation/top.phtml"/> </reference> <reference name="footer_links"> <action method="addLink" translate="label title" module="catalog" ifconfig="catalog/seo/site_map"> <label>Site Map</label> <url helper="catalog/map/getCategoryUrl"/> <title>Site Map</title> </action> </reference> <reference name="footer_links"> <action method="addLink" translate="label title" module="catalogsearch" ifconfig="catalog/seo/search_terms"> <label>Search Terms</label> <url helper="catalogsearch/getSearchTermUrl"/> <title>Search Terms</title> </action> <action method="addLink" translate="label title" module="catalogsearch"> <label>Advanced Search</label> <url helper="catalogsearch/getAdvancedSearchUrl"/> <title>Advanced Search</title> </action> </reference> <reference name="top.links"> <block type="checkout/links" name="checkout_cart_link"> <action method="addCartLink"/> <action method="addCheckoutLink"/> </block> </reference> <reference name="footer"> <block type="cms/block" name="cms_footer_links" before="footer_links"> <action method="setBlockId"> <block_id>footer_links</block_id> </action> </block> </reference> <reference name="left"> <block type="tag/popular" name="tags_popular" template="tag/popular.phtm" ignore="1"> <action method="setTemplate"> <template>tag/popular.phtml</template> </action> </block> </reference> <reference name="left"> </reference> <reference name="before_body_end"> <block type="googleanalytics/ga" name="google_analytics" as="google_analytics"/> </reference> <reference name="footer_links"> <action method="addLink" translate="label title" module="contacts" ifconfig="contacts/contacts/enabled"> <label>Contact Us</label> <url>contact-us</url> <title>Contact Us</title> <prepare>true</prepare> </action> </reference> <reference name="footer_links"> <action method="addLink" translate="label title" module="rss" ifconfig="rss/config/active"> <label>RSS</label> <url>rss</url> <title>RSS testing</title> <prepare>true</prepare> <urlParams/> <position/> <li/> <a>class="link-feed"</a> </action> </reference> <reference name="wishlist_sidebar"> <action method="addPriceBlockType"> <type>bundle</type> <block>bundle/catalog_product_price</block> <template>bundle/catalog/product/price.phtml</template> </action> </reference> <reference name="cart_sidebar"> <action method="addItemRender"> <type>bundle</type> <block>bundle/checkout_cart_item_renderer</block> <template>checkout/cart/sidebar/default.phtml</template> </action> </reference> <reference name="root"> <action method="setTemplate"> <template>page/2columns-left.phtml</template> </action> </reference> <reference name="left"> <action method="unsetChild"> <name>catalog.navigation.all</name> </action> <action method="unsetChild"> <name>callout.sendcard</name> </action> <action method="unsetChild"> <name>callout.specialorder</name> </action> <block type="customer/account_navigation" name="customer_account_navigation" before="-" template="customer/account/navigation.phtml"> <action method="addLink" translate="label" module="customer"> <name>account</name> <path>customer/account/</path> <label>Account Dashboard</label> </action> <action method="addLink" translate="label" module="customer"> <name>account_edit</name> <path>customer/account/edit/</path> <label>Account Information</label> </action> <action method="addLink" translate="label" module="customer"> <name>address_book</name> <path>customer/address/</path> <label>Address Book</label> </action> </block> <block type="sales/reorder_sidebar" name="sale.reorder.sidebar" as="reorder" template="sales/reorder/sidebar.phtml"/> <remove name="tags_popular"/> </reference> <reference name="customer_account_navigation"> <action method="addLink" translate="label" module="sales"> <name>orders</name> <path>sales/order/history/</path> <label>My Orders</label> </action> </reference> <reference name="customer_account_navigation"> <action method="addLink" translate="label" module="tag"> <name>tags</name> <path>tag/customer/</path> <label>My Tags</label> </action> </reference> <reference name="customer_account_navigation"> <action method="addLink" translate="label" module="newsletter"> <name>newsletter</name> <path>newsletter/manage/</path> <label>Newsletter Subscriptions</label> </action> </reference> <reference name="cart_sidebar"> <action method="addItemRender"> <type>bundle</type> <block>bundle/checkout_cart_item_renderer</block> <template>checkout/cart/sidebar/default.phtml</template> </action> </reference> <update handle="customer_account"/> <reference name="content"> <block type="customer/account_dashboard" name="customer_account_dashboard" template="customer/account/dashboard.phtml"> <block type="customer/account_dashboard_hello" name="customer_account_dashboard_hello" as="hello" template="customer/account/dashboard/hello.phtml"/> <block type="core/template" name="customer_account_dashboard_top" as="top"/> <block type="customer/account_dashboard_info" name="customer_account_dashboard_info" as="info" template="customer/account/dashboard/info.phtml"/> <block type="customer/account_dashboard_newsletter" name="customer_account_dashboard_newsletter" as="newsletter" template="customer/account/dashboard/newsletter.phtml"/> <block type="customer/account_dashboard_address" name="customer_account_dashboard_address" as="address" template="customer/account/dashboard/address.phtml"/> <block type="core/template" name="customer_account_dashboard_info1" as="info1"/> <block type="core/template" name="customer_account_dashboard_info2" as="info2"/> </block> </reference> <reference name="right"> <action method="unsetChild"> <name>catalog_compare_sidebar</name> </action> </reference> <reference name="customer_account_dashboard"> <action method="unsetChild"> <name>top</name> </action> <block type="sales/order_recent" name="customer_account_dashboard_top" as="top" template="sales/order/recent.phtml"/> </reference> <reference name="right"> <action method="unsetChild"> <name>right.poll</name> </action> </reference> <reference name="customer_account_dashboard"> <action method="unsetChild"> <name>customer_account_dashboard_info2</name> </action> <block type="tag/customer_recent" name="customer_account_dashboard_info2" as="info2" template="tag/customer/recent.phtml"/> </reference> <reference name="right"> <action method="unsetChild"> <name>right.newsletter</name> </action> </reference> <reference name="top.links"> <action method="addLink" translate="label title" module="customer"> <label>Log Out</label> <url helper="customer/getLogoutUrl"/> <title>Log Out</title> <prepare/> <urlParams/> <position>100</position> </action> </reference></layout>

  Read the article

• how to use kml file in my code..

  - by zjm1126

  i download a kml file : <?xml version="1.0" encoding="UTF-8"?> <kml xmlns="http://www.opengis.net/kml/2.2"> <Document> <Style id="transGreenPoly"> <LineStyle> <width>1.5</width> </LineStyle> <PolyStyle> <color>7d00ff00</color> </PolyStyle> </Style> <Style id="transYellowPoly"> <LineStyle> <width>1.5</width> </LineStyle> <PolyStyle> <color>7d00ffff</color> </PolyStyle> </Style> <Style id="transRedPoly"> <LineStyle> <width>1.5</width> </LineStyle> <PolyStyle> <color>7d0000ff</color> </PolyStyle> </Style> <Style id="transBluePoly"> <LineStyle> <width>1.5</width> </LineStyle> <PolyStyle> <color>7dff0000</color> </PolyStyle> </Style> <Folder> <name>Placemarks</name> <open>0</open> <Placemark> <name>Simple placemark</name> <description>Attached to the ground. Intelligently places itself at the height of the underlying terrain.</description> <Point> <coordinates>-122.0822035425683,37.42228990140251,0</coordinates> </Point> </Placemark> <Placemark> <name>Descriptive HTML</name> <description><![CDATA[Click on the blue link!<br/><br/> Placemark descriptions can be enriched by using many standard HTML tags.<br/> For example: <hr/> Styles:<br/> <i>Italics</i>, <b>Bold</b>, <u>Underlined</u>, <s>Strike Out</s>, subscript_subscript, superscript^superscript, <big>Big</big>, <small>Small</small>, <tt>Typewriter</tt>, <em>Emphasized</em>, <strong>Strong</strong>, <code>Code</code> <hr/> Fonts:<br/> <font color="red">red by name</font>, <font color="#408010">leaf green by hexadecimal RGB</font> <br/> <font size=1>size 1</font>, <font size=2>size 2</font>, <font size=3>size 3</font>, <font size=4>size 4</font>, <font size=5>size 5</font>, <font size=6>size 6</font>, <font size=7>size 7</font> <br/> <font face=times>Times</font>, <font face=verdana>Verdana</font>, <font face=arial>Arial</font><br/> <hr/> Links: <br/> <a href="http://earth.google.com/">Google Earth!</a> <br/> or: Check out our website at www.google.com <hr/> Alignment:<br/> <p align=left>left</p> <p align=center>center</p> <p align=right>right</p> <hr/> Ordered Lists:<br/> <ol><li>First</li><li>Second</li><li>Third</li></ol> <ol type="a"><li>First</li><li>Second</li><li>Third</li></ol> <ol type="A"><li>First</li><li>Second</li><li>Third</li></ol> <hr/> Unordered Lists:<br/> <ul><li>A</li><li>B</li><li>C</li></ul> <ul type="circle"><li>A</li><li>B</li><li>C</li></ul> <ul type="square"><li>A</li><li>B</li><li>C</li></ul> <hr/> Definitions:<br/> <dl> <dt>Google:</dt><dd>The best thing since sliced bread</dd> </dl> <hr/> Centered:<br/><center> Time present and time past<br/> Are both perhaps present in time future,<br/> And time future contained in time past.<br/> If all time is eternally present<br/> All time is unredeemable.<br/> </center> <hr/> Block Quote: <br/> <blockquote> We shall not cease from exploration<br/> And the end of all our exploring<br/> Will be to arrive where we started<br/> And know the place for the first time.<br/> <i>-- T.S. Eliot</i> </blockquote> <br/> <hr/> Headings:<br/> <h1>Header 1</h1> <h2>Header 2</h2> <h3>Header 3</h3> <h3>Header 4</h4> <h3>Header 5</h5> <hr/> Images:<br/> <i>Remote image</i><br/> <img src="http://code.google.com/apis/kml/documentation/googleSample.png"><br/> <i>Scaled image</i><br/> <img src="http://code.google.com/apis/kml/documentation/googleSample.png" width=100><br/> <hr/> Simple Tables:<br/> <table border="1" padding="1"> <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr> <tr><td>a</td><td>b</td><td>c</td><td>d</td><td>e</td></tr> </table> <br/>]]></description> <Point> <coordinates>-122,37,0</coordinates> </Point> </Placemark> </Folder> <Folder> <name>Google Campus - Polygons</name> <open>0</open> <description>A collection showing how easy it is to create 3-dimensional buildings</description> <Placemark> <name>Building 40</name> <styleUrl>#transRedPoly</styleUrl> <Polygon> <extrude>1</extrude> <altitudeMode>relativeToGround</altitudeMode> <outerBoundaryIs> <LinearRing> <coordinates> -122.0848938459612,37.42257124044786,17 -122.0849580979198,37.42211922626856,17 -122.0847469573047,37.42207183952619,17 -122.0845725380962,37.42209006729676,17 -122.0845954886723,37.42215932700895,17 -122.0838521118269,37.42227278564371,17 -122.083792243335,37.42203539112084,17 -122.0835076656616,37.42209006957106,17 -122.0834709464152,37.42200987395161,17 -122.0831221085748,37.4221046494946,17 -122.0829247374572,37.42226503990386,17 -122.0829339169385,37.42231242843094,17 -122.0833837359737,37.42225046087618,17 -122.0833607854248,37.42234159228745,17 -122.0834204551642,37.42237075460644,17 -122.083659133885,37.42251292011001,17 -122.0839758438952,37.42265873093781,17 -122.0842374743331,37.42265143972521,17 -122.0845036949503,37.4226514386435,17 -122.0848020460801,37.42261133916315,17 -122.0847882750515,37.42256395055121,17 -122.0848938459612,37.42257124044786,17 </coordinates> </LinearRing> </outerBoundaryIs> </Polygon> </Placemark> <Placemark> <name>Building 41</name> <styleUrl>#transBluePoly</styleUrl> <Polygon> <extrude>1</extrude> <altitudeMode>relativeToGround</altitudeMode> <outerBoundaryIs> <LinearRing> <coordinates> -122.0857412771483,37.42227033155257,17 -122.0858169768481,37.42231408832346,17 -122.085852582875,37.42230337469744,17 -122.0858799945639,37.42225686138789,17 -122.0858860101409,37.4222311076138,17 -122.0858069157288,37.42220250173855,17 -122.0858379542653,37.42214027058678,17 -122.0856732640519,37.42208690214408,17 -122.0856022926407,37.42214885429042,17 -122.0855902778436,37.422128290487,17 -122.0855841672237,37.42208171967246,17 -122.0854852065741,37.42210455874995,17 -122.0855067264352,37.42214267949824,17 -122.0854430712915,37.42212783846172,17 -122.0850990714904,37.42251282407603,17 -122.0856769818632,37.42281815323651,17 -122.0860162273783,37.42244918858723,17 -122.0857260327004,37.42229239604253,17 -122.0857412771483,37.42227033155257,17 </coordinates> </LinearRing> </outerBoundaryIs> </Polygon> </Placemark> <Placemark> <name>Building 42</name> <styleUrl>#transGreenPoly</styleUrl> <Polygon> <extrude>1</extrude> <altitudeMode>relativeToGround</altitudeMode> <outerBoundaryIs> <LinearRing> <coordinates> -122.0857862287242,37.42136208886969,25 -122.0857312990603,37.42136935989481,25 -122.0857312992918,37.42140934910903,25 -122.0856077073679,37.42138390166565,25 -122.0855802426516,37.42137299550869,25 -122.0852186221971,37.42137299504316,25 -122.0852277765639,37.42161656508265,25 -122.0852598189347,37.42160565894403,25 -122.0852598185499,37.42168200156,25 -122.0852369311478,37.42170017860346,25 -122.0852643957828,37.42176197982575,25 -122.0853239032746,37.42176198013907,25 -122.0853559454324,37.421852864452,25 -122.0854108752463,37.42188921823734,25 -122.0854795379357,37.42189285337048,25 -122.0855436229819,37.42188921797546,25 -122.0856260178042,37.42186013499926,25 -122.085937287963,37.42186013453605,25 -122.0859428718666,37.42160898590042,25 -122.0859655469861,37.42157992759144,25 -122.0858640462341,37.42147115002957,25 -122.0858548911215,37.42140571326184,25 -122.0858091162768,37.4214057134039,25 -122.0857862287242,37.42136208886969,25 </coordinates> </LinearRing> </outerBoundaryIs> </Polygon> </Placemark> <Placemark> <name>Building 43</name> <styleUrl>#transYellowPoly</styleUrl> <Polygon> <extrude>1</extrude> <altitudeMode>relativeToGround</altitudeMode> <outerBoundaryIs> <LinearRing> <coordinates> -122.0844371128284,37.42177253003091,19 -122.0845118855746,37.42191111542896,19 -122.0850470999805,37.42178755121535,19 -122.0850719913391,37.42143663023161,19 -122.084916406232,37.42137237822116,19 -122.0842193868167,37.42137237801626,19 -122.08421938659,37.42147617161496,19 -122.0838086419991,37.4214613409357,19 -122.0837899728564,37.42131306410796,19 -122.0832796534698,37.42129328840593,19 -122.0832609819207,37.42139213944298,19 -122.0829373621737,37.42137236399876,19 -122.0829062425667,37.42151569778871,19 -122.0828502269665,37.42176282576465,19 -122.0829435788635,37.42176776969635,19 -122.083217411188,37.42179248552686,19 -122.0835970430103,37.4217480074456,19 -122.0839455556771,37.42169364237603,19 -122.0840077894637,37.42176283815853,19 -122.084113587521,37.42174801104392,19 -122.0840762473784,37.42171341292375,19 -122.0841447047739,37.42167881534569,19 -122.084144704223,37.42181720660197,19 -122.0842503333074,37.4218170700446,19 -122.0844371128284,37.42177253003091,19 </coordinates> </LinearRing> </outerBoundaryIs> </Polygon> </Placemark> </Folder> <Folder> <name>LineString</name> <open>0</open> <Placemark> <LineString> <tessellate>1</tessellate> <coordinates> -112.0814237830345,36.10677870477137,0 -112.0870267752693,36.0905099328766,0 </coordinates> </LineString> </Placemark> </Folder> <Folder> <name>GroundOverlay</name> <open>0</open> <GroundOverlay> <name>Large-scale overlay on terrain</name> <description>Overlay shows Mount Etna erupting on July 13th, 2001.</description> <Icon> <href>http://code.google.com/apis/kml/documentation/etna.jpg</href> </Icon> <LatLonBox> <north>37.91904192681665</north> <south>37.46543388598137</south> <east>15.35832653742206</east> <west>14.60128369746704</west> </LatLonBox> </GroundOverlay> </Folder> <Folder> <name>ScreenOverlays</name> <open>0</open> <ScreenOverlay> <name>screenoverlay_dynamic_top</name> <visibility>0</visibility> <Icon> <href>http://code.google.com/apis/kml/documentation/dynamic_screenoverlay.jpg</href> </Icon> <overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/> <screenXY x="0" y="1" xunits="fraction" yunits="fraction"/> <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> <size x="1" y="0.2" xunits="fraction" yunits="fraction"/> </ScreenOverlay> <ScreenOverlay> <name>screenoverlay_dynamic_right</name> <visibility>0</visibility> <Icon> <href>http://code.google.com/apis/kml/documentation/dynamic_right.jpg</href> </Icon> <overlayXY x="1" y="1" xunits="fraction" yunits="fraction"/> <screenXY x="1" y="1" xunits="fraction" yunits="fraction"/> <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> <size x="0" y="1" xunits="fraction" yunits="fraction"/> </ScreenOverlay> <ScreenOverlay> <name>Simple crosshairs</name> <visibility>0</visibility> <description>This screen overlay uses fractional positioning to put the image in the exact center of the screen</description> <Icon> <href>http://code.google.com/apis/kml/documentation/crosshairs.png</href> </Icon> <overlayXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/> <screenXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/> <rotationXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/> <size x="0" y="0" xunits="pixels" yunits="pixels"/> </ScreenOverlay> <ScreenOverlay> <name>screenoverlay_absolute_topright</name> <visibility>0</visibility> <Icon> <href>http://code.google.com/apis/kml/documentation/top_right.jpg</href> </Icon> <overlayXY x="1" y="1" xunits="fraction" yunits="fraction"/> <screenXY x="1" y="1" xunits="fraction" yunits="fraction"/> <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> <size x="0" y="0" xunits="fraction" yunits="fraction"/> </ScreenOverlay> <ScreenOverlay> <name>screenoverlay_absolute_topleft</name> <visibility>0</visibility> <Icon> <href>http://code.google.com/apis/kml/documentation/top_left.jpg</href> </Icon> <overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/> <screenXY x="0" y="1" xunits="fraction" yunits="fraction"/> <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> <size x="0" y="0" xunits="fraction" yunits="fraction"/> </ScreenOverlay> <ScreenOverlay> <name>screenoverlay_absolute_bottomright</name> <visibility>0</visibility> <Icon> <href>http://code.google.com/apis/kml/documentation/bottom_right.jpg</href> </Icon> <overlayXY x="1" y="-1" xunits="fraction" yunits="fraction"/> <screenXY x="1" y="0" xunits="fraction" yunits="fraction"/> <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> <size x="0" y="0" xunits="fraction" yunits="fraction"/> </ScreenOverlay> <ScreenOverlay> <name>screenoverlay_absolute_bottomleft</name> <visibility>0</visibility> <Icon> <href>http://code.google.com/apis/kml/documentation/bottom_left.jpg</href> </Icon> <overlayXY x="0" y="-1" xunits="fraction" yunits="fraction"/> <screenXY x="0" y="0" xunits="fraction" yunits="fraction"/> <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> <size x="0" y="0" xunits="fraction" yunits="fraction"/> </ScreenOverlay> </Folder> </Document> </kml> and my code is : function initialize() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map_canvas")); var center=new GLatLng(39.9493, 116.3975); map.setCenter(center, 13); var geoXml = new GGeoXml("SamplesInMaps.kml"); <!--Place KML on Map --> map.addOverlay(geoXml); } } but ,i don't successful ,, do you know how to do this.. thanks

  Read the article

• Wordpress Template HTML CSS Layout Confusion

  - by Jess McKenzie

  I am having huge confusion with a template that I have purchased and I am trying to modify to handle a widget contact form. I am getting close with this but I have now muddled up the CSS or I have a feeling every page has a different CSS structure. The General Layout: What I Manage To Get: HTML View Source: <div id="innerright"> <div id="home" class="page"> <div id="homeslides"> <div class="welcomeslide"> <h1 class="large">Welcome</h1> </div> </div><!-- end home slides --> </div><!-- end page --> <div id="portfolio" class="page"> <div class="verticalline"> <div class="scrollprevnext"></div> </div> <div class="pageheader"> <h3><span>P</span>ortfolio</h3> </div><!--end pageheader --> <div id="portfolioscroller" class="scrollerenabledpage"> <div class="content"> <h5>Recent Work</h5> <ul class="thumb"> <li><a rel="precision_gallery" href="" title=""><img alt="" src="" /></a></li> </ul> </div> </div><!--end v scroll inner--> </div><!-- end page --> <div id="contact" class="page"> <div class="verticalline"> <div class="scrollprevnext"></div> </div> <div class="pageheader"> <h3><span>C</span>ontact</h3> </div><!--end pageheader --> <div id="contactscroller"> <h5>Get In Touch</h5> <div id="contactform">content</div> </div><!--end v scroll inner--> </div><!-- end page --> </div><!--end innerright--> CSS: CSS index.php: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title><?php bloginfo('name'); ?></title> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/style.css" /> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/fancybox/jquery.fancybox-1.3.4.css" media="screen" /> <?php // jquery will be included by wp_head function as well as scripts and styles by third party plugins wp_head(); ?> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/plugins.js"></script> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/script.js"></script> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/fancybox/jquery.fancybox-1.3.4.pack.js"></script> <?php // background image if one has been set via options if (function_exists('get_option_tree')) { $background_image = get_option_tree('precision_background_image'); //$background_image = ''; $background_color = get_option_tree('precision_background_color'); if ($background_color != '') { echo '<style>body { background-color:'.$background_color.'; }</style>'; } } ?> <script type="text/javascript"> jQuery(document).ready(function($) { $('.page').each(function(index, element) { $(this).css('left', index * 500); }); <?php // if background is set via the OptionTree then load it first if ($background_image != '') { ?> $.vegas({ src:'<?php echo $background_image; ?>', fade:1000, complete:function() { $("#wrapper").fadeIn(1000); $("#bgpanel").fadeIn(1000); $('#mainslide').crossSlide( { speed: 15, fade: 1 }, [ <?php echo $slides; ?> ] ) $('#homeslides').bxSlider({ mode: 'fade', auto: true, controls:false, speed:1000, pause:5000 }); } }); <?php } else { // if no background has been set then fade-in the page ?> $("#wrapper").fadeIn(1000); $("#bgpanel").fadeIn(1000); $('#mainslide').crossSlide( { speed: 15, fade: 1 }, [ //ENTER YOUR MAIN SLIDESHOW IMAGES HERE\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ <?php echo $slides; ?> ] ) $('#homeslides').bxSlider({ mode: 'fade', auto: true, controls:false, speed:1000, pause:5000 }); <?php } ?> //BX SLIDER INNER PAGE SCROLLERS//////////////////////// $('.scrollerenabledpage').each(function(index, element) { $('#' + $(this).attr('id')).bxSlider({ mode: 'vertical', easing: 'easeInOutQuint', auto: false, controls: true, prevImage:'<?php echo get_template_directory_uri(); ?>/images/up.png', nextImage:'<?php echo get_template_directory_uri(); ?>/images/down.png', infiniteLoop: false, hideControlOnEnd: true, pager: true, pagerType:'short', pagerShortSeparator:'of', speed:800, }); }); //END BX SLIDER INNER PAGE SCROLLERS///////////////// $('#submit').click(function(e) { e.preventDefault(); $('form').submit(); }); // contact form $('form').submit(function(e) { $('#main').append('<img src="<?php echo get_template_directory_uri(); ?>/images/loader.gif" class="loaderIcon" alt="Loading..." />'); $.post("<?php bloginfo('wpurl'); ?>/wp-admin/admin-ajax.php", {action:'precision_contact_form_handler', uname:$('input#uname').val(), uemail:$('input#uemail').val(), ucomments:$('textarea#ucomments').val()}, function(data) { $('#main img.loaderIcon').fadeOut(1000); if (data.status == "success") { $('#response').html("Forum has been successfully submitted."); } else { if (data.response != '') { $('#response').html(data.response); } else { $('#response').html("An error occurred while submitting the form. Please try again."); } } }, "json"); return false; }); }); //hides contact form labels when a field gets focus function initOverLabels () { if (!document.getElementById) return; var labels, id, field; labels = document.getElementsByTagName('label'); for (var i = 0; i < labels.length; i++) { if (labels[i].className == 'overlabel') { id = labels[i].htmlFor || labels[i].getAttribute('for'); if (!id || !(field = document.getElementById(id))) { continue; } labels[i].className = 'overlabel-apply'; if (field.value !== '') { hideLabel(field.getAttribute('id'), true); } field.onfocus = function () { hideLabel(this.getAttribute('id'), true); }; field.onblur = function () { if (this.value === '') { hideLabel(this.getAttribute('id'), false); } }; labels[i].onclick = function () { var id, field; id = this.getAttribute('for'); if (id && (field = document.getElementById(id))) { field.focus(); } }; } } }; function hideLabel(field_id, hide) { var field_for; var labels = document.getElementsByTagName('label'); for (var i = 0; i < labels.length; i++) { field_for = labels[i].htmlFor || labels[i].getAttribute('for'); if (field_for == field_id) { labels[i].style.textIndent = (hide) ? '-1000px' : '0px'; return true; } } } window.onload = function () { setTimeout(initOverLabels, 50); }; </script> <?php if (function_exists('get_option_tree')) { $precision_font_family_1 = get_option_tree('precision_font_family_1'); ?> <link href='http://fonts.googleapis.com/css?family=<?php echo $precision_font_family_1; ?>' rel='stylesheet' type='text/css'> <?php } ?> <style> h1, h2 { font-family:<?php echo $precision_font_family_1; ?>; } </style> </head> <body> <div id="wrapper"> <div id="innerleft"> <div id="header"> <?php if (function_exists('get_option_tree')) { $site_logo = get_option_tree('precision_site_logo'); ?> <a href="/" title="<?php bloginfo('name');?>"><img src="<?php echo $site_logo; ?>" alt="<?php bloginfo('name');?>" /></a> <?php } ?> </div><!--end header--> <?php if (function_exists('get_option_tree')) { $precision_slideshow_image = get_option_tree('precision_slideshow_image'); } ?> <ul id="nav"><!--Navigation--> <?php //instead of using wp_nav_menu, we use wp_get_nav_menu_items so that we can store the data in array and re-use it again //wp_nav_menu(array('theme_location' => 'precision-main-menu', 'container' => 'false')); $slt_menuItems = wp_get_nav_menu_items( "precision-main-menu" ); $menusItems = array(); foreach ($slt_menuItems as $slt_menuItem) { $page_title = $slt_menuItem->title; $menuItem = new stdClass; $menuItem->title = $page_title; $menuItem->page_id = $slt_menuItem->object_id; $menusItems[] = $menuItem; ?> <li id="<?php echo strtolower($page_title); ?>nav"><a href="#<?php echo strtolower($page_title); ?>"><?php echo $page_title; ?></a></li> <?php } ?> </ul> <div id="socialMedia"> <ul class="social"> <?php if (function_exists('get_option_tree')) { $twitter_link = get_option_tree('precision_twitter_link'); $facebook_link = get_option_tree('precision_facebook_link'); $gplus_link = get_option_tree('precision_gplus_link'); $delicious_link = get_option_tree('precision_delicious_link'); $flickr_link = get_option_tree('precision_flickr_link'); $vimeo_link = get_option_tree('precision_vimeo_link'); $youtube_link = get_option_tree('precision_youtube_link'); $linkedin_link = get_option_tree('precision_linkedin_link'); ?> <!-- start linkedin icon --> <?php if($linkedin_link != ''){ ?> <li><a href="<?php echo $linkedin_link;?>" title="Follow <?php bloginfo('name'); ?> on Linkedin"><img src="<?php echo get_template_directory_uri();?>/images/social-icons/linkedin.png" width="49" height="64" alt="<?php bloginfo('name'); ?> Linkedin"/></a><li> <?php } ?> <!-- end linkedin icon --> <!--start twitter icon--> <?php if ($twitter_link != '') { ?> <li><a href="<?php echo $twitter_link; ?>" title="Follow <?php bloginfo('name'); ?> on Twitter"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/twitter.png" width="49" height="64" alt="<?php bloginfo('name'); ?> Twitter" /></a></li> <?php } ?> <!--end twitter icon--> <!--start facebook icon--> <?php if ($facebook_link != '') { ?> <li><a href="<?php echo $facebook_link; ?>" title="Follow <?php bloginfo('name'); ?> on Facebook"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/facebook.png" width="49" height="64" alt="<?php bloginfo('name'); ?> Facebook" /></a></li> <?php } ?> <!--end facebook icon--> <!--start google plus icon--> <?php if ($gplus_link != '') { ?> <li><a href="<?php echo $gplus_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/google_plus.png" width="16" height="16" alt="google+" /></a></li> <?php } ?> <!--end google plus icon--> <!--start delicious icon--> <?php if ($delicious_link != '') { ?> <li><a href="<?php echo $delicious_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/delicious.png" width="16" height="16" alt="delicious" /></a></li> <?php } ?> <!--end delicious icon--> <!--start flickr icon--> <?php if ($flickr_link != '') { ?> <li><a href="<?php echo $flickr_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/flickr.png" width="16" height="16" alt="flickr" /></a></li> <?php } ?> <!--end flickr icon--> <!--start vimeo icon--> <?php if ($vimeo_link != '') { ?> <li><a href="<?php echo $vimeo_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/vimeo.png" width="16" height="16" alt="vimeo" /></a></li> <?php } ?> <!--end vimeo icon--> <!--start youtube icon--> <?php if ($youtube_link != '') { ?> <li><a href="<?php echo $youtube_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/youtube.png" width="16" height="16" alt="youtube" /></a></li> <?php } ?> <!--end youtube icon--> <?php } ?> </ul> </div> </div><!--end innerleft--> <div id="innerright"> <?php if (function_exists('get_option_tree')) { $precision_home_page_option = get_option_tree('precision_home_page'); $precision_home_page = strtolower(get_the_title($precision_home_page_option)); if ($precision_home_page == '') { $precision_home_page = 'home'; } $precision_contact_page_option = get_option_tree('precision_contact_page'); $precision_contact_page = strtolower(get_the_title($precision_contact_page_option)); if ($precision_contact_page == '') { $precision_contact_page = 'contact'; } } foreach ($menusItems as $menuItem) { ?> <div id="<?php echo strtolower($menuItem->title); ?>" class="page"> <?php if (strtolower($menuItem->title) == $precision_home_page) { ?> <div id="homeslides"> <?php $page_data = get_page($menuItem->page_id); $content = apply_filters('the_content', $page_data->post_content); echo $content; ?> </div><!-- end home slides --> <?php } else { ?> <div class="verticalline"> <div class="scrollprevnext"></div> </div> <div class="pageheader"> <h3><span><?php echo substr($menuItem->title, 0, 1); ?></span><?php echo substr($menuItem->title, 1); ?></h3> </div><!--end pageheader --> <?php $classes = ''; if (strtolower($menuItem->title) == $precision_contact_page) { ?> <div id="<?php echo strtolower($menuItem->title); ?>scroller"> <?php $page_data = get_page($menuItem->page_id); $content = apply_filters('the_content', $page_data->post_content); echo $content; ?> </div><!--end v scroll inner--> <?php } else { $classes = 'scrollerenabledpage'; ?> <div id="<?php echo strtolower($menuItem->title); ?>scroller" class="<?php echo $classes; ?>"> <?php $page_data = get_page($menuItem->page_id); $content = apply_filters('the_content', $page_data->post_content); echo $content; ?> </div><!--end v scroll inner--> <?php } } ?> </div><!-- end page --> <?php } ?> </div><!--end innerright--> <div id="footer"> <p>&copy; <a href="/"><?php bloginfo('name');?></a> | <?php echo date('Y');?></p> </div> </div><!--end wrapper--> </div> <!--Live Preview--> </body> </html>

  Read the article

• Silverlight Recruiting Application Part 6 - Adding an Interview Scheduling Module/View

  Between the last post and this one I went ahead and carried the ideas for the Jobs module and view into the Applicants module and view- they're both doing more or less the same thing, except with different objects being at their core.  Made for an easy cut-and-paste operation with a few items being switched from one to another.  Now that we have the ability to add postings and applicants, wouldn't it be nice if we could schedule an interview?  Of course it would! Scheduling Module I think you get the drift from previous posts that these project structures start looking somewhat similar.  The interview scheduling module is no different than the rest- it gets a SchedulingModule.cs file at the root that inherits from IModule, and there is a single SchedulerView.xsml and SchedulerViewModel.cs setup for our V+VM.  We have one unique concern as we enter into this- RadScheduler deals with AppointmentsSource, not ItemsSource, so there are some special considerations to take into account when planning this module. First, I need something which inherits from AppointmentBase.  This is the core of the RadScheduler appointment, and if you are planning to do any form of custom appointment, you'll want it to inherit from this.  Then you can add-on functionality as needed.  Here is my addition to the mix, the InterviewAppointment: 01.public class InterviewAppointment : AppointmentBase 02.{ 03.    private int _applicantID; 04.    public int ApplicantID 05.    { 06.        get { return this._applicantID; } 07.        set 08.        { 09.            if (_applicantID != value) 10.            { 11.                _applicantID = value; 12.                OnPropertyChanged("ApplicantID"); 13.            } 14.        } 15.    } 16.   17.    private int _postingID; 18.    public int PostingID 19.    { 20.        get { return _postingID; } 21.        set 22.        { 23.            if (_postingID != value) 24.            { 25.                _postingID = value; 26.                OnPropertyChanged("PostingID"); 27.            } 28.        } 29.    } 30.   31.    private string _body; 32.    public string Body 33.    { 34.        get { return _body; } 35.        set 36.        { 37.            if (_body != value) 38.            { 39.                _body = value; 40.                OnPropertyChanged("Body"); 41.            } 42.        } 43.    } 44.   45.    private int _interviewID; 46.    public int InterviewID 47.    { 48.        get { return _interviewID; } 49.        set 50.        { 51.            if (_interviewID != value) 52.            { 53.                _interviewID = value; 54.                OnPropertyChanged("InterviewID"); 55.            } 56.        } 57.    } 58.   59.    public override IAppointment Copy() 60.    { 61.        IAppointment appointment = new InterviewAppointment(); 62.        appointment.CopyFrom(this);             63.        return appointment; 64.    } 65.   66.    public override void CopyFrom(IAppointment other) 67.    {             68.        base.CopyFrom(other); 69.        var appointment = other as InterviewAppointment; 70.        if (appointment != null) 71.        { 72.            ApplicantID = appointment.ApplicantID; 73.            PostingID = appointment.PostingID; 74.            Body = appointment.Body; 75.            InterviewID = appointment.InterviewID; 76.        } 77.    } 78.} Nothing too exciting going on here, we just make sure that our custom fields are persisted (specifically set in CopyFrom at the bottom) and notifications are fired- otherwise this ends up exactly like the standard appointment as far as interactions, etc.  But if we've got custom appointment items... that also means we need to customize what our appointment dialog window will look like. Customizing the Edit Appointment Dialog This initially sounds a lot more intimidating than it really is.  The first step here depends on what you're dealing with for theming, but for ease of everything I went ahead and extracted my templates in Blend for RadScheduler so I could modify it as I pleased.  For the faint of heart, the RadScheduler template is a few thousand lines of goodness since there are some very complex things going on in that control.  I've gone ahead and trimmed down the template parts I don't need as much as possible, so what is left is all that is relevant to the Edit Appointment Dialog.  Here's the resulting Xaml, with line numbers, so I can explain further: 001.<UserControl.Resources> 002.    <!-- begin Necessary Windows 7 Theme Resources for EditAppointmentTemplate --> 003.    <helpers:DataContextProxy x:Key="DataContextProxy" /> 004.       005.    <telerik:Windows7Theme x:Key="Theme" /> 006.    <SolidColorBrush x:Key="DialogWindowBackground" 007.                     Color="White" /> 008.    <SolidColorBrush x:Key="CategorySelectorBorderBrush" 009.                     Color="#FFB1B1B1" /> 010.    <LinearGradientBrush x:Key="RadToolBar_InnerBackground" 011.                         EndPoint="0.5,1" 012.                         StartPoint="0.5,0"> 013.        <GradientStop Color="#FFFDFEFF" 014.                      Offset="0" /> 015.        <GradientStop Color="#FFDDE9F7" 016.                      Offset="1" /> 017.        <GradientStop Color="#FFE6F0FA" 018.                      Offset="0.5" /> 019.        <GradientStop Color="#FFDCE6F4" 020.                      Offset="0.5" /> 021.    </LinearGradientBrush> 022.    <Style x:Key="FormElementTextBlockStyle" 023.           TargetType="TextBlock"> 024.        <Setter Property="HorizontalAlignment" 025.                Value="Right" /> 026.        <Setter Property="VerticalAlignment" 027.                Value="Top" /> 028.        <Setter Property="Margin" 029.                Value="15, 15, 0, 2" /> 030.    </Style> 031.    <Style x:Key="FormElementStyle" 032.           TargetType="FrameworkElement"> 033.        <Setter Property="Margin" 034.                Value="10, 10, 0, 2" /> 035.    </Style> 036.    <SolidColorBrush x:Key="GenericShallowBorderBrush" 037.                     Color="#FF979994" /> 038.    <telerik:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" /> 039.    <telerikScheduler:ImportanceToBooleanConverter x:Key="ImportanceToBooleanConverter" /> 040.    <telerikScheduler:NullToVisibilityConverter x:Key="NullToVisibilityConverter" /> 041.    <telerikScheduler:InvertedNullToVisibilityConverter x:Key="InvertedNullToVisibilityConverter" /> 042.    <scheduler:ResourcesSeparatorConverter x:Key="ResourcesSeparatorConverter" /> 043.    <DataTemplate x:Key="IconDataEditTemplate"> 044.        <Image Source="/Telerik.Windows.Controls.Scheduler;component/Themes/Office/Images/cal.png" 045.               Margin="3,3,0,0" 046.               Width="16" 047.               Height="16" /> 048.    </DataTemplate> 049.    <DataTemplate x:Key="SingleSelectionTemplate"> 050.        <Grid VerticalAlignment="Stretch" 051.              HorizontalAlignment="Stretch"> 052.            <Grid.RowDefinitions> 053.                <RowDefinition Height="Auto" /> 054.            </Grid.RowDefinitions> 055.            <Grid.ColumnDefinitions> 056.                <ColumnDefinition Width="Auto" 057.                                  MinWidth="84" /> 058.                <ColumnDefinition Width="Auto" 059.                                  MinWidth="200" /> 060.            </Grid.ColumnDefinitions> 061.            <TextBlock x:Name="SelectionNameLabel" 062.                       Margin="0,13,4,2" 063.                       Text="{Binding ResourceType.DisplayName}" 064.                       Style="{StaticResource FormElementTextBlockStyle}" 065.                       Grid.Column="0" /> 066.            <telerikInput:RadComboBox ItemsSource="{Binding ResourceItems}" 067.                                      Width="185" 068.                                      Margin="5,10,20,2" 069.                                      HorizontalAlignment="Left" 070.                                      Grid.Column="1" 071.                                      ClearSelectionButtonVisibility="Visible" 072.                                      ClearSelectionButtonContent="Clear All" 073.                                      DisplayMemberPath="Resource.DisplayName" 074.                                      telerik:StyleManager.Theme="{StaticResource Theme}" 075.                                      SelectedItem="{Binding SelectedItem, Mode=TwoWay}" /> 076.        </Grid> 077.    </DataTemplate> 078.    <DataTemplate x:Key="MultipleSelectionTemplate"> 079.        <Grid VerticalAlignment="Stretch" 080.              HorizontalAlignment="Stretch"> 081.            <Grid.RowDefinitions> 082.                <RowDefinition Height="Auto" /> 083.            </Grid.RowDefinitions> 084.            <Grid.ColumnDefinitions> 085.                <ColumnDefinition Width="Auto" 086.                                  MinWidth="84" /> 087.                <ColumnDefinition Width="Auto" 088.                                  MinWidth="200" /> 089.            </Grid.ColumnDefinitions> 090.            <TextBlock x:Name="SelectionNameLabel" 091.                       Grid.Column="0" 092.                       Text="{Binding ResourceType.DisplayName}" 093.                       Margin="0,13,4,2" 094.                       Style="{StaticResource FormElementTextBlockStyle}" /> 095.            <telerikInput:RadComboBox Grid.Column="1" 096.                                      Width="185" 097.                                      HorizontalAlignment="Left" 098.                                      Margin="5,10,20,2" 099.                                      ItemsSource="{Binding ResourceItems}" 100.                                      SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}" 101.                                      ClearSelectionButtonVisibility="Visible" 102.                                      ClearSelectionButtonContent="Clear All" 103.                                      telerik:StyleManager.Theme="{StaticResource Theme}"> 104.                <telerikInput:RadComboBox.ItemTemplate> 105.                    <DataTemplate> 106.                        <Grid HorizontalAlignment="Stretch" 107.                              VerticalAlignment="Stretch"> 108.                            <CheckBox VerticalAlignment="Center" 109.                                      HorizontalContentAlignment="Stretch" 110.                                      VerticalContentAlignment="Center" 111.                                      IsChecked="{Binding IsChecked, Mode=TwoWay}" 112.                                      Content="{Binding Resource.DisplayName}"> 113.                                <CheckBox.ContentTemplate> 114.                                    <DataTemplate> 115.                                        <TextBlock HorizontalAlignment="Stretch" 116.                                                   VerticalAlignment="Stretch" 117.                                                   Text="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" /> 118.                                    </DataTemplate> 119.                                </CheckBox.ContentTemplate> 120.                            </CheckBox> 121.                        </Grid> 122.                    </DataTemplate> 123.                </telerikInput:RadComboBox.ItemTemplate> 124.            </telerikInput:RadComboBox> 125.        </Grid> 126.    </DataTemplate> 127.    <scheduler:ResourceTypeTemplateSelector x:Key="ItemTemplateSelector" 128.                                            MultipleSelectionTemplate="{StaticResource MultipleSelectionTemplate}" 129.                                            SingleSelectionTemplate="{StaticResource SingleSelectionTemplate}" /> 130.    <!-- end Necessary Windows 7 Theme Resources for EditAppointmentTemplate -->  131.       132.    <ControlTemplate x:Key="EditAppointmentTemplate" 133.                     TargetType="telerikScheduler:AppointmentDialogWindow"> 134.        <StackPanel Background="{TemplateBinding Background}" 135.                    UseLayoutRounding="True"> 136.            <StackPanel Grid.Row="0" 137.                        Orientation="Horizontal" 138.                        Background="{StaticResource RadToolBar_InnerBackground}" 139.                        Grid.ColumnSpan="2" 140.                        Height="0"> 141.                <!-- Recurrence buttons --> 142.                <Border Margin="1,1,0,0" 143.                        Background="#50000000" 144.                        HorizontalAlignment="Left" 145.                        VerticalAlignment="Center" 146.                        Width="2" 147.                        Height="16"> 148.                    <Border Margin="0,0,1,1" 149.                            Background="#80FFFFFF" 150.                            HorizontalAlignment="Left" 151.                            Width="1" /> 152.                </Border> 153.                <Border Margin="1,1,0,0" 154.                        Background="#50000000" 155.                        HorizontalAlignment="Left" 156.                        VerticalAlignment="Center" 157.                        Width="2" 158.                        Height="16"> 159.                    <Border Margin="0,0,1,1" 160.                            Background="#80FFFFFF" 161.                            HorizontalAlignment="Left" 162.                            Width="1" /> 163.                </Border> 164.                <TextBlock telerik:LocalizationManager.ResourceKey="ShowAs" 165.                           VerticalAlignment="Center" 166.                           Margin="5,0,0,0" /> 167.                <telerikInput:RadComboBox ItemsSource="{TemplateBinding TimeMarkers}" 168.                                          Width="100" 169.                                          Height="20" 170.                                          VerticalAlignment="Center" 171.                                          Margin="5,0,0,0" 172.                                          ClearSelectionButtonVisibility="Visible" 173.                                          ClearSelectionButtonContent="Clear" 174.                                          SelectedItem="{Binding TimeMarker,RelativeSource={RelativeSource TemplatedParent},Mode=TwoWay}" 175.                                          telerik:StyleManager.Theme="{StaticResource Theme}"> 176.                    <telerikInput:RadComboBox.ItemTemplate> 177.                        <DataTemplate> 178.                            <StackPanel Orientation="Horizontal"> 179.                                <Rectangle Fill="{Binding TimeMarkerBrush}" 180.                                           Margin="2" 181.                                           Width="12" 182.                                           Height="12" /> 183.                                <TextBlock Text="{Binding TimeMarkerName}" 184.                                           Margin="2" /> 185.                            </StackPanel> 186.                        </DataTemplate> 187.                    </telerikInput:RadComboBox.ItemTemplate> 188.                </telerikInput:RadComboBox> 189.                <telerik:RadToggleButton x:Name="High" 190.                                         BorderThickness="0" 191.                                         Background="{StaticResource RadToolBar_InnerBackground}" 192.                                         DataContext="{TemplateBinding EditedAppointment}" 193.                                         telerik:StyleManager.Theme="{StaticResource Theme}" 194.                                         IsChecked="{Binding Importance,Mode=TwoWay, Converter={StaticResource ImportanceToBooleanConverter},ConverterParameter=High}" 195.                                         Margin="2,2,0,2" 196.                                         Width="23" 197.                                         Height="23" 198.                                         HorizontalContentAlignment="Center" 199.                                         ToolTipService.ToolTip="High importance" 200.                                         CommandParameter="High" 201.                                         Command="telerikScheduler:RadSchedulerCommands.SetAppointmentImportance"> 202.                    <StackPanel HorizontalAlignment="Center"> 203.                        <Path Stretch="Fill" 204.                              Height="10" 205.                              HorizontalAlignment="Center" 206.                              VerticalAlignment="Top" 207.                              Width="5.451" 208.                              Data="M200.39647,58.840393 C200.39337,58.336426 201.14566,57.683922 202.56244,57.684292 C204.06589,57.684685 204.73764,58.357765 204.72783,58.992363 C205.04649,61.795574 203.04713,64.181099 202.47388,66.133446 C201.93753,64.154961 199.9471,61.560352 200.39647,58.840393 z"> 209.                            <Path.Fill> 210.                                <LinearGradientBrush EndPoint="1.059,0.375" 211.                                                     StartPoint="-0.457,0.519"> 212.                                    <GradientStop Color="#FFFF0606" 213.                                                  Offset="0.609" /> 214.                                    <GradientStop Color="#FFBF0303" 215.                                                  Offset="0.927" /> 216.                                </LinearGradientBrush> 217.                            </Path.Fill> 218.                        </Path> 219.                        <Ellipse Height="3" 220.                                 HorizontalAlignment="Center" 221.                                 Margin="0,-1,0,0" 222.                                 VerticalAlignment="Top" 223.                                 Width="3"> 224.                            <Ellipse.Fill> 225.                                <RadialGradientBrush> 226.                                    <GradientStop Color="#FFFF0606" 227.                                                  Offset="0" /> 228.                                    <GradientStop Color="#FFBF0303" 229.                                                  Offset="1" /> 230.                                </RadialGradientBrush> 231.                            </Ellipse.Fill> 232.                        </Ellipse> 233.                    </StackPanel> 234.                </telerik:RadToggleButton> 235.                <telerik:RadToggleButton x:Name="Low" 236.                                         HorizontalContentAlignment="Center" 237.                                         BorderThickness="0" 238.                                         Background="{StaticResource RadToolBar_InnerBackground}" 239.                                         DataContext="{TemplateBinding EditedAppointment}" 240.                                         IsChecked="{Binding Importance,Mode=TwoWay, Converter={StaticResource ImportanceToBooleanConverter},ConverterParameter=Low}" 241.                                         Margin="0,2,0,2" 242.                                         Width="23" 243.                                         Height="23" 244.                                         ToolTipService.ToolTip="Low importance" 245.                                         CommandParameter="Low" 246.                                         telerik:StyleManager.Theme="{StaticResource Theme}" 247.                                         Command="telerikScheduler:RadSchedulerCommands.SetAppointmentImportance"> 248.                    <Path Stretch="Fill" 249.                          Height="12" 250.                          HorizontalAlignment="Center" 251.                          VerticalAlignment="Top" 252.                          Width="9" 253.                          Data="M222.40353,60.139881 L226.65768,60.139843 L226.63687,67.240196 L229.15347,67.240196 L224.37816,71.394943 L219.65274,67.240196 L222.37572,67.219345 z" 254.                          Stroke="#FF0365A7"> 255.                        <Path.Fill> 256.                            <LinearGradientBrush EndPoint="1.059,0.375" 257.                                                 StartPoint="-0.457,0.519"> 258.                                <GradientStop Color="#FFBBE4FF" /> 259.                                <GradientStop Color="#FF024572" 260.                                              Offset="0.836" /> 261.                                <GradientStop Color="#FF43ADF4" 262.                                              Offset="0.466" /> 263.                            </LinearGradientBrush> 264.                        </Path.Fill> 265.                    </Path> 266.                </telerik:RadToggleButton> 267.            </StackPanel > 268.            <Border DataContext="{TemplateBinding EditedAppointment}" 269.                    Background="{Binding Category.CategoryBrush}" 270.                    Visibility="{Binding Category,Converter={StaticResource NullToVisibilityConverter}}" 271.                    CornerRadius="3" 272.                    Height="20" 273.                    Margin="5,10,5,0"> 274.                <TextBlock Text="{Binding Category.DisplayName}" 275.                           VerticalAlignment="Center" 276.                           Margin="5,0,0,0" /> 277.            </Border> 278.            <Grid VerticalAlignment="Stretch" 279.                  HorizontalAlignment="Stretch" 280.                  DataContext="{TemplateBinding EditedAppointment}" 281.                  Background="{TemplateBinding Background}"> 282.                <Grid.RowDefinitions> 283.                    <RowDefinition Height="Auto" /> 284.                    <RowDefinition Height="Auto" /> 285.                    <RowDefinition Height="Auto" /> 286.                    <RowDefinition Height="Auto" /> 287.                    <RowDefinition Height="Auto" /> 288.                    <RowDefinition Height="Auto" /> 289.                    <RowDefinition Height="Auto" /> 290.                    <RowDefinition Height="Auto" /> 291.                    <RowDefinition Height="Auto" /> 292.                    <RowDefinition Height="Auto" /> 293.                </Grid.RowDefinitions> 294.                <Grid.ColumnDefinitions> 295.                    <ColumnDefinition Width="Auto" 296.                                      MinWidth="100" /> 297.                    <ColumnDefinition Width="Auto" 298.                                      MinWidth="200" /> 299.                </Grid.ColumnDefinitions> 300.                <!-- Subject --> 301.                <TextBlock x:Name="SubjectLabel" 302.                           Grid.Row="0" 303.                           Grid.Column="0" 304.                           Margin="0,15,0,2" 305.                           telerik:LocalizationManager.ResourceKey="Subject" 306.                           Style="{StaticResource FormElementTextBlockStyle}" /> 307.                <TextBox x:Name="Subject" 308.                         Grid.Row="0" 309.                         Grid.Column="1" 310.                         MinHeight="22" 311.                         Padding="4 2" 312.                         Width="340" 313.                         HorizontalAlignment="Left" 314.                         Text="{Binding Subject, Mode=TwoWay}" 315.                         MaxLength="255" 316.                         telerik:StyleManager.Theme="{StaticResource Theme}" 317.                         Margin="10,12,20,2" /> 318.                <!-- Description --> 319.                <TextBlock x:Name="DescriptionLabel" 320.                           Grid.Row="1" 321.                           Grid.Column="0" 322.                           Margin="0,13,0,2" 323.                           telerik:LocalizationManager.ResourceKey="Body" 324.                           Style="{StaticResource FormElementTextBlockStyle}" /> 325.                <TextBox x:Name="Body" 326.                         VerticalAlignment="top" 327.                         Grid.Row="1" 328.                         Grid.Column="1" 329.                         Height="Auto" 330.                         MaxHeight="82" 331.                         Width="340" 332.                         HorizontalAlignment="Left" 333.                         MinHeight="22" 334.                         Padding="4 2" 335.                         TextWrapping="Wrap" 336.                         telerik:StyleManager.Theme="{StaticResource Theme}" 337.                         Text="{Binding Body, Mode=TwoWay}" 338.                         AcceptsReturn="true" 339.                         Margin="10,10,20,2" 340.                         HorizontalScrollBarVisibility="Auto" 341.                         VerticalScrollBarVisibility="Auto" /> 342.                <!-- Start/End date --> 343.                <TextBlock x:Name="StartDateLabel" 344.                           Grid.Row="2" 345.                           Grid.Column="0" 346.                           Margin="0,13,0,2" 347.                           telerik:LocalizationManager.ResourceKey="StartTime" 348.                           Style="{StaticResource FormElementTextBlockStyle}" /> 349.                <telerikScheduler:DateTimePicker x:Name="StartDateTime" 350.                                                 Height="22" 351.                                                 Grid.Row="2" 352.                                                 Grid.Column="1" 353.                                                 HorizontalAlignment="Left" 354.                                                 Margin="10,10,20,2" 355.                                                 Style="{StaticResource FormElementStyle}" 356.                                                 SelectedDateTime="{Binding Start, Mode=TwoWay}" 357.                                                 telerikScheduler:StartEndDatePicker.EndPicker="{Binding ElementName=EndDateTime}" 358.                                                 IsTabStop="False" 359.                                                 IsEnabled="False" /> 360.                <TextBlock x:Name="EndDateLabel" 361.                           Grid.Row="3" 362.                           Grid.Column="0" 363.                           Margin="0,13,0,2" 364.                           telerik:LocalizationManager.ResourceKey="EndTime" 365.                           Style="{StaticResource FormElementTextBlockStyle}" /> 366.                <telerikScheduler:DateTimePicker x:Name="EndDateTime" 367.                                                 Height="22" 368.                                                 Grid.Row="3" 369.                                                 Grid.Column="1" 370.                                                 HorizontalAlignment="Left" 371.                                                 Margin="10,10,20,2" 372.                                                 Style="{StaticResource FormElementStyle}" 373.                                                 IsTabStop="False" 374.                                                 IsEnabled="False" 375.                                                 SelectedDateTime="{Binding End, Mode=TwoWay}" /> 376.                <!-- Is-all-day selector --> 377.                <CheckBox x:Name="AllDayEventCheckbox" 378.                          IsChecked="{Binding IsAllDayEvent, Mode=TwoWay}" 379.                          Grid.Row="4" 380.                          Grid.Column="1" 381.                          Margin="10,10,20,2" 382.                          HorizontalAlignment="Left" 383.                          telerik:StyleManager.Theme="{StaticResource Theme}" 384.                          telerik:LocalizationManager.ResourceKey="AllDayEvent"> 385.                    <telerik:CommandManager.InputBindings> 386.                        <telerik:InputBindingCollection> 387.                            <telerik:MouseBinding Command="telerikScheduler:RadSchedulerCommands.ChangeTimePickersVisibility" 388.                                                  Gesture="LeftClick" /> 389.                        </telerik:InputBindingCollection> 390.                    </telerik:CommandManager.InputBindings> 391.                </CheckBox> 392.                <Grid Grid.Row="5" 393.                      Grid.ColumnSpan="2"> 394.                    <Grid.ColumnDefinitions> 395.                        <ColumnDefinition Width="Auto" 396.                                          MinWidth="100" /> 397.                        <ColumnDefinition Width="Auto" 398.                                          MinWidth="200" /> 399.                    </Grid.ColumnDefinitions> 400.                    <Grid.RowDefinitions> 401.                        <RowDefinition Height="Auto" /> 402.                        <RowDefinition Height="Auto" /> 403.                    </Grid.RowDefinitions> 404.                    <TextBlock Text="Applicant" 405.                               Margin="0,13,0,2" 406.                               Style="{StaticResource FormElementTextBlockStyle}" /> 407.                    <telerikInput:RadComboBox IsEditable="False" 408.                                              Grid.Column="1" 409.                                              Height="24" 410.                                              VerticalAlignment="Center" 411.                                              ItemsSource="{Binding Source={StaticResource DataContextProxy}, Path=DataSource.ApplicantList}" 412.                                              SelectedValue="{Binding ApplicantID, Mode=TwoWay}" 413.                                              SelectedValuePath="ApplicantID" 414.                                              DisplayMemberPath="FirstName" /> 415.                       416.                    <TextBlock Text="Job" 417.                               Margin="0,13,0,2" 418.                               Grid.Row="1" 419.                               Style="{StaticResource FormElementTextBlockStyle}" /> 420.                    <telerikInput:RadComboBox IsEditable="False" 421.                                              Grid.Column="1" 422.                                              Grid.Row="1" 423.                                              Height="24" 424.                                              VerticalAlignment="Center" 425.                                              ItemsSource="{Binding Source={StaticResource DataContextProxy}, Path=DataSource.JobsList}" 426.                                              SelectedValue="{Binding PostingID, Mode=TwoWay}" 427.                                              SelectedValuePath="PostingID" 428.                                              DisplayMemberPath="JobTitle"/> 429.                </Grid> 430.                    <!-- Resources --> 431.                <Grid x:Name="ResourcesLayout" 432.                      Grid.Row="7" 433.                      Grid.Column="0" 434.                      Grid.ColumnSpan="2" 435.                      MaxHeight="130" 436.                      Margin="20,5,20,0"> 437.                    <Border Margin="0" 438.                            BorderThickness="1" 439.                            BorderBrush="{StaticResource GenericShallowBorderBrush}" 440.                            Visibility="{Binding ElementName=ResourcesScrollViewer, Path=ComputedVerticalScrollBarVisibility}"></Border> 441.                    <ScrollViewer x:Name="ResourcesScrollViewer" 442.                                  IsTabStop="false" 443.                                  Grid.Row="6" 444.                                  Grid.Column="0" 445.                                  Grid.ColumnSpan="2" 446.                                  Margin="1" 447.                                  telerik:StyleManager.Theme="{StaticResource Theme}" 448.                                  VerticalScrollBarVisibility="Auto"> 449.                        <scheduler:ResourcesItemsControl x:Name="PART_Resources" 450.                                                         HorizontalAlignment="Left" 451.                                                         Padding="0,2,0,5" 452.                                                         IsTabStop="false" 453.                                                         ItemsSource="{TemplateBinding ResourceTypeModels}" 454.                                                         ItemTemplateSelector="{StaticResource ItemTemplateSelector}" /> 455.                    </ScrollViewer> 456.                </Grid> 457.                <StackPanel x:Name="FooterControls" 458.                            Margin="5 10 10 10" 459.                            Grid.Row="8" 460.                            Grid.Column="1" 461.                            HorizontalAlignment="Left" 462.                            Orientation="Horizontal"> 463.                    <telerik:RadButton x:Name="OKButton" 464.                                       Margin="5" 465.                                       Padding="10 0" 466.                                       MinWidth="80" 467.                                       Command="telerikScheduler:RadSchedulerCommands.SaveAppointment" 468.                                       telerik:StyleManager.Theme="{StaticResource Theme}" 469.                                       telerikNavigation:RadWindow.ResponseButton="Accept" 470.                                       telerik:LocalizationManager.ResourceKey="SaveAndCloseCommandText"> 471.                    </telerik:RadButton> 472.                    <telerik:RadButton x:Name="CancelButton" 473.                                       Margin="5" 474.                                       Padding="10 0" 475.                                       MinWidth="80" 476.                                       telerik:LocalizationManager.ResourceKey="Cancel" 477.                                       telerik:StyleManager.Theme="{StaticResource Theme}" 478.                                       telerikNavigation:RadWindow.ResponseButton="Cancel" 479.                                       Command="telerik:WindowCommands.Close"> 480.                    </telerik:RadButton> 481.                </StackPanel> 482.            </Grid> 483.            <vsm:VisualStateManager.VisualStateGroups> 484.                <vsm:VisualStateGroup x:Name="RecurrenceRuleState"> 485.                    <vsm:VisualState x:Name="RecurrenceRuleIsNull"> 486.                        <Storyboard> 487.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="StartDateTime" 488.                                                           Storyboard.TargetProperty="IsEnabled" 489.                                                           Duration="0"> 490.                                <DiscreteObjectKeyFrame KeyTime="0" 491.                                                        Value="True" /> 492.                            </ObjectAnimationUsingKeyFrames> 493.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EndDateTime" 494.                                                           Storyboard.TargetProperty="IsEnabled" 495.                                                           Duration="0"> 496.                                <DiscreteObjectKeyFrame KeyTime="0" 497.                                                        Value="True" /> 498.                            </ObjectAnimationUsingKeyFrames> 499.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AllDayEventCheckbox" 500.                                                           Storyboard.TargetProperty="IsEnabled" 501.                                                           Duration="0"> 502.                                <DiscreteObjectKeyFrame KeyTime="0" 503.                                                        Value="True" /> 504.                            </ObjectAnimationUsingKeyFrames> 505.                        </Storyboard> 506.                    </vsm:VisualState> 507.                    <vsm:VisualState x:Name="RecurrenceRuleIsNotNull"> 508.                        <Storyboard> 509.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="StartDateTime" 510.                                                           Storyboard.TargetProperty="IsEnabled" 511.                                                           Duration="0"> 512.                                <DiscreteObjectKeyFrame KeyTime="0" 513.                                                        Value="False" /> 514.                            </ObjectAnimationUsingKeyFrames> 515.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EndDateTime" 516.                                                           Storyboard.TargetProperty="IsEnabled" 517.                                                           Duration="0"> 518.                                <DiscreteObjectKeyFrame KeyTime="0" 519.                                                        Value="False" /> 520.                            </ObjectAnimationUsingKeyFrames> 521.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AllDayEventCheckbox" 522.                                                           Storyboard.TargetProperty="IsEnabled" 523.                                                           Duration="0"> 524.                                <DiscreteObjectKeyFrame KeyTime="0" 525.                                                        Value="False" /> 526.                            </ObjectAnimationUsingKeyFrames> 527.                        </Storyboard> 528.                    </vsm:VisualState> 529.                </vsm:VisualStateGroup> 530.            </vsm:VisualStateManager.VisualStateGroups> 531.        </StackPanel> 532.    </ControlTemplate> 533.    <DataTemplate x:Key="AppointmentDialogWindowHeaderDataTemplate"> 534.        <StackPanel Orientation="Horizontal" 535.                    MaxWidth="400"> 536.            <TextBlock telerik:LocalizationManager.ResourceKey="Event" 537.                       Visibility="{Binding Appointment.IsAllDayEvent, Converter={StaticResource BooleanToVisibilityConverter}}" /> 538.            <TextBlock telerik:LocalizationManager.ResourceKey="Appointment" 539.                       Visibility="{Binding Appointment.IsAllDayEvent, Converter={StaticResource InvertedBooleanToVisibilityConverter}}" /> 540.            <TextBlock Text=" - " /> 541.            <TextBlock x:Name="SubjectTextBlock" 542.                       Visibility="{Binding Appointment.Subject, Converter={StaticResource NullToVisibilityConverter}}" 543.                       Text="{Binding Appointment.Subject}" /> 544.            <TextBlock telerik:LocalizationManager.ResourceKey="Untitled" 545.                       Visibility="{Binding Appointment.Subject, Converter={StaticResource InvertedNullToVisibilityConverter}}" /> 546.        </StackPanel> 547.    </DataTemplate> 548.    <Style x:Key="EditAppointmentStyle" 549.           TargetType="telerikScheduler:AppointmentDialogWindow"> 550.        <Setter Property="IconTemplate" 551.                Value="{StaticResource IconDataEditTemplate}" /> 552.        <Setter Property="HeaderTemplate" 553.                Value="{StaticResource AppointmentDialogWindowHeaderDataTemplate}" /> 554.        <Setter Property="Background" 555.                Value="{StaticResource DialogWindowBackground}" /> 556.        <Setter Property="Template" 557.                Value="{StaticResource EditAppointmentTemplate}" /> 558.    </Style> 559.</UserControl.Resources> The first line there is the DataContextProxy I mentioned previously- we use that again to work a bit of magic in this template. Where we start getting into the dialog in question is line 132, but line 407 is where things start getting interesting.  The ItemsSource is pointing at a list that exists in my ViewModel (or code-behind, if it is used as a DataContext), the SelectedValue is the item I am actually binding from the applicant (note the TwoWay binding), and SelectedValuePath and DisplayMemberPath ensure the proper applicant is being displayed from the collection.  You will also see similar starting on line 420 where I do the same for the Jobs we'll be displaying. Just to wrap-up the Xaml, here's the RadScheduler declaraction that ties this all together and will be the main focus of our view: 01.<telerikScheduler:RadScheduler x:Name="xJobsScheduler" 02.                  Grid.Row="1" 03.                  Grid.Column="1" 04.                  Width="800" 05.                  MinWidth="600" 06.                  Height="500" 07.                  MinHeight="300" 08.                  AppointmentsSource="{Binding Interviews}" 09.                  EditAppointmentStyle="{StaticResource EditAppointmentStyle}" 10.                  command:AppointmentAddedEventClass.Command="{Binding AddAppointmentCommand}" 11.                  command:ApptCreatedEventClass.Command="{Binding ApptCreatingCommand}" 12.                  command:ApptEditedEventClass.Command="{Binding ApptEditedCommand}" 13.                  command:ApptDeletedEventClass.Command="{Binding ApptDeletedCommand}"> 14.</telerikScheduler:RadScheduler> Now, we get to the ViewModel and what it takes to get that rigged up.  And for those of you who remember the jobs post, those command:s in the Xaml are pointing to attached behavior commands that reproduce the respective events.  This becomes very handy when we're setting up the code-behind version. ;) ViewModel I've been liking this approach so far, so I'm going to put the entire ViewModel here and then go into the lines of interest.  Of course, feel free to ask me questions about anything that isn't clear (by line number, ideally) so I can help out if I have missed anything important: 001.public class SchedulerViewModel : ViewModelBase 002.{ 003.    private readonly IEventAggregator eventAggregator; 004.    private readonly IRegionManager regionManager; 005.   006.    public RecruitingContext context; 007.   008.    private ObservableItemCollection<InterviewAppointment> _interviews = new ObservableItemCollection<InterviewAppointment>(); 009.    public ObservableItemCollection<InterviewAppointment> Interviews 010.    { 011.        get { return _interviews; } 012.        set 013.        { 014.            if (_interviews != value) 015.            { 016.                _interviews = value; 017.                NotifyChanged("Interviews"); 018.            } 019.        } 020.    } 021.   022.    private QueryableCollectionView _jobsList; 023.    public QueryableCollectionView JobsList 024.    { 025.        get { return this._jobsList; } 026.        set 027.        { 028.            if (this._jobsList != value) 029.            { 030.                this._jobsList = value; 031.                this.NotifyChanged("JobsList"); 032.            } 033.        } 034.    } 035.   036.    private QueryableCollectionView _applicantList; 037.    public QueryableCollectionView ApplicantList 038.    { 039.        get { return _applicantList; } 040.        set 041.        { 042.            if (_applicantList != value) 043.            { 044.                _applicantList = value; 045.                NotifyChanged("ApplicantList"); 046.            } 047.        } 048.    } 049.   050.    public DelegateCommand<object> AddAppointmentCommand { get; set; } 051.    public DelegateCommand<object> ApptCreatingCommand { get; set; } 052.    public DelegateCommand<object> ApptEditedCommand { get; set; } 053.    public DelegateCommand<object> ApptDeletedCommand { get; set; } 054.   055.    public SchedulerViewModel(IEventAggregator eventAgg, IRegionManager regionmanager) 056.    { 057.        // set Unity items 058.        this.eventAggregator = eventAgg; 059.        this.regionManager = regionmanager; 060.   061.        // load our context 062.        context = new RecruitingContext(); 063.        LoadOperation<Interview> loadOp = context.Load(context.GetInterviewsQuery()); 064.        loadOp.Completed += new EventHandler(loadOp_Completed); 065.   066.        this._jobsList = new QueryableCollectionView(context.JobPostings); 067.        context.Load(context.GetJobPostingsQuery()); 068.   069.        this._applicantList = new QueryableCollectionView(context.Applicants); 070.        context.Load(context.GetApplicantsQuery()); 071.   072.        AddAppointmentCommand = new DelegateCommand<object>(this.AddAppt); 073.        ApptCreatingCommand = new DelegateCommand<object>(this.ApptCreating); 074.        ApptEditedCommand = new DelegateCommand<object>(this.ApptEdited); 075.        ApptDeletedCommand = new DelegateCommand<object>(this.ApptDeleted); 076.   077.    } 078.   079.    void loadOp_Completed(object sender, EventArgs e) 080.    { 081.        LoadOperation loadop = sender as LoadOperation; 082.   083.        foreach (var ent in loadop.Entities) 084.        { 085.            _interviews.Add(EntityToAppointment(ent as Interview)); 086.        } 087.    } 088.   089.    #region Appointment Adding 090.   091.    public void AddAppt(object obj) 092.    { 093.        // now we have a new InterviewAppointment to add to our QCV :) 094.        InterviewAppointment newInterview = obj as InterviewAppointment; 095.   096.        this.context.Interviews.Add(AppointmentToEntity(newInterview)); 097.        this.context.SubmitChanges((s) => 098.        { 099.            ActionHistory myAction = new ActionHistory(); 100.            myAction.InterviewID = newInterview.InterviewID; 101.            myAction.PostingID = newInterview.PostingID; 102.            myAction.ApplicantID = newInterview.ApplicantID; 103.            myAction.Description = String.Format("Interview with {0} has been created by {1}", newInterview.ApplicantID.ToString(), "default user"); 104.            myAction.TimeStamp = DateTime.Now; 105.            eventAggregator.GetEvent<AddActionEvent>().Publish(myAction); 106.        } 107.            , null); 108.    } 109.   110.    public void ApptCreating(object obj) 111.    { 112.        // handled in the behavior, just a placeholder to ensure it runs :) 113.    } 114.   115.    #endregion 116.   117.    #region Appointment Editing 118.   119.    public void ApptEdited(object obj) 120.    { 121.        Interview editedInterview = (from x in context.Interviews 122.                            where x.InterviewID == (obj as InterviewAppointment).InterviewID 123.                            select x).SingleOrDefault(); 124.   125.        CopyAppointmentEdit(editedInterview, obj as InterviewAppointment); 126.   127.        context.SubmitChanges((s) => { 128.            ActionHistory myAction = new ActionHistory(); 129.            myAction.InterviewID = editedInterview.InterviewID; 130.            myAction.PostingID = editedInterview.PostingID; 131.            myAction.ApplicantID = editedInterview.ApplicantID; 132.            myAction.Description = String.Format("Interview with {0} has been modified by {1}", editedInterview.ApplicantID.ToString(), "default user"); 133.            myAction.TimeStamp = DateTime.Now; 134.            eventAggregator.GetEvent<AddActionEvent>().Publish(myAction); } 135.            , null); 136.    } 137.   138.    #endregion 139.   140.    #region Appointment Deleting 141.   142.    public void ApptDeleted(object obj) 143.    { 144.        Interview deletedInterview = (from x in context.Interviews 145.                                      where x.InterviewID == (obj as InterviewAppointment).InterviewID 146.                                      select x).SingleOrDefault(); 147.   148.        context.Interviews.Remove(deletedInterview); 149.        context.SubmitChanges((s) => 150.        { 151.            ActionHistory myAction = new ActionHistory(); 152.            myAction.InterviewID = deletedInterview.InterviewID; 153.            myAction.PostingID = deletedInterview.PostingID; 154.            myAction.ApplicantID = deletedInterview.ApplicantID; 155.            myAction.Description = String.Format("Interview with {0} has been deleted by {1}", deletedInterview.ApplicantID.ToString(), "default user"); 156.            myAction.TimeStamp = DateTime.Now; 157.            eventAggregator.GetEvent<AddActionEvent>().Publish(myAction); 158.        } 159.            , null); 160.    } 161.   162.    #endregion 163.   164.    #region Appointment Helpers :) 165.   166.    public Interview AppointmentToEntity(InterviewAppointment ia) 167.    { 168.        Interview newInterview = new Interview(); 169.        newInterview.Subject = ia.Subject; 170.        newInterview.Body = ia.Body; 171.        newInterview.Start = ia.Start; 172.        newInterview.End = ia.End; 173.        newInterview.ApplicantID = ia.ApplicantID; 174.        newInterview.PostingID = ia.PostingID; 175.        newInterview.InterviewID = ia.InterviewID; 176.   177.        return newInterview; 178.    } 179.   180.    public InterviewAppointment EntityToAppointment(Interview ia) 181.    { 182.        InterviewAppointment newInterview = new InterviewAppointment(); 183.        newInterview.Subject = ia.Subject; 184.        newInterview.Body = ia.Body; 185.        newInterview.Start = ia.Start; 186.        newInterview.End = ia.End; 187.        newInterview.ApplicantID = ia.ApplicantID; 188.        newInterview.PostingID = ia.PostingID; 189.        newInterview.InterviewID = ia.InterviewID; 190.   191.        return newInterview; 192.    } 193.   194.    public void CopyAppointmentEdit(Interview entityInterview, InterviewAppointment appointmentInterview) 195.    { 196.        entityInterview.Subject = appointmentInterview.Subject; 197.        entityInterview.Body = appointmentInterview.Body; 198.        entityInterview.Start = appointmentInterview.Start; 199.        entityInterview.End = appointmentInterview.End; 200.        entityInterview.ApplicantID = appointmentInterview.ApplicantID; 201.        entityInterview.PostingID = appointmentInterview.PostingID; 202.    } 203.   204.    #endregion 205.} One thing we're doing here which you won't see in any of the other ViewModels is creating a duplicate collection.  I know this is something which will be fixed down the line for using RadScheduler, simplifying this process, but with WCF RIA changing as it does I wanted to ensure functionality would remain consistent as I continued development on this application.  So, I do a little bit of duplication, but for the greater good.  This all takes place starting on line 79, so for every entity that comes back we add it to the collection that is bound to RadScheduler.  Otherwise, the DelegateCommands that you see correspond directly to the events they are named after.  In each case, rather than sending over the full event arguments, I just send in the appointment in question (coming through as the object obj in all cases) so I can add (line 91), edit (line 119), and delete appointments (line 142) like normal.  This just ensures they get updated back to my database.  Also, the one bit of code you won't see is for the Appointment Creating (line 110) event- that is because in the command I've created I simply make the replacement I need to: 1.void element_AppointmentCreating(object sender, AppointmentCreatingEventArgs e) 2.{ 3.    e.NewAppointment = new InterviewAppointment(); 4.    base.ExecuteCommand(); 5.} And the ViewModel is none the wiser, the appointments just work as far as it is concerned since as they are created they become InterviewAppointments.  End result?  I've customized my EditAppointmentDialog as follows: And adding, editing, and deleting appointments works like a charm.  I can even 'edit' by moving appointments around RadScheduler, so as they are dropped into a timeslot they perform their full edit routine and things get updated. And then, the Code-Behind Version Perhaps the thing I like the most about doing one then the other is I get to steal 90% or more of the code from the MVVM version.  For example, the only real changes to the Code-Behind Xaml file exist in the control declaration, in which I use events instead of attached-behavior-event-commands: 01.<telerikScheduler:RadScheduler x:Name="xJobsScheduler" 02.                  Grid.Row="1" 03.                  Grid.Column="1" 04.                  Width="800" 05.                  MinWidth="600" 06.                  Height="500" 07.                  MinHeight="300" 08.                  EditAppointmentStyle="{StaticResource EditAppointmentStyle}" 09.                  AppointmentAdded="xJobsScheduler_AppointmentAdded" 10.                  AppointmentCreating="xJobsScheduler_AppointmentCreating" 11.                  AppointmentEdited="xJobsScheduler_AppointmentEdited" 12.                  AppointmentDeleted="xJobsScheduler_AppointmentDeleted"> 13.</telerikScheduler:RadScheduler> Easy, right?  Otherwise, all the same styling in UserControl.Resources was re-used, right down to the DataContextProxy that lets us bind to a collection from our viewmodel (in this case, our code-behind) to use within the DataTemplate.  The code conversion gets even easier, as I could literally copy and paste almost everything from the ViewModel to my Code-Behind, just a matter of pasting the right section into the right event.  Here's the code-behind as proof: 001.public partial class SchedulingView : UserControl, INotifyPropertyChanged 002.{ 003.    public RecruitingContext context; 004.   005.    private QueryableCollectionView _jobsList; 006.    public QueryableCollectionView JobsList 007.    { 008.        get { return this._jobsList; } 009.        set 010.        { 011.            if (this._jobsList != value) 012.            { 013.                this._jobsList = value; 014.                this.NotifyChanged("JobsList"); 015.            } 016.        } 017.    } 018.   019.    private QueryableCollectionView _applicantList; 020.    public QueryableCollectionView ApplicantList 021.    { 022.        get { return _applicantList; } 023.        set 024.        { 025.            if (_applicantList != value) 026.            { 027.                _applicantList = value; 028.                NotifyChanged("ApplicantList"); 029.            } 030.        } 031.    } 032.   033.    private ObservableItemCollection<InterviewAppointment> _interviews = new ObservableItemCollection<InterviewAppointment>(); 034.    public ObservableItemCollection<InterviewAppointment> Interviews 035.    { 036.        get { return _interviews; } 037.        set 038.        { 039.            if (_interviews != value) 040.            { 041.                _interviews = value; 042.                NotifyChanged("Interviews"); 043.            } 044.        } 045.    } 046.   047.    public SchedulingView() 048.    { 049.        InitializeComponent(); 050.   051.        this.DataContext = this; 052.   053.        this.Loaded += new RoutedEventHandler(SchedulingView_Loaded); 054.    } 055.   056.    void SchedulingView_Loaded(object sender, RoutedEventArgs e) 057.    { 058.        this.xJobsScheduler.AppointmentsSource = Interviews; 059.   060.        context = new RecruitingContext(); 061.           062.        LoadOperation loadop = context.Load(context.GetInterviewsQuery()); 063.        loadop.Completed += new EventHandler(loadop_Completed); 064.   065.        this._applicantList = new QueryableCollectionView(context.Applicants); 066.        context.Load(context.GetApplicantsQuery()); 067.   068.        this._jobsList = new QueryableCollectionView(context.JobPostings); 069.        context.Load(context.GetJobPostingsQuery()); 070.    } 071.   072.    void loadop_Completed(object sender, EventArgs e) 073.    { 074.        LoadOperation loadop = sender as LoadOperation; 075.   076.        _interviews.Clear(); 077.   078.        foreach (var ent in loadop.Entities) 079.        { 080.            _interviews.Add(EntityToAppointment(ent as Interview)); 081.        } 082.    } 083.   084.    private void xJobsScheduler_AppointmentAdded(object sender, Telerik.Windows.Controls.AppointmentAddedEventArgs e) 085.    { 086.        // now we have a new InterviewAppointment to add to our QCV :) 087.        InterviewAppointment newInterview = e.Appointment as InterviewAppointment; 088.   089.        this.context.Interviews.Add(AppointmentToEntity(newInterview)); 090.        this.context.SubmitChanges((s) => 091.        { 092.            ActionHistory myAction = new ActionHistory(); 093.            myAction.InterviewID = newInterview.InterviewID; 094.            myAction.PostingID = newInterview.PostingID; 095.            myAction.ApplicantID = newInterview.ApplicantID; 096.            myAction.Description = String.Format("Interview with {0} has been created by {1}", newInterview.ApplicantID.ToString(), "default user"); 097.            myAction.TimeStamp = DateTime.Now; 098.            context.ActionHistories.Add(myAction); 099.            context.SubmitChanges(); 100.        } 101.            , null); 102.    } 103.   104.    private void xJobsScheduler_AppointmentCreating(object sender, Telerik.Windows.Controls.AppointmentCreatingEventArgs e) 105.    { 106.        e.NewAppointment = new InterviewAppointment(); 107.    } 108.   109.    private void xJobsScheduler_AppointmentEdited(object sender, Telerik.Windows.Controls.AppointmentEditedEventArgs e) 110.    { 111.        Interview editedInterview = (from x in context.Interviews 112.                                     where x.InterviewID == (e.Appointment as InterviewAppointment).InterviewID 113.                                     select x).SingleOrDefault(); 114.   115.        CopyAppointmentEdit(editedInterview, e.Appointment as InterviewAppointment); 116.   117.        context.SubmitChanges((s) => 118.        { 119.            ActionHistory myAction = new ActionHistory(); 120.            myAction.InterviewID = editedInterview.InterviewID; 121.            myAction.PostingID = editedInterview.PostingID; 122.            myAction.ApplicantID = editedInterview.ApplicantID; 123.            myAction.Description = String.Format("Interview with {0} has been modified by {1}", editedInterview.ApplicantID.ToString(), "default user"); 124.            myAction.TimeStamp = DateTime.Now; 125.            context.ActionHistories.Add(myAction); 126.            context.SubmitChanges(); 127.        } 128.            , null); 129.    } 130.   131.    private void xJobsScheduler_AppointmentDeleted(object sender, Telerik.Windows.Controls.AppointmentDeletedEventArgs e) 132.    { 133.        Interview deletedInterview = (from x in context.Interviews 134.                                      where x.InterviewID == (e.Appointment as InterviewAppointment).InterviewID 135.                                      select x).SingleOrDefault(); 136.   137.        context.Interviews.Remove(deletedInterview); 138.        context.SubmitChanges((s) => 139.        { 140.            ActionHistory myAction = new ActionHistory(); 141.            myAction.InterviewID = deletedInterview.InterviewID; 142.            myAction.PostingID = deletedInterview.PostingID; 143.            myAction.ApplicantID = deletedInterview.ApplicantID; 144.            myAction.Description = String.Format("Interview with {0} has been deleted by {1}", deletedInterview.ApplicantID.ToString(), "default user"); 145.            myAction.TimeStamp = DateTime.Now; 146.            context.ActionHistories.Add(myAction); 147.            context.SubmitChanges(); 148.        } 149.            , null); 150.    } 151.   152.    #region Appointment Helpers :) 153.   154.    public Interview AppointmentToEntity(InterviewAppointment ia) 155.    { 156.        Interview newInterview = new Interview(); 157.        newInterview.Subject = ia.Subject; 158.        newInterview.Body = ia.Body; 159.        newInterview.Start = ia.Start; 160.        newInterview.End = ia.End; 161.        newInterview.ApplicantID = ia.ApplicantID; 162.        newInterview.PostingID = ia.PostingID; 163.        newInterview.InterviewID = ia.InterviewID; 164.   165.        return newInterview; 166.    } 167.   168.    public InterviewAppointment EntityToAppointment(Interview ia) 169.    { 170.        InterviewAppointment newInterview = new InterviewAppointment(); 171.        newInterview.Subject = ia.Subject; 172.        newInterview.Body = ia.Body; 173.        newInterview.Start = ia.Start; 174.        newInterview.End = ia.End; 175.        newInterview.ApplicantID = ia.ApplicantID; 176.        newInterview.PostingID = ia.PostingID; 177.        newInterview.InterviewID = ia.InterviewID; 178.   179.        return newInterview; 180.    } 181.   182.    public void CopyAppointmentEdit(Interview entityInterview, InterviewAppointment appointmentInterview) 183.    { 184.        entityInterview.Subject = appointmentInterview.Subject; 185.        entityInterview.Body = appointmentInterview.Body; 186.        entityInterview.Start = appointmentInterview.Start; 187.        entityInterview.End = appointmentInterview.End; 188.        entityInterview.ApplicantID = appointmentInterview.ApplicantID; 189.        entityInterview.PostingID = appointmentInterview.PostingID; 190.    } 191.   192.    #endregion 193.   194.    #region INotifyPropertyChanged Members 195.   196.    public event PropertyChangedEventHandler PropertyChanged; 197.   198.    public void NotifyChanged(string propertyName) 199.    { 200.        if (string.IsNullOrEmpty(propertyName)) 201.            throw new ArgumentException("propertyName"); 202.   203.        PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 204.    } 205.   206.    #endregion 207.} Nice... right? :) One really important thing to note as well.  See on line 51 where I set the DataContext before the Loaded event?  This is super important, as if you don't have this set before the usercontrol is loaded, the DataContextProxy has no context to use and your EditAppointmentDialog Job/Applicant dropdowns will be blank and empty.  Trust me on this, took a little bit of debugging to figure out that by setting the DataContext post-loaded would only lead to disaster and frustration.  Otherwise, the only other real difference is that instead of sending an ActionHistory item through an event to get added to the database and saved, I do those right in the callback from submitting.  The Result Again, I only have to post one picture because these bad boys used nearly identical code for both the MVVM and the code-behind views, so our end result is... So what have we learned here today?  One, for the most part this MVVM thing is somewhat easy.  Yeah, you sometimes have to write a bunch of extra code, but with the help of a few useful snippits you can turn the process into a pretty streamlined little workflow.  Heck, this story gets even easier as you can see in this blog post by Michael Washington- specifically run a find on 'InvokeCommandAction' and you'll see the section regarding the command on TreeView in Blend 4.  Brilliant!  MVVM never looked so sweet! Otherwise, it is business as usual with RadScheduler for Silverlight whichever path you're choosing for your development.  Between now and the next post, I'll be cleaning up styles a bit (those RadComboBoxes are a little too close to my labels!) and adding some to the RowDetailsViews for Applicants and Jobs, so you can see all the info for an appointment in the dropdown tab view.  Otherwise, we're about ready to call a wrap on this oneDid you know that DotNetSlackers also publishes .net articles written by top known .net Authors? We already have over 80 articles in several categories including Silverlight. Take a look: here.

  Read the article

• Silverlight Recruiting Application Part 6 - Adding an Interview Scheduling Module/View

  Between the last post and this one I went ahead and carried the ideas for the Jobs module and view into the Applicants module and view- they're both doing more or less the same thing, except with different objects being at their core.  Made for an easy cut-and-paste operation with a few items being switched from one to another.  Now that we have the ability to add postings and applicants, wouldn't it be nice if we could schedule an interview?  Of course it would! Scheduling Module I think you get the drift from previous posts that these project structures start looking somewhat similar.  The interview scheduling module is no different than the rest- it gets a SchedulingModule.cs file at the root that inherits from IModule, and there is a single SchedulerView.xsml and SchedulerViewModel.cs setup for our V+VM.  We have one unique concern as we enter into this- RadScheduler deals with AppointmentsSource, not ItemsSource, so there are some special considerations to take into account when planning this module. First, I need something which inherits from AppointmentBase.  This is the core of the RadScheduler appointment, and if you are planning to do any form of custom appointment, you'll want it to inherit from this.  Then you can add-on functionality as needed.  Here is my addition to the mix, the InterviewAppointment: 01.public class InterviewAppointment : AppointmentBase 02.{ 03.    private int _applicantID; 04.    public int ApplicantID 05.    { 06.        get { return this._applicantID; } 07.        set 08.        { 09.            if (_applicantID != value) 10.            { 11.                _applicantID = value; 12.                OnPropertyChanged("ApplicantID"); 13.            } 14.        } 15.    } 16.   17.    private int _postingID; 18.    public int PostingID 19.    { 20.        get { return _postingID; } 21.        set 22.        { 23.            if (_postingID != value) 24.            { 25.                _postingID = value; 26.                OnPropertyChanged("PostingID"); 27.            } 28.        } 29.    } 30.   31.    private string _body; 32.    public string Body 33.    { 34.        get { return _body; } 35.        set 36.        { 37.            if (_body != value) 38.            { 39.                _body = value; 40.                OnPropertyChanged("Body"); 41.            } 42.        } 43.    } 44.   45.    private int _interviewID; 46.    public int InterviewID 47.    { 48.        get { return _interviewID; } 49.        set 50.        { 51.            if (_interviewID != value) 52.            { 53.                _interviewID = value; 54.                OnPropertyChanged("InterviewID"); 55.            } 56.        } 57.    } 58.   59.    public override IAppointment Copy() 60.    { 61.        IAppointment appointment = new InterviewAppointment(); 62.        appointment.CopyFrom(this);             63.        return appointment; 64.    } 65.   66.    public override void CopyFrom(IAppointment other) 67.    {             68.        base.CopyFrom(other); 69.        var appointment = other as InterviewAppointment; 70.        if (appointment != null) 71.        { 72.            ApplicantID = appointment.ApplicantID; 73.            PostingID = appointment.PostingID; 74.            Body = appointment.Body; 75.            InterviewID = appointment.InterviewID; 76.        } 77.    } 78.} Nothing too exciting going on here, we just make sure that our custom fields are persisted (specifically set in CopyFrom at the bottom) and notifications are fired- otherwise this ends up exactly like the standard appointment as far as interactions, etc.  But if we've got custom appointment items... that also means we need to customize what our appointment dialog window will look like. Customizing the Edit Appointment Dialog This initially sounds a lot more intimidating than it really is.  The first step here depends on what you're dealing with for theming, but for ease of everything I went ahead and extracted my templates in Blend for RadScheduler so I could modify it as I pleased.  For the faint of heart, the RadScheduler template is a few thousand lines of goodness since there are some very complex things going on in that control.  I've gone ahead and trimmed down the template parts I don't need as much as possible, so what is left is all that is relevant to the Edit Appointment Dialog.  Here's the resulting Xaml, with line numbers, so I can explain further: 001.<UserControl.Resources> 002.    <!-- begin Necessary Windows 7 Theme Resources for EditAppointmentTemplate --> 003.    <helpers:DataContextProxy x:Key="DataContextProxy" /> 004.       005.    <telerik:Windows7Theme x:Key="Theme" /> 006.    <SolidColorBrush x:Key="DialogWindowBackground" 007.                     Color="White" /> 008.    <SolidColorBrush x:Key="CategorySelectorBorderBrush" 009.                     Color="#FFB1B1B1" /> 010.    <LinearGradientBrush x:Key="RadToolBar_InnerBackground" 011.                         EndPoint="0.5,1" 012.                         StartPoint="0.5,0"> 013.        <GradientStop Color="#FFFDFEFF" 014.                      Offset="0" /> 015.        <GradientStop Color="#FFDDE9F7" 016.                      Offset="1" /> 017.        <GradientStop Color="#FFE6F0FA" 018.                      Offset="0.5" /> 019.        <GradientStop Color="#FFDCE6F4" 020.                      Offset="0.5" /> 021.    </LinearGradientBrush> 022.    <Style x:Key="FormElementTextBlockStyle" 023.           TargetType="TextBlock"> 024.        <Setter Property="HorizontalAlignment" 025.                Value="Right" /> 026.        <Setter Property="VerticalAlignment" 027.                Value="Top" /> 028.        <Setter Property="Margin" 029.                Value="15, 15, 0, 2" /> 030.    </Style> 031.    <Style x:Key="FormElementStyle" 032.           TargetType="FrameworkElement"> 033.        <Setter Property="Margin" 034.                Value="10, 10, 0, 2" /> 035.    </Style> 036.    <SolidColorBrush x:Key="GenericShallowBorderBrush" 037.                     Color="#FF979994" /> 038.    <telerik:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" /> 039.    <telerikScheduler:ImportanceToBooleanConverter x:Key="ImportanceToBooleanConverter" /> 040.    <telerikScheduler:NullToVisibilityConverter x:Key="NullToVisibilityConverter" /> 041.    <telerikScheduler:InvertedNullToVisibilityConverter x:Key="InvertedNullToVisibilityConverter" /> 042.    <scheduler:ResourcesSeparatorConverter x:Key="ResourcesSeparatorConverter" /> 043.    <DataTemplate x:Key="IconDataEditTemplate"> 044.        <Image Source="/Telerik.Windows.Controls.Scheduler;component/Themes/Office/Images/cal.png" 045.               Margin="3,3,0,0" 046.               Width="16" 047.               Height="16" /> 048.    </DataTemplate> 049.    <DataTemplate x:Key="SingleSelectionTemplate"> 050.        <Grid VerticalAlignment="Stretch" 051.              HorizontalAlignment="Stretch"> 052.            <Grid.RowDefinitions> 053.                <RowDefinition Height="Auto" /> 054.            </Grid.RowDefinitions> 055.            <Grid.ColumnDefinitions> 056.                <ColumnDefinition Width="Auto" 057.                                  MinWidth="84" /> 058.                <ColumnDefinition Width="Auto" 059.                                  MinWidth="200" /> 060.            </Grid.ColumnDefinitions> 061.            <TextBlock x:Name="SelectionNameLabel" 062.                       Margin="0,13,4,2" 063.                       Text="{Binding ResourceType.DisplayName}" 064.                       Style="{StaticResource FormElementTextBlockStyle}" 065.                       Grid.Column="0" /> 066.            <telerikInput:RadComboBox ItemsSource="{Binding ResourceItems}" 067.                                      Width="185" 068.                                      Margin="5,10,20,2" 069.                                      HorizontalAlignment="Left" 070.                                      Grid.Column="1" 071.                                      ClearSelectionButtonVisibility="Visible" 072.                                      ClearSelectionButtonContent="Clear All" 073.                                      DisplayMemberPath="Resource.DisplayName" 074.                                      telerik:StyleManager.Theme="{StaticResource Theme}" 075.                                      SelectedItem="{Binding SelectedItem, Mode=TwoWay}" /> 076.        </Grid> 077.    </DataTemplate> 078.    <DataTemplate x:Key="MultipleSelectionTemplate"> 079.        <Grid VerticalAlignment="Stretch" 080.              HorizontalAlignment="Stretch"> 081.            <Grid.RowDefinitions> 082.                <RowDefinition Height="Auto" /> 083.            </Grid.RowDefinitions> 084.            <Grid.ColumnDefinitions> 085.                <ColumnDefinition Width="Auto" 086.                                  MinWidth="84" /> 087.                <ColumnDefinition Width="Auto" 088.                                  MinWidth="200" /> 089.            </Grid.ColumnDefinitions> 090.            <TextBlock x:Name="SelectionNameLabel" 091.                       Grid.Column="0" 092.                       Text="{Binding ResourceType.DisplayName}" 093.                       Margin="0,13,4,2" 094.                       Style="{StaticResource FormElementTextBlockStyle}" /> 095.            <telerikInput:RadComboBox Grid.Column="1" 096.                                      Width="185" 097.                                      HorizontalAlignment="Left" 098.                                      Margin="5,10,20,2" 099.                                      ItemsSource="{Binding ResourceItems}" 100.                                      SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}" 101.                                      ClearSelectionButtonVisibility="Visible" 102.                                      ClearSelectionButtonContent="Clear All" 103.                                      telerik:StyleManager.Theme="{StaticResource Theme}"> 104.                <telerikInput:RadComboBox.ItemTemplate> 105.                    <DataTemplate> 106.                        <Grid HorizontalAlignment="Stretch" 107.                              VerticalAlignment="Stretch"> 108.                            <CheckBox VerticalAlignment="Center" 109.                                      HorizontalContentAlignment="Stretch" 110.                                      VerticalContentAlignment="Center" 111.                                      IsChecked="{Binding IsChecked, Mode=TwoWay}" 112.                                      Content="{Binding Resource.DisplayName}"> 113.                                <CheckBox.ContentTemplate> 114.                                    <DataTemplate> 115.                                        <TextBlock HorizontalAlignment="Stretch" 116.                                                   VerticalAlignment="Stretch" 117.                                                   Text="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" /> 118.                                    </DataTemplate> 119.                                </CheckBox.ContentTemplate> 120.                            </CheckBox> 121.                        </Grid> 122.                    </DataTemplate> 123.                </telerikInput:RadComboBox.ItemTemplate> 124.            </telerikInput:RadComboBox> 125.        </Grid> 126.    </DataTemplate> 127.    <scheduler:ResourceTypeTemplateSelector x:Key="ItemTemplateSelector" 128.                                            MultipleSelectionTemplate="{StaticResource MultipleSelectionTemplate}" 129.                                            SingleSelectionTemplate="{StaticResource SingleSelectionTemplate}" /> 130.    <!-- end Necessary Windows 7 Theme Resources for EditAppointmentTemplate -->  131.       132.    <ControlTemplate x:Key="EditAppointmentTemplate" 133.                     TargetType="telerikScheduler:AppointmentDialogWindow"> 134.        <StackPanel Background="{TemplateBinding Background}" 135.                    UseLayoutRounding="True"> 136.            <StackPanel Grid.Row="0" 137.                        Orientation="Horizontal" 138.                        Background="{StaticResource RadToolBar_InnerBackground}" 139.                        Grid.ColumnSpan="2" 140.                        Height="0"> 141.                <!-- Recurrence buttons --> 142.                <Border Margin="1,1,0,0" 143.                        Background="#50000000" 144.                        HorizontalAlignment="Left" 145.                        VerticalAlignment="Center" 146.                        Width="2" 147.                        Height="16"> 148.                    <Border Margin="0,0,1,1" 149.                            Background="#80FFFFFF" 150.                            HorizontalAlignment="Left" 151.                            Width="1" /> 152.                </Border> 153.                <Border Margin="1,1,0,0" 154.                        Background="#50000000" 155.                        HorizontalAlignment="Left" 156.                        VerticalAlignment="Center" 157.                        Width="2" 158.                        Height="16"> 159.                    <Border Margin="0,0,1,1" 160.                            Background="#80FFFFFF" 161.                            HorizontalAlignment="Left" 162.                            Width="1" /> 163.                </Border> 164.                <TextBlock telerik:LocalizationManager.ResourceKey="ShowAs" 165.                           VerticalAlignment="Center" 166.                           Margin="5,0,0,0" /> 167.                <telerikInput:RadComboBox ItemsSource="{TemplateBinding TimeMarkers}" 168.                                          Width="100" 169.                                          Height="20" 170.                                          VerticalAlignment="Center" 171.                                          Margin="5,0,0,0" 172.                                          ClearSelectionButtonVisibility="Visible" 173.                                          ClearSelectionButtonContent="Clear" 174.                                          SelectedItem="{Binding TimeMarker,RelativeSource={RelativeSource TemplatedParent},Mode=TwoWay}" 175.                                          telerik:StyleManager.Theme="{StaticResource Theme}"> 176.                    <telerikInput:RadComboBox.ItemTemplate> 177.                        <DataTemplate> 178.                            <StackPanel Orientation="Horizontal"> 179.                                <Rectangle Fill="{Binding TimeMarkerBrush}" 180.                                           Margin="2" 181.                                           Width="12" 182.                                           Height="12" /> 183.                                <TextBlock Text="{Binding TimeMarkerName}" 184.                                           Margin="2" /> 185.                            </StackPanel> 186.                        </DataTemplate> 187.                    </telerikInput:RadComboBox.ItemTemplate> 188.                </telerikInput:RadComboBox> 189.                <telerik:RadToggleButton x:Name="High" 190.                                         BorderThickness="0" 191.                                         Background="{StaticResource RadToolBar_InnerBackground}" 192.                                         DataContext="{TemplateBinding EditedAppointment}" 193.                                         telerik:StyleManager.Theme="{StaticResource Theme}" 194.                                         IsChecked="{Binding Importance,Mode=TwoWay, Converter={StaticResource ImportanceToBooleanConverter},ConverterParameter=High}" 195.                                         Margin="2,2,0,2" 196.                                         Width="23" 197.                                         Height="23" 198.                                         HorizontalContentAlignment="Center" 199.                                         ToolTipService.ToolTip="High importance" 200.                                         CommandParameter="High" 201.                                         Command="telerikScheduler:RadSchedulerCommands.SetAppointmentImportance"> 202.                    <StackPanel HorizontalAlignment="Center"> 203.                        <Path Stretch="Fill" 204.                              Height="10" 205.                              HorizontalAlignment="Center" 206.                              VerticalAlignment="Top" 207.                              Width="5.451" 208.                              Data="M200.39647,58.840393 C200.39337,58.336426 201.14566,57.683922 202.56244,57.684292 C204.06589,57.684685 204.73764,58.357765 204.72783,58.992363 C205.04649,61.795574 203.04713,64.181099 202.47388,66.133446 C201.93753,64.154961 199.9471,61.560352 200.39647,58.840393 z"> 209.                            <Path.Fill> 210.                                <LinearGradientBrush EndPoint="1.059,0.375" 211.                                                     StartPoint="-0.457,0.519"> 212.                                    <GradientStop Color="#FFFF0606" 213.                                                  Offset="0.609" /> 214.                                    <GradientStop Color="#FFBF0303" 215.                                                  Offset="0.927" /> 216.                                </LinearGradientBrush> 217.                            </Path.Fill> 218.                        </Path> 219.                        <Ellipse Height="3" 220.                                 HorizontalAlignment="Center" 221.                                 Margin="0,-1,0,0" 222.                                 VerticalAlignment="Top" 223.                                 Width="3"> 224.                            <Ellipse.Fill> 225.                                <RadialGradientBrush> 226.                                    <GradientStop Color="#FFFF0606" 227.                                                  Offset="0" /> 228.                                    <GradientStop Color="#FFBF0303" 229.                                                  Offset="1" /> 230.                                </RadialGradientBrush> 231.                            </Ellipse.Fill> 232.                        </Ellipse> 233.                    </StackPanel> 234.                </telerik:RadToggleButton> 235.                <telerik:RadToggleButton x:Name="Low" 236.                                         HorizontalContentAlignment="Center" 237.                                         BorderThickness="0" 238.                                         Background="{StaticResource RadToolBar_InnerBackground}" 239.                                         DataContext="{TemplateBinding EditedAppointment}" 240.                                         IsChecked="{Binding Importance,Mode=TwoWay, Converter={StaticResource ImportanceToBooleanConverter},ConverterParameter=Low}" 241.                                         Margin="0,2,0,2" 242.                                         Width="23" 243.                                         Height="23" 244.                                         ToolTipService.ToolTip="Low importance" 245.                                         CommandParameter="Low" 246.                                         telerik:StyleManager.Theme="{StaticResource Theme}" 247.                                         Command="telerikScheduler:RadSchedulerCommands.SetAppointmentImportance"> 248.                    <Path Stretch="Fill" 249.                          Height="12" 250.                          HorizontalAlignment="Center" 251.                          VerticalAlignment="Top" 252.                          Width="9" 253.                          Data="M222.40353,60.139881 L226.65768,60.139843 L226.63687,67.240196 L229.15347,67.240196 L224.37816,71.394943 L219.65274,67.240196 L222.37572,67.219345 z" 254.                          Stroke="#FF0365A7"> 255.                        <Path.Fill> 256.                            <LinearGradientBrush EndPoint="1.059,0.375" 257.                                                 StartPoint="-0.457,0.519"> 258.                                <GradientStop Color="#FFBBE4FF" /> 259.                                <GradientStop Color="#FF024572" 260.                                              Offset="0.836" /> 261.                                <GradientStop Color="#FF43ADF4" 262.                                              Offset="0.466" /> 263.                            </LinearGradientBrush> 264.                        </Path.Fill> 265.                    </Path> 266.                </telerik:RadToggleButton> 267.            </StackPanel > 268.            <Border DataContext="{TemplateBinding EditedAppointment}" 269.                    Background="{Binding Category.CategoryBrush}" 270.                    Visibility="{Binding Category,Converter={StaticResource NullToVisibilityConverter}}" 271.                    CornerRadius="3" 272.                    Height="20" 273.                    Margin="5,10,5,0"> 274.                <TextBlock Text="{Binding Category.DisplayName}" 275.                           VerticalAlignment="Center" 276.                           Margin="5,0,0,0" /> 277.            </Border> 278.            <Grid VerticalAlignment="Stretch" 279.                  HorizontalAlignment="Stretch" 280.                  DataContext="{TemplateBinding EditedAppointment}" 281.                  Background="{TemplateBinding Background}"> 282.                <Grid.RowDefinitions> 283.                    <RowDefinition Height="Auto" /> 284.                    <RowDefinition Height="Auto" /> 285.                    <RowDefinition Height="Auto" /> 286.                    <RowDefinition Height="Auto" /> 287.                    <RowDefinition Height="Auto" /> 288.                    <RowDefinition Height="Auto" /> 289.                    <RowDefinition Height="Auto" /> 290.                    <RowDefinition Height="Auto" /> 291.                    <RowDefinition Height="Auto" /> 292.                    <RowDefinition Height="Auto" /> 293.                </Grid.RowDefinitions> 294.                <Grid.ColumnDefinitions> 295.                    <ColumnDefinition Width="Auto" 296.                                      MinWidth="100" /> 297.                    <ColumnDefinition Width="Auto" 298.                                      MinWidth="200" /> 299.                </Grid.ColumnDefinitions> 300.                <!-- Subject --> 301.                <TextBlock x:Name="SubjectLabel" 302.                           Grid.Row="0" 303.                           Grid.Column="0" 304.                           Margin="0,15,0,2" 305.                           telerik:LocalizationManager.ResourceKey="Subject" 306.                           Style="{StaticResource FormElementTextBlockStyle}" /> 307.                <TextBox x:Name="Subject" 308.                         Grid.Row="0" 309.                         Grid.Column="1" 310.                         MinHeight="22" 311.                         Padding="4 2" 312.                         Width="340" 313.                         HorizontalAlignment="Left" 314.                         Text="{Binding Subject, Mode=TwoWay}" 315.                         MaxLength="255" 316.                         telerik:StyleManager.Theme="{StaticResource Theme}" 317.                         Margin="10,12,20,2" /> 318.                <!-- Description --> 319.                <TextBlock x:Name="DescriptionLabel" 320.                           Grid.Row="1" 321.                           Grid.Column="0" 322.                           Margin="0,13,0,2" 323.                           telerik:LocalizationManager.ResourceKey="Body" 324.                           Style="{StaticResource FormElementTextBlockStyle}" /> 325.                <TextBox x:Name="Body" 326.                         VerticalAlignment="top" 327.                         Grid.Row="1" 328.                         Grid.Column="1" 329.                         Height="Auto" 330.                         MaxHeight="82" 331.                         Width="340" 332.                         HorizontalAlignment="Left" 333.                         MinHeight="22" 334.                         Padding="4 2" 335.                         TextWrapping="Wrap" 336.                         telerik:StyleManager.Theme="{StaticResource Theme}" 337.                         Text="{Binding Body, Mode=TwoWay}" 338.                         AcceptsReturn="true" 339.                         Margin="10,10,20,2" 340.                         HorizontalScrollBarVisibility="Auto" 341.                         VerticalScrollBarVisibility="Auto" /> 342.                <!-- Start/End date --> 343.                <TextBlock x:Name="StartDateLabel" 344.                           Grid.Row="2" 345.                           Grid.Column="0" 346.                           Margin="0,13,0,2" 347.                           telerik:LocalizationManager.ResourceKey="StartTime" 348.                           Style="{StaticResource FormElementTextBlockStyle}" /> 349.                <telerikScheduler:DateTimePicker x:Name="StartDateTime" 350.                                                 Height="22" 351.                                                 Grid.Row="2" 352.                                                 Grid.Column="1" 353.                                                 HorizontalAlignment="Left" 354.                                                 Margin="10,10,20,2" 355.                                                 Style="{StaticResource FormElementStyle}" 356.                                                 SelectedDateTime="{Binding Start, Mode=TwoWay}" 357.                                                 telerikScheduler:StartEndDatePicker.EndPicker="{Binding ElementName=EndDateTime}" 358.                                                 IsTabStop="False" 359.                                                 IsEnabled="False" /> 360.                <TextBlock x:Name="EndDateLabel" 361.                           Grid.Row="3" 362.                           Grid.Column="0" 363.                           Margin="0,13,0,2" 364.                           telerik:LocalizationManager.ResourceKey="EndTime" 365.                           Style="{StaticResource FormElementTextBlockStyle}" /> 366.                <telerikScheduler:DateTimePicker x:Name="EndDateTime" 367.                                                 Height="22" 368.                                                 Grid.Row="3" 369.                                                 Grid.Column="1" 370.                                                 HorizontalAlignment="Left" 371.                                                 Margin="10,10,20,2" 372.                                                 Style="{StaticResource FormElementStyle}" 373.                                                 IsTabStop="False" 374.                                                 IsEnabled="False" 375.                                                 SelectedDateTime="{Binding End, Mode=TwoWay}" /> 376.                <!-- Is-all-day selector --> 377.                <CheckBox x:Name="AllDayEventCheckbox" 378.                          IsChecked="{Binding IsAllDayEvent, Mode=TwoWay}" 379.                          Grid.Row="4" 380.                          Grid.Column="1" 381.                          Margin="10,10,20,2" 382.                          HorizontalAlignment="Left" 383.                          telerik:StyleManager.Theme="{StaticResource Theme}" 384.                          telerik:LocalizationManager.ResourceKey="AllDayEvent"> 385.                    <telerik:CommandManager.InputBindings> 386.                        <telerik:InputBindingCollection> 387.                            <telerik:MouseBinding Command="telerikScheduler:RadSchedulerCommands.ChangeTimePickersVisibility" 388.                                                  Gesture="LeftClick" /> 389.                        </telerik:InputBindingCollection> 390.                    </telerik:CommandManager.InputBindings> 391.                </CheckBox> 392.                <Grid Grid.Row="5" 393.                      Grid.ColumnSpan="2"> 394.                    <Grid.ColumnDefinitions> 395.                        <ColumnDefinition Width="Auto" 396.                                          MinWidth="100" /> 397.                        <ColumnDefinition Width="Auto" 398.                                          MinWidth="200" /> 399.                    </Grid.ColumnDefinitions> 400.                    <Grid.RowDefinitions> 401.                        <RowDefinition Height="Auto" /> 402.                        <RowDefinition Height="Auto" /> 403.                    </Grid.RowDefinitions> 404.                    <TextBlock Text="Applicant" 405.                               Margin="0,13,0,2" 406.                               Style="{StaticResource FormElementTextBlockStyle}" /> 407.                    <telerikInput:RadComboBox IsEditable="False" 408.                                              Grid.Column="1" 409.                                              Height="24" 410.                                              VerticalAlignment="Center" 411.                                              ItemsSource="{Binding Source={StaticResource DataContextProxy}, Path=DataSource.ApplicantList}" 412.                                              SelectedValue="{Binding ApplicantID, Mode=TwoWay}" 413.                                              SelectedValuePath="ApplicantID" 414.                                              DisplayMemberPath="FirstName" /> 415.                       416.                    <TextBlock Text="Job" 417.                               Margin="0,13,0,2" 418.                               Grid.Row="1" 419.                               Style="{StaticResource FormElementTextBlockStyle}" /> 420.                    <telerikInput:RadComboBox IsEditable="False" 421.                                              Grid.Column="1" 422.                                              Grid.Row="1" 423.                                              Height="24" 424.                                              VerticalAlignment="Center" 425.                                              ItemsSource="{Binding Source={StaticResource DataContextProxy}, Path=DataSource.JobsList}" 426.                                              SelectedValue="{Binding PostingID, Mode=TwoWay}" 427.                                              SelectedValuePath="PostingID" 428.                                              DisplayMemberPath="JobTitle"/> 429.                </Grid> 430.                    <!-- Resources --> 431.                <Grid x:Name="ResourcesLayout" 432.                      Grid.Row="7" 433.                      Grid.Column="0" 434.                      Grid.ColumnSpan="2" 435.                      MaxHeight="130" 436.                      Margin="20,5,20,0"> 437.                    <Border Margin="0" 438.                            BorderThickness="1" 439.                            BorderBrush="{StaticResource GenericShallowBorderBrush}" 440.                            Visibility="{Binding ElementName=ResourcesScrollViewer, Path=ComputedVerticalScrollBarVisibility}"></Border> 441.                    <ScrollViewer x:Name="ResourcesScrollViewer" 442.                                  IsTabStop="false" 443.                                  Grid.Row="6" 444.                                  Grid.Column="0" 445.                                  Grid.ColumnSpan="2" 446.                                  Margin="1" 447.                                  telerik:StyleManager.Theme="{StaticResource Theme}" 448.                                  VerticalScrollBarVisibility="Auto"> 449.                        <scheduler:ResourcesItemsControl x:Name="PART_Resources" 450.                                                         HorizontalAlignment="Left" 451.                                                         Padding="0,2,0,5" 452.                                                         IsTabStop="false" 453.                                                         ItemsSource="{TemplateBinding ResourceTypeModels}" 454.                                                         ItemTemplateSelector="{StaticResource ItemTemplateSelector}" /> 455.                    </ScrollViewer> 456.                </Grid> 457.                <StackPanel x:Name="FooterControls" 458.                            Margin="5 10 10 10" 459.                            Grid.Row="8" 460.                            Grid.Column="1" 461.                            HorizontalAlignment="Left" 462.                            Orientation="Horizontal"> 463.                    <telerik:RadButton x:Name="OKButton" 464.                                       Margin="5" 465.                                       Padding="10 0" 466.                                       MinWidth="80" 467.                                       Command="telerikScheduler:RadSchedulerCommands.SaveAppointment" 468.                                       telerik:StyleManager.Theme="{StaticResource Theme}" 469.                                       telerikNavigation:RadWindow.ResponseButton="Accept" 470.                                       telerik:LocalizationManager.ResourceKey="SaveAndCloseCommandText"> 471.                    </telerik:RadButton> 472.                    <telerik:RadButton x:Name="CancelButton" 473.                                       Margin="5" 474.                                       Padding="10 0" 475.                                       MinWidth="80" 476.                                       telerik:LocalizationManager.ResourceKey="Cancel" 477.                                       telerik:StyleManager.Theme="{StaticResource Theme}" 478.                                       telerikNavigation:RadWindow.ResponseButton="Cancel" 479.                                       Command="telerik:WindowCommands.Close"> 480.                    </telerik:RadButton> 481.                </StackPanel> 482.            </Grid> 483.            <vsm:VisualStateManager.VisualStateGroups> 484.                <vsm:VisualStateGroup x:Name="RecurrenceRuleState"> 485.                    <vsm:VisualState x:Name="RecurrenceRuleIsNull"> 486.                        <Storyboard> 487.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="StartDateTime" 488.                                                           Storyboard.TargetProperty="IsEnabled" 489.                                                           Duration="0"> 490.                                <DiscreteObjectKeyFrame KeyTime="0" 491.                                                        Value="True" /> 492.                            </ObjectAnimationUsingKeyFrames> 493.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EndDateTime" 494.                                                           Storyboard.TargetProperty="IsEnabled" 495.                                                           Duration="0"> 496.                                <DiscreteObjectKeyFrame KeyTime="0" 497.                                                        Value="True" /> 498.                            </ObjectAnimationUsingKeyFrames> 499.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AllDayEventCheckbox" 500.                                                           Storyboard.TargetProperty="IsEnabled" 501.                                                           Duration="0"> 502.                                <DiscreteObjectKeyFrame KeyTime="0" 503.                                                        Value="True" /> 504.                            </ObjectAnimationUsingKeyFrames> 505.                        </Storyboard> 506.                    </vsm:VisualState> 507.                    <vsm:VisualState x:Name="RecurrenceRuleIsNotNull"> 508.                        <Storyboard> 509.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="StartDateTime" 510.                                                           Storyboard.TargetProperty="IsEnabled" 511.                                                           Duration="0"> 512.                                <DiscreteObjectKeyFrame KeyTime="0" 513.                                                        Value="False" /> 514.                            </ObjectAnimationUsingKeyFrames> 515.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EndDateTime" 516.                                                           Storyboard.TargetProperty="IsEnabled" 517.                                                           Duration="0"> 518.                                <DiscreteObjectKeyFrame KeyTime="0" 519.                                                        Value="False" /> 520.                            </ObjectAnimationUsingKeyFrames> 521.                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AllDayEventCheckbox" 522.                                                           Storyboard.TargetProperty="IsEnabled" 523.                                                           Duration="0"> 524.                                <DiscreteObjectKeyFrame KeyTime="0" 525.                                                        Value="False" /> 526.                            </ObjectAnimationUsingKeyFrames> 527.                        </Storyboard> 528.                    </vsm:VisualState> 529.                </vsm:VisualStateGroup> 530.            </vsm:VisualStateManager.VisualStateGroups> 531.        </StackPanel> 532.    </ControlTemplate> 533.    <DataTemplate x:Key="AppointmentDialogWindowHeaderDataTemplate"> 534.        <StackPanel Orientation="Horizontal" 535.                    MaxWidth="400"> 536.            <TextBlock telerik:LocalizationManager.ResourceKey="Event" 537.                       Visibility="{Binding Appointment.IsAllDayEvent, Converter={StaticResource BooleanToVisibilityConverter}}" /> 538.            <TextBlock telerik:LocalizationManager.ResourceKey="Appointment" 539.                       Visibility="{Binding Appointment.IsAllDayEvent, Converter={StaticResource InvertedBooleanToVisibilityConverter}}" /> 540.            <TextBlock Text=" - " /> 541.            <TextBlock x:Name="SubjectTextBlock" 542.                       Visibility="{Binding Appointment.Subject, Converter={StaticResource NullToVisibilityConverter}}" 543.                       Text="{Binding Appointment.Subject}" /> 544.            <TextBlock telerik:LocalizationManager.ResourceKey="Untitled" 545.                       Visibility="{Binding Appointment.Subject, Converter={StaticResource InvertedNullToVisibilityConverter}}" /> 546.        </StackPanel> 547.    </DataTemplate> 548.    <Style x:Key="EditAppointmentStyle" 549.           TargetType="telerikScheduler:AppointmentDialogWindow"> 550.        <Setter Property="IconTemplate" 551.                Value="{StaticResource IconDataEditTemplate}" /> 552.        <Setter Property="HeaderTemplate" 553.                Value="{StaticResource AppointmentDialogWindowHeaderDataTemplate}" /> 554.        <Setter Property="Background" 555.                Value="{StaticResource DialogWindowBackground}" /> 556.        <Setter Property="Template" 557.                Value="{StaticResource EditAppointmentTemplate}" /> 558.    </Style> 559.</UserControl.Resources> The first line there is the DataContextProxy I mentioned previously- we use that again to work a bit of magic in this template. Where we start getting into the dialog in question is line 132, but line 407 is where things start getting interesting.  The ItemsSource is pointing at a list that exists in my ViewModel (or code-behind, if it is used as a DataContext), the SelectedValue is the item I am actually binding from the applicant (note the TwoWay binding), and SelectedValuePath and DisplayMemberPath ensure the proper applicant is being displayed from the collection.  You will also see similar starting on line 420 where I do the same for the Jobs we'll be displaying. Just to wrap-up the Xaml, here's the RadScheduler declaraction that ties this all together and will be the main focus of our view: 01.<telerikScheduler:RadScheduler x:Name="xJobsScheduler" 02.                  Grid.Row="1" 03.                  Grid.Column="1" 04.                  Width="800" 05.                  MinWidth="600" 06.                  Height="500" 07.                  MinHeight="300" 08.                  AppointmentsSource="{Binding Interviews}" 09.                  EditAppointmentStyle="{StaticResource EditAppointmentStyle}" 10.                  command:AppointmentAddedEventClass.Command="{Binding AddAppointmentCommand}" 11.                  command:ApptCreatedEventClass.Command="{Binding ApptCreatingCommand}" 12.                  command:ApptEditedEventClass.Command="{Binding ApptEditedCommand}" 13.                  command:ApptDeletedEventClass.Command="{Binding ApptDeletedCommand}"> 14.</telerikScheduler:RadScheduler> Now, we get to the ViewModel and what it takes to get that rigged up.  And for those of you who remember the jobs post, those command:s in the Xaml are pointing to attached behavior commands that reproduce the respective events.  This becomes very handy when we're setting up the code-behind version. ;) ViewModel I've been liking this approach so far, so I'm going to put the entire ViewModel here and then go into the lines of interest.  Of course, feel free to ask me questions about anything that isn't clear (by line number, ideally) so I can help out if I have missed anything important: 001.public class SchedulerViewModel : ViewModelBase 002.{ 003.    private readonly IEventAggregator eventAggregator; 004.    private readonly IRegionManager regionManager; 005.   006.    public RecruitingContext context; 007.   008.    private ObservableItemCollection<InterviewAppointment> _interviews = new ObservableItemCollection<InterviewAppointment>(); 009.    public ObservableItemCollection<InterviewAppointment> Interviews 010.    { 011.        get { return _interviews; } 012.        set 013.        { 014.            if (_interviews != value) 015.            { 016.                _interviews = value; 017.                NotifyChanged("Interviews"); 018.            } 019.        } 020.    } 021.   022.    private QueryableCollectionView _jobsList; 023.    public QueryableCollectionView JobsList 024.    { 025.        get { return this._jobsList; } 026.        set 027.        { 028.            if (this._jobsList != value) 029.            { 030.                this._jobsList = value; 031.                this.NotifyChanged("JobsList"); 032.            } 033.        } 034.    } 035.   036.    private QueryableCollectionView _applicantList; 037.    public QueryableCollectionView ApplicantList 038.    { 039.        get { return _applicantList; } 040.        set 041.        { 042.            if (_applicantList != value) 043.            { 044.                _applicantList = value; 045.                NotifyChanged("ApplicantList"); 046.            } 047.        } 048.    } 049.   050.    public DelegateCommand<object> AddAppointmentCommand { get; set; } 051.    public DelegateCommand<object> ApptCreatingCommand { get; set; } 052.    public DelegateCommand<object> ApptEditedCommand { get; set; } 053.    public DelegateCommand<object> ApptDeletedCommand { get; set; } 054.   055.    public SchedulerViewModel(IEventAggregator eventAgg, IRegionManager regionmanager) 056.    { 057.        // set Unity items 058.        this.eventAggregator = eventAgg; 059.        this.regionManager = regionmanager; 060.   061.        // load our context 062.        context = new RecruitingContext(); 063.        LoadOperation<Interview> loadOp = context.Load(context.GetInterviewsQuery()); 064.        loadOp.Completed += new EventHandler(loadOp_Completed); 065.   066.        this._jobsList = new QueryableCollectionView(context.JobPostings); 067.        context.Load(context.GetJobPostingsQuery()); 068.   069.        this._applicantList = new QueryableCollectionView(context.Applicants); 070.        context.Load(context.GetApplicantsQuery()); 071.   072.        AddAppointmentCommand = new DelegateCommand<object>(this.AddAppt); 073.        ApptCreatingCommand = new DelegateCommand<object>(this.ApptCreating); 074.        ApptEditedCommand = new DelegateCommand<object>(this.ApptEdited); 075.        ApptDeletedCommand = new DelegateCommand<object>(this.ApptDeleted); 076.   077.    } 078.   079.    void loadOp_Completed(object sender, EventArgs e) 080.    { 081.        LoadOperation loadop = sender as LoadOperation; 082.   083.        foreach (var ent in loadop.Entities) 084.        { 085.            _interviews.Add(EntityToAppointment(ent as Interview)); 086.        } 087.    } 088.   089.    #region Appointment Adding 090.   091.    public void AddAppt(object obj) 092.    { 093.        // now we have a new InterviewAppointment to add to our QCV :) 094.        InterviewAppointment newInterview = obj as InterviewAppointment; 095.   096.        this.context.Interviews.Add(AppointmentToEntity(newInterview)); 097.        this.context.SubmitChanges((s) => 098.        { 099.            ActionHistory myAction = new ActionHistory(); 100.            myAction.InterviewID = newInterview.InterviewID; 101.            myAction.PostingID = newInterview.PostingID; 102.            myAction.ApplicantID = newInterview.ApplicantID; 103.            myAction.Description = String.Format("Interview with {0} has been created by {1}", newInterview.ApplicantID.ToString(), "default user"); 104.            myAction.TimeStamp = DateTime.Now; 105.            eventAggregator.GetEvent<AddActionEvent>().Publish(myAction); 106.        } 107.            , null); 108.    } 109.   110.    public void ApptCreating(object obj) 111.    { 112.        // handled in the behavior, just a placeholder to ensure it runs :) 113.    } 114.   115.    #endregion 116.   117.    #region Appointment Editing 118.   119.    public void ApptEdited(object obj) 120.    { 121.        Interview editedInterview = (from x in context.Interviews 122.                            where x.InterviewID == (obj as InterviewAppointment).InterviewID 123.                            select x).SingleOrDefault(); 124.   125.        CopyAppointmentEdit(editedInterview, obj as InterviewAppointment); 126.   127.        context.SubmitChanges((s) => { 128.            ActionHistory myAction = new ActionHistory(); 129.            myAction.InterviewID = editedInterview.InterviewID; 130.            myAction.PostingID = editedInterview.PostingID; 131.            myAction.ApplicantID = editedInterview.ApplicantID; 132.            myAction.Description = String.Format("Interview with {0} has been modified by {1}", editedInterview.ApplicantID.ToString(), "default user"); 133.            myAction.TimeStamp = DateTime.Now; 134.            eventAggregator.GetEvent<AddActionEvent>().Publish(myAction); } 135.            , null); 136.    } 137.   138.    #endregion 139.   140.    #region Appointment Deleting 141.   142.    public void ApptDeleted(object obj) 143.    { 144.        Interview deletedInterview = (from x in context.Interviews 145.                                      where x.InterviewID == (obj as InterviewAppointment).InterviewID 146.                                      select x).SingleOrDefault(); 147.   148.        context.Interviews.Remove(deletedInterview); 149.        context.SubmitChanges((s) => 150.        { 151.            ActionHistory myAction = new ActionHistory(); 152.            myAction.InterviewID = deletedInterview.InterviewID; 153.            myAction.PostingID = deletedInterview.PostingID; 154.            myAction.ApplicantID = deletedInterview.ApplicantID; 155.            myAction.Description = String.Format("Interview with {0} has been deleted by {1}", deletedInterview.ApplicantID.ToString(), "default user"); 156.            myAction.TimeStamp = DateTime.Now; 157.            eventAggregator.GetEvent<AddActionEvent>().Publish(myAction); 158.        } 159.            , null); 160.    } 161.   162.    #endregion 163.   164.    #region Appointment Helpers :) 165.   166.    public Interview AppointmentToEntity(InterviewAppointment ia) 167.    { 168.        Interview newInterview = new Interview(); 169.        newInterview.Subject = ia.Subject; 170.        newInterview.Body = ia.Body; 171.        newInterview.Start = ia.Start; 172.        newInterview.End = ia.End; 173.        newInterview.ApplicantID = ia.ApplicantID; 174.        newInterview.PostingID = ia.PostingID; 175.        newInterview.InterviewID = ia.InterviewID; 176.   177.        return newInterview; 178.    } 179.   180.    public InterviewAppointment EntityToAppointment(Interview ia) 181.    { 182.        InterviewAppointment newInterview = new InterviewAppointment(); 183.        newInterview.Subject = ia.Subject; 184.        newInterview.Body = ia.Body; 185.        newInterview.Start = ia.Start; 186.        newInterview.End = ia.End; 187.        newInterview.ApplicantID = ia.ApplicantID; 188.        newInterview.PostingID = ia.PostingID; 189.        newInterview.InterviewID = ia.InterviewID; 190.   191.        return newInterview; 192.    } 193.   194.    public void CopyAppointmentEdit(Interview entityInterview, InterviewAppointment appointmentInterview) 195.    { 196.        entityInterview.Subject = appointmentInterview.Subject; 197.        entityInterview.Body = appointmentInterview.Body; 198.        entityInterview.Start = appointmentInterview.Start; 199.        entityInterview.End = appointmentInterview.End; 200.        entityInterview.ApplicantID = appointmentInterview.ApplicantID; 201.        entityInterview.PostingID = appointmentInterview.PostingID; 202.    } 203.   204.    #endregion 205.} One thing we're doing here which you won't see in any of the other ViewModels is creating a duplicate collection.  I know this is something which will be fixed down the line for using RadScheduler, simplifying this process, but with WCF RIA changing as it does I wanted to ensure functionality would remain consistent as I continued development on this application.  So, I do a little bit of duplication, but for the greater good.  This all takes place starting on line 79, so for every entity that comes back we add it to the collection that is bound to RadScheduler.  Otherwise, the DelegateCommands that you see correspond directly to the events they are named after.  In each case, rather than sending over the full event arguments, I just send in the appointment in question (coming through as the object obj in all cases) so I can add (line 91), edit (line 119), and delete appointments (line 142) like normal.  This just ensures they get updated back to my database.  Also, the one bit of code you won't see is for the Appointment Creating (line 110) event- that is because in the command I've created I simply make the replacement I need to: 1.void element_AppointmentCreating(object sender, AppointmentCreatingEventArgs e) 2.{ 3.    e.NewAppointment = new InterviewAppointment(); 4.    base.ExecuteCommand(); 5.} And the ViewModel is none the wiser, the appointments just work as far as it is concerned since as they are created they become InterviewAppointments.  End result?  I've customized my EditAppointmentDialog as follows: And adding, editing, and deleting appointments works like a charm.  I can even 'edit' by moving appointments around RadScheduler, so as they are dropped into a timeslot they perform their full edit routine and things get updated. And then, the Code-Behind Version Perhaps the thing I like the most about doing one then the other is I get to steal 90% or more of the code from the MVVM version.  For example, the only real changes to the Code-Behind Xaml file exist in the control declaration, in which I use events instead of attached-behavior-event-commands: 01.<telerikScheduler:RadScheduler x:Name="xJobsScheduler" 02.                  Grid.Row="1" 03.                  Grid.Column="1" 04.                  Width="800" 05.                  MinWidth="600" 06.                  Height="500" 07.                  MinHeight="300" 08.                  EditAppointmentStyle="{StaticResource EditAppointmentStyle}" 09.                  AppointmentAdded="xJobsScheduler_AppointmentAdded" 10.                  AppointmentCreating="xJobsScheduler_AppointmentCreating" 11.                  AppointmentEdited="xJobsScheduler_AppointmentEdited" 12.                  AppointmentDeleted="xJobsScheduler_AppointmentDeleted"> 13.</telerikScheduler:RadScheduler> Easy, right?  Otherwise, all the same styling in UserControl.Resources was re-used, right down to the DataContextProxy that lets us bind to a collection from our viewmodel (in this case, our code-behind) to use within the DataTemplate.  The code conversion gets even easier, as I could literally copy and paste almost everything from the ViewModel to my Code-Behind, just a matter of pasting the right section into the right event.  Here's the code-behind as proof: 001.public partial class SchedulingView : UserControl, INotifyPropertyChanged 002.{ 003.    public RecruitingContext context; 004.   005.    private QueryableCollectionView _jobsList; 006.    public QueryableCollectionView JobsList 007.    { 008.        get { return this._jobsList; } 009.        set 010.        { 011.            if (this._jobsList != value) 012.            { 013.                this._jobsList = value; 014.                this.NotifyChanged("JobsList"); 015.            } 016.        } 017.    } 018.   019.    private QueryableCollectionView _applicantList; 020.    public QueryableCollectionView ApplicantList 021.    { 022.        get { return _applicantList; } 023.        set 024.        { 025.            if (_applicantList != value) 026.            { 027.                _applicantList = value; 028.                NotifyChanged("ApplicantList"); 029.            } 030.        } 031.    } 032.   033.    private ObservableItemCollection<InterviewAppointment> _interviews = new ObservableItemCollection<InterviewAppointment>(); 034.    public ObservableItemCollection<InterviewAppointment> Interviews 035.    { 036.        get { return _interviews; } 037.        set 038.        { 039.            if (_interviews != value) 040.            { 041.                _interviews = value; 042.                NotifyChanged("Interviews"); 043.            } 044.        } 045.    } 046.   047.    public SchedulingView() 048.    { 049.        InitializeComponent(); 050.   051.        this.DataContext = this; 052.   053.        this.Loaded += new RoutedEventHandler(SchedulingView_Loaded); 054.    } 055.   056.    void SchedulingView_Loaded(object sender, RoutedEventArgs e) 057.    { 058.        this.xJobsScheduler.AppointmentsSource = Interviews; 059.   060.        context = new RecruitingContext(); 061.           062.        LoadOperation loadop = context.Load(context.GetInterviewsQuery()); 063.        loadop.Completed += new EventHandler(loadop_Completed); 064.   065.        this._applicantList = new QueryableCollectionView(context.Applicants); 066.        context.Load(context.GetApplicantsQuery()); 067.   068.        this._jobsList = new QueryableCollectionView(context.JobPostings); 069.        context.Load(context.GetJobPostingsQuery()); 070.    } 071.   072.    void loadop_Completed(object sender, EventArgs e) 073.    { 074.        LoadOperation loadop = sender as LoadOperation; 075.   076.        _interviews.Clear(); 077.   078.        foreach (var ent in loadop.Entities) 079.        { 080.            _interviews.Add(EntityToAppointment(ent as Interview)); 081.        } 082.    } 083.   084.    private void xJobsScheduler_AppointmentAdded(object sender, Telerik.Windows.Controls.AppointmentAddedEventArgs e) 085.    { 086.        // now we have a new InterviewAppointment to add to our QCV :) 087.        InterviewAppointment newInterview = e.Appointment as InterviewAppointment; 088.   089.        this.context.Interviews.Add(AppointmentToEntity(newInterview)); 090.        this.context.SubmitChanges((s) => 091.        { 092.            ActionHistory myAction = new ActionHistory(); 093.            myAction.InterviewID = newInterview.InterviewID; 094.            myAction.PostingID = newInterview.PostingID; 095.            myAction.ApplicantID = newInterview.ApplicantID; 096.            myAction.Description = String.Format("Interview with {0} has been created by {1}", newInterview.ApplicantID.ToString(), "default user"); 097.            myAction.TimeStamp = DateTime.Now; 098.            context.ActionHistories.Add(myAction); 099.            context.SubmitChanges(); 100.        } 101.            , null); 102.    } 103.   104.    private void xJobsScheduler_AppointmentCreating(object sender, Telerik.Windows.Controls.AppointmentCreatingEventArgs e) 105.    { 106.        e.NewAppointment = new InterviewAppointment(); 107.    } 108.   109.    private void xJobsScheduler_AppointmentEdited(object sender, Telerik.Windows.Controls.AppointmentEditedEventArgs e) 110.    { 111.        Interview editedInterview = (from x in context.Interviews 112.                                     where x.InterviewID == (e.Appointment as InterviewAppointment).InterviewID 113.                                     select x).SingleOrDefault(); 114.   115.        CopyAppointmentEdit(editedInterview, e.Appointment as InterviewAppointment); 116.   117.        context.SubmitChanges((s) => 118.        { 119.            ActionHistory myAction = new ActionHistory(); 120.            myAction.InterviewID = editedInterview.InterviewID; 121.            myAction.PostingID = editedInterview.PostingID; 122.            myAction.ApplicantID = editedInterview.ApplicantID; 123.            myAction.Description = String.Format("Interview with {0} has been modified by {1}", editedInterview.ApplicantID.ToString(), "default user"); 124.            myAction.TimeStamp = DateTime.Now; 125.            context.ActionHistories.Add(myAction); 126.            context.SubmitChanges(); 127.        } 128.            , null); 129.    } 130.   131.    private void xJobsScheduler_AppointmentDeleted(object sender, Telerik.Windows.Controls.AppointmentDeletedEventArgs e) 132.    { 133.        Interview deletedInterview = (from x in context.Interviews 134.                                      where x.InterviewID == (e.Appointment as InterviewAppointment).InterviewID 135.                                      select x).SingleOrDefault(); 136.   137.        context.Interviews.Remove(deletedInterview); 138.        context.SubmitChanges((s) => 139.        { 140.            ActionHistory myAction = new ActionHistory(); 141.            myAction.InterviewID = deletedInterview.InterviewID; 142.            myAction.PostingID = deletedInterview.PostingID; 143.            myAction.ApplicantID = deletedInterview.ApplicantID; 144.            myAction.Description = String.Format("Interview with {0} has been deleted by {1}", deletedInterview.ApplicantID.ToString(), "default user"); 145.            myAction.TimeStamp = DateTime.Now; 146.            context.ActionHistories.Add(myAction); 147.            context.SubmitChanges(); 148.        } 149.            , null); 150.    } 151.   152.    #region Appointment Helpers :) 153.   154.    public Interview AppointmentToEntity(InterviewAppointment ia) 155.    { 156.        Interview newInterview = new Interview(); 157.        newInterview.Subject = ia.Subject; 158.        newInterview.Body = ia.Body; 159.        newInterview.Start = ia.Start; 160.        newInterview.End = ia.End; 161.        newInterview.ApplicantID = ia.ApplicantID; 162.        newInterview.PostingID = ia.PostingID; 163.        newInterview.InterviewID = ia.InterviewID; 164.   165.        return newInterview; 166.    } 167.   168.    public InterviewAppointment EntityToAppointment(Interview ia) 169.    { 170.        InterviewAppointment newInterview = new InterviewAppointment(); 171.        newInterview.Subject = ia.Subject; 172.        newInterview.Body = ia.Body; 173.        newInterview.Start = ia.Start; 174.        newInterview.End = ia.End; 175.        newInterview.ApplicantID = ia.ApplicantID; 176.        newInterview.PostingID = ia.PostingID; 177.        newInterview.InterviewID = ia.InterviewID; 178.   179.        return newInterview; 180.    } 181.   182.    public void CopyAppointmentEdit(Interview entityInterview, InterviewAppointment appointmentInterview) 183.    { 184.        entityInterview.Subject = appointmentInterview.Subject; 185.        entityInterview.Body = appointmentInterview.Body; 186.        entityInterview.Start = appointmentInterview.Start; 187.        entityInterview.End = appointmentInterview.End; 188.        entityInterview.ApplicantID = appointmentInterview.ApplicantID; 189.        entityInterview.PostingID = appointmentInterview.PostingID; 190.    } 191.   192.    #endregion 193.   194.    #region INotifyPropertyChanged Members 195.   196.    public event PropertyChangedEventHandler PropertyChanged; 197.   198.    public void NotifyChanged(string propertyName) 199.    { 200.        if (string.IsNullOrEmpty(propertyName)) 201.            throw new ArgumentException("propertyName"); 202.   203.        PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 204.    } 205.   206.    #endregion 207.} Nice... right? :) One really important thing to note as well.  See on line 51 where I set the DataContext before the Loaded event?  This is super important, as if you don't have this set before the usercontrol is loaded, the DataContextProxy has no context to use and your EditAppointmentDialog Job/Applicant dropdowns will be blank and empty.  Trust me on this, took a little bit of debugging to figure out that by setting the DataContext post-loaded would only lead to disaster and frustration.  Otherwise, the only other real difference is that instead of sending an ActionHistory item through an event to get added to the database and saved, I do those right in the callback from submitting.  The Result Again, I only have to post one picture because these bad boys used nearly identical code for both the MVVM and the code-behind views, so our end result is... So what have we learned here today?  One, for the most part this MVVM thing is somewhat easy.  Yeah, you sometimes have to write a bunch of extra code, but with the help of a few useful snippits you can turn the process into a pretty streamlined little workflow.  Heck, this story gets even easier as you can see in this blog post by Michael Washington- specifically run a find on 'InvokeCommandAction' and you'll see the section regarding the command on TreeView in Blend 4.  Brilliant!  MVVM never looked so sweet! Otherwise, it is business as usual with RadScheduler for Silverlight whichever path you're choosing for your development.  Between now and the next post, I'll be cleaning up styles a bit (those RadComboBoxes are a little too close to my labels!) and adding some to the RowDetailsViews for Applicants and Jobs, so you can see all the info for an appointment in the dropdown tab view.  Otherwise, we're about ready to call a wrap on this oneDid you know that DotNetSlackers also publishes .net articles written by top known .net Authors? We already have over 80 articles in several categories including Silverlight. Take a look: here.

  Read the article

< Previous Page | 57 58 59 60 61