fazworld

Q: Why is adding HTML code so difficult?

I'm trying to add a weather widget into my book.  Yes, I've been spending a lot of time looking into dashcode and creating the widget from scratch, but I can't get it done.  Even though I got Xcode and dashcode installed, I'm not that technically inclined and can't figure out how to take this snippet:

 

<script src="http://weatherandtime.net/swfobject.js" type="text/javascript" ></script><div id="div_weather_05" style="padding:0px;text-align:center; margin:auto auto;width:170px; height:220px;"><div style="padding:1px;position:relative; z-index:100; color:#FFFFFF; text-align:center;left:50px;top:182px; width:115px;height:auto;overflow:hidden;"><a style="margin:0px; padding:3px; color:#FFFFFF; text-decoration:none; font-size:12px;" href="http://weatherandtime.net/en/Asia/Sri-Lanka/Colombo-weather.html" title="Colombo Weather"><nobr>Colombo Weather</nobr></a></div><span id="swf_weather_05"> </span></div><script type="text/javascript" language="Javascript">swfobject.embedSWF("http://weatherandtime.net/weather_05.swf", "swf_weather_05", "170", "200", "10","weather_05.swf", {city: "19459",lang:"en"}, {menu:"false",wmode:"transparent",allowScriptAccess:"always"}, {id:"weather_05",name:"weather_05"});</script>

 

and make it into a widget that I can just drag and drop into the book's HTML widget window.  Is there an easier way to do this?  Otherwise, unfortunately, I don't think I'll be able to use some of these key features.

Posted on Jan 22, 2012 10:51 AM

Close

Q: Why is adding HTML code so difficult?

  • All replies
  • Helpful answers

