add title and filters

- only UI controls
cloudanswers · Dec 27, 2023 · 1bd32f7 · 1bd32f7
1 parent 1efa145
commit 1bd32f7
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 8 deletions.
diff --git a/src/pages/NewCalendar.page b/src/pages/NewCalendar.page
@@ -1,20 +1,80 @@
-<apex:page applyBodyTag="false">
+<apex:page applyBodyTag="false" controller="CampaignCalendar">
 
     <apex:variable var="webapp" value="{!IF($CurrentPage.parameters.localdev=='1', 'http://localhost:8080', $Resource.webapp)}" />
 
     <apex:stylesheet value="{!URLFOR($Resource.webapp, 'main.css')}"/>
     <style type="text/css">
+        body {
+        	margin: 0px 10px;
+        }
         .fc-button, .fc-button-group > button {
         	background-image: none;
         }
+        <apex:repeat value="{!colors}" var="color">
+            .calcolor-{!color.bg},
+            .fc-agenda .calcolor-{!color.bg} .fc-event-time,
+            .calcolor-{!color.bg} a {
+                background-color: {!color.bg};
+                border-color: {!color.bg};
+                color: {!color.fg};
+            }
+        </apex:repeat>
+
+        .filterBox {
+            margin-top:5px;
+            background-color: #fff;
+            border-width: 1px;
+            border-color:#ddd;
+            padding:5px;
+            box-shadow: none;
+            border-style:solid;
+            border-radius: 4px 4px;
+        	float:right;
+            background: linear-gradient(#E5F2F6,#CDE8F0);
+            -moz-box-shadow: 0 3px 5px hsla(100,0%,0%,.3);
+            -webkit-box-shadow: 0 3px 5px hsla(100,0%,0%,.3);
+            box-shadow: 0 3px 5px hsla(100,0%,0%,.3);
+
+        }
+
+        .filterBoxTitle {
+            position:absolute;
+            color:#808080;
+            font-weight:bold;   
+        }
     </style>
     <apex:includeScript value="{!webapp}/main.js"/>
     <body>
-        <div id="calendarx"></div>
-        <div style="max-width: 900px; margin: 0 auto;">
-            <apex:outputLink value="http://www.cloudanswers.com" id="poweredByLink" target="_blank">
-                <apex:image url="{!URLFOR($Resource.FullCalendar, 'poweredby.png')}" width="293" height="44" />
-            </apex:outputLink>
-        </div>
+        <apex:form>
+
+            <div style="max-width: 1024px; margin: 0 auto;">
+                <div style="float: left;">
+	                <apex:sectionHeader title="Marketing Calendar"/>
+                </div>
+
+                <!-- filters -->
+                <div class="filterBox">
+                    <span class="filterBoxTitle">FILTERS</span>
+                    <div style="margin-top:5px; padding:10px;">
+                        <b class="label">Parent Campaign</b>
+                        <select id="parentCampaign" onchange="filterData()" class="combo" style="min-width: 240px;">        
+                            <apex:repeat value="{!ActiveParentCampaigns}" var="so">
+                                <option value="{!so.value}">{!so.label}</option>
+                            </apex:repeat>        
+                        </select>
+                        <b class="label">Campaign Type</b>
+                        <apex:inputField styleClass="campaignType combo" value="{!campaignObj.Type}" onchange="filterData()" style="min-width:180px"/>
+                    </div>
+                </div>
+                <div style="clear: both;" />
+                <br />
+            </div>
+			<div style="max-width: 1024px; margin: 0 auto;">
+                <div id="calendarx"></div>
+                <apex:outputLink value="http://www.cloudanswers.com" id="poweredByLink" target="_blank">
+                    <apex:image url="{!URLFOR($Resource.FullCalendar, 'poweredby.png')}" width="293" height="44" />
+                </apex:outputLink>
+            </div>
+        </apex:form>
     </body>
 </apex:page>
diff --git a/webapp/src/index.css b/webapp/src/index.css
@@ -6,6 +6,6 @@ body {
 }
 
 #calendarx {
-    max-width: 900px;
+    max-width: 1024px;
     margin: 0 auto;
 }