Breadbin/test.html at master · Jamie932/Breadbin · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<html>
<head>
    <link href="css/common.css" rel="stylesheet" type="text/css">
    <link href="css/navbar.css" rel="stylesheet" type="text/css">
    <link href="css/main.css" rel="stylesheet" type="text/css">
    <script src="js/vendor/jquery-1.11.2.min.js"></script>
    <script>
    $(document).ready(function(){
        $("#blackout").click(function(){
            $('#blackOverlay').fadeIn('normal');
            $('#recipeBox').fadeIn('normal');
        })
    })

    $(document).ready(function(){
        $("#cancel").click(function(){
            $('#blackOverlay').fadeOut('normal');
            $('#recipeBox').fadeOut('normal');
        })
    })

    function add_fields() {
        document.getElementById('Ingredients').innerHTML += '<input type="text" name="recipeIngredients" placeholder="Recipe Ingredient" class="recipeIngredients" required/>';
    }

         $(document).ready(function(){
    $('#postRecipeForm').submit(function(event) {


                var taskArray = new Array();

                $("input[name=recipeIngredients]").each(function() {
                   taskArray.push($(this).val());
                });

                alert(taskArray);

                    /*var formData = {
                        'title' : $('#recipeTitle').val(),
                        'ingredients' : $('#recipeIngredients').val(),
                        'instructions' : $('#recipeInstructions').val()
                    };

                    $.ajax({
                        type        : 'POST',
                        url         : 'php/postRecipe.php',
                        data        : formData,
                        dataType    : 'json',
                        encode      : true
                    })*/

        event.preventDefault();

    })
    })

    </script>
</head>
    <body>

        <div id="recipeBox" style="display: block">
            <div class="recipeContent">
                <div class="recipeHeader">
                    <h1>Post your recipe</h1>
                </div>

                <hr></hr>

                <div id="recipeForm">
                    <form action="php/postRecipe.php" method="POST" id="postRecipeForm" enctype="multipart/form-data">
                        <h3>Recipe Title</h3>
                            <center><input type="text" id="recipeTitle" name="recipeTitle" placeholder="Recipe Title" class="recipeTitle" required/></center>
                        <h3>Ingredients</h3>
                        <div id="Ingredients">
                            <input type="text" name="recipeIngredients" id="recipeIngredients" placeholder="Recipe Ingredient" class="recipeIngredients" style="margin-right: -4px;" required/>
                            <input type="text" name="recipeIngredients" id="recipeIngredients" placeholder="Recipe Ingredient" class="recipeIngredients" style="margin-right: -4px;" required/>
                            <input type="text" name="recipeIngredients" id="recipeIngredients" placeholder="Recipe Ingredient" class="recipeIngredients" style="margin-right: -4px;" />
                            <input type="text" name="recipeIngredients" id="recipeIngredients" placeholder="Recipe Ingredient" class="recipeIngredients" style="margin-right: -4px;" />
                        </div>
                            <center><input type="button" id="more_fields" onclick="add_fields();" value="New Ingredient" /></center>
                        <h3>Recipe Instructions</h3>
                            <center><textarea name="TextUpload" class="recipeInstructions" id="recipeInstructions" maxlength="150" placeholder="Recipe Instructions..."></textarea></center>
                            <center><input type="submit" value="Submit" id="submitRecipe" class="buttonstyle">
                            <input type="button" id="cancel" class="buttonstyle" value="Cancel" /></center>
                    </form>
                </div>
            </div>
        </div>

    <div id="blackOverlay"></div>


     <div id="navbar">

	<div class="left">
		<a href="main.php" class="navLinks">Bread Bin</a>

        <form class="searchForm">
            <i class="fa fa-search" style="color: rgb(100, 100, 100); "></i>
		    <input type="text" class="searchBar">
		</form>
	</div>

    <div id="loader">

    </div>

	<div class="right">
		<ul class="nav">
            <li class="nav">
                <a class="navLinks" href="discover.php">Discover</a>
            </li>
                <li class="nav">

               <a class="navLinks" href="../profile.php?id=' . $_SESSION['user']['id'] . '">Bill</a>
               <div class="arrow-up"></div>
                <ul>
                    <li><a class="navLinks" href="../settings.php">Settings</a></li>
                    <li><a class="navLinks" href="#" onClick="logout(); return false;">Logout</a></li>
                </ul>
			</li>
            <!--<li class="nav"><a class="navLinks" href="#" onClick="logout(); return false;" >Logout</a></li>-->
		</ul>
	</div>
</div>

<div id="errorBar"></div>
<br>
<br>
<br>
<br>
    <div id="blackout">
        <a href="#">blackout</a>
    </div>
</body>
</html>