Beecon Examples


Beeconjs.com

var BeeconBee = new Bee('BeeconJS.com',1); //inflate Bee. var BEEIMG = $('#beeImg'); //select image object. BeeconBee.addButton(1,"B",function(){ BEEIMG.attr('src', "/img/bee1.png"); }); //add button1 to change image. BeeconBee.addButton(2,"E",function(){ BEEIMG.attr('src', "/img/bee2.png"); }); //add button1 to change image. BeeconBee.addButton(3,"E",function(){ BEEIMG.attr('src', "/img/bee3.png"); }); //add button1 to change image.




Beecon Examples


Slideshare.net

var SlideBee = new Bee('SlideShare.net',2); var SlideURL = "http://www.slideshare.net/slideshow/embed_code/42728476"; var StartPage = 1; var AllPopup = $(".beepop"); var SlideIframe = $("#slideIframe"); var SlidePopup = $("#popupslide"); var IsSlide = false; SlideBee.addButton(1,"-",zoomInSlideScreen); SlideBee.addButton(2,"?",changeSlide); SlideBee.addButton(3,"+",zoomOutSlideScreen); SlideBee.addButton(4,"◁",previousSlide); SlideBee.addButton(5,"▶",showSlide); SlideBee.addButton(6,"▷",nextSlide); function zoomInSlideScreen() { AllPopup.popup('close'); SlideIframe.height(SlideIframe.height()/1.3); SlideIframe.width(SlideIframe.width()/1.3); setTimeout(function(){ SlidePopup.popup('open'); IsSlide = true; }, 100); }; function zoomOutSlideScreen() { AllPopup.popup('close'); SlideIframe.height(SlideIframe.height()*1.3); SlideIframe.width(SlideIframe.width()*1.3); setTimeout(function(){ SlidePopup.popup('open'); IsSlide = true; }, 100); }; function previousSlide() { if(StartPage>1) StartPage--; var nowURL = SlideURL + "?startSlide="+StartPage; SlideIframe.attr('src', nowURL); }; function showSlide() { StartPage = 1; AllPopup.popup('close'); setTimeout(function(){ SlideIframe.attr('src', SlideURL); SlidePopup.popup('open'); IsSlide = true; }, 100); }; function nextSlide() { StartPage++; var nowURL = SlideURL + "?startSlide="+StartPage; SlideIframe.attr('src', nowURL); }; function changeSlide() { //sayBee(SlideBee.BEECODE,"changePopup("+SlideURL+")"); var hey = {}; hey.action = "popup"; hey.title = "Change Slide?"; hey.searchWord = SlideURL; heyBee(SlideBee.BEECODE,hey); }; /* Slide Mode Listner */ SlidePopup.bind({ popupafterclose: function(event, ui) { IsSlide = false; } }); //override function onHeyBee(BEECODE,hey) { if(BEECODE == SlideBee.BEECODE && hey.action == "selectWord") { SlideURL = hey.searchWord; showSlide(); } }




Beecon Examples


Youtube.com

var YoutuBee = new Bee('Youtube.com',3); YoutuBee.addButton(1,"-",zoomInVideoScreen); YoutuBee.addButton(2,"△",clickVideoUpButton); YoutuBee.addButton(3,"+",zoomOutVideoScreen); YoutuBee.addButton(4,"◁",goFowardVideo); YoutuBee.addButton(5,"▶",playVideo); YoutuBee.addButton(6,"▷",goBackwardVideo); YoutuBee.addButton(7,"▤",goVideoList); YoutuBee.addButton(8,"▽",clickVideoDownButton); YoutuBee.addButton(9,"?",goSearch); var PlayLayoutTime=0; var PlayLayoutVolume=50; var IsPlay=false; var IsList=false; var WORD = "beeconjs"; var player; var PlayLayout; var VideoPopup = $("#popupVideo"); var PopupVideoList = $("#popupVideoList"); var SearchWord = $("#searchWord"); var SearchPopup = $("#searchPopup"); var SearchTitle = $("#searchTitle"); // 2. This code loads the IFrame PlayLayout API code asynchronously. var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); function onYouTubeIframeAPIReady() { player = new YT.Player('player', { height: '390', width: '640', videoId: 'Oe2mf-VKnO4', events: { 'onReady': onPlayLayoutReady, 'onStateChange': onPlayLayoutStateChange } }); } // 4. The API will call this function when the video player is ready. function onPlayLayoutReady(event) { //Youtube layout is seted on Ready state. PlayLayout = $('#player'); } function onPlayLayoutStateChange(event) { toast("Player state: " + event.data ); } function zoomInVideoScreen() { AllPopup.popup('close'); PlayLayout.height(PlayLayout.height()/1.3); PlayLayout.width(PlayLayout.width()/1.3); setTimeout(function(){ VideoPopup.popup('open'); }, 100); }; function clickVideoUpButton() { if(IsList) { var totalItem = $(".videoItem"); var totalLength = totalItem.length; for(var i in totalItem) { if(totalItem.eq(i).hasClass('selected')) { if(i==0) { totalItem.eq(i).find('#videoTitle').buttonMarkup({theme: 'a'}); totalItem.eq(i).removeClass('selected'); totalItem.eq(totalLength-1).find('#videoTitle').buttonMarkup({theme: 'b'}); totalItem.eq(totalLength-1).addClass('selected'); return; } else { var prev = parseInt(i)-1; totalItem.eq(i).find('#videoTitle').buttonMarkup({theme: 'a'}); totalItem.eq(i).removeClass('selected'); totalItem.eq(prev).find('#videoTitle').buttonMarkup({theme: 'b'}); totalItem.eq(prev).addClass('selected'); return; } } } return; } if(PlayLayoutVolume<100) PlayLayoutVolume = PlayLayoutVolume+10; player.setVolume(PlayLayoutVolume); toast("Volume UP : " + PlayLayoutVolume ); }; function zoomOutVideoScreen() { AllPopup.popup('close'); PlayLayout.height(PlayLayout.height()*1.3); PlayLayout.width(PlayLayout.width()*1.3); setTimeout(function(){ VideoPopup.popup('open'); }, 100); }; function goFowardVideo() { var nowtime = player.getCurrentTime()-15; player.seekTo(nowtime, true); toast("Foward!"); }; function playVideo() { if(IsList) { var totalItem = $(".videoItem"); for(var i in totalItem) { if(totalItem.eq(i).hasClass('selected')) { totalItem.eq(i).click(); } } return; } AllPopup.popup('close'); setTimeout(function(){ VideoPopup.popup('open'); }, 100); setTimeout(function(){ if(player.getPlayerState()==1) player.pauseVideo(); else player.playVideo(); }, 200); }; function goBackwardVideo() { var nowtime = player.getCurrentTime()+15; player.seekTo(nowtime, true); toast("Back!"); }; function goVideoList() { AllPopup.popup('close'); /* FOR IE*/ VideoPopup.popup('open'); setTimeout(function(){ VideoPopup.popup('close'); }, 100); var encodedWord = encodeURIComponent(WORD); var searchURL = "http://gdata.youtube.com/feeds/api/videos?q="+encodedWord+"&alt=json"; $.ajax({ url : searchURL, type : 'get', dataType : 'jsonp', jsonp : 'callback', success : function(data) { //alert('s'); drawList(data.feed.entry); }, error:function(request,status,error){alert(error);} }); }; function drawList(list) { //var list = getSearchList(WORD); if(!list) { toast("Not found Result!"); WORD="beeconjs"; return; } var item = $('#videoItem'); item.show(); var adapter = $('#videoList').empty(); $(list).each(function(i) { if(i>=10)return; var item2 = item.clone(); item2.find('#videoTitle').html(list[i].title.$t); var realID = list[i].id.$t; var ID = realID.replace("http://gdata.youtube.com/feeds/api/videos/",""); item2.click(function(){ AllPopup.popup('close'); player.loadVideoById(ID, 0, "auto"); setTimeout(function(){ VideoPopup.popup('open'); }, 100); }); if(i==0) { item2.find('#videoTitle').buttonMarkup({theme: 'b'}); item2.addClass('selected'); } else { item2.find('#videoTitle').buttonMarkup({theme: 'a'}); item2.removeClass('selected'); } adapter.append(item2); }); setTimeout(function(){ PopupVideoList.popup('open'); IsList = true; }, 100); } function clickVideoDownButton() { if(IsList) { var totalItem = $(".videoItem"); var totalLength = totalItem.length; for(var i in totalItem) { if(totalItem.eq(i).hasClass('selected')) { var next = parseInt(i)+1; //alert(next); if(next==totalLength) { totalItem.eq(i).find('#videoTitle').buttonMarkup({theme: 'a'}); totalItem.eq(i).removeClass('selected'); totalItem.eq(0).find('#videoTitle').buttonMarkup({theme: 'b'}); totalItem.eq(0).addClass('selected'); return; } else { totalItem.eq(i).find('#videoTitle').buttonMarkup({theme: 'a'}); totalItem.eq(i).removeClass('selected'); totalItem.eq(next).find('#videoTitle').buttonMarkup({theme: 'b'}); totalItem.eq(next).addClass('selected'); return; } } } return; } if(PlayLayoutVolume>0) PlayLayoutVolume = PlayLayoutVolume-10; player.setVolume(PlayLayoutVolume); toast("Volume DOWN : " + PlayLayoutVolume ); }; function goSearch() { //sayBee(YoutuBee.BEECODE,"searchPopup("+WORD+")"); var hey = {}; hey.action = "popup"; hey.title = "Search Video?"; hey.searchWord = WORD; heyBee(YoutuBee.BEECODE,hey); }; //override function onHeyBee(BEECODE,hey) { if(BEECODE == YoutuBee.BEECODE && hey.action == "changeWord") { WORD = hey.searchWord; //window.history.back(); AllPopup.popup('close'); SearchTitle.html("Typing :"); SearchWord.html(WORD); setTimeout(function(){ SearchPopup.popup('open'); }, 100); } if(BEECODE == YoutuBee.BEECODE && hey.action == "selectWord") { WORD = hey.searchWord; goVideoList(); } }