diff options
Diffstat (limited to 'common/src/main/webapp/usageguide/browser/templates/buttons.html')
-rw-r--r-- | common/src/main/webapp/usageguide/browser/templates/buttons.html | 130 |
1 files changed, 0 insertions, 130 deletions
diff --git a/common/src/main/webapp/usageguide/browser/templates/buttons.html b/common/src/main/webapp/usageguide/browser/templates/buttons.html deleted file mode 100644 index 6261d5a..0000000 --- a/common/src/main/webapp/usageguide/browser/templates/buttons.html +++ /dev/null @@ -1,130 +0,0 @@ -<!--
-
- Copyright 2016-2017, Huawei Technologies Co., Ltd.
-
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
-
--->
-
-<h4>Types of Buttons</h4>
-
-<div id="buttonArea" ng-init="init()">
- <h3> Default Buttons</h3>
- <div id="defaultButtonArea"></div>
- <h3>Visual Buttons</h3>
- <div id="visualButtonArea"></div>
- <h3>Different Sized Buttons</h3>
- <div id="sizeButtonArea"></div>
- <h3>Icon Buttons</h3>
- <div id="iconButtonArea"></div>
-
-</div>
-<div class="shortnote">
- <div class="shortnoteHeader">Usage</div>
- <div class="shortnoteText">Create a div tag in html file with specific id for example defaultButtonArea,visualButtonArea, sizeButtonArea,iconButtonArea and write a specific function in javascript file to perform your business logic. An sample example as shown below:</div>
- <br>
- <div>HTML file:</div>
- <pre><code><div id="buttonArea" ng-init="init()"></div></code></pre>
- <pre><code><div id="defaultButtonArea" ></div></code></pre>
- <pre><code><div id="visualButtonArea" ></div></code></pre>
- <pre><code><div id="sizeButtonArea" ></div></code></pre>
- <pre><code><div id="iconButtonArea" ></div></code></pre>
- <br>
- <div>Javascript file:</div>
- <pre><code>
- var data ={"default_btn_data" : {"def_button" : {"title":"Default"},"def_print_button" : {"title":"Print", "type":"btn btn-default", "gType": "glyphicon-print", "iconPosition":"left"},"def_print_button_right" : {"title":"Search", "type":"btn btn-default", "gType": "glyphicon-search", "iconPosition":"right"}},"visual_btn_data" : { "vis_pri_btn_data" : {"title":"Primary", "type":"primary"},"vis_sec_btn_data" : {"title":"Secondary", "type":"secondary"},"vis_succ_btn_data" : {"title":"Success", "type":"success"},"vis_inf_btn_data" : {"title":"Info", "type":"info"},"vis_warn_btn_data" : {"title":"Warning", "type":"warning"},"vis_dang_btn_data" : {"title":"Danger", "type":"danger"},"vis_link_btn_data" : {"title":"Link", "type":"link"}},"diffSize_btn_data" : {"size_small_btn_data" : {"title": "Small Button", "type": "primary", "size": "btn-sm"},"size_large_btn_data" : {"title": "Large Button", "type": "primary", "size": "btn-lg"},"size_block_btn_data" : {"title": "Large Block Button", "type": "primary", "size": "btn-lg btn-block"}},"icon_btn_data" : {"search_icon_btn_data" : {"title": "Search Icon", "type": "btn-default", "gType": "glyphicon-search"},"search_icon_styled_btn_data" : {"title": "Styled Search Icon", "type": "primary", "gType": "glyphicon-search"},"print_icon_btn_data" : {"title": "Print", "type": "primary btn-lg", "gType": "glyphicon-print"}}};
-
- $scope.init = function() {
- defaultButtons();
- visualButtons();
- sizeButtons();
- iconButtons();
- }
-
- function defaultButtons(){
- var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();
- var def_icon_button_tpl = $(modelTemplate).filter('#defaultIconButtons').html();
-
- var html = Mustache.to_html(def_button_tpl, data.default_btn_data.def_button);
- $('#defaultButtonArea').html(html);
-
- var html = Mustache.to_html(def_icon_button_tpl, data.default_btn_data.def_print_button);
- $('#defaultButtonArea').append(html);
-
- var html = Mustache.to_html(def_icon_button_tpl, data.default_btn_data.def_print_button_right);
- $('#defaultButtonArea').append(html);
- }
-
-
- function visualButtons(){
-
- var visual_button_tpl = $(modelTemplate).filter('#visualButtons').html();
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_pri_btn_data);
- $('#visualButtonArea').html(html);
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_sec_btn_data);
- $('#visualButtonArea').append(html);
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_succ_btn_data);
- $('#visualButtonArea').append(html);
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_inf_btn_data);
- $('#visualButtonArea').append(html);
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_warn_btn_data);
- $('#visualButtonArea').append(html);
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_dang_btn_data);
- $('#visualButtonArea').append(html);
-
- var html = Mustache.to_html(visual_button_tpl, data.visual_btn_data.vis_link_btn_data);
- $('#visualButtonArea').append(html);
- }
-
- function sizeButtons() {
- var size_button_tpl = $(modelTemplate).filter('#sizeButtons').html();
-
- var html = Mustache.to_html(size_button_tpl, data.diffSize_btn_data.size_small_btn_data);
- $('#sizeButtonArea').html(html);
-
- var html = Mustache.to_html(size_button_tpl, data.diffSize_btn_data.size_large_btn_data);
- $('#sizeButtonArea').append(html);
-
- var html = Mustache.to_html(size_button_tpl, data.diffSize_btn_data.size_block_btn_data);
- $('#sizeButtonArea').append(html);
-
- }
-
- function iconButtons() {
- var icon_button_tpl = $(modelTemplate).filter('#iconButtons').html();
-
- var html = Mustache.to_html(icon_button_tpl, data.icon_btn_data.search_icon_btn_data);
- $('#iconButtonArea').html(html);
-
- var html = Mustache.to_html(icon_button_tpl, data.icon_btn_data.search_icon_styled_btn_data);
- $('#iconButtonArea').append(html);
-
- var html = Mustache.to_html(icon_button_tpl, data.icon_btn_data.print_icon_btn_data);
- $('#iconButtonArea').append(html);
-
- }</code></pre>
-
-
-
-
- </div>
-</div>
-
-
-
|