Search Results

Search found 57775 results on 2311 pages for 'dan gallo@oracle com'.

Page 2298/2311 | < Previous Page | 2294 2295 2296 2297 2298 2299 2300 2301 2302 2303 2304 2305  | Next Page >

  • c#: sms appears to have been sent, but stuck in phone outbox

    - by I__
    i wrote code to send an SMS using my gsm phone which is attached to the computer through com port. the code is below. the problem is i do see that it is in the outbox of the phone and it actually appears to have been sent, but when i contact the recipient they say that i have not received the message. i test the phone, and i create and send a message using only the phone and it works perfectly, however when i do this with my code, it APPEARS to have been sent, and i am getting all the correct AT COMMAND responses from the phone, but the message is actually NOT sent. here is the code: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; using System.Threading; using System.IO.Ports; namespace WindowsFormsApplication1 { public partial class Form1 : Form { SerialPort serialPort1; int m_iTxtMsgState = 0; const int NUM_MESSAGE_STATES = 4; const string RESERVED_COM_1 = "COM1"; const string RESERVED_COM_4 = "COM4"; public Form1() { InitializeComponent(); this.Closing += new CancelEventHandler(Form1_Closing); } private void Form1_Load(object sender, EventArgs e) { serialPort1 = new SerialPort(GetUSBComPort()); if (serialPort1.IsOpen) { serialPort1.Close(); } serialPort1.Open(); //ThreadStart myThreadDelegate = new ThreadStart(ReceiveAndOutput); //Thread myThread = new Thread(myThreadDelegate); //myThread.Start(); this.serialPort1.DataReceived += new SerialDataReceivedEventHandler(sp_DataReceived); } private void Form1_Closing(object sender, System.ComponentModel.CancelEventArgs e) { serialPort1.Close(); } private void SendLine(string sLine) { serialPort1.Write(sLine); sLine = sLine.Replace("\u001A", ""); consoleOut.Text += sLine; } public void DoWork() { ProcessMessageState(); } public void ProcessMessageState() { switch (m_iTxtMsgState) { case 0: m_iTxtMsgState = 1; SendLine("AT\r\n"); //NOTE: SendLine must be the last thing called in all of these! break; case 1: m_iTxtMsgState = 2; SendLine("AT+CMGF=1\r\n"); break; case 2: m_iTxtMsgState = 3; SendLine("AT+CMGW=" + Convert.ToChar(34) + "+9737387467" + Convert.ToChar(34) + "\r\n"); break; case 3: m_iTxtMsgState = 4; SendLine("A simple demo of SMS text messaging." + Convert.ToChar(26)); break; case 4: m_iTxtMsgState = 5; break; case 5: m_iTxtMsgState = NUM_MESSAGE_STATES; break; } } private string GetStoredSMSID() { return null; } /* //i dont think this part does anything private void serialPort1_DataReceived_1(object sender, System.IO.Ports.SerialDataReceivedEventArgs e) { string response = serialPort1.ReadLine(); this.BeginInvoke(new MethodInvoker(() => textBox1.AppendText(response + "\r\n"))); } */ void sp_DataReceived(object sender, SerialDataReceivedEventArgs e) { try { Thread.Sleep(500); char[] msg; msg = new char[613]; int iNumToRead = serialPort1.BytesToRead; serialPort1.Read(msg, 0, iNumToRead); string response = new string(msg); this.BeginInvoke(new MethodInvoker(() => textBox1.AppendText(response + "\r\n"))); serialPort1.DiscardInBuffer(); if (m_iTxtMsgState == 4) { int pos_cmgw = response.IndexOf("+CMGW:"); string cmgw_num = response.Substring(pos_cmgw + 7, 4); SendLine("AT+CMSS=" + cmgw_num + "\r\n"); //stop listening to messages received } if (m_iTxtMsgState < NUM_MESSAGE_STATES) { ProcessMessageState(); } } catch { } } private void button1_Click(object sender, EventArgs e) { m_iTxtMsgState = 0; DoWork(); } private void button2_Click(object sender, EventArgs e) { string[] sPorts = SerialPort.GetPortNames(); foreach (string port in sPorts) { consoleOut.Text += port + "\r\n"; } } private string GetUSBComPort() { string[] sPorts = SerialPort.GetPortNames(); foreach (string port in sPorts) { if (port != RESERVED_COM_1 && port != RESERVED_COM_4) { return port; } } return null; } }

    Read the article

  • How to get latitude and longitude position that stored in MySQL and use it in Android map application

    - by gunawan haruna
    I have tried to get the latitude and longitude position that was stored in MySQL. I want use the values to my Android map application. Here is my code: deskripsi.Java Button direction = (Button) findViewById (R.id.btnDir); direction.setOnClickListener(new OnClickListener(){ public void onClick(View arg0) { Intent z = getIntent(); des_lat = z.getExtras().getString("des_lat"); des_long = z.getExtras().getString("des_long"); Intent i = new Intent(android.content.Intent.ACTION_VIEW, Uri.parse("http://maps.google.com/maps?&daddr="+des_lat+","+des_long)); //("geo:37.827500,-122.481670")); startActivity(i); } }); And here is the content.Java private ListView list; int x; private String panjang[]; public void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); setContentView(R.layout.kontent); super.initButtonSearch(); list = (ListView) findViewById(R.id.list); JSONObject jo; try { jo = new JSONObject(JsonKontent); JSONArray ja = jo.getJSONArray("result"); System.out.println("Panjang : " + ja.length()); if (ja.length() == 0) { Toast.makeText(Content.this, "Data tidak ada!", Toast.LENGTH_LONG).show(); finish(); } content_id = new String[ja.length()]; c_title = new String[ja.length()]; c_telephone = new String[ja.length()]; c_short_description = new String[ja.length()]; c_long_description = new String[ja.length()]; c_image1 = new String[ja.length()]; c_image2 = new String[ja.length()]; l_address = new String[ja.length()]; catagory_id = new String[ja.length()]; Location myLoc = new Location("sharedPreferences"); Location restLoc = new Location("restaurantTable"); l_latitude = new String[ja.length()]; l_longitude = new String[ja.length()]; c_name = new String[ja.length()]; panjang = new String[ja.length()]; for (x = 0; x < ja.length(); x++) { JSONObject joj = ja.getJSONObject(x); content_id[x] = joj.getString("content_id"); catagory_id[x] = joj.getString("catagory_id"); c_title[x] = joj.getString("c_title"); c_telephone[x] = joj.getString("c_telephone"); c_short_description[x] = joj.getString("c_short_description"); c_long_description[x] = joj.getString("c_long_description"); c_image1[x] = HTTPConnection.urlPicture + joj.getString("c_image1"); c_image2[x] = HTTPConnection.urlPicture + joj.getString("c_image2"); l_address[x] = joj.getString("l_address"); l_latitude[x] = joj.getString("l_latitude"); l_longitude[x] = joj.getString("l_longitude"); c_name[x] = joj.getString("c_name"); myLoc.setLatitude(myLatitude); myLoc.setLongitude(myLongitude); restLoc.setLatitude(Double.parseDouble(l_latitude[x])); restLoc.setLongitude(Double.parseDouble(l_longitude[x])); float f = myLoc.distanceTo(restLoc); int f_int = Math.round(f / 100); f = Float.valueOf(f_int) / 10; String dist = new DecimalFormat("#,##0.0").format(f); System.out.println("Panjang " + dist + " km"); panjang[x] = dist + " km"; } } catch (JSONException e) { Toast.makeText(Content.this, "Data yang dicari tidak ada!", Toast.LENGTH_LONG).show(); finish(); } PFCAdapter adapter = new PFCAdapter(this, c_image1, c_title, l_address, panjang); list.setAdapter(adapter); list.setOnItemClickListener(new OnItemClickListener() { public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) { // TODO Auto-generated method stub System.out.println("Content ID: " + Content.content_id[Deskripsi.id]); Deskripsi.id = arg2; waitDialog = ProgressDialog.show(Content.this, "Memuat", "Harap tunggu, sedang terhubung dengan server"); waitDialog.setIcon(R.drawable.iconnya); waitDialog.show(); new LihatRatingTask().execute(); } }); } class LihatRatingTask extends AsyncTask<Void, Void, Void> { protected Void doInBackground(Void... Arg0) { Deskripsi.jsonRating = HTTPConnection.openUrl(HTTPConnection.host + "lihat_rating.php?content_id=" + Content.content_id[Deskripsi.id]); Deskripsi.jsonSubCategory = HTTPConnection .openUrl(HTTPConnection.host + "sub_catagory_parameter.php?content_id=" + Content.content_id[Deskripsi.id]); RoutePath.place = HTTPConnection .LoadImageFromWeb(HTTPConnection.host + "Logo/" + image[Integer.valueOf(catagory_id[Deskripsi.id]) - 1]); Intent i = new Intent(Content.this, Deskripsi.class); i.putExtra("des_lat", l_latitude); i.putExtra("des_long", l_longitude); startActivity(i); waitDialog.dismiss(); return null; } protected void onPostExecute(Void result) { // TODO Auto-generated method stub super.onPostExecute(result); waitDialog.dismiss(); } } } The result is in destination EditText in maps application for Android "null,null" How to make it "destination_latitude, destination_longitude"? Help me please.

    Read the article

  • Trouble Upgrading Rails 2 Routes for a Redmine Plugin

    - by user1858628
    I am trying to get a Redmine plugin designed for Rails 2 to work with Rails 3. https://github.com/dalyons/redmine-todos-scrum-plugin I've pretty much fixed most parts, but having no success whatsoever in getting the routes to work. The original routes for Rails 2 are as follows: map.resources :todos, :name_prefix => 'project_', :path_prefix => '/projects/:project_id', :member => {:toggle_complete => :post }, :collection => {:sort => :post} map.resources :todos, :name_prefix => 'user_', :path_prefix => '/users/:user_id', :controller => :mytodos, :member => {:toggle_complete => :post }, :collection => {:sort => :post} map.my_todos 'my/todos', :controller => :mytodos, :action => :index map.connect 'projects/:project_id/todos/show/:id', :controller => "todos", :action => "show" rake routes outputs the following: sort_project_todos POST /projects/:project_id/todos/sort(.:format) {:controller=>"todos", :action=>"sort"} project_todos GET /projects/:project_id/todos(.:format) {:controller=>"todos", :action=>"index"} POST /projects/:project_id/todos(.:format) {:controller=>"todos", :action=>"create"} new_project_todo GET /projects/:project_id/todos/new(.:format) {:controller=>"todos", :action=>"new"} toggle_complete_project_todo POST /projects/:project_id/todos/:id/toggle_complete(.:format) {:controller=>"todos", :action=>"toggle_complete"} edit_project_todo GET /projects/:project_id/todos/:id/edit(.:format) {:controller=>"todos", :action=>"edit"} project_todo GET /projects/:project_id/todos/:id(.:format) {:controller=>"todos", :action=>"show"} PUT /projects/:project_id/todos/:id(.:format) {:controller=>"todos", :action=>"update"} DELETE /projects/:project_id/todos/:id(.:format) {:controller=>"todos", :action=>"destroy"} sort_user_todos POST /users/:user_id/todos/sort(.:format) {:controller=>"mytodos", :action=>"sort"} user_todos GET /users/:user_id/todos(.:format) {:controller=>"mytodos", :action=>"index"} POST /users/:user_id/todos(.:format) {:controller=>"mytodos", :action=>"create"} new_user_todo GET /users/:user_id/todos/new(.:format) {:controller=>"mytodos", :action=>"new"} toggle_complete_user_todo POST /users/:user_id/todos/:id/toggle_complete(.:format) {:controller=>"mytodos", :action=>"toggle_complete"} edit_user_todo GET /users/:user_id/todos/:id/edit(.:format) {:controller=>"mytodos", :action=>"edit"} user_todo GET /users/:user_id/todos/:id(.:format) {:controller=>"mytodos", :action=>"show"} PUT /users/:user_id/todos/:id(.:format) {:controller=>"mytodos", :action=>"update"} DELETE /users/:user_id/todos/:id(.:format) {:controller=>"mytodos", :action=>"destroy"} my_todos /my/todos {:controller=>"mytodos", :action=>"index"} /projects/:project_id/todos/show/:id {:controller=>"todos", :action=>"show"} The nearest I have got for Rails 3 is follows: scope '/projects/:project_id', :name_prefix => 'project_' do resources :todos, :controller => 'todos' do member do post :toggle_complete end collection do post :sort end end end scope '/users/:user_id', :name_prefix => 'user_' do resources :todos, :controller => 'mytodos' do member do post :toggle_complete end collection do post :sort end end end match 'my/todos' => 'mytodos#index', :as => :my_todos match 'projects/:project_id/todos/show/:id' => 'todos#show' rake routes outputs the following: toggle_complete_todo POST /projects/:project_id/todos/:id/toggle_complete(.:format) todos#toggle_complete {:name_prefix=>"project_"} sort_todos POST /projects/:project_id/todos/sort(.:format) todos#sort {:name_prefix=>"project_"} todos GET /projects/:project_id/todos(.:format) todos#index {:name_prefix=>"project_"} POST /projects/:project_id/todos(.:format) todos#create {:name_prefix=>"project_"} new_todo GET /projects/:project_id/todos/new(.:format) todos#new {:name_prefix=>"project_"} edit_todo GET /projects/:project_id/todos/:id/edit(.:format) todos#edit {:name_prefix=>"project_"} todo GET /projects/:project_id/todos/:id(.:format) todos#show {:name_prefix=>"project_"} PUT /projects/:project_id/todos/:id(.:format) todos#update {:name_prefix=>"project_"} DELETE /projects/:project_id/todos/:id(.:format) todos#destroy {:name_prefix=>"project_"} POST /users/:user_id/todos/:id/toggle_complete(.:format) mytodos#toggle_complete {:name_prefix=>"user_"} POST /users/:user_id/todos/sort(.:format) mytodos#sort {:name_prefix=>"user_"} GET /users/:user_id/todos(.:format) mytodos#index {:name_prefix=>"user_"} POST /users/:user_id/todos(.:format) mytodos#create {:name_prefix=>"user_"} GET /users/:user_id/todos/new(.:format) mytodos#new {:name_prefix=>"user_"} GET /users/:user_id/todos/:id/edit(.:format) mytodos#edit {:name_prefix=>"user_"} GET /users/:user_id/todos/:id(.:format) mytodos#show {:name_prefix=>"user_"} PUT /users/:user_id/todos/:id(.:format) mytodos#update {:name_prefix=>"user_"} DELETE /users/:user_id/todos/:id(.:format) mytodos#destroy {:name_prefix=>"user_"} my_todos /my/todos(.:format) mytodos#index /projects/:project_id/todos/show/:id(.:format) todos#show I am guessing that I am not using :name_prefix correctly, resulting in duplicate paths which are then omitted. Any help would be greatly appreciated.

    Read the article

  • Can anyone tell me why my XML writer is not writing attributes?

    - by user1632018
    I am writing a parsing tool to help me clean up a large VC++ project before I make .net bindings for it. I am using an XML writer to read an xml file and write out each element to a new file. If an element with a certain name is found, then it executes some code and writes an output value into the elements value. So far it is almost working, except for one thing: It is not copying the attributes. Can anyone tell me why this is happening? Here is a sample of what it is supposed to copy/modify(Includes the attributes): <?xml version="1.0" encoding="utf-8"?> <Project DefaultTargets="Build" ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003"> <ItemGroup Label="ProjectConfigurations"> <ProjectConfiguration Include="Debug|Win32"> <Configuration>Debug</Configuration> <Platform>Win32</Platform> </ProjectConfiguration> <ProjectConfiguration Include="Release|Win32"> <Configuration>Release</Configuration> <Platform>Win32</Platform> </ProjectConfiguration> </ItemGroup> <PropertyGroup Label="Globals"> <ProjectGuid>{57900E99-A405-49F4-83B2-0254117D041B}</ProjectGuid> <Keyword>Win32Proj</Keyword> <RootNamespace>libproj</RootNamespace> </PropertyGroup> Here is the output I am getting(No Attributes): <?xml version="1.0" encoding="utf-8"?> <Project> <ItemGroup> <ProjectConfiguration> <Configuration>Debug</Configuration> <Platform>Win32</Platform> </ProjectConfiguration> <ProjectConfiguration> <Configuration>Release</Configuration> <Platform>Win32</Platform> </ProjectConfiguration> </ItemGroup> <PropertyGroup> <ProjectGuid>{57900E99-A405-49F4-83B2-0254117D041B}</ProjectGuid> <Keyword>Win32Proj</Keyword> <RootNamespace>libproj</RootNamespace> Here is my code currently. I have tried every way I can come up with to write the attributes. string baseDir = (textBox2.Text + "\\" + safeFileName); string vcName = Path.GetFileName(textBox1.Text); string vcProj = Path.Combine(baseDir, vcName); using (XmlReader reader = XmlReader.Create(textBox1.Text)) { XmlWriterSettings settings = new XmlWriterSettings(); settings.OmitXmlDeclaration = true; settings.ConformanceLevel = ConformanceLevel.Fragment; settings.Indent = true; settings.CloseOutput = false; using (XmlWriter writer = XmlWriter.Create(vcProj, settings)) { while (reader.Read()) { switch (reader.NodeType) { case XmlNodeType.Element: if (reader.Name == "ClInclude") { string include = reader.GetAttribute("Include"); string dirPath = Path.GetDirectoryName(textBox1.Text); Directory.SetCurrentDirectory(dirPath); string fullPath = Path.GetFullPath(include); //string dirPath = Path.GetDirectoryName(fullPath); copyFile(fullPath, 3); string filename = Path.GetFileName(fullPath); writer.WriteStartElement(reader.Name); writer.WriteAttributeString("Include", "include/" + filename); writer.WriteEndElement(); } else if (reader.Name == "ClCompile" && reader.HasAttributes) { string include = reader.GetAttribute("Include"); string dirPath = Path.GetDirectoryName(textBox1.Text); Directory.SetCurrentDirectory(dirPath); string fullPath = Path.GetFullPath(include); copyFile(fullPath, 2); string filename = Path.GetFileName(fullPath); writer.WriteStartElement(reader.Name); writer.WriteAttributeString("Include", "src/" + filename); writer.WriteEndElement(); } else { writer.WriteStartElement(reader.Name); } break; case XmlNodeType.Text: writer.WriteString(reader.Value); break; case XmlNodeType.XmlDeclaration: case XmlNodeType.ProcessingInstruction: writer.WriteProcessingInstruction(reader.Name, reader.Value); break; case XmlNodeType.Comment: writer.WriteComment(reader.Value); break; case XmlNodeType.Attribute: writer.WriteAttributes(reader, true); break; case XmlNodeType.EntityReference: writer.WriteEntityRef(reader.Value); break; case XmlNodeType.EndElement: writer.WriteFullEndElement(); break; } } } }

    Read the article

  • Swap image with jquery and show zoom image

    - by Neil Bradley
    Hi there, On my site I have 4 thumbnail product images that when clicked on swap the main image. This part is working okay. However, on the main image I'm also trying to use the jQZoom script. The zoom script works for the most part, except that the zoomed image always displays the zoom of the first image, rather than the one selected. This can be seen in action here; http://www.wearecapital.com/productdetails-new.asp?id=6626 I was wondering if someone might be able to suggest a solution? My code for the page is here; <% if session("qstring") = "" then session("qstring") = "&amp;rf=latest" maxProducts = 6 prodID = request("id") if prodID = "" or not isnumeric(prodid) then response.Redirect("listproducts.asp?err=1" & session("qstring")) else prodId = cint(prodId) end if SQL = "Select * from products,subcategories,labels where subcat_id = prod_subcategory and label_id = prod_label and prod_id = " & prodID set conn = server.CreateObject("ADODB.connection") conn.Open(Application("DATABASE")) set rs = conn.Execute(SQL) if rs.eof then ' product is not valid name = "Error - product id " & prodID & " is not available" else image1 = rs.fields("prod_image1") image1Desc = rs.fields("prod_image1Desc") icon = rs.fields("prod_icon") subcat = rs.fields("prod_subcategory") image2 = rs.fields("prod_image2") image2Desc = rs.fields("prod_image2Desc") image3 = rs.fields("prod_image3") image3Desc = rs.fields("prod_image3Desc") image4 = rs.fields("prod_image4") image4Desc = rs.fields("prod_image4Desc") zoomimg = rs.Fields("prod_zoomimg") zoomimg2 = rs.Fields("prod_zoomimg2") zoomimg3 = rs.Fields("prod_zoomimg3") zoomimg4 = rs.Fields("prod_zoomimg4") thumb1 = rs.fields("prod_preview1").value thumb2 = rs.fields("prod_preview2").value thumb3 = rs.fields("prod_preview3").value thumb4 = rs.fields("prod_preview4").value end if set rs = nothing conn.Close set conn = nothing %> <!-- #include virtual="/includes/head-product.asp" --> <body id="detail"> <!-- #include virtual="/includes/header.asp" --> <script type="text/javascript" language="javascript"> function switchImg(imgName) { var ImgX = document.getElementById("mainimg"); ImgX.src="/images/products/" + imgName; } </script> <script type="text/javascript"> $(document).ready(function(){ var options = { zoomWidth: 466, zoomHeight: 260, xOffset: 34, yOffset: 0, title: false, position: "right" //and MORE OPTIONS }; $(".MYCLASS").jqzoom(options); }); </script> <!-- #include virtual="/includes/nav.asp" --> <div id="column-left"> <div id="main-image"> <% if oldie = false then %><a href="/images/products/<%=zoomimg%>" class="MYCLASS" title="MYTITLE"><img src="/images/products/<%=image1%>" title="IMAGE TITLE" name="mainimg" id="mainimg" style="width:425px; height:638px;" ></a><% end if %> </div> </div> <div id="column-right"> <div id="altviews"> <h3 class="altviews">Alternative Views</h3> <ul> <% if oldie = false then writeThumb thumb1,image1,zoomimg,image1desc writeThumb thumb2,image2,zoomimg2,image2desc writeThumb thumb3,image3,zoomimg3,image3desc writeThumb thumb4,image4,zoomimg4,image4desc end if %> </ul> </div> </div> <!-- #include virtual="/includes/footer-test.asp" --> <% sub writeThumb(thumbfile, imgfile, zoomfile, thumbdesc) response.Write "<li>" if thumbfile <> "65/default_preview.jpg" and thumbfile <> "" and not isnull(thumbfile) then if imgFile <> "" and not isnull(imgfile) then rimgfile = replace(imgfile,"/","//") else rimgfile = "" if thumbdesc <> "" and not isnull(thumbdesc) then rDescription = replace(thumbdesc,"""","&quot;") else rDescription = "" response.write "<img src=""/images/products/"& thumbfile &""" style=""cursor: pointer"" border=""0"" style=""width:65px; height:98px;"" title="""& rDescription &""" onclick=""switchImg('" & rimgfile & "')"" />" & vbcrlf else response.write "<img src=""/images/products/65/default_preview.jpg"" alt="""" />" & vbCrLF end if response.write "</li>" & vbCrLF end sub %>

    Read the article

  • action script on behalf of xml problem.

    - by sabuj
    import fl.transitions.easing.; import fl.transitions.; var xml:XML; var xmlList:XMLList; var xmlLoader:URLLoader = new URLLoader (); var productLoader:URLLoader = new URLLoader(); var imageLoader:Loader; var bigImage:Loader = new Loader(); var imageText:TextField = new TextField(); xmlLoader.load(new URLRequest("http://localhost/shopmajik/flash/shopdata")); xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded); function xmlLoaded(e:Event):void { xml=new XML(e.target.data); XML.ignoreWhitespace = true; xmlList = xml.children(); trace(xmlList); imageLoader = new Loader(); imageLoader.load(new URLRequest(xmlList.elements("shopbanner").attribute("src"))); imageLoader.x = -220; imageLoader.y = -187; addChild(imageLoader); } imgLoader.alpha = 0; textLoader.alpha = 0; imgLoader2.alpha = 0; imgLoader3.alpha = 0; imgLoader4.alpha = 0; imgLoader5.alpha = 0; //Item button is working here... btnProduct.addEventListener(MouseEvent.CLICK, showProduct); function showProduct(event:Event):void { imgLoader.alpha = 0; textLoader.alpha = 0; imgLoader3.alpha = 0; imgLoader4.alpha = 0; imgLoader5.alpha = 0; imgLoader2.alpha = 0; var productLoader:URLLoader = new URLLoader(); productLoader.load(new URLRequest("http://localhost/shopmajik/flash/productdata")); productLoader.addEventListener(Event.COMPLETE , onProductLoad); function onProductLoad(e:Event):void { var productLoader:XML = new XML(e.target.data); xmlList = productLoader.children(); textLoader.text = xmlList.elements("productname"); textLoader.alpha =0; } } //Item button is working here... btnItem.addEventListener(MouseEvent.CLICK, showItem); //btnItem.addEventListener(Event:event, showItem); function showItem(event:Event):void { imgLoader.alpha =0; textLoader.alpha=0; imgLoader3.alpha=0; imgLoader4.alpha=0; imgLoader5.alpha=0; imgLoader2.alpha=0; var itemLoader:URLLoader = new URLLoader(); itemLoader.load(new URLRequest("http://localhost/shopmajik/flash/productdata")); itemLoader.addEventListener(Event.COMPLETE , onItemLoad); function onItemLoad(e:Event):void { var myLoader:XML = new XML(e.target.data); xmlList = myLoader.children(); textLoader.text = xmlList.elements("productname"); textLoader.alpha =0; } } //Details button workings... btnDetails.addEventListener(MouseEvent.CLICK, showDetails); function showDetails(event:Event):void { imgLoader.alpha=0; textLoader.alpha=0; imgLoader3.alpha=0; imgLoader4.alpha=0; imgLoader5.alpha=0; imgLoader2.alpha=0; var detailsLoader:URLLoader = new URLLoader(); detailsLoader.load(new URLRequest("http://localhost/shopmajik/flash/productdata")); detailsLoader.addEventListener(Event.COMPLETE , onDetailsLoad); function onDetailsLoad(e:Event):void { var myLoader:XML = new XML(e.target.data); xmlList = myLoader.children(); textLoader.text = xmlList.elements("productdescription"); textLoader.alpha =0; } } btnImages.addEventListener(MouseEvent.CLICK, showImages); function showImages(event:Event):void { textLoader.alpha=0; textLoader.text=""; imgLoader2.alpha= 1; var imagesLoader:URLLoader = new URLLoader(); imagesLoader.load(new URLRequest("http://localhost/shopmajik/flash/productdata")); imagesLoader.addEventListener(Event.COMPLETE , onImagesLoad); function onImagesLoad(e:Event):void { var xml:XML = new XML(e.target.data); xmlList = xml.children(); imgLoader2.x=-155; imgLoader2.y= -50; imgLoader2.load(new URLRequest(xmlList.elements("productimage").attribute("src"))); } } btnPay.addEventListener(MouseEvent.CLICK , showPage); function showPage(e:MouseEvent):void { navigateToURL(new URLRequest("https://www.paypal.com/")); } This is the source code. It works very fine in locally. But in server it shows the bellow error ---- TypeError: Error #1088: The markup in the document following the root element must be well-formed. at bgfin_fla::Main_1/xmlLoaded() at flash.events::EventDispatcher/dispatchEventFunction() at flash.events::EventDispatcher/dispatchEvent() at flash.net::URLLoader/onComplete() someone please show me the path. How i should go over this?

    Read the article

  • Image loader cant load my live image url

    - by Bindhu
    In my application i need to load the images in list view, when using locale(ip ported url) then no problem all images are loading properly, But when using live url then the images are not loading, My image loader class: public class ImageLoader { MemoryCache memoryCache = new MemoryCache(); FileCache fileCache; private Map<ImageView, String> imageViews = Collections .synchronizedMap(new WeakHashMap<ImageView, String>()); ExecutorService executorService; public ImageLoader(Context context) { fileCache = new FileCache(context); executorService = Executors.newFixedThreadPool(5); } final int stub_id = R.drawable.appointeesample; public void DisplayImage(String url, ImageView imageView) { imageViews.put(imageView, url); Bitmap bitmap = memoryCache.get(url); if (bitmap != null) imageView.setImageBitmap(bitmap); else { Log.d("stub", "stub" + stub_id); queuePhoto(url, imageView); imageView.setImageResource(stub_id); } } private void queuePhoto(String url, ImageView imageView) { PhotoToLoad p = new PhotoToLoad(url, imageView); executorService.submit(new PhotosLoader(p)); } private Bitmap getBitmap(String url) { File f = fileCache.getFile(url); // from SD cache Bitmap b = decodeFile(f); if (b != null) return b; // from web try { Bitmap bitmap = null; URL imageUrl = new URL(url); HttpURLConnection conn = (HttpURLConnection) imageUrl .openConnection(); conn.setConnectTimeout(30000); conn.setReadTimeout(30000); conn.setInstanceFollowRedirects(true); InputStream is = conn.getInputStream(); BufferedInputStream bis = new BufferedInputStream(is, 81960); BitmapFactory.Options opts = new BitmapFactory.Options(); opts.inJustDecodeBounds = true; OutputStream os = new FileOutputStream(f); Utils.CopyStream(bis, os); os.close(); bitmap = decodeFile(f); Log.d("bitmap", "Bit map" + bitmap); return bitmap; } catch (Exception ex) { ex.printStackTrace(); return null; } } // decodes image and scales it to reduce memory consumption private Bitmap decodeFile(File f) { try { try { BitmapFactory.Options o = new BitmapFactory.Options(); o.inJustDecodeBounds = true; BitmapFactory.decodeStream(new FileInputStream(f), null, o); final int REQUIRED_SIZE = 200; int scale = 1; while (o.outWidth / scale / 2 >= REQUIRED_SIZE && o.outHeight / scale / 2 >= REQUIRED_SIZE) scale *= 2; BitmapFactory.Options o2 = new BitmapFactory.Options(); o2.inSampleSize = scale; return BitmapFactory.decodeStream(new FileInputStream(f), null, o2); } catch (FileNotFoundException e) { } finally { System.gc(); } return null; } catch (Exception e) { } return null; } // Task for the queue private class PhotoToLoad { public String url; public ImageView imageView; public PhotoToLoad(String u, ImageView i) { url = u; imageView = i; } } class PhotosLoader implements Runnable { PhotoToLoad photoToLoad; PhotosLoader(PhotoToLoad photoToLoad) { this.photoToLoad = photoToLoad; } @Override public void run() { if (imageViewReused(photoToLoad)) return; Bitmap bmp = getBitmap(photoToLoad.url); memoryCache.put(photoToLoad.url, bmp); if (imageViewReused(photoToLoad)) return; BitmapDisplayer bd = new BitmapDisplayer(bmp, photoToLoad); Activity a = (Activity) photoToLoad.imageView.getContext(); a.runOnUiThread(bd); } } boolean imageViewReused(PhotoToLoad photoToLoad) { String tag = imageViews.get(photoToLoad.imageView); if (tag == null || !tag.equals(photoToLoad.url)) return true; return false; } // Used to display bitmap in the UI thread class BitmapDisplayer implements Runnable { Bitmap bitmap; PhotoToLoad photoToLoad; public BitmapDisplayer(Bitmap b, PhotoToLoad p) { bitmap = b; photoToLoad = p; } public void run() { if (imageViewReused(photoToLoad)) return; if (bitmap != null) photoToLoad.imageView.setImageBitmap(bitmap); else photoToLoad.imageView.setImageResource(stub_id); } } public void clearCache() { memoryCache.clear(); fileCache.clear(); } My Live Image url for Example: https://goappointed.com/images_upload/3330Torana_Logo.JPG I have referred google but no solution is working, Thanks a lot in advance.

    Read the article

  • Android Video Camera : still picture

    - by Alex
    I use the camera intent to capture video. Here is the problem: If I use this line of code, I can record video. But onActivityResult doesn't work. Intent intent = new Intent("android.media.action.VIDEO_CAMERA"); If I use this line of code, after press the recording button, the camera is freezed, I mean, the picture is still. Intent intent = new Intent(MediaStore.ACTION_VIDEO_CAPTURE); BTW, when I use $Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE); to capture a picture, it works fine. The java file is as follows: package com.camera.picture; import java.io.File; import java.text.SimpleDateFormat; import java.util.Date; import android.app.Activity; import android.content.ContentValues; import android.content.Intent; import android.net.Uri; import android.os.Bundle; import android.os.Environment; import android.provider.MediaStore; import android.util.Log; import android.view.View; import android.widget.Button; import android.widget.ImageView; import android.widget.Toast; import android.widget.VideoView; public class PictureCameraActivity extends Activity { private static final int IMAGE_CAPTURE = 0; private static final int VIDEO_CAPTURE = 1; private Button startBtn; private Button videoBtn; private Uri imageUri; private Uri videoUri; private ImageView imageView; private VideoView videoView; /** Called when the activity is first created. * sets the content and gets the references to * the basic widgets on the screen like * {@code Button} or {@link ImageView} */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); imageView = (ImageView)findViewById(R.id.img); videoView = (VideoView)findViewById(R.id.videoView); startBtn = (Button) findViewById(R.id.startBtn); startBtn.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { startCamera(); } }); videoBtn = (Button) findViewById(R.id.videoBtn); videoBtn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub startVideoCamera(); } }); } public void startCamera() { Log.d("ANDRO_CAMERA", "Starting camera on the phone..."); String fileName = "testphoto.jpg"; ContentValues values = new ContentValues(); values.put(MediaStore.Images.Media.TITLE, fileName); values.put(MediaStore.Images.Media.DESCRIPTION, "Image capture by camera"); values.put(MediaStore.Images.Media.MIME_TYPE, "image/jpeg"); imageUri = getContentResolver().insert( MediaStore.Images.Media.EXTERNAL_CONTENT_URI, values); Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE); intent.putExtra(MediaStore.EXTRA_OUTPUT, imageUri); intent.putExtra(MediaStore.EXTRA_VIDEO_QUALITY, 1); startActivityForResult(intent, IMAGE_CAPTURE); } protected void onActivityResult(int requestCode, int resultCode, Intent data) { if (requestCode == IMAGE_CAPTURE) { if (resultCode == RESULT_OK){ Log.d("ANDROID_CAMERA","Picture taken!!!"); imageView.setImageURI(imageUri); } } if (requestCode == VIDEO_CAPTURE) { if (resultCode == RESULT_OK) { Log.d("ANDROID_CAMERA","Video taken!!!"); Toast.makeText(this, "Video saved to:\n" + data.getData(), Toast.LENGTH_LONG).show(); videoView.setVideoURI(videoUri); } } } private void startVideoCamera() { // TODO Auto-generated method stub //create new Intent Log.d("ANDRO_CAMERA", "Starting camera on the phone..."); String fileName = "testvideo.mp4"; ContentValues values = new ContentValues(); values.put(MediaStore.Video.Media.TITLE, fileName); values.put(MediaStore.Video.Media.DESCRIPTION, "Video captured by camera"); values.put(MediaStore.Video.Media.MIME_TYPE, "video/mp4"); videoUri = getContentResolver().insert( MediaStore.Video.Media.EXTERNAL_CONTENT_URI, values); Intent intent = new Intent("android.media.action.VIDEO_CAMERA"); //Intent intent = new Intent(MediaStore.ACTION_VIDEO_CAPTURE); intent.putExtra(MediaStore.EXTRA_OUTPUT, videoUri); intent.putExtra(MediaStore.EXTRA_VIDEO_QUALITY, 1); // start the Video Capture Intent startActivityForResult(intent, VIDEO_CAPTURE); } private static File getOutputMediaFile() { // TODO Auto-generated method stub // To be safe, you should check that the SDCard is mounted // using Environment.getExternalStorageState() before doing this. File mediaStorageDir = new File(Environment.getExternalStoragePublicDirectory( Environment.DIRECTORY_PICTURES), "MyCameraApp"); // This location works best if you want the created images to be shared // between applications and persist after your app has been uninstalled. // Create the storage directory if it does not exist if (! mediaStorageDir.exists()){ if (! mediaStorageDir.mkdirs()){ Log.d("MyCameraApp", "failed to create directory"); return null; } } // Create a media file name String timeStamp = new SimpleDateFormat("yyyyMMdd_HHmmss").format(new Date()); File mediaFile; mediaFile = new File(mediaStorageDir.getPath() + File.separator + "VID_"+ timeStamp + ".mp4"); return mediaFile; } /** Create a file Uri for saving an image or video */ private static Uri getOutputMediaFileUri(){ return Uri.fromFile(getOutputMediaFile()); } }

    Read the article

  • C++ Program performs better when piped

    - by ET1 Nerd
    I haven't done any programming in a decade. I wanted to get back into it, so I made this little pointless program as practice. The easiest way to describe what it does is with output of my --help codeblock: ./prng_bench --help ./prng_bench: usage: ./prng_bench $N $B [$T] This program will generate an N digit base(B) random number until all N digits are the same. Once a repeating N digit base(B) number is found, the following statistics are displayed: -Decimal value of all N digits. -Time & number of tries taken to randomly find. Optionally, this process is repeated T times. When running multiple repititions, averages for all N digit base(B) numbers are displayed at the end, as well as total time and total tries. My "problem" is that when the problem is "easy", say a 3 digit base 10 number, and I have it do a large number of passes the "total time" is less when piped to grep. ie: command ; command |grep took : ./prng_bench 3 10 999999 ; ./prng_bench 3 10 999999|grep took .... Pass# 999999: All 3 base(10) digits = 3 base(10). Time: 0.00005 secs. Tries: 23 It took 191.86701 secs & 99947208 tries to find 999999 repeating 3 digit base(10) numbers. An average of 0.00019 secs & 99 tries was needed to find each one. It took 159.32355 secs & 99947208 tries to find 999999 repeating 3 digit base(10) numbers. If I run the same command many times w/o grep time is always VERY close. I'm using srand(1234) for now, to test. The code between my calls to clock_gettime() for start and stop do not involve any stream manipulation, which would obviously affect time. I realize this is an exercise in futility, but I'd like to know why it behaves this way. Below is heart of the program. Here's a link to the full source on DB if anybody wants to compile and test. https://www.dropbox.com/s/6olqnnjf3unkm2m/prng_bench.cpp clock_gettime() requires -lrt. for (int pass_num=1; pass_num<=passes; pass_num++) { //Executes $passes # of times. clock_gettime(CLOCK_PROCESS_CPUTIME_ID, &temp_time); //get time start_time = timetodouble(temp_time); //convert time to double, store as start_time for(i=1, tries=0; i!=0; tries++) { //loops until 'comparison for' fully completes. counts reps as 'tries'. <------------ for (i=0; i<Ndigits; i++) //Move forward through array. | results[i]=(rand()%base); //assign random num of base to element (digit). | /*for (i=0; i<Ndigits; i++) //---Debug Lines--------------- | std::cout<<" "<<results[i]; //---a LOT of output.---------- | std::cout << "\n"; //---Comment/decoment to disable/enable.*/ // | for (i=Ndigits-1; i>0 && results[i]==results[0]; i--); //Move through array, != element breaks & i!=0, new digits drawn. -| } //If all are equal i will be 0, nested for condition satisfied. -| clock_gettime(CLOCK_PROCESS_CPUTIME_ID, &temp_time); //get time draw_time = (timetodouble(temp_time) - start_time); //convert time to dbl, subtract start_time, set draw_time to diff. total_time += draw_time; //add time for this pass to total. total_tries += tries; //add tries for this pass to total. /*Formated output for each pass: Pass# ---: All -- base(--) digits = -- base(10) Time: ----.---- secs. Tries: ----- (LINE) */ std::cout<<"Pass# "<<std::setw(width_pass)<<pass_num<<": All "<<Ndigits<<" base("<<base<<") digits = " <<std::setw(width_base)<<results[0]<<" base(10). Time: "<<std::setw(width_time)<<draw_time <<" secs. Tries: "<<tries<<"\n"; } if(passes==1) return 0; //No need for totals and averages of 1 pass. /* It took ----.---- secs & ------ tries to find --- repeating -- digit base(--) numbers. (LINE) An average of ---.---- secs & ---- tries was needed to find each one. (LINE)(LINE) */ std::cout<<"It took "<<total_time<<" secs & "<<total_tries<<" tries to find " <<passes<<" repeating "<<Ndigits<<" digit base("<<base<<") numbers.\n" <<"An average of "<<total_time/passes<<" secs & "<<total_tries/passes <<" tries was needed to find each one. \n\n"; return 0;

    Read the article

  • Parsing csv line to Java objects

    - by Noobling
    I was wondering if someone here could help me, I can't find a solution for my problem and I have tried everything. What I am trying to do is read and parse lines in a csv file into java objects and I have succeeded in doing that but after it reads all the lines it should insert the lines into the database but it only inserts the 1st line the entire time and I don't no why. When I do a print it shows that it is reading all the lines and placing them in the objects but as soon as I do the insert it wants to insert only the 1st line. Please see my code below: public boolean lineReader(File file){ BufferedReader br = null; String line= ""; String splitBy = ","; storeList = new ArrayList<StoreFile>(); try { br = new BufferedReader(new FileReader(file)); while((line = br.readLine())!=null){ line = line.replace('|', ','); //split on pipe ( | ) String[] array = line.split(splitBy, 14); //Add values from csv to store object //Add values from csv to storeF objects StoreFile StoreF = new StoreFile(); if (array[0].equals("H") || array[0].equals("T")) { return false; } else { StoreF.setRetailID(array[1].replaceAll("/", "")); StoreF.setChain(array[2].replaceAll("/","")); StoreF.setStoreID(array[3].replaceAll("/", "")); StoreF.setStoreName(array[4].replaceAll("/", "")); StoreF.setAddress1(array[5].replaceAll("/", "")); StoreF.setAddress2(array[6].replaceAll("/", "")); StoreF.setAddress3(array[7].replaceAll("/", "")); StoreF.setProvince(array[8].replaceAll("/", "")); StoreF.setAddress4(array[9].replaceAll("/", "")); StoreF.setCountry(array[10].replaceAll("/", "")); StoreF.setCurrency(array[11].replaceAll("/", "")); StoreF.setAddress5(array[12].replaceAll("/", "")); StoreF.setTelNo(array[13].replaceAll("/", "")); //Add stores to list storeList.add(StoreF); } } //print list stores in file printStoreList(storeList); executeStoredPro(storeList); } catch (Exception ex) { nmtbatchservice.NMTBatchService2.LOG.error("An exception accoured: " + ex.getMessage(), ex); //copy to error folder //email } return false; } public void printStoreList(List<StoreFile> storeListToPrint) { for(int i = 0; i <storeListToPrint.size();i++){ System.out.println( storeListToPrint.get(i).getRetailID() + storeListToPrint.get(i).getChain() + storeListToPrint.get(i).getStoreID() + storeListToPrint.get(i).getStoreName() + storeListToPrint.get(i).getAddress1() + storeListToPrint.get(i).getAddress2() + storeListToPrint.get(i).getAddress3() + storeListToPrint.get(i).getProvince() + storeListToPrint.get(i).getAddress4() + storeListToPrint.get(i).getCountry() + storeListToPrint.get(i).getCurrency() + storeListToPrint.get(i).getAddress5() + storeListToPrint.get(i).getTelNo()); } } public void unzip(String source, String destination) { try { ZipFile zipFile = new ZipFile(source); zipFile.extractAll(destination); deleteStoreFile(source); } catch (ZipException ex) { nmtbatchservice.NMTBatchService2.LOG.error("Error unzipping file : " + ex.getMessage(), ex); } } public void deleteStoreFile(String directory) { try { File file = new File(directory); file.delete(); } catch (Exception ex) { nmtbatchservice.NMTBatchService2.LOG.error("An exception accoured when trying to delete file " + directory + " : " + ex.getMessage(), ex); } } public void executeStoredPro(List<StoreFile> storeListToInsert) { Connection con = null; CallableStatement st = null; try { String connectionURL = MSSQLConnectionURL; Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver").newInstance(); con = DriverManager.getConnection(connectionURL, MSSQLUsername, MSSQLPassword); for(int i = 0; i <storeListToInsert.size();i++){ st = con.prepareCall( "IF EXISTS (SELECT * FROM tblPay@RetailStores WHERE StoreID = " + storeListToInsert.get(i).getStoreID() + " AND RetailID = "+ storeListToInsert.get(i).getRetailID() + ")" + " UPDATE tblPay@RetailStores " + " SET RetailID = '" + storeListToInsert.get(i).getRetailID() + "'," + " StoreID = '" + storeListToInsert.get(i).getStoreID() + "'," + " StoreName = '" + storeListToInsert.get(i).getStoreName() + "'," + " TestStore = 0," + " Address1 = '" + storeListToInsert.get(i).getAddress1() + "'," + " Address2 = '" + storeListToInsert.get(i).getAddress2() + "'," + " Address3 = '" + storeListToInsert.get(i).getAddress3() + "'," + " Address4 = '" + storeListToInsert.get(i).getAddress4() + "'," + " Address5 = '" + storeListToInsert.get(i).getAddress5() + "'," + " Province = '" + storeListToInsert.get(i).getProvince() + "'," + " TelNo = '" + storeListToInsert.get(i).getTelNo() + "'," + " Enabled = 1" + " ELSE " + " INSERT INTO tblPay@RetailStores ( [RetailID], [StoreID], [StoreName], [TestStore], [Address1], [Address2], [Address3], [Address4], [Address5], [Province], [TelNo] , [Enabled] ) " + " VALUES " + "('" + storeListToInsert.get(i).getRetailID() + "'," + "'" + storeListToInsert.get(i).getStoreID() + "'," + "'" + storeListToInsert.get(i).getStoreName() + "'," + "0," + "'" + storeListToInsert.get(i).getAddress1() + "'," + "'" + storeListToInsert.get(i).getAddress2() + "'," + "'" + storeListToInsert.get(i).getAddress3() + "'," + "'" + storeListToInsert.get(i).getAddress4() + "'," + "'" + storeListToInsert.get(i).getAddress5() + "'," + "'" + storeListToInsert.get(i).getProvince() + "'," + "'" + storeListToInsert.get(i).getTelNo() + "'," + "1)"); st.executeUpdate(); } con.close(); } catch (Exception ex) { nmtbatchservice.NMTBatchService2.LOG.error("Error executing Stored proc with error : " + ex.getMessage(), ex); nmtbatchservice.NMTBatchService2.mailingQueue.addToQueue(new Mail("[email protected]", "Service Email Error", "An error occurred during Store Import failed with error : " + ex.getMessage())); } } Any advise would be appreciated. Thanks

    Read the article

  • z index background issue in IE

    - by Michael
    I have a jQuery tools scroller set up with controls managing two separate divs of info - one images, the other related text that needs to sit over the top of the images with a transparent bg image. I am using z-indexing to achieve this and am aware of IE's issues with this but am unable to sort it (tested in IE6-8). Image of the issue below: http://test.shakingpaper.com.au/not_working.png It seems that the overlayed div is taking on the containers white. Try as I might, I can't resolve this. HTML/CSS code below: <div id="content"> <div id="nav"></div> <div class="s4 slideshow"> <div> <img src="<?php bloginfo('stylesheet_directory'); ?>/images/hero_1_white.jpg" width="770" height="367" /> </div> <div> <img src="<?php bloginfo('stylesheet_directory'); ?>/images/hero_1_white.jpg" width="770" height="367" /> </div> <div> <img src="<?php bloginfo('stylesheet_directory'); ?>/images/hero_1_white.jpg" width="770" height="367" /> </div> </div> <div id="overlay_bg"></div> <div class="s4 information"> <div> <h1>Support</h1> <p>Quisque lacus quam, egestas ac tincidunt a, lacinia vel velit. Aenean facilisis nulla vitae.</p> <p><a href="#">Support Us</a></p> </div> <div> <h1>Events</h1> <p>Quisque lacegestas ac tincidunt a, lacinia vel velit. Aenean facilisis nulla vitae.</p> <p><a href="#">Read More</a></p> </div> <div> <h1>Regional</h1> <p>Quisque lacus quam, egestas ac tincidunt a, lacinia vel velit. Aenean facilisis nulla vitae.</p> <p><a href="#">Support Us</a></p> </div> </div> </div> <!-- end of content --> #content { height: auto; min-height: 300px !important; overflow: hidden; position:relative; margin-left: 27px; width: 770px; padding-bottom: 43px; } #nav { width: 60px; z-index: 10000; position: absolute; top:340px; left: 28px; } .s4 { width: 770px; height: 370px; overflow: hidden; } #nav a { background-color: transparent; background-image: url(images/transition.png); background-position: 0 0; text-indent: -1000em; width: 10px; height: 10px; display: block; float: left; margin-right: 5px; } #nav a.activeSlide { background-position: 0 -10px; } #overlay_bg { background: url(images/soild_block.png) no-repeat; width: 318px; height: 339px; z-index: 5000; position: absolute; top: 28px; } .information { position: absolute; top: 60px; left: 28px; z-index: 16000; width: 290px; height: 260px; color: #FFF; } .information h1 { font-size: 50px; font-style: italic; text-transform: uppercase; } .information p { font-size: 17px; line-height: 27px; margin-top: 37px; } .information a { font-size: 13px; padding-bottom: 2px; border-bottom: 1px solid; color: #FFF; text-transform: uppercase; font-style: italic; } .information a:hover { color: #000; } Any help would be greatly appreciated.

    Read the article

  • CSS: Centering a floated block level element in IE6 (It almost works)

    - by Louis W
    I have a block level element which I am centering on the page. I have gotten it to work for all other browsers except IE6 where it ALMOST works. http://tinyurl.com/28sh9eq If I view the page in IE6 the red box is slightly off center of the pink one in IE. If I then resize the browser window it snaps into place where I want it. Uhhhhh.... yea.... what gives? How come resizing the window makes it work? I have also tried setting an explicit width on the wrapper with no avail. <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=7" /> <style type="text/css"> BODY { text-align: center; font-family: Arial; } .row_wrap { height: 100px; margin-bottom: 30px; background-color: pink; } .row { float: right; position: relative; left: -50%; text-align: left; clear: both; } .button1 { color: #FFF; height: 36px; text-decoration: none; position: relative; padding: 0 30px; background: url('button.gif') no-repeat 0 0; display: block; float: left; left: 50%; } .button1 .end { width: 20px; height: 37px; position: absolute; right: -2px; top: 0; background: url('button.gif') no-repeat right 0; } .button1 .text { font-size: 16px; font-weight: bold; white-space: nowrap; height: 36px; padding-top: 7px; display: block; float: left; } .button1 .text .arrow { vertical-align: 1px; } </style> </head> <body> <h2>RTL: Button 1</h2> <div class="row_wrap"> <div class="row" dir="rtl"> <a href="#" class="button1"> <span class="end"></span> <span class="text"><span class="arrow">»</span> Hello 1.</span> </a> </div> </div> <h2>RTL: Button 1-2</h2> <div class="row_wrap" style="width: 400px;"> <div class="row" dir="rtl"> <a href="#" class="button1"> <span class="end"></span> <span class="text"><span class="arrow">»</span> Hello 1.</span> </a> </div> </div> <br/><br/> <h2>Normal: Button 1</h2> <div class="row_wrap"> <div class="row"> <a href="#" class="button1"> <span class="end"></span> <span class="text"><span class="arrow">»</span> Hello.</span> </a> </div> </div> </body> Thanks for your help.

    Read the article

  • Does this language feature already exist?

    - by Pindatjuh
    I'm currently developing a new language for programming in a continuous environment (compare it to electrical engineering), and I've got some ideas on a certain language construction. Let me explain the feature by explanation and then by definition: x = a U b; Where x is a variable and a and b are other variables (or static values). This works like a union between a and b; no duplicates and no specific order. with(x) { // regular 'with' usage; using the global interpretation of "x" x = 5; // will replace the original definition of "x = a U b;" } with(x = a) { // this code block is executed when the "x" variable // has the "a" variable assigned. All references in // this code-block to "x" are references to "a". So saying: x = 5; // would only change the variable "a". If the variable "a" // later on changes, x still equals to 5, in this fashion: // 'x = a U b U 5;' // '[currentscope] = 5;' // thus, 'a = 5;' } with(x = b) { // same but with "b" } with(x != a) { // here the "x" variable refers to any variable // but "a"; thus saying x = 5; // is equal to the rewriting of // 'x = a U b U 5;' // 'b = 5;' (since it was the scope of this block) } with(x = (a U b)) { // guaranteed that "x" is 'a U b'; interacting with "x" // will interact with both "a" and "b". x = 5; // makes both "a" and "b" equal to 5; also the "x" variable // is updated to contain: // 'x = a U b U 5;' // '[currentscope] = 5;' // 'a U b = 5;' // and thus: 'a = 5; b = 5;'. } // etc. In the above, all code-blocks are executed, but the "scope" changes in each block how x is interpreted. In the first block, x is guaranteed to be a: thus interacting with x inside that block will interact on a. The second and the third code-block are only equal in this situation (because not a: then there only remains b). The last block guarantees that x is at least a or b. Further more; U is not the "bitwise or operator", but I've called it the "and/or"-operator. Its definition is: "U" = "and" U "or" (On my blog, http://cplang.wordpress.com/2009/12/19/binop-and-or/, there is more (mathematical) background information on this operator. It's loosely based on sets. Using different syntax, changed it in this question.) Update: more examples. print = "Hello world!" U "How are you?"; // this will print // both values, but the // order doesn't matter. // 'userkey' is a variable containing a key. with(userkey = "a") { print = userkey; // will only print "a". } with(userkey = ("shift" U "a")) { // pressed both "shift" and the "a" key. print = userkey; // will "print" shift and "a", even // if the user also pressed "ctrl": // the interpretation of "userkey" is changed, // such that it only contains the matched cases. } with((userkey = "shift") U (userkey = "a")) { // same as if-statement above this one, showing the distributivity. } x = 5 U 6 U 7; y = x + x; // will be: // y = (5 U 6 U 7) + (5 U 6 U 7) // = 10 U 11 U 12 U 13 U 14 somewantedkey = "ctrl" U "alt" U "space" with(userkey = somewantedkey) { // must match all elements of "somewantedkey" // (distributed the Boolean equals operated) // thus only executed when all the defined keys are pressed } with(somewantedkey = userkey) { // matches only one of the provided "somewantedkey" // thus when only "space" is pressed, this block is executed. } Update2: more examples and some more context. with(x = (a U b)) { // this } // can be written as with((x = a) U (x = b)) { // this: changing the variable like x = 5; // will be rewritten as: // a = 5 and b = 5 } Some background information: I'm building a language which is "time-independent", like Java is "platform-independant". Everything stated in the language is "as is", and is continuously actively executed. This means; the programmer does not know in which order (unless explicitly stated using constructions) elements are, nor when statements are executed. The language is completely separated from the "time"-concept, i.e. it's continuously executed: with(a < 5) { a++; } // this is a loop-structure; // how and when it's executed isn't known however. with(a) { // everytime the "a" variable changes, this code-block is executed. b = 4; with(b < 3) { // runs only three times. } with(b > 0) { b = b - 1; // runs four times } } Update 3: After pondering on the type of this language feature; it closely resemblances Netbeans Platform's Lookup, where each "with"-statement a synchronized agent is, working on it's specific "filter" of objects. Instead of type-based, this is variable-based (fundamentally quite the same; just a different way of identifiying objects). I greatly thank all of you for providing me with very insightful information and links/hints to great topics I can research. Thanks. I do not know if this construction already exists, so that's my question: does this language feature already exist?

    Read the article

  • Adding java source (.java files) to test jar in Maven

    - by user320550
    Hi all, I'm making use of my pom.xml and am was able to generate the jar for src/main/java (say app.jar) as well as for src/test/java (say app-test.jar). I was also able to include my java sources as part of the app.jar (i.e. have both my .class as well as my .java files in the jar). However for my app-test.jar, i'm not able to include my .java files in it. This is my pom.xml: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>com.mycompany.app</groupId> <artifactId>my-app</artifactId> <version>1.0-SNAPSHOT</version> <packaging>jar</packaging> <name>my-app</name> <url>http://maven.apache.org</url> <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> </properties> <dependencies> <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId> <version>3.8.1</version> <scope>test</scope> </dependency> </dependencies> <build> <resources> <resource> <directory>src/main/java</directory> </resource> </resources> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-jar-plugin</artifactId> <version>2.3.1</version> <executions> <execution> <phase>package</phase> <goals> <goal>test-jar</goal> </goals> <configuration> <includes> <include>src/test/java</include> </includes> </configuration> </execution> </executions> </plugin> </plugins> </build> </project> Any help would be appreciated. Thanks. Update on post on Whaley's suggestion: Tried the maven-antrun-plugin, but rt now after running mvn package all i'm getting inside my tests.jar is the META-INF folder. .java and .class are not getting included: This is the part of the pom.xml <build> <resources> <resource> <directory>src/main/java</directory> </resource> </resources> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-jar-plugin</artifactId> <executions> <execution> <phase>package</phase> <goals> <goal>test-jar</goal> </goals> <configuration> <includes> <include>src/test/java</include> </includes> </configuration> </execution> </executions> </plugin> <plugin> <artifactId>maven-antrun-plugin</artifactId> <executions> <execution> <id>${project.artifactId}-include-sources</id> <phase>process-resources</phase> <goals> <goal>run</goal> </goals> <configuration> <tasks> <copy todir="${project.build.testOutputDirectory}"> <fileset dir="${project.build.testSourceDirectory}"/> </copy> </tasks> </configuration> </execution> </executions> </plugin> </plugins> </build> Thanks.

    Read the article

  • Map wont show rigth in Joomla

    - by user1653126
    I have the following code of a map using api google, I have tested the code in several html editor and its work perfectly, but when i upload in my web page doesn’t work. The map appears all zoomed in some random point in the ocean. I create an article in Joomla 1.5.20, paste the code. Its shows right in the preview but not in the web page. I disable filtering and use none editor and still won’t work. Thanks for the help. <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyBInlv7FuwtKGhzBP0oISDoB2Iu79HNrPU&sensor=false"> </script> <script type="text/javascript"> var map; // lets define some vars to make things easier later var kml = { a: { name: "Productor", url: "https://maps.google.hn/maps/ms?authuser=0&vps=2&hl=es&ie=UTF8&msa=0&output=kml&msid=200984447026903306654.0004c934a224eca7c3ad4" }, b: { name: "A&S", url: "https://maps.google.hn/maps/ms?ie=UTF8&authuser=0&msa=0&output=kml&msid=200984447026903306654.0004c94bac74cf2304c71" } // keep adding more if ye like }; // initialize our goo function initializeMap() { var options = { center: new google.maps.LatLng(13.324182,-87.080071), zoom: 9, mapTypeId: google.maps.MapTypeId.TERRAIN } map = new google.maps.Map(document.getElementById("map_canvas"), options); var ctaLayer = new google.maps.KmlLayer('https://maps.google.hn/maps/ms?authuser=0&vps=5&hl=es&ie=UTF8&oe=UTF8&msa=0&output=kml&msid=200984447026903306654.0004c94bc3bce6f638aa1'); ctaLayer.setMap(map); var ctaLayer = new google.maps.KmlLayer('https://maps.google.hn/maps/ms?authuser=0&vps=2&ie=UTF8&msa=0&output=kml&msid=200984447026903306654.0004c94ec7e838242b67d'); ctaLayer.setMap(map); createTogglers(); }; google.maps.event.addDomListener(window, 'load', initializeMap); // the important function... kml[id].xxxxx refers back to the top function toggleKML(checked, id) { if (checked) { var layer = new google.maps.KmlLayer(kml[id].url, { preserveViewport: true, suppressInfoWindows: true }); google.maps.event.addListener(layer, 'click', function(kmlEvent) { var text = kmlEvent.featureData.description; showInContentWindow(text); }); function showInContentWindow(text) { var sidediv = document.getElementById('content_window'); sidediv.innerHTML = text; } // store kml as obj kml[id].obj = layer; kml[id].obj.setMap(map); } else { kml[id].obj.setMap(null); delete kml[id].obj; } }; // create the controls dynamically because it's easier, really function createTogglers() { var html = "<form><ul>"; for (var prop in kml) { html += "<li id=\"selector-" + prop + "\"><input type='checkbox' id='" + prop + "'" + " onclick='highlight(this,\"selector-" + prop + "\"); toggleKML(this.checked, this.id)' \/>" + kml[prop].name + "<\/li>"; } html += "<li class='control'><a href='#' onclick='removeAll();return false;'>" + "Limpiar el Mapa<\/a><\/li>" + "<\/ul><\/form>"; document.getElementById("toggle_box").innerHTML = html; }; // easy way to remove all objects function removeAll() { for (var prop in kml) { if (kml[prop].obj) { kml[prop].obj.setMap(null); delete kml[prop].obj; } } }; // Append Class on Select function highlight(box, listitem) { var selected = 'selected'; var normal = 'normal'; document.getElementById(listitem).className = (box.checked ? selected: normal); }; </script> <style type="text/css"> .selected { font-weight: bold; } </style> </head> <body> <div id="map_canvas" style="width: 80%; height: 400px; float:left"></div> <div id="toggle_box" style="position: absolute; top: 100px; right: 640px; padding: 10px; background: #fff; z-index: 5; "></div> <div id="content_window" style="width:10%; height:10%; float:left"></div> </body> </html>

    Read the article

  • Nested <a> and <span> challenge

    - by PaddyO
    Hi all, Trying in vain to get a nested link working within a nested span. This is a working test page for the code below to explain what I'm trying to do. Any ideas on how to get this working in valid html? I guess it's either a nesting order or style syntax thing but I am at a loss. Any thoughts much appreciated. <div id="greyback"> <ul id="scrollbox"> <li class="listcat">List header</li> <li><a class="menu" href="#freeze">List item 1<span><b>This text has popped up because you have clicked the list item, which has an "a" tag and now has :focus. That "a" tag is the first of two.</b><br><br>What I am trying to do is to set the second "a" tag as a DIFFERENT "embedded" link in this box<span style="color: blue; background-color: yellow;">eg, here<a href="http://www.conservationenterprises.com" target="blank">This is the second (nested) "a" tag in this html nest. It is a link to an external site. Instead of this being an always-visible link, I want it to sit within the yellow box in the first span (click the List item 1 to display).</a></span> </a></span> </li> </a></span> </li> </ul> </div> and the CSS: #scrollbox {margin: 0 auto; margin-top: 1em; margin-bottom: 1em; width:19em; height:auto; max-height: 21em; overflow:auto; border-bottom: 0.1em solid #FFA500; border-top: 0.1em solid #FFA500;} #scrollbox a {float: left; color:#000000; text-decoration:none; width:18em; height: auto; margin-bottom: 0.5em; font-family: Arial, sans-serif; font-size: 0.9em; text-align:left;} #scrollbox a.menu {} #scrollbox a span {display:none; position:absolute; left:0em; top:0;} #scrollbox a span img {float: right; border:0; max-width:7.5em;} #scrollbox a:hover {border: 0; color: #7ebb11; font-size:0.9em;} #scrollbox a:hover span {border: 0; color: #535353;} #scrollbox a span:focus {color: blue;} #scrollbox a:active {border:none; color: #535353; text-decoration: none;} #scrollbox a:focus {border:0em solid #000; outline:0;} #scrollbox a:active span, #scrollbox li a:active span, #scrollbox a:focus span, #scrollbox li a:focus span {display: block; width: 52.5em; min-height: 20em; height: auto; left: 1.5em; top:18em; z-index:10; font-size:0.9em; text-align: left; padding: 1em; padding-bottom: 0em; background-color: #c3FFe3; color: #535353; border: solid #FFA500 0.25em;} #scrollbox li a:active span span, #scrollbox li a:focus span span{display: block; width: auto; height: auto; min-height: 2em; left: 25em; top:10em; z-index:10; font-size:0.9em; text-align: left; padding: 1em; padding-bottom: 0em; background-color: transparent; color: #535353; border: dashed red 1px;} .ul#scrollbox {padding-left: 0.1em;} #scrollbox li {float:left; list-style: none; background: url(blank.png) no-repeat left center; margin-left: 0em; font-family:Arial, sans-serif; font-size: 0.9em;} #scrollbox li.listcat {float: left; text-align:left; width: 18em; margin-left: 0em; margin-top: 0.1em; margin-bottom: 0.3em; padding-top:0.5em; color: green; font-size: 0.9em; font-weight:bold;} Cheers Patrick.

    Read the article

  • Sending mail from html through php will return to php page. It should be in the same contact form. How to do it?

    - by Ershad
    Hi, I have a html page with all images and other text. Below i have the contact form. i am new to php. I have used php to send mail. But when i click on send button,it is going to backend.php. And i have a blank page. What i need is it should in the same page. I have done some javascript to show and hide div's. With this i am showing a thank u msg in the same page. But i dont want to redirect browser to show it is going to backend.php.TO be in the same page i have redirected php to another window. My code is - backend.php <?php if($_POST['message']) { $body = "Name: ".$_POST['name']; $body .= "<br>Email: ".$_POST['email']; $body .= "<br>Phone/Mobile: ".$_POST['phone'] $body .= "<br>Address: ".$_POST['address'] $body .= "<br>Message: ".$_POST['msg'] if(mail("Info@travelfoodservices.com","Subjects",$body)) echo 'true'; else echo 'false;'; } ?> form code - <form onsubmit="return validateFormOnSubmit(this)" action="backend.php" method="post" target="_blank"> <table align="left"> <tbody> <tr> <td align="left"><label for="name">Enter your name:</label> <label style="color:red;display:none;font-size:18px;" Id="namestar">*</label></td> </tr> <tr><td align="left"><input Id="name" name="name" style="width:515px;" size="35" maxlength="50" type="text"></td></tr> <tr ><td height="12px"/></tr> <tr> <td align="left"><label for="email">Email Address:</label> <label style="color:red;display:none;font-size:18px;" Id="emailstar">*</label></td> </tr> <tr><td align="left"><input Id="email" name="email" style="width:515px;" type="text"></td></tr> <tr><td height="12px"/></tr> <tr> <td align="left"><label for="phone">Phone/Mobile:</label><label style="color:red;font-size:18px;display:none;" Id="phonestar">*</label></td> </tr> <tr><td align="left"><input Id="phone" name="phone" style="width:515px;" type="text"></td></tr> <tr><td height="12px"/></tr> <tr> <td align="left"><label for="address">Your Address:</label><label style="color:red;font-size:18px;display:none;" Id="addressstar">*</label></td> </tr> <tr><td align="left"><input id="address" name="address" style="width:515px;" type="text"></td></tr> <tr><td height="12px"/></tr> <tr> <td align="left"><label for="msg">Enter Your Comments / Suggestions / Enquiries</label><label style="color:red;font-size:18px;display:none;" Id="messagestar">*</label></td> </tr> <tr><td align="left"><textarea id="msg" name="msg" style="width:515px;height:100px;" type="text"></textarea></td></tr> <tr><td height="12px"/></tr> <tr> <td align="right"><table align="left"> <tbody> <tr > <td style="width:160px;"/> <td style="width:250px;" ><label Id="mandatory" style="display:none;color:red;" >* Mandatory fields</label></td> <td ><input type="submit" name="send" value="send" /></td><td > <input type="reset" name="reset" value="reset" onclick="resetAll()" /></td></tr> </tbody> </table> </td> </tr> </tbody> </table>

    Read the article

  • Easiest way to submit data via PHP?

    - by Abijah
    I'm new to PHP, and have spent 10 hours trying to figure this problem out. The goal is to take all data entered into this order form, and send it to my email via PHP. I have 2 questions: 1. I can get PHP to send data from a single menu item (example: Mexican Tortas), but how do I get PHP to send data from multiple items (example: Mexican Tortas, Fish Sandwich and Hamburger)? 2. How do I tell PHP to not send data from menu items that don't have the "How Many?" or "Customize It?" text fields filled out? If you could provide a super simple example (or a link to a learning resource) I would really appreciate it. Thank you, Abijah PHP <?php if(isset($_POST['submit'])) { $to = "test@mywebsite.com"; $subject = "New Order"; $name_field = $_POST['name']; $phone_field = $_POST['phone']; $item = $_POST['item']; $quantity = $_POST['quantity']; $customize = $_POST['customize']; } $body = "Name: $name_field\nPhone: $phone_field\n\nItem: $item\nQuantity: $quantity\nCustomize: $customize"; echo "Data has been submitted to $to!"; mail($to, $subject, $body); ?> HTML <form action="neworder.php" method="POST"> <div class ="item"> <img style="float:left; margin-right:15px; border:1px Solid #000; width:200px; height:155px;" src="images/mexicantortas.jpg"> <h1>Mexican Torta - $8.50</h1> <input name="item" type="hidden" value="Mexican Torta"/> <h2>How Many? <font color="#999999">Ex: 1, 2, 3...?</font></h2> <input name="quantity" type="text"/> <h3>Customize It? <font color="#999999">Ex: No Lettuce, Extra Cheese...</font></h3> <textarea name="customize"/></textarea> </div><!-- ITEM_LEFT --> <div class ="item"> <img style="float:left; margin-right:15px; border:1px Solid #000; width:200px; height:155px;" src="images/fishsandwich.jpg"> <h1>Fish Sandwich - $8.50</h1> <input name="item" type="hidden" value="Fish Sandwich"/> <h2>How Many? <font color="#999999">Ex: 1, 2, 3...?</font></h2> <input name="quantity" type="text"/> <h3>Customize It? <font color="#999999">Ex: No Lettuce, Extra Cheese...</font></h3> <textarea name="customize"/></textarea> </div><!-- ITEM_LEFT --> <div class ="item"> <img style="float:left; margin-right:15px; border:1px Solid #000; width:200px; height:155px;" src="images/hamburgers.jpg"> <h1>Hamburger w/ Fries - $7.00</h1> <input name="item" type="hidden" value="Fish Sandwich"/> <h2>How Many? <font color="#999999">Ex: 1, 2, 3...?</font></h2> <input name="quantity" type="text"/> <h3>Customize It? <font color="#999999">Ex: No Lettuce, Extra Cheese...</font></h3> <textarea name="customize"/></textarea> </div><!-- ITEM_LEFT --> <div class="horizontal_form"> <div class="form"> <h2>Place Your Order Now: <font size="3"><font color="#037B41">Fill in the form below, and we'll call you when your food is ready to be picked up...</font></font></h2> <p class="name"> <input type="text" name="name" id="name" style="text-align:center;" onClick="this.value='';" value="Enter your name"/> </p> <p class="phone"> <input type="text" name="phone" id="phone" style="text-align:center;" onClick="this.value='';" value="Enter your phone #"/> </p> <p class="submit"> <input type="submit" value="Place Order" name="submit"/> </p> </div><!-- FORM --> </div><!-- HORIZONTAL_FORM --> </form>

    Read the article

  • How can I make a table move in JavaScript?

    - by Michal Skrzypek
    My problem is that I was creating a simple website the other day and I needed the content to move according to the button pressed. I managed to do so in CSS3, but the solution did not work for IE whatsoever. Therefore I would like to ask if there is a simple solution for that in js? I don't know js at all but I heard what I need is much easier in js than in css. Details: http://i42.tinypic.com/6yl4ia.png I need the table in the picture to move according to the buttons (which are labels to be exact). The visible area is a div. Here's the relevant code (without animation as I was not satisfied with it): body { background-color: #fff; color: #fff; padding:0px; } #bodywrapperfixed { width: 1248px; margin: 0px auto; position: relative; overflow: hidden; height: 730px; } #bodywrapper { display:block; background-color: #fff; width: 1248px; color: #59595B; padding-top:50px; font-family: 'Roboto', sans-serif; position: absolute; top:0px; left:0px; z-index:1; font-size: 60px; height:730px; } #bodywrapper img { width:400px; padding:15px 0px 20px 0px; } #texten { font-family: 'Roboto', sans-serif; font-size: 35px; padding:5px; } #textpl { font-family: 'Roboto', sans-serif; font-size: 25px; padding:5px; } table#linki { width: 110px; border: none; margin-top:15px; } label { display: block; height: 54px; width: 54px; color:#fff; font-family: 'Roboto', sans-serif; font-weight: 300; font-size: 35px; background-color: #117D10; text-align: center; padding:23px; } label:hover { background-color: #004F00; cursor: pointer; } input#pl { position: absolute; top: -9999px; left: -9999px; } input#en { position: absolute; top: -9999px; left: -9999px; } and the relevant HTML: <div id="bodywrapperfixed"> <div id="bodywrapperfloat"> <table id="ramka"> <tr> <td>random text</td> <td><div id="bodywrapper"> <center> <div id="texten"><div style="font-weight:300; display:inline-block;">Introducing the all-in-one entertainment system.</div><div style="font-weight:500; display:inline-block;">&nbsp;For everyone.</div></div> <div id="textpl"><div style="font-weight:300; display:inline-block;">Przedstawiamy zintegrowany system rozrywki.</div><div style="font-weight:500; display:inline-block;">&nbsp;&nbsp;Dla wszystkich.</div></div> <img src="imgs/xboxone.png"> <div id="texten"><div style="font-weight:300; display:inline-block;">Choose your version of the story:</div></div> <div id="textpl"><div style="font-weight:300; display:inline-block;">Wybierz swoja wersja opowiesci:</div></div> <table id="linki"> <tr> <td><label for="en">en</label><input id="en" type="checkbox"></td> <td><label for="pl">pl</label><input id="pl" type="checkbox"></td> </tr></table> </center> </div></td> <td>random text</td> </tr> </table> </div> </div> Here's what it looks like: http://ingame.lh.pl/thinkone/ Please help me.

    Read the article

  • js code works for one variable(?), how to make it work for many?

    - by jerry87
    I have working code of js, it shows different div for selected option. <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#box1').hide(); $('#box2').hide(); $('#box3').hide(); $("#thechoices").change(function(){ $("#" + this.value).show().siblings().hide(); }); $("#thechoices").change(); }); </script> </head> <body> <select id="thechoices"> <option value="box1">Box 1</option> <option value="box2">Box 2</option> <option value="box3">Box 3</option> </select> <!-- the DIVs --> <div id="boxes"> <div id="box1"><p>Box 1 stuff...</p></div> <div id="box2"><p>Box 2 stuff...</p></div> <div id="box3"><p>Box 3 stuff...</p></div> </div> </body> </html> Please, I have no js experience, so I don't know how to make it work several times on one page for many "thechoices". Something like copy paste but more suitable than this: <script type="text/javascript"> $(document).ready(function(){ $('#box1').hide(); $('#box2').hide(); $('#box3').hide(); $('#box4').hide(); $('#box5').hide(); $('#box6').hide(); $("#thechoices").change(function(){ $("#" + this.value).show().siblings().hide(); }); $("#thechoices2").change(function(){ $("#" + this.value).show().siblings().hide(); }); $("#thechoices").change(); }); $("#thechoices2").change(); }); </script> </head> <body> <select id="thechoices"> <option value="box1">Box 1</option> <option value="box2">Box 2</option> <option value="box3">Box 3</option> </select> <!-- the DIVs --> <div id="boxes"> <div id="box1"><p>Box 1 stuff...</p></div> <div id="box2"><p>Box 2 stuff...</p></div> <div id="box3"><p>Box 3 stuff...</p></div> </div> <select id="thechoices2"> <option value="box4">1</option> <option value="box5">2</option> <option value="box6">3</option> </select> <!-- the DIVs --> <div id="boxes"> <div id="box4"><p>1 stuff...</p></div> <div id="box5"><p>2 stuff...</p></div> <div id="box6"><p>3 stuff...</p></div> </div> I know you can help me, it seems to be simple but I can't handle with this. How can I change my second code to work in the same way but not only for two selectors. I need it for many. Don't want to copy paste the same section like in my second code.

    Read the article

  • SOA Suite 11g Native Format Builder Complex Format Example

    - by bob.webster
    This rather long posting details the steps required to process a grouping of fixed length records using Format Builder.   If it’s 10 pm and you’re feeling beat you might want to leave this until tomorrow.  But if it’s 10 pm and you need to get a Format Builder Complex template done, read on… The goal is to process individual orders from a file using the 11g File Adapter and Format Builder Sample Data =========== 001Square Widget            0245.98 102Triagular Widget         1120.00 403Circular Widget           0099.45 ORD8898302/01/2011 301Hexagon Widget         1150.98 ORD6735502/01/2011 The records are fixed length records representing a number of logical Order records. Each order record consists of a number of item records starting with a 3 digit number, followed by a single Summary Record which starts with the constant ORD. How can this file be processed so that the first poll returns the first order? 001Square Widget            0245.98 102Triagular Widget         1120.00 403Circular Widget           0099.45 ORD8898302/01/2011 And the second poll returns the second order? 301Hexagon Widget           1150.98 ORD6735502/01/2011 Note: if you need more than one order per poll, that’s also possible, see the “Multiple Messages” field in the “File Adapter Step 6 of 9” snapshot further down.   To follow along with this example you will need - Studio Edition Version 11.1.1.4.0    with the   - SOA Extension for JDeveloper 11.1.1.4.0 installed Both can be downloaded from here:  http://www.oracle.com/technetwork/middleware/soasuite/downloads/index.html You will not need a running WebLogic Server domain to complete the steps and Format Builder tests in this article.     Start with a SOA Composite containing a File Adapter The Format Builder is part of the File Adapter so start by creating a new SOA Project and Composite. Here is a quick summary for those not familiar with these steps - Start JDeveloper - From the Main Menu choose File->New - In the New Gallery window that opens Expand the “General” category and Select the Applications node.   Then choose SOA Application from the Items section on the right.  Finally press the OK button. - In Step 1 of the “Create SOA Application wizard” that appears enter an Application Name and an Directory of your     choice,   then press the Next button. - In Step 2 of the “Create SOA Application wizard”, press the Next button leaving all entries as defaulted. - In Step 3 of the “Create SOA Application wizard”, Enter a composite name of your choice and Press the Finish   Button These steps result in a new Application and SOA Project. The SOA Project contains a composite.xml file which is opened and shown below. For our example we have not defined a Mediator or a BPEL process to minimize the steps, but one or the other would eventually be needed to use the File Adapter we are about to create. Drag and drop the File Adapter icon from the Component Pallette onto either the LEFT side of the diagram under “Exposed Services” or the right side under “External References”.  (See the Green Circle in the image below).  Placing the adapter on the left side would indicate the file being processed is inbound to the composite, if the adapter is placed on the right side then the data is outbound to a file.     Note that the same Format Builder definition can be used in both directions.  For example we could use the format with a File Adapter on the left side of the composite to parse fixed data into XML, modify the data in our Composite or BPEL process and then use the same Format Builder definition with a File adapter on the right side of the composite to write the data back out in the same fixed data format When the File Adapter is dropped on the Composite the File Adapter Wizard Appears. Skip Past the first page, Step 1 of 9 by pressing the Next button. In Step 2 enter a service name of your choice as shown below, then press Next   When the Native Format Builder appears, skip the welcome page by pressing next. Also press the Next button to accept the settings on Step 3 of 9 On Step 4, select Read File and press the Next button as shown below.   On Step 5 enter a directory that will contain a file with the input data, then  Press the Next button as shown below. In step 6, enter *.txt or another file format to select input files from the input directory mentioned in step 5. ALSO check the “Files contain Multiple Messages” checkbox and set the “Publish Messages in Batches of” field to 1.  The value can be set higher to increase the number of logical order group records returned on each poll of the file adapter.  In other words, it determines the number of Orders that will be sent to each instance of a Mediator or Composite processing using the File Adapter.   Skip Step 7 by pressing the Next button In Step 8 press the Gear Icon on the right side to load the Native Format Builder.       Native Format Builder  appears Before diving into the format, here is an overview of the process. Approach - Bottom up Assuming an Order is a grouping of item records and a summary record…. - Define a separate  Complex Type for each Record Type found in the group.    (One for itemRecord and one for summaryRecord) - Define a Complex Type to contain the Group of Record types defined above   (LogicalOrderRecord) - Define a top level element to represent an order.  (order)   The order element will be of type LogicalOrderRecord   Defining the Format In Step 1 select   “Create new”  and  “Complex Type” and “Next”   In Step two browse to and select a file containing the test data shown at the start of this article. A link is provided at the end of this article to download a file containing the test data. Press the Next button     In Step 3 Complex types must be define for each type of input record. Select the Root-Element and Click on the Add Complex Type icon This creates a new empty complex type definition shown below. The fastest way to create the definition is to highlight the first line of the Sample File data and drag the line onto the  <new_complex_type> Format Builder introspects the data and provides a grid to define additional fields. Change the “Complex Type Name” to  “itemRecord” Then click on the ruler to indicate the position of fixed columns.  Drag the red triangle icons to the exact columns if necessary. Double click on an existing red triangle to remove an unwanted entry. In the case below fields are define in columns 0-3, 4-28, 29-eol When the field definitions are correct, press the “Generate Fields” button. Field entries named C1, C2 and C3 will be created as shown below. Click on the field names and rename them from C1->itemNum, C2->itemDesc and C3->itemCost  When all the fields are correctly defined press OK to save the complex type.        Next, the process is repeated to define a Complex Type for the SummaryRecord. Select the Root-Element in the schema tree and press the new complex type icon Then highlight and drag the Summary Record from the sample data onto the <new_complex_type>   Change the complex type name to “summaryRecord” Mark the fixed fields for Order Number and Order Date. Press the Generate Fields button and rename C1 and C2 to itemNum and orderDate respectively.   The last complex type to be defined is a type to hold the group of items and the summary record. Select the Root-Element in the schema tree and click the new complex type icon Select the “<new_complex_type>” entry and click the pencil icon   On the Complex Type Details page change the name and type of each input field. Change line 1 to be named item and set the Type  to “itemRecord” Change line 2 to be named summary and set the Type to “summaryRecord” We also need to indicate that itemRecords repeat in the input file. Click the pencil icon at the right side of the item line. On the Edit Details page change the “Max Occurs” entry from 1 to UNBOUNDED. We also need to indicate how to identify an itemRecord.  Since each item record has “.” in column 32 we can use this fact to differentiate an item record from a summary record. Change the “Look Ahead” field to value 32 and enter a period in the “Look For” field Press the OK button to save entry.     Finally, its time to create a top level element to represent an order. Select the “Root-Element” in the schema tree and press the New element icon Click on the <new_element> and press the pencil icon.   Set the Element Name to “order” and change the Data Type to “logicalOrderRecord” Press the OK button to save the element definition.   The final definition should match the screenshot below. Press the Next Button to view the definition source.     Press the Test Button to test the definition   Press the Green Triangle Icon to run the test.   And we are presented with an unwelcome error. The error states that the processor ran out of data while working through the definition. The processor was unable to differentiate between itemRecords and summaryRecords and therefore treated the entire file as a list of itemRecords.  At end of file, the “summary” portion of the logicalOrderRecord remained unprocessed but mandatory.   This root cause of this error is the loss of our “lookAhead” definition used to identify itemRecords. This appears to be a bug in the  Native Format Builder 11.1.1.4.0 Luckily, a simple workaround exists. Press the Cancel button and return to the “Step 4 of 4” Window. Manually add    nxsd:lookAhead="32" nxsd:lookFor="."   attributes after the maxOccurs attribute of the item element. as shown in the highlighted text below.   When the lookAhead and lookFor attributes have been added Press the Test button and on the Test page press the Green Triangle. The test is now successful, the first order in the file is returned by the File Adapter.     Below is a complete listing of the Result XML from the right column of the screen above   Try running it The downloaded input test file and completed schema file can be used for testing without following all the Native Format Builder steps in this example. Use the following link to download a file containing the sample data. Download Sample Input Data This is the best approach rather than cutting and pasting the input data at the top of the article.  Since the data is fixed length it’s very important to watch out for trailing spaces in the data and to ensure an eol character at the end of every line. The download file is correctly formatted. The final schema definition can be downloaded at the following link Download Completed Schema Definition   - Save the inputData.txt file to a known location like the xsd folder in your project. - Save the inputData_6.xsd file to the xsd folder in your project. - At step 1 in the Native Format Builder wizard  (as shown above) check the “Edit existing” radio button,    then browse and select the inputData_6.xsd file - At step 2 of the Format Builder configuration Wizard (as shown above) supply the path and filename for    the inputData.txt file. - You can then proceed to the test page and run a test. - Remember the wizard bug will drop the lookAhead and lookFor attributes,  you will need to manually add   nxsd:lookAhead="32" nxsd:lookFor="."    after the maxOccurs attribute of the item element in the   LogicalOrderRecord Complex Type.  (as shown above)   Good Luck with your Format Project

    Read the article

  • NoSQL with RavenDB and ASP.NET MVC - Part 1

    - by shiju
     A while back, I have blogged NoSQL with MongoDB, NoRM and ASP.NET MVC Part 1 and Part 2 on how to use MongoDB with an ASP.NET MVC application. The NoSQL movement is getting big attention and RavenDB is the latest addition to the NoSQL and document database world. RavenDB is an Open Source (with a commercial option) document database for the .NET/Windows platform developed  by Ayende Rahien.  Raven stores schema-less JSON documents, allow you to define indexes using Linq queries and focus on low latency and high performance. RavenDB is .NET focused document database which comes with a fully functional .NET client API  and supports LINQ. RavenDB comes with two components, a server and a client API. RavenDB is a REST based system, so you can write your own HTTP cleint API. As a .NET developer, RavenDB is becoming my favorite document database. Unlike other document databases, RavenDB is supports transactions using System.Transactions. Also it's supports both embedded and server mode of database. You can access RavenDB site at http://ravendb.netA demo App with ASP.NET MVCLet's create a simple demo app with RavenDB and ASP.NET MVC. To work with RavenDB, do the following steps. Go to http://ravendb.net/download and download the latest build.Unzip the downloaded file.Go to the /Server directory and run the RavenDB.exe. This will start the RavenDB server listening on localhost:8080You can change the port of RavenDB  by modifying the "Raven/Port" appSetting value in the RavenDB.exe.config file.When running the RavenDB, it will automatically create a database in the /Data directory. You can change the directory name data by modifying "Raven/DataDirt" appSetting value in the RavenDB.exe.config file.RavenDB provides a browser based admin tool. When the Raven server is running, You can be access the browser based admin tool and view and edit documents and index using your browser admin tool. The web admin tool available at http://localhost:8080The below is the some screen shots of web admin tool     Working with ASP.NET MVC  To working with RavenDB in our demo ASP.NET MVC application, do the following steps Step 1 - Add reference to Raven Cleint API In our ASP.NET MVC application, Add a reference to the Raven.Client.Lightweight.dll from the Client directory. Step 2 - Create DocumentStoreThe document store would be created once per application. Let's create a DocumentStore on application start-up in the Global.asax.cs. documentStore = new DocumentStore { Url = "http://localhost:8080/" }; documentStore.Initialise(); The above code will create a Raven DB document store and will be listening the server locahost at port 8080    Step 3 - Create DocumentSession on BeginRequest   Let's create a DocumentSession on BeginRequest event in the Global.asax.cs. We are using the document session for every unit of work. In our demo app, every HTTP request would be a single Unit of Work (UoW). BeginRequest += (sender, args) =>   HttpContext.Current.Items[RavenSessionKey] = documentStore.OpenSession(); Step 4 - Destroy the DocumentSession on EndRequest  EndRequest += (o, eventArgs) => {     var disposable = HttpContext.Current.Items[RavenSessionKey] as IDisposable;     if (disposable != null)         disposable.Dispose(); };  At the end of HTTP request, we are destroying the DocumentSession  object.The below  code block shown all the code in the Global.asax.cs  private const string RavenSessionKey = "RavenMVC.Session"; private static DocumentStore documentStore;   protected void Application_Start() { //Create a DocumentStore in Application_Start //DocumentStore should be created once per application and stored as a singleton. documentStore = new DocumentStore { Url = "http://localhost:8080/" }; documentStore.Initialise(); AreaRegistration.RegisterAllAreas(); RegisterRoutes(RouteTable.Routes); //DI using Unity 2.0 ConfigureUnity(); }   public MvcApplication() { //Create a DocumentSession on BeginRequest   //create a document session for every unit of work BeginRequest += (sender, args) =>     HttpContext.Current.Items[RavenSessionKey] = documentStore.OpenSession(); //Destroy the DocumentSession on EndRequest EndRequest += (o, eventArgs) => { var disposable = HttpContext.Current.Items[RavenSessionKey] as IDisposable; if (disposable != null) disposable.Dispose(); }; }   //Getting the current DocumentSession public static IDocumentSession CurrentSession {   get { return (IDocumentSession)HttpContext.Current.Items[RavenSessionKey]; } }  We have setup all necessary code in the Global.asax.cs for working with RavenDB. For our demo app, Let’s write a domain class  public class Category {       public string Id { get; set; }       [Required(ErrorMessage = "Name Required")]     [StringLength(25, ErrorMessage = "Must be less than 25 characters")]     public string Name { get; set;}     public string Description { get; set; }   } We have created simple domain entity Category. Let's create repository class for performing CRUD operations against our domain entity Category.  public interface ICategoryRepository {     Category Load(string id);     IEnumerable<Category> GetCategories();     void Save(Category category);     void Delete(string id);       }    public class CategoryRepository : ICategoryRepository {     private IDocumentSession session;     public CategoryRepository()     {             session = MvcApplication.CurrentSession;     }     //Load category based on Id     public Category Load(string id)     {         return session.Load<Category>(id);     }     //Get all categories     public IEnumerable<Category> GetCategories()     {         var categories= session.LuceneQuery<Category>()                 .WaitForNonStaleResults()             .ToArray();         return categories;       }     //Insert/Update category     public void Save(Category category)     {         if (string.IsNullOrEmpty(category.Id))         {             //insert new record             session.Store(category);         }         else         {             //edit record             var categoryToEdit = Load(category.Id);             categoryToEdit.Name = category.Name;             categoryToEdit.Description = category.Description;         }         //save the document session         session.SaveChanges();     }     //delete a category     public void Delete(string id)     {         var category = Load(id);         session.Delete<Category>(category);         session.SaveChanges();     }        } For every CRUD operations, we are taking the current document session object from HttpContext object. session = MvcApplication.CurrentSession; We are calling the static method CurrentSession from the Global.asax.cs public static IDocumentSession CurrentSession {     get { return (IDocumentSession)HttpContext.Current.Items[RavenSessionKey]; } }  Retrieve Entities  The Load method get the single Category object based on the Id. RavenDB is working based on the REST principles and the Id would be like categories/1. The Id would be created by automatically when a new object is inserted to the document store. The REST uri categories/1 represents a single category object with Id representation of 1.   public Category Load(string id) {    return session.Load<Category>(id); } The GetCategories method returns all the categories calling the session.LuceneQuery method. RavenDB is using a lucen query syntax for querying. I will explain more details about querying and indexing in my future posts.   public IEnumerable<Category> GetCategories() {     var categories= session.LuceneQuery<Category>()             .WaitForNonStaleResults()         .ToArray();     return categories;   } Insert/Update entityFor insert/Update a Category entity, we have created Save method in repository class. If  the Id property of Category is null, we call Store method of Documentsession for insert a new record. For editing a existing record, we load the Category object and assign the values to the loaded Category object. The session.SaveChanges() will save the changes to document store.  //Insert/Update category public void Save(Category category) {     if (string.IsNullOrEmpty(category.Id))     {         //insert new record         session.Store(category);     }     else     {         //edit record         var categoryToEdit = Load(category.Id);         categoryToEdit.Name = category.Name;         categoryToEdit.Description = category.Description;     }     //save the document session     session.SaveChanges(); }  Delete Entity  In the Delete method, we call the document session's delete method and call the SaveChanges method to reflect changes in the document store.  public void Delete(string id) {     var category = Load(id);     session.Delete<Category>(category);     session.SaveChanges(); }  Let’s create ASP.NET MVC controller and controller actions for handling CRUD operations for the domain class Category  public class CategoryController : Controller { private ICategoryRepository categoyRepository; //DI enabled constructor public CategoryController(ICategoryRepository categoyRepository) {     this.categoyRepository = categoyRepository; } public ActionResult Index() {         var categories = categoyRepository.GetCategories();     if (categories == null)         return RedirectToAction("Create");     return View(categories); }   [HttpGet] public ActionResult Edit(string id) {     var category = categoyRepository.Load(id);         return View("Save",category); } // GET: /Category/Create [HttpGet] public ActionResult Create() {     var category = new Category();     return View("Save", category); } [HttpPost] public ActionResult Save(Category category) {     if (!ModelState.IsValid)     {         return View("Save", category);     }           categoyRepository.Save(category);         return RedirectToAction("Index");     }        [HttpPost] public ActionResult Delete(string id) {     categoyRepository.Delete(id);     var categories = categoyRepository.GetCategories();     return PartialView("CategoryList", categories);      }        }  RavenDB is an awesome document database and I hope that it will be the winner in .NET space of document database world.  The source code of demo application available at http://ravenmvc.codeplex.com/

    Read the article

  • Making WCF Output a single WSDL file for interop purposes.

    By default, when WCF emits a WSDL definition for your services, it can often contain many links to others related schemas that need to be imported. For the most part, this is fine. WCF clients understand this type of schema without issue, and it conforms to the requisite standards as far as WSDL definitions go. However, some non Microsoft stacks will only work with a single WSDL file and require that all definitions for the service(s) (port types, messages, operation etc) are contained within that single file. In other words, no external imports are supported. Some Java clients (to my working knowledge) have this limitation. This obviously presents a problem when trying to create services exposed for consumption and interop by these clients. Note: You can download the full source code for this sample from here To illustrate this point, lets say we have a simple service that looks like: Service Contract public interface IService1 { [OperationContract] [FaultContract(typeof(DataFault))] string GetData(DataModel1 model); [OperationContract] [FaultContract(typeof(DataFault))] string GetMoreData(DataModel2 model); } .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Service Implementation/Behaviour public class Service1 : IService1 { public string GetData(DataModel1 model) { return string.Format("Some Field was: {0} and another field was {1}", model.SomeField,model.AnotherField); } public string GetMoreData(DataModel2 model) { return string.Format("Name: {0}, age: {1}", model.Name, model.Age); } } .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Configuration File <system.serviceModel> <services> <service name="SingleWSDL_WcfService.Service1" behaviorConfiguration="SingleWSDL_WcfService.Service1Behavior"> <!-- ...std/default data omitted for brevity..... --> <endpoint address ="" binding="wsHttpBinding" contract="SingleWSDL_WcfService.IService1" > ....... </services> <behaviors> <serviceBehaviors> <behavior name="SingleWSDL_WcfService.Service1Behavior"> ........ </behavior> </serviceBehaviors> </behaviors> </system.serviceModel> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } When WCF is asked to produce a WSDL for this service, it will produce a file that looks something like this (note: some sections omitted for brevity): <?xml version="1.0" encoding="utf-8" ?> - <wsdl:definitions name="Service1" targetNamespace="http://tempuri.org/" xmlns:wsdl="http://schemas.xmlsoap.org/wsdl/" xmlns:soap="http://schemas.xmlsoap.org/wsdl/soap/" ...... namespace definitions omitted for brevity + <wsp:Policy wsu:Id="WSHttpBinding_IService1_policy"> ... multiple policy items omitted for brevity </wsp:Policy> - <wsdl:types> - <xsd:schema targetNamespace="http://tempuri.org/Imports"> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd0" namespace="http://tempuri.org/" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd3" namespace="Http://SingleWSDL/Fault" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd1" namespace="http://schemas.microsoft.com/2003/10/Serialization/" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd2" namespace="http://SingleWSDL/Model1" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd4" namespace="http://SingleWSDL/Model2" /> </xsd:schema> </wsdl:types> + <wsdl:message name="IService1_GetData_InputMessage"> .... </wsdl:message> - <wsdl:operation name="GetData"> ..... </wsdl:operation> - <wsdl:service name="Service1"> ....... </wsdl:service> </wsdl:definitions> The above snippet from the WSDL shows the external links and references that are generated by WCF for a relatively simple service. Note the xsd:import statements that reference external XSD definitions which are also generated by WCF. In order to get WCF to produce a single WSDL file, we first need to follow some good practices when it comes to WCF service definitions. Step 1: Define a namespace for your service contract. [ServiceContract(Namespace="http://SingleWSDL/Service1")] public interface IService1 { ...... } .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Normally you would not use a literal string and may instead define a constant to use in your own application for the namespace. When this is applied and we generate the WSDL, we get the following statement inserted into the document: <wsdl:import namespace="http://SingleWSDL/Service1" location="http://localhost:2370/HostingSite/Service-default.svc?wsdl=wsdl0" /> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } All the previous imports have gone. If we follow this link, we will see that the XSD imports are now in this external WSDL file. Not really any benefit for our purposes. Step 2: Define a namespace for your service behaviour [ServiceBehavior(Namespace = "http://SingleWSDL/Service1")] public class Service1 : IService1 { ...... } As you can see, the namespace of the service behaviour should be the same as the service contract interface to which it implements. Failure to do these tasks will cause WCF to emit its default http://tempuri.org namespace all over the place and cause WCF to still generate import statements. This is also true if the namespace of the contract and behaviour differ. If you define one and not the other, defaults kick in, and youll find extra imports generated. While each of the previous 2 steps wont cause any less import statements to be generated, you will notice that namespace definitions within the WSDL have identical, well defined names. Step 3: Define a binding namespace In the configuration file, modify the endpoint configuration line item to iunclude a bindingNamespace attribute which is the same as that defined on the service behaviour and service contract <endpoint address="" binding="wsHttpBinding" contract="SingleWSDL_WcfService.IService1" bindingNamespace="http://SingleWSDL/Service1"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } However, this does not completely solve the issue. What this will do is remove the WSDL import statements like this one: <wsdl:import namespace="http://SingleWSDL/Service1" location="http://localhost:2370/HostingSite/Service-default.svc?wsdl" /> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } from the generated WSDL. Finally. the magic. Step 4: Use a custom endpoint behaviour to read in external imports and include in the main WSDL output. In order to force WCF to output a single WSDL with all the required definitions, we need to define a custom WSDL Export extension that can be applied to any endpoints. This requires implementing the IWsdlExportExtension and IEndpointBehavior interfaces and then reading in any imported schemas, and adding that output to the main, flattened WSDL to be output. Sounds like fun right..? Hmmm well maybe not. This step sounds a little hairy, but its actually quite easy thanks to some kind individuals who have already done this for us. As far as I know, there are 2 available implementations that we can easily use to perform the import and WSDL flattening.  WCFExtras which is on codeplex and FlatWsdl by Thinktecture. Both implementations actually do exactly the same thing with the imports and provide an endpoint behaviour, however FlatWsdl does a little more work for us by providing a ServiceHostFactory that we can use which automatically attaches the requisite behaviour to our endpoints for us. To use this in an IIS hosted service, we can modify the .SVC file to specify this ne factory to use like so: <%@ ServiceHost Language="C#" Debug="true" Service="SingleWSDL_WcfService.Service1" Factory="Thinktecture.ServiceModel.Extensions.Description.FlatWsdlServiceHostFactory" %> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Within a service application or another form of executable such as a console app, we can simply create an instance of the custom service host and open it as we normally would as shown here: FlatWsdlServiceHost host = new FlatWsdlServiceHost(typeof(Service1)); host.Open(); And we are done. WCF will now generate one single WSDL file that contains all he WSDL imports and data/XSD imports. You can download the full source code for this sample from here Hope this has helped you. Note: Please note that I have not extensively tested this in a number of different scenarios so no guarantees there.Did you know that DotNetSlackers also publishes .net articles written by top known .net Authors? We already have over 80 articles in several categories including Silverlight. Take a look: here.

    Read the article

  • Making WCF Output a single WSDL file for interop purposes.

    - by Glav
    By default, when WCF emits a WSDL definition for your services, it can often contain many links to others related schemas that need to be imported. For the most part, this is fine. WCF clients understand this type of schema without issue, and it conforms to the requisite standards as far as WSDL definitions go. However, some non Microsoft stacks will only work with a single WSDL file and require that all definitions for the service(s) (port types, messages, operation etc…) are contained within that single file. In other words, no external imports are supported. Some Java clients (to my working knowledge) have this limitation. This obviously presents a problem when trying to create services exposed for consumption and interop by these clients. Note: You can download the full source code for this sample from here To illustrate this point, lets say we have a simple service that looks like: Service Contract public interface IService1 { [OperationContract] [FaultContract(typeof(DataFault))] string GetData(DataModel1 model); [OperationContract] [FaultContract(typeof(DataFault))] string GetMoreData(DataModel2 model); } .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Service Implementation/Behaviour public class Service1 : IService1 { public string GetData(DataModel1 model) { return string.Format("Some Field was: {0} and another field was {1}", model.SomeField,model.AnotherField); } public string GetMoreData(DataModel2 model) { return string.Format("Name: {0}, age: {1}", model.Name, model.Age); } } .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Configuration File <system.serviceModel> <services> <service name="SingleWSDL_WcfService.Service1" behaviorConfiguration="SingleWSDL_WcfService.Service1Behavior"> <!-- ...std/default data omitted for brevity..... --> <endpoint address ="" binding="wsHttpBinding" contract="SingleWSDL_WcfService.IService1" > ....... </services> <behaviors> <serviceBehaviors> <behavior name="SingleWSDL_WcfService.Service1Behavior"> ........ </behavior> </serviceBehaviors> </behaviors> </system.serviceModel> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } When WCF is asked to produce a WSDL for this service, it will produce a file that looks something like this (note: some sections omitted for brevity): <?xml version="1.0" encoding="utf-8" ?> - <wsdl:definitions name="Service1" targetNamespace="http://tempuri.org/" xmlns:wsdl="http://schemas.xmlsoap.org/wsdl/" xmlns:soap="http://schemas.xmlsoap.org/wsdl/soap/" ...... namespace definitions omitted for brevity + &lt;wsp:Policy wsu:Id="WSHttpBinding_IService1_policy"> ... multiple policy items omitted for brevity </wsp:Policy> - <wsdl:types> - <xsd:schema targetNamespace="http://tempuri.org/Imports"> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd0" namespace="http://tempuri.org/" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd3" namespace="Http://SingleWSDL/Fault" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd1" namespace="http://schemas.microsoft.com/2003/10/Serialization/" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd2" namespace="http://SingleWSDL/Model1" /> <xsd:import schemaLocation="http://localhost:2370/HostingSite/Service-default.svc?xsd=xsd4" namespace="http://SingleWSDL/Model2" /> </xsd:schema> </wsdl:types> + <wsdl:message name="IService1_GetData_InputMessage"> .... </wsdl:message> - <wsdl:operation name="GetData"> ..... </wsdl:operation> - <wsdl:service name="Service1"> ....... </wsdl:service> </wsdl:definitions> The above snippet from the WSDL shows the external links and references that are generated by WCF for a relatively simple service. Note the xsd:import statements that reference external XSD definitions which are also generated by WCF. In order to get WCF to produce a single WSDL file, we first need to follow some good practices when it comes to WCF service definitions. Step 1: Define a namespace for your service contract. [ServiceContract(Namespace="http://SingleWSDL/Service1")] public interface IService1 { ...... } .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Normally you would not use a literal string and may instead define a constant to use in your own application for the namespace. When this is applied and we generate the WSDL, we get the following statement inserted into the document: <wsdl:import namespace="http://SingleWSDL/Service1" location="http://localhost:2370/HostingSite/Service-default.svc?wsdl=wsdl0" /> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } All the previous imports have gone. If we follow this link, we will see that the XSD imports are now in this external WSDL file. Not really any benefit for our purposes. Step 2: Define a namespace for your service behaviour [ServiceBehavior(Namespace = "http://SingleWSDL/Service1")] public class Service1 : IService1 { ...... } As you can see, the namespace of the service behaviour should be the same as the service contract interface to which it implements. Failure to do these tasks will cause WCF to emit its default http://tempuri.org namespace all over the place and cause WCF to still generate import statements. This is also true if the namespace of the contract and behaviour differ. If you define one and not the other, defaults kick in, and you’ll find extra imports generated. While each of the previous 2 steps wont cause any less import statements to be generated, you will notice that namespace definitions within the WSDL have identical, well defined names. Step 3: Define a binding namespace In the configuration file, modify the endpoint configuration line item to iunclude a bindingNamespace attribute which is the same as that defined on the service behaviour and service contract <endpoint address="" binding="wsHttpBinding" contract="SingleWSDL_WcfService.IService1" bindingNamespace="http://SingleWSDL/Service1"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } However, this does not completely solve the issue. What this will do is remove the WSDL import statements like this one: <wsdl:import namespace="http://SingleWSDL/Service1" location="http://localhost:2370/HostingSite/Service-default.svc?wsdl" /> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } from the generated WSDL. Finally…. the magic…. Step 4: Use a custom endpoint behaviour to read in external imports and include in the main WSDL output. In order to force WCF to output a single WSDL with all the required definitions, we need to define a custom WSDL Export extension that can be applied to any endpoints. This requires implementing the IWsdlExportExtension and IEndpointBehavior interfaces and then reading in any imported schemas, and adding that output to the main, flattened WSDL to be output. Sounds like fun right…..? Hmmm well maybe not. This step sounds a little hairy, but its actually quite easy thanks to some kind individuals who have already done this for us. As far as I know, there are 2 available implementations that we can easily use to perform the import and “WSDL flattening”.  WCFExtras which is on codeplex and FlatWsdl by Thinktecture. Both implementations actually do exactly the same thing with the imports and provide an endpoint behaviour, however FlatWsdl does a little more work for us by providing a ServiceHostFactory that we can use which automatically attaches the requisite behaviour to our endpoints for us. To use this in an IIS hosted service, we can modify the .SVC file to specify this ne factory to use like so: <%@ ServiceHost Language="C#" Debug="true" Service="SingleWSDL_WcfService.Service1" Factory="Thinktecture.ServiceModel.Extensions.Description.FlatWsdlServiceHostFactory" %> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } Within a service application or another form of executable such as a console app, we can simply create an instance of the custom service host and open it as we normally would as shown here: FlatWsdlServiceHost host = new FlatWsdlServiceHost(typeof(Service1)); host.Open(); And we are done. WCF will now generate one single WSDL file that contains all he WSDL imports and data/XSD imports. You can download the full source code for this sample from here Hope this has helped you. Note: Please note that I have not extensively tested this in a number of different scenarios so no guarantees there.

    Read the article

  • Metro: Declarative Data Binding

    - by Stephen.Walther
    The goal of this blog post is to describe how declarative data binding works in the WinJS library. In particular, you learn how to use both the data-win-bind and data-win-bindsource attributes. You also learn how to use calculated properties and converters to format the value of a property automatically when performing data binding. By taking advantage of WinJS data binding, you can use the Model-View-ViewModel (MVVM) pattern when building Metro style applications with JavaScript. By using the MVVM pattern, you can prevent your JavaScript code from spinning into chaos. The MVVM pattern provides you with a standard pattern for organizing your JavaScript code which results in a more maintainable application. Using Declarative Bindings You can use the data-win-bind attribute with any HTML element in a page. The data-win-bind attribute enables you to bind (associate) an attribute of an HTML element to the value of a property. Imagine, for example, that you want to create a product details page. You want to show a product object in a page. In that case, you can create the following HTML page to display the product details: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Application1</title> <!-- WinJS references --> <link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet"> <script src="//Microsoft.WinJS.0.6/js/base.js"></script> <script src="//Microsoft.WinJS.0.6/js/ui.js"></script> <!-- Application1 references --> <link href="/css/default.css" rel="stylesheet"> <script src="/js/default.js"></script> </head> <body> <h1>Product Details</h1> <div class="field"> Product Name: <span data-win-bind="innerText:name"></span> </div> <div class="field"> Product Price: <span data-win-bind="innerText:price"></span> </div> <div class="field"> Product Picture: <br /> <img data-win-bind="src:photo;alt:name" /> </div> </body> </html> The HTML page above contains three data-win-bind attributes – one attribute for each product property displayed. You use the data-win-bind attribute to set properties of the HTML element associated with the data-win-attribute. The data-win-bind attribute takes a semicolon delimited list of element property names and data source property names: data-win-bind=”elementPropertyName:datasourcePropertyName; elementPropertyName:datasourcePropertyName;…” In the HTML page above, the first two data-win-bind attributes are used to set the values of the innerText property of the SPAN elements. The last data-win-bind attribute is used to set the values of the IMG element’s src and alt attributes. By the way, using data-win-bind attributes is perfectly valid HTML5. The HTML5 standard enables you to add custom attributes to an HTML document just as long as the custom attributes start with the prefix data-. So you can add custom attributes to an HTML5 document with names like data-stephen, data-funky, or data-rover-dog-is-hungry and your document will validate. The product object displayed in the page above with the data-win-bind attributes is created in the default.js file: (function () { "use strict"; var app = WinJS.Application; app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { var product = { name: "Tesla", price: 80000, photo: "/images/TeslaPhoto.png" }; WinJS.Binding.processAll(null, product); } }; app.start(); })(); In the code above, a product object is created with a name, price, and photo property. The WinJS.Binding.processAll() method is called to perform the actual binding (Don’t confuse WinJS.Binding.processAll() and WinJS.UI.processAll() – these are different methods). The first parameter passed to the processAll() method represents the root element for the binding. In other words, binding happens on this element and its child elements. If you provide the value null, then binding happens on the entire body of the document (document.body). The second parameter represents the data context. This is the object that has the properties which are displayed with the data-win-bind attributes. In the code above, the product object is passed as the data context parameter. Another word for data context is view model.  Creating Complex View Models In the previous section, we used the data-win-bind attribute to display the properties of a simple object: a single product. However, you can use binding with more complex view models including view models which represent multiple objects. For example, the view model in the following default.js file represents both a customer and a product object. Furthermore, the customer object has a nested address object: (function () { "use strict"; var app = WinJS.Application; app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { var viewModel = { customer: { firstName: "Fred", lastName: "Flintstone", address: { street: "1 Rocky Way", city: "Bedrock", country: "USA" } }, product: { name: "Bowling Ball", price: 34.55 } }; WinJS.Binding.processAll(null, viewModel); } }; app.start(); })(); The following page displays the customer (including the customer address) and the product. Notice that you can use dot notation to refer to child objects in a view model such as customer.address.street. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Application1</title> <!-- WinJS references --> <link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet"> <script src="//Microsoft.WinJS.0.6/js/base.js"></script> <script src="//Microsoft.WinJS.0.6/js/ui.js"></script> <!-- Application1 references --> <link href="/css/default.css" rel="stylesheet"> <script src="/js/default.js"></script> </head> <body> <h1>Customer Details</h1> <div class="field"> First Name: <span data-win-bind="innerText:customer.firstName"></span> </div> <div class="field"> Last Name: <span data-win-bind="innerText:customer.lastName"></span> </div> <div class="field"> Address: <address> <span data-win-bind="innerText:customer.address.street"></span> <br /> <span data-win-bind="innerText:customer.address.city"></span> <br /> <span data-win-bind="innerText:customer.address.country"></span> </address> </div> <h1>Product</h1> <div class="field"> Name: <span data-win-bind="innerText:product.name"></span> </div> <div class="field"> Price: <span data-win-bind="innerText:product.price"></span> </div> </body> </html> A view model can be as complicated as you need and you can bind the view model to a view (an HTML document) by using declarative bindings. Creating Calculated Properties You might want to modify a property before displaying the property. For example, you might want to format the product price property before displaying the property. You don’t want to display the raw product price “80000”. Instead, you want to display the formatted price “$80,000”. You also might need to combine multiple properties. For example, you might need to display the customer full name by combining the values of the customer first and last name properties. In these situations, it is tempting to call a function when performing binding. For example, you could create a function named fullName() which concatenates the customer first and last name. Unfortunately, the WinJS library does not support the following syntax: <span data-win-bind=”innerText:fullName()”></span> Instead, in these situations, you should create a new property in your view model that has a getter. For example, the customer object in the following default.js file includes a property named fullName which combines the values of the firstName and lastName properties: (function () { "use strict"; var app = WinJS.Application; app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { var customer = { firstName: "Fred", lastName: "Flintstone", get fullName() { return this.firstName + " " + this.lastName; } }; WinJS.Binding.processAll(null, customer); } }; app.start(); })(); The customer object has a firstName, lastName, and fullName property. Notice that the fullName property is defined with a getter function. When you read the fullName property, the values of the firstName and lastName properties are concatenated and returned. The following HTML page displays the fullName property in an H1 element. You can use the fullName property in a data-win-bind attribute in exactly the same way as any other property. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Application1</title> <!-- WinJS references --> <link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet"> <script src="//Microsoft.WinJS.0.6/js/base.js"></script> <script src="//Microsoft.WinJS.0.6/js/ui.js"></script> <!-- Application1 references --> <link href="/css/default.css" rel="stylesheet"> <script src="/js/default.js"></script> </head> <body> <h1 data-win-bind="innerText:fullName"></h1> <div class="field"> First Name: <span data-win-bind="innerText:firstName"></span> </div> <div class="field"> Last Name: <span data-win-bind="innerText:lastName"></span> </div> </body> </html> Creating a Converter In the previous section, you learned how to format the value of a property by creating a property with a getter. This approach makes sense when the formatting logic is specific to a particular view model. If, on the other hand, you need to perform the same type of formatting for multiple view models then it makes more sense to create a converter function. A converter function is a function which you can apply whenever you are using the data-win-bind attribute. Imagine, for example, that you want to create a general function for displaying dates. You always want to display dates using a short format such as 12/25/1988. The following JavaScript file – named converters.js – contains a shortDate() converter: (function (WinJS) { var shortDate = WinJS.Binding.converter(function (date) { return date.getMonth() + 1 + "/" + date.getDate() + "/" + date.getFullYear(); }); // Export shortDate WinJS.Namespace.define("MyApp.Converters", { shortDate: shortDate }); })(WinJS); The file above uses the Module Pattern, a pattern which is used through the WinJS library. To learn more about the Module Pattern, see my blog entry on namespaces and modules: http://stephenwalther.com/blog/archive/2012/02/22/windows-web-applications-namespaces-and-modules.aspx The file contains the definition for a converter function named shortDate(). This function converts a JavaScript date object into a short date string such as 12/1/1988. The converter function is created with the help of the WinJS.Binding.converter() method. This method takes a normal function and converts it into a converter function. Finally, the shortDate() converter is added to the MyApp.Converters namespace. You can call the shortDate() function by calling MyApp.Converters.shortDate(). The default.js file contains the customer object that we want to bind. Notice that the customer object has a firstName, lastName, and birthday property. We will use our new shortDate() converter when displaying the customer birthday property: (function () { "use strict"; var app = WinJS.Application; app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { var customer = { firstName: "Fred", lastName: "Flintstone", birthday: new Date("12/1/1988") }; WinJS.Binding.processAll(null, customer); } }; app.start(); })(); We actually use our shortDate converter in the HTML document. The following HTML document displays all of the customer properties: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Application1</title> <!-- WinJS references --> <link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet"> <script src="//Microsoft.WinJS.0.6/js/base.js"></script> <script src="//Microsoft.WinJS.0.6/js/ui.js"></script> <!-- Application1 references --> <link href="/css/default.css" rel="stylesheet"> <script src="/js/default.js"></script> <script type="text/javascript" src="js/converters.js"></script> </head> <body> <h1>Customer Details</h1> <div class="field"> First Name: <span data-win-bind="innerText:firstName"></span> </div> <div class="field"> Last Name: <span data-win-bind="innerText:lastName"></span> </div> <div class="field"> Birthday: <span data-win-bind="innerText:birthday MyApp.Converters.shortDate"></span> </div> </body> </html> Notice the data-win-bind attribute used to display the birthday property. It looks like this: <span data-win-bind="innerText:birthday MyApp.Converters.shortDate"></span> The shortDate converter is applied to the birthday property when the birthday property is bound to the SPAN element’s innerText property. Using data-win-bindsource Normally, you pass the view model (the data context) which you want to use with the data-win-bind attributes in a page by passing the view model to the WinJS.Binding.processAll() method like this: WinJS.Binding.processAll(null, viewModel); As an alternative, you can specify the view model declaratively in your markup by using the data-win-datasource attribute. For example, the following default.js script exposes a view model with the fully-qualified name of MyWinWebApp.viewModel: (function () { "use strict"; var app = WinJS.Application; app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { // Create view model var viewModel = { customer: { firstName: "Fred", lastName: "Flintstone" }, product: { name: "Bowling Ball", price: 12.99 } }; // Export view model to be seen by universe WinJS.Namespace.define("MyWinWebApp", { viewModel: viewModel }); // Process data-win-bind attributes WinJS.Binding.processAll(); } }; app.start(); })(); In the code above, a view model which represents a customer and a product is exposed as MyWinWebApp.viewModel. The following HTML page illustrates how you can use the data-win-bindsource attribute to bind to this view model: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Application1</title> <!-- WinJS references --> <link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet"> <script src="//Microsoft.WinJS.0.6/js/base.js"></script> <script src="//Microsoft.WinJS.0.6/js/ui.js"></script> <!-- Application1 references --> <link href="/css/default.css" rel="stylesheet"> <script src="/js/default.js"></script> </head> <body> <h1>Customer Details</h1> <div data-win-bindsource="MyWinWebApp.viewModel.customer"> <div class="field"> First Name: <span data-win-bind="innerText:firstName"></span> </div> <div class="field"> Last Name: <span data-win-bind="innerText:lastName"></span> </div> </div> <h1>Product</h1> <div data-win-bindsource="MyWinWebApp.viewModel.product"> <div class="field"> Name: <span data-win-bind="innerText:name"></span> </div> <div class="field"> Price: <span data-win-bind="innerText:price"></span> </div> </div> </body> </html> The data-win-bindsource attribute is used twice in the page above: it is used with the DIV element which contains the customer details and it is used with the DIV element which contains the product details. If an element has a data-win-bindsource attribute then all of the child elements of that element are affected. The data-win-bind attributes of all of the child elements are bound to the data source represented by the data-win-bindsource attribute. Summary The focus of this blog entry was data binding using the WinJS library. You learned how to use the data-win-bind attribute to bind the properties of an HTML element to a view model. We also discussed several advanced features of data binding. We examined how to create calculated properties by including a property with a getter in your view model. We also discussed how you can create a converter function to format the value of a view model property when binding the property. Finally, you learned how to use the data-win-bindsource attribute to specify a view model declaratively.

    Read the article

< Previous Page | 2294 2295 2296 2297 2298 2299 2300 2301 2302 2303 2304 2305  | Next Page >