View Single Post
b666m's Avatar
Posts: 1,090 | Thanked: 476 times | Joined on Jan 2010 @ Ingolstadt, Germany
#351
meep... something new...

i'm trying to get this:


this is a picture of miranda using ieview and ichat for displaying the conversations.

there the bubbles are getting resized to fit the text within.
small text -> small bubble.
huge text -> huge bubble.
(ok... i don't believe that apple uses the exact same method/code but hey... it works in miranda ^^)

so i adapted the code in a first attampt to the conversation layout:


it's creating a 9 cell table via html and filling the cells with pictures and text via css.

it's not working perfectly yet...
i only implemented it for the contact's bubble...
dont worry about the misalignment of the avatar
(i was just too lazy to edit the margins ^^ but the border is in the right place as you can see)

something is messing with the default code... especially the top side of the bubble doesn't work at all :/

i attach the iChat zip-file. there you can find the iChat.css and iChat.ivt (which is just a html-file with another extension). so you can take a look at it and try to adapt the code to the rtcom-code on your own. maybe you're luckier than me.

(btw: only the html-file needs some patchwork... for the css you can mostly copy the blocks which are named in the html over...)

so here's my html-code so far:
Code:
<div id="MessageContainerOther" class="Message Other">

  <table cellpadding="0" cellspacing="0" class="recieveframe">

  <tr><td width="100%" align="right">

    <table cellpadding="0" cellspacing="0" class="recieve">

    <tr><td>

      <td class="recieveleft"><div class="recievelefttop" /></div></td>

      <td class="recievetext"><div class="recievetexttop"></div>

  <div id="MessageOther" class="MessagingBubbleOtherBackgroundColor MessagingBubbleBorderColor BubbleOther">   
    <img id="MessagePresenceOther" src="" class="MessagePresence"/>
    <span id="MessageSenderNameOther" class="MessageNameField AccentColor1 Other"></span>
    <span id="MessageTextOther" class="MessageText Other"></span>
    <div class="MessageRight Other">
      <img id="MessageBusinessCardImgOther" class="MessageBusinessCardImg" src=""/>
      <span id="MessageTimeStampOther" class="MessageTimeStamp SecondaryTextColor Other SmallSystemFont">12:30 PM</span>
      <span id="MessageDeliveryTimeStampOther" class="MessageDeliveryTimeStamp SecondaryTextColor Other SmallSystemFont"> | 1:30 PM</span>
      <img id="MessageStatusImgOther" class="MessageStatusImg" src=""/>
    </div>
  </div>

  <br /><div class="recievetextbot"></div></td>

	<td class="recieveright"><div class="recieverighttop" /></div></td>

      </td></tr>

    </table>
  </td>
  <td>&nbsp;</td>
  <td width="30" style="vertical-align: bottom;">
  <div class="Avatar">
    <div id="AvatarImgOther" class="MessageAvatar MessagingAvatarBorderColor DefaultBackgroundColor Other"></div>
  </div> 
  </td></tr>
</table>

  <div class="Avatar">
    <div id="AvatarImgOther" class="MessageAvatar MessagingAvatarBorderColor DefaultBackgroundColor Other"></div>
  </div> 
</div>
Attached Files
File Type: zip iChat.zip (75.0 KB, 127 views)

Last edited by b666m; 2010-03-05 at 22:24.
 

The Following User Says Thank You to b666m For This Useful Post: