Search Results

Search found 17781 results on 712 pages for 'css height'.

Page 368/712 | < Previous Page | 364 365 366 367 368 369 370 371 372 373 374 375  | Next Page >

  • Safely defining variables for public callback functions in javascript

    - by djreed
    I am working with the YouTube iFrame API to embed a number of videos on a page. Documentation here: https://developers.google.com/youtube/iframe_api_reference#Requirements In summary, you load the API asynchronously using the following snippet: var tag = document.createElement('script'); tag.src = "http://www.youtube.com/player_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); Once loaded, the API fires the predefined callback function onYouTubePlayerAPIReady. For additional context: I am defining a library file for this in Google Closure. I am providing a namespace: goog.provide('yt.video'); I then use goog.exportSymbol so that the API can find the function. That all works fine. My challenge is that I would like to pass 2 variables to the callback function. Is there any way to do this without defining these 2 variables in the context of the window object? goog.provide('yt.video'); goog.require('goog.dom'); yt.video = function(videos, locales) { this.videos = videos; this.captionLocales = locales; this.init(); }; yt.video.prototype.init = function() { var tag = document.createElement('script'); tag.src = "http://www.youtube.com/player_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); }; /* * Callback function fired when YT API is ready * This is exported using goog.exportSymbol in another file and * is being fired by the API properly. */ yt.video.prototype.onPlayerReady = function(videos, locales) { window.console.log('this :' + this); //logs window window.console.log('this.videos : ' + this.videos); //logs undefined /* * Video settings from Django variable */ for(i=0; i<this.videos.length; i++) { var playerEvents = {}; var embedVars = {}; var el = this.videos[i].el; var playerVid = this.videos[i].vid; var playerWidth = this.videos[i].width; var playerHeight = this.videos[i].height; var captionLocales = this.videos[i].locales; if(this.videos[i].playerVars) var embedVars = this.videos[i].playerVars; } if(this.videos[i].events) { var playerEvents = this.videos[i].events; } /* * Show captions by default */ if(goog.array.indexOf(captionLocales, 'es') >= 0) { embedVars.cc_load_policy = 1; }; new YT.Player(el, { height: playerHeight, width: playerWidth, videoId: playerVid, events: playerEvents, playerVars: embedVars }); }; }; To intialize this, I am currently using the following within a self-executing anonymous function: var videos = [ {"vid": "video_id", "el": "player-1", "width": 640, "height": 390, "locales": ["es", "fr"], "events": {"onStateChange": stateChanged}}, {"vid": "video_id", "el": "player-2", "locales": ["es", "fr"], "width": 640, "height": 390} ]; var locales = ['es']; var videoTemplate = new yt.video(videos, locales);

    Read the article

  • Jquery mobile ajax request not working after 4-5 request is made in Android

    - by Coder_sLaY
    I am developing an application using jQuery mobile 1.1.0 RC1 and phonegap 1.5.0 I have a single HTML page which contains all the pages in it as a div(through data-role="page") here is my code <!DOCTYPE HTML> <html> <head> <title>Index Page</title> <!-- Adding viewport --> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Adding Phonegap scripts --> <script type="text/javascript" charset="utf-8" src="cordova/cordova-1.5.0.js"></script> <!-- Adding jQuery mobile and jQuery scripts & CSS --> <script type="text/javascript" src="jquery/jquery-1.7.1.min.js"></script> <link rel="stylesheet" href="jquerymobile/jquery.mobile-1.1.0-rc.1.min.css" /> <script type="text/javascript" src="jquery/jquery.validate.min.js"></script> <script type="text/javascript" src="jquerymobile/jquery.mobile-1.1.0-rc.1.min.js"></script> <link rel="stylesheet" href="css/colors.css"> <script type="text/javascript"> function page1(){ $.mobile.changePage("#page2", { transition : "slide" }); } function page2(){ $.mobile.changePage("#page1", { transition : "slide" }); } $("#page1").live("pageshow", function(e) { $.ajax({ type : 'GET', cache : false, url : "http://192.168.1.198:9051/something.xml" + "?time=" + Date.now(), data : { key : "value" }, dataType : "xml", success : function(xml) { console.log("Success Page1"); }, error : function(xhr) { } }); }); $("#page2").live("pageshow", function(e) { $.ajax({ type : 'GET', cache : false, url : "http://192.168.1.198:9051/something.xml" + "?time=" + Date.now(), data : { key : "value" }, dataType : "xml", success : function(xml) { console.log("Success Page2"); }, error : function(xhr) { } }); }); </script> <body> <div data-role="page" id="page1"> <div data-role="header">Page 1</div> <div data-role="content"> <input type="text" name="page1GetTime" id="page1GetTime" value="" /><a href="#" data-role="button" onclick="page1()" id="gotopage2"> Go to Page 2 </a> </div> </div> <div data-role="page" id="page2"> <div data-role="header">Page 2</div> <div data-role="content"> <input type="text" name="page2GetTime" id="page2GetTime" value="" /><a href="#" data-role="button" onclick="page2()" id="gotopage1">Go to Page 1</a> </div> </div> </body> Now when i click to "Go to page2" then page2 will be shown along with one ajax request .. If i keep on moving from one page to another then a ajax request is made.. This request stops responding after 4 to 5 request... Why is it happening?

    Read the article

  • How to hide the div on any click outside

    - by user1720527
    I am starting up on jquery and was tryin to create a simple div hide and show effect. The effects seem to work fine but i need that when user clicks on any other part of the document(i. except the hide/show box), the box should hide back. This is the jsfiddle : http://jsfiddle.net/39DzJ/. I have not styled it properly. I wanted the effects to work first. Can anyone help me out ? Here's the HTML code : <style> #mail_floater { background:#fce8bd; height:88px; width:342px; border:1px solid #b7ad02; border-radius:5px; position:absolute; left:200px; top:50px; border-top:none; z-index:100; padding:0; } #subscribe_user { width:248px; height:16px; border:1px solid #b7ad02; } #cust_care_floater { background:#fce8bd; height:12px; width:108px; border:1px solid #b7ad02; border-radius:2px; border-bottom-left-radius:2px; position:absolute; left:450px; top:30px; border-top:none; z-index:100; clear:both; font-family:Tahoma, Geneva, sans-serif; font-size:10px; font-weight:bold; color:#036f05; box-shadow:1px 1px 3px #ccc inset; } #closer { float:right; margin-right:5px; margin-top:2px; width:19px; height:19px; background:url(../images/close.png) no-repeat; } </style> </head> <body> <a href="#" id="subscribe">Subscribe</a> <a href="#" id="customer_care">Customer care</a> <div id="mail_floater"> <h5>Email</h5> <div id="closer"></div> <div id="email_input"><form><label>Enter E-mail : </label><span><input type="text" id="subscribe_user" /></span> <input type="submit" id="subscribe_me" value="Done" /></form></div> </div> <div id="cust_care_floater"> <span style="padding:0px 10px 0 10px;">033-993-99920</span> </div> </body>? The javascript code : $(document).ready ( function() { var disp_box=$('#mail_floater'); var sub_link=$('#subscribe'); var disp_box_2=$('#cust_care_floater'); var sub_link_2=$('#customer_care'); disp_box.hide(); disp_box_2.hide(); sub_link.click ( function() { disp_box.show(); }); disp_box.find('#closer').click ( function() { disp_box.hide(); }); sub_link_2.click ( function() { disp_box_2.show(); }); });

    Read the article

  • jQuery - Stucked Animation

    - by v1n_vampire
    I'm kind of tired with Javascript long script for animation and decide to try jQuery, but it seems I'm stuck even at the simplest code. CSS: #menu {float: right; font: italic 16px/16px Verdana, Geneva, sans-serif;} ul#nav {list-style: none;} ul#nav li {float: left; padding-right: 10px;} ul#nav li a {color: white;} ul#subnav {float: right; list-style: none; padding: 0; display: none;} ul#subnav li {float: left; padding: 10px 5px; white-space: nowrap;} ul#subnav li a {color: white;} Script: $(document).ready(function() { $('.nav').hover(function() { $(this).find('#subnav').stop().animate({width:'toggle'},350); }); }); HTML: <div id="menu"> <ul id="nav"> <li class="nav"> <a href="#"><img src="images/icon-home.png" width="36" height="36"/></a> <ul id="subnav"> <li><a href="#">Home</a></li> </ul> </li> <li class="nav"> <a href="#"><img src="images/icon-signin.png" width="36" height="36"/></a> <ul id="subnav"> <li><a href="#">Sign In</a></li> </ul> </li> <li class="nav"> <a href="#"><img src="images/icon-register.png" width="36" height="36"/></a> <ul id="subnav"> <li><a href="#">Create Account</a></li> </ul> </li> <li class="nav" style="padding-right: 0;"> <a href="#"><img src="images/icon-mail.png" width="36" height="36"/></a> <ul id="subnav"> <li style="padding-right: 0;"><a href="#">Contact Us</a></li> </ul> </li> </ul> </div> Here's the sample page: http://v1n-vampire.com/dev/jq-animation-stuck If you continue to hover on the nav from left to right then back to left, eventually the animation will stuck. How to solve this? Thank you in advance.

    Read the article

  • Having trouble with multiple Jquery libraries

    - by user3716971
    I've seen the posts about the no conflict but I'm not very code savvy and can't figure it out alone. I'm having trouble making two libraries work together. At the top I have the 1.9.1 library which controls a news ticker, and a carousel. Near the bottom there is a library 1.6.1, which controls a Dribbble feed. If I remove 1.6.1 everything but the dribbble feed works, and if I remove the 1.9.1 the dribbble feed is the only thing that works. I uploaded the website for you guys to check out. If you could edit my code to make it work that would be amazing, I don't have much knowledge of jquery. This version has a working dribbble feed at the very bottom http://michaelcullenbenson.com/MichaelCullenBenson.com/index.html and this version has a broken feed and everything else works. http://michaelcullenbenson.com/MichaelCullenBenson.com/index2.html Help would be AMAZING as the dribbble feed is the last element I'm trying to finish on my homepage and I'll be able to move on. <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="js/jquery.innerfade.js"></script> <script type="text/javascript"> $(document).ready( function(){ $('#news').innerfade({ animationtype: 'slide', speed: 600, timeout: 6000, type: 'random', containerheight: '1em' }); }); </script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="utilcarousel-files/utilcarousel/jquery.utilcarousel.min.js"></script> <script src="utilcarousel-files/magnific-popup/jquery.magnific-popup.js"></script> <script src="js/responsive-nav.js"></script> <script> $(function() { $('#fullwidth').utilCarousel({ breakPoints : [[600, 1], [800, 2], [1000, 3], [1300, 4],], mouseWheel : false, rewind : true, autoPlay : true, pagination : false }); $('#fullwidth2').utilCarousel({ breakPoints : [[600, 1], [800, 2], [1000, 3], [1300, 4],], mouseWheel : false, rewind : true, autoPlay : true, pagination : false }); }); </script> <script> $(document).ready(function() { var movementStrength = 25; var height = movementStrength / $(window).height(); var width = movementStrength / $(window).width(); $("#aboutarea").mousemove(function(e){ var pageX = e.pageX - ($(window).width() / 2); var pageY = e.pageY - ($(window).height() / 2); var newvalueX = width * pageX * -1 - 25; var newvalueY = height * pageY * -1 - 50; $('#aboutarea').css("background-position", newvalueX+"px "+newvalueY+"px"); }); }); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="dribbble.js"></script> <script type="text/javascript"> $(function () { $('#user').dribbble({ player: 'MCBDesign', total: 1 }); }); </script>

    Read the article

  • Dependency Property WPF Grid

    - by developer
    Hi All, I want to Bind the textblock text in WPF datagrid to a dependency property. Somehow, nothing gets displayed, but when I use the same textblock binding outside the grid, everything works fine. Below is my code, <Window.Resources> <Style x:Key="cellCenterAlign" TargetType="{x:Type toolkit:DataGridCell}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type toolkit:DataGridCell}"> <Grid Background="{TemplateBinding Background}"> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="ColumnHeaderStyle" TargetType="{x:Type toolkit:DataGridColumnHeader}"> <Setter Property="VerticalContentAlignment" Value="Center" /> <Setter Property="HorizontalContentAlignment" Value="Center"/> </Style> <ObjectDataProvider MethodName="GetValues" ObjectType="{x:Type sys:Enum}" x:Key="RoleValues"> <ObjectDataProvider.MethodParameters> <x:Type TypeName="domain:SubscriptionRole"/> </ObjectDataProvider.MethodParameters> </ObjectDataProvider> <DataTemplate x:Key="myTemplate"> <StackPanel> <TextBlock Text="{Binding Path=OtherSubs}"/> </StackPanel> </DataTemplate> </Window.Resources> <Grid> <Grid.RowDefinitions> <RowDefinition Height="220"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <StackPanel Grid.Row="0"> <toolkit:DataGrid Name="definitionGrid" Margin="0,10,0,0" AutoGenerateColumns="False" CanUserAddRows="False" CanUserDeleteRows="False" IsReadOnly="False" RowHeight="25" FontWeight="Normal" ItemsSource="{Binding programSubscription}" ColumnHeaderStyle="{DynamicResource ColumnHeaderStyle}" SelectionMode="Single" ScrollViewer.HorizontalScrollBarVisibility="Disabled" Width="450" ScrollViewer.VerticalScrollBarVisibility="Auto" Height="200"> <toolkit:DataGrid.Columns> <toolkit:DataGridTextColumn Header="Program" Width="80" Binding="{Binding Program.JobNum}" CellStyle="{StaticResource cellCenterAlign}" IsReadOnly="True"/> <toolkit:DataGridTemplateColumn Header="Role" Width="80" CellStyle="{StaticResource cellCenterAlign}"> <toolkit:DataGridTemplateColumn.CellTemplate> <DataTemplate> <ComboBox SelectedItem="{Binding Role}" ItemsSource="{Binding Source={StaticResource RoleValues}}" Width="70"> <ComboBox.Style> <Style> <Style.Triggers> <DataTrigger Binding="{Binding Path=Role}" Value="Owner"> <Setter Property="ComboBox.Focusable" Value="False"/> <Setter Property="ComboBox.IsEnabled" Value="False"/> <Setter Property="ComboBox.IsHitTestVisible" Value="False"/> </DataTrigger> </Style.Triggers> </Style> </ComboBox.Style> </ComboBox> </DataTemplate> </toolkit:DataGridTemplateColumn.CellTemplate> </toolkit:DataGridTemplateColumn> <toolkit:DataGridCheckBoxColumn Header="Email" Width="60" Binding="{Binding ReceivesEmail}" CellStyle="{StaticResource cellCenterAlign}"/> <!--<toolkit:DataGridTextColumn Header="Others" Width="220" Binding="{Binding programSubscription1.Subscriber.Username}" CellStyle="{StaticResource cellCenterAlign}" IsReadOnly="True"/>--> <toolkit:DataGridTemplateColumn Header="Others" Width="220" CellStyle="{StaticResource cellCenterAlign}" IsReadOnly="True"> <toolkit:DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBlock Text="{Binding Path=OtherSubs}"/> </DataTemplate> </toolkit:DataGridTemplateColumn.CellTemplate> </toolkit:DataGridTemplateColumn> </toolkit:DataGrid.Columns> </toolkit:DataGrid> <TextBlock Text="{Binding Path=OtherSubs}"/> </StackPanel> <Grid Grid.Row="1"> <Grid.ColumnDefinitions> <ColumnDefinition Width="200"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <StackPanel Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center"> <CheckBox Content="Show Only Active Programs" IsChecked="True" Margin="0,0,8,0"/> </StackPanel> <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Grid.Column="1" HorizontalAlignment="Right"> <Button Content="Save" Height="23" Width="75" Margin="0,0,8,0" Click="Save_Click"/> <Button Content="Cancel" Height="23" Width="75" Margin="0,0,8,0" Click="Cancel_Click" /> </StackPanel> </Grid> </Grid> Code-Behind public partial class ProgramSubscriptions : Window { public static ObservableCollection programSubscription { get; set; } public string OtherSubs { get { return (string)GetValue(OtherSubsProperty); } set { SetValue(OtherSubsProperty, value); } } public static readonly DependencyProperty OtherSubsProperty = DependencyProperty.Register("OtherSubs", typeof(string), typeof(ProgramSubscriptions), new UIPropertyMetadata(string.Empty)); private string CurrentUsername = "test"; public ProgramSubscriptions() { InitializeComponent(); DataContext = this; LoadData(); } protected void LoadData() { programSubscription = new ObservableCollection<ProgramSubscriptionViewModel>(); if (res != null && res.TotalResults > 0) { List<ProgramSubscriptionViewModel> UserPrgList = new List<ProgramSubscriptionViewModel>(); //other.... List<ProgramSubscriptionViewModel> OtherPrgList = new List<ProgramSubscriptionViewModel>(); ArrayList myList = new ArrayList(); foreach (DomainObject obj in res.ResultSet) { ProgramSubscription prg = (ProgramSubscription)obj; if (prg.Subscriber.Username == CurrentUsername) { UserPrgList.Add(new ProgramSubscriptionViewModel(prg)); myList.Add(prg.Program.ID); } else OtherPrgList.Add(new ProgramSubscriptionViewModel(prg)); } for (int i = 0; i < UserPrgList.Count; i++) { ProgramSubscriptionViewModel item = UserPrgList[i]; programSubscription.Add(item); } //other.... for (int i = 0; i < OtherPrgList.Count; i++) { foreach (int y in myList) { ProgramSubscriptionViewModel otheritem = OtherPrgList[i]; if (y == otheritem.Program.ID) OtherSubs += otheritem.Subscriber.Username + ", "; } } } } } I posted the entire code. What exactly I want to do is in the datagridtemplatecolumn for others I want to display the usernames that are not in CurrentUsername, but they have the same program Id as the CurrentUsername. Please do let me know if there is another way that i can make this work, instead of using a dependencyproperty, althouht for testing I did put a textblock below datagrid, and it works perfectly fine.. Help!

    Read the article

  • Regarding playing media file in Android media player application

    - by Mangesh
    Hi. I am new to android development. I just started with creating my own media player application by looking at the code samples given in Android SDK. While I am trying to play a local media file (m.3gp), I am getting IOException error :: error(1,-4). Please can somebody help me in this regard. Here is my code. package com.mediaPlayer; import java.io.IOException; import android.app.Activity; import android.app.AlertDialog; import android.content.DialogInterface; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; import android.media.MediaPlayer; import android.media.MediaPlayer.OnBufferingUpdateListener; import android.media.MediaPlayer.OnCompletionListener; import android.media.MediaPlayer.OnPreparedListener; import android.media.MediaPlayer.OnVideoSizeChangedListener; import android.view.SurfaceHolder; import android.util.Log; public class MediaPlayer1 extends Activity implements OnBufferingUpdateListener, OnCompletionListener,OnPreparedListener, OnVideoSizeChangedListener,SurfaceHolder.Callback { private static final String TAG = "MediaPlayerByMangesh"; // Widgets in the application private Button btnPlay; private Button btnPause; private Button btnStop; private MediaPlayer mMediaPlayer; private String path = "m.3gp"; private SurfaceHolder holder; private int mVideoWidth; private int mVideoHeight; private boolean mIsVideoSizeKnown = false; private boolean mIsVideoReadyToBePlayed = false; // For the id of radio button selected private int radioCheckedId = -1; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { Log.d(TAG, "Entered OnCreate:"); super.onCreate(savedInstanceState); setContentView(R.layout.main); Log.d(TAG, "Creatinging Buttons:"); btnPlay = (Button) findViewById(R.id.btnPlay); btnPause = (Button) findViewById(R.id.btnPause); // On app load, the Pause button is disabled btnPause.setEnabled(false); btnStop = (Button) findViewById(R.id.btnStop); btnStop.setEnabled(false); /* * Attach a OnCheckedChangeListener to the radio group to monitor radio * buttons selected by user */ Log.d(TAG, "Watching for Click"); /* Attach listener to the Calculate and Reset buttons */ btnPlay.setOnClickListener(mClickListener); btnPause.setOnClickListener(mClickListener); btnStop.setOnClickListener(mClickListener); } /* * ClickListener for the Calculate and Reset buttons. Depending on the * button clicked, the corresponding method is called. */ private OnClickListener mClickListener = new OnClickListener() { @Override public void onClick(View v) { switch (v.getId()) { case R.id.btnPlay: Log.d(TAG, "Clicked Play Button"); Log.d(TAG, "Calling Play Function"); Play(); break; case R.id.btnPause: Pause(); break; case R.id.btnStop: Stop(); break; } } }; /** * Play the Video. */ private void Play() { // Create a new media player and set the listeners mMediaPlayer = new MediaPlayer(); Log.d(TAG, "Entered Play function:"); try { mMediaPlayer.setDataSource(path); } catch(IOException ie) { Log.d(TAG, "IO Exception:" + path); } mMediaPlayer.setDisplay(holder); try { mMediaPlayer.prepare(); } catch(IOException ie) { Log.d(TAG, "IO Exception:" + path); } mMediaPlayer.setOnBufferingUpdateListener(this); mMediaPlayer.setOnCompletionListener(this); mMediaPlayer.setOnPreparedListener(this); //mMediaPlayer.setOnVideoSizeChangedListener(this); //mMediaPlayer.setAudioStreamType(AudioManager.STREAM_MUSIC); } public void onBufferingUpdate(MediaPlayer arg0, int percent) { Log.d(TAG, "onBufferingUpdate percent:" + percent); } public void onCompletion(MediaPlayer arg0) { Log.d(TAG, "onCompletion called"); } public void onVideoSizeChanged(MediaPlayer mp, int width, int height) { Log.v(TAG, "onVideoSizeChanged called"); if (width == 0 || height == 0) { Log.e(TAG, "invalid video width(" + width + ") or height(" + height + ")"); return; } mIsVideoSizeKnown = true; mVideoWidth = width; mVideoHeight = height; if (mIsVideoReadyToBePlayed && mIsVideoSizeKnown) { startVideoPlayback(); } } public void onPrepared(MediaPlayer mediaplayer) { Log.d(TAG, "onPrepared called"); mIsVideoReadyToBePlayed = true; if (mIsVideoReadyToBePlayed && mIsVideoSizeKnown) { startVideoPlayback(); } } public void surfaceChanged(SurfaceHolder surfaceholder, int i, int j, int k) { Log.d(TAG, "surfaceChanged called"); } public void surfaceDestroyed(SurfaceHolder surfaceholder) { Log.d(TAG, "surfaceDestroyed called"); } public void surfaceCreated(SurfaceHolder holder) { Log.d(TAG, "surfaceCreated called"); Play(); } private void startVideoPlayback() { Log.v(TAG, "startVideoPlayback"); holder.setFixedSize(176, 144); mMediaPlayer.start(); } /** * Pause the Video */ private void Pause() { ; /* * If all fields are populated with valid values, then proceed to * calculate the tips */ } /** * Stop the Video. */ private void Stop() { ; /* * If all fields are populated with valid values, then proceed to * calculate the tips */ } /** * Shows the error message in an alert dialog * * @param errorMessage * String the error message to show * @param fieldId * the Id of the field which caused the error. This is required * so that the focus can be set on that field once the dialog is * dismissed. */ private void showErrorAlert(String errorMessage, final int fieldId) { new AlertDialog.Builder(this).setTitle("Error") .setMessage(errorMessage).setNeutralButton("Close", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { findViewById(fieldId).requestFocus(); } }).show(); } } Thanks, Mangesh Kumar K.

    Read the article

  • TreeViewItem - Use ControlTemplate and HierarchicalDataTemplate together

    - by CrownJ
    I'm using HierarchicalDataTemplate in my TreeView, and I wanted to also overwrite the default template for the TreeViewItem so that when an item is selected, it only highlights the text, not including the icon next to it. <TreeView.ItemTemplate> <HierarchicalDataTemplate ItemsSource="{Binding Children}"> <TreeViewItem Style="{StaticResource TreeViewItemStyle}" Header="{Binding DisplayText}" /> </HierarchicalDataTemplate> </TreeView.ItemTemplate> <TreeView.Resources> <Style x:Key="TreeViewItemFocusVisual"> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <Rectangle/> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="ExpandCollapseToggleStyle" TargetType="{x:Type ToggleButton}"> <Setter Property="Focusable" Value="False"/> <Setter Property="Width" Value="19"/> <Setter Property="Height" Value="13"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Border Width="19" Height="13" Background="Transparent"> <Border Width="9" Height="9" SnapsToDevicePixels="true" BorderBrush="#FF7898B5" BorderThickness="1" CornerRadius="1"> <Border.Background> <LinearGradientBrush EndPoint="1,1" StartPoint="0,0"> <GradientStop Color="White" Offset=".2"/> <GradientStop Color="#FFC0B7A6" Offset="1"/> </LinearGradientBrush> </Border.Background> <Path x:Name="ExpandPath" Fill="Black" Margin="1,1,1,1" Data="M 0 2 L 0 3 L 2 3 L 2 5 L 3 5 L 3 3 L 5 3 L 5 2 L 3 2 L 3 0 L 2 0 L 2 2 Z"/> </Border> </Border> <ControlTemplate.Triggers> <Trigger Property="IsChecked" Value="True"> <Setter Property="Data" TargetName="ExpandPath" Value="M 0 2 L 0 3 L 5 3 L 5 2 Z"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}"> <Setter Property="Background" Value="Transparent"/> <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> <Setter Property="Padding" Value="1,0,0,0"/> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> <Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type TreeViewItem}"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition/> </Grid.RowDefinitions> <ToggleButton x:Name="Expander" Style="{StaticResource ExpandCollapseToggleStyle}" ClickMode="Press" IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"/> <StackPanel Orientation="Horizontal" Grid.Column="1" > <Image Width="16" Height="16" Margin="3,0" Source="{Binding Path=ImageSource}" /> <Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Margin="0" Padding="0"> <ContentPresenter x:Name="PART_Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" ContentSource="Header"/> </Border> </StackPanel> <ItemsPresenter x:Name="ItemsHost" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1"/> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsExpanded" Value="false"> <Setter Property="Visibility" TargetName="ItemsHost" Value="Collapsed"/> </Trigger> <Trigger Property="HasItems" Value="false"> <Setter Property="Visibility" TargetName="Expander" Value="Hidden"/> </Trigger> <Trigger Property="IsSelected" Value="true"> <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> <Setter Property="Control.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/> </Trigger> <MultiTrigger> <MultiTrigger.Conditions> <Condition Property="IsSelected" Value="true"/> <Condition Property="IsSelectionActive" Value="false"/> </MultiTrigger.Conditions> <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> <Setter Property="Control.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> </MultiTrigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> <Style.Triggers> <Trigger Property="VirtualizingStackPanel.IsVirtualizing" Value="true"> <Setter Property="ItemsPanel"> <Setter.Value> <ItemsPanelTemplate> <VirtualizingStackPanel/> </ItemsPanelTemplate> </Setter.Value> </Setter> </Trigger> </Style.Triggers> </Style> </TreeView.Resources> I couldn't find a way to use both the HierarchicalDataTemplate and ControlTemplate together so I can specify the ItemsSource and also change parts of the control's behavior. When I do the above code, it won't select the treeviewitem at all.

    Read the article

  • Why won't Javascript assembled Iframe load in IE6 over HTTPS although it will over HTTP?

    - by Lauren
    The issue: The iframe won't load inside the tags on the review and submit page here: https://checkout.netsuite.com/s.nl/c.659197/sc.4/category.confirm/.f Login:[email protected] pass:test03 To produce problem: - Where it says "Your Third Party Shipper Numbers (To enter one, click here.)", click "here" to see the form that won't load in IE6. It seems to load in every other modern browser. The same form works fine on this page (you have to click on the "order sample" button to see the link to the same form): http://www.avaline.com/R3000_3 Here's the HTML: <div style="border-color: rgb(255, 221, 221);" id="itmSampl"> <div id="placeshipnum" style="display: none;"></div> <div id="sampAdd"> <strong>Your Third Party Shipper Numbers</strong> (To enter one, click <a rel="nofollow" href="javascript:;" onclick="enterShipNum()">here</a>.) <ul style="list-style: none outside none; padding-left: 20px;"> <li><span class="bold">UPS #</span>: 333333</li> <li><span class="bold">FedEx #</span>: 777888999</li> </ul> </div> </div> Upon clicking the "to enter one, click here" link this is the iframe HTML in all browsers except IE6 (in IE6, the "shipnum" div element is assembled, but that's it): <div id="placeshipnum" style="display: block;"> <div id="shipnum" style="background: none repeat scroll 0% 0% rgb(255, 255, 255);"> <div class="wrapper-x"> <a title="close window" class="linkfooter" href="javascript:;" onclick="enterShipNum()"> <img height="11" width="11" alt="close window" src="/c.659197/site/av-template/x-image-browser.gif"> </a> </div> <iframe scrolling="no" height="240" frameborder="0" width="190" src="https://forms.netsuite.com/app/site/crm/externalleadpage.nl?compid=659197&amp;formid=56&amp;h=9b260d2f9bca0fd9c300&amp;[email protected]&amp;firstname=Test&amp;lastname=Account&amp;ck=Q1BnzaRXAe_RfjhE&amp;vid=Q1BnzaRXAd3Rfik7&amp;cktime=87919&amp;cart=5257&amp;promocode=SAMPLE&amp;chrole=1014&amp;cjsid=0a0102621f435ef0d0d4b3cd49ab8b2db4e253c671eb" allowtransparency="true" border="0" onload="hideShipLoadImg()" style="display: block;"></iframe></div></div> This is the relevant Javascript: // Allow for shipper number update var shipNumDisplay=0; function enterShipNum() { if (shipNumDisplay == 0){ //odrSampl(); document.getElementById('placeshipnum').style.display="block"; document.getElementById('placeshipnum').innerHTML='<div id="shipnum"><div class="wrapper-x"> <a onclick="enterShipNum()" href="javascript:;" class="linkfooter" title="close window"> <img height="11" width="11" src="/c.659197/site/av-template/x-image-browser.gif" alt="close window" /> </a> </div><iframe onload="hideShipLoadImg()" scrolling="no" height="240" frameborder="0" width="190" border="0" allowtransparency="true" src="https://forms.netsuite.com/app/site/crm/externalleadpage.nl?compid=659197&formid=56&h=9b260d2f9bca0fd9c300&[email protected]&firstname=Test&lastname=Account&ck=Q1BnzaRXAe_RfjhE&vid=Q1BnzaRXAd3Rfik7&cktime=87919&cart=5257&promocode=SAMPLE&chrole=1014&cjsid=0a0102621f435ef0d0d4b3cd49ab8b2db4e253c671eb"></iframe></div>'; shipNumDisplay=1; } else { document.getElementById('placeshipnum').style.display="none"; document.getElementById('shipnum').parentNode.removeChild(document.getElementById('shipnum')); shipNumDisplay=0; } } function hideShipLoadImg(){ var shipiframe= document.getElementById('shipnum').getElementsByTagName('iframe')[0]; shipiframe.style.display = 'block'; shipiframe.parentNode.style.background = '#fff'; } This is most of the form inside the iframe although I don't think it's relevant: <form style="margin: 0pt;" onsubmit="return ( window.isinited &amp;&amp; window.isvalid &amp;&amp; save_record( true ) )" action="/app/site/crm/externalleadpage.nl" enctype="multipart/form-data" method="POST" name="main_form" id="main_form"> <div class="field name"> <label for="firstname">First Name <span class="required">*</span></label> <span class="input" id="firstname_fs"><span class="input" id="firstname_val">Test</span></span><input type="hidden" id="firstname" name="firstname" value="Test" onchange="nlapiFieldChanged(null,'firstname');"> </div> <div class="field name"> <label for="lastname">Last Name <span class="required">*</span></label> <span class="input" id="lastname_fs"><span class="input" id="lastname_val">Account</span></span><input type="hidden" id="lastname" name="lastname" value="Account" onchange="nlapiFieldChanged(null,'lastname');"> </div> <div id="ups" class="field"> <label for="custentity4">UPS # </label> <span id="custentity4_fs" style="white-space: nowrap;"><input type="text" id="custentity4" onblur="if (this.checkvalid == true) {this.isvalid=(validate_field(this,'text',false,false) &amp;&amp; nlapiValidateField(null,'custentity4'));} if (this.isvalid == false) { selectAndFocusField(this); return this.isvalid;}" name="custentity4" size="25" onfocus="if (this.isvalid == true || this.isvalid == false) this.checkvalid=true;" onchange="setWindowChanged(window, true);this.isvalid=(validate_field(this,'text',true,false) &amp;&amp; nlapiValidateField(null,'custentity4'));this.checkvalid=false;if (this.isvalid) {nlapiFieldChanged(null,'custentity4');;}if (this.isvalid) this.isvalid=validate_textfield_maxlen(this,6,true,true);if (!this.isvalid) { selectAndFocusField(this);}return this.isvalid;" class="input" maxlength="6"></span> </div> <div id="fedex" class="field"> <label for="custentity9">FedEx # </label> <span id="custentity9_fs" style="white-space: nowrap;"><input type="text" id="custentity9" onblur="if (this.checkvalid == true) {this.isvalid=(validate_field(this,'text',false,false) &amp;&amp; nlapiValidateField(null,'custentity9'));} if (this.isvalid == false) { selectAndFocusField(this); return this.isvalid;}" name="custentity9" size="25" onfocus="if (this.isvalid == true || this.isvalid == false) this.checkvalid=true;" onchange="setWindowChanged(window, true);this.isvalid=(validate_field(this,'text',true,false) &amp;&amp; nlapiValidateField(null,'custentity9'));this.checkvalid=false;if (this.isvalid) {nlapiFieldChanged(null,'custentity9');;}if (this.isvalid) this.isvalid=validate_textfield_maxlen(this,9,true,true);if (!this.isvalid) { selectAndFocusField(this);}return this.isvalid;" class="input" maxlength="9"></span> </div> <div class="field hidden"><input type="hidden" id="email" name="email" value="[email protected]"></div> <div class="field"><label class="submit" for="submitbutton"><span class="required">*</span> Indicates required fields.</label></div> <input type="submit" id="submitbutton" value="submit"> <!-- REQUIRED HIDDEN FIELDS FOR HTML ONLINE FORM --> <input type="hidden" value="659197" name="compid"><input type="hidden" value="56" name="formid"><input type="hidden" value="" name="id"><input type="hidden" value="9b260d2f9bca0fd9c300" name="h"><input type="hidden" value="-1" name="rectype"><input type="hidden" value="" name="nlapiPI"><input type="hidden" value="" name="nlapiSR"><input type="hidden" value="ShipValidateField" name="nlapiVF"><input type="hidden" value="" name="nlapiFC"><input type="hidden" value="/app/site/crm/externalleadpage.nl?compid=659197&amp;formid=56&amp;h=9b260d2f9bca0fd9c300&amp;[email protected]&amp;firstname=Test&amp;lastname=Account&amp;ck=Q1BnzaRXAe_RfjhE&amp;vid=Q1BnzaRXAd3Rfik7&amp;cktime=87919&amp;cart=5257&amp;promocode=SAMPLE&amp;chrole=1014&amp;cjsid=0a0102621f435ef0d0d4b3cd49ab8b2db4e253c671eb" name="whence"><input type="hidden" name="submitted"> <iframe height="0" style="visibility: hidden;" name="server_commands" id="server_commands" src="javascript:false"></iframe> <!-- END OF REQUIRED HIDDEN FIELDS FOR HTML ONLINE FORM --> </form>

    Read the article

  • Dojo - How to position tooltip close to text?

    - by user244394
    Like the title says i want to be able to display the tooltip close to the text, currently it is displayed far away in the cell. Tobe noted the tooltip positions correctly for large text, only fails for small text. In DOJO How can i position the tooltip close to the text? I have this bit of code snippet that display the tooltip in the grid cells. Screenshot attached, html <div class="some_app claro"></div> ... com.c.widget.EnhancedGrid = function ( aParent, options ) { var grid, options; this.theParentApp = aParent; dojo.require("dojox.grid.EnhancedGrid"); dojo.require("dojox.grid.enhanced.plugins.Menu"); dojo.require("dojox.grid.enhanced.plugins.Selector"); dojo.require("dojox.grid.enhanced.plugins.Pagination"); dojo.require("dojo.store.Memory"); dojo.require("dojo.data.ObjectStore"); dojo.require("dojo._base.xhr"); dojo.require("dojo.domReady!"); dojo.require("dojo.date.locale"); dojo.require("dojo._base.connect"); dojo.require("dojox.data.JsonRestStore"); dojo.require("dojo.data.ItemFileReadStore"); dojo.require("dijit.Menu"); dojo.require("dijit.MenuItem"); dojo.require('dijit.MenuSeparator'); dojo.require('dijit.CheckedMenuItem'); dojo.require('dijit.Tooltip'); dojo.require('dojo/query'); dojo.require("dojox.data.QueryReadStore"); // main initialization function this.init = function( options ) { var me = this; // default options var defaultOptions = { widgetName: ' Enhancedgrid', render: true, // immediately render the grid draggable: true, // disables column dragging containerNode: false, // the Node to hold the Grid (optional) mashupUrl: false, // the URL of the mashup (required) rowsPerPage: 20, //Default number of items per page columns: false, // columns (required) width: "100%", // width of grid height: "100%", // height of grid rowClass: function (rowData) {}, onClick: function () {}, headerMenu: false, // adding a menu pop-up for the header. selectedRegionMenu: false, // adding a menu pop-up for the rows. menusObject: false, //object to start-up the menus using the plug-in. sortInfo: false, // The column default sort infiniteScrolling: false //If true, the enhanced grid will have an infinite scrolling. }; // merge user provided options me.options = jQuery.extend( {}, defaultOptions, options ); // check we have minimum required options if ( ! me.options.mashupUrl ){ throw ("You must supply a mashupUrl"); } if ( ! me.options.columns ){ throw ("You must supply columns"); } // make the column for formatting based on its data type. me.preProcessColumns(); // create the Contextual Menu me.createMenu(); // create the grid object and return me.createGrid(); }; // Loading the data to the grid. this.loadData = function () { var me = this; if (!me.options.infiniteScrolling) { var xhrArgs = { url: me.options.mashupUrl, handleAs: "json", load: function( data ){ var store = new dojo.data.ItemFileReadStore({ data : {items : eval( "data."+me.options.dataRoot)}}); store.fetch({ onComplete : function(items, request) { if (me.grid.selection !== null) { me.grid.selection.clear(); } me.grid.setStore(store); }, onError : function(error) { me.onError(error); } }); }, error: function (error) { me.onError(error); } }; dojo.xhrGet(xhrArgs); } else { dojo.declare('NotificationQueryReadStore', dojox.data.QueryReadStore, { // // hacked -- override to map to proper data structure // from mashup // _xhrFetchHandler : function(data, request, fetchHandler, errorHandler) { // // TODO: need to have error handling here when // data has "error" data structure // // // remap data object before process by super method // var dataRoot = eval ("data."+me.options.dataRoot); var dataTotal = eval ("data."+me.options.dataTotal); data = { numRows : dataTotal, items : dataRoot }; // call to super method to process mapped data and // set rowcount // for proper display this.inherited(arguments); } }); var queryStore = new NotificationQueryReadStore({ url : me.options.mashupUrl, urlPreventCache: true, requestMethod : "get", onError: function (error) { me.onError(error); } }); me.grid.setStore(queryStore); } }; this.preProcessColumns = function () { var me = this; var options = me.options; for (i=0;i<this.options.columns.length;i++) { if (this.options.columns[i].formatter==null) { switch (this.options.columns[i].datatype) { case "string": this.options.columns[i].formatter = me.formatString; break; case "date": this.options.columns[i].formatter = me.formatDate; var todayDate = new Date(); var gmtTime = c.util.Date.parseDate(todayDate.toString()).toString(); var gmtval = gmtTime.substring(gmtTime.indexOf('GMT'),(gmtTime.indexOf('(')-1)); this.options.columns[i].name = this.options.columns[i].name + " ("+gmtval+")"; } } if (this.options.columns[i].sortDefault) { me.options.sortInfo = i+1; } } }; // create GRID object using supplied options this.createGrid = function () { var me = this; var options = me.options; // create a new grid this.grid = new dojox.grid.EnhancedGrid ({ width: options.width, height: options.height, query: { id: "*" }, keepSelection: true, formatterScope: this, structure: options.columns, columnReordering: options.draggable, rowsPerPage: options.rowsPerPage, //sortInfo: options.sortInfo, plugins : { menus: options.menusObject, selector: {"row":"multi", "cell": "disabled" }, }, //Allow the user to decide if a column is sortable by setting sortable = true / false canSort: function(col) { if (options.columns[Math.abs(col)-1].sortable) return true; else return false; }, //Change the row colors depending on severity column. onStyleRow: function (row) { var grid = me.grid; var item = grid.getItem(row.index); if (item && options.rowClass(item)) { row.customClasses += " " +options.rowClass(item); if (grid.selection.selectedIndex == row.index) { row.customClasses += " dojoxGridRowSelected"; } grid.focus.styleRow(row); grid.edit.styleRow(row); } }, onCellMouseOver: function (e){ // var pos = dojo.position(this, true); // alert(pos); console.log( e.rowIndex +" cell node :"+ e.cellNode.innerHTML); // var pos = dojo.position(this, true); console.log( " pos :"+ e.pos); if (e.cellNode.innerHTML!="") { dijit.showTooltip(e.cellNode.innerHTML, e.cellNode); } }, onCellMouseOut: function (e){ dijit.hideTooltip(e.cellNode); }, onHeaderCellMouseOver: function (e){ if (e.cellNode.innerHTML!="") { dijit.showTooltip(e.cellNode.innerHTML, e.cellNode); } }, onHeaderCellMouseOut: function (e){ dijit.hideTooltip(e.cellNode); }, }); // ADDED CODE FOR TOOLTIP var gridTooltip = new Tooltip({ connectId: "grid1", selector: "td", position: ["above"], getContent: function(matchedNode){ var childNode = matchedNode.childNodes[0]; if(childNode.nodeType == 1 && childNode.className == "user") { this.position = ["after"]; this.open(childNode); return false; } if(matchedNode.className && matchedNode.className == "user") { this.position = ["after"]; } else { this.position = ["above"]; } return matchedNode.textContent; } }); ... //Construct the grid this.buildGrid = function(){ var datagrid = new com.emc.widget.EnhancedGrid(this,{ Url: "/dge/api/-resultFormat=json&id="+encodeURIComponent(idUrl), dataRoot: "Root.ATrail", height: '100%', columns: [ { name: 'Time', field: 'Time', width: '20%', datatype: 'date', sortable: true, searchable: true, hidden: false}, { name: 'Type', field: 'Type', width: '20%', datatype: 'string', sortable: true, searchable: true, hidden: false}, { name: 'User ID', field: 'UserID', width: '20%', datatype: 'string', sortable: true, searchable: true, hidden: false } ] }); this.grid = datagrid; };

    Read the article

  • MediaElement.js setSrc() Loading The File But Not Changing pluginType

    - by doubleJ
    I'm working on a page that uses mediaelement.js to play mp3/mp4/wmv (yes, we have a lot of wmv). I have a list of links and those links should change the player. My effort is to make the changes to the player through javascript so that the page doesn't refresh. This code is working, but it refreshes every time. See a live demo of the non-ajax version. <?php $file = null; $file = $_GET["file"]; $format = null; if (preg_match("/mp4/i", $file)) $format = "mp4"; if (preg_match("/webm/i", $file)) $format = "webm"; if (preg_match("/wmv/i", $file)) $format = "wmv"; if (preg_match("/mp3/i", $file)) $format = "mp3"; if (preg_match("/ogg/i", $file)) $format = "ogg"; $mime = null; if ($format == "mp4") $mime = "video/mp4"; if ($format == "webm") $mime = "video/webm"; if ($format == "wmv") $mime = "video/wmv"; if ($format == "mp3") $mime = "audio/mp3"; if ($format == "ogg") $mime = "audio/ogg"; $element = "video"; if ($format == "mp3" || $format == "ogg") $element = "audio"; // you have to escape (\) the escape (\) character (hehehe...) $poster = "media\\120701Video.jpg"; $height = "360"; if ($format == "mp3") $height = "30"; ?> <!doctype html> <html> <head> <meta charset="utf-8"> <title>Embed</title> <link rel="stylesheet" href="include/johndyer-mediaelement-b090320/build/mediaelementplayer.min.css"> <style> audio {width:640px; height:30px;} video {width:640px; height:360px;} </style> <script src="include/johndyer-mediaelement-b090320/build/jquery.js"></script> <script src="include/johndyer-mediaelement-b090320/build/mediaelement-and-player.js"></script> </head> <body> <ul> <li><a href="embed.php">Reset</a></li> <li><a href="?file=media/120701Video-AnyVideoConverter.mp4">Alternative (mp4)</a></li> <li><a href="?file=media/120701Video-Ffmpeg-Defaults.webm">Alternative (webm)</a></li> <li><a href="?file=media/AreYouHurting-Death.wmv">Alternative (wmv)</a><li> <li><a href="?file=media/AreYouHurting-Death.mp3">Alternative (mp3)</a></li> </ul> <?php if ($file) { ?> <video src="<?php echo $file; ?>" controls poster="<?php echo $poster; ?>" width="640" height="360"></video> <div id="type"></div> <script> var video = document.getElementsByTagName("video")[0]; var player = new MediaElementPlayer(video, { success: function(player) { $('#type').html(player.pluginType); } }); <?php } ?> </script> </body> </html> This code requires <video> to be loaded, initially and with a file, so that the player mode (pluginType) is set. It will, then, only play formats that the pre-established mode supports (firefox in native mode won't play mp4). See a live demo of the ajax version. <!doctype html> <html> <head> <meta charset="utf-8"> <title>Embed</title> <link rel="stylesheet" href="http://www.mediaelementjs.com/js/mejs-2.9.2/mediaelementplayer.min.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script src="http://www.mediaelementjs.com/js/mejs-2.9.2/mediaelement-and-player.js"></script> </head> <body> <ul> <li><a href="javascript:player.pause(); player.setSrc('media/120701Video-AnyVideoConverter.mp4'); player.load(); player.play();">Alternative (mp4)</a></li> <li><a href="javascript:player.pause(); player.setSrc('media/120701Video-Ffmpeg-Defaults.webm'); player.load(); player.play();">Alternative (webm)</a></li> <li><a href="javascript:player.pause(); player.setSrc('media/AreYouHurting-Death.wmv'); player.load(); player.play();">Alternative (wmv)</a></li> <li><a href="javascript:player.pause(); player.setSrc('media/AreYouHurting-Death.mp3'); player.load(); player.play();">Alternative (mp3)</a></li> </ul> <video controls src="media/WordProductionCenter.mp4"></video> <div id="type"></div> <script> var video = document.getElementsByTagName("video")[0]; var player = new MediaElementPlayer(video, { success: function(player) { $('#type').html(player.pluginType); } }); </script> </body> </html> It seems like I need something like setType(), but I see no such option. I've read a couple pages that referenced refreshing the DOM after the javascript runs, but I haven't been able to successfully do it (I know enough about javascript to hack things around and get stuff working, but not enough to create whole new things). It is worth noting that Silverlight doesn't work with Internet Explorer 8 or Safari (not sure if it's my code, mejs, or the browsers). Also, neither Silverlight nor Flash play mp3 or webm (again, not sure where the problem lies). Is there a way to dynamically load different types of files into mediaelement?

    Read the article

  • Customized listfield with image displaying from a url

    - by arunabha
    I am displaying a customized list field with text on the right side and image on the left side.The image comes from a URL dynamically.Initially i am placing a blank image on the left of the list field,then call URLBitmapField class's setURL method,which actually does the processing and places the processed image on top of the blank image.The image gets displayed on the list field,but to see that processed image i need to press any key or click on the list field items.I want the processed image to be displayed automatically in the list field after the processing.Can anyone tell me where i am getting wrong? import java.util.Vector; import net.rim.device.api.system.Bitmap; import net.rim.device.api.system.Display; import net.rim.device.api.ui.ContextMenu; import net.rim.device.api.ui.DrawStyle; import net.rim.device.api.ui.Field; import net.rim.device.api.ui.Font; import net.rim.device.api.ui.Graphics; import net.rim.device.api.ui.Manager; import net.rim.device.api.ui.MenuItem; import net.rim.device.api.ui.UiApplication; import net.rim.device.api.ui.component.BitmapField; import net.rim.device.api.ui.component.Dialog; import net.rim.device.api.ui.component.LabelField; import net.rim.device.api.ui.component.ListField; import net.rim.device.api.ui.component.ListFieldCallback; import net.rim.device.api.ui.component.NullField; import net.rim.device.api.ui.container.FullScreen; import net.rim.device.api.ui.container.MainScreen; import net.rim.device.api.ui.container.VerticalFieldManager; import net.rim.device.api.util.Arrays; import net.rim.device.api.ui.component.ListField; public class TaskListField extends UiApplication { // statics // ------------------------------------------------------------------ public static void main(String[] args) { TaskListField theApp = new TaskListField(); theApp.enterEventDispatcher(); } public TaskListField() { pushScreen(new TaskList()); } } class TaskList extends MainScreen implements ListFieldCallback { private Vector rows; private Bitmap p1; private Bitmap p2; private Bitmap p3; String Task; ListField listnew = new ListField(); private VerticalFieldManager metadataVFM; TableRowManager row; public TaskList() { super(); URLBitmapField artistImgField; listnew.setRowHeight(80); listnew.setCallback(this); rows = new Vector(); for (int x = 0; x <3; x++) { row = new TableRowManager(); artistImgField = new URLBitmapField(Bitmap .getBitmapResource("res/images/bg.jpg")); row.add(artistImgField); String photoURL = "someimagefrmurl.jpg"; Log.info(photoURL); // strip white spaces in the url, which is causing the // images to not display properly for (int i = 0; i < photoURL.length(); i++) { if (photoURL.charAt(i) == ' ') { photoURL = photoURL.substring(0, i) + "%20" + photoURL.substring(i + 1, photoURL.length()); } } Log.info("Processed URL: " + photoURL); artistImgField.setURL(photoURL); LabelField task = new LabelField("Display"); row.add(task); LabelField task1 = new LabelField( "Now Playing" + String.valueOf(x)); Font myFont = Font.getDefault().derive(Font.PLAIN, 12); task1.setFont(myFont); row.add(task1); rows.addElement(row); } listnew.setSize(rows.size()); this.add(listnew); //listnew.invalidate(); } // ListFieldCallback Implementation public void drawListRow(ListField listField, Graphics g, int index, int y, int width) { TableRowManager rowManager = (TableRowManager) rows.elementAt(index); rowManager.drawRow(g, 0, y, width, listnew.getRowHeight()); } protected void drawFocus(Graphics graphics, boolean on) { } private class TableRowManager extends Manager { public TableRowManager() { super(0); } // Causes the fields within this row manager to be layed out then // painted. public void drawRow(Graphics g, int x, int y, int width, int height) { // Arrange the cell fields within this row manager. layout(width, height); // Place this row manager within its enclosing list. setPosition(x, y); // Apply a translating/clipping transformation to the graphics // context so that this row paints in the right area. g.pushRegion(getExtent()); // Paint this manager's controlled fields. subpaint(g); g.setColor(0x00CACACA); g.drawLine(0, 0, getPreferredWidth(), 0); // Restore the graphics context. g.popContext(); } // Arrages this manager's controlled fields from left to right within // the enclosing table's columns. protected void sublayout(int width, int height) { // set the size and position of each field. int fontHeight = Font.getDefault().getHeight(); int preferredWidth = getPreferredWidth(); // start with the Bitmap Field of the priority icon Field field = getField(0); layoutChild(field, 146,80); setPositionChild(field, 0, 0); // set the task name label field field = getField(1); layoutChild(field, preferredWidth - 16, fontHeight + 1); setPositionChild(field, 149, 3); // set the list name label field field = getField(2); layoutChild(field, 150, fontHeight + 1); setPositionChild(field, 149, fontHeight + 6); setExtent(360, 480); } // The preferred width of a row is defined by the list renderer. public int getPreferredWidth() { return listnew.getWidth(); } // The preferred height of a row is the "row height" as defined in the // enclosing list. public int getPreferredHeight() { return listnew.getRowHeight(); } } public Object get(ListField listField, int index) { // TODO Auto-generated method stub return null; } public int getPreferredWidth(ListField listField) { return 0; } public int indexOfList(ListField listField, String prefix, int start) { // TODO Auto-generated method stub return 0; } }

    Read the article

  • Setting an XAML Window always on top (but no TopMost property)

    - by Brian Scherady
    I am developing an application based on OptiTrack SDK (from NaturalPoint). I need to run the application window as "Always on Top". The window is designed in XAML and is controled in the class "CameraView" but it does not seem to include a "TopMost" property or equivalent. Attached are the code of "CameraView.xaml.cs" and the code of "CameraView.xaml" that are part of OptiTrack SDK (NaturalPoint) called "Single_Camera_CSharp_.NET_3.0". One could expect the class CameraView to contain properties or members to set the position of the window on the screen or to set it to TopMost but as far as searched I found nothing. I wonder what I should do. Thank you, Brian ================ "CameraView.xaml.cs" using System; using System.IO; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Navigation; using System.Drawing.Imaging; using System.Drawing.Drawing2D; using System.Windows.Threading; namespace TestProject { public partial class CameraView { private const int NP_OPTION_OBJECT_COLOR_OPTION = 3; private const int NP_OPTION_VIDEO_TYPE = 48; private const int NP_OPTION_NUMERIC_DISPLAY_ON = 71; private const int NP_OPTION_NUMERIC_DISPLAY_OFF = 72; private const int NP_OPTION_FETCH_RLE = 73; private const int NP_OPTION_FETCH_GRAYSCALE = 74; private const int NP_OPTION_FRAME_DECIMATION = 52; private const int NP_OPTION_INTENSITY = 50; private const int NP_OPTION_SEND_EMPTY_FRAMES = 41; private const int NP_OPTION_THRESHOLD = 5; private const int NP_OPTION_EXPOSURE = 46; private const int NP_OPTION_SEND_FRAME_MASK = 73; private const int NP_OPTION_TEXT_OVERLAY_OPTION = 74; // public delegate void OnCameraViewCreate(CameraView camera); // public static OnCameraViewCreate onCameraViewCreate; private System.Drawing.Bitmap raw = new System.Drawing.Bitmap(353, 288, System.Drawing.Imaging.PixelFormat.Format32bppArgb); private int mFrameCounter; private int mDisplayCounter; private DispatcherTimer timer1 = new DispatcherTimer(); private bool mVideoFrameAvailable = false; private int mNumeric = -1; private bool mGreyscale = false; private bool mOverlay = true; public CameraView() { this.InitializeComponent(); timer1.Interval = new TimeSpan(0, 0, 0, 0, 10); timer1.Tick += new EventHandler(timer1_Tick); } public int Numeric { get { return mNumeric; } set { mNumeric = value % 100; if (mNumeric = 0) { if (Camera != null) Camera.SetOption(NP_OPTION_NUMERIC_DISPLAY_ON, value % 100); } } } private bool CameraRunning = false; private OptiTrack.NPCamera mCamera; public OptiTrack.NPCamera Camera { get { return mCamera; } set { if (mCamera == value) return; //== Don't do anything if you're assigning the same camera == if (mCamera != null) { //== Shut the selected camera down ==<< if (CameraRunning) { CameraRunning = false; mCamera.Stop(); mCamera.FrameAvailable -= FrameAvailable; } } mCamera = value; if (mCamera == null) { mNumeric = -1; } else { serialLabel.Content = "Camera "+mCamera.SerialNumber.ToString(); //mNumeric.ToString(); } } } private void FrameAvailable(OptiTrack.NPCamera Camera) { mFrameCounter++; try { OptiTrack.NPCameraFrame frame = Camera.GetFrame(0); int id = frame.Id; if (CameraRunning) { GetFrameData(Camera, frame); } frame.Free(); } catch (Exception) { int r = 0; r++; } } private void GetFrameData(OptiTrack.NPCamera camera, OptiTrack.NPCameraFrame frame) { BitmapData bmData = raw.LockBits(new System.Drawing.Rectangle(0, 0, raw.Width, raw.Height), ImageLockMode.ReadWrite, System.Drawing.Imaging.PixelFormat.Format32bppArgb); int stride = bmData.Stride; System.IntPtr bufferPtr = bmData.Scan0; unsafe { byte* buffer = (byte*)(void*)bufferPtr; camera.GetFrameImage(frame, bmData.Width, bmData.Height, bmData.Stride, 32, ref buffer[0]); } raw.UnlockBits(bmData); mVideoFrameAvailable = true; } private void timer1_Tick(object sender, EventArgs e) { if (CameraRunning && mVideoFrameAvailable) { mVideoFrameAvailable = false; cameraImage.Source = Img(raw); mDisplayCounter++; } } private System.Windows.Media.ImageSource Img(System.Drawing.Bitmap img) { System.Drawing.Imaging.BitmapData bmData = img.LockBits(new System.Drawing.Rectangle(0, 0, img.Width, img.Height), System.Drawing.Imaging.ImageLockMode.ReadWrite, System.Drawing.Imaging.PixelFormat.Format32bppPArgb); System.Windows.Media.Imaging.BitmapSource bitmap = System.Windows.Media.Imaging.BitmapSource.Create( img.Width, img.Height, 96, 96, PixelFormats.Bgra32, System.Windows.Media.Imaging.BitmapPalettes.WebPalette, bmData.Scan0, bmData.Stride * bmData.Height, bmData.Stride); img.UnlockBits(bmData); return bitmap; } private void startStopButton_Click(object sender, RoutedEventArgs e) { if (CameraRunning) StopCamera(); else StartCamera(); } public void StartCamera() { if (Camera != null) { mFrameCounter = 0; mDisplayCounter = 0; Camera.FrameAvailable += FrameAvailable; Camera.SetOption(NP_OPTION_VIDEO_TYPE, 0); Camera.SetOption(NP_OPTION_FRAME_DECIMATION, 1); Camera.SetOption(NP_OPTION_INTENSITY, 0); Camera.SetOption(NP_OPTION_EXPOSURE, 10); Camera.SetOption(NP_OPTION_THRESHOLD, 50); Camera.SetOption(NP_OPTION_OBJECT_COLOR_OPTION, 0); SetOverlayOption(); SetGreyscaleOption(); timer1.Start(); Camera.Start(); CameraRunning = true; this.Numeric = mNumeric; startStopButton.Content = "Stop Camera"; } } private void SetGreyscaleOption() { if(mGreyscale) Camera.SetOption(NP_OPTION_VIDEO_TYPE, 1); else Camera.SetOption(NP_OPTION_VIDEO_TYPE, 0); } private void SetOverlayOption() { if(mOverlay) Camera.SetOption(NP_OPTION_TEXT_OVERLAY_OPTION, 255); else Camera.SetOption(NP_OPTION_TEXT_OVERLAY_OPTION, 0); } public void StopCamera() { if (Camera != null) { Camera.Stop(); timer1.Stop(); CameraRunning = false; Camera.FrameAvailable -= FrameAvailable; Camera.SetOption(NP_OPTION_NUMERIC_DISPLAY_OFF, 0); startStopButton.Content = "Start Camera"; } } private void greyscaleButton_Click(object sender, RoutedEventArgs e) { if(mGreyscale) mGreyscale = false; else mGreyscale = true; SetGreyscaleOption(); } private void OverlayButton_Click(object sender, RoutedEventArgs e) { if(mOverlay) mOverlay = false; else mOverlay = true; SetOverlayOption(); } private void exposureSlider_ValueChanged(object sender, RoutedEventArgs e) { if (mCamera!=null) { mCamera.SetOption(NP_OPTION_EXPOSURE, (int) this.exposureSlider.Value); } } private void thresholdSlider_ValueChanged(object sender, RoutedEventArgs e) { if (mCamera != null) { mCamera.SetOption(NP_OPTION_THRESHOLD, (int)this.thresholdSlider.Value); } } private void optionsButton_Click(object sender, RoutedEventArgs e) { if (!propertyPanel.IsVisible) propertyPanel.Visibility = Visibility.Visible; else propertyPanel.Visibility = Visibility.Collapsed; } } } ================ "CameraView.xaml"

    Read the article

  • Php and Jquery Validation: with Jquery Form Plugin

    - by Jacinto
    Hi, This is the first time I have attempted to make a form using jquery and php. I used the folks over at Mid Mo Design as an example but even with that tutorial am still having trouble getting it to do what I want. This is the code I have been using. As well as jquery 1.4.1 and jQuery Form Plugin 2.43. Any help would be greatly appreciated. css scrollContact { border-top: double 1px #0D0D0D; padding: 100px 50px 50px 50px; background: #020303; position: relative; overflow: hidden; width: 924px; text-align: justify; } .contactInfo { float:left; width: 214px; margin-right: 10px; margin-top: 5px; } contactForm { float: left; width: 700px; } contactForm span { float: left; margin:5px; width: 455px; } input, textarea { -moz-border-radius:5px 5px 5px 5px; border:1px solid #001932; color:#BBBBBB; font:1.1em Verdana,Geneva,sans-serif; background: #0A0A0A; } input:hover, textarea:hover { border:1px solid #0278f2; background: #242424; } contactForm span input { line-height:1.8em; width:430px; padding:11px 10px; margin: 0px 0px 10px 0px; } contactForm input { line-height:1.8em; width:200px; padding:11px 10px; margin: 5px; } contactForm textarea { height:190px; line-height:1.8em; width:430px; padding:10px; } .message { background:#eee; color:#000; display:none; padding:10px; height: 70px; position: absolute; bottom:0px; } Html Contact Navigate To: Work services about contact Get A Free Quote Thank you for your interest in contacting me. Please use the form to the right to contact me via email. I will respond to your inquiry as soon as possible. Please note all fields are required. What Next? Thank you for your interest in contacting me. Please use the form to the right to contact me via email. I will respond to your inquiry as soon as possible. Please note all fields are required. Your Message Php <?php $sendto = '[email protected]'; $subject = 'Contact from contact form'; $errormessage = 'Oops! There seems to have been a problem. May we suggest...'; $thanks = "Thanks for the email! We'll get back to you as soon as possible!"; $honeypot = "You filled in the honeypot! If you're human, try again!"; $emptyname = 'Entering your name?'; $emptyemail = 'Entering your email address?'; $emptytitle = 'Entering The Subject?'; $emptymessage = 'Entering a message?'; $alertname = 'Entering your name using only the standard alphabet?'; $alertemail = 'Entering your email in this format: [email protected]?'; $alerttitle = 'Entering the subject using only the standard alphabet?'; $alertmessage = "Making sure you aren't using any parenthesis or other escaping characters in the message? Most URLS are fine though!"; $alert = ''; $pass = 0; function clean_var($variable) { $variable = strip_tags(stripslashes(trim(rtrim($variable)))); return $variable; } if ( empty($_REQUEST['last']) ) { if ( empty($_REQUEST['contactName']) ) { $pass = 1; $alert .= "" . $emptyname . ""; } elseif ( ereg( "[][{}()*+?.\^$|]", $_REQUEST['contactName'] ) ) { $pass = 1; $alert .= "" . $alertname . ""; } if ( empty($_REQUEST['contactEmail']) ) { $pass = 1; $alert .= "" . $emptyemail . ""; } elseif ( !eregi("^[_a-z0-9-]+(.[_a-z0-9-]+)@[a-z0-9-]+(.[a-z0-9-]+)(.[a-z]{2,3})$", $_REQUEST['contactEmail']) ) { $pass = 1; $alert .= "" . $alertemail . ""; } if ( empty($_REQUEST['contactTitle']) ) { $pass = 1; $alert .= "" . $emptytitle . ""; } elseif ( ereg( "[][{}()*+?.\^$|]", $_REQUEST['contactTitle'] ) ) { $pass = 1; $alert .= "" . $alerttitle . ""; } if ( empty($_REQUEST['contactMessage']) ) { $pass = 1; $alert .= "" . $emptymessage . ""; } elseif ( ereg( "[][{}()*+?\^$|]", $_REQUEST['contactMessage'] ) ) { $pass = 1; $alert .= "" . $alertmessage . ""; } if ( $pass==1 ) { echo "$(\".message\").hide(\"slow\").show(\"slow\"); "; echo "" . $errormessage . ""; echo ""; echo $alert; echo ""; } elseif (isset($_REQUEST['message'])) { $message = "From: " . clean_var($_REQUEST['contactName']) . "\n"; $message .= "Email: " . clean_var($_REQUEST['contactEmail']) . "\n"; $message .= "Telephone: " . clean_var($_REQUEST['contactTitle']) . "\n"; $message .= "Message: \n" . clean_var($_REQUEST['contactMessage']); $header = 'From:'. clean_var($_REQUEST['contactEmail']); mail($sendto, $subject, $message, $header); echo "$(\".message\").hide(\"slow\").show(\"slow\").animate({opacity: 1.0}, 4000).hide(\"slow\"); $(':input').clearForm() "; echo $thanks; die(); } } else { echo "$(\".message\").hide(\"slow\").show(\"slow\"); "; echo $honeypot; } ?

    Read the article

  • problems with the email body, appearing special characters in emails

    - by tibin mathew
    Hi, I have some issues with my email -body when i send mails I'm using php in my site. My website is a spanish site , when ever i send a mail some special characters are comming in that mail. Always there is an ! mark in that mail, that too in the same place below is the code which i'm using and an email which i got. Code $domain=”http://international.com/”; $subject = "Iinternational :Solicitud de cotización "; $subject = mb_convert_encoding($subject, "UTF-8","AUTO"); $subject = mb_encode_mimeheader($subject); $mail_body ="<table width='719' border='0' align='center'>"; $mail_body .="<tr><td><a href='".$domain."' target='blank' ><img src='".$domain."images/international_s_01.jpg' border='0' width='719' style='border-color=#c8ceae' /></a></td></tr>"; $mail_body .="<tr><td style='padding-left:5px;'><font face='Verdana' size='1px;' color='#6699CC'>Estimado ".$frm_name.",</font></td></tr>"; $mail_body .="<tr><td height='30' align='center' style='padding-left:5px; font-family:Georgia, Times New Roman, Times, serif; color:#006699; font-weight:bold;font-size:20px;'><u>Solicitud de cotización de Información</u></td></tr>"; $mail_body .="<tr><td align='center'><table border='1' width='690' cellpadding='0' cellspacing='0' bordercolor='#800040'><tr><td><table border='0' width='690' cellpadding='0' cellspacing='0'>"; $mail_body .="<tr height='30'><td align='center' valign='middle' style='font-family:Verdana, Arial, Helvetica, sans-serif; color:#6699CC; font-weight:bold; font-size:15px;' width='230'>Nombre del producto</td><td align='center' valign='middle' style='font-family:Verdana, Arial, Helvetica, sans-serif; color:#6699CC; font-weight:bold; font-size:15px;' width='230'>Nombre de la subcategoría</td><td align='center' valign='middle' style='font-family:Verdana, Arial, Helvetica, sans-serif; color:#6699CC; font-weight:bold; font-size:15px;' width='230'>Nombre de la categoría</td></tr>"; $mail_body .="<tr><td align='left' style='font-family:Verdana, Arial, Helvetica, sans-serif;color:#666666;font-weight:normal;font-size:12px;padding-left:5px;' >".$product_name."</td><td style='font-family:Verdana, Arial, Helvetica, sans-serif;color:#666666;font-weight:normal;font-size:12px;padding-left:5px;' >".$sub_category_name."</td><td style='font-family:Verdana, Arial, Helvetica, sans-serif;color:#666666;font-weight:normal;font-size:12px;padding-left:5px;' >".$category_name."</td></tr>"; $mail_body .="</table></td></tr></table></td></tr>"; $mail_body .="<tr><td height='30' style='font-family:Verdana, Arial, Helvetica, sans-serif;color:#666666;font-weight:normal;font-size:12px;' >Gracias<br>Por visitar nuestro sitio y enviarnos su solicitud. Su información de contacto es segura y no será compartida con nadie.<br>Nos pondremos en contacto con usted dentro de 24 horas.</td></tr><tr><td height='20' style='font-family:Verdana, Arial, Helvetica, sans-serif;color:#6699CC;font-weight:bold;font-size:15px;padding-left:5px;' ><FONT face=tahoma color=#000000 size=2><a href='".$domain."'>www. international.com</a></font></td></tr>"; $mail_body .="<tr><td height='3'></td></tr></table>"; //$headers = "From: ".$mail_from."\n"; $mail_body = mb_convert_encoding($mail_body, "UTF-8","AUTO"); mb_language("es"); $headers .= "X-Mailer: PHP/" . phpversion()."\n"; // mailer $headers .= "From: " ."".mb_encode_mimeheader (mb_convert_encoding($mail_from,"UTF-8","AUTO")) ."" ."<".$mail_from."> \n"; $headers .= "Content-Type: text/html; charset=UTF-8";// Mime type////charset=UNICODE-1-1-UTF-8 //$headers .= "Reply-To: ". $email."\n"; // Return path for errors //$headers .= "Content-Transfer-Encoding: 16bit\n"; $success=mail($mail_to, $subject, $mail_body, $headers); $sucess_flag_user = 1;//sent the mail and set the sucess falg to 1 4 the time beigng mail func not called header("Location:./thank-you-quote.php?sucess_flag_admin=".encrypt($sucess_flag_admin )); Email which i received Estimado Thomas, Solicitud de cotización de Información Nombre del producto Nombre de la subcategoría Nombre de la categoría HPDFO - Lente Alta Definición Accesorios VersaLaser® Grac! ias Por visitar nuestro sitio y enviarnos s! u solici tud. Su información de contacto es segura y no será compartida con nadie. Nos pondremos en contacto con usted dentro de 24 horas. www.International.com This is a spanish mail here there are some ! coming inside that mail. I dont now why its comming. Please help me to fix this issue. Thanks in advance

    Read the article

  • Help modify a javascript code to perform a div scroll

    - by Jamex
    Hi, The code below uses javascript to smoothly scroll content in a div. I don't need the smooth scrolling action, and only need the onclick action for the buttons. I would like to use this code so that if a scroll up/down button is pressed, the scroll would instantaneously jump up/down to a position, just like if you were to press the reset button (see demo link). If the down button is pressed, it would jump down the position of the content div (say 300px) and show the text instantaneously without showing how the scrolling text. I am not familiar with JS, so it you know a shorter way, please suggest. TIA the demo link is HERE The code is > this.easyscroll = function(){ // id of the container element var > id = "myContent"; // navigation > buttons text var nav = ["Scroll Up", > "Scroll Down", "Reset"]; // id for > each navigation button (OPTIONAL) var > navId = ["btnUp", "btnDown", > "btnReset"]; > > // movement speed var speed = 5; > // desired height of the container > element (in pixels) var height = 200; > // // END CONFIG // do not edit > below this line (unless you want to of > course :) ) // > > var obj = > document.getElementById(id); obj.up > = false; obj.down = false; obj.fast = false; > > var container = > document.createElement("div"); var > parent = obj.parentNode; > container.id="easyscroll"; > parent.insertBefore(container,obj); > parent.removeChild(obj); > container.style.position = > "relative"; container.style.height = > height + "px"; > container.style.overflow = "hidden"; > obj.style.position = "absolute"; > obj.style.top = "0"; obj.style.left > = "0"; container.appendChild(obj); var btns = new Array(); var ul = > document.createElement("ul"); > ul.id="easyscrollnav"; for (var > i=0;i<nav.length;i++){ var li = > document.createElement("li"); > li.innerHTML = nav[i]; li.id = > navId[i]; btns.push(li); > ul.appendChild(li); }; > parent.insertBefore(ul,container); > btns[0].onmouseover = function(){ > obj.up = true; this.className = > "over"; }; btns[0].onmouseout = > function(){ obj.up = false; > this.className = ""; }; > btns[1].onmouseover = function(){ > obj.down = true; this.className = > "over"; }; btns[1].onmouseout = > function(){ obj.down = false; > this.className = ""; }; > btns[0].onmousedown = > btns[1].onmousedown = function(){ > obj.fast = true; }; > btns[0].onmouseup = btns[1].onmouseup > = function(){ obj.fast = false; }; btns[2].onmouseover = > function(){ this.className = > "over"; }; btns[2].onmouseout = > function(){ this.className = ""; > }; btns[2].onclick = function(){ > obj.style.top = "0px"; }; > this.start = function(){ var newTop; var objHeight = > obj.offsetHeight; var top = > obj.offsetTop; var fast = (obj.fast) > ? 2 : 1; if(obj.down){ newTop > = ((objHeight+top) > height) ? top-(speed*fast) : top; > obj.style.top = newTop + "px"; > }; if(obj.up){ newTop = > (top < 0) ? top+(speed*fast) : top; > obj.style.top = newTop + "px"; }; > }; obj.interval = > setInterval("start()",50); }; > > > this.addEvent = function(obj,type,fn){ > if(obj.attachEvent){ > obj['e'+type+fn] = fn; > obj[type+fn] = > function(){obj['e'+type+fn](window.event > );} obj.attachEvent('on'+type, > obj[type+fn]); } else { > obj.addEventListener(type,fn,false); > }; }; > addEvent(window,"load",easyscroll);

    Read the article

  • getting Null pointer exception

    - by Abhijeet
    Hi I am getting this message on emulator when I run my android project: The application MediaPlayerDemo_Video.java (process com.android.MediaPlayerDemo_Video) has stopped unexpectedly. Please try again I am trying to run the MediaPlayerDemo_Video.java given in ApiDemos in the Samples given on developer.android.com. The code is : package com.android.MediaPlayerDemo_Video; import android.app.Activity; import android.media.AudioManager; import android.media.MediaPlayer; import android.media.MediaPlayer.OnBufferingUpdateListener; import android.media.MediaPlayer.OnCompletionListener; import android.media.MediaPlayer.OnPreparedListener; import android.media.MediaPlayer.OnVideoSizeChangedListener; import android.os.Bundle; import android.util.Log; import android.view.SurfaceHolder; import android.view.SurfaceView; import android.widget.Toast; public class MediaPlayerDemo_Video extends Activity implements OnBufferingUpdateListener, OnCompletionListener, OnPreparedListener, OnVideoSizeChangedListener, SurfaceHolder.Callback { private static final String TAG = "MediaPlayerDemo"; private int mVideoWidth; private int mVideoHeight; private MediaPlayer mMediaPlayer; private SurfaceView mPreview; private SurfaceHolder holder; private String path; private Bundle extras; private static final String MEDIA = "media"; // private static final int LOCAL_AUDIO = 1; // private static final int STREAM_AUDIO = 2; // private static final int RESOURCES_AUDIO = 3; private static final int LOCAL_VIDEO = 4; private static final int STREAM_VIDEO = 5; private boolean mIsVideoSizeKnown = false; private boolean mIsVideoReadyToBePlayed = false; /** * * Called when the activity is first created. */ @Override public void onCreate(Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.mediaplayer_2); mPreview = (SurfaceView) findViewById(R.id.surface); holder = mPreview.getHolder(); holder.addCallback(this); holder.setType(SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS); extras = getIntent().getExtras(); } private void playVideo(Integer Media) { doCleanUp(); try { switch (Media) { case LOCAL_VIDEO: // Set the path variable to a local media file path. path = ""; if (path == "") { // Tell the user to provide a media file URL. Toast .makeText( MediaPlayerDemo_Video.this, "Please edit MediaPlayerDemo_Video Activity, " + "and set the path variable to your media file path." + " Your media file must be stored on sdcard.", Toast.LENGTH_LONG).show(); } break; case STREAM_VIDEO: /* * Set path variable to progressive streamable mp4 or * 3gpp format URL. Http protocol should be used. * Mediaplayer can only play "progressive streamable * contents" which basically means: 1. the movie atom has to * precede all the media data atoms. 2. The clip has to be * reasonably interleaved. * */ path = ""; if (path == "") { // Tell the user to provide a media file URL. Toast .makeText( MediaPlayerDemo_Video.this, "Please edit MediaPlayerDemo_Video Activity," + " and set the path variable to your media file URL.", Toast.LENGTH_LONG).show(); } break; } // Create a new media player and set the listeners mMediaPlayer = new MediaPlayer(); mMediaPlayer.setDataSource(path); mMediaPlayer.setDisplay(holder); mMediaPlayer.prepare(); mMediaPlayer.setOnBufferingUpdateListener(this); mMediaPlayer.setOnCompletionListener(this); mMediaPlayer.setOnPreparedListener(this); mMediaPlayer.setOnVideoSizeChangedListener(this); mMediaPlayer.setAudioStreamType(AudioManager.STREAM_MUSIC); } catch (Exception e) { Log.e(TAG, "error: " + e.getMessage(), e); } } public void onBufferingUpdate(MediaPlayer arg0, int percent) { Log.d(TAG, "onBufferingUpdate percent:" + percent); } public void onCompletion(MediaPlayer arg0) { Log.d(TAG, "onCompletion called"); } public void onVideoSizeChanged(MediaPlayer mp, int width, int height) { Log.v(TAG, "onVideoSizeChanged called"); if (width == 0 || height == 0) { Log.e(TAG, "invalid video width(" + width + ") or height(" + height + ")"); return; } mIsVideoSizeKnown = true; mVideoWidth = width; mVideoHeight = height; if (mIsVideoReadyToBePlayed && mIsVideoSizeKnown) { startVideoPlayback(); } } public void onPrepared(MediaPlayer mediaplayer) { Log.d(TAG, "onPrepared called"); mIsVideoReadyToBePlayed = true; if (mIsVideoReadyToBePlayed && mIsVideoSizeKnown) { startVideoPlayback(); } } public void surfaceChanged(SurfaceHolder surfaceholder, int i, int j, int k) { Log.d(TAG, "surfaceChanged called"); } public void surfaceDestroyed(SurfaceHolder surfaceholder) { Log.d(TAG, "surfaceDestroyed called"); } public void surfaceCreated(SurfaceHolder holder) { Log.d(TAG, "surfaceCreated called"); playVideo(extras.getInt(MEDIA)); } @Override protected void onPause() { super.onPause(); releaseMediaPlayer(); doCleanUp(); } @Override protected void onDestroy() { super.onDestroy(); releaseMediaPlayer(); doCleanUp(); } private void releaseMediaPlayer() { if (mMediaPlayer != null) { mMediaPlayer.release(); mMediaPlayer = null; } } private void doCleanUp() { mVideoWidth = 0; mVideoHeight = 0; mIsVideoReadyToBePlayed = false; mIsVideoSizeKnown = false; } private void startVideoPlayback() { Log.v(TAG, "startVideoPlayback"); holder.setFixedSize(mVideoWidth, mVideoHeight); mMediaPlayer.start(); } } I think the above message is due to Null pointer exception , however I may be false. I am unable to find where the error is . So , Please someone help me out .

    Read the article

  • Where should I put zoomIn in my MapActivity?

    - by Johny
    I'm writing an Android app, and I'd like to zoomIn as soon as the map has been loaded. I get the following error: java.lang.IllegalArgumentException: width and height must be > 0 This MapActivity - width and height must be > 0 question suggests the problem is the zoomIn() method is in the onCreate() method. But I get same error when I put it in the onResume() method. I've been searching for hours and I can't find anything about it at http://developer.android.com or anywhere else... Also I can't find a way to get the time point the map has been loaded. A "MapLoadedListener" or something like that... EDIT Here is my code: public class AMap extends MapActivity{ private final String LOG_TAG = this.getClass().getSimpleName(); private Context mContext; private Chronometer timer; private TextView tvCountdown; private RelativeLayout rl; private MapView mapView; private MapController mapController; private List<Overlay> mapOverlays; private PlayersOverlay playersOverlay; private Drawable drawable; private Builder endDialog; private ContextThemeWrapper ctw; private Handler mHandler = new Handler(); private Player player = new Player(); private StartTask startTask; private EndTask endTask; private MyDBAdapter mdba; private Cursor playersCursor; private UpdateBroadcastReceiver r; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.map_view); mContext = AMap.this; // set map mapView = (MapView) findViewById(R.id.mapview); mapView.setBuiltInZoomControls(true); mapView.setFocusable(true); // find the relative layout rl = (RelativeLayout) findViewById(R.id.rl); // set the chronometer timer = (Chronometer) findViewById(R.id.tv_timer); timer.setBackgroundColor(Color.DKGRAY); // set the countdown textview tvCountdown = (TextView) findViewById(R.id.tv_countdown); // Open DB connection and get players Cursor mdba = new MyDBAdapter(mContext); mdba.open(); playersCursor = mdba.getGame(); // Get this player's id and location Intent starter = this.getIntent(); player.setId(starter.getIntExtra("id", 0)); player.setLatitude(starter.getDoubleExtra("lat", 0)); player.setLongitude(starter.getDoubleExtra("lon", 0)); // Set this player's location as map's center GeoPoint geoPoint = new GeoPoint((int) (player.getLatitude()*1E6), (int) (player.getLongitude()*1E6)); mapController = mapView.getController(); mapController.setCenter(geoPoint); mapController.setZoom(15); Log.d(LOG_TAG, "My playersCursor has "+playersCursor.getCount()+" rows"); // drawable is needed but not used drawable = this.getResources().getDrawable(R.drawable.ic_launcher); // set PlayersOverlay (locations and statuses) playersOverlay = new PlayersOverlay(player.getId(), playersCursor, drawable, this); mapOverlays = mapView.getOverlays(); mapOverlays.add(playersOverlay); mHandler.postDelayed(mUpdateTimeTask, 100); } private Runnable mUpdateTimeTask = new Runnable() { public void run() { int h = mapView.getLayoutParams().height; int w = mapView.getLayoutParams().width; Log.d(LOG_TAG, "w = "+w+" , h = "+h); mHandler.postAtTime(this, System.currentTimeMillis() + 1000); } }; @Override public void onAttachedToWindow(){ Log.d(LOG_TAG, "Attached to Window"); int h = mapView.getLayoutParams().height; int w = mapView.getLayoutParams().width; Log.d(LOG_TAG, " Attached to window: w = "+w+" , h = "+h); //mapController.zoomInFixing(screenPoint.x, screenPoint.y); } public void onWindowFocusChanged(boolean hasFocus){ Log.d(LOG_TAG, "Focus changed to: "+hasFocus); int h = mapView.getLayoutParams().height; int w = mapView.getLayoutParams().width; Log.d(LOG_TAG, " Window focus changed: w = "+w+" , h = "+h); //mapController.zoomInFixing(screenPoint.x, screenPoint.y); } @Override protected void onStart(){ super.onStart(); // Create and register the broadcast receiver for messages from service IntentFilter filter = new IntentFilter(AppConstants.iGAME_UPDATE); r = new UpdateBroadcastReceiver(); registerReceiver(r, filter); // Create the dialog for end of game ctw = new ContextThemeWrapper(mContext, android.R.style.Theme_Translucent_NoTitleBar_Fullscreen); endDialog = new AlertDialog.Builder(ctw); endDialog.setMessage("End of Game"); endDialog.setCancelable(false); endDialog.setNeutralButton("OK", new OnClickListener(){ @Override public void onClick(DialogInterface dialog, int which) { Intent highScores = new Intent(AMap.this, HighScores.class); startActivity(highScores); playersCursor.close(); finish(); } }); } @Override protected void onStop() { if(!playersCursor.isClosed()) playersCursor.close(); unregisterReceiver(r); mdba.close(); super.onStop(); } @Override protected boolean isRouteDisplayed() { return false; } // Receives signal from NetworkService that DB has been updated public class UpdateBroadcastReceiver extends BroadcastReceiver { boolean startSignal, update, endSignal; @Override public void onReceive(Context context, Intent intent) { endSignal = intent.getBooleanExtra("endSignal", false); if(endSignal){ Log.d(LOG_TAG, "Game Update BroadcastReceiver received End Signal"); endTask = new EndTask(); endTask.execute(); return; } update = intent.getBooleanExtra("update", false); if(update){ Log.d(LOG_TAG, "Game Update BroadcastReceiver received game update"); playersCursor.requery(); mapView.invalidate(); return; } startSignal = intent.getBooleanExtra("startSignal", false); if(startSignal){ Log.d(LOG_TAG, "Game Update BroadcastReceiver received Start Signal"); startTask = new StartTask(); startTask.execute(); return; } } } class StartTask extends AsyncTask<Void,Integer,Void>{ private final ToneGenerator tg = new ToneGenerator(AudioManager.STREAM_NOTIFICATION, 100); private final long DELAY = 1200; @Override protected Void doInBackground(Void... params) { int i = 3; while(i>=0){ publishProgress(i); try { Thread.sleep(DELAY); } catch (InterruptedException e) { e.printStackTrace(); } i--; } return null; } @Override protected void onProgressUpdate(Integer... progress){ tg.startTone(ToneGenerator.TONE_PROP_PROMPT); tvCountdown.setText(""+progress[0]); } @Override protected void onPostExecute(Void result) { rl.removeView(tvCountdown); timer.setBase(SystemClock.elapsedRealtime()); timer.start(); //enable screen touches playersOverlay.setGameStarted(true); } } class EndTask extends AsyncTask<Void,Void,Void>{ @Override protected void onPreExecute(){ //disable screen touches playersOverlay.setEndOfGame(true); timer.stop(); } @Override protected Void doInBackground(Void... params) { return null; } @Override protected void onPostExecute(Void result) { try{ endDialog.show(); }catch(Exception e){ Toast.makeText(mContext, "End of game", Toast.LENGTH_LONG); Intent highScores = new Intent(AMap.this, HighScores.class); startActivity(highScores); playersCursor.close(); finish(); } mHandler.removeCallbacks(mUpdateTimeTask); } } }

    Read the article

  • a value that shows in select mode disappears in edit mode from a gridview column

    - by Jbob Johan
    i have a gridview(GridView1) with a few Bound Fields first one is Date (ActivityDate) from a table named "tblTime" i have managed to add one extra colum (manually), that is not bound that shows dayInWeek value according to the "ActivityDate" field programtically in CodeBehind but when i enter into Edit Mode , all Bound fields are showing their values correctly but the one column i have added manually will not show the value as it did in "select mode"(first mode b4 trying to edit) while im not a great dibbagger i have manged to view the cell's value (GridView1.Rows[e.NewEditIndex].Cells[1].Text) which does hold on to the day in week value but it does not appear in gridview edit mode only this is some of the code protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.Header) { e.Row.Cells[0].Text = "?????"; //Activity Date (in hebrew) e.Row.Cells[1].Text = "??? ?????"; //DayinWeek e.Row.Cells[2].Text = "??????"; //ActivityType (work seek vacation) named Reason e.Row.Cells[3].Text = "??? ?????"; //time finish (to Work) e.Row.Cells[4].Text = "??? ?????"; //Time out (of work) } if (e.Row.RowType == DataControlRowType.DataRow) { if (Convert.ToBoolean(ViewState["theSubIsclckd"]) == true) //if submit button clicked { try { string twekday1 = Convert.ToString(DataBinder.Eval(e.Row.DataItem, "ActiveDate")); twekday1 = twekday1.Remove(9, 11); //geting date only without the time- portion string[] arymd = twekday1.Split('/'); // spliting [d m y] in order to make int day = Convert.ToInt32(arymd[1]); // it into [m d y] ...also requierd int month = Convert.ToInt32(arymd[0]); // when i update the table int year = Convert.ToInt32(arymd[2]); DateTime ILDateInit = new DateTime(year, month, day); //finally extracting Day CultureInfo ILci = CultureInfo.CreateSpecificCulture("he-IL"); // in week //from the converted activity date string MyIL_DayInWeek = ILDateInit.ToString("dddd", ILci); ViewState["MyIL_DayInWeek"] = MyIL_DayInWeek; e.Row.Cells[1].Text = MyIL_DayInWeek; string displayReason = DataBinder.Eval(e.Row.DataItem, "Reason").ToString(); e.Row.Cells[2].Text = displayReason; } catch (System.Exception excep) { Js.functions.but bb = new Js.functions.but(); bb.buttonName = "rex"; bb.documentwrite = true; bb.testCsVar = excep.ToString(); bb.f1(bb); // this was supposed to throw exep in javaScript injected from code behid - alert } // just in case.. } } so that works for the non edit period of time then when i hit the edit ... no day in week shows THE aspX - after selcting date... name etc' , click on button to display gridview: <asp:Button ID="TheSubB" runat="server" Text="???" onclick="TheSubB_Click" /> <asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound" onrowediting="GridView1_RowEditing" onrowcancelingedit="GridView1_RowCancelingEdit" OnRowUpdating="GridView1_RowUpdating" BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" CellPadding="2" ForeColor="Black" GridLines="None" AutoGenerateColumns="False" DataKeyNames="tId" DataSourceID="SqlDataSource1" style="z-index: 1; left: 0%; top: 0%; position: relative; width: 812px; height: 59px; font-family:Arial; text-align: center;" AllowSorting="True" > <AlternatingRowStyle BackColor="PaleGoldenrod" /> <Columns> <asp:BoundField DataField="ActiveDate" HeaderText="ActiveDate" SortExpression="ActiveDate" ControlStyle-Width="70" DataFormatString="{0:dd/MM/yyyy}" > <ControlStyle Width="70px" /> </asp:BoundField> <asp:TemplateField HeaderText="???.???.??"> <EditItemTemplate> <asp:TextBox ID="dayinW_EditTB" runat="server"></asp:TextBox> </EditItemTemplate> <ItemTemplate> <asp:Label ID="dayInW_editLabel" runat="server"></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:BoundField DataField="Reason" HeaderText="???? ?????" SortExpression="Reason" ControlStyle-Width="50"> <ControlStyle Width="50px" /> </asp:BoundField> <asp:BoundField DataField="TimeOut" HeaderText="TimeOut" SortExpression="TimeOut" ControlStyle-Width="50" DataFormatString="{0:HH:mm}" > <ControlStyle Width="50px"></ControlStyle> </asp:BoundField> <asp:BoundField DataField="TimeIn" HeaderText="TimeIn" SortExpression="TimeIn" ControlStyle-Width="50" DataFormatString="{0:HH:mm}" > <ControlStyle Width="50px"></ControlStyle> </asp:BoundField> <asp:TemplateField HeaderText="????" > <EditItemTemplate> <asp:ImageButton width="15" Height="15" ImageUrl="~/images/edit.png" runat="server" CausesValidation="True" CommandName="Update" Text="Update"> </asp:ImageButton> <asp:ImageButton Width="15" Height="15" ImageUrl="images/cancel.png" runat="server" CausesValidation="False" CommandName="Cancel" Text="Cancel"> </asp:ImageButton> </EditItemTemplate> <ItemTemplate> <asp:ImageButton width="25" Height="15" ImageUrl="images/edit.png" ID="EditIB" runat="server" CausesValidation="False" CommandName="Edit" AlternateText="????"></asp:ImageButton> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="???"> <ItemTemplate> <asp:ImageButton width="15" Height="15" ImageUrl="images/Delete.png" ID="DeleteIB" runat="server" CommandName="Delete" AlternateText="???" /> </ItemTemplate> </asp:TemplateField> </Columns> <FooterStyle BackColor="Tan" /> <HeaderStyle BackColor="Tan" Font-Bold="True" /> <PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" /> <SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" /> <SortedAscendingCellStyle BackColor="#FAFAE7" /> <SortedAscendingHeaderStyle BackColor="#DAC09E" /> <SortedDescendingCellStyle BackColor="#E1DB9C" /> <SortedDescendingHeaderStyle BackColor="#C2A47B" /> </asp:GridView>

    Read the article

  • Asp controls Id generation inside repeater

    - by toraan
    I define some controls inside repeater itemtemplate, the problem is with the Id that are generated automatically. This is my page: <asp:Repeater ID="rptThreads" runat="server" onitemcreated="rptThreads_ItemCreated"> <HeaderTemplate> <table cellpadding="0px" cellspacing="0"> </HeaderTemplate> <ItemTemplate> <tr style="height:50px"> <td> <asp:PlaceHolder ID="plcItemTitle" runat="server"> <asp:Panel id="titleContainer" runat="server" style="position:absolute;"> <asp:HyperLink ID="lnkTitle" runat="server" style="float:left;padding-right:10px;" Text='<%# Container.DataItem%>'/> <asp:Panel id="pnlEditButtons" runat="server" Visible="false" style="vertical-align:middle;z-index:100;display:none;float:left;" > <asp:ImageButton ID="imgbtn1" runat="server" ImageUrl="~/Images/misc/edit.png" /> <asp:ImageButton ID="imgbtn2" runat="server" ImageUrl="~/Images/misc/Rename.png" /> </asp:Panel> </asp:Panel> </asp:PlaceHolder> </td> </tr> </ItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> Now I will try to describe the problem: code-behind: protected void Page_Load(object sender, EventArgs e) { int [] array = {1,2,3,4,5}; rptThreads.DataSource = array; rptThreads.DataBind(); } protected void rptThreads_ItemCreated(object sender, RepeaterItemEventArgs e) { if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem) { Panel editButtonsPanel = e.Item.FindControl("pnlEditButtons") as Panel; editButtonsPanel.Visible = true; Panel containerPanel = e.Item.FindControl("titleContainer") as Panel; //Point of Interest!!!! containerPanel.Attributes.Add("onmouseover", "ShowEditButtons('" + editButtonsPanel.ClientID + "');"); } } If I run the page as is, the generated html will be the following (I show only the first 2 items): <table cellpadding="0px" cellspacing="0"> <tr style="height:50px"> <td> <div id="titleContainer" onmouseover="ShowEditButtons('pnlEditButtons');" style="position:absolute;"> <a id="lnkTitle" style="float:left;padding-right:10px;">1</a> <div id="pnlEditButtons" style="vertical-align:middle;z-index:100;display:none;float:left;"> <input type="image" name="imgbtn1" id="imgbtn1" src="Images/misc/edit.png" style="border-width:0px;" /> <input type="image" name="imgbtn2" id="imgbtn2" src="Images/misc/Rename.png" style="border-width:0px;" /> </div> </div> </td> </tr> <tr style="height:50px"> <td> <div id="titleContainer" onmouseover="ShowEditButtons('pnlEditButtons');" style="position:absolute;"> <a id="lnkTitle" style="float:left;padding-right:10px;">2</a> <div id="pnlEditButtons" style="vertical-align:middle;z-index:100;display:none;float:left;"> <input type="image" name="imgbtn1" id="imgbtn1" src="Images/misc/edit.png" style="border-width:0px;" /> <input type="image" name="imgbtn2" id="imgbtn2" src="Images/misc/Rename.png" style="border-width:0px;" /> </div> </div> </td> </tr> As you can see all divs get the SAME ID, THIS I DONT WANT!!! But If I omit this line form the ItemCreated event: containerPanel.Attributes.Add("onmouseover", "ShowEditButtons('" + editButtonsPanel.ClientID + "');"); The generated HTML will be the following: <table cellpadding="0px" cellspacing="0"> <tr style="height:50px"> <td> <div id="rptThreads_ctl01_titleContainer" style="position:absolute;"> <a id="rptThreads_ctl01_lnkTitle" style="float:left;padding-right:10px;">1</a> <div id="rptThreads_ctl01_pnlEditButtons" style="vertical-align:middle;z-index:100;display:none;float:left;"> <input type="image" name="rptThreads$ctl01$imgbtn1" id="rptThreads_ctl01_imgbtn1" src="Images/misc/edit.png" style="border-width:0px;" /> <input type="image" name="rptThreads$ctl01$imgbtn2" id="rptThreads_ctl01_imgbtn2" src="Images/misc/Rename.png" style="border-width:0px;" /> </div> </div> </td> </tr> <tr style="height:50px"> <td> <div id="rptThreads_ctl02_titleContainer" style="position:absolute;"> <a id="rptThreads_ctl02_lnkTitle" style="float:left;padding-right:10px;">2</a> <div id="rptThreads_ctl02_pnlEditButtons" style="vertical-align:middle;z-index:100;display:none;float:left;"> <input type="image" name="rptThreads$ctl02$imgbtn1" id="rptThreads_ctl02_imgbtn1" src="Images/misc/edit.png" style="border-width:0px;" /> <input type="image" name="rptThreads$ctl02$imgbtn2" id="rptThreads_ctl02_imgbtn2" src="Images/misc/Rename.png" style="border-width:0px;" /> </div> </div> </td> </tr> All divs get unique IDs, and this I do want My questions are: 1)why it happens? why this line of code messup the ids? 2)how can have the unique ID's and assign javascript in codebehind? I can add this on aspx (it will wotk and I will get unique ids): onmouseover='<%# "javascript:ShowEditButtons(\""+ Container.FindControl("pnlEditButtons").ClientID+ "\");" %>' But I must do it in codebehind because I need to set the javascript only if server validate some things.

    Read the article

  • fatal error C1014: too many include files : depth = 1024

    - by numerical25
    I have no idea what this means. But here is the code that it supposely is happening in. //======================================================================================= // d3dApp.cpp by Frank Luna (C) 2008 All Rights Reserved. //======================================================================================= #include "d3dApp.h" #include <stream> LRESULT CALLBACK MainWndProc(HWND hwnd, UINT msg, WPARAM wParam, LPARAM lParam) { static D3DApp* app = 0; switch( msg ) { case WM_CREATE: { // Get the 'this' pointer we passed to CreateWindow via the lpParam parameter. CREATESTRUCT* cs = (CREATESTRUCT*)lParam; app = (D3DApp*)cs->lpCreateParams; return 0; } } // Don't start processing messages until after WM_CREATE. if( app ) return app->msgProc(msg, wParam, lParam); else return DefWindowProc(hwnd, msg, wParam, lParam); } D3DApp::D3DApp(HINSTANCE hInstance) { mhAppInst = hInstance; mhMainWnd = 0; mAppPaused = false; mMinimized = false; mMaximized = false; mResizing = false; mFrameStats = L""; md3dDevice = 0; mSwapChain = 0; mDepthStencilBuffer = 0; mRenderTargetView = 0; mDepthStencilView = 0; mFont = 0; mMainWndCaption = L"D3D10 Application"; md3dDriverType = D3D10_DRIVER_TYPE_HARDWARE; mClearColor = D3DXCOLOR(0.0f, 0.0f, 1.0f, 1.0f); mClientWidth = 800; mClientHeight = 600; } D3DApp::~D3DApp() { ReleaseCOM(mRenderTargetView); ReleaseCOM(mDepthStencilView); ReleaseCOM(mSwapChain); ReleaseCOM(mDepthStencilBuffer); ReleaseCOM(md3dDevice); ReleaseCOM(mFont); } HINSTANCE D3DApp::getAppInst() { return mhAppInst; } HWND D3DApp::getMainWnd() { return mhMainWnd; } int D3DApp::run() { MSG msg = {0}; mTimer.reset(); while(msg.message != WM_QUIT) { // If there are Window messages then process them. if(PeekMessage( &msg, 0, 0, 0, PM_REMOVE )) { TranslateMessage( &msg ); DispatchMessage( &msg ); } // Otherwise, do animation/game stuff. else { mTimer.tick(); if( !mAppPaused ) updateScene(mTimer.getDeltaTime()); else Sleep(50); drawScene(); } } return (int)msg.wParam; } void D3DApp::initApp() { initMainWindow(); initDirect3D(); D3DX10_FONT_DESC fontDesc; fontDesc.Height = 24; fontDesc.Width = 0; fontDesc.Weight = 0; fontDesc.MipLevels = 1; fontDesc.Italic = false; fontDesc.CharSet = DEFAULT_CHARSET; fontDesc.OutputPrecision = OUT_DEFAULT_PRECIS; fontDesc.Quality = DEFAULT_QUALITY; fontDesc.PitchAndFamily = DEFAULT_PITCH | FF_DONTCARE; wcscpy(fontDesc.FaceName, L"Times New Roman"); D3DX10CreateFontIndirect(md3dDevice, &fontDesc, &mFont); } void D3DApp::onResize() { // Release the old views, as they hold references to the buffers we // will be destroying. Also release the old depth/stencil buffer. ReleaseCOM(mRenderTargetView); ReleaseCOM(mDepthStencilView); ReleaseCOM(mDepthStencilBuffer); // Resize the swap chain and recreate the render target view. HR(mSwapChain->ResizeBuffers(1, mClientWidth, mClientHeight, DXGI_FORMAT_R8G8B8A8_UNORM, 0)); ID3D10Texture2D* backBuffer; HR(mSwapChain->GetBuffer(0, __uuidof(ID3D10Texture2D), reinterpret_cast<void**>(&backBuffer))); HR(md3dDevice->CreateRenderTargetView(backBuffer, 0, &mRenderTargetView)); ReleaseCOM(backBuffer); // Create the depth/stencil buffer and view. D3D10_TEXTURE2D_DESC depthStencilDesc; depthStencilDesc.Width = mClientWidth; depthStencilDesc.Height = mClientHeight; depthStencilDesc.MipLevels = 1; depthStencilDesc.ArraySize = 1; depthStencilDesc.Format = DXGI_FORMAT_D24_UNORM_S8_UINT; depthStencilDesc.SampleDesc.Count = 1; // multisampling must match depthStencilDesc.SampleDesc.Quality = 0; // swap chain values. depthStencilDesc.Usage = D3D10_USAGE_DEFAULT; depthStencilDesc.BindFlags = D3D10_BIND_DEPTH_STENCIL; depthStencilDesc.CPUAccessFlags = 0; depthStencilDesc.MiscFlags = 0; HR(md3dDevice->CreateTexture2D(&depthStencilDesc, 0, &mDepthStencilBuffer)); HR(md3dDevice->CreateDepthStencilView(mDepthStencilBuffer, 0, &mDepthStencilView)); // Bind the render target view and depth/stencil view to the pipeline. md3dDevice->OMSetRenderTargets(1, &mRenderTargetView, mDepthStencilView); // Set the viewport transform. D3D10_VIEWPORT vp; vp.TopLeftX = 0; vp.TopLeftY = 0; vp.Width = mClientWidth; vp.Height = mClientHeight; vp.MinDepth = 0.0f; vp.MaxDepth = 1.0f; md3dDevice->RSSetViewports(1, &vp); } void D3DApp::updateScene(float dt) { // Code computes the average frames per second, and also the // average time it takes to render one frame. static int frameCnt = 0; static float t_base = 0.0f; frameCnt++; // Compute averages over one second period. if( (mTimer.getGameTime() - t_base) >= 1.0f ) { float fps = (float)frameCnt; // fps = frameCnt / 1 float mspf = 1000.0f / fps; std::wostringstream outs; outs.precision(6); outs << L"FPS: " << fps << L"\n" << "Milliseconds: Per Frame: " << mspf; mFrameStats = outs.str(); // Reset for next average. frameCnt = 0; t_base += 1.0f; } } void D3DApp::drawScene() { md3dDevice->ClearRenderTargetView(mRenderTargetView, mClearColor); md3dDevice->ClearDepthStencilView(mDepthStencilView, D3D10_CLEAR_DEPTH|D3D10_CLEAR_STENCIL, 1.0f, 0); } LRESULT D3DApp::msgProc(UINT msg, WPARAM wParam, LPARAM lParam) { switch( msg ) { // WM_ACTIVATE is sent when the window is activated or deactivated. // We pause the game when the window is deactivated and unpause it // when it becomes active. case WM_ACTIVATE: if( LOWORD(wParam) == WA_INACTIVE ) { mAppPaused = true; mTimer.stop(); } else { mAppPaused = false; mTimer.start(); } return 0; // WM_SIZE is sent when the user resizes the window. case WM_SIZE: // Save the new client area dimensions. mClientWidth = LOWORD(lParam); mClientHeight = HIWORD(lParam); if( md3dDevice ) { if( wParam == SIZE_MINIMIZED ) { mAppPaused = true; mMinimized = true; mMaximized = false; } else if( wParam == SIZE_MAXIMIZED ) { mAppPaused = false; mMinimized = false; mMaximized = true; onResize(); } else if( wParam == SIZE_RESTORED ) { // Restoring from minimized state? if( mMinimized ) { mAppPaused = false; mMinimized = false; onResize(); } // Restoring from maximized state? else if( mMaximized ) { mAppPaused = false; mMaximized = false; onResize(); } else if( mResizing ) { // If user is dragging the resize bars, we do not resize // the buffers here because as the user continuously // drags the resize bars, a stream of WM_SIZE messages are // sent to the window, and it would be pointless (and slow) // to resize for each WM_SIZE message received from dragging // the resize bars. So instead, we reset after the user is // done resizing the window and releases the resize bars, which // sends a WM_EXITSIZEMOVE message. } else // API call such as SetWindowPos or mSwapChain->SetFullscreenState. { onResize(); } } } return 0; // WM_EXITSIZEMOVE is sent when the user grabs the resize bars. case WM_ENTERSIZEMOVE: mAppPaused = true; mResizing = true; mTimer.stop(); return 0; // WM_EXITSIZEMOVE is sent when the user releases the resize bars. // Here we reset everything based on the new window dimensions. case WM_EXITSIZEMOVE: mAppPaused = false; mResizing = false; mTimer.start(); onResize(); return 0; // WM_DESTROY is sent when the window is being destroyed. case WM_DESTROY: PostQuitMessage(0); return 0; // The WM_MENUCHAR message is sent when a menu is active and the user presses // a key that does not correspond to any mnemonic or accelerator key. case WM_MENUCHAR: // Don't beep when we alt-enter. return MAKELRESULT(0, MNC_CLOSE); // Catch this message so to prevent the window from becoming too small. case WM_GETMINMAXINFO: ((MINMAXINFO*)lParam)->ptMinTrackSize.x = 200; ((MINMAXINFO*)lParam)->ptMinTrackSize.y = 200; return 0; } return DefWindowProc(mhMainWnd, msg, wParam, lParam); } void D3DApp::initMainWindow() { WNDCLASS wc; wc.style = CS_HREDRAW | CS_VREDRAW; wc.lpfnWndProc = MainWndProc; wc.cbClsExtra = 0; wc.cbWndExtra = 0; wc.hInstance = mhAppInst; wc.hIcon = LoadIcon(0, IDI_APPLICATION); wc.hCursor = LoadCursor(0, IDC_ARROW); wc.hbrBackground = (HBRUSH)GetStockObject(NULL_BRUSH); wc.lpszMenuName = 0; wc.lpszClassName = L"D3DWndClassName"; if( !RegisterClass(&wc) ) { MessageBox(0, L"RegisterClass FAILED", 0, 0); PostQuitMessage(0); } // Compute window rectangle dimensions based on requested client area dimensions. RECT R = { 0, 0, mClientWidth, mClientHeight }; AdjustWindowRect(&R, WS_OVERLAPPEDWINDOW, false); int width = R.right - R.left; int height = R.bottom - R.top; mhMainWnd = CreateWindow(L"D3DWndClassName", mMainWndCaption.c_str(), WS_OVERLAPPEDWINDOW, CW_USEDEFAULT, CW_USEDEFAULT, width, height, 0, 0, mhAppInst, this); if( !mhMainWnd ) { MessageBox(0, L"CreateWindow FAILED", 0, 0); PostQuitMessage(0); } ShowWindow(mhMainWnd, SW_SHOW); UpdateWindow(mhMainWnd); } void D3DApp::initDirect3D() { // Fill out a DXGI_SWAP_CHAIN_DESC to describe our swap chain. DXGI_SWAP_CHAIN_DESC sd; sd.BufferDesc.Width = mClientWidth; sd.BufferDesc.Height = mClientHeight; sd.BufferDesc.RefreshRate.Numerator = 60; sd.BufferDesc.RefreshRate.Denominator = 1; sd.BufferDesc.Format = DXGI_FORMAT_R8G8B8A8_UNORM; sd.BufferDesc.ScanlineOrdering = DXGI_MODE_SCANLINE_ORDER_UNSPECIFIED; sd.BufferDesc.Scaling = DXGI_MODE_SCALING_UNSPECIFIED; // No multisampling. sd.SampleDesc.Count = 1; sd.SampleDesc.Quality = 0; sd.BufferUsage = DXGI_USAGE_RENDER_TARGET_OUTPUT; sd.BufferCount = 1; sd.OutputWindow = mhMainWnd; sd.Windowed = true; sd.SwapEffect = DXGI_SWAP_EFFECT_DISCARD; sd.Flags = 0; // Create the device. UINT createDeviceFlags = 0; #if defined(DEBUG) || defined(_DEBUG) createDeviceFlags |= D3D10_CREATE_DEVICE_DEBUG; #endif HR( D3D10CreateDeviceAndSwapChain( 0, //default adapter md3dDriverType, 0, // no software device createDeviceFlags, D3D10_SDK_VERSION, &sd, &mSwapChain, &md3dDevice) ); // The remaining steps that need to be carried out for d3d creation // also need to be executed every time the window is resized. So // just call the onResize method here to avoid code duplication. onResize(); }

    Read the article

  • March 21st Links: ASP.NET, ASP.NET MVC, AJAX, Visual Studio, Silverlight

    - by ScottGu
    Here is the latest in my link-listing series. If you haven’t already, check out this month’s "Find a Hoster” page on the www.asp.net website to learn about great (and very inexpensive) ASP.NET hosting offers.  [In addition to blogging, I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu] ASP.NET URL Routing in ASP.NET 4: Scott Mitchell has a nice article that talks about the new URL routing features coming to Web Forms applications with ASP.NET 4.  Also check out my previous blog post on this topic. Control of Web Control ClientID Values in ASP.NET 4: Scott Mitchell has a nice article that describes how it is now easy to control the client “id” value emitted by server controls with ASP.NET 4. Web Deployment Made Awesome: Very nice MIX10 talk by Scott Hanselman on the new web deployment features coming with VS 2010, MSDeploy, and .NET 4.  Makes deploying web applications much, much easier. ASP.NET 4’s Browser Capabilities Support: Nice blog post by Stephen Walther that talks about the new browser definition capabilities support coming with ASP.NET 4. Integrating Twitter into an ASP.NET Website: Nice article by Scott Mitchell that demonstrates how to call and integrate Twitter from within your ASP.NET applications. Improving CSS with .LESS: Nice article by Scott Mitchell that describes how to optimize CSS using .LESS – a free, open source library. ASP.NET MVC Upgrading ASP.NET MVC 1 applications to ASP.NET MVC 2: Eilon Lipton from the ASP.NET team has a nice post that describes how to easily upgrade your ASP.NET MVC 1 applications to ASP.NET MVC 2.  He has an automated tool that makes this easy. Note that automated MVC upgrade support is also built-into VS 2010.  Use the tool in this blog post for updating existing MVC projects using VS 2008. Advanced ASP.NET MVC 2: Nice video talk by Brad Wilson of the ASP.NET MVC team.  In it he describes some of the more advanced features in ASP.NET MVC 2 and how to maximize your productivity with them. Dynamic Select Lists with ASP.NET MVC and jQuery: Michael Ceranski has a nice blog post that describes how to dynamically populate dropdownlists on the client using AJAX. AJAX Microsoft AJAX Minifier: We recently shipped an updated minifier utility that allows you to shrink/minify both JavaScript and CSS files – which can improve the performance of your web applications.  You can run this either manually as a command-line tool or now automatically integrate it using a Visual Studio build task.  You can download it for free here. Visual Studio VS 2010 Tip: Quickly Closing Documents: Nice blog post that describes some techniques for optimizing how windows are closed with the new VS 2010 IDE. Collpase to Definitions with Outlining: Nice tip from Zain on how to collapse your code editor to outline mode using Ctrl + M, Ctrl + O.  Also check out his post on copy/paste with outlining here. $299 VS 2010 Upgrade Offer for VS 2005/2008 Standard Users: Soma blogs about a nice VS 2010 upgrade offer you can take advantage of if you have VS 2005 or VS 2008 Standard editions.  For $299 you can upgrade to VS 2010 Professional edition. Dependency Graphics: Jason Zander (who runs the VS team) has a nice blog post that covers the new dependency graph support within VS 2010.  This makes it easier to visualize the dependencies within your application.  Also check out this video here. Layer Validation: Jason Zander has a nice blog post that talks about the new layer validation features in VS 2010.  This enables you to enforce cleaner layering within your projects and solutions.  VS 2010 Profiler Blog: The VS 2010 Profiler Team has their own blog and on it you can find a bunch of nice posts from the last few months that talk about a lot of the new features coming with VS 2010’s Profiler support.  Some really nice features coming. Silverlight Silverlight 4 Training Course: Nice free set of training courses from Microsoft that can help bring you up to speed on all of the new Silverlight 4 features and how to build applications with them.  Updated and current with the recently released Silverlight 4 RC build and tools. Getting Started with Silverlight and Windows Phone 7 Development: Nice blog post by Tim Heuer that summarizes how to get started building Windows Phone 7 applications using Silverlight.  Also check out my blog post from last week on how to build a Windows Phone 7 Twitter application using Silverlight. A Guide to What Has Changed with the Silverlight 4 RC: Nice summary post by Tim Heuer that describes all of the things that have changed between the Silverlight 4 Beta and the Silverlight 4 RC. Path Based Layout - Part 1 and Part 2: Christian Schormann has a nice blog post about a really cool new feature in Expression Blend 4 and Silverlight 4 called Path Layout. Also check out Andy Beaulieu’s blog post on this. Hope this helps, Scott

    Read the article

  • jQuery Datatable in MVC &hellip; extended.

    - by Steve Clements
    There are a million plugins for jQuery and when a web forms developer like myself works in MVC making use of them is par-for-the-course!  MVC is the way now, web forms are but a memory!! Grids / tables are my focus at the moment.  I don’t want to get in to righting reems of css and html, but it’s not acceptable to simply dump a table on the screen, functionality like sorting, paging, fixed header and perhaps filtering are expected behaviour.  What isn’t always required though is the massive functionality like editing etc you get with many grid plugins out there. You potentially spend a long time getting everything hooked together when you just don’t need it. That is where the jQuery DataTable plugin comes in.  It doesn’t have editing “out of the box” (you can add other plugins as you require to achieve such functionality). What it does though is very nicely format a table (and integrate with jQuery UI) without needing to hook up and Async actions etc.  Take a look here… http://www.datatables.net I did in the first instance start looking at the Telerik MVC grid control – I’m a fan of Telerik controls and if you are developing an in-house of open source app you get the MVC stuff for free…nice!  Their grid however is far more than I require.  Note: Using Telerik MVC controls with your own jQuery and jQuery UI does come with some hurdles, mainly to do with the order in which all your jQuery is executing – I won’t cover that here though – mainly because I don’t have a clear answer on the best way to solve it! One nice thing about the dataTable above is how easy it is to extend http://www.datatables.net/examples/plug-ins/plugin_api.html and there are some nifty examples on the site already… I however have a requirement that wasn’t on the site … I need a grid at the bottom of the page that will size automatically to the bottom of the page and be scrollable if required within its own space i.e. everything above the grid didn’t scroll as well.  Now a CSS master may have a great solution to this … I’m not that master and so didn’t! The content above the grid can vary so any kind of fixed positioning is out. So I wrote a little extension for the DataTable, hooked that up to the document.ready event and window.resize event. Initialising my dataTable ( s )… $(document).ready(function () {   var dTable = $(".tdata").dataTable({ "bPaginate": false, "bLengthChange": false, "bFilter": true, "bSort": true, "bInfo": false, "bAutoWidth": true, "sScrollY": "400px" });   My extension to the API to give me the resizing….   // ********************************************************************** // jQuery dataTable API extension to resize grid and adjust column sizes // $.fn.dataTableExt.oApi.fnSetHeightToBottom = function (oSettings) { var id = oSettings.nTable.id; var dt = $("#" + id); var top = dt.position().top; var winHeight = $(document).height(); var remain = (winHeight - top) - 83; dt.parent().attr("style", "overflow-x: auto; overflow-y: auto; height: " + remain + "px;"); this.fnAdjustColumnSizing(); } This is very much is debug mode, so pretty verbose at the moment – I’ll tidy that up later! You can see the last call is a call to an existing method, as the columns are fixed and that normally involves so CSS voodoo, a call to adjust those sizes is required. Just above is the style that the dataTable gives the grid wrapper div, I got that from some firebug action and stick in my new height. The –83 is to give me the space at the bottom i require for fixed footer!   Finally I hook that up to the load and window resize.  I’m actually using jQuery UI tabs as well, so I’ve got that in the open event of the tabs.   $(document).ready(function () { var oTable; $("#tabs").tabs({ "show": function (event, ui) { oTable = $('div.dataTables_scrollBody>table.tdata', ui.panel).dataTable(); if (oTable.length > 0) { oTable.fnSetHeightToBottom(); } } }); $(window).bind("resize", function () { oTable.fnSetHeightToBottom(); }); }); And that all there is too it.  Testament to the wonders of jQuery and the immense community surrounding it – to which I am extremely grateful. I’ve also hooked up some custom column filtering on the grid – pretty normal stuff though – you can get what you need for that from their website.  I do hide the out of the box filter input as I wanted column specific, you need filtering turned on when initialising to get it to work and that input come with it!  Tip: fnFilter is the method you want.  With column index as a param – I used data tags to simply that one.

    Read the article

  • value types in the vm

    - by john.rose
    value types in the vm p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Times} p.p2 {margin: 0.0px 0.0px 14.0px 0.0px; font: 14.0px Times} p.p3 {margin: 0.0px 0.0px 12.0px 0.0px; font: 14.0px Times} p.p4 {margin: 0.0px 0.0px 15.0px 0.0px; font: 14.0px Times} p.p5 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Courier} p.p6 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Courier; min-height: 17.0px} p.p7 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Times; min-height: 18.0px} p.p8 {margin: 0.0px 0.0px 0.0px 36.0px; text-indent: -36.0px; font: 14.0px Times; min-height: 18.0px} p.p9 {margin: 0.0px 0.0px 12.0px 0.0px; font: 14.0px Times; min-height: 18.0px} p.p10 {margin: 0.0px 0.0px 12.0px 0.0px; font: 14.0px Times; color: #000000} li.li1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Times} li.li7 {margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Times; min-height: 18.0px} span.s1 {font: 14.0px Courier} span.s2 {color: #000000} span.s3 {font: 14.0px Courier; color: #000000} ol.ol1 {list-style-type: decimal} Or, enduring values for a changing world. Introduction A value type is a data type which, generally speaking, is designed for being passed by value in and out of methods, and stored by value in data structures. The only value types which the Java language directly supports are the eight primitive types. Java indirectly and approximately supports value types, if they are implemented in terms of classes. For example, both Integer and String may be viewed as value types, especially if their usage is restricted to avoid operations appropriate to Object. In this note, we propose a definition of value types in terms of a design pattern for Java classes, accompanied by a set of usage restrictions. We also sketch the relation of such value types to tuple types (which are a JVM-level notion), and point out JVM optimizations that can apply to value types. This note is a thought experiment to extend the JVM’s performance model in support of value types. The demonstration has two phases.  Initially the extension can simply use design patterns, within the current bytecode architecture, and in today’s Java language. But if the performance model is to be realized in practice, it will probably require new JVM bytecode features, changes to the Java language, or both.  We will look at a few possibilities for these new features. An Axiom of Value In the context of the JVM, a value type is a data type equipped with construction, assignment, and equality operations, and a set of typed components, such that, whenever two variables of the value type produce equal corresponding values for their components, the values of the two variables cannot be distinguished by any JVM operation. Here are some corollaries: A value type is immutable, since otherwise a copy could be constructed and the original could be modified in one of its components, allowing the copies to be distinguished. Changing the component of a value type requires construction of a new value. The equals and hashCode operations are strictly component-wise. If a value type is represented by a JVM reference, that reference cannot be successfully synchronized on, and cannot be usefully compared for reference equality. A value type can be viewed in terms of what it doesn’t do. We can say that a value type omits all value-unsafe operations, which could violate the constraints on value types.  These operations, which are ordinarily allowed for Java object types, are pointer equality comparison (the acmp instruction), synchronization (the monitor instructions), all the wait and notify methods of class Object, and non-trivial finalize methods. The clone method is also value-unsafe, although for value types it could be treated as the identity function. Finally, and most importantly, any side effect on an object (however visible) also counts as an value-unsafe operation. A value type may have methods, but such methods must not change the components of the value. It is reasonable and useful to define methods like toString, equals, and hashCode on value types, and also methods which are specifically valuable to users of the value type. Representations of Value Value types have two natural representations in the JVM, unboxed and boxed. An unboxed value consists of the components, as simple variables. For example, the complex number x=(1+2i), in rectangular coordinate form, may be represented in unboxed form by the following pair of variables: /*Complex x = Complex.valueOf(1.0, 2.0):*/ double x_re = 1.0, x_im = 2.0; These variables might be locals, parameters, or fields. Their association as components of a single value is not defined to the JVM. Here is a sample computation which computes the norm of the difference between two complex numbers: double distance(/*Complex x:*/ double x_re, double x_im,         /*Complex y:*/ double y_re, double y_im) {     /*Complex z = x.minus(y):*/     double z_re = x_re - y_re, z_im = x_im - y_im;     /*return z.abs():*/     return Math.sqrt(z_re*z_re + z_im*z_im); } A boxed representation groups component values under a single object reference. The reference is to a ‘wrapper class’ that carries the component values in its fields. (A primitive type can naturally be equated with a trivial value type with just one component of that type. In that view, the wrapper class Integer can serve as a boxed representation of value type int.) The unboxed representation of complex numbers is practical for many uses, but it fails to cover several major use cases: return values, array elements, and generic APIs. The two components of a complex number cannot be directly returned from a Java function, since Java does not support multiple return values. The same story applies to array elements: Java has no ’array of structs’ feature. (Double-length arrays are a possible workaround for complex numbers, but not for value types with heterogeneous components.) By generic APIs I mean both those which use generic types, like Arrays.asList and those which have special case support for primitive types, like String.valueOf and PrintStream.println. Those APIs do not support unboxed values, and offer some problems to boxed values. Any ’real’ JVM type should have a story for returns, arrays, and API interoperability. The basic problem here is that value types fall between primitive types and object types. Value types are clearly more complex than primitive types, and object types are slightly too complicated. Objects are a little bit dangerous to use as value carriers, since object references can be compared for pointer equality, and can be synchronized on. Also, as many Java programmers have observed, there is often a performance cost to using wrapper objects, even on modern JVMs. Even so, wrapper classes are a good starting point for talking about value types. If there were a set of structural rules and restrictions which would prevent value-unsafe operations on value types, wrapper classes would provide a good notation for defining value types. This note attempts to define such rules and restrictions. Let’s Start Coding Now it is time to look at some real code. Here is a definition, written in Java, of a complex number value type. @ValueSafe public final class Complex implements java.io.Serializable {     // immutable component structure:     public final double re, im;     private Complex(double re, double im) {         this.re = re; this.im = im;     }     // interoperability methods:     public String toString() { return "Complex("+re+","+im+")"; }     public List<Double> asList() { return Arrays.asList(re, im); }     public boolean equals(Complex c) {         return re == c.re && im == c.im;     }     public boolean equals(@ValueSafe Object x) {         return x instanceof Complex && equals((Complex) x);     }     public int hashCode() {         return 31*Double.valueOf(re).hashCode()                 + Double.valueOf(im).hashCode();     }     // factory methods:     public static Complex valueOf(double re, double im) {         return new Complex(re, im);     }     public Complex changeRe(double re2) { return valueOf(re2, im); }     public Complex changeIm(double im2) { return valueOf(re, im2); }     public static Complex cast(@ValueSafe Object x) {         return x == null ? ZERO : (Complex) x;     }     // utility methods and constants:     public Complex plus(Complex c)  { return new Complex(re+c.re, im+c.im); }     public Complex minus(Complex c) { return new Complex(re-c.re, im-c.im); }     public double abs() { return Math.sqrt(re*re + im*im); }     public static final Complex PI = valueOf(Math.PI, 0.0);     public static final Complex ZERO = valueOf(0.0, 0.0); } This is not a minimal definition, because it includes some utility methods and other optional parts.  The essential elements are as follows: The class is marked as a value type with an annotation. The class is final, because it does not make sense to create subclasses of value types. The fields of the class are all non-private and final.  (I.e., the type is immutable and structurally transparent.) From the supertype Object, all public non-final methods are overridden. The constructor is private. Beyond these bare essentials, we can observe the following features in this example, which are likely to be typical of all value types: One or more factory methods are responsible for value creation, including a component-wise valueOf method. There are utility methods for complex arithmetic and instance creation, such as plus and changeIm. There are static utility constants, such as PI. The type is serializable, using the default mechanisms. There are methods for converting to and from dynamically typed references, such as asList and cast. The Rules In order to use value types properly, the programmer must avoid value-unsafe operations.  A helpful Java compiler should issue errors (or at least warnings) for code which provably applies value-unsafe operations, and should issue warnings for code which might be correct but does not provably avoid value-unsafe operations.  No such compilers exist today, but to simplify our account here, we will pretend that they do exist. A value-safe type is any class, interface, or type parameter marked with the @ValueSafe annotation, or any subtype of a value-safe type.  If a value-safe class is marked final, it is in fact a value type.  All other value-safe classes must be abstract.  The non-static fields of a value class must be non-public and final, and all its constructors must be private. Under the above rules, a standard interface could be helpful to define value types like Complex.  Here is an example: @ValueSafe public interface ValueType extends java.io.Serializable {     // All methods listed here must get redefined.     // Definitions must be value-safe, which means     // they may depend on component values only.     List<? extends Object> asList();     int hashCode();     boolean equals(@ValueSafe Object c);     String toString(); } //@ValueSafe inherited from supertype: public final class Complex implements ValueType { … The main advantage of such a conventional interface is that (unlike an annotation) it is reified in the runtime type system.  It could appear as an element type or parameter bound, for facilities which are designed to work on value types only.  More broadly, it might assist the JVM to perform dynamic enforcement of the rules for value types. Besides types, the annotation @ValueSafe can mark fields, parameters, local variables, and methods.  (This is redundant when the type is also value-safe, but may be useful when the type is Object or another supertype of a value type.)  Working forward from these annotations, an expression E is defined as value-safe if it satisfies one or more of the following: The type of E is a value-safe type. E names a field, parameter, or local variable whose declaration is marked @ValueSafe. E is a call to a method whose declaration is marked @ValueSafe. E is an assignment to a value-safe variable, field reference, or array reference. E is a cast to a value-safe type from a value-safe expression. E is a conditional expression E0 ? E1 : E2, and both E1 and E2 are value-safe. Assignments to value-safe expressions and initializations of value-safe names must take their values from value-safe expressions. A value-safe expression may not be the subject of a value-unsafe operation.  In particular, it cannot be synchronized on, nor can it be compared with the “==” operator, not even with a null or with another value-safe type. In a program where all of these rules are followed, no value-type value will be subject to a value-unsafe operation.  Thus, the prime axiom of value types will be satisfied, that no two value type will be distinguishable as long as their component values are equal. More Code To illustrate these rules, here are some usage examples for Complex: Complex pi = Complex.valueOf(Math.PI, 0); Complex zero = pi.changeRe(0);  //zero = pi; zero.re = 0; ValueType vtype = pi; @SuppressWarnings("value-unsafe")   Object obj = pi; @ValueSafe Object obj2 = pi; obj2 = new Object();  // ok List<Complex> clist = new ArrayList<Complex>(); clist.add(pi);  // (ok assuming List.add param is @ValueSafe) List<ValueType> vlist = new ArrayList<ValueType>(); vlist.add(pi);  // (ok) List<Object> olist = new ArrayList<Object>(); olist.add(pi);  // warning: "value-unsafe" boolean z = pi.equals(zero); boolean z1 = (pi == zero);  // error: reference comparison on value type boolean z2 = (pi == null);  // error: reference comparison on value type boolean z3 = (pi == obj2);  // error: reference comparison on value type synchronized (pi) { }  // error: synch of value, unpredictable result synchronized (obj2) { }  // unpredictable result Complex qq = pi; qq = null;  // possible NPE; warning: “null-unsafe" qq = (Complex) obj;  // warning: “null-unsafe" qq = Complex.cast(obj);  // OK @SuppressWarnings("null-unsafe")   Complex empty = null;  // possible NPE qq = empty;  // possible NPE (null pollution) The Payoffs It follows from this that either the JVM or the java compiler can replace boxed value-type values with unboxed ones, without affecting normal computations.  Fields and variables of value types can be split into their unboxed components.  Non-static methods on value types can be transformed into static methods which take the components as value parameters. Some common questions arise around this point in any discussion of value types. Why burden the programmer with all these extra rules?  Why not detect programs automagically and perform unboxing transparently?  The answer is that it is easy to break the rules accidently unless they are agreed to by the programmer and enforced.  Automatic unboxing optimizations are tantalizing but (so far) unreachable ideal.  In the current state of the art, it is possible exhibit benchmarks in which automatic unboxing provides the desired effects, but it is not possible to provide a JVM with a performance model that assures the programmer when unboxing will occur.  This is why I’m writing this note, to enlist help from, and provide assurances to, the programmer.  Basically, I’m shooting for a good set of user-supplied “pragmas” to frame the desired optimization. Again, the important thing is that the unboxing must be done reliably, or else programmers will have no reason to work with the extra complexity of the value-safety rules.  There must be a reasonably stable performance model, wherein using a value type has approximately the same performance characteristics as writing the unboxed components as separate Java variables. There are some rough corners to the present scheme.  Since Java fields and array elements are initialized to null, value-type computations which incorporate uninitialized variables can produce null pointer exceptions.  One workaround for this is to require such variables to be null-tested, and the result replaced with a suitable all-zero value of the value type.  That is what the “cast” method does above. Generically typed APIs like List<T> will continue to manipulate boxed values always, at least until we figure out how to do reification of generic type instances.  Use of such APIs will elicit warnings until their type parameters (and/or relevant members) are annotated or typed as value-safe.  Retrofitting List<T> is likely to expose flaws in the present scheme, which we will need to engineer around.  Here are a couple of first approaches: public interface java.util.List<@ValueSafe T> extends Collection<T> { … public interface java.util.List<T extends Object|ValueType> extends Collection<T> { … (The second approach would require disjunctive types, in which value-safety is “contagious” from the constituent types.) With more transformations, the return value types of methods can also be unboxed.  This may require significant bytecode-level transformations, and would work best in the presence of a bytecode representation for multiple value groups, which I have proposed elsewhere under the title “Tuples in the VM”. But for starters, the JVM can apply this transformation under the covers, to internally compiled methods.  This would give a way to express multiple return values and structured return values, which is a significant pain-point for Java programmers, especially those who work with low-level structure types favored by modern vector and graphics processors.  The lack of multiple return values has a strong distorting effect on many Java APIs. Even if the JVM fails to unbox a value, there is still potential benefit to the value type.  Clustered computing systems something have copy operations (serialization or something similar) which apply implicitly to command operands.  When copying JVM objects, it is extremely helpful to know when an object’s identity is important or not.  If an object reference is a copied operand, the system may have to create a proxy handle which points back to the original object, so that side effects are visible.  Proxies must be managed carefully, and this can be expensive.  On the other hand, value types are exactly those types which a JVM can “copy and forget” with no downside. Array types are crucial to bulk data interfaces.  (As data sizes and rates increase, bulk data becomes more important than scalar data, so arrays are definitely accompanying us into the future of computing.)  Value types are very helpful for adding structure to bulk data, so a successful value type mechanism will make it easier for us to express richer forms of bulk data. Unboxing arrays (i.e., arrays containing unboxed values) will provide better cache and memory density, and more direct data movement within clustered or heterogeneous computing systems.  They require the deepest transformations, relative to today’s JVM.  There is an impedance mismatch between value-type arrays and Java’s covariant array typing, so compromises will need to be struck with existing Java semantics.  It is probably worth the effort, since arrays of unboxed value types are inherently more memory-efficient than standard Java arrays, which rely on dependent pointer chains. It may be sufficient to extend the “value-safe” concept to array declarations, and allow low-level transformations to change value-safe array declarations from the standard boxed form into an unboxed tuple-based form.  Such value-safe arrays would not be convertible to Object[] arrays.  Certain connection points, such as Arrays.copyOf and System.arraycopy might need additional input/output combinations, to allow smooth conversion between arrays with boxed and unboxed elements. Alternatively, the correct solution may have to wait until we have enough reification of generic types, and enough operator overloading, to enable an overhaul of Java arrays. Implicit Method Definitions The example of class Complex above may be unattractively complex.  I believe most or all of the elements of the example class are required by the logic of value types. If this is true, a programmer who writes a value type will have to write lots of error-prone boilerplate code.  On the other hand, I think nearly all of the code (except for the domain-specific parts like plus and minus) can be implicitly generated. Java has a rule for implicitly defining a class’s constructor, if no it defines no constructors explicitly.  Likewise, there are rules for providing default access modifiers for interface members.  Because of the highly regular structure of value types, it might be reasonable to perform similar implicit transformations on value types.  Here’s an example of a “highly implicit” definition of a complex number type: public class Complex implements ValueType {  // implicitly final     public double re, im;  // implicitly public final     //implicit methods are defined elementwise from te fields:     //  toString, asList, equals(2), hashCode, valueOf, cast     //optionally, explicit methods (plus, abs, etc.) would go here } In other words, with the right defaults, a simple value type definition can be a one-liner.  The observant reader will have noticed the similarities (and suitable differences) between the explicit methods above and the corresponding methods for List<T>. Another way to abbreviate such a class would be to make an annotation the primary trigger of the functionality, and to add the interface(s) implicitly: public @ValueType class Complex { … // implicitly final, implements ValueType (But to me it seems better to communicate the “magic” via an interface, even if it is rooted in an annotation.) Implicitly Defined Value Types So far we have been working with nominal value types, which is to say that the sequence of typed components is associated with a name and additional methods that convey the intention of the programmer.  A simple ordered pair of floating point numbers can be variously interpreted as (to name a few possibilities) a rectangular or polar complex number or Cartesian point.  The name and the methods convey the intended meaning. But what if we need a truly simple ordered pair of floating point numbers, without any further conceptual baggage?  Perhaps we are writing a method (like “divideAndRemainder”) which naturally returns a pair of numbers instead of a single number.  Wrapping the pair of numbers in a nominal type (like “QuotientAndRemainder”) makes as little sense as wrapping a single return value in a nominal type (like “Quotient”).  What we need here are structural value types commonly known as tuples. For the present discussion, let us assign a conventional, JVM-friendly name to tuples, roughly as follows: public class java.lang.tuple.$DD extends java.lang.tuple.Tuple {      double $1, $2; } Here the component names are fixed and all the required methods are defined implicitly.  The supertype is an abstract class which has suitable shared declarations.  The name itself mentions a JVM-style method parameter descriptor, which may be “cracked” to determine the number and types of the component fields. The odd thing about such a tuple type (and structural types in general) is it must be instantiated lazily, in response to linkage requests from one or more classes that need it.  The JVM and/or its class loaders must be prepared to spin a tuple type on demand, given a simple name reference, $xyz, where the xyz is cracked into a series of component types.  (Specifics of naming and name mangling need some tasteful engineering.) Tuples also seem to demand, even more than nominal types, some support from the language.  (This is probably because notations for non-nominal types work best as combinations of punctuation and type names, rather than named constructors like Function3 or Tuple2.)  At a minimum, languages with tuples usually (I think) have some sort of simple bracket notation for creating tuples, and a corresponding pattern-matching syntax (or “destructuring bind”) for taking tuples apart, at least when they are parameter lists.  Designing such a syntax is no simple thing, because it ought to play well with nominal value types, and also with pre-existing Java features, such as method parameter lists, implicit conversions, generic types, and reflection.  That is a task for another day. Other Use Cases Besides complex numbers and simple tuples there are many use cases for value types.  Many tuple-like types have natural value-type representations. These include rational numbers, point locations and pixel colors, and various kinds of dates and addresses. Other types have a variable-length ‘tail’ of internal values. The most common example of this is String, which is (mathematically) a sequence of UTF-16 character values. Similarly, bit vectors, multiple-precision numbers, and polynomials are composed of sequences of values. Such types include, in their representation, a reference to a variable-sized data structure (often an array) which (somehow) represents the sequence of values. The value type may also include ’header’ information. Variable-sized values often have a length distribution which favors short lengths. In that case, the design of the value type can make the first few values in the sequence be direct ’header’ fields of the value type. In the common case where the header is enough to represent the whole value, the tail can be a shared null value, or even just a null reference. Note that the tail need not be an immutable object, as long as the header type encapsulates it well enough. This is the case with String, where the tail is a mutable (but never mutated) character array. Field types and their order must be a globally visible part of the API.  The structure of the value type must be transparent enough to have a globally consistent unboxed representation, so that all callers and callees agree about the type and order of components  that appear as parameters, return types, and array elements.  This is a trade-off between efficiency and encapsulation, which is forced on us when we remove an indirection enjoyed by boxed representations.  A JVM-only transformation would not care about such visibility, but a bytecode transformation would need to take care that (say) the components of complex numbers would not get swapped after a redefinition of Complex and a partial recompile.  Perhaps constant pool references to value types need to declare the field order as assumed by each API user. This brings up the delicate status of private fields in a value type.  It must always be possible to load, store, and copy value types as coordinated groups, and the JVM performs those movements by moving individual scalar values between locals and stack.  If a component field is not public, what is to prevent hostile code from plucking it out of the tuple using a rogue aload or astore instruction?  Nothing but the verifier, so we may need to give it more smarts, so that it treats value types as inseparable groups of stack slots or locals (something like long or double). My initial thought was to make the fields always public, which would make the security problem moot.  But public is not always the right answer; consider the case of String, where the underlying mutable character array must be encapsulated to prevent security holes.  I believe we can win back both sides of the tradeoff, by training the verifier never to split up the components in an unboxed value.  Just as the verifier encapsulates the two halves of a 64-bit primitive, it can encapsulate the the header and body of an unboxed String, so that no code other than that of class String itself can take apart the values. Similar to String, we could build an efficient multi-precision decimal type along these lines: public final class DecimalValue extends ValueType {     protected final long header;     protected private final BigInteger digits;     public DecimalValue valueOf(int value, int scale) {         assert(scale >= 0);         return new DecimalValue(((long)value << 32) + scale, null);     }     public DecimalValue valueOf(long value, int scale) {         if (value == (int) value)             return valueOf((int)value, scale);         return new DecimalValue(-scale, new BigInteger(value));     } } Values of this type would be passed between methods as two machine words. Small values (those with a significand which fits into 32 bits) would be represented without any heap data at all, unless the DecimalValue itself were boxed. (Note the tension between encapsulation and unboxing in this case.  It would be better if the header and digits fields were private, but depending on where the unboxing information must “leak”, it is probably safer to make a public revelation of the internal structure.) Note that, although an array of Complex can be faked with a double-length array of double, there is no easy way to fake an array of unboxed DecimalValues.  (Either an array of boxed values or a transposed pair of homogeneous arrays would be reasonable fallbacks, in a current JVM.)  Getting the full benefit of unboxing and arrays will require some new JVM magic. Although the JVM emphasizes portability, system dependent code will benefit from using machine-level types larger than 64 bits.  For example, the back end of a linear algebra package might benefit from value types like Float4 which map to stock vector types.  This is probably only worthwhile if the unboxing arrays can be packed with such values. More Daydreams A more finely-divided design for dynamic enforcement of value safety could feature separate marker interfaces for each invariant.  An empty marker interface Unsynchronizable could cause suitable exceptions for monitor instructions on objects in marked classes.  More radically, a Interchangeable marker interface could cause JVM primitives that are sensitive to object identity to raise exceptions; the strangest result would be that the acmp instruction would have to be specified as raising an exception. @ValueSafe public interface ValueType extends java.io.Serializable,         Unsynchronizable, Interchangeable { … public class Complex implements ValueType {     // inherits Serializable, Unsynchronizable, Interchangeable, @ValueSafe     … It seems possible that Integer and the other wrapper types could be retro-fitted as value-safe types.  This is a major change, since wrapper objects would be unsynchronizable and their references interchangeable.  It is likely that code which violates value-safety for wrapper types exists but is uncommon.  It is less plausible to retro-fit String, since the prominent operation String.intern is often used with value-unsafe code. We should also reconsider the distinction between boxed and unboxed values in code.  The design presented above obscures that distinction.  As another thought experiment, we could imagine making a first class distinction in the type system between boxed and unboxed representations.  Since only primitive types are named with a lower-case initial letter, we could define that the capitalized version of a value type name always refers to the boxed representation, while the initial lower-case variant always refers to boxed.  For example: complex pi = complex.valueOf(Math.PI, 0); Complex boxPi = pi;  // convert to boxed myList.add(boxPi); complex z = myList.get(0);  // unbox Such a convention could perhaps absorb the current difference between int and Integer, double and Double. It might also allow the programmer to express a helpful distinction among array types. As said above, array types are crucial to bulk data interfaces, but are limited in the JVM.  Extending arrays beyond the present limitations is worth thinking about; for example, the Maxine JVM implementation has a hybrid object/array type.  Something like this which can also accommodate value type components seems worthwhile.  On the other hand, does it make sense for value types to contain short arrays?  And why should random-access arrays be the end of our design process, when bulk data is often sequentially accessed, and it might make sense to have heterogeneous streams of data as the natural “jumbo” data structure.  These considerations must wait for another day and another note. More Work It seems to me that a good sequence for introducing such value types would be as follows: Add the value-safety restrictions to an experimental version of javac. Code some sample applications with value types, including Complex and DecimalValue. Create an experimental JVM which internally unboxes value types but does not require new bytecodes to do so.  Ensure the feasibility of the performance model for the sample applications. Add tuple-like bytecodes (with or without generic type reification) to a major revision of the JVM, and teach the Java compiler to switch in the new bytecodes without code changes. A staggered roll-out like this would decouple language changes from bytecode changes, which is always a convenient thing. A similar investigation should be applied (concurrently) to array types.  In this case, it seems to me that the starting point is in the JVM: Add an experimental unboxing array data structure to a production JVM, perhaps along the lines of Maxine hybrids.  No bytecode or language support is required at first; everything can be done with encapsulated unsafe operations and/or method handles. Create an experimental JVM which internally unboxes value types but does not require new bytecodes to do so.  Ensure the feasibility of the performance model for the sample applications. Add tuple-like bytecodes (with or without generic type reification) to a major revision of the JVM, and teach the Java compiler to switch in the new bytecodes without code changes. That’s enough musing me for now.  Back to work!

    Read the article

  • A Quick Primer on SharePoint Customization

    - by PeterBrunone
    Normal 0 false false false EN-US X-NONE X-NONE MicrosoftInternetExplorer4 /* Style Definitions */ table.MsoNormalTable {mso-style-name:"Table Normal"; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:""; mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-para-margin:0in; mso-para-margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:10.0pt; font-family:"Times New Roman","serif";} This one goes out to all the people who have been asked to change the way a SharePoint site looks.  Management wants to know how long it will take, and you can whip that out by tomorrow, right?  If you don't have time to prepare a treatise on what's involved, or if you just want to lend some extra weight to your case by quoting a blogger who was an MVP for seven years, then dive right in; this post is for you. There are three main components of SharePoint visual customization:   1)       Theme – A theme encompasses all the standardized text formatting and coloring (borders, fonts, etc), including the background images of various sections. All told, there could be around 50 images involved, and a few hundred CSS (style) classes.  Installing a theme once it’s been created is no great feat.  Given the number of pieces, of course, creating a new theme could take anywhere from a day to a week… once decisions have been made about the desired appearance. 2)      Master Page – A master page provides the framework for page layout.  This includes all the top and side menus, where content shows up, et cetera.  Master pages have been around for a long time in ASP.NET (Microsoft’s web development platform), and they do require some .NET programming knowledge.  Beyond that, in SharePoint, there are a few dozen controls which the system expects find on a given page.  They’re not all used at once, but if they’re not there when they’re needed, chaos ensues.  Estimating a custom master page is difficult, as it depends on the level of customization.  I’ve been on projects where I was brought in simply to fix some problems and add a few finishing touches, and it took 2-3 weeks.  Master page customization requires a large amount of testing time to make sure that the HTML, JavaScript, CSS, and control placement all work well together. 3)      Individual page layout – Each page (ideally) uses a master page for its template, but within the content areas defined by the master page, web parts can be added, removed, and configured from within the browser.  The wireframe that Brent provided could most likely be completed simply by manipulating the content on the home page in this fashion, and we had allowed about a day of effort for the task.  If needed, further functionality can be provided by an experienced ASP.NET developer; custom forms are a common example.  This of course is a bit more in-depth than simple content manipulation and could take several days per page (or more; there’s really no way to quantify this without a set of requirements).   That’s basically it.  To recap:  Fonts and coloring are done with themes, and can take anywhere from a day to a week to create (not counting creative time); required technical skills include HTML, CSS, and image manipulation.  Templated layout is done with master pages, and generally requires a developer familiar with both ASP.NET and SharePoint in particular; it can have far-reaching consequences depending on the complexity of the changes, and could add weeks or months to a project.  Page layout can be as simple as content manipulation in the web browser, taking a few hours per page, or it can involve more detail, like custom forms, and can require programming expertise and significantly more development time.

    Read the article

< Previous Page | 364 365 366 367 368 369 370 371 372 373 374 375  | Next Page >