By continuing you indicate that you have read and agree to our Terms of service and Privacy policy
by yshrsmz Java Version: v0.4.0 License: Apache-2.0
by yshrsmz Java Version: v0.4.0 License: Apache-2.0
Support
Quality
Security
License
Reuse
kandi has reviewed historian and discovered the below as its top functions. This is intended to give you an instant insight into historian implemented functionality, and help decide if they suit your requirements.
Get all kandi verified functions for this library.
Get all kandi verified functions for this library.
Custom Timber tree implementation that can save logs to SQLite
See all related Code Snippets
QUESTION
SQL Historian Query not returning all results
Asked 2021-Dec-13 at 12:56I am using an historian to search for certain values of a specific tag. The historian has certain rules, such as, I cannot create or drop tables, queries need tagnames etc.
I want to search a TagName 'Tank1' for example and return its DateTime and Value results, then search further Tags using these results to match those tags that have the same Values at that DateTime.
I search 'Tank1' between a given date and time and receive 4 results as below
2021-11-02 08:00:54.9870000 | 1 |
2021-11-02 10:22:27.9850000 | 1 |
2021-11-02 11:47:31.3360000 | 2 |
2021-11-02 23:11:57.8120000 | 2 |
So, I need to search four other Tags and return results that match the dateTime and value.
The below code is what I have produced (I should now tell you that I am a virtual novice)
DECLARE @AT1Value INT,
@AT1DateTime DateTime
SELECT @AT1Value = Value, --GETS THE VALUES OF AT1 STERILISER
@AT1DateTime = DateTime --GETS THE DATETIME OF AT1 STERILISER VALUES
From Runtime.dbo.v_History
Where
Runtime.dbo.v_History.Tagname = 'AT1_Select_ster'
AND Runtime.dbo.v_History.DateTime >= '2021-11-02 08:00'
AND Runtime.dbo.v_History.DateTime <= '2021-11-03 08:01'
AND Runtime.dbo.v_History.Value > 0
Select a.DateTime,
a.TagName,
a.Value
From Runtime.dbo.v_History AS a --GETS THE VALUES OF THE FM TAGS AT THE DATETIME OF AT1 STERILISER VALUES
Where
((a.TagName = 'FM_S1_Batch' AND a.Value = @AT1Value AND a.DateTime = @AT1DateTime)
OR (a.Tagname = 'FM_S2_batch' AND a.Value = @AT1Value AND a.DateTime = @AT1DateTime)
OR (a.Tagname = 'FM_S3_batch' AND a.Value = @AT1Value AND a.DateTime = @AT1DateTime)
OR (a.Tagname = 'FM_S4_batch' AND a.Value = @AT1Value AND a.DateTime = @AT1DateTime))
AND a.Value > 0
This works fine, albeit it only produces the last dateTime and Value result below,
2021-11-02 23:11:57.8120000 | FM_S2_batch 2 |
Am I right in assuming this is because the Variable is being overwritten each time and only holding the last values?
The results that should be returned should look something like the results below
2021-11-02 08:00:54.9870000 | FM_S1_batch 1 |
2021-11-02 10:22:27.9850000 | FM_S1_batch 1 |
2021-11-02 11:47:31.3360000 | FM_S2_batch 2 |
2021-11-02 23:11:57.8120000 | FM_S2_batch 2 |
Is there anyway I can do several scans and save each result until I have all the results needed? or is there an easier more suitable method (which I am guessing there is).
TIA
ANSWER
Answered 2021-Dec-10 at 16:56If I'm understanding correctly, you are hoping your int
and datetime
variables (@AT1DateTime and @AT1Value) will hold more than one value returned by the first query. That won't work (as you indicated, they will hold only one value).
From the code provided, it's not clear that you need to store those values in a variable at all. I think you are probably looking for something like:
Select a.DateTime,
a.TagName,
a.Value
From Runtime.dbo.v_History AS a
Where
a.TagName IN ('FM_S1_Batch', 'FM_S2_batch', 'FM_S3_batch', 'FM_S4_batch')
AND EXISTS
(SELECT *
From Runtime.dbo.v_History b
Where
b.Tagname = 'AT1_Select_ster'
AND b.DateTime >= '2021-11-02 08:00'
AND b.DateTime <= '2021-11-03 08:01'
AND b.Value > 0
AND b.Value = a.Value
AND b.DateTime = a.DateTime
)
AND a.Value > 0
This is your two queries combined together into one. The 2nd/middle WHERE
condition of the outer query checks that the a.value/a.datetime combination exists in the inner query.
QUESTION
react router v5 to v6 nested route not working
Asked 2021-Dec-09 at 18:01I've been trying to solve the following problem : I try to upgrade this Frontend Mentor project https://haydee75.github.io/galleria/ from React Router v5 to v6. I tried to replace the code between with :
<Routes>
<Route path="galleria" element={<Gallery datas={data} clickEvent={handleSlideShow} />} />
<Route path="/galleria/:urlPath" element={<Paint datas={data} />} />
</Routes>
but it does not work as when I am on a Paint page when clicking on next (or prev) button it adds url to the existing one so the route is wrong. I also tried :
<Routes>
<Route path="galleria" element={<Gallery datas={data} clickEvent={handleSlideShow} />}>
<Route path="/galleria/:urlPath" element={<Paint datas={data} />} />
</Route>
</Routes>
But it does not work either.
Below are relevant components :
import "./Gallery.scss";
import { Link } from "react-router-dom";
const Gallery = ({ datas, clickEvent }) => {
return (
<div className="Gallery">
{datas.map((data, index) => {
return (
<div key={index} className="thumbnail">
<Link to={"/galleria/" + data.urlPath} onClick={clickEvent}>
<img
className="image"
src={data.images.thumbnail}
alt={data.images.name}
/>
</Link>
</div>
);
})}
</div>
);
};
export default Gallery;
import { useState } from "react";
import { Link, useParams } from "react-router-dom";
import "./Paint.scss";
import Modal from "../Modal/Modal";
const Paint = ({ datas }) => {
let { urlPath } = useParams();
const paint = datas.find((data) => data.urlPath === urlPath);
const nextSlide = datas.indexOf(paint) + 1;
const prevSlide = datas.indexOf(paint) - 1;
const [showModal, setShowModal] = useState(false);
const handleModal = () => {
setShowModal(!showModal);
};
const color1 = "#000";
const color2 = "#ccc";
const indexPaint = datas.indexOf(paint) + 1;
const datasLenght = datas.length;
const blackLineWidth = Math.round((indexPaint * 100) / datasLenght);
const greyLineWidth = 100 - blackLineWidth;
return (
<div className="Paint">
{paint ? (
<>
<div className="container">
<div className="row main">
<div
className="main-image"
style={{
backgroundImage: `url("${paint.images.hero.large}")`,
}}
>
<div className="icon-view-image" onClick={handleModal}>
<span>View Image</span>
</div>
</div>
{showModal && (
<Modal
largeImage={paint.images.gallery}
altProp={paint.name}
closeModal={handleModal}
/>
)}
<div className="main-informations">
<div className="info">
<h1>{paint.name}</h1>
<p>{paint.artist.name}</p>
</div>
<div className="img-artist">
<img src={paint.artist.image} alt={paint.artist.name} />
</div>
</div>
</div>
<div className="row content">
<div className="date">
<span>{paint.year}</span>
</div>
<div className="description">
<p>{paint.description}</p>
<a
className="source"
href={paint.source}
target="_blank"
rel="noreferrer"
>
<span className="link-secondary">Got to source</span>
</a>
</div>
</div>
</div>
<div
className="progress-bar"
style={{
backgroundImage: `linear-gradient(to right, ${color1}, ${color1} ${blackLineWidth}%, ${color2} ${blackLineWidth}%, ${color2} ${greyLineWidth}%)`,
}}
></div>
<div className="footer">
<div className="column">
<h3>{paint.name}</h3>
<div className="artist-name">
<span>{paint.artist.name}</span>
</div>
</div>
<div className="column nav-links">
<span className="prev-btn">
{prevSlide <= -1 ? (
<span className="disable"></span>
) : (
<Link className="active" to={datas[prevSlide].urlPath}></Link>
)}
</span>
<span className="next-btn">
{nextSlide >= 15 ? (
<span className="disable"></span>
) : (
<Link className="active" to={datas[nextSlide].urlPath}></Link>
)}
</span>
</div>
</div>
</>
) : (
<p>{urlPath} is not a planet</p>
)}
</div>
);
};
export default Paint;
Here is App.js parent component rendering the routes
import data from "./data.json";
import "./App.scss";
import { Switch, Route } from "react-router-dom";
import Menu from "./components/Menu/Menu";
import Gallery from "./components/Gallery/Gallery";
import Paint from "./components/Paint/Paint";
import { useState } from "react";
const App = () => {
data.forEach((d) => {
d["urlPath"] = d.name.replace(/\s/g, "-");
});
const [slideShow, setSlideShow] = useState(true);
const handleSlideShow = () => {
setSlideShow(!slideShow);
};
return (
<div className="App">
<div>
<Menu datas={data} clickEvent={handleSlideShow} slideShow={slideShow} />
<Switch>
<Route exact path="/galleria">
<Gallery datas={data} clickEvent={handleSlideShow} />
</Route>
<Route path="/galleria/:urlPath">
<Paint datas={data} />
</Route>
</Switch>
</div>
</div>
);
};
export default App;
Then the data.json file from where data values are coming :
[
{
"name": "Starry Night",
"year": 1889,
"description": "Although The Starry Night was painted during the day in Van Gogh's ground-floor studio, it would be inaccurate to state that the picture was painted from memory. The view has been identified as the one from his bedroom window, facing east, a view which Van Gogh painted variations of no fewer than twenty-one times, including The Starry Night. \"Through the iron-barred window,\" he wrote to his brother, Theo, around 23 May 1889, \"I can see an enclosed square of wheat ... above which, in the morning, I watch the sun rise in all its glory.\"",
"source": "https://en.wikipedia.org/wiki/The_Starry_Night",
"artist": {
"image": "./assets/starry-night/artist.jpg",
"name": "Vincent Van Gogh"
},
"images": {
"thumbnail": "./assets/starry-night/thumbnail.jpg",
"hero": {
"small": "./assets/starry-night/hero-small.jpg",
"large": "./assets/starry-night/hero-large.jpg"
},
"gallery": "./assets/starry-night/gallery.jpg"
}
},
{
"name": "Girl with a Pearl Earring",
"year": 1665,
"description": "The painting is a tronie, the Dutch 17th-century description of a 'head' that was not meant to be a portrait. It depicts a European girl wearing an exotic dress, an oriental turban, and what was thought to be a very large pearl as an earring. In 2014, Dutch astrophysicist Vincent Icke raised doubts about the material of the earring and argued that it looks more like polished tin than pearl on the grounds of the specular reflection, the pear shape and the large size of the earring.",
"source": "https://en.wikipedia.org/wiki/Girl_with_a_Pearl_Earring",
"artist": {
"image": "./assets/girl-with-pearl-earring/artist.jpg",
"name": "Johannes Vermeer"
},
"images": {
"thumbnail": "./assets/girl-with-pearl-earring/thumbnail.jpg",
"hero": {
"small": "./assets/girl-with-pearl-earring/hero-small.jpg",
"large": "./assets/girl-with-pearl-earring/hero-large.jpg"
},
"gallery": "./assets/girl-with-pearl-earring/gallery.jpg"
}
},
{
"name": "Guernica",
"year": 1937,
"description": "The scene occurs within a room where, on the left, a wide-eyed bull stands over a grieving woman holding a dead child in her arms. In the center of the room a horse falls in agony with a large gaping hole in its side, as if it had just been run through by a spear or javelin. The horse appears to be wearing chain mail armor, decorated with vertical tally marks arranged in rows. A dead and dismembered soldier lies under the horse. The hand of his severed right arm grasps a shattered sword, from which a flower grows.",
"source": "https://en.wikipedia.org/wiki/Guernica_(Picasso)",
"artist": {
"image": "./assets/guernica/artist.jpg",
"name": "Pablo Picasso"
},
"images": {
"thumbnail": "./assets/guernica/thumbnail.jpg",
"hero": {
"small": "./assets/guernica/hero-small.jpg",
"large": "./assets/guernica/hero-large.jpg"
},
"gallery": "./assets/guernica/gallery.jpg"
}
},
{
"name": "Penitent Magdalene",
"year": 1625,
"description": "Penitent Magdalene is a painting by the Italian artist Artemisia Gentileschi. It hangs in Seville Cathedral. It has probably been in the cathedral since the late 17th century. The painting's first home was the collection of Fernando Enriquez Afan de Ribera, from 1626 to 1637. She returned to the subject later in the 1620s in Mary Magdalene as Melancholy.",
"source": "https://en.wikipedia.org/wiki/Penitent_Magdalene_(Artemisia_Gentileschi)",
"artist": {
"image": "./assets/penitent-magdalene/artist.jpg",
"name": "Artemisia Gentileschi"
},
"images": {
"thumbnail": "./assets/penitent-magdalene/thumbnail.jpg",
"hero": {
"small": "./assets/penitent-magdalene/hero-small.jpg",
"large": "./assets/penitent-magdalene/hero-large.jpg"
},
"gallery": "./assets/penitent-magdalene/gallery.jpg"
}
},
{
"name": "The Storm on the Sea of Galilee",
"year": 1633,
"description": "The painting, in vertical format, shows a close-up view of Christ's disciples struggling frantically against the heavy storm to regain control of their fishing boat. A huge wave beats the bow and rips the sail. One of the disciples is seen vomiting over the side. Another one, looking directly out at the viewer, is a self-portrait of the artist. Only Christ, depicted on the right, remains calm.",
"source": "https://en.wikipedia.org/wiki/The_Storm_on_the_Sea_of_Galilee",
"artist": {
"image": "./assets/the-storm-on-the-sea-of-galilee/artist.jpg",
"name": "Rembrandt"
},
"images": {
"thumbnail": "./assets/the-storm-on-the-sea-of-galilee/thumbnail.jpg",
"hero": {
"small": "./assets/the-storm-on-the-sea-of-galilee/hero-small.jpg",
"large": "./assets/the-storm-on-the-sea-of-galilee/hero-large.jpg"
},
"gallery": "./assets/the-storm-on-the-sea-of-galilee/gallery.jpg"
}
},
{
"name": "The Great Wave off Kanagawa",
"year": 1831,
"description": "The Great Wave off Kanagawa (Japanese: 神奈川沖浪裏, Hepburn: Kanagawa-oki Nami Ura, lit. \"Under the Wave off Kanagawa\"), also known as The Great Wave or simply The Wave, is a woodblock print by the Japanese ukiyo-e artist Hokusai. It was published sometime between 1829 and 1833 in the late Edo period as the first print in Hokusai's series Thirty-six Views of Mount Fuji. The image depicts an enormous wave threatening three boats off the coast in the Sagami Bay (Kanagawa Prefecture) while Mount Fuji rises in the background.",
"source": "https://en.wikipedia.org/wiki/The_Great_Wave_off_Kanagawa",
"artist": {
"image": "./assets/the-great-wave-off-kanagawa/artist.jpg",
"name": "Hokusai"
},
"images": {
"thumbnail": "./assets/the-great-wave-off-kanagawa/thumbnail.jpg",
"hero": {
"small": "./assets/the-great-wave-off-kanagawa/hero-small.jpg",
"large": "./assets/the-great-wave-off-kanagawa/hero-large.jpg"
},
"gallery": "./assets/the-great-wave-off-kanagawa/gallery.jpg"
}
},
{
"name": "Van Gogh Self-portrait",
"year": 1889,
"description": "This self-portrait was one of about 32 produced over a 10-year period, and these were an important part of his work as a painter; he painted himself because he often lacked the money to pay for models. He took the painting with him to Auvers-sur-Oise, near Paris, where he showed it to Dr. Paul Gachet, who thought it was \"absolutely fanatical\". Art historians are divided as to whether this painting or Self-portrait without beard is Van Gogh's final self-portrait. The art historians Ingo F. Walther and Jan Hulsker consider this to be the last.",
"source": "https://en.wikipedia.org/wiki/Van_Gogh_self-portrait_(1889)",
"artist": {
"image": "./assets/van-gogh-self-portrait/artist.jpg",
"name": "Vincent Van Gogh"
},
"images": {
"thumbnail": "./assets/van-gogh-self-portrait/thumbnail.jpg",
"hero": {
"small": "./assets/van-gogh-self-portrait/hero-small.jpg",
"large": "./assets/van-gogh-self-portrait/hero-large.jpg"
},
"gallery": "./assets/van-gogh-self-portrait/gallery.jpg"
}
},
{
"name": "The Sleeping Gypsy",
"year": 1897,
"description": "The Sleeping Gypsy (French: La Bohémienne endormie) is an 1897 oil painting by French Naïve artist Henri Rousseau (1844–1910). It is a fantastical depiction of a lion musing over a sleeping woman on a moonlit night. Rousseau first exhibited the painting at the 13th Salon des Indépendants, and tried unsuccessfully to sell it to the mayor of his hometown, Laval. Instead, it entered the private collection of a Parisian charcoal merchant where it remained until 1924, when it was discovered by the art critic Louis Vauxcelles.",
"source": "https://en.wikipedia.org/wiki/The_Sleeping_Gypsy",
"artist": {
"image": "./assets/the-sleeping-gypsy/artist.jpg",
"name": "Henri Rousseau"
},
"images": {
"thumbnail": "./assets/the-sleeping-gypsy/thumbnail.jpg",
"hero": {
"small": "./assets/the-sleeping-gypsy/hero-small.jpg",
"large": "./assets/the-sleeping-gypsy/hero-large.jpg"
},
"gallery": "./assets/the-sleeping-gypsy/gallery.jpg"
}
},
{
"name": "Lady with an Ermine",
"year": 1489,
"description": "The Lady with an Ermine (Italian: Dama con l'ermellino [ˈdaːma kon lermelˈliːno]; Polish: Dama z gronostajem) is a portrait painting widely attributed to the Italian Renaissance artist Leonardo da Vinci. Dated to c. 1489–1491, the work is painted in oils on a panel of walnut wood. Its subject is Cecilia Gallerani, a mistress of Ludovico Sforza (\"Il Moro\"), Duke of Milan; Leonardo was painter to the Sforza court at the time of its execution. It is one of only four surviving portraits of women painted by Leonardo, the others being Ginevra de' Benci, La Belle Ferronnière and the Mona Lisa",
"source": "https://en.wikipedia.org/wiki/Lady_with_an_Ermine",
"artist": {
"image": "./assets/lady-with-an-ermine/artist.jpg",
"name": "Leonardo da Vinci"
},
"images": {
"thumbnail": "./assets/lady-with-an-ermine/thumbnail.jpg",
"hero": {
"small": "./assets/lady-with-an-ermine/hero-small.jpg",
"large": "./assets/lady-with-an-ermine/hero-large.jpg"
},
"gallery": "./assets/lady-with-an-ermine/gallery.jpg"
}
},
{
"name": "The Night Café",
"year": 1888,
"description": "The Night Café (French: Le Café de nuit) is an oil painting created by Dutch artist Vincent van Gogh in September 1888 in Arles. Its title is inscribed lower right beneath the signature. The painting is owned by Yale University and is currently held at the Yale University Art Gallery in New Haven, Connecticut. The interior depicted is the Café de la Gare, 30 Place Lamartine, run by Joseph-Michel Ginoux and his wife Marie, who in November 1888 posed for Van Gogh's and Gauguin's Arlésienne; a bit later, Joseph Ginoux evidently posed for both artists, too.",
"source": "https://en.wikipedia.org/wiki/The_Night_Caf%C3%A9",
"artist": {
"image": "./assets/the-night-cafe/artist.jpg",
"name": "Vincent Van Gogh"
},
"images": {
"thumbnail": "./assets/the-night-cafe/thumbnail.jpg",
"hero": {
"small": "./assets/the-night-cafe/hero-small.jpg",
"large": "./assets/the-night-cafe/hero-large.jpg"
},
"gallery": "./assets/the-night-cafe/gallery.jpg"
}
},
{
"name": "The Basket of Apples",
"year": 1893,
"description": "The Basket of Apples (French: Le panier de pommes) is a still life oil painting by French artist Paul Cézanne, which he created c. 1893. The painting is particularly remarkable for its creative composition, which rejected realistic representation in favour of distorting objects to create multiple perspectives. This approach eventually influenced other art movements, including Fauvism and Cubism. It belongs to the Helen Birch Bartlett Memorial Collection of the Art Institute of Chicago.",
"source": "https://en.wikipedia.org/wiki/The_Basket_of_Apples",
"artist": {
"image": "./assets/the-basket-of-apples/artist.jpg",
"name": "Paul Cézanne"
},
"images": {
"thumbnail": "./assets/the-basket-of-apples/thumbnail.jpg",
"hero": {
"small": "./assets/the-basket-of-apples/hero-small.jpg",
"large": "./assets/the-basket-of-apples/hero-large.jpg"
},
"gallery": "./assets/the-basket-of-apples/gallery.jpg"
}
},
{
"name": "The Boy in the Red Vest",
"year": 1889,
"description": "Cézanne painted four oil portraits of this Italian boy in the red vest, all in different poses, which allowed him to study the relationship between the figure and space. The most famous of the four, and the one commonly referred to by this title, is the one which depicts the boy in a melancholic seated pose with his elbow on a table and his head cradled in his hand. It is currently held in Zürich, Switzerland. The other three portraits, of different poses, are in museums in the US",
"source": "https://en.wikipedia.org/wiki/The_Boy_in_the_Red_Vest",
"artist": {
"image": "./assets/the-boy-in-the-red-vest/artist.jpg",
"name": "Paul Cézanne"
},
"images": {
"thumbnail": "./assets/the-boy-in-the-red-vest/thumbnail.jpg",
"hero": {
"small": "./assets/the-boy-in-the-red-vest/hero-small.jpg",
"large": "./assets/the-boy-in-the-red-vest/hero-large.jpg"
},
"gallery": "./assets/the-boy-in-the-red-vest/gallery.jpg"
}
},
{
"name": "Arnolfini Portrait",
"year": 1434,
"description": "It is considered one of the most original and complex paintings in Western art, because of its beauty, complex iconography, geometric orthogonal perspective, and expansion of the picture space with the use of a mirror. According to Ernst Gombrich \"in its own way it was as new and revolutionary as Donatello's or Masaccio's work in Italy. A simple corner of the real world had suddenly been fixed on to a panel as if by magic ... For the first time in history the artist became the perfect eye-witness in the truest sense of the term\".",
"source": "https://en.wikipedia.org/wiki/Arnolfini_Portrait",
"artist": {
"image": "./assets/arnolfini-portrait/artist.jpg",
"name": "Jan van Eyck"
},
"images": {
"thumbnail": "./assets/arnolfini-portrait/thumbnail.jpg",
"hero": {
"small": "./assets/arnolfini-portrait/hero-small.jpg",
"large": "./assets/arnolfini-portrait/hero-large.jpg"
},
"gallery": "./assets/arnolfini-portrait/gallery.jpg"
}
},
{
"name": "Mona Lisa",
"year": 1503,
"description": "The Mona Lisa (/ˌmoʊnə ˈliːsə/; italian: La Gioconda [la dʒoˈkonda] or Monna Lisa [ˈmɔnna ˈliːza]) is a half-length portrait painting by Italian artist Leonardo da Vinci. Considered an archetypal masterpiece of the Italian Renaissance, it has been described as \"the best known, the most visited, the most written about, the most sung about, the most parodied work of art in the world\". The painting's novel qualities include the subject's enigmatic expression, the monumentality of the composition, the subtle modelling of forms, and the atmospheric illusionism.",
"source": "https://en.wikipedia.org/wiki/Mona_Lisa",
"artist": {
"image": "./assets/mona-lisa/artist.jpg",
"name": "Leonardo da Vinci"
},
"images": {
"thumbnail": "./assets/mona-lisa/thumbnail.jpg",
"hero": {
"small": "./assets/mona-lisa/hero-small.jpg",
"large": "./assets/mona-lisa/hero-large.jpg"
},
"gallery": "./assets/mona-lisa/gallery.jpg"
}
},
{
"name": "The Swing",
"year": 1767,
"description": "The painting depicts an elegant young woman on a swing. A smiling young man, hiding in the bushes on the left, watches her from a vantage point that allows him to see up into her billowing dress, where his arm is pointed with hat in hand. A smiling older man, who is nearly hidden in the shadows on the right, propels the swing with a pair of ropes. The older man appears to be unaware of the young man. As the young lady swings high, she throws her left leg up, allowing her dainty shoe to fly through the air.",
"source": "https://en.wikipedia.org/wiki/The_Swing_(Fragonard)",
"artist": {
"image": "./assets/the-swing/artist.jpg",
"name": "Jean-Honoré Fragonard"
},
"images": {
"thumbnail": "./assets/the-swing/thumbnail.jpg",
"hero": {
"small": "./assets/the-swing/hero-small.jpg",
"large": "./assets/the-swing/hero-large.jpg"
},
"gallery": "./assets/the-swing/gallery.jpg"
}
}
]
ANSWER
Answered 2021-Dec-09 at 18:01If I'm understanding your question/issue correctly, you want to render the Gallery
and Paint
components each on their own routes independently, and fix the slideshow linking from painting to painting. For this use the first routing snippet so they are independent routes and not nested.
<Routes>
<Route
path="galleria"
element={<Gallery datas={data} clickEvent={handleSlideShow} />}
/>
<Route path="/galleria/:urlPath" element={<Paint datas={data} />} />
</Routes>
Next, the reason the next painting's urlPath
is being appended as /galleria/Girl-with-a-Pearl-Earring/The-Great-Wave-off-Kanagawa
is because react-router-dom
v6 is capable of using absolute and relative paths. The difference between them is a leading "/"
character. Paths starting with "/"
are absolute paths, and without are relative.
Within Paint
the next/previous buttons/links are specifying only the next/previous data[index].uriPath
value instead of including the "/galleria"
absolute path prefix.
<div className="column nav-links">
<span className="prev-btn">
{prevSlide <= -1 ? (
<span className="disable"></span>
) : (
<Link className="active" to={datas[prevSlide].urlPath}></Link>
)}
</span>
<span className="next-btn">
{nextSlide >= 15 ? (
<span className="disable"></span>
) : (
<Link className="active" to={datas[nextSlide].urlPath}></Link>
)}
</span>
</div>
Here datas[prevSlide].urlPath
is a string value of the data element name, i.e. "Girl-with-a-Pearl-Earring"
, there is no leading "/"
so the link is treated as a relative link.
There are a couple ways to resolve:
Fix the relative linking, make the new path relative from the parent "directory":
A relative
<Link to>
value (that does not begin with/
) resolves relative to the parent route, which means that it builds upon the URL path that was matched by the route that rendered that<Link>
. It may contain..
to link to routes further up the hierarchy. In these cases,..
works exactly like the command-line cd function; each..
removes one segment of the parent path.
<Link
className="active"
to={`../${datas[prevSlide].urlPath}`}
>
</Link>
...
<Link
className="active"
to={`../${datas[nextSlide].urlPath}`}
>
</Link>
Use an absolute path:
<Link
className="active"
to={`/galleria/${datas[prevSlide].urlPath}`}
>
</Link>
...
<Link
className="active"
to={`/galleria/${datas[nextSlide].urlPath}`}
>
</Link>
QUESTION
Python Script to pass input in loop to URL one by one
Asked 2021-Jun-18 at 15:40The python output will be like below with Tags_Value
comma separated and I need to pass the value to another URL one by one.
URL has to be execute with the value in loop. I am new to python, unable to create loop.
input to passed to the URL
['ates test', 'TC-MSLBSecond', 'B8.L2s6_McIP.PER', 'BRamp', 'BRlation00001', 'BR.on0.0002', 'BR00003', 'BRtion00004', 'BR00005', 'Bation00006']
I want to pass above value to URL one by one in the Tags_Value
.
Input_URL =['https://servername:843/htorian-rest-api/v1/tags/properties/{Tags_Value}'.format(Tags_Value=Tags_Value)]
for Tags in Tags_Value:
Input_URL =['https://:8443/historian-rest-api/v1/tags/properties/{Tags}'.format(Tags=Tags)]
def return_json(url):
Tags_Props = requests.get(url)
json_obj = Tags_Props.json()
return json.dumps(json_obj)
for url in Input_URL:
print return_json(url)
ANSWER
Answered 2021-Jun-18 at 15:40You want to loop over the tags list and add those to the url (not the url as a list). You can use an f-string to insert the current tag:
import requests, json
def return_json(url):
Tags_Props = requests.get(url)
json_obj = Tags_Props.json()
return json.dumps(json_obj)
tags = ['ates test', 'TC-MSLBSecond', 'B8.L2s6_McIP.PER', 'BRamp', 'BRlation00001', 'BR.on0.0002', 'BR00003', 'BRtion00004', 'BR00005', 'Bation00006']['ates test', 'TC-MSLBSecond', 'B8.L2s6_McIP.PER', 'BRamp', 'BRlation00001', 'BR.on0.0002', 'BR00003', 'BRtion00004', 'BR00005', 'Bation00006']
for tag in tags:
print(return_json(f'https://servername:843/htorian-rest-api/v1/tags/properties/{tag}'))
QUESTION
Can I Paste on Multiple Lines?
Asked 2021-Jun-09 at 20:23I need to assign 275 variables with the Double type. Is there a way I can paste word Double on all 275 lines at once? I have been pasting Double on each line and its tiring.(I also have to add the underscores to replace spaces in the variable identifiers. If anyone knows a shortcut for that let me know.)
//Multicolor cards.
Double Aether_Helix
Double Beledros_Witherbloom
Double Biomathematician
165 Blade Historian
166 Blood Researcher
167 Blot Out the Sky
168 Body of Research
169 Closing Statement
170 Cram Session
171 Creative Outburst
172 Culling Ritual
173 Culmination of Studies
174 Daemogoth_Titan
175 Daemogoth_Woe-Eater
176 Deadly_Brew
177 Decisive_Denial
178 Dina,_Soul_Steeper
179 Double_Major
180 Dramatic_Finale
181 Elemental_Expressionist
182 Elemental_Masterpiece
183 Elemental_Summoning
184 Eureka_Moment
185 Exhilarating_Elocution
186 Expressive_Iteration
187 Fractal_Summoning
188 Fracture
189 Galazeth_Prismari
190 Golden_Ratio
ANSWER
Answered 2021-Jun-09 at 20:23You could use a tool like Notepad++ to make the changes you need.
I was able to convert the list you supplied by using "CTRL+H" to open the replace dialog, using regular expression mode, and replacing "\d+" with "Double":
Double Blade Historian
Double Blood Researcher
Double Blot Out the Sky
Double Body of Research
Double Closing Statement
Double Cram Session
Double Creative Outburst
Double Culling Ritual
Double Culmination of Studies
Double Daemogoth_Titan
Double Daemogoth_Woe-Eater
Double Deadly_Brew
Double Decisive_Denial
Double Dina,_Soul_Steeper
Double Double_Major
Double Dramatic_Finale
Double Elemental_Expressionist
Double Elemental_Masterpiece
Double Elemental_Summoning
Double Eureka_Moment
Double Exhilarating_Elocution
Double Expressive_Iteration
Double Fractal_Summoning
Double Fracture
Double Galazeth_Prismari
Double Golden_Ratio
QUESTION
Discord.py: How do I write discord bot in OOP without using Cogs? I have an error while I tried it
Asked 2021-May-29 at 09:43I have been working on discord bot for a pretty long time and now I decided that it is time that I start using the Bot with OOP as I am getting into it. I have given it a simple try and tried to run it but it was showing some error which I didn't understand.
When I use the following code:
import discord
from discord.ext import commands
class JervisI(commands.Bot):
def __init__(self, command_prefix, case_insensitive, botintents):
self.command_prefix = command_prefix
self.case_insensitive = case_insensitive
self.botintents = botintents
J1 = JervisI(command_prefix="!", case_insensitive=True, botintents=discord.Intents.all())
J1.run("---HIDDEN TOKEN---")
When I run the code I get this error:
Traceback (most recent call last):
File "c:\Users\Bhavyadeep\Desktop\Discord Bot (Python)\PHub-Bot-1\jervis-1.py", line 12, in <module>
J1.run("---HIDDEN TOKEN---")
File "c:\Users\Bhavyadeep\Desktop\Discord Bot (Python)\PHub-Bot-1\The-Naval-Historian\lib\site-packages\discord\client.py", line 692, in run
loop = self.loop
AttributeError: 'JervisI' object has no attribute 'loop'
I have no idea on how to do it. Please do let me know where the error is.
Thank You! :D
ANSWER
Answered 2021-May-29 at 09:43You're overwriting the __init__
method of commands.Bot
, if you take a look at the source code you can see that it's pretty long and important, you're gonna get a ton of AttributeError
s if you don't call the "original" __init__
method:
class JervisI(commands.Bot):
def __init__(self, command_prefix, case_insensitive, botintents):
super().__init__( # Same arguments that you pass to `commands.Bot(...)`
command_prefix=command_prefix,
case_insensitive=case_insensitive,
intents=botintents
)
self.command_prefix = command_prefix # You don't need to create this, it already exists
self.case_insensitive = case_insensitive
self.botintents = botintents
QUESTION
SQL query for evaluating boolean logic from innerjoin on itself
Asked 2021-Apr-17 at 22:51Trying to determine a PASS/FAIL result from dataset where the expected number of FLAG values in a column is predetermined, and another column of the same rows match specific text.
If the number of values found in the Descript column equals the predetermined number AND the PValue of each of those rows match the text 'PASS' then the result is text 'PASS'.
If the number of values found does not equal the predetermined number, the result is text 'FAIL' regardless of the PValue content.
If number of values found equal the predetermined number but one or more of the PValue entries does not equal 'PASS' then the result text is 'FAIL'.
Example input data with expected number of FLAG rows = 3:
Descript | PValue | uniqueID |
---|---|---|
Last | year | 1 |
FLAG | PASS | 2 |
Master | product | 3 |
FLAG | PASS | 4 |
FLb | PASS | 5 |
Prime | Minister | 6 |
Laurie | Quiz | 7 |
FLAG | PASS | 8 |
Hugh | Who | 9 |
expected result of above data:
count |
---|
PASS |
else the output:
count |
---|
FAIL |
This is my query so far:
DECLARE @ExpectedNumFlags AS INT = 3
select count(*) as 'count'
FROM
(
SELECT [Descript]
,[PValue]
,[uniqueID]
FROM [MyBookLibraryDB].[dbo].[Historian]
WHERE [Descript] = 'FLAG'
) AS t
INNER JOIN
(
select count(*) as 'count'
FROM
(
SELECT [Descript]
,[PValue]
,[uniqueID]
FROM [MyBookLibraryDB].[dbo].[Historian]
WHERE [Descript] = 'FLAG'
) AS z
WHERE [PValue] = 'PASS'
) AS q
on q.count = @ExpectedNumFlags -- this doesn't make sense
The last ON clause was just me flailing around trying to noodle this... and realizing I need help.
Please advise. Thanks (after painstakingly formatting the data per SO table guidance, the preview shows nice tables, then the post looks like garbage!)
ANSWER
Answered 2021-Apr-17 at 22:51If the number of values found in the Descript column equals the predetermined number AND the PValue of each of those rows match the text 'PASS' then the result is text 'PASS'.
If I understand correctly, you only care about FLAG
rows. And you want to know if all flag rows are 'PASS'
and have the expected number. If so, this is conditional logic on aggregate amounts:
select (case when sum(case when pvalue = 'PASS' then 1 else 0 end) = count(*) and
count(*) = <predetermined number>
then 'PASS' else 'FAIL'
end)
from [MyBookLibraryDB].[dbo].[Historian]
where desript = 'FLAG'
QUESTION
Dynamic SQL query from different Historian tables
Asked 2021-Mar-25 at 13:51I have a historian system in SQL Server which saves certain tag values in a table.
Each month, the system creates a table (partition table) for this historical data as per the below tables.
For example, this table for the month of Feb2021 ([ sqlt_data_1_2021_02 ]
):
There’s another table that owns the partition table's name along with the start and end date for each historical table:
I need to get the data for the historized values in [sqlt_data_x_x_x] based on the start/end date. For example: start Date: 10th of Dec 2020 EndDate : 10th of Feb2021
.
This means the query should first look in the required partition table which, in this case. is [ sqlt_data_1_2021_02], [ sqlt_data_1_2021_01], [ sqlt_data_1_2020_12]
.
Then query will retrieve the date from these three tables and UNION ALL
for the results.
How can I do this dynamically, since the start & end dates are variable?
I added more clarification about the requirement
--First Query
select id from sqlth_te where tagpath like '%tagName%' --tagname is Param for SP
--Result will be ID=153
Second Query end_time and Start_time as parm in SP
SELECT pname from sqlth_partitions where end_time >=1611489115070 and sqlth_partitions.start_time <= 1612127027358
--result [sqlt_data_1_2021_01] ,[sqlt_data_1_2021_02]
The third Query, use the result of above query which gave table names to
select floatvalue,t_stamp from sqlt_data_1_2021_01 where tagid='153' and t_stamp >=1611489115070--StartDate
union all
select floatvalue,t_stamp from sqlt_data_1_2021_02 where tagid='153'and t_stamp<=1612127027358--EndDate
Sp required Parameters should be [EXEC SPname 'tagname',end_time,Start_time
]
ANSWER
Answered 2021-Feb-18 at 11:12One option would be to create a dynamic query that picks up all the tables. But it can be error-prone and difficult to debug.
Instead, I think your best bet here is to use dynamic SQL to create a view that contains all the necessary tables aggregated together. We can use a SQL Server Agent job to periodically maintain the view, with this code:
DECLARE @sql nvarchar(max) =
N'CREATE OR ALTER VIEW all_history AS
' +
(SELECT STRING_AGG(
N'SELECT ' +
QUOTENAME(p.name, '''') + N' AS name, ' +
p.start_time + N' AS start_time, ' +
p.end_time + N' AS end_time, * FROM ' +
QUOTENAME(p.name)
, CAST(N'
UNION ALL
' AS nvarchar(max))
FROM sqlth_partitions p
);
-- PRINT @sql;
EXEC (@sql);
Now you will have a view that contains all the data together, and you can query it as normal.
If you are using a version of SQL Server that does not have STRING_AGG
, you will need the FOR XML PATH
method.
I will give you the solution to that also, and we can also show how to do this as a stored procedure instead of a view:
DECLARE @sql nvarchar(max) =
STUFF(
(SELECT
CAST(NCHAR(10) AS nvarchar(max)) +
N'UNION ALL' +
NCHAR(10) +
N'SELECT ' +
QUOTENAME(p.name, '''') + N' AS name, ' +
p.start_time + N' AS start_time, ' +
p.end_time + N' AS end_time, * FROM ' +
QUOTENAME(p.name)
FROM sqlth_partitions p
FOR XML PATH(''), TYPE
).value('text()[1]', 'nvarchar(max)'),
1, 11, N'');
-- PRINT @sql;
EXEC (@sql);
As you can see, creating a full query from this is very complex and difficult.
QUESTION
What does the Riddler service do in the Fluid Framework reference service?
Asked 2021-Mar-07 at 12:20The Riddler service does not have explicit documentation at the package level and is not addressed in the Routerlicious service.
There is some code level documentation
Riddler manages the tenants and then gives them to server for Alfred and Historian.
How should I be thinking about Riddler? Especially in relation to Alfred and Historian.
ANSWER
Answered 2021-Mar-07 at 12:20Riddler manages Tenants. In Routerlicious a tenant is a secret key & unique identifier pair. A tenant is usually a company or user group. The secret key is used to sign JWT tokens and the unique identifier identifies the tenant.
For example, during a hackathon we would give each hackathon team a different tenant. If we had a production service, we would give each company a different tenant.
Riddler lets you create and manage these tenants in Routerlicious.
In contrast, Historian and Alfred consume this tenant information. Historian and Alfred are not responsible for creating new tenants (new secret key, unique identifier pairs).
QUESTION
why am I getting props unique keys error with undefined variable?
Asked 2021-Feb-20 at 02:39I am trying to figure out why I am getting props unique keys error when _id
is unique, and when I tried to debug items[key]._id
twice, and undefined why? am I missing something here?
const arr = [
{
"demo": [
{
"_id": "xx122",
"name": "Historian",
"tags": [
"demo"
],
"things": [],
"list": [],
"queries": [],
"notes": []
}
],
"demo_2": [
{
"_id": "xx123",
"name": "Demo",
"tags": [
"demo_2"
],
"things": [],
"list": [],
"queries": [],
"notes": []
}
],
}
]
const modArray = Object.keys(arr[0]).map(i => {
return {id: i, ...arr[0][i]}
});
export default function Demo() {
return (
<div>
<table className="table">
<thead>
<tr>
{modArray.map((i) => (
<th key={i.id}>{i.id}</th>
))}
</tr>
</thead>
<tbody>
<tr>
{modArray.map((items) => {
return Object.keys(items).map((key) => {
console.log(items[key]._id);
return <td key={items[key]._id}>{items[key]._id}</td>;
});
})}
</tr>
</tbody>
</table>
</div>
);
}
ANSWER
Answered 2021-Feb-20 at 02:24There's a mistake in creating modArray. arr[0][i]
is array
type so when you use spread operator inside {}
, it will be stored something like {0: {}}
. I've simplified your code.
const arr = [
{
demo: [
{
_id: 'xx122',
name: 'Historian',
tags: ['demo'],
things: [],
list: [],
queries: [],
notes: []
}
],
demo_2: [
{
_id: 'xx123',
name: 'Demo',
tags: ['demo_2'],
things: [],
list: [],
queries: [],
notes: []
}
]
}
];
const keys = Object.keys(arr[0]);
export default function Demo() {
return (
<div>
<table className="table">
<thead>
<tr>
{keys.map(i => (
<th key={i}>{i}</th>
))}
</tr>
</thead>
<tbody>
<tr>
{keys.map(key =>
arr[0][key].map(item => <td key={item._id}>{item._id}</td>)
)}
</tr>
</tbody>
</table>
</div>
);
}
QUESTION
Filtering knockout observable array based on string
Asked 2020-Dec-12 at 01:27I'm currently trying to solve a little problem.
I have the following code. I try to filter and re-render the fetched movielist based on the chosen genre.
So far i am able to cast the selected option to an object in my js-script but i don't know where to go from here. The genre values in my observable array is an array of its own since one movie can have multiple genres.
Here's my script so far:
define(['knockout', 'dataservice'], (ko, dataservice) => {
return function () {
let movies = ko.observableArray([]);
let movieList = ko.observableArray([])
let genres = ko.observableArray([]);
let pageSizes = ko.observableArray();
let prev = ko.observableArray();
let next = ko.observableArray();
let selectedPage = ko.observableArray([10]);
self.selectedGenre = ko.observable();
let objGenre = ko.observable();
let movieGenres = ko.observable();
self.selectedGenre.subscribe(() => {
objGenre = selectedGenre().name;
console.log(objGenre)
});
console.log(chosenGenre)
self.getMovies = function () {
ko.mapping.fromJS(data.movies, {}, self.movies)
}
let getMovies = url => {
dataservice.getMovies(url, data => {
pageSizes(data.pageSizes);
prev(data.prev || undefined);
next(data.next || undefined);
movieList(data.movieList);
movieGenres(movieList.genre)
});
}
let getGenres = function () {
fetch('http://localhost:5001/api/genre')
.then(function (response) {
return response.json();
})
.then(function (data) {
genres(data);
console.log(genres());
})
};
// INDSÆT GAMMEL FETCH
let showPrev = movie => {
console.log(prev());
getMovies(prev());
}
let enablePrev = ko.computed(() => prev() !== undefined);
let showNext = product => {
console.log(next());
getMovies(next());
}
let enableNext = ko.computed(() => next() !== undefined);
selectedPage.subscribe(() => {
var size = selectedPage()[0];
getMovies(dataservice.getMoviesUrlWithPageSize(size));
});
document.getElementById("scrolltotop").addEventListener("click", function () {
console.log("Clicked!");
$('html,body').animate({scrollTop: $('#scrolltothisdiv').offset().top}, 1000);
});
document.getElementById("prevscrolltotop").addEventListener("click", function () {
console.log("Clicked!");
$('html,body').animate({scrollTop: $('#scrolltothisdiv').offset().top}, 1000);
});
getMovies();
getGenres();
self.optionsAfterRender = function (option, view) {
if (view.defaultView) {
option.className = 'defaultViewHighlight';
}
};
return {
pageSizes,
selectedPage,
movies,
movieList,
showPrev,
enablePrev,
showNext,
enableNext,
genres,
optionsAfterRender,
selectedGenre
};
}
});
Dataservice script bound with require js and the fetched data in postman + html
<section class="after-head d-flex section-text-white position-relative">
<div class="top-block top-inner container">
<div class="top-block-content">
<h1 class="section-title">Movies</h1>
<div class="page-breadcrumbs">
<a class="content-link" href="#">Home</a>
<span class="text-theme mx-2"><i class="fas fa-chevron-right"></i></span>
<span>Movies</span>
</div>
</div>
</div>
</section>
<a id="topOfPage"></a>
<a id="top"></a>
<section class="section-long"> <!-- GENRES CONFIG HERE-->
<div class="container">
<div class="section-pannel">
<div class="grid row">
<div class="col-md-10">
<form autocomplete="off">
<div class="row form-grid">
<div class="col-sm-6 col-lg-3">
<div id="scrolltothisdiv"></div>
<div class="input-view-flat input-group">
<select class="form-control" data-bind=
"options: genres,
optionsText: 'name',
value: selectedGenre
">
</select>
</div>
</div>
<div class="col-sm-6 col-lg-3"> <!-- START YEAR AND END YEAR HERE -->
<div class="input-view-flat date input-group" data-toggle="datetimepicker"
data-target="#release-year-field">
<input class="datetimepicker-input form-control" id="release-year-field"
name="releaseYear" type="text" placeholder="release year"
data-target="#release-year-field" data-date-format="Y"/>
<div class="input-group-append">
<span class="input-group-text"><i class="fas fa-calendar-alt"></i></span>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- WRAP DEN HER IN I KNOCKOUT ARRAY -->
<table>
<tbody> <!-- FOR HVER FETCHED -->
<tr>
<td data-bind="foreach: movieList">
<article class="movie-line-entity"> <!-- HVER ARTICLE I TABLE HER CONFIG-->
<div class="entity-poster" data-role="hover-wrap"> <!-- HOVER OVER BILLEDER -->
<div class="embed-responsive embed-responsive-poster">
<img class="embed-responsive-item" data-bind="attr:{src: poster}" alt=""/>
<!-- BILLEDE SRC HER -->
</div>
<div class="d-over bg-theme-lighted collapse animated faster"
data-show-class="fadeIn show" data-hide-class="fadeOut show">
<div class="entity-play"> <!-- NEDENSTÅENDE ER LOGO -->
<svg width="1em" height="1em" viewBox="0 0 16 16"
class="bi bi-box-arrow-up-right" fill="currentColor"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z"/>
<path fill-rule="evenodd"
d="M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z"/>
</svg>
</div>
</div>
</div>
<div class="entity-content">
<h4 class="entity-title">
<a class="content-link" href="movie-info-sidebar-right.html"><span
data-bind="text: title_name"></span></a>
</h4>
<div data-bind="foreach: genre">
<div class="entity-category">
<a class="content-link" href="movies-blocks.html"><span
data-bind="text: $data"></span></a>,
</div>
</div>
<div class="entity-info">
<div class="info-lines"> <!-- RATING -->
<div class="info info-short">
<span class="text-theme info-icon"><i class="fas fa-star"></i></span>
<span class="info-text"><span data-bind="text: rating"></span></span>
<span class="info-rest">/10</span>
</div>
<div class="info info-short"> <!-- RUNTIME -->
<span class="text-theme info-icon"><i class="fas fa-clock"></i></span>
<span class="info-text"><span data-bind="text: runtime"></span></span>
<span class="info-rest"> <span>min</span></span>
</div>
</div>
</div>
<p class="text-short entity-text">
<span data-bind="text: plot"></span>
</p>
</div>
</article>
</td>
</tr>
</tbody>
</table>
<div class="section-bottom"> <!-- PAGING CONFIG HER -->
<div class="paginator">
<div class="navigation-buttons">
<button id="prevscrolltotop" onclick="scrolltotop" type="button" class="btn btn-inverse btn-warning" data-bind="click: showPrev, enable: enablePrev" href="#"> Prev</button>
<button id="scrolltotop" onclick="scrolltotop" type="button" class="btn btn-warning btn-rounded" data-bind="click: showNext, enable: enableNext" href="#">Next</button>
</div>
</div>
</div>
</div>
</section>
GET postman
{
"pageSizes": [
5,
10,
15,
20
],
"count": 55076,
"pages": 2754,
"prev": null,
"next": "http://localhost:5001/api/title?page=1&pageSize=20",
"movieList": [
{
"title_id": "tt0052520",
"title_name": "The Twilight Zone",
"poster": "https://m.media-amazon.com/images/M/MV5BNTAzMDI5MzgtMGNkMC00MzllLWJhNjctNjA1NmViNGUxMzYxXkEyXkFqcGdeQXVyMTQxNzMzNDI@._V1_SX300.jpg",
"plot": "Ordinary people find themselves in extraordinarily astounding situations, which they each try to solve in a remarkable manner.",
"runtime": "51",
"genre": [
"Fantasy",
"Horror",
"Drama"
],
"votes": "68643",
"rating": "9.0",
"type": "tvSeries",
"url": "http://localhost:5001/api/title/tt0052520"
},
{
"title_id": "tt0063929",
"title_name": "Monty Python's Flying Circus",
"poster": "https://m.media-amazon.com/images/M/MV5BMWY2ZGI0OGUtZDc3YS00ZmVjLWJiNWQtZDdmNzFmM2UzYWFhXkEyXkFqcGdeQXVyNTA4NzY1MzY@._V1_SX300.jpg",
"plot": "The irreverent Monty Python comedy troupe present a series of skits which are often surreal, bawdy, uncompromising and/or tasteless, but nearly always hilarious.",
"runtime": "30",
"genre": [
"Comedy"
],
"votes": "65618",
"rating": "8.8",
"type": "tvSeries",
"url": "http://localhost:5001/api/title/tt0063929"
},
{
"title_id": "tt0078672",
"title_name": "Pride and Prejudice",
"poster": "https://m.media-amazon.com/images/M/MV5BMjA5MTg2OTYyN15BMl5BanBnXkFtZTcwMzAwODUyMQ@@._V1_SX300.jpg",
"plot": "Mrs. Bennet is determined to find husbands for her five daughters. The arrival of a new wealthy neighbor seems like the answer to her predicament. But while eldest daughter Jane catches Mr. Bingley''s eye, middle child Mary has her nose stuck in a book, and youngest girls, Kitty and Lydia, chase after officers in uniform; Elizabeth, the willful, intelligent, and opinionated second daughter, is snubbed by haughty gentleman Mr. Darcy... In this class-minded society, can love triumph over pride and prejudice?",
"runtime": "265",
"genre": [
"Romance",
"Comedy",
"Drama"
],
"votes": "2128",
"rating": "7.3",
"type": "tvMiniSeries",
"url": "http://localhost:5001/api/title/tt0078672"
},
{
"title_id": "tt0088634",
"title_name": "The Twilight Zone",
"poster": "https://m.media-amazon.com/images/M/MV5BOTc4YjU0ZDktNzE2Ny00MDdmLWIwZDQtMzU2NzhmODA4YmMwXkEyXkFqcGdeQXVyNjExODE1MDc@._V1_SX300.jpg",
"plot": "An updated version of the famous 1960''s TV series created by Rod Serling. Each week presents one to three tales about some unusual situation that turns out to be even more unusual than initially suspected. Whether the tone of the story is horror, suspense or humor, there is always a surprise twist at the end.",
"runtime": "45",
"genre": [
"Fantasy",
"Horror",
"Drama"
],
"votes": "9822",
"rating": "7.8",
"type": "tvSeries",
"url": "http://localhost:5001/api/title/tt0088634"
},
{
"title_id": "tt0098286",
"title_name": "Good News, Bad News",
"poster": "N/A",
"plot": "In this episode, the predecessor to Seinfeld (1989), Jerry is expecting a woman that he met in Michigan to come and visit him in New York. Throughout the first part of the show Jerry and George are discussing the situation. Later we meet \"Kessler\" who comes in to Jerry''s apartment to borrow some meat and uncharacteristically knocks on the door before entering.",
"runtime": "23",
"genre": [
"Comedy"
],
"votes": "3501",
"rating": "7.6",
"type": "tvEpisode",
"url": "http://localhost:5001/api/title/tt0098286"
},
{
"title_id": "tt0098769",
"title_name": "The Civil War",
"poster": "https://m.media-amazon.com/images/M/MV5BZDc1NzI2MGEtZDA2Yy00ZWExLTgwYmItNjU3N2QyYmM0MzYwXkEyXkFqcGdeQXVyNTA4NzY1MzY@._V1_SX300.jpg",
"plot": "This highly acclaimed mini series traces the course of the U.S. Civil War from the abolitionist movement through all the major battles to the death of President Lincoln and the beginnings of Reconstruction. The story is mostly told in the words of the participants themselves, through their diaries, letters, and Visuals are usually still photographs and illustrations of the time, and the soundtrack is likewise made up of war-era tunes played on period instruments. Several modern-day historians offer periodic comment and insight on the war''s causes and events.",
"runtime": "680",
"genre": [
"History",
"War",
"Documentary"
],
"votes": "13075",
"rating": "9.0",
"type": "tvMiniSeries",
"url": "http://localhost:5001/api/title/tt0098769"
}
Dataservice
define([], () => {
const movieApiUrl = "api/title";
const genreApiUrl = "api/genre";
let getJson = (url, callback) => {
fetch(url).then(response => response.json()).then(callback);
};
let getMovies = (url, callback) => {
if (url === undefined) {
url = movieApiUrl;
}
getJson(url, callback);
};
let getGenres = (url, callback) => {
if(url === undefined) {
url = genreApiUrl;
}
getJson(url, callback)
};
let getMoviesUrlWithPageSize = size => movieApiUrl + "?pageSize=" + size;
return {
getMovies,
getMovie: getJson,
getMoviesUrlWithPageSize,
getGenres
};
I want to achieve something like this but from a drop down which i have in my select tag:
ANSWER
Answered 2020-Dec-12 at 01:27You could add a computed observable filteredMoviesList
which would go through each of the filters you describe and filter for the selected genre. Then in your html you would just bind your foreach binding to that instead of moviesList
. Here is a simple example:
JS
let filteredMovieList = ko.computed(() => {
let tempList = ko.toJS(movieList);
if (this.selectedGenre()) {
tempList = tempList.filter(movie => movie.genre == this.selectedGenre().name);
}
return tempList;
});
HTML
<div data-bind="foreach: filteredMovieList">
<span data-bind="text: title + genre"></span>
</div>
You will have to edit it to match your use case but similar solutions have worked for me in the past. Good luck!
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
No vulnerabilities reported
Find more information at:
Save this library and start creating your kit
HTTPS
https://github.com/yshrsmz/historian.git
CLI
gh repo clone yshrsmz/historian
SSH
git@github.com:yshrsmz/historian.git
Share this Page
See Similar Libraries in
by redis
by pingcap
by rethinkdb
by cockroachdb
by ClickHouse
See all Database Libraries
by yshrsmz Kotlin
by yshrsmz Kotlin
by yshrsmz Java
by yshrsmz Kotlin
by yshrsmz Kotlin
See all Libraries by this author
by pingcap
by redis
by ClickHouse
by liquibase
by facebook
See all Database Libraries
by dadoonet
by GoogleCloudPlatform
by Sheep-y
by sv3ndk
by candlepin
See all Database Libraries
by dadoonet
by davenkin
by GoogleCloudPlatform
by Sheep-y
by sv3ndk
See all Database Libraries
by j256
by GoogleCloudPlatform
by SimonMarquis
by sirixdb
by objectify
See all Database Libraries
by Ashok-Varma
by r2dbc
by LiveRamp
by noties
by yshrsmz
See all Database Libraries
Save this library and start creating your kit
Open Weaver – Develop Applications Faster with Open Source