2011-02-11 17 views
9

मैं ट्विटर विजेट के लिए प्रोफाइल पेज में एक विकल्प जोड़ने का प्रयास कर रहा हूं और मेरे पास एक ऐसा क्षेत्र है जहां उपयोगकर्ता अपने ट्विटर खाते जोड़ सकते हैं और नीचे यह विजेट का पूर्वावलोकन दिखाता है। अगर मैं खाता डालता हूं और सहेजता हूं और वापस आ जाता हूं तो यह ठीक काम करता है। लेकिन मैं जो करने की कोशिश कर रहा हूं वह इसे गतिशील बना देता है, विजेट को रीफ्रेश करने के लिए धुंध ईवेंट टेक्स्ट-फ़ील्ड पर होता है। यह गलत काम करता हैडायनामिक विजेट अपडेट करने के लिए ट्विटर विजेट विधियां

var twitterWidget = new TWTR.Widget({ 
    version: 2, 
    type: 'profile', 
    rpp: 4, 
    interval: 6000, 
    width: 'auto', 
    height: 300, 
    theme: { 
    shell: { 
     background: '#cccccc', 
     color: '#333333' 
     }, 
    tweets: { 
     background: '#ffffff', 
     color: '#333333', 
     links: '#0099cc' 
     } 
    }, 
    features: { 
    scrollbar: false, 
    loop: false, 
    live: false, 
    hashtags: true, 
    timestamp: true, 
    avatars: true, 
    behavior: 'all' 
    } 
}); 
twitterWidget.setUser(twitterUser).render().start(); 

    $('#twitter_widget_id').change(function(){   
     twitterWidget.setUser($(this).val()).render().start(); 
    }); 

इस मामले में:

मैं निम्नलिखित कोड है यह केवल सभी खातों कि मैं में प्रवेश किया और सामान्य रूप में मैं एक खाली विजेट हो रही है से नवीनतम ट्वीट में पता चलता है।

यदि मैं ऑब्जेक्ट को हटाता हूं और एक नया बनाता हूं तो यह पृष्ठ को खाली बनाता है और फिर विजेट जोड़ता है।

क्या कोई भी TWTR.Widget() के लिए कुछ सार्वजनिक तरीकों को फिर से प्रस्तुत करने की तरह जानता है() या ऐसा कुछ?

धन्यवाद।

उत्तर

21

प्रलेखित ट्विटर विजेट स्रोत कोड http://twitter.com/javascripts/widgets/widget.js पर उपलब्ध है और इसके माध्यम से पढ़ने से आपको यह पता चल जाएगा कि आपको इसके व्यवहार में कैसे बदलाव करना है। संक्षेप में, विजेट इस तरह काम करता है:

जब विजेट पहले new TWTR.Widget साथ बनाई गई है यह .init() कॉल करता है और जहां यह पेज में एम्बेड किया गया है, उस स्थिति में डोम में विजेट एचटीएमएल कोड डालने का ध्यान लेता है। (यह हमेशा मानता है कि आप एम्बेडिंग कर रहे हैं, यही कारण है कि यदि आप एक शीर्ष स्क्रिप्ट में या विंडो के संदर्भ में एक नया विजेट बनाते हैं तो यह विंडो के रूट में खुद को एम्बेड कर देगा।)

लेकिन, आप अभी भी एक फ़ंक्शन का उपयोग करके विजेट बना सकता है (जब तक इसे एम्बेडेड स्क्रिप्ट से कहा जाता है) और फिर बाद में विजेट के संदर्भ पर रखें। जब आप .render() पर कॉल करते हैं तो विजेट बाद में कहीं भी फिर से प्रस्तुत करता है।

TWTR ऑब्जेक्ट पर कुछ छद्म-निजी विधियां हैं जिन्हें आप मज़ेदार बनाने की कोशिश कर सकते हैं, जैसे _getWidgetHtml() - जिसे .render() द्वारा बुलाया जाता है लेकिन आपको उनको उपयोग करने की आवश्यकता नहीं है।

मैंने अभी निम्नलिखित कोड लिखा है, और यह मेरे लिए अच्छा काम करता है। इस फ़ंक्शन को अपनी एम्बेडेड स्क्रिप्ट (जैसा दिखाया गया है) से कॉल करें, फिर इसे फिर से प्रस्तुत करने के लिए इसे फिर से एक नए खोज पैरामीटर के साथ कॉल करें।

<div id="my_widget_region"> 
    <script src="http://widgets.twimg.com/j/2/widget.js"></script> 
    <script>do_twitter_widget('"#winning" or "justin bieber"');</script> 
</div> 

function do_twitter_widget(search_query, title, subtitle) { 
    if (!window.widgetRef) { 
    window.widgetRef = new TWTR.Widget({ 
     version: 2, 
     type: 'search', 
     search: search_query, 
     interval: 6000, 
     title: title || 'Tweets related to', 
     subject: subtitle || search_query, 
     width: 'auto', 
     height: 500, 
     theme: { 
     shell: { 
      background: '#8EC1DA', 
      color: '#FFFFFF' 
     }, 
     tweets: { 
      background: '#FFFFFF', 
      color: '#444444', 
      links: '#1985B5' 
     } 
     }, 
     features: { 
     scrollbar: false, 
     loop: true, 
     live: true, 
     hashtags: true, 
     timestamp: true, 
     avatars: true, 
     behavior: 'default' 
     }, 
     ready: function() { 
     // when done rendering... 
     } 
    }); 

    window.widgetRef 
     .render() 
     .start(); 
    } 
    else { 
    if (search_query != window.old_twitter_search) { 
     window.widgetRef 
     .stop() 
     .setSearch(search_query) 
     .setTitle(title || 'Tweets related to') 
     .setCaption(subtitle || search_query) 
     .render() 
     .start(); 
    } 
    } 

    window.old_twitter_search = search_query; 

    return window.widgetRef; 
} 
+3

प्यार कैसे #winning और जस्टिन बीबर दोनों इस जवाब में शोषण किया जाता है। ;) प्रॉप्स ++; – sholsinger

1

तुम बस विजेट तत्व के HTML आईडी के रूप में "आईडी" पैरामीटर का उपयोग कर एक नया उदाहरण बनाने के द्वारा विजेट को फिर से लोड कर सकते हैं।

नीचे उदाहरण। (मेरे लिए ठीक काम करता है)

window.twitterCreateOrUpdateProfile = function (username) { 

    var opts = { 
     version: 2, 
     type: 'profile', 
     rpp: 4, 
     interval: 30000, 
     width: 298, 
     height: 320, 
     theme: { 
      shell: { 
       background: '#86b9d1', 
       color: '#ffffff' 
      }, 
      tweets: { 
       background: '#ffffff', 
       color: '#444444', 
       links: '#0b0d0d' 
      } 
     }, 
     features: { 
      scrollbar: true, 
      loop: false, 
      live: false, 
      behavior: 'all' 
     } 
    }; 

    if (window.twitterCreateOrUpdateProfile.instance) { 
     opts.id = window.twitterCreateOrUpdateProfile.instance.widgetEl.id; 
    } 
    window.twitterCreateOrUpdateProfile.instance = new TWTR.Widget(opts); 
    window.twitterCreateOrUpdateProfile.instance.render().setUser(username).start(); 
} 
window.twitterCreateOrUpdateProfile('evaisse'); 
संबंधित मुद्दे