0

Overlapping Snippet Text

Hey everyone,

I am going through the approval process and have 3 times received this bug from Yahoo! QA.  I am creating a weather app with some functionality similar to the old Y! Weather widget, including a collection of snippets that show real time weather information for saved cities.  The bug is:  [Text] in the snippet is overlapping on rotating.  An included screenshot makes it appear that the same text is being written to the snippet everytime it is rotated onscreen, resulting in "thick" text

I have tried a variety of different methods to resolve this issue.  I have tried using:
- a simple setText statement to update the text field
- hide/suiciding the text elements and recreating them dynamically before fillign them in
- Wrapping the above in a conditional that compares the recently imported data to the text fields contents and updates only if the information is different

Has anyone had a similar experience and can point me in the right direction?

My snippet.js is as follows:


var Tscv = new KONtx.Class({
    ClassName: 'Tscv',
   
    Extends: KONtx.system.ProfileSnippetView,
   
    initialize: function() {
        this.parent();
        this._handleActivateSnippet.subscribeTo(this, ['onActivateSnippet'], this);
    },
   
    _handleActivateSnippet: function(event) {
        if(this.config.data.params) {
            event.preventDefault();
            event.stopPropagation();
            KONtx.application.setHostResultToViewId(event, 'view-Home', this.config.data.params);
        }
    },
    createView: function() {
       
    this.controls.weather_con=new KONtx.element.Container({
   
    }).appendTo(this);
        this.controls.weatherIcon=new KONtx.element.Image({
            src: "",
            styles: {
                height: 75,
                hOffset:5,
                vOffset:5,
                width: 87,                   
            }
        }).appendTo(this.controls.weather_con);
        this.controls.warning_con=new KONtx.element.Container({
            styles:{
                hOffset:this.controls.weatherIcon.outerWidth,
                vOffset:this.height/2,
                visible:false,
            }           
        }).appendTo(this.controls.weather_con);
        this.controls.warning=new KONtx.element.Image({
            src: 'Images/Yahoo_Interface_Icons/warning_0.png',
            styles:{       
               
            }   
        }).appendTo(this.controls.warning_con);   
        if(city_obj.citylist.length<1)
            var truncName=""
        else
            var truncName=this.config.data.name.substr(0, this.config.data.name.lastIndexOf(","))
        this.controls.cityname = new KONtx.element.Text({
            label: '',
            styles: {
                color: "#EFFE4D",
                fontSize: "14px",
                hOffset:this.controls.warning_con.outerWidth+5,
                vOffset:20,           
            },
        }).appendTo(this.controls.weather_con);

        this.controls.citytemp = new KONtx.element.Text({
            label: "",
            styles: {
                color: "#FFFFFF",
                fontSize: "19px",
                hOffset: this.controls.warning_con.outerWidth+5,
                vOffset: 40,//this.controls.cityname.outerHeight,               
            },
        }).appendTo(this.controls.weather_con);
        this.controls.cityname = new KONtx.element.Text({
            label: '',
            styles: {
                color: "#EFFE4D",
                fontSize: "14px",
                hOffset:this.controls.warning_con.outerWidth+5,
                vOffset:20,           
            },
        }).appendTo(this.controls.weather_con);
       
        //BEGIN DEFAULT CON
        this.controls.default_con=new KONtx.element.Container({
            styles:{
                hAlign:'center',
                vAlign:'center',
            }
        }).appendTo(this);
        this.controls.default_label = new KONtx.element.Text({
            label: "The Weather Network",
            styles: {
                color: "#FFFFFF",
                fontSize: "20px",
            },
        }).appendTo(this.controls.default_con);
        //END DEFAULT CON
       
        this.myCode=this.config.data.myCode;
        this.myID=this.config.data.id;
        this.cityName=this.config.data.name
        //
        if(city_obj.citylist.length<1){
            this.controls.default_con.visible=true;
            this.controls.weather_con.visible=false;
        } else {
            this.controls.weather_con.visible=true;
            this.controls.default_con.visible=false;
        }       
        this.weatherWait=false;
    },
    updateView : function(){
        if(city_obj.citylist.length>0){
            var myname=city_obj.citylist[this.myID];
            var cn=myname.substr(0, myname.lastIndexOf(","));
            this.controls.cityname.setText(cn);
            while(this.controls.cityname.width>125){
                cn=cn.slice(0,cn.length-1)
                this.controls.cityname.setText(cn);
            }
            city_obj.currentIndex=this.myID;       
            if(this.weatherWait!=true){
                this.registerMessageCenterListenerCallback(this.weatherUpdate);
                this.weatherWait=true;
                fetchWeather(this.myCode);
            }
        }

    },   
    hideView:function(){
        this._unregisterMessageCenterListeners();
    },
    weatherUpdate: function(event){
        if (event.payload.key == "loadedWeatherData") {           
            var weatherData = event.payload.value;
            //The current weather page uses info from both the Obs and UVObs nodes
            if(weatherData.loadedCode==this.myCode && this.weatherWait==true){
                var cw=weatherData.Observation;
                if(cw.icon=="")
                    cw.icon="BLANK";
                temp=evaluateTemp(cw.temperature_c);
                if(temp!==this.controls.citytemp.text){
                    this.controls.citytemp.hide();
                    this.controls.citytemp.suicide();
                    this.controls.citytemp = new KONtx.element.Text({
                        label: "",
                        styles: {
                            color: "#FFFFFF",
                            fontSize: "19px",
                            hOffset: this.controls.warning_con.outerWidth+5,
                            vOffset: 40,//this.controls.cityname.outerHeight,               
                        },
                    }).appendTo(this.controls.weather_con);
                    this.controls.citytemp.setText(temp);
                }
                this.controls.weatherIcon.src='';
                if(icons_obj[cw.icon].en.path==undefined || icons_obj[cw.icon].en.path=='')
                    icons_obj[cw.icon].en.path="BLANK";
                this.controls.weatherIcon.src=icons_obj[cw.icon].en.path;
                this.weatherWait=false;
                this._unregisterMessageCenterListeners();
            }
        }           
    },
});


by
0 Replies

Recent Posts

in General - Yahoo! TV Widgets