CC-84: Smart Playlists

- ui clean-up

airtime_mvc/application/forms/SmartPlaylistCriteria.php

@@ -185,7 +185,7 @@ class Application_Form_SmartPlaylistCriteria extends Zend_Form_SubForm
         }
         
         $limit = new Zend_Form_Element_Select('sp_limit_options');
-        $limit->setAttrib('class', 'input_select');
+        $limit->setAttrib('class', 'sp_input_select');
         $limit->setDecorators(array('viewHelper'));
         $limit->setMultiOptions($limitOptions);
         if (isset($storedCrit["limit"])) {
@@ -194,7 +194,7 @@ class Application_Form_SmartPlaylistCriteria extends Zend_Form_SubForm
         $this->addElement($limit);
         
         $limitValue = new Zend_Form_Element_Text('sp_limit_value');
-        $limitValue->setAttrib('class', 'input_text');
+        $limitValue->setAttrib('class', 'sp_input_text_limit');
         $limitValue->setLabel('Limit to');
         $limitValue->setDecorators(array('viewHelper'));
         $this->addElement($limitValue);

airtime_mvc/application/models/Playlist.php

@@ -907,7 +907,7 @@ class Application_Model_Playlist {
                 $error[] =  "Value cannot be empty";
             }
             if(count($error) > 0){
-                $errors[] = array("element"=>"sp_criteria_".$key, "msg"=>$error);
+                $errors[] = array("element"=>"sp_criteria_field_".$key, "msg"=>$error);
             }
         }
         $result = count($errors) > 0 ? 1 :0;

airtime_mvc/application/views/scripts/form/smart-playlist-criteria.phtml

@@ -2,6 +2,7 @@
 <fieldset class='toggle closed' id='smart_playlist_options' style='overflow-x:auto; width:781px'>
 <legend style='cursor: pointer;'><span class='ui-icon ui-icon-triangle-2-n-s'></span>Smart Playlist Options</legend>
     <dl class='zend_form'>
+        <div id='sp-success' class='success' style='display:none'></div>
         <dd id='sp_type-element' class='radio-inline-list'>
         <label for='sp_type'>            
             <?php echo $this->element->getElement('sp_type')->getLabel() ?>
@@ -26,13 +27,15 @@
                 <?php echo $this->element->getElement('sp_criteria_modifier_'.$i) ?>
                 <?php echo $this->element->getElement('sp_criteria_value_'.$i) ?><span id="extra_criteria" <?php echo $this->element->getElement('sp_criteria_extra_'.$i)->getAttrib("disabled") == "disabled"?'style="display:none;"':""?>> to <?php echo $this->element->getElement('sp_criteria_extra_'.$i) ?></span> 
                 <?php if ($i != 0) { ?>
-                    <a href='#' id='criteria_remove_<?php echo $i ?>'>Remove&nbsp;</a>
+                    <a class='ui-button sp-add sp-ui-button-icon-only' id='criteria_remove_<?php echo $i ?>'>
+                        <span class='ui-icon ui-icon-closethick'></span>
+                    </a>
                 <?php } ?>
                 <br />
             </div>
             
         <?php } ?>
-        
+        <br />
         </dd>
         
         <dd id='sp_limit-element'>
@@ -40,7 +43,6 @@
                 <?php echo $this->element->getElement('sp_limit_value')->getLabel() ?>
                 <?php echo $this->element->getElement('sp_limit_value')?>
                 <?php echo $this->element->getElement('sp_limit_options') ?>
-                <br />
             </label>
         </dd>
         

airtime_mvc/public/css/styles.css

@@ -420,6 +420,10 @@ input[type="text"]:focus, input[type="password"]:focus, textarea:focus, .input_t
     width: 130px;
 }
 
+.sp_input_text_limit{
+    width: 75px !important;
+}
+
 input.input_text.sp_input_text{
     width: 200px !important;
 }
@@ -428,6 +432,17 @@ input.input_text.sp_extra_input_text{
     width: 85px !important;
 }
 
+.sp-ui-button-icon-only .ui-icon{
+	position: absolute;
+	top: 50%;
+	margin-top: -10px;
+	left: 50%;
+}
+
+.sp-add .sp-ui-button-icon-only .ui-icon{
+    left: 90% !important;
+}
+
 label {
 	font-size:13px;
 	color:#5b5b5b;
@@ -1431,7 +1446,7 @@ div.errors, span.errors{
 }
 
 span.errors.sp-errors{
-    width: 400px;
+    width: 466px;
     display: block;	
 }
 

airtime_mvc/public/js/airtime/playlist/smart_playlistbuilder.js

@@ -214,29 +214,39 @@ function staticCallback(data) {
 	form.find('span[class="errors sp-errors"]').remove();
 	var json = $.parseJSON(data);
 	if (json.result == "1") {
+		form.find('.success').hide();
 	    $.each(json.errors, function(index, error){
             $.each(error.msg, function(index, message){
                 $('#'+error.element).parent().append("<span class='errors sp-errors'>"+message+"</span>");
             });
         });
+    } else {
+        AIRTIME.playlist.fnAddItems(json.ids, null, 'after');
+        form.find('.success').text('Smart playlist generated');
+        form.find('.success').show();
     }
 }
 
 function dynamicCallback(json) {
 	var form = $('#smart-playlist-form');
 	form.find('span[class="errors sp-errors"]').remove();
-	var json = $.parseJSON(data);
+	var json = $.parseJSON(json);
 	if (json.result == "1") {
+		form.find('.success').hide();
         $.each(json.errors, function(index, error){
             $.each(error.msg, function(index, message){
                 $('#'+error.element).parent().append("<span class='errors sp-errors'>"+message+"</span>");
             });
         });
+    } else {
+    	form.find('.success').text('Criteria saved');
+        form.find('.success').show();
     }
 }
 
 function appendAddButton(rows) {
-    var add_button = "<a href='#' id='criteria_add' class='criteria_add'>Add</a>";
+    var add_button = "<a class='ui-button sp-ui-button-icon-only' id='criteria_add' class='criteria_add'>" +
+    		"<span class='ui-icon ui-icon-plusthick'</span></a>";
 	
     if (rows.find('select[name^="sp_criteria_field"]:enabled').length > 1) {
         rows.find('select[name^="sp_criteria_field"]:enabled:last')