winery/org.eclipse.winery.repository/src/main/webapp/WEB-INF/tags/colorwheel.tag

   1 <%--
   2 /*******************************************************************************
   3  * Copyright (c) 2012-2013 University of Stuttgart.
   4  * All rights reserved. This program and the accompanying materials
   5  * are made available under the terms of the Eclipse Public License v1.0
   6  * and the Apache License 2.0 which both accompany this distribution,
   7  * and are available at http://www.eclipse.org/legal/epl-v10.html
   8  * and http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Contributors:
  11  *    Oliver Kopp - initial API and implementation and/or initial documentation
  12  *******************************************************************************/
  13 --%>
  14 <%@tag description="displays a color wheel" pageEncoding="UTF-8"%>
  15
  16 <%@attribute name="id" required="true" description="id of the div to initialize"%>
  17 <%@attribute name="url" required="true" description="URL to put to"%>
  18 <%@attribute name="color" required="true" description="the initial color"%>
  19 <%@attribute name="label" required="true" description="the label"%>
  20
  21 <div id="${id}" class="form-group" style="height:175px;">
  22         <label for="${id}Div">${label}</label>
  23         <div id="${id}Div" style="width:100%">
  24                 <div class="colorwheel" style="float:left; margin-right:20px; width:300px; text-align:left;"></div>
  25                 <div style="float:left; width:50%">
  26                         <input id="${id}Input" name="input_example" value="${color}" size="7" style="background-color: ${color}">
  27                         <p class="text-info">Enter the hex value above</p>
  28                         <button type="button" class="btn btn-default btn-primary btn-sm" onclick="putColor('${url}', $('#${id}Input').val());">Save</button>
  29                 </div>
  30         </div>
  31 </div>
  32
  33 <script>
  34         var cw = Raphael.colorwheel($("#${id} div.colorwheel")[0],150);
  35         cw.input($("#${id} input")[0]);
  36 </script>