Previous Page 2 of 4 last Next
  • by imshapp,

    imshapp imshapp Jan 26, 2012 7:00 AM in response to pordux
    Level 1 (0 points)
    Jan 26, 2012 7:00 AM in response to pordux

    pordux,

     

    Have you had any trouble with video in the HTML widget? You mentioned audio - just wondering if you have been successful with video as we're trying to create a videoPlayer with related video thumbnails (similar to YouTube) but the HTML widget won't accept our wdgt when it includes either .m4v or .mp4 video. We've exported the videos per Apple's recommendations with not luck in the HTML widget - but the same videos work just fine when dropped onto the canvas as a media element.

  • by pordux,

    pordux pordux Jan 26, 2012 11:24 AM in response to imshapp
    Level 1 (0 points)
    Jan 26, 2012 11:24 AM in response to imshapp

    hei, sounds like a nice project...

     

    Well first of all i didn't try video, only audio, but had to make a lot of workarounds...

     

    i used jQuery and the HTML5 library jPlayer and that worked very good also combined with fancyBox

     

    first of all the only audio accepted was .m4a, but something where weird and allways rejected, i have used some other non apple audio converter to convert from .mp3 to .m4a.... so what i did was, open each .m4a in quicktime, and export again in the same .m4a format, for some reason that new (heavy) .m4a adio was not rejected.... 

     

    after that widget was accepted and works very well...

     

    Hope this helps, and would like to see how do you do with your project, I'm a graphic designer, so if you need a hand, i can help....

  • by frato,

    frato frato Jan 27, 2012 1:02 AM in response to pordux
    Level 1 (30 points)
    Jan 27, 2012 1:02 AM in response to pordux

    Pordux, would you share your bundle for testing ?

     

    I am able to create an html widget with m4a audio files, but when testing on an iPad, the audio player (using html5 <audio> tag) says it can't play the file. Any idea ?

  • by auralsculpture,

    auralsculpture auralsculpture Feb 9, 2012 5:45 PM in response to frato
    Level 1 (5 points)
    Feb 9, 2012 5:45 PM in response to frato

    I'm having the same issues, see thread  https://discussions.apple.com/thread/3724572?tstart=0

     

    I'm pretty restricted in my coding skills, hence the use of Hype ... so I don't know how to integrate the jplayer.

    Starting to learn how to tweak Hype's javascript outputs though so maybe there's hope for me yet ..

  • by M_Anz,

    M_Anz M_Anz Feb 23, 2012 1:21 PM in response to fazworld
    Level 1 (0 points)
    Feb 23, 2012 1:21 PM in response to fazworld

    Hello all

    is there any step by step tutorial available to get interactive panoramas in a widget?

    Thanks for the reply

  • by Fabe,

    Fabe Fabe Feb 23, 2012 1:28 PM in response to M_Anz
    Level 3 (620 points)
    Feb 23, 2012 1:28 PM in response to M_Anz

    You should start a new discussion. - Fabe

  • by K T,

    K T K T Feb 23, 2012 1:33 PM in response to M_Anz
    Level 7 (23,844 points)
    Publishing
    Feb 23, 2012 1:33 PM in response to M_Anz

    >interactive panoramas in a widget?

     

    An interactive timeline widget is available at

     

    http://www.classwidgets.com/widget/timeline

     

    Perhaps you can get some tips

  • by frato,

    frato frato Feb 24, 2012 1:54 AM in response to M_Anz
    Level 1 (30 points)
    Feb 24, 2012 1:54 AM in response to M_Anz

    With Panotour Pro you can export directly to an iBooks html widget : http://www.kolor.com/blog-en/2012/02/04/panotour-panotour-pro-1-7-2-export-virtu al-tours-for-ibooks/

  • by M_Anz,

    M_Anz M_Anz Feb 24, 2012 3:45 AM in response to M_Anz
    Level 1 (0 points)
    Feb 24, 2012 3:45 AM in response to M_Anz

    Hello I opened a new disscusion

    Creating virtual 360° panorama for iPad

    thanks for your hints

     

    brgds Marc

  • by Rycankun,

    Rycankun Rycankun Jun 5, 2012 3:01 AM in response to imshapp
    Level 1 (0 points)
    Jun 5, 2012 3:01 AM in response to imshapp

    hey everyone,

     

    This has been a topic I have been following very closely as not being able to locally store videos in a widget has been a huge thorn in my side.

     

    I have tried a few different things but, still haven't been able to get anything to work.

     

    I was really close to getting something that may work and wanted to throw it out there to see if anyone else has suggestions or similar ideas.

     

    What I did was add the video to the hype file as an .m4v and then exported to an html 5 widget.

     

    I then opened the contents and changed the extension of the .m4v file to .mp4 (strangely this worked and let me add the file into ibooks author, despite the fact that adding a real mp4 file does not work.

     

    I then exported the ibook author file as an ibook, and then changed the extension to .zip and extracted it.

     

    and changed the file back to .m4v.

     

    I also tried to leave it as a .mp4, and also tried replacing the .m4v file with the .mp4 file and changing the reference in the hype.js file, unfortunately all to no avail.

     

    unfortunately the video does not playback, but I wanted to throw this process out to see if anyone else has tried anything similar or could offer any suggestions on something else to try.

  • by pordux,

    pordux pordux Jun 5, 2012 6:11 AM in response to fazworld
    Level 1 (0 points)
    Jun 5, 2012 6:11 AM in response to fazworld

    Hello everybody, i tried one month ago using http://jplayer.org/

     

    for this you need to add jquery, I havent tried with video, but with audio worked very well,

     

    pordux

  • by cmath,

    cmath cmath Jun 5, 2012 6:30 AM in response to Rycankun
    Level 1 (0 points)
    Jun 5, 2012 6:30 AM in response to Rycankun

    I tried jplayer with mp4 video and it didn't work. We're using with m4a audio though and it's working great. Maybe a combination of jplayer and Rycankun's suggestion would work - or even using HTML5 video tags. I had tried adding .mp4 video files to my widgets and always got the 'widget not added b/c of unsupported file types' error. We've been using m4v video files in the Media widget instead but have still been looking for a solution to use video in HTML widgets. As a test I just tried changing one of our m4v video files to have the mp4 ext and I was able to add it to the widget. Changing the file ext back to m4v gave me the 'unsupported file' error again so perhaps Rycankun is correct. I'm going to try to hook one up to play the video from my html code and will post results shortly. Thanks Rycankun for the possible work-around!!

  • by cmath,

    cmath cmath Jun 5, 2012 8:44 AM in response to Rycankun
    Level 1 (0 points)
    Jun 5, 2012 8:44 AM in response to Rycankun

    Bingo! Thanks Rycankun! Sometimes it's the most simple solution. To re-cap...if you have a m4v video that will work in a Media Widget then you can simply change the file ext to mp4 and use it in a HTML Widget. Simply making a mp4 from Quicktime or Compressor doesn't seem to work though.

     

    A few thoughts about encoding -- we started out using the documented Quicktime 10 > Export > Format iPod touch & iPhone 3GS but there's no control over the video/audio compression settings. We then went to Compressor and used a modified version of the SD or HD preset for Apple devices - had more control but still weren't able to get the files as small as we needed at the quality we desired. We finally have settled on using Handbrake to create our mp4 using the iPhone & iPod Touch preset and adjusting the Constant bitrate RF value and audio settings to get the quality we desired. The resulting mp4 is not directly useable in iBA but it's easy to convert the mp4 container to a m4v contrainer using Subler (for Mac) to transcode to Main @ 3.1 profile. Transcoding with Subler doesn't re-encode the video or audio - those tracks just pass through and Subler converts the movie container to the selected Main @ 3.1 profile. There's probably a way to create the m4v directly from Handbrake with Main @ 3.1 profile but so far the closest I've gotten is Baseline @ 3. Anybody have any thoughts on this?

  • by Rycankun,

    Rycankun Rycankun Jun 5, 2012 6:40 PM in response to cmath
    Level 1 (0 points)
    Jun 5, 2012 6:40 PM in response to cmath

    Hey cmath,

     

    Where you able to get it to work???

     

    If so could you send a quick example as I still havnt been able to get the video to work in the video once it is added.

     

    If you were able to get something to work could you explain what you did or maybe send a quick sample.

     

    As for video encoding I am not really sure about all of that, but if i see anything around I will make sure to update you.

     

    Thanks!

  • by cmath,

    cmath cmath Jun 6, 2012 5:21 AM in response to Rycankun
    Level 1 (0 points)
    Jun 6, 2012 5:21 AM in response to Rycankun

    I did get it to work. The key is to start with a m4v video that has the correct profile -- Main @ 3.1. When you have a properly encoded m4v video you can change the file ext to mp4 and use the video in an HTML widget. For my test I simply used the HTML5 video tag but I'm sure there are other ways to display the video like using jPlayer (jQuery plugin). Here's a link that explains the HTML5 video tag http://www.w3schools.com/html5/tag_video.asp and a link to the jPlayer plugin http://jplayer.org/

     

    If you have a mp4 video already you can open it in a program called Subler and see what the profile is. The mp4 videos I created with Handbrake were coming out as Baseline @ 3 or Baseline @ 2.2 so they won't work in IBA. So I opened these mp4 videos in Subler - it shows the current profile - and then selected the video track and changed the profile to Main @ 3.1 - added it to the queue - and exported a new m4v with the correct profile. The m4v file that is created by Subler works in the Media Widget of IBA so changing the file ext to mp4 allows me to use this video in the HTML widget.

     

    You could probably also create your m4v video by exporting from Quicktime 10 and then change the file ext to mp4 but I haven't tested that - should work though. Here's info from Apple on how to create m4v videos using QT10 http://support.apple.com/kb/HT5065.

     

    Let me know if you need more info.

Previous Page 2 of 4 last Next