From 5ddbdeac96ab3bb4acb339ff5a36368e047abcef Mon Sep 17 00:00:00 2001
From: ddm <ddm@openerp.com>
Date: Tue, 27 Aug 2013 11:32:37 +0200
Subject: [PATCH] SEO keywords list mockup

bzr revid: ddm@openerp.com-20130827093237-v13oihsyhadl92w3
---
 addons/website/static/src/css/editor.css  |  8 ++++++++
 addons/website/static/src/css/editor.sass |  6 ++++++
 addons/website/static/src/js/website.js   | 13 ++++++++-----
 addons/website/static/src/xml/website.xml |  4 ++--
 4 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index b95df24bc01..6ceefbf046a 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -281,3 +281,11 @@
 .oe_seo_configuration .oe_remove {
   color: #e00101;
 }
+
+.oe_seo_keywords_list {
+  width: 35em;
+}
+.oe_seo_keywords_list li {
+  float: left;
+  width: 10em;
+}
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index 87e8715e931..571722d6466 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -245,3 +245,9 @@ $icon_close: #E00101
         list-style: none
     .oe_remove
         color: $icon_close
+
+.oe_seo_keywords_list
+    width: 35em
+    li
+        float: left
+        width: 10em
\ No newline at end of file
diff --git a/addons/website/static/src/js/website.js b/addons/website/static/src/js/website.js
index d5b1cadcef8..83d3e958c7b 100644
--- a/addons/website/static/src/js/website.js
+++ b/addons/website/static/src/js/website.js
@@ -248,15 +248,18 @@
 
             this.$el.modal();
         },
-        listKeywords: function () {
+        keywords: function () {
             var result = [];
             this.$el.find('.js_seo_keyword').each(function () {
                 result.push($(this).text());
             })
             return _.uniq(result);
         },
-        existsKeyword: function (word) {
-            return _.contains(this.listKeywords(), word);
+        isExistingKeyword: function (word) {
+            return _.contains(this.keywords(), word);
+        },
+        isKeywordListFull: function () {
+            return this.keywords().length >= 10;
         },
         confirmKeyword: function (e) {
             if (e.keyCode == 13) {
@@ -266,14 +269,14 @@
         },
         addKeyword: function () {
             var word = this.$el.find('input[name=seo_page_keywords]').val();
-            if (!this.existsKeyword(word)) {
+            if (!this.isKeywordListFull() && !this.isExistingKeyword(word)) {
                 new website.seo.Keyword({
                     keyword: word
                 }).appendTo(this.$el.find('.js_seo_keywords_list'));
             }
         },
         update: function () {
-            console.log(this.listKeywords());
+            console.log(this.keywords());
             // TODO: Persist changes
         },
         close: function () {
diff --git a/addons/website/static/src/xml/website.xml b/addons/website/static/src/xml/website.xml
index d3bab78faf9..c1925636a62 100644
--- a/addons/website/static/src/xml/website.xml
+++ b/addons/website/static/src/xml/website.xml
@@ -79,14 +79,14 @@
                         <textarea name="seo_page_description" rows="3" cols="70" size="160"/>
                     </div>
                 </div>
-                <div class="control-group">
+                <div class="control-group oe_seo_keywords_area">
                     <label class="control-label" for="seo_page_keywords">Keywords</label>
                     <div class="controls">
                         <div class="input-append">
                             <input type="text" name="seo_page_keywords" size="30" placeholder="New keyword"/>
                             <button data-action="add" class="btn" type="button">Add</button>
                         </div>
-                        <ul class="js_seo_keywords_list">
+                        <ul class="oe_seo_keywords_list js_seo_keywords_list">
                             <!-- filled in JS -->
                         </ul>
                     </div>