JavaScript - Twitter Rest Api, Update Status?

Hi i'm in need of some help with a javascript function I have been working day and night trying to get this to work and its almost there, basicly what I am trying to do is create a facebook like status update box with user tagging and member search drop down.

Currently I have the status update input where users can enter in their status update, this also has a user tagging system with it which when you type the '@' symbol the friend search displays and once a name is clicked the @ sign plus what you was writing gets replaced with that name but what I am in need of is someone who can sort this problem out, this problem is I want the user to click on the name but once clicked i need the name to show up as a blue link just like facebook do and also i need the backend of the system to check when a name is click to get the id number of that user and set the bbcode in the status area as my bbcode system uses [quote=123432]username[/quote] which is how what quotes the user now I also need to have a rich text area instead of the standard html one as I need the area to display the link and not the bbcode.

If any one can help please reply, Thank you, DJCMBear.

P.S. Here are the codes I have so far just for someone to over look to see if they can sort it out.

The Javascript Class:
Code:

<script type="text/javascript">
var SDK = {
  setCursor: function(el)
  {
    if(el.selectionStart)
    {
      return el.selectionStart;
    }
    else if (document.selection)
    {
      el.focus();
      var r = document.selection.createRange();
      if (r == null)
      {
        return 0;
      }
      var re = el.createTextRange(),
      rc = re.duplicate();
      re.moveToBookmark(r.getBookmark());
      rc.setEndPoint('EndToStart', re);
      return rc.text.length;
    } 
    return 0;
  },

  displayFriends: function(cp)
  {
    var friendSession = document.getElementById('fsi');
    var friendSelect  = document.getElementById('fs');
    var selectText    = document.getElementById('fst');
    var info          = friendSession.value.split(':');
    var checker       = info[0];
    var position      = parseInt(info[1]);
    if(window.event.keyCode == 192 && friendSession.value == 0)
    {
      friendSelect.style.display = 'block';
      friendSession.value = 1+':'+this.setCursor(cp);
    }
    else if(friendSession.value == 0)
    {
      friendSelect.style.display = 'none';
    }
    else if(friendSession.value == 1 && window.event.keyCode == 8 && selectText.value.substr(position,1) != "@")
    {
      friendSession.value = 0;
      friendSelect.style.display = 'none';
    }
  },
  
  selectFriend: function(selection)
  {
    var input    = document.getElementById('fst');
    var info     = document.getElementById('fsi').value.split(':');
    var checker  = info[0];
    var position = parseInt(info[1]);
    if(checker == 1)
    {
      input.focus();
      input.value = input.value.substring(0,position)+selection.innerHTML+' ';
      document.getElementById('fsi').value = 0;
      document.getElementById('fs').style.display = 'none';
      input.focus();
    }
  },

  shrink: function(current,newid)
  {
    var friendSession = document.getElementById('fsi');
    var old = document.getElementById(newid);
    if(current.value == '' && friendSession.value.substring(0,1) != 1)
    {
      current.style.display = 'none';
      current.value = '';
      old.style.display = 'block';
    }
  },

  grow: function(current,newid)
  {
    var input = document.getElementById(newid);
    current.style.display = 'none';
    input.style.display = 'block';
    input.style.height = '70px';
    input.focus();
  },

  StatusForm: function(info)
  {
    var form  = "<div id=\"statusUpdater\"><div onclick=\"SDK.grow(this,\'fst\');\" id=\"dfst\">"+info.defaultTxt+"</div>";
        form += "<textarea style=\"display:none;\" id=\"fst\" onclick=\"SDK.grow(this,'fst');\" onblur=\"SDK.shrink(this,'dfst');\" onkeydown=\"SDK.displayFriends(this);\" onkeyup=\"SDK.displayFriends(this);\"></textarea>";
        form += "<input type=\"hidden\" id=\"fsi\" value=\"0\" /><div id=\"fs\" style=\"display:none;\">";
        form += "<ul><li onclick=\"SDK.selectFriend(this);\" style=\"cursor:pointer;\">Bobby Frank</li>";
        form += "<li onclick=\"SDK.selectFriend(this);\" style=\"cursor:pointer;\">Dan Dave</li>";
        form += "<li onclick=\"SDK.selectFriend(this);\" style=\"cursor:pointer;\">John Doe</li></ul></div></div>";
    document.write(form);
  }
}
</script>

The CSS Styles:
Code:

<style type="text/css">
* {
  margin: 0;
  padding: 0;
}

#statusUpdater {
  width: 500px;
  margin: 30px auto;
}

#fst {
  width: 100%;
}

#dfst {
  width: 98.5%;
}

#fst, #dfst {
  font-family: arial;
  padding: 3px;
  font-size: 14px;
  resize: none;
  border: 1px solid #666;
  color: #666;
  cursor: text;
  background: #fff;
  overflow-y: auto;
  height: 16px;
}

#fs {
  margin: 0;
  width: 99.8%;
  border: 1px solid #000;
  border-top: 0px;
}

#fs ul {
  list-style: none;
}

#fs li {
  padding: 3px;
}
</style>

The Javascript Form Call:
Code:

<script type="text/javascript">SDK.StatusForm({'defaultTxt':'What\'s on your mind?','action':'http:\/\/www.example.com\/ajax\/statusPost.ax'});</script>

Is there a way of doing this with javascript?

I have a homepage, that has to go to a certain directory, find the newer TXT file, get the first paragraph, get it formated with H1 tag, then read the rest format it with a P tag.

So everytime a new TXT file is created in that directory the homepage (HTML/index.html) change.

Thank in advance

Miguel Sanchez

Is there a way of doing this with java script?

I have a homepage, that has to go to a certain directory, find the newer TXT file, get the first paragraph, get it formated with H1 tag, then read the rest format it with a P tag.

So everytime a new TXT file is created in that directory the homepage (HTML/index.html) change.

Thank in advance

Miguel Sanchez

Hi All
I have a list of links on my website with anchors coded the following way:

<ul class="fav"><a href="/cgi-bin/send.pl?ID=XX" onMouseOver="window.status='http://www.domain.com'; return true;" onMouseOut="func_clear(); return true;" onClick="stat(294);" target="_blank">Linked domain name</a></ul>

Then I have found on http://www.askthecssguy.com/2006/12/..._favicons.html
a javascript to display a favicon image before each one of my links in the list;
this script is working fine when getting the domain name from href value.
But in my case the suitable domain name to load each favicon is present in window.status value.

I have played a bit with the above scripts and finally I'm trying to use the following function:

Code:

function faviconizeFavicon() { 
  if (!document.getElementsByTagName) return false;
  if (!document.createElement) return false;
  var ul = document.getElementsByTagName("ul");
  for (var i=0; i<ul.length; i++) {
  	if (ul[i].className == "fav") {
  		var links = ul[i].getElementsByTagName("a");
  		for (var j=0; j<links.length; j++) {
  		var hrefvalue = links[j].parentNode.innerHTML;
	             var domain = 'default_favicon.gif';		
domain = hrefvalue.match(/(\w+):\/\/([^/:]+)(:\d*)?([^# ]*)\'/g);
			
try{
	             var cue1 = document.createElement("img");
		cue1.className = "favicon";
		cue1.src = 'default_favicon.gif';
		cue1.id = 'img' +i+ j;
		links[j].parentNode.insertBefore(cue1,links[j]);						

		var cue = document.createElement("img");
		cue.className = "favicon";

		var cuesrc = "http://"+ domain + "/favicon.ico";
		cuesrc = cuesrc.replace("http://http://","http://");
		cuesrc = cuesrc.replace("'/favicon.ico","/favicon.ico");
		cue.setAttribute("imgid",'img' +i+ j);
		cue.setAttribute("src",cuesrc);
		cue.onload = function () {
		document.getElementById(this.getAttribute("imgid")).src = this.src;
		}
		cue.setAttribute("src",cuesrc);
		}
		catch ( ex )
		{
		}						
		}
  	}
  }
}

This javascript should display first the default locally available favicon gif before each link and then try to load original favicons from each domain and display them at the place of default favicon gif only if available.

The above code works with any console errors but very randomly and not with all websites ??
Some favicons are loaded from distant websites and some of them never, independing of network quality or other factors!

So I'm wondering why this code is not working for each link ?


My question is:

could you please have a look on my following Regex if this should work in every case with each domain name ?

domain = hrefvalue.match(/(\w+):\/\/([^/:]+)(:\d*)?([^# ]*)\'/g);

I put the apostrophe at the end because my url in window.status is always ended by a single closing.

Also I'm asking if taking into account that ONLY my window.status value is placed between single apostrophes and ALL other values of my anchors are opened and closed with double apostrophes, maybe it would be easier to get my domain value searching for any value between two single apostrophes ??

My another question is:
Is it possible that other javascripts present in my html code could interfere with this script and make it working randomly ?

Thanks in advance for any clues

Is the window.status still useful nowadays or is it outdated? If it is still used, why doesn't this work please?

Code:

<a href="javascript_status_bar_messages.cfm"
  onMouseover="JavaScript:window.status='Status Bar Message goes here'; return true"
  onMouseout="JavaScript:window.status=''; return true">Hover over me!</a>

Hi.
I'm currently putting together a website. On one of my pages, I get "Error on page" in the status bar when viewing it in Internet Explorer. I don't get this message in Firefox. I have an external javascript (code below) for tooltips on the webpage. I did not write the script, I merely changed one or two things.
When I double click the status bar to see what the message is, it says:

'tt.timer' is null or not an object.
Line: 70
Char: 3

I'm new to javascript, and so I'm not sure of what I need to alter. Can anyone see what i'm missing/doing wrong?
Any help would be really appreciated!

Code:

var tooltip=function(){
 var id = 'tt';
 var top = 3;
 var left = 3;
 var maxw = 300;
 var speed = 60;
 var timer = 20;
 var endalpha = 95;
 var alpha = 0;
 var tt,t,c,b,h;
 var ie = document.all ? true : false;
 return{
  show:function(v,w){
   if(tt == null){
    tt = document.createElement('div');
    tt.setAttribute('id',id);
    t = document.createElement('div');
    t.setAttribute('id',id + 'top');
    c = document.createElement('div');
    c.setAttribute('id',id + 'cont');
    b = document.createElement('div');
    b.setAttribute('id',id + 'bot');
    tt.appendChild(t);
    tt.appendChild(c);
    tt.appendChild(b);
    document.body.appendChild(tt);
    tt.style.opacity = 0;
    tt.style.filter = 'alpha(opacity=0)';
    document.onmousemove = this.pos;
   }
   tt.style.display = 'block';
   c.innerHTML = v;
   tt.style.width = w ? w + 'px' : 'auto';
   if(!w && ie){
    t.style.display = 'none';
    b.style.display = 'none';
    tt.style.width = tt.offsetWidth;
    t.style.display = 'block';
    b.style.display = 'block';
   }
  if(tt.offsetWidth > maxw){tt.style.width = maxw + 'px'}
  h = parseInt(tt.offsetHeight) + top;
  clearInterval(tt.timer);
  tt.timer = setInterval(function(){tooltip.fade(1)},timer);
  },
  pos:function(e){
   var u = ie ? event.clientY + document.getElementById('faqid').scrollTop : e.pageY;
   var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX;
   tt.style.top = (u - h) + 'px';
   tt.style.left = (l + left) + 'px';
  },
  fade:function(d){
   var a = alpha;
   if((a != endalpha && d == 1) || (a != 0 && d == -1)){
    var i = speed;
   if(endalpha - a < speed && d == 1){
    i = endalpha - a;
   }else if(alpha < speed && d == -1){
     i = a;
   }
   alpha = a + (i * d);
   tt.style.opacity = alpha * .01;
   tt.style.filter = 'alpha(opacity=' + alpha + ')';
  }else{
    clearInterval(tt.timer);
     if(d == -1){tt.style.display = 'none'}
  }
 },
 hide:function(){
  clearInterval(tt.timer);
   tt.timer = setInterval(function(){tooltip.fade(-1)},timer);
  }
 };
}();

I've started studying JavaScript recently. The following simple scenario from the Russian textbook is not implemented properly on my PC.
Code:

<HTML>
<HEAD>
<TITLE>Link Description</TITLE>

<SCRIPT LANGUAGE="JavaScript">
function describe(text) {
	window.status = text;
	return true;
}
function clearstatus() {
window.status="";
}
</SCRIPT>

</HEAD>
<BODY>
<h1>Link Description</h1>
<P><i>Put mouse pointer over links to display their description</i></P>
<ul>
<li><A HREF="order.html"
	onMouseOver="describe('Закажите товар'); return true;"
	onMouseOut="clearstatus()";>
Заказ товаров</A>
<li><A HREF="email.html"
	onMouseOver="describe('Направьте письмо'); return true;"
	onMouseOut="clearstatus()";>
Email</A>
<li><A HREF="complain.html"
	onMouseOver="describe('Раскритикуйте все'); return true;"
	onMouseOut="clearstatus()";>
Отдел защиты прав потребителей</A>
</ul>
</BODY>
</HTML>

I just typed the script from the book char by char. I use Firefox browser, v.3.5.7. The error console does not display any mistakes.
Please, explain me why on placing mouse over a link the status bar displays A HREF text instead of the link description.

How do I check the status of a style?

I thought something like this would work, but no joy: Code:

divTest = document.getElementById('link_container');
if (document.divTest.style.display == "none") {
}

I have a simple problem, I can't get the status bar to change. I am very new to javascript, and I am trying to practice some simple commands, and the onMouseOver event is suppose to change the status bar in my window. I can get it to change for onMouseOut but not onMouseOver. Here is what I have so far

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>
<HEAD>
<TITLE>Exam</TITLE>
</HEAD>

<BODY>

<H3>My Page</H3>


<a href="http://www.google.com"
onMouseOver="window.status='Visit google.';return true;"
onMouseOut="window.status='Come back soon ';return true;">Visit Google</a>


</BODY>
</HTML>

Hello guys,

The following excerpt is part of a very huge project(in terms of code involved). Pardon me if it lacks a bit of context. But I assume I have posted adequate information for understanding the problem.

Code:

var sztitlebar_specific= "<table cellpadding='0px' cellspacing='0px' width='100%'><tr>" +"<td class='tiletitle'>" 
"<img src='../images/alert.gif' onclick='toggleAlerts(\"#ID#\")' alt='Toggle Alerts' title='Toggle Alerts' style='cursor: hand'>" + 
"<input type='checkbox' name='pricesonlycb' onclick='parent.applyFilterPricesOnly(\"#ID#\",pricesonlycb.checked,mypricesonlycb.checked,\"#NAME#\")'>" + 
"<input type='checkbox' name='mypricesonlycb' onclick='parent.applyFilterPricesOnly(\"#ID#\",pricesonlycb.checked,mypricesonlycb.checked,\"#NAME#\")'>" +
"<td class='tiletitle' style='text-align: center'>#NAME#</td>" + 
 </tr></table>";

The onclick event fires without any trouble, and the following function is called.
Code:

function applyFilterPricesOnly(filterid, pricesonly, mypricesonly,filtername){
alert("applyFilterPricesOnly called: filterid =" + filterid + "filtername =" + filtername + "mypricesonly =" + mypricesonly + " pricesonly=" + pricesonly);
}

But when I alert the status of the checkboxes they show up as "undefined". As you can see, the first piece of code defines a titlebar with a button and a couple of checkboxes and the name of the titlebar. And it is these checkboxes that remain undefined even though I can see them and check and uncheck them. But the name of the titlebar gets passed to the function correctly when the onclick event fires and it gets alerted. Where am I going wrong?

Hi Everyone,

Has anyone noticed the twitter confirmation box (when you hit save in Settings, the page refreshes and a white confitmation box appears along the top of the screen and disappears again in a few seconds)?

Does anyone know how to go about implementing this? My JS skills would not be the best. I wonder is there a jquery plugin that I could use or similar?

Thanks in advance,
Brian

Hi,

I am writing an application which needs to open a modal dialog window in a secure connection. I am able to open the dialog using HTTPS, but on the status bar I cannot see the SSL Padlock. The application is being written in .NET and the browser I use is IE 6.0.

Any suggestions and feedback are welcome.

Regards
Totre

Hello, i wanna use NiceEdit text editor in my site.
but when i load the editor page, always i find the editor non-active, i have to click inside the textarea to active the textarea and the editor. have a look at the demo here http://nicedit.com/demos.php
so i want to set the editor default status active without clicking inside the textarea to active it, so how can i do that please ??
thanks

Hi All,

I have a form that captures member registration details. In the admin section .. I would like to change the Status field of a record/s from NEW to PAYMENT DUE after 14 days from the data of submission. The status change should automatically trigger on the 15th day. So when the admin checks the list page he/she should be able to view the updated status field.

Any pointers how to accomplish this?

Thanks in advance.

Vinny