Added the index page and adjusted some css (0a3ede0) - smf_package_maker

Added the index page and adjusted some css

Jeremy D commited on 2011-12-29 15:30:43
Showing 3 changed files, with 93 additions and 18 deletions.

assets/default.css f765e89..03c0ed0
assets/script.js
index.php a6ea499..30d55cd

assets/default.css

@@ -86,7 +86,7 @@ input, textarea
 	border: 0;
 	padding: 5px 0;
 }
-#logo h1
+#logo h1 a
 {
 	font-size: 2.5em;
 	color: #fff;
@@ -233,3 +233,20 @@ fieldset.edits legend
 {
 	padding-left: 3em;
 }
+
+.action_index p#welcome
+{
+	padding: 3px 3px 1px 3px;
+	border: 1px solid #000;
+	background: #eee;
+	margin: 0 1em 2em 1em;
+}
+
+.action_index ol
+{
+	list-style: decimal;
+	font-size: 200%;
+	margin-left: 2em;
+	width: 100%;
+}
+

assets/script.js

View file @ 0a3ede0

index.php

View file @ 0a3ede0

@@ -8,16 +8,28 @@
 require_once(dirname(__FILE__) . '/settings.php');
 require_once(dirname(__FILE__) . '/language/' . $language . '.php');
 
+// Default our action.
+if (!isset($_GET['action']) || !in_array($_GET['action'], array('mod', 'info')))
+	$action = 'index';
+else
+	$action = $_GET['action'];
+
 echo '
 <!DOCTYPE html><!-- HTML 5 -->
 <html dir="ltr" lang="en-US">
 <head>
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 	<title>', $page_title, '</title>
-	<link rel="stylesheet" id="', $style, '-css" href="', $assets, '/', $style, '.css" type="text/css" media="all">
+	<link rel="stylesheet" id="', $style, '-css" href="', $assets, '/', $style, '.css" type="text/css" media="all">';
+
+// We don't need these on the index.
+if ($action != 'index')
+	echo '
 	<script type="text/javascript" src="', $assets, '/jquery.min.js"></script>
 	<script type="text/javascript" src="', $assets, '/', $use_php ? 'jquery.generateFile.js' : 'jquery.base64.js', '"></script>
-	<script type="text/javascript" src="', $assets, '/script.js"></script>
+	<script type="text/javascript" src="', $assets, '/script_', $action, '.js"></script>';
+
+echo '
 	<meta name="viewport" content="width=device-width,initial-scale=1">
 </head>
 
@@ -32,12 +44,46 @@ if (!empty($logo))
 				<a href="', $logo_url, '"><img src="', $logo, '" alt="', $page_title, '" class="alignleft"></a>';
 
 echo '
-				<h1>', $text['script_name'], '</h1></div>
+				<h1><a href="index.php">', $text['script_name'], '</a></h1></div>
 		</div>
 		<div class="clear"></div>
 	</div>
 	<div id="container">
-		<div id="wrap">
+		<div id="wrap" class="action_', $action, '">';
+
+if ($action == 'mod')
+	mod_section();
+elseif ($action == 'info')
+	info_section();
+else
+	index_section();
+
+echo '
+		</div>
+	</div>
+</div>
+<div id="footer">
+	<!-- Please give credit where credit is due -->
+	<div id="foot"><span class="alignright"><a href="http://sleepycode.com">SMF Package Manager Generator by JeremyD (SleePy)</a></span></div>
+	<div class="clear"></div>
+	</div>
+</div>';
+
+if ($action == 'mod')
+	mod_templates();
+elseif ($action == 'info')
+	info_section();
+
+echo '
+</body>
+</html>';
+
+/*
+ * This is the mod section code.
+*/
+function mod_section()
+{
+	echo '
 			<fieldset id="basic_info">
 				<legend>', $text['basic_info_header'], ' <span id="collapse_basic">^</span></legend>
 				<dl class="info">
@@ -77,17 +123,15 @@ echo '
 				<legend>', $text['preview_header'], '</legend>
 				<textarea id="preview" cols="150" rows="25"></textarea>
 			</fieldset>
-				<br />
-		</div>
-	</div>
-</div>
-<div id="footer">
-	<!-- Please give credit where credit is due -->
-	<div id="foot"><span class="alignright"><a href="http://sleepycode.com">SMF Package Manager Generator by JeremyD (SleePy)</a></span></div>
-	<div class="clear"></div>
-	</div>
-</div>
+				<br />';
+}
 
+/*
+ * This is the mod templates near the end of the page
+*/
+function mod_templates()
+{
+	echo '
 <!-- This is the container for a new file -->
 <!-- Do not remove any id attribute.  This makes the magic work! -->
 <div id="file_template" style="display: none;">
@@ -172,6 +216,20 @@ echo '
 					</dl>
 				</fieldset>
 				<br />
-</div>
-</body>
-</html>';
\ No newline at end of file
+</div>';
+}
+
+/*
+ * The index section
+*/
+function index_section()
+{
+	echo '
+		<br clear="all" />
+		<p id="welcome">Welcome to the SMF Package Maker.  Below are the simple three steps to packaging your modification.</p>
+		<ol id="steps">
+			<li><a href="index.php?action=mod">Mod Maker</a></li>
+			<li><a href="index.php?action=info">Package-Info Maker</a></li>
+			<li>Compress as .zip or .tgz (.tar.gz)</li>
+		</ol>';
+}
\ No newline at end of file


...	...	@@ -86,7 +86,7 @@ input, textarea
86	86	border: 0;
87	87	padding: 5px 0;
88	88	}
89		-#logo h1
	89	+#logo h1 a
90	90	{
91	91	font-size: 2.5em;
92	92	color: #fff;
...	...	@@ -233,3 +233,20 @@ fieldset.edits legend
233	233	{
234	234	padding-left: 3em;
235	235	}
	236	+
	237	+.action_index p#welcome
	238	+{
	239	+ padding: 3px 3px 1px 3px;
	240	+ border: 1px solid #000;
	241	+ background: #eee;
	242	+ margin: 0 1em 2em 1em;
	243	+}
	244	+
	245	+.action_index ol
	246	+{
	247	+ list-style: decimal;
	248	+ font-size: 200%;
	249	+ margin-left: 2em;
	250	+ width: 100%;
	251	+}
	252	+

...	...	@@ -8,16 +8,28 @@
8	8	require_once(dirname(__FILE__) . '/settings.php');
9	9	require_once(dirname(__FILE__) . '/language/' . $language . '.php');
10	10
	11	+// Default our action.
	12	+if (!isset($_GET['action']) \|\| !in_array($_GET['action'], array('mod', 'info')))
	13	+ $action = 'index';
	14	+else
	15	+ $action = $_GET['action'];
	16	+
11	17	echo '
12	18	<!DOCTYPE html><!-- HTML 5 -->
13	19	<html dir="ltr" lang="en-US">
14	20	<head>
15	21	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
16	22	<title>', $page_title, '</title>
17		- <link rel="stylesheet" id="', $style, '-css" href="', $assets, '/', $style, '.css" type="text/css" media="all">
	23	+ <link rel="stylesheet" id="', $style, '-css" href="', $assets, '/', $style, '.css" type="text/css" media="all">';
	24	+
	25	+// We don't need these on the index.
	26	+if ($action != 'index')
	27	+ echo '
18	28	<script type="text/javascript" src="', $assets, '/jquery.min.js"></script>
19	29	<script type="text/javascript" src="', $assets, '/', $use_php ? 'jquery.generateFile.js' : 'jquery.base64.js', '"></script>
20		- <script type="text/javascript" src="', $assets, '/script.js"></script>
	30	+ <script type="text/javascript" src="', $assets, '/script_', $action, '.js"></script>';
	31	+
	32	+echo '
21	33	<meta name="viewport" content="width=device-width,initial-scale=1">
22	34	</head>
23	35
...	...	@@ -32,12 +44,46 @@ if (!empty($logo))
32	44	<a href="', $logo_url, '"><img src="', $logo, '" alt="', $page_title, '" class="alignleft"></a>';
33	45
34	46	echo '
35		- <h1>', $text['script_name'], '</h1></div>
	47	+ <h1><a href="index.php">', $text['script_name'], '</a></h1></div>
36	48	</div>
37	49	<div class="clear"></div>
38	50	</div>
39	51	<div id="container">
40		- <div id="wrap">
	52	+ <div id="wrap" class="action_', $action, '">';
	53	+
	54	+if ($action == 'mod')
	55	+ mod_section();
	56	+elseif ($action == 'info')
	57	+ info_section();
	58	+else
	59	+ index_section();
	60	+
	61	+echo '
	62	+ </div>
	63	+ </div>
	64	+</div>
	65	+<div id="footer">
	66	+ <!-- Please give credit where credit is due -->
	67	+ <div id="foot"><span class="alignright"><a href="http://sleepycode.com">SMF Package Manager Generator by JeremyD (SleePy)</a></span></div>
	68	+ <div class="clear"></div>
	69	+ </div>
	70	+</div>';
	71	+
	72	+if ($action == 'mod')
	73	+ mod_templates();
	74	+elseif ($action == 'info')
	75	+ info_section();
	76	+
	77	+echo '
	78	+</body>
	79	+</html>';
	80	+
	81	+/*
	82	+ * This is the mod section code.
	83	+*/
	84	+function mod_section()
	85	+{
	86	+ echo '
41	87	<fieldset id="basic_info">
42	88	<legend>', $text['basic_info_header'], ' <span id="collapse_basic">^</span></legend>
43	89	<dl class="info">
...	...	@@ -77,17 +123,15 @@ echo '
77	123	<legend>', $text['preview_header'], '</legend>
78	124	<textarea id="preview" cols="150" rows="25"></textarea>
79	125	</fieldset>
80		- <br />
81		- </div>
82		- </div>
83		-</div>
84		-<div id="footer">
85		- <!-- Please give credit where credit is due -->
86		- <div id="foot"><span class="alignright"><a href="http://sleepycode.com">SMF Package Manager Generator by JeremyD (SleePy)</a></span></div>
87		- <div class="clear"></div>
88		- </div>
89		-</div>
	126	+ <br />';
	127	+}
90	128
	129	+/*
	130	+ * This is the mod templates near the end of the page
	131	+*/
	132	+function mod_templates()
	133	+{
	134	+ echo '
91	135	<!-- This is the container for a new file -->
92	136	<!-- Do not remove any id attribute. This makes the magic work! -->
93	137	<div id="file_template" style="display: none;">
...	...	@@ -172,6 +216,20 @@ echo '
172	216	</dl>
173	217	</fieldset>
174	218	<br />
175		-</div>
176		-</body>
177		-</html>';
178	219	\ No newline at end of file
	220	+</div>';
	221	+}
	222	+
	223	+/*
	224	+ * The index section
	225	+*/
	226	+function index_section()
	227	+{
	228	+ echo '
	229	+ <br clear="all" />
	230	+ <p id="welcome">Welcome to the SMF Package Maker. Below are the simple three steps to packaging your modification.</p>
	231	+ <ol id="steps">
	232	+ <li><a href="index.php?action=mod">Mod Maker</a></li>
	233	+ <li><a href="index.php?action=info">Package-Info Maker</a></li>
	234	+ <li>Compress as .zip or .tgz (.tar.gz)</li>
	235	+ </ol>';
	236	+}
179	237	\ No newline at end of file
180	238