Edit File by line

( function( Backbone, $ ) {

[0] Fix | Delete

"use strict";

[1] Fix | Delete

[2] Fix | Delete

if ( ! $( '#wpr-review-items-app' ).length ) {

[3] Fix | Delete

return;

[4] Fix | Delete

}

[5] Fix | Delete

[6] Fix | Delete

var App = {

[7] Fix | Delete

Models: {},

[8] Fix | Delete

Collections: {},

[9] Fix | Delete

Views: {}

[10] Fix | Delete

};

[11] Fix | Delete

[12] Fix | Delete

App.Models.Item = Backbone.Model.extend({

[13] Fix | Delete

defaults: function() {

[14] Fix | Delete

return {

[15] Fix | Delete

id: '',

[16] Fix | Delete

item_id: '',

[17] Fix | Delete

wp_review_item_title: '',

[18] Fix | Delete

wp_review_item_star: 0,

[19] Fix | Delete

wp_review_item_color: $( '#wpr-review-color-value' ).val(),

[20] Fix | Delete

wp_review_item_inactive_color: $( '#wpr-review-inactive-color-value' ).val(),

[21] Fix | Delete

type: $( '#wpr-review-type-2' ).val() || wprVars.globalReviewType

[22] Fix | Delete

};

[23] Fix | Delete

}

[24] Fix | Delete

});

[25] Fix | Delete

[26] Fix | Delete

App.Collections.Items = Backbone.Collection.extend({

[27] Fix | Delete

model: App.Models.Item

[28] Fix | Delete

});

[29] Fix | Delete

[30] Fix | Delete

App.Views.ItemView = Backbone.View.extend({

[31] Fix | Delete

template: wp.template( 'wpr-review-item' ),

[32] Fix | Delete

[33] Fix | Delete

className: 'wpr-review-item',

[34] Fix | Delete

[35] Fix | Delete

initialize: function() {

[36] Fix | Delete

this.model.on( 'destroy', this.remove, this );

[37] Fix | Delete

[38] Fix | Delete

[39] Fix | Delete

events: {

[40] Fix | Delete

'click .delete-item': 'remove',

[41] Fix | Delete

'change .input-title': 'changeTitle',

[42] Fix | Delete

'change .input-star': 'changeScore'

[43] Fix | Delete

[44] Fix | Delete

[45] Fix | Delete

render: function() {

[46] Fix | Delete

var _this = this,

[47] Fix | Delete

data;

[48] Fix | Delete

[49] Fix | Delete

data = this.model.toJSON();

[50] Fix | Delete

data.itemNameSetting = wp.template( 'wpr-review-item-name' )( data );

[51] Fix | Delete

data.itemColorSetting = wp.template( 'wpr-review-item-color' )( data );

[52] Fix | Delete

data.itemInactiveColorSetting = wp.template( 'wpr-review-item-inactive-color' )( data );

[53] Fix | Delete

if ( $( '#tmpl-wpr-review-item-' + data.type + '-rating' ).length ) {

[54] Fix | Delete

data.itemRatingSetting = wp.template( 'wpr-review-item-' + data.type + '-rating' )( data );

[55] Fix | Delete

} else {

[56] Fix | Delete

data.itemRatingSetting = wp.template( 'wpr-review-item-rating' )( data );

[57] Fix | Delete

}

[58] Fix | Delete

this.$el.html( this.template( data ) );

[59] Fix | Delete

[60] Fix | Delete

this.$( '.input-color' ).wpColorPicker({

[61] Fix | Delete

change: function( ev, ui ) {

[62] Fix | Delete

var color = ui.color.toString();

[63] Fix | Delete

_this.$( '.wpr-star-input-wrapper' ).css({ color: color });

[64] Fix | Delete

_this.$( '.wpr-input-wrapper.ui-slider .ui-slider-range' ).css({ backgroundColor: color });

[65] Fix | Delete

_this.model.set( 'wp_review_item_color', color );

[66] Fix | Delete

}

[67] Fix | Delete

});

[68] Fix | Delete

[69] Fix | Delete

this.$( '.input-inactive-color' ).wpColorPicker({

[70] Fix | Delete

change: function( ev, ui ) {

[71] Fix | Delete

var color = ui.color.toString();

[72] Fix | Delete

_this.$( '.wpr-star-input-wrapper .stars-bg' ).css({ color: color });

[73] Fix | Delete

_this.$( '.wpr-input-wrapper.ui-slider' ).css({ backgroundColor: color });

[74] Fix | Delete

_this.model.set( 'wp_review_item_inactive_color', color );

[75] Fix | Delete

}

[76] Fix | Delete

});

[77] Fix | Delete

[78] Fix | Delete

function validateValue( value, min, max ) {

[79] Fix | Delete

value = parseFloat( value );

[80] Fix | Delete

if ( isNaN( value ) || min !== undefined && value < min || max !== undefined && value > max ) {

[81] Fix | Delete

_this.$el.find( '.input-star, .input-star-display' ).addClass( 'review-value-incorrect' );

[82] Fix | Delete

} else {

[83] Fix | Delete

_this.$el.find( '.input-star, .input-star-display' ).removeClass( 'review-value-incorrect' );

[84] Fix | Delete

}

[85] Fix | Delete

}

[86] Fix | Delete

[87] Fix | Delete

switch ( this.model.get( 'type' ) ) {

[88] Fix | Delete

case 'star':

[89] Fix | Delete

var _this = this;

[90] Fix | Delete

[91] Fix | Delete

this.$( '.input-star' ).wprStarInput({

[92] Fix | Delete

ready: function( wrapper, options ) {

[93] Fix | Delete

this.appendTo( this.closest( '.col-2' ).next() );

[94] Fix | Delete

[95] Fix | Delete

callback: function( value ) {

[96] Fix | Delete

validateValue( value, 0, wprVars.reviewTypes.star.max );

[97] Fix | Delete

_this.model.set( 'wp_review_item_star', value );

[98] Fix | Delete

}

[99] Fix | Delete

});

[100] Fix | Delete

break;

[101] Fix | Delete

[102] Fix | Delete

case 'percentage':

[103] Fix | Delete

this.$( '.input-star' ).wprPercentageInput({

[104] Fix | Delete

ready: function( wrapper, options ) {

[105] Fix | Delete

this.appendTo( this.closest( '.col-2' ).next() );

[106] Fix | Delete

[107] Fix | Delete

callback: function( value ) {

[108] Fix | Delete

this.val( value );

[109] Fix | Delete

validateValue( value, 0, wprVars.reviewTypes.percentage.max );

[110] Fix | Delete

_this.model.set( 'wp_review_item_star', value );

[111] Fix | Delete

}

[112] Fix | Delete

});

[113] Fix | Delete

break;

[114] Fix | Delete

[115] Fix | Delete

case 'point':

[116] Fix | Delete

this.$( '.input-star' ).wprPointInput({

[117] Fix | Delete

ready: function( wrapper, options ) {

[118] Fix | Delete

this.appendTo( this.closest( '.col-2' ).next() );

[119] Fix | Delete

[120] Fix | Delete

callback: function( value ) {

[121] Fix | Delete

this.val( value );

[122] Fix | Delete

validateValue( value, 0, wprVars.reviewTypes.point.max );

[123] Fix | Delete

_this.model.set( 'wp_review_item_star', value );

[124] Fix | Delete

}

[125] Fix | Delete

});

[126] Fix | Delete

break;

[127] Fix | Delete

}

[128] Fix | Delete

[129] Fix | Delete

this.$el.attr( 'data-id', this.model.get( 'id' ) );

[130] Fix | Delete

return this;

[131] Fix | Delete

[132] Fix | Delete

[133] Fix | Delete

remove: function() {

[134] Fix | Delete

collection.remove( this.model );

[135] Fix | Delete

[136] Fix | Delete

[137] Fix | Delete

changeTitle: function( ev ) {

[138] Fix | Delete

this.model.set( 'wp_review_item_title', ev.target.value );

[139] Fix | Delete

[140] Fix | Delete

[141] Fix | Delete

changeScore: function( ev ) {

[142] Fix | Delete

this.model.set( 'wp_review_item_star', parseFloat( ev.target.value ) );

[143] Fix | Delete

}

[144] Fix | Delete

});

[145] Fix | Delete

[146] Fix | Delete

App.Views.AppView = Backbone.View.extend({

[147] Fix | Delete

el: '#wpr-review-items-app',

[148] Fix | Delete

[149] Fix | Delete

initialize: function() {

[150] Fix | Delete

this.render();

[151] Fix | Delete

this.collection.on( 'add', this.renderOne, this );

[152] Fix | Delete

this.collection.on( 'remove', this.remove, this );

[153] Fix | Delete

this.collection.on( 'add', this.calculateTotal, this );

[154] Fix | Delete

this.collection.on( 'change', this.calculateTotal, this );

[155] Fix | Delete

this.collection.on( 'remove', this.calculateTotal, this );

[156] Fix | Delete

this.collection.on( 'add change remove', this.updateAppAttr, this );

[157] Fix | Delete

[158] Fix | Delete

[159] Fix | Delete

events: {

[160] Fix | Delete

'click .add-item': 'addItem',

[161] Fix | Delete

'change #wpr-review-type-2': 'changeType'

[162] Fix | Delete

[163] Fix | Delete

[164] Fix | Delete

render: function() {

[165] Fix | Delete

this.$( '.wpr-review-items' ).html( '' );

[166] Fix | Delete

this.collection.each( this.renderOne, this );

[167] Fix | Delete

this.calculateTotal();

[168] Fix | Delete

this.$( '.wpr-review-items' ).sortable({

[169] Fix | Delete

handle: '.wpr-icon-move'

[170] Fix | Delete

});

[171] Fix | Delete

return this;

[172] Fix | Delete

[173] Fix | Delete

[174] Fix | Delete

renderOne: function( item ) {

[175] Fix | Delete

var view = new App.Views.ItemView({ model: item });

[176] Fix | Delete

this.$( '.wpr-review-items' ).append( view.render().el );

[177] Fix | Delete

[178] Fix | Delete

[179] Fix | Delete

calculateTotal: function() {

[180] Fix | Delete

if ( ! this.$el.attr( 'data-changed' ) ) {

[181] Fix | Delete

return;

[182] Fix | Delete

}

[183] Fix | Delete

[184] Fix | Delete

var total = 0,

[185] Fix | Delete

count = this.collection.length;

[186] Fix | Delete

[187] Fix | Delete

if ( count ) {

[188] Fix | Delete

_.each( this.collection.models, function( item ) {

[189] Fix | Delete

total += ! isNaN( item.get( 'wp_review_item_star' ) ) ? parseFloat( item.get( 'wp_review_item_star' ) * 1 ) : 0;

[190] Fix | Delete

});

[191] Fix | Delete

total = Math.round( total * 100 / count ) / 100;

[192] Fix | Delete

}

[193] Fix | Delete

[194] Fix | Delete

this.$( '.input-total' ).val( total );

[195] Fix | Delete

[196] Fix | Delete

[197] Fix | Delete

remove: function( item ) {

[198] Fix | Delete

this.$el.find( '.wpr-review-item[data-id="' + item.get( 'id' ) + '"]' ).remove();

[199] Fix | Delete

[200] Fix | Delete

[201] Fix | Delete

addItem: function() {

[202] Fix | Delete

var model = new App.Models.Item();

[203] Fix | Delete

model.set( 'id', 'a' + parseInt( Math.random() * 100 ) );

[204] Fix | Delete

this.collection.add( model );

[205] Fix | Delete

[206] Fix | Delete

[207] Fix | Delete

changeType: function( ev ) {

[208] Fix | Delete

var type = ev.target.value;

[209] Fix | Delete

if ( type == 'none' ) {

[210] Fix | Delete

return;

[211] Fix | Delete

}

[212] Fix | Delete

_.each( this.collection.models, function( item ) {

[213] Fix | Delete

item.set( 'type', type );

[214] Fix | Delete

});

[215] Fix | Delete

this.render();

[216] Fix | Delete

[217] Fix | Delete

[218] Fix | Delete

updateAppAttr: function() {

[219] Fix | Delete

this.$el.attr( 'data-changed', '1' );

[220] Fix | Delete

}

[221] Fix | Delete

});

[222] Fix | Delete

[223] Fix | Delete

function onSelectType() {

[224] Fix | Delete

$( '#wpr-review-type-2' ).val( $( this ).val() ).trigger( 'change' );

[225] Fix | Delete

}

[226] Fix | Delete

$( '#wp_review_type' ).on( 'change', onSelectType );

[227] Fix | Delete

[228] Fix | Delete

// App initialize.

[229] Fix | Delete

var items = $( '#wpr-review-items-data' ).val();

[230] Fix | Delete

items = items ? JSON.parse( items ) : [];

[231] Fix | Delete

items.map( function( item, index ) {

[232] Fix | Delete

item.item_id = item.id;

[233] Fix | Delete

item.id = index;

[234] Fix | Delete

return item;

[235] Fix | Delete

});

[236] Fix | Delete

[237] Fix | Delete

var collection = new App.Collections.Items( items );

[238] Fix | Delete

[239] Fix | Delete

var appView = new App.Views.AppView({

[240] Fix | Delete

collection: collection

[241] Fix | Delete

});

[242] Fix | Delete

})( Backbone, jQuery );

[243] Fix | Delete

[244] Fix | Delete