Ios client discovery _ animation house activity Award Presentation and award Module Development Summary

Ios client discovery _ animation house activity Award Presentation and award Module Development Summary

I recently read the web strategy guide, which begins with an analysis of the DVD rental business model of flicker. It seems that such a business model is still very powerful, and since last year, in addition, flicker has led a boom in its own content. Hunan Satellite TV's future shows, such as where Dad is going, happy base camp, and so on, said Xiao from CCTV World Cup, iQiYi, big thing programs unknown after Liu Chun joins. After the boom, we cut audio and video portals by humans. This entrance is increasing gradually, which is not a good thing for users and for all sides. The audio and video portals have entered the Warring States period, it won't take long for the risks of this model to appear. It is far from the end to retain users only by their own content. Maybe the domestic portal can continue to look at how to proceed with the next step of flicker.

A functional customer service girl sat at the work station of ledi's internship unit. She communicated with the user about the daily work according to the user complaint and reported the bug to the technical team, if the problem can be solved on the technical side, you can return to the user to explain the reasons or remind the user to update the version. Ledi is engaged in the development of activity pages on mobile terminal activity pages. Activities are launched every week to reward VIP users, common users, and users of specific partner operators. No matter whether the customer service finally reports fault feedback results or whether the activities are planned or executed. If you accumulate feedback every day and every day, you still have positive comments on such companies from the bottom of your heart, because they attach importance to users, constantly improve service quality, and improve user experience. This is an exclusive method for self-made content.

The book is now being handed over, And Letti mainly made three pieces this week:

Project Introduction

(1) Development of the animation house Award Presentation page

The animation house Activity project is the first project that ledi has independently completed when he came to the internship unit. From the Activity start, the award statistics, and now the award presentation are all independently developed and tested by ledi. Since the development of the previous page has been completed, after the product provides the winning results, ledi only needs to find the user name and avatar of the winning user based on the data provided by the product for formatting. Ledi wrote two methods to retrieve the target object.

Function userObject (data, userUid) {var userObj = []; for (j = 0; j
  
Function searchUid (data, uid) {var comments = data ['data'] ['comments']; var len = comments. length; for (I = 0; I <len; I ++) {if (comments [I] ['userinfo'] ['uid'] = uid) {return comments [I] ['userinfo'] ;}}// gets the comment object under the corresponding uid


First, the award user ID is saved to an array. Then, call the above function to obtain the comment json object through ajax, find the user information object with the same user id and award id in the object, and store it in the target array, call the comment module for demonstration. 

	

		

	
	

		This project focuses on deepening ledi's knowledge about caching. And formed a further release and test solution. Because the ios system does not contain cache cleaning. The server also caches the old content, and the new content may not be displayed immediately.
	
	

		Therefore, to modify the page online, you need to start from four aspects to see if it works.
	
	

		

	
Uninstall the app and reinstall it. Disable app Process Server-side cache cleanup Use the alert function to check whether any real-time modifications are made. 
	

		

	
	

		The preceding four methods ensure that the modification takes effect.
	
	

		In addition, I learned that this activity is intended for ipad, so it is not necessary to adjust the adaptation of other mobile phones before. In future activities, please pay attention to questions and the scope of the activity. According to large, he only adapted to the iphone and ipad. This time, le di recorded the resolution of various mobile phones when adjusting the adaptation, basically, the iphone is in the range of 1024-and is also in the mainstream model. The resolution of the ipad is more than, and the adapter can be referenced normally without further adjustment. From now on, it makes sense to adjust only the iphone and ipad.
	
	

		
 
	
	

		(2) Development of the Award Presentation Module
	
	

		During the development process, especially the development of mobile terminal activity pages, after a long time, we will find that the page mode is very fixed, which can save the effort to write the underlying code and directly modularize the "tailism ", you only need to do some positioning work. The award presentation module is often used, so a function is written separately. To prevent name conflicts, some specific formats are provided here.
	
	

		
	
Function h5_winnerArea (winnerObject, total) {// The parameter is the array object and the number of items to be displayed if (! (ArrayObject instanceof Array) {return}; var viewport = $ (". viewport ") [0]; var length = winnerObject. length; // length of the award object winnerObject = winnerObject. slice (0, total); // The number of truncated object arrays used to display var h5_winner =$ (""); h5_winner.appendTo (viewport); // select the first viewport, append this award code to var h5_winnerUser =$ ("Total" + length + "Name User winning"); h5_winnerUser.appendTo (h5_winner); var h5_winnerArea =$ (""); h5_winnerArea.attr ("class", "h5_winnerArea"); h5_winnerArea.appendTo (h5_winner); var h5_winnerArea_list = $ (""); Evaluate ("class", "h5_winnerArea_list "); h5_winnerArea.append (h5_winnerArea_list); var h5_winnerArea_header = $ (""); Evaluate ("class", "h5_winnerArea_header"); h5_winnerArea_list.append (h5_winnerArea_header ); var h2 = $ ("recent winners"); h5_winnerArea_header.append (h2); var h5_winnerArea_item = $ (""); h5_winnerArea_item.attr ("class", "h5_winnerArea_item "); h5_winnerArea_list.append (h5_winnerArea_item); var ul = $ ("
	
   

		
	
   
"); H5_winnerArea_item.append (ul); // the array of cyclic objects is used to format the displayed content $. each (winnerObject, function (I, n) {var li = $ ("
	

		
	
"); Ul. append (li); var h5_winnerArea_item_icon = $ (""); h5_winnerArea_item_icon.attr ("class", "h5_winnerArea_item_icon"); li. append (h5_winnerArea_item_icon); var img = $ (""); img. attr ("src", n. icon); h5_winnerArea_item_icon.append (img); var h5_winnerArea_item_name = $ (""); h5_winnerArea_item_name.html (n. nickName); h5_winnerArea_item_name.attr ("class", "h5_winnerArea_item_name"); h5_winnerArea_item_name.addClass ("h5_winnerArea_textOverflow"); li. append (h5_winnerArea_item_name); var h5_winnerArea_item_prize = $ (""); h5_winnerArea_item_prize.html (n. rewardName); h5_winnerArea_item_prize.attr ("class", "h5_winnerArea_item_prize"); h5_winnerArea_item_prize.addClass ("h5_winnerArea_textOverflow"); li. append (h5_winnerArea_item_prize );});}


Corresponding css style: 
	

		

	
	

		
	
. H5_winnerUser {text-align: center; margin-top: 40px; font-size: 24px; font-weight: bold; color: #542004; width: 100% ;}. h5_winnerArea {margin-top: 30px; width: 100% ;}. h5_winnerArea_list {background-color: # ffffff; margin: 0 10px 100px 10px; border-radius: 6px ;}. h5_winnerArea_header {padding: 10px 15px 0 15px ;}. h5_winnerArea_header h2 {font-size: 24px; font-weight: bold; color: # 4d4d4d; border-bottom: 1px soli D # e7e7e7; padding-bottom: 10px ;}. h5_winnerArea_item ul ,. h5_winnerArea_item li {list-style: none }. h5_winnerArea_textOverflow {overflow: hidden;/* overflow element hiding */text-overflow: ellipsis;/* overflow element hiding display '... '*/White-space: nowrap;/* No line breaks. All three are for text processing */}. h5_winnerArea_item ul {padding: 0 15px ;}. h5_winnerArea_item li {border-bottom: 1px solid # e7e7e7; overflow: hidden; padding: 5px 0 5px 0; line-height: 60px; height: 60px ;}. h5_winnerArea_item_icon {float: left; width: 40px; margin-right: 20px ;}. h5_winnerArea_item_icon img {border-radius: 20px; width: 40px; height: 40px ;}. h5_winnerArea_item_name {float: left; font-size: 24px; font-weight: bold; color: #000000 ;}. h5_winnerArea_item_prize {float: right; text-align: right; display: inline; font-size: 20px; color: # 4d4d4d ;}


This module can modify the content at any time as needed. during the development of this module, I learned from that native code may be incompatible with different browsers, therefore, the module uses the jquery framework as much as possible. 
	

		

	
	

		Because the mobile phone activity project of iQiYi has not yet been launched. The development is not described here. Thank you very much for your patience in guiding standardized programming as a Senior Programmer